From 8e2a96e3bbbd400f3489ed80bacb999fd4257a13 Mon Sep 17 00:00:00 2001 From: Xavier Saliniere Date: Thu, 7 May 2026 20:48:03 -0400 Subject: [PATCH 1/3] chore: remove unnecessary TooltipPortal export --- packages/lsd/src/components/ui/tooltip/index.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/lsd/src/components/ui/tooltip/index.ts b/packages/lsd/src/components/ui/tooltip/index.ts index a94171a5..276f1197 100644 --- a/packages/lsd/src/components/ui/tooltip/index.ts +++ b/packages/lsd/src/components/ui/tooltip/index.ts @@ -1,5 +1,4 @@ export { Tooltip } from './Tooltip'; export { TooltipContent } from './TooltipContent'; -export { TooltipPortal } from './TooltipPortal'; export { TooltipProvider } from './TooltipProvider'; export { TooltipTrigger } from './TooltipTrigger'; From 16548ed548e0af108e4c6282d5402c086e202335 Mon Sep 17 00:00:00 2001 From: Xavier Saliniere Date: Fri, 8 May 2026 10:22:37 -0400 Subject: [PATCH 2/3] feat(scroll-area): add onScroll callback prop to ScrollArea component --- .../app/components/scroll-area/page.tsx | 57 +++++++++---------- .../components/ui/scroll-area/ScrollArea.tsx | 17 ++++-- .../src/components/ui/scroll-area/index.ts | 2 +- 3 files changed, 40 insertions(+), 36 deletions(-) diff --git a/packages/lsd-docs/app/components/scroll-area/page.tsx b/packages/lsd-docs/app/components/scroll-area/page.tsx index a79e0d13..c6387a2c 100644 --- a/packages/lsd-docs/app/components/scroll-area/page.tsx +++ b/packages/lsd-docs/app/components/scroll-area/page.tsx @@ -2,7 +2,6 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle, Typography } from '@nipsys/lsd'; import { useRef } from 'react'; -import { CodeBlock } from '@/components/docs/CodeBlock'; import { CodeExample } from '@/components/docs/CodeExample'; import { DocsLayout } from '@/components/docs/DocsLayout'; import { IframeExample } from '@/components/docs/IframeExample'; @@ -11,18 +10,13 @@ import { PageHeader } from '@/components/docs/PageHeader'; import { PageNavigation } from '@/components/docs/PageNavigation'; import { PageSection } from '@/components/docs/PageSection'; import { useSendThemeToIframes } from '@/components/docs/useSendIframes'; -import { - CODE as ScrollAreaBasicCODE, - SIZE as ScrollAreaBasicSIZE, -} from '@/examples/scroll-area/basic/page'; -import { - CODE as ScrollAreaBothOrientationCODE, - SIZE as ScrollAreaBothOrientationSIZE, -} from '@/examples/scroll-area/both-orientation/page'; -import { - CODE as ScrollAreaHorizontalCODE, - SIZE as ScrollAreaHorizontalSIZE, -} from '@/examples/scroll-area/horizontal/page'; +import { CodeBlock } from '@/components/docs/CodeBlock'; +import { CODE as ScrollAreaBasicCODE } from '@/examples/scroll-area/basic/page'; +import { SIZE as ScrollAreaBasicSIZE } from '@/examples/scroll-area/basic/page'; +import { CODE as ScrollAreaBothOrientationCODE } from '@/examples/scroll-area/both-orientation/page'; +import { SIZE as ScrollAreaBothOrientationSIZE } from '@/examples/scroll-area/both-orientation/page'; +import { CODE as ScrollAreaHorizontalCODE } from '@/examples/scroll-area/horizontal/page'; +import { SIZE as ScrollAreaHorizontalSIZE } from '@/examples/scroll-area/horizontal/page'; export default function ScrollAreaPage() { const ScrollAreaBasicIframeRef = useRef(null); @@ -142,23 +136,26 @@ export default function MyComponent() { -
- - - Radix UI Documentation - ScrollArea wraps Radix UI primitives - - - - View Radix UI ScrollArea documentation → - - - +
+ + ScrollArea + +
+ + + onScroll + Callback fired when the viewport scrolls + + + + Type: React.UIEventHandler<HTMLDivElement> + + + Optional + + + +
diff --git a/packages/lsd/src/components/ui/scroll-area/ScrollArea.tsx b/packages/lsd/src/components/ui/scroll-area/ScrollArea.tsx index e99c4bc9..e639f372 100644 --- a/packages/lsd/src/components/ui/scroll-area/ScrollArea.tsx +++ b/packages/lsd/src/components/ui/scroll-area/ScrollArea.tsx @@ -4,6 +4,14 @@ import type * as React from 'react'; import { cn } from '@/lib/utils'; import { ScrollBar } from './ScrollBar'; +/** + * Props for the ScrollArea component + */ +export interface ScrollAreaProps extends React.ComponentProps { + /** Callback fired when the viewport scrolls */ + onScroll?: React.UIEventHandler; +} + /** * ScrollArea - Custom styled scrollable container * @@ -34,13 +42,11 @@ import { ScrollBar } from './ScrollBar'; * @docSectionAccessibilityFocus * Standard focus management for scrollable content. Focus follows native browser behavior when navigating with keyboard. * + * @param onScroll - Callback fired when the viewport scrolls. Receives the scroll event with scrollTop accessible via event.currentTarget.scrollTop. + * * @exportAs root */ -function ScrollArea({ - className, - children, - ...props -}: React.ComponentProps) { +function ScrollArea({ className, children, onScroll, ...props }: ScrollAreaProps) { return ( {children} diff --git a/packages/lsd/src/components/ui/scroll-area/index.ts b/packages/lsd/src/components/ui/scroll-area/index.ts index 28cc2612..7c6830b3 100644 --- a/packages/lsd/src/components/ui/scroll-area/index.ts +++ b/packages/lsd/src/components/ui/scroll-area/index.ts @@ -1,2 +1,2 @@ -export { ScrollArea } from './ScrollArea'; +export { ScrollArea, type ScrollAreaProps } from './ScrollArea'; export { ScrollBar } from './ScrollBar'; From 354aaae41f3300f6f3f41e02f781006172ade666 Mon Sep 17 00:00:00 2001 From: Xavier Saliniere Date: Fri, 8 May 2026 11:28:36 -0400 Subject: [PATCH 3/3] chore: release v1.1.3 --- CHANGELOG.md | 14 ++++++++++++- package.json | 2 +- .../app/components/scroll-area/page.tsx | 20 ++++++++++++------- packages/lsd-docs/app/config/site.ts | 2 +- packages/lsd-docs/package.json | 2 +- packages/lsd/package.json | 2 +- skills/nipsys-lsd/SKILL.md | 2 +- 7 files changed, 31 insertions(+), 13 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4fb6faa4..ee5e4f8e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,17 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## [1.1.3] - 2026-05-08 + +### Features +- **ScrollArea**: Added `onScroll` prop for scroll event handling (enables infinite scroll, scroll position tracking, etc.) +- **ScrollArea**: Exported `ScrollAreaProps` type for TypeScript consumers + +### Fixes +- **Tooltip**: Removed unnecessary `TooltipPortal` export (handled internally by `TooltipContent`) + +--- + ## [1.1.2] - 2026-05-07 ### Fixes @@ -82,7 +93,8 @@ If you have custom themes or override theme variables, you'll need to update the ## Version Reference -- **1.1.2** - Current release (missing exports fix) +- **1.1.3** - Current release (ScrollArea onScroll prop, tooltip export cleanup) +- **1.1.2** - Missing exports fix - **1.1.1** - Sidebar active state underline - **1.1.0** - Theming refactor - **1.0.0** - Initial release diff --git a/package.json b/package.json index 34b735c2..381461da 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@nipsys/lsd-monorepo", - "version": "1.1.2", + "version": "1.1.3", "private": true, "description": "Monorepo for the @nipsys/lsd component library and documentation", "license": "MIT", diff --git a/packages/lsd-docs/app/components/scroll-area/page.tsx b/packages/lsd-docs/app/components/scroll-area/page.tsx index c6387a2c..33bc2063 100644 --- a/packages/lsd-docs/app/components/scroll-area/page.tsx +++ b/packages/lsd-docs/app/components/scroll-area/page.tsx @@ -2,6 +2,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle, Typography } from '@nipsys/lsd'; import { useRef } from 'react'; +import { CodeBlock } from '@/components/docs/CodeBlock'; import { CodeExample } from '@/components/docs/CodeExample'; import { DocsLayout } from '@/components/docs/DocsLayout'; import { IframeExample } from '@/components/docs/IframeExample'; @@ -10,13 +11,18 @@ import { PageHeader } from '@/components/docs/PageHeader'; import { PageNavigation } from '@/components/docs/PageNavigation'; import { PageSection } from '@/components/docs/PageSection'; import { useSendThemeToIframes } from '@/components/docs/useSendIframes'; -import { CodeBlock } from '@/components/docs/CodeBlock'; -import { CODE as ScrollAreaBasicCODE } from '@/examples/scroll-area/basic/page'; -import { SIZE as ScrollAreaBasicSIZE } from '@/examples/scroll-area/basic/page'; -import { CODE as ScrollAreaBothOrientationCODE } from '@/examples/scroll-area/both-orientation/page'; -import { SIZE as ScrollAreaBothOrientationSIZE } from '@/examples/scroll-area/both-orientation/page'; -import { CODE as ScrollAreaHorizontalCODE } from '@/examples/scroll-area/horizontal/page'; -import { SIZE as ScrollAreaHorizontalSIZE } from '@/examples/scroll-area/horizontal/page'; +import { + CODE as ScrollAreaBasicCODE, + SIZE as ScrollAreaBasicSIZE, +} from '@/examples/scroll-area/basic/page'; +import { + CODE as ScrollAreaBothOrientationCODE, + SIZE as ScrollAreaBothOrientationSIZE, +} from '@/examples/scroll-area/both-orientation/page'; +import { + CODE as ScrollAreaHorizontalCODE, + SIZE as ScrollAreaHorizontalSIZE, +} from '@/examples/scroll-area/horizontal/page'; export default function ScrollAreaPage() { const ScrollAreaBasicIframeRef = useRef(null); diff --git a/packages/lsd-docs/app/config/site.ts b/packages/lsd-docs/app/config/site.ts index 964cc706..f7d0d842 100644 --- a/packages/lsd-docs/app/config/site.ts +++ b/packages/lsd-docs/app/config/site.ts @@ -3,7 +3,7 @@ export const siteConfig = { title: 'LSD Documentation', description: 'LSD Component Library Documentation', url: 'https://lsd.nipsys.dev', - version: '1.1.2', + version: '1.1.3', github: 'https://github.com/nipsysdev/lsd', } as const; diff --git a/packages/lsd-docs/package.json b/packages/lsd-docs/package.json index d245831b..91889dd9 100644 --- a/packages/lsd-docs/package.json +++ b/packages/lsd-docs/package.json @@ -1,7 +1,7 @@ { "name": "@nipsys/lsd-docs", "type": "module", - "version": "1.1.2", + "version": "1.1.3", "private": true, "scripts": { "dev": "next dev --turbopack", diff --git a/packages/lsd/package.json b/packages/lsd/package.json index 39033ab5..3cfc1314 100644 --- a/packages/lsd/package.json +++ b/packages/lsd/package.json @@ -5,7 +5,7 @@ "publishConfig": { "access": "public" }, - "version": "1.1.2", + "version": "1.1.3", "type": "module", "module": "./dist/main.js", "exports": { diff --git a/skills/nipsys-lsd/SKILL.md b/skills/nipsys-lsd/SKILL.md index 6f7f522a..c001603b 100644 --- a/skills/nipsys-lsd/SKILL.md +++ b/skills/nipsys-lsd/SKILL.md @@ -2,7 +2,7 @@ name: nipsys-lsd description: Use when working with @nipsys/lsd in React 19+ projects for UI component implementation, theming, and design system integration. Provides comprehensive guidance for the LSD monochromatic component library including 39 accessible components with semantic styling, spacing tokens (--lsd-spacing-*), keyboard navigation patterns, and proper composition patterns. Ideal for developers building React applications. metadata: - version: 1.1.2 + version: 1.1.3 category: frontend sources: - https://github.com/nipsysdev/lsd