npm - @fragments-sdk/ui - Versions diffs - 0.14.0 → 0.15.1 - Mend

@fragments-sdk/ui 0.14.0 → 0.15.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1465) hide show

package/dist/components/AppShell/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/AppShell/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './AppShell.module.scss';\nimport {\n SidebarProvider,\n Sidebar,\n useSidebar,\n type SidebarCollapsible,\n} from '../Sidebar';\n\n// ============================================\n// Types\n// ============================================\n\n/**\n * ```\n * 'default' 'sidebar' 'sidebar-floating'\n * ┌──────────────┐ ┌────┬─────────┐ ┌────┬─────────┐\n * │ Header │ │ │ Header │ │ │ Header │\n * ├────┬─────────┤ │Side├─────────┤ │Side├╌╌╌╌╌╌╌╌╌┤\n * │ │ │ │bar │ │ │bar │┌───────┐│\n * │Side│ Main │ │ │ Main │ │ ││ Main ││\n * │bar │ │ │ │ │ │ │└───────┘│\n * └────┴─────────┘ └────┴─────────┘ └────┴─────────┘\n * ```\n */\nexport type AppShellLayout = 'default' | 'sidebar' | 'sidebar-floating';\n\nexport interface AppShellProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n /**\n * Layout mode:\n *\n * ```\n * 'default' 'sidebar' 'sidebar-floating'\n * ┌──────────────┐ ┌────┬─────────┐ ┌────┬─────────┐\n * │ Header │ │ │ Header │ │ │ Header │\n * ├────┬─────────┤ │Side├─────────┤ │Side├╌╌╌╌╌╌╌╌╌┤\n * │ │ │ │bar │ │ │bar │┌───────┐│\n * │Side│ Main │ │ │ Main │ │ ││ Main ││\n * │bar │ │ │ │ │ │ │└───────┘│\n * └────┴─────────┘ └────┴─────────┘ └────┴─────────┘\n * ```\n *\n * - `'default'`: Header spans full width, sidebar below (default)\n * - `'sidebar'`: Sidebar is full height, header sits beside it\n * - `'sidebar-floating'`: Like `sidebar` but main content floats with rounded corners and a distinct background\n */\n layout?: AppShellLayout;\n}\n\nexport interface AppShellHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n /** Header height (default: '56px') */\n height?: string;\n}\n\nexport interface AppShellSidebarProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n /** Width of expanded sidebar (default: '240px') */\n width?: string;\n /** Width when collapsed (default: '64px') */\n collapsedWidth?: string;\n /** Collapse behavior */\n collapsible?: SidebarCollapsible;\n /** Sidebar position */\n position?: 'left' | 'right';\n /** Default collapsed state */\n defaultCollapsed?: boolean;\n}\n\nexport interface AppShellMainProps extends React.HTMLAttributes<HTMLElement> {\n children: React.ReactNode;\n /** Content padding */\n padding?: 'none' | 'sm' | 'md' | 'lg';\n}\n\nexport interface AppShellAsideProps extends React.HTMLAttributes<HTMLElement> {\n children: React.ReactNode;\n /** Aside width (default: '280px') */\n width?: string;\n /** Control visibility */\n visible?: boolean;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface AppShellContextValue {\n layout: AppShellLayout;\n headerHeight: string;\n sidebarWidth: string;\n sidebarCollapsedWidth: string;\n asideWidth: string;\n asideVisible: boolean;\n}\n\nconst AppShellContext = React.createContext<AppShellContextValue>({\n layout: 'default',\n headerHeight: '56px',\n sidebarWidth: '240px',\n sidebarCollapsedWidth: '64px',\n asideWidth: '280px',\n asideVisible: false,\n});\n\nfunction useAppShell() {\n return React.useContext(AppShellContext);\n}\n\n// ============================================\n// Hooks\n// ============================================\n\nfunction useIsMobile() {\n const [isMobile, setIsMobile] = React.useState(false);\n\n React.useEffect(() => {\n if (typeof window === 'undefined') return;\n\n const mq = window.matchMedia('(max-width: 767px)');\n setIsMobile(mq.matches);\n\n const handler = (e: MediaQueryListEvent) => setIsMobile(e.matches);\n mq.addEventListener('change', handler);\n return () => mq.removeEventListener('change', handler);\n }, []);\n\n return isMobile;\n}\n\n// ============================================\n// Helper to extract config from children\n// ============================================\n\ninterface ExtractedConfig {\n headerHeight: string;\n sidebarWidth: string;\n sidebarCollapsedWidth: string;\n sidebarCollapsible: SidebarCollapsible;\n sidebarDefaultCollapsed: boolean;\n asideWidth: string;\n asideVisible: boolean;\n}\n\nfunction extractConfigFromChildren(children: React.ReactNode): ExtractedConfig {\n const config: ExtractedConfig = {\n headerHeight: '56px',\n sidebarWidth: '240px',\n sidebarCollapsedWidth: '64px',\n sidebarCollapsible: 'icon',\n sidebarDefaultCollapsed: false,\n asideWidth: '280px',\n asideVisible: false,\n };\n\n React.Children.forEach(children, child => {\n if (!React.isValidElement(child)) return;\n\n if (child.type === AppShellHeader) {\n const props = child.props as AppShellHeaderProps;\n if (props.height) config.headerHeight = props.height;\n }\n\n if (child.type === AppShellSidebar) {\n const props = child.props as AppShellSidebarProps;\n if (props.width) config.sidebarWidth = props.width;\n if (props.collapsedWidth) config.sidebarCollapsedWidth = props.collapsedWidth;\n if (props.collapsible) config.sidebarCollapsible = props.collapsible;\n if (props.defaultCollapsed !== undefined) config.sidebarDefaultCollapsed = props.defaultCollapsed;\n }\n\n if (child.type === AppShellAside) {\n const props = child.props as AppShellAsideProps;\n if (props.width) config.asideWidth = props.width;\n if (props.visible !== false) config.asideVisible = true;\n }\n });\n\n return config;\n}\n\n// ============================================\n// Internal component to apply CSS variables\n// ============================================\n\nfunction AppShellInner({\n children,\n className,\n layout,\n style: styleProp,\n ...htmlProps\n}: {\n children: React.ReactNode;\n className?: string;\n layout: AppShellLayout;\n} & React.HTMLAttributes<HTMLDivElement>) {\n const appShell = useAppShell();\n const { collapsed, isMobile, collapsible } = useSidebar();\n\n const classes = [\n styles.root,\n (layout === 'sidebar' || layout === 'sidebar-floating') && styles.sidebarLayout,\n layout === 'sidebar-floating' && styles.sidebarFloatingLayout,\n className,\n ].filter(Boolean).join(' ');\n\n // Calculate actual sidebar width based on state\n const actualSidebarWidth = isMobile\n ? '0px'\n : (collapsible === 'icon' && collapsed)\n ? appShell.sidebarCollapsedWidth\n : (collapsible === 'offcanvas' && collapsed)\n ? '0px'\n : appShell.sidebarWidth;\n\n const style: React.CSSProperties = {\n '--appshell-header-height': appShell.headerHeight,\n '--appshell-sidebar-width': actualSidebarWidth,\n '--appshell-sidebar-expanded-width': appShell.sidebarWidth,\n '--appshell-sidebar-collapsed-width': appShell.sidebarCollapsedWidth,\n '--appshell-aside-width': appShell.asideVisible ? appShell.asideWidth : '0px',\n ...styleProp,\n } as React.CSSProperties;\n\n return (\n <div {...htmlProps} className={classes} style={style} data-layout={layout} data-mobile={isMobile || undefined}>\n {children}\n </div>\n );\n}\n\n// ============================================\n// Components\n// ============================================\n\n/**\n * AppShell - Root layout wrapper\n * Automatically wraps children with SidebarProvider\n */\nfunction AppShellRoot({\n children,\n layout = 'default',\n className,\n ...htmlProps\n}: AppShellProps) {\n // Extract config from children using useMemo to avoid re-renders\n const config = React.useMemo(() => extractConfigFromChildren(children), [children]);\n\n const contextValue: AppShellContextValue = {\n layout,\n headerHeight: config.headerHeight,\n sidebarWidth: config.sidebarWidth,\n sidebarCollapsedWidth: config.sidebarCollapsedWidth,\n asideWidth: config.asideWidth,\n asideVisible: config.asideVisible,\n };\n\n return (\n <AppShellContext.Provider value={contextValue}>\n <SidebarProvider\n width={config.sidebarWidth}\n collapsedWidth={config.sidebarCollapsedWidth}\n collapsible={config.sidebarCollapsible}\n defaultCollapsed={config.sidebarDefaultCollapsed}\n >\n <AppShellInner className={className} layout={layout} {...htmlProps}>\n {children}\n </AppShellInner>\n </SidebarProvider>\n </AppShellContext.Provider>\n );\n}\n\n/**\n * AppShell.Header - Fixed header slot\n */\nfunction AppShellHeader({\n children,\n height = '56px',\n className,\n style: styleProp,\n ...htmlProps\n}: AppShellHeaderProps) {\n const { layout } = useAppShell();\n\n const classes = [\n styles.header,\n (layout === 'sidebar' || layout === 'sidebar-floating') && styles.headerSidebar,\n layout === 'sidebar-floating' && styles.headerFloating,\n className,\n ].filter(Boolean).join(' ');\n\n const style: React.CSSProperties = {\n '--header-height': height,\n ...styleProp,\n } as React.CSSProperties;\n\n return (\n <div {...htmlProps} className={classes} style={style}>\n {children}\n </div>\n );\n}\n\n/**\n * AppShell.Sidebar - Sidebar slot (delegates to Sidebar component)\n */\nfunction AppShellSidebar({\n children,\n width = '240px',\n collapsedWidth = '64px',\n collapsible = 'icon',\n position = 'left',\n defaultCollapsed = false,\n 'aria-label': ariaLabel,\n className,\n ...htmlProps\n}: AppShellSidebarProps) {\n const isMobile = useIsMobile();\n const { layout } = useAppShell();\n\n const classes = [\n styles.sidebar,\n (layout === 'sidebar' || layout === 'sidebar-floating') && styles.sidebarFullHeight,\n layout === 'sidebar-floating' && styles.sidebarFloating,\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div {...htmlProps} className={classes}>\n <Sidebar\n width={width}\n collapsedWidth={collapsedWidth}\n position={position}\n collapsible={collapsible}\n defaultCollapsed={defaultCollapsed}\n aria-label={ariaLabel}\n >\n {children}\n </Sidebar>\n {isMobile && <Sidebar.Overlay />}\n </div>\n );\n}\n\n/**\n * AppShell.Main - Scrollable main content area\n */\nfunction AppShellMain({\n children,\n padding = 'md',\n className,\n id = 'main-content',\n ...htmlProps\n}: AppShellMainProps) {\n const { layout } = useAppShell();\n\n const classes = [\n styles.main,\n padding !== 'none' && styles[`padding${padding.charAt(0).toUpperCase() + padding.slice(1)}`],\n layout === 'sidebar-floating' && styles.mainFloating,\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <main {...htmlProps} className={classes} id={id}>\n {children}\n </main>\n );\n}\n\n/**\n * AppShell.Aside - Optional right sidebar panel\n */\nfunction AppShellAside({\n children,\n width = '280px',\n visible = true,\n className,\n style: styleProp,\n ...htmlProps\n}: AppShellAsideProps) {\n if (!visible) {\n return null;\n }\n\n const classes = [styles.aside, className].filter(Boolean).join(' ');\n\n const style: React.CSSProperties = {\n '--aside-width': width,\n ...styleProp,\n } as React.CSSProperties;\n\n return (\n <aside {...htmlProps} className={classes} style={style}>\n {children}\n </aside>\n );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const AppShell = Object.assign(AppShellRoot, {\n Header: AppShellHeader,\n Sidebar: AppShellSidebar,\n Main: AppShellMain,\n Aside: AppShellAside,\n});\n\nexport {\n AppShellRoot,\n AppShellHeader,\n AppShellSidebar,\n AppShellMain,\n AppShellAside,\n useAppShell,\n};\n"],"names":["React","useSidebar","styles","jsx","SidebarProvider","jsxs","Sidebar"],"mappings":"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"}

package/dist/components/AppShell/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/AppShell/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './AppShell.module.scss';\nimport {\n SidebarProvider,\n Sidebar,\n useSidebar,\n type SidebarCollapsible,\n} from '../Sidebar';\n\n// ============================================\n// Types\n// ============================================\n\n/**\n * ```\n * 'default' 'sidebar' 'sidebar-floating'\n * ┌──────────────┐ ┌────┬─────────┐ ┌────┬─────────┐\n * │ Header │ │ │ Header │ │ │ Header │\n * ├────┬─────────┤ │Side├─────────┤ │Side├╌╌╌╌╌╌╌╌╌┤\n * │ │ │ │bar │ │ │bar │┌───────┐│\n * │Side│ Main │ │ │ Main │ │ ││ Main ││\n * │bar │ │ │ │ │ │ │└───────┘│\n * └────┴─────────┘ └────┴─────────┘ └────┴─────────┘\n * ```\n */\nexport type AppShellLayout = 'default' | 'sidebar' | 'sidebar-floating';\n\nexport interface AppShellProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n /**\n * Layout mode:\n *\n * ```\n * 'default' 'sidebar' 'sidebar-floating'\n * ┌──────────────┐ ┌────┬─────────┐ ┌────┬─────────┐\n * │ Header │ │ │ Header │ │ │ Header │\n * ├────┬─────────┤ │Side├─────────┤ │Side├╌╌╌╌╌╌╌╌╌┤\n * │ │ │ │bar │ │ │bar │┌───────┐│\n * │Side│ Main │ │ │ Main │ │ ││ Main ││\n * │bar │ │ │ │ │ │ │└───────┘│\n * └────┴─────────┘ └────┴─────────┘ └────┴─────────┘\n * ```\n *\n * - `'default'`: Header spans full width, sidebar below (default)\n * - `'sidebar'`: Sidebar is full height, header sits beside it\n * - `'sidebar-floating'`: Like `sidebar` but main content floats with rounded corners and a distinct background\n */\n layout?: AppShellLayout;\n}\n\nexport interface AppShellHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n /** Header height (default: '56px') */\n height?: string;\n}\n\nexport interface AppShellSidebarProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n /** Width of expanded sidebar (default: '240px') */\n width?: string;\n /** Width when collapsed (default: '64px') */\n collapsedWidth?: string;\n /** Collapse behavior */\n collapsible?: SidebarCollapsible;\n /** Sidebar position */\n position?: 'left' | 'right';\n /** Default collapsed state */\n defaultCollapsed?: boolean;\n}\n\nexport interface AppShellMainProps extends React.HTMLAttributes<HTMLElement> {\n children: React.ReactNode;\n /** Content padding */\n padding?: 'none' | 'sm' | 'md' | 'lg';\n}\n\nexport interface AppShellAsideProps extends React.HTMLAttributes<HTMLElement> {\n children: React.ReactNode;\n /** Aside width (default: '280px') */\n width?: string;\n /** Control visibility */\n visible?: boolean;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface AppShellContextValue {\n layout: AppShellLayout;\n headerHeight: string;\n sidebarWidth: string;\n sidebarCollapsedWidth: string;\n asideWidth: string;\n asideVisible: boolean;\n}\n\nconst AppShellContext = React.createContext<AppShellContextValue>({\n layout: 'default',\n headerHeight: '56px',\n sidebarWidth: '240px',\n sidebarCollapsedWidth: '64px',\n asideWidth: '280px',\n asideVisible: false,\n});\n\nfunction useAppShell() {\n return React.useContext(AppShellContext);\n}\n\n// ============================================\n// Hooks\n// ============================================\n\nfunction useIsMobile() {\n const [isMobile, setIsMobile] = React.useState(false);\n\n React.useEffect(() => {\n if (typeof window === 'undefined') return;\n\n const mq = window.matchMedia('(max-width: 767px)');\n setIsMobile(mq.matches);\n\n const handler = (e: MediaQueryListEvent) => setIsMobile(e.matches);\n mq.addEventListener('change', handler);\n return () => mq.removeEventListener('change', handler);\n }, []);\n\n return isMobile;\n}\n\n// ============================================\n// Helper to extract config from children\n// ============================================\n\ninterface ExtractedConfig {\n headerHeight: string;\n sidebarWidth: string;\n sidebarCollapsedWidth: string;\n sidebarCollapsible: SidebarCollapsible;\n sidebarDefaultCollapsed: boolean;\n asideWidth: string;\n asideVisible: boolean;\n}\n\nfunction extractConfigFromChildren(children: React.ReactNode): ExtractedConfig {\n const config: ExtractedConfig = {\n headerHeight: '56px',\n sidebarWidth: '240px',\n sidebarCollapsedWidth: '64px',\n sidebarCollapsible: 'icon',\n sidebarDefaultCollapsed: false,\n asideWidth: '280px',\n asideVisible: false,\n };\n\n React.Children.forEach(children, child => {\n if (!React.isValidElement(child)) return;\n\n if (child.type === AppShellHeader) {\n const props = child.props as AppShellHeaderProps;\n if (props.height) config.headerHeight = props.height;\n }\n\n if (child.type === AppShellSidebar) {\n const props = child.props as AppShellSidebarProps;\n if (props.width) config.sidebarWidth = props.width;\n if (props.collapsedWidth) config.sidebarCollapsedWidth = props.collapsedWidth;\n if (props.collapsible) config.sidebarCollapsible = props.collapsible;\n if (props.defaultCollapsed !== undefined) config.sidebarDefaultCollapsed = props.defaultCollapsed;\n }\n\n if (child.type === AppShellAside) {\n const props = child.props as AppShellAsideProps;\n if (props.width) config.asideWidth = props.width;\n if (props.visible !== false) config.asideVisible = true;\n }\n });\n\n return config;\n}\n\n// ============================================\n// Internal component to apply CSS variables\n// ============================================\n\nfunction AppShellInner({\n children,\n className,\n layout,\n style: styleProp,\n ...htmlProps\n}: {\n children: React.ReactNode;\n className?: string;\n layout: AppShellLayout;\n} & React.HTMLAttributes<HTMLDivElement>) {\n const appShell = useAppShell();\n const { collapsed, isMobile, collapsible } = useSidebar();\n\n const classes = [\n styles.root,\n (layout === 'sidebar' || layout === 'sidebar-floating') && styles.sidebarLayout,\n layout === 'sidebar-floating' && styles.sidebarFloatingLayout,\n className,\n ].filter(Boolean).join(' ');\n\n // Calculate actual sidebar width based on state\n const actualSidebarWidth = isMobile\n ? '0px'\n : (collapsible === 'icon' && collapsed)\n ? appShell.sidebarCollapsedWidth\n : (collapsible === 'offcanvas' && collapsed)\n ? '0px'\n : appShell.sidebarWidth;\n\n const style: React.CSSProperties = {\n '--appshell-header-height': appShell.headerHeight,\n '--appshell-sidebar-width': actualSidebarWidth,\n '--appshell-sidebar-expanded-width': appShell.sidebarWidth,\n '--appshell-sidebar-collapsed-width': appShell.sidebarCollapsedWidth,\n '--appshell-aside-width': appShell.asideVisible ? appShell.asideWidth : '0px',\n ...styleProp,\n } as React.CSSProperties;\n\n return (\n <div {...htmlProps} className={classes} style={style} data-layout={layout} data-mobile={isMobile || undefined}>\n {children}\n </div>\n );\n}\n\n// ============================================\n// Components\n// ============================================\n\n/**\n * AppShell - Root layout wrapper\n * Automatically wraps children with SidebarProvider\n */\nfunction AppShellRoot({\n children,\n layout = 'default',\n className,\n ...htmlProps\n}: AppShellProps) {\n // Extract config from children using useMemo to avoid re-renders\n const config = React.useMemo(() => extractConfigFromChildren(children), [children]);\n\n const contextValue: AppShellContextValue = {\n layout,\n headerHeight: config.headerHeight,\n sidebarWidth: config.sidebarWidth,\n sidebarCollapsedWidth: config.sidebarCollapsedWidth,\n asideWidth: config.asideWidth,\n asideVisible: config.asideVisible,\n };\n\n return (\n <AppShellContext.Provider value={contextValue}>\n <SidebarProvider\n width={config.sidebarWidth}\n collapsedWidth={config.sidebarCollapsedWidth}\n collapsible={config.sidebarCollapsible}\n defaultCollapsed={config.sidebarDefaultCollapsed}\n >\n <AppShellInner className={className} layout={layout} {...htmlProps}>\n {children}\n </AppShellInner>\n </SidebarProvider>\n </AppShellContext.Provider>\n );\n}\n\n/**\n * AppShell.Header - Fixed header slot\n */\nfunction AppShellHeader({\n children,\n height = '56px',\n className,\n style: styleProp,\n ...htmlProps\n}: AppShellHeaderProps) {\n const { layout } = useAppShell();\n\n const classes = [\n styles.header,\n (layout === 'sidebar' || layout === 'sidebar-floating') && styles.headerSidebar,\n layout === 'sidebar-floating' && styles.headerFloating,\n className,\n ].filter(Boolean).join(' ');\n\n const style: React.CSSProperties = {\n '--header-height': height,\n ...styleProp,\n } as React.CSSProperties;\n\n return (\n <div {...htmlProps} className={classes} style={style}>\n {children}\n </div>\n );\n}\n\n/**\n * AppShell.Sidebar - Sidebar slot (delegates to Sidebar component)\n */\nfunction AppShellSidebar({\n children,\n width = '240px',\n collapsedWidth = '64px',\n collapsible = 'icon',\n position = 'left',\n defaultCollapsed = false,\n 'aria-label': ariaLabel,\n className,\n ...htmlProps\n}: AppShellSidebarProps) {\n const isMobile = useIsMobile();\n const { layout } = useAppShell();\n\n const classes = [\n styles.sidebar,\n (layout === 'sidebar' || layout === 'sidebar-floating') && styles.sidebarFullHeight,\n layout === 'sidebar-floating' && styles.sidebarFloating,\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div {...htmlProps} className={classes}>\n <Sidebar\n width={width}\n collapsedWidth={collapsedWidth}\n position={position}\n collapsible={collapsible}\n defaultCollapsed={defaultCollapsed}\n aria-label={ariaLabel}\n >\n {children}\n </Sidebar>\n {isMobile && <Sidebar.Overlay />}\n </div>\n );\n}\n\n/**\n * AppShell.Main - Scrollable main content area\n */\nfunction AppShellMain({\n children,\n padding = 'md',\n className,\n id = 'main-content',\n ...htmlProps\n}: AppShellMainProps) {\n const { layout } = useAppShell();\n\n const classes = [\n styles.main,\n padding !== 'none' && styles[`padding${padding.charAt(0).toUpperCase() + padding.slice(1)}`],\n layout === 'sidebar-floating' && styles.mainFloating,\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <main {...htmlProps} className={classes} id={id}>\n {children}\n </main>\n );\n}\n\n/**\n * AppShell.Aside - Optional right sidebar panel\n */\nfunction AppShellAside({\n children,\n width = '280px',\n visible = true,\n className,\n style: styleProp,\n ...htmlProps\n}: AppShellAsideProps) {\n if (!visible) {\n return null;\n }\n\n const classes = [styles.aside, className].filter(Boolean).join(' ');\n\n const style: React.CSSProperties = {\n '--aside-width': width,\n ...styleProp,\n } as React.CSSProperties;\n\n return (\n <aside {...htmlProps} className={classes} style={style}>\n {children}\n </aside>\n );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const AppShell = Object.assign(AppShellRoot, {\n Header: AppShellHeader,\n Sidebar: AppShellSidebar,\n Main: AppShellMain,\n Aside: AppShellAside,\n});\n\nexport {\n AppShellRoot,\n AppShellHeader,\n AppShellSidebar,\n AppShellMain,\n AppShellAside,\n useAppShell,\n};\n"],"names":[],"mappings":";;;;AAmGA,MAAM,kBAAkB,MAAM,cAAoC;AAAA,EAChE,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,cAAc;AAAA,EACd,uBAAuB;AAAA,EACvB,YAAY;AAAA,EACZ,cAAc;AAChB,CAAC;AAED,SAAS,cAAc;AACrB,SAAO,MAAM,WAAW,eAAe;AACzC;AAMA,SAAS,cAAc;AACrB,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAAS,KAAK;AAEpD,QAAM,UAAU,MAAM;AACpB,QAAI,OAAO,WAAW,YAAa;AAEnC,UAAM,KAAK,OAAO,WAAW,oBAAoB;AACjD,gBAAY,GAAG,OAAO;AAEtB,UAAM,UAAU,CAAC,MAA2B,YAAY,EAAE,OAAO;AACjE,OAAG,iBAAiB,UAAU,OAAO;AACrC,WAAO,MAAM,GAAG,oBAAoB,UAAU,OAAO;AAAA,EACvD,GAAG,CAAA,CAAE;AAEL,SAAO;AACT;AAgBA,SAAS,0BAA0B,UAA4C;AAC7E,QAAM,SAA0B;AAAA,IAC9B,cAAc;AAAA,IACd,cAAc;AAAA,IACd,uBAAuB;AAAA,IACvB,oBAAoB;AAAA,IACpB,yBAAyB;AAAA,IACzB,YAAY;AAAA,IACZ,cAAc;AAAA,EAAA;AAGhB,QAAM,SAAS,QAAQ,UAAU,CAAA,UAAS;AACxC,QAAI,CAAC,MAAM,eAAe,KAAK,EAAG;AAElC,QAAI,MAAM,SAAS,gBAAgB;AACjC,YAAM,QAAQ,MAAM;AACpB,UAAI,MAAM,OAAQ,QAAO,eAAe,MAAM;AAAA,IAChD;AAEA,QAAI,MAAM,SAAS,iBAAiB;AAClC,YAAM,QAAQ,MAAM;AACpB,UAAI,MAAM,MAAO,QAAO,eAAe,MAAM;AAC7C,UAAI,MAAM,eAAgB,QAAO,wBAAwB,MAAM;AAC/D,UAAI,MAAM,YAAa,QAAO,qBAAqB,MAAM;AACzD,UAAI,MAAM,qBAAqB,OAAW,QAAO,0BAA0B,MAAM;AAAA,IACnF;AAEA,QAAI,MAAM,SAAS,eAAe;AAChC,YAAM,QAAQ,MAAM;AACpB,UAAI,MAAM,MAAO,QAAO,aAAa,MAAM;AAC3C,UAAI,MAAM,YAAY,MAAO,QAAO,eAAe;AAAA,IACrD;AAAA,EACF,CAAC;AAED,SAAO;AACT;AAMA,SAAS,cAAc;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAI0C;AACxC,QAAM,WAAW,YAAA;AACjB,QAAM,EAAE,WAAW,UAAU,YAAA,IAAgB,WAAA;AAE7C,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,KACN,WAAW,aAAa,WAAW,uBAAuB,OAAO;AAAA,IAClE,WAAW,sBAAsB,OAAO;AAAA,IACxC;AAAA,EAAA,EACA,OAAO,OAAO,EAAE,KAAK,GAAG;AAG1B,QAAM,qBAAqB,WACvB,QACC,gBAAgB,UAAU,YACzB,SAAS,wBACR,gBAAgB,eAAe,YAC9B,QACA,SAAS;AAEjB,QAAM,QAA6B;AAAA,IACjC,4BAA4B,SAAS;AAAA,IACrC,4BAA4B;AAAA,IAC5B,qCAAqC,SAAS;AAAA,IAC9C,sCAAsC,SAAS;AAAA,IAC/C,0BAA0B,SAAS,eAAe,SAAS,aAAa;AAAA,IACxE,GAAG;AAAA,EAAA;AAGL,SACE,oBAAC,OAAA,EAAK,GAAG,WAAW,WAAW,SAAS,OAAc,eAAa,QAAQ,eAAa,YAAY,QACjG,SAAA,CACH;AAEJ;AAUA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,GAAkB;AAEhB,QAAM,SAAS,MAAM,QAAQ,MAAM,0BAA0B,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAElF,QAAM,eAAqC;AAAA,IACzC;AAAA,IACA,cAAc,OAAO;AAAA,IACrB,cAAc,OAAO;AAAA,IACrB,uBAAuB,OAAO;AAAA,IAC9B,YAAY,OAAO;AAAA,IACnB,cAAc,OAAO;AAAA,EAAA;AAGvB,SACE,oBAAC,gBAAgB,UAAhB,EAAyB,OAAO,cAC/B,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,OAAO;AAAA,MACd,gBAAgB,OAAO;AAAA,MACvB,aAAa,OAAO;AAAA,MACpB,kBAAkB,OAAO;AAAA,MAEzB,8BAAC,eAAA,EAAc,WAAsB,QAAiB,GAAG,WACtD,SAAA,CACH;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;AAKA,SAAS,eAAe;AAAA,EACtB;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAAwB;AACtB,QAAM,EAAE,OAAA,IAAW,YAAA;AAEnB,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,KACN,WAAW,aAAa,WAAW,uBAAuB,OAAO;AAAA,IAClE,WAAW,sBAAsB,OAAO;AAAA,IACxC;AAAA,EAAA,EACA,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,QAAM,QAA6B;AAAA,IACjC,mBAAmB;AAAA,IACnB,GAAG;AAAA,EAAA;AAGL,6BACG,OAAA,EAAK,GAAG,WAAW,WAAW,SAAS,OACrC,UACH;AAEJ;AAKA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA,QAAQ;AAAA,EACR,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,WAAW;AAAA,EACX,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd;AAAA,EACA,GAAG;AACL,GAAyB;AACvB,QAAM,WAAW,YAAA;AACjB,QAAM,EAAE,OAAA,IAAW,YAAA;AAEnB,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,KACN,WAAW,aAAa,WAAW,uBAAuB,OAAO;AAAA,IAClE,WAAW,sBAAsB,OAAO;AAAA,IACxC;AAAA,EAAA,EACA,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,SACE,qBAAC,OAAA,EAAK,GAAG,WAAW,WAAW,SAC7B,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY;AAAA,QAEX;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,YAAY,oBAAC,QAAQ,SAAR,CAAA,CAAgB;AAAA,EAAA,GAChC;AAEJ;AAKA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,KAAK;AAAA,EACL,GAAG;AACL,GAAsB;AACpB,QAAM,EAAE,OAAA,IAAW,YAAA;AAEnB,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,IACP,YAAY,UAAU,OAAO,UAAU,QAAQ,OAAO,CAAC,EAAE,YAAA,IAAgB,QAAQ,MAAM,CAAC,CAAC,EAAE;AAAA,IAC3F,WAAW,sBAAsB,OAAO;AAAA,IACxC;AAAA,EAAA,EACA,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,6BACG,QAAA,EAAM,GAAG,WAAW,WAAW,SAAS,IACtC,UACH;AAEJ;AAKA,SAAS,cAAc;AAAA,EACrB;AAAA,EACA,QAAQ;AAAA,EACR,UAAU;AAAA,EACV;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAAuB;AACrB,MAAI,CAAC,SAAS;AACZ,WAAO;AAAA,EACT;AAEA,QAAM,UAAU,CAAC,OAAO,OAAO,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAElE,QAAM,QAA6B;AAAA,IACjC,iBAAiB;AAAA,IACjB,GAAG;AAAA,EAAA;AAGL,6BACG,SAAA,EAAO,GAAG,WAAW,WAAW,SAAS,OACvC,UACH;AAEJ;AAMO,MAAM,WAAW,OAAO,OAAO,cAAc;AAAA,EAClD,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AACT,CAAC;"}

package/dist/components/Avatar/Avatar.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Avatar.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Avatar/Avatar.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Avatar.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Avatar/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Avatar/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Avatar.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\n/**\n * Avatar for user photos, initials, or placeholder icons.\n * @see https://usefragments.com/components/avatar\n */\nexport interface AvatarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {\n /** Image source URL */\n src?: string;\n /** Alt text for the image */\n alt?: string;\n /** Fallback initials (1-2 characters recommended) */\n initials?: string;\n /** Full name - used to generate initials if not provided */\n name?: string;\n /** Size variant */\n size?: AvatarSize;\n /** Custom avatar size (overrides size width/height) */\n customSize?: number | string;\n /** Shape variant */\n shape?: 'circle' | 'square';\n /** Custom background color for fallback */\n color?: string;\n /** Inline style for the underlying image element */\n imageStyle?: React.CSSProperties;\n /** Additional props for the underlying img element */\n imageProps?: Omit<\n React.ImgHTMLAttributes<HTMLImageElement>,\n 'src' | 'alt' | 'className' | 'style'\n >;\n}\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Maximum number of avatars to display */\n max?: number;\n /** Size for all avatars in the group */\n size?: AvatarSize;\n /** Children (Avatar components) */\n children: React.ReactNode;\n}\n\n// ============================================\n// Helper Functions\n// ============================================\n\nfunction getInitials(name: string): string {\n const parts = name.trim().split(/\\s+/);\n if (parts.length === 1) {\n return parts[0].charAt(0).toUpperCase();\n }\n return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0)).toUpperCase();\n}\n\nfunction stringToColor(str: string): string {\n // Generate a consistent color from a string\n let hash = 0;\n for (let i = 0; i < str.length; i++) {\n hash = str.charCodeAt(i) + ((hash << 5) - hash);\n }\n const hue = Math.abs(hash % 360);\n return `hsl(${hue}, 55%, 40%)`;\n}\n\n/**\n * Compute a contrast-safe text color (white or black) for a given HSL background.\n * Uses WCAG relative luminance to pick whichever gives higher contrast.\n */\nfunction getContrastTextColor(bgColor: string): string | undefined {\n const match = bgColor.match(/hsl\$(\\d+),\\s*(\\d+)%,\\s*(\\d+)%\$/);\n if (!match) return undefined;\n\n const h = parseInt(match[1]);\n const s = parseInt(match[2]) / 100;\n const l = parseInt(match[3]) / 100;\n\n // HSL → RGB\n const c = (1 - Math.abs(2 * l - 1)) * s;\n const x = c * (1 - Math.abs((h / 60) % 2 - 1));\n const m = l - c / 2;\n let r = 0, g = 0, b = 0;\n if (h < 60) { r = c; g = x; }\n else if (h < 120) { r = x; g = c; }\n else if (h < 180) { g = c; b = x; }\n else if (h < 240) { g = x; b = c; }\n else if (h < 300) { r = x; b = c; }\n else { r = c; b = x; }\n r += m; g += m; b += m;\n\n // Relative luminance (sRGB → linear)\n const lin = (v: number) => v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);\n const lum = 0.2126 * lin(r) + 0.7152 * lin(g) + 0.0722 * lin(b);\n\n return lum > 0.179 ? '#000000' : '#ffffff';\n}\n\n// ============================================\n// Avatar Component\n// ============================================\n\nconst AvatarBase = React.forwardRef<HTMLDivElement, AvatarProps>(\n function AvatarBase(\n {\n src,\n alt = '',\n initials,\n name,\n size = 'md',\n customSize,\n shape = 'circle',\n color,\n imageStyle,\n imageProps,\n className,\n style: styleProp,\n ...htmlProps\n },\n ref\n ) {\n const imgRef = React.useRef<HTMLImageElement>(null);\n const [imageError, setImageError] = React.useState(false);\n\n // Reset error state when src changes; check if already-loaded image failed\n React.useEffect(() => {\n setImageError(false);\n const img = imgRef.current;\n if (img && img.complete && img.naturalWidth === 0) {\n setImageError(true);\n }\n }, [src]);\n\n const showFallback = !src || imageError;\n const displayInitials = initials || (name ? getInitials(name) : '');\n const fallbackColor = color || (name ? stringToColor(name) : undefined);\n const fallbackLabel = alt || name;\n const hasFallbackLabel = showFallback && Boolean(fallbackLabel && fallbackLabel.trim().length > 0);\n\n const avatarClasses = [\n styles.avatar,\n styles[size],\n shape === 'square' && styles.square,\n className,\n ].filter(Boolean).join(' ');\n\n const style: React.CSSProperties = { ...styleProp };\n if (customSize !== undefined) {\n const resolvedSize = typeof customSize === 'number' ? `${customSize}px` : customSize;\n style.width = resolvedSize;\n style.height = resolvedSize;\n if (style.fontSize === undefined) {\n style.fontSize = `calc(${resolvedSize} * 0.4)`;\n }\n }\n\n if (showFallback && fallbackColor) {\n style.backgroundColor = fallbackColor;\n const textColor = getContrastTextColor(fallbackColor);\n if (textColor) {\n (style as Record<string, string>)['--avatar-initials-color'] = textColor;\n }\n }\n\n return (\n <div\n ref={ref}\n {...htmlProps}\n className={avatarClasses}\n style={style}\n role={hasFallbackLabel ? 'img' : undefined}\n aria-label={hasFallbackLabel ? fallbackLabel : undefined}\n aria-hidden={showFallback && !hasFallbackLabel ? true : undefined}\n >\n {!showFallback && (\n <img\n ref={imgRef}\n {...imageProps}\n src={src}\n alt={alt}\n className={styles.image}\n onError={(event) => {\n imageProps?.onError?.(event);\n if (!event.defaultPrevented) {\n setImageError(true);\n }\n }}\n style={{ ...imageStyle }}\n />\n )}\n {showFallback && displayInitials && (\n <span className={styles.initials}>{displayInitials}</span>\n )}\n {showFallback && !displayInitials && (\n <svg\n className={styles.fallbackIcon}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\" />\n </svg>\n )}\n </div>\n );\n }\n);\n\n// ============================================\n// Avatar Group Component\n// ============================================\n\nfunction AvatarGroup({\n max,\n size = 'md',\n children,\n className,\n ...htmlProps\n}: AvatarGroupProps) {\n const childArray = React.Children.toArray(children);\n const displayCount = max && max < childArray.length ? max : childArray.length;\n const overflowCount = max && childArray.length > max ? childArray.length - max : 0;\n\n const groupClasses = [styles.group, className].filter(Boolean).join(' ');\n\n return (\n <div {...htmlProps} className={groupClasses}>\n {childArray.slice(0, displayCount).map((child, index) => {\n if (React.isValidElement<AvatarProps>(child)) {\n return React.cloneElement(child, {\n key: index,\n size: child.props.size || size,\n className: [styles.groupItem, child.props.className].filter(Boolean).join(' '),\n });\n }\n return child;\n })}\n {overflowCount > 0 && (\n <div className={[styles.avatar, styles[size], styles.overflow].join(' ')}>\n <span className={styles.initials}>+{overflowCount}</span>\n </div>\n )}\n </div>\n );\n}\n\n// ============================================\n// Compound Component Export\n// ============================================\n\nexport const Avatar = Object.assign(AvatarBase, {\n Group: AvatarGroup,\n});\n"],"names":["React","AvatarBase","styles","jsxs","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsDA,SAAS,YAAY,MAAsB;AACzC,QAAM,QAAQ,KAAK,KAAA,EAAO,MAAM,KAAK;AACrC,MAAI,MAAM,WAAW,GAAG;AACtB,WAAO,MAAM,CAAC,EAAE,OAAO,CAAC,EAAE,YAAA;AAAA,EAC5B;AACA,UAAQ,MAAM,CAAC,EAAE,OAAO,CAAC,IAAI,MAAM,MAAM,SAAS,CAAC,EAAE,OAAO,CAAC,GAAG,YAAA;AAClE;AAEA,SAAS,cAAc,KAAqB;AAE1C,MAAI,OAAO;AACX,WAAS,IAAI,GAAG,IAAI,IAAI,QAAQ,KAAK;AACnC,WAAO,IAAI,WAAW,CAAC,MAAM,QAAQ,KAAK;AAAA,EAC5C;AACA,QAAM,MAAM,KAAK,IAAI,OAAO,GAAG;AAC/B,SAAO,OAAO,GAAG;AACnB;AAMA,SAAS,qBAAqB,SAAqC;AACjE,QAAM,QAAQ,QAAQ,MAAM,kCAAkC;AAC9D,MAAI,CAAC,MAAO,QAAO;AAEnB,QAAM,IAAI,SAAS,MAAM,CAAC,CAAC;AAC3B,QAAM,IAAI,SAAS,MAAM,CAAC,CAAC,IAAI;AAC/B,QAAM,IAAI,SAAS,MAAM,CAAC,CAAC,IAAI;AAG/B,QAAM,KAAK,IAAI,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK;AACtC,QAAM,IAAI,KAAK,IAAI,KAAK,IAAK,IAAI,KAAM,IAAI,CAAC;AAC5C,QAAM,IAAI,IAAI,IAAI;AAClB,MAAI,IAAI,GAAG,IAAI,GAAG,IAAI;AACtB,MAAI,IAAI,IAAI;AAAE,QAAI;AAAG,QAAI;AAAA,EAAG,WACnB,IAAI,KAAK;AAAE,QAAI;AAAG,QAAI;AAAA,EAAG,WACzB,IAAI,KAAK;AAAE,QAAI;AAAG,QAAI;AAAA,EAAG,WACzB,IAAI,KAAK;AAAE,QAAI;AAAG,QAAI;AAAA,EAAG,WACzB,IAAI,KAAK;AAAE,QAAI;AAAG,QAAI;AAAA,EAAG,OAC7B;AAAE,QAAI;AAAG,QAAI;AAAA,EAAG;AACrB,OAAK;AAAG,OAAK;AAAG,OAAK;AAGrB,QAAM,MAAM,CAAC,MAAc,KAAK,UAAU,IAAI,QAAQ,KAAK,KAAK,IAAI,SAAS,OAAO,GAAG;AACvF,QAAM,MAAM,SAAS,IAAI,CAAC,IAAI,SAAS,IAAI,CAAC,IAAI,SAAS,IAAI,CAAC;AAE9D,SAAO,MAAM,QAAQ,YAAY;AACnC;AAMA,MAAM,aAAaA,iBAAM;AAAA,EACvB,SAASC,YACP;AAAA,IACE;AAAA,IACA,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,SAASD,iBAAM,OAAyB,IAAI;AAClD,UAAM,CAAC,YAAY,aAAa,IAAIA,iBAAM,SAAS,KAAK;AAGxDA,qBAAM,UAAU,MAAM;AACpB,oBAAc,KAAK;AACnB,YAAM,MAAM,OAAO;AACnB,UAAI,OAAO,IAAI,YAAY,IAAI,iBAAiB,GAAG;AACjD,sBAAc,IAAI;AAAA,MACpB;AAAA,IACF,GAAG,CAAC,GAAG,CAAC;AAER,UAAM,eAAe,CAAC,OAAO;AAC7B,UAAM,kBAAkB,aAAa,OAAO,YAAY,IAAI,IAAI;AAChE,UAAM,gBAAgB,UAAU,OAAO,cAAc,IAAI,IAAI;AAC7D,UAAM,gBAAgB,OAAO;AAC7B,UAAM,mBAAmB,gBAAgB,QAAQ,iBAAiB,cAAc,KAAA,EAAO,SAAS,CAAC;AAEjG,UAAM,gBAAgB;AAAA,MACpBE,cAAAA,QAAO;AAAA,MACPA,cAAAA,QAAO,IAAI;AAAA,MACX,UAAU,YAAYA,cAAAA,QAAO;AAAA,MAC7B;AAAA,IAAA,EACA,OAAO,OAAO,EAAE,KAAK,GAAG;AAE1B,UAAM,QAA6B,EAAE,GAAG,UAAA;AACxC,QAAI,eAAe,QAAW;AAC5B,YAAM,eAAe,OAAO,eAAe,WAAW,GAAG,UAAU,OAAO;AAC1E,YAAM,QAAQ;AACd,YAAM,SAAS;AACf,UAAI,MAAM,aAAa,QAAW;AAChC,cAAM,WAAW,QAAQ,YAAY;AAAA,MACvC;AAAA,IACF;AAEA,QAAI,gBAAgB,eAAe;AACjC,YAAM,kBAAkB;AACxB,YAAM,YAAY,qBAAqB,aAAa;AACpD,UAAI,WAAW;AACZ,cAAiC,yBAAyB,IAAI;AAAA,MACjE;AAAA,IACF;AAEA,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACC,GAAG;AAAA,QACJ,WAAW;AAAA,QACX;AAAA,QACA,MAAM,mBAAmB,QAAQ;AAAA,QACjC,cAAY,mBAAmB,gBAAgB;AAAA,QAC/C,eAAa,gBAAgB,CAAC,mBAAmB,OAAO;AAAA,QAEvD,UAAA;AAAA,UAAA,CAAC,gBACAC,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACJ,GAAG;AAAA,cACJ;AAAA,cACA;AAAA,cACA,WAAWF,cAAAA,QAAO;AAAA,cAClB,SAAS,CAAC,UAAU;;AAClB,+DAAY,YAAZ,oCAAsB;AACtB,oBAAI,CAAC,MAAM,kBAAkB;AAC3B,gCAAc,IAAI;AAAA,gBACpB;AAAA,cACF;AAAA,cACA,OAAO,EAAE,GAAG,WAAA;AAAA,YAAW;AAAA,UAAA;AAAA,UAG1B,gBAAgB,mBACfE,2BAAAA,IAAC,UAAK,WAAWF,cAAAA,QAAO,UAAW,UAAA,iBAAgB;AAAA,UAEpD,gBAAgB,CAAC,mBAChBE,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWF,cAAAA,QAAO;AAAA,cAClB,OAAM;AAAA,cACN,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,eAAY;AAAA,cAEZ,UAAAE,2BAAAA,IAAC,QAAA,EAAK,GAAE,gHAAA,CAAgH;AAAA,YAAA;AAAA,UAAA;AAAA,QAC1H;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAMA,SAAS,YAAY;AAAA,EACnB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,aAAaJ,iBAAM,SAAS,QAAQ,QAAQ;AAClD,QAAM,eAAe,OAAO,MAAM,WAAW,SAAS,MAAM,WAAW;AACvE,QAAM,gBAAgB,OAAO,WAAW,SAAS,MAAM,WAAW,SAAS,MAAM;AAEjF,QAAM,eAAe,CAACE,cAAAA,QAAO,OAAO,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEvE,SACEC,2BAAAA,KAAC,OAAA,EAAK,GAAG,WAAW,WAAW,cAC5B,UAAA;AAAA,IAAA,WAAW,MAAM,GAAG,YAAY,EAAE,IAAI,CAAC,OAAO,UAAU;AACvD,UAAIH,iBAAM,eAA4B,KAAK,GAAG;AAC5C,eAAOA,iBAAM,aAAa,OAAO;AAAA,UAC/B,KAAK;AAAA,UACL,MAAM,MAAM,MAAM,QAAQ;AAAA,UAC1B,WAAW,CAACE,cAAAA,QAAO,WAAW,MAAM,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,QAAA,CAC9E;AAAA,MACH;AACA,aAAO;AAAA,IACT,CAAC;AAAA,IACA,gBAAgB,KACfE,+BAAC,OAAA,EAAI,WAAW,CAACF,cAAAA,QAAO,QAAQA,sBAAO,IAAI,GAAGA,cAAAA,QAAO,QAAQ,EAAE,KAAK,GAAG,GACrE,UAAAC,2BAAAA,KAAC,QAAA,EAAK,WAAWD,sBAAO,UAAU,UAAA;AAAA,MAAA;AAAA,MAAE;AAAA,IAAA,EAAA,CAAc,EAAA,CACpD;AAAA,EAAA,GAEJ;AAEJ;AAMO,MAAM,SAAS,OAAO,OAAO,YAAY;AAAA,EAC9C,OAAO;AACT,CAAC;;"}

package/dist/components/Avatar/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Avatar/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Avatar.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\n/**\n * Avatar for user photos, initials, or placeholder icons.\n * @see https://usefragments.com/components/avatar\n */\nexport interface AvatarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {\n /** Image source URL */\n src?: string;\n /** Alt text for the image */\n alt?: string;\n /** Fallback initials (1-2 characters recommended) */\n initials?: string;\n /** Full name - used to generate initials if not provided */\n name?: string;\n /** Size variant */\n size?: AvatarSize;\n /** Custom avatar size (overrides size width/height) */\n customSize?: number | string;\n /** Shape variant */\n shape?: 'circle' | 'square';\n /** Custom background color for fallback */\n color?: string;\n /** Inline style for the underlying image element */\n imageStyle?: React.CSSProperties;\n /** Additional props for the underlying img element */\n imageProps?: Omit<\n React.ImgHTMLAttributes<HTMLImageElement>,\n 'src' | 'alt' | 'className' | 'style'\n >;\n}\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Maximum number of avatars to display */\n max?: number;\n /** Size for all avatars in the group */\n size?: AvatarSize;\n /** Children (Avatar components) */\n children: React.ReactNode;\n}\n\n// ============================================\n// Helper Functions\n// ============================================\n\nfunction getInitials(name: string): string {\n const parts = name.trim().split(/\\s+/);\n if (parts.length === 1) {\n return parts[0].charAt(0).toUpperCase();\n }\n return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0)).toUpperCase();\n}\n\nfunction stringToColor(str: string): string {\n // Generate a consistent color from a string\n let hash = 0;\n for (let i = 0; i < str.length; i++) {\n hash = str.charCodeAt(i) + ((hash << 5) - hash);\n }\n const hue = Math.abs(hash % 360);\n return `hsl(${hue}, 55%, 40%)`;\n}\n\n/**\n * Compute a contrast-safe text color (white or black) for a given HSL background.\n * Uses WCAG relative luminance to pick whichever gives higher contrast.\n */\nfunction getContrastTextColor(bgColor: string): string | undefined {\n const match = bgColor.match(/hsl\$(\\d+),\\s*(\\d+)%,\\s*(\\d+)%\$/);\n if (!match) return undefined;\n\n const h = parseInt(match[1]);\n const s = parseInt(match[2]) / 100;\n const l = parseInt(match[3]) / 100;\n\n // HSL → RGB\n const c = (1 - Math.abs(2 * l - 1)) * s;\n const x = c * (1 - Math.abs((h / 60) % 2 - 1));\n const m = l - c / 2;\n let r = 0, g = 0, b = 0;\n if (h < 60) { r = c; g = x; }\n else if (h < 120) { r = x; g = c; }\n else if (h < 180) { g = c; b = x; }\n else if (h < 240) { g = x; b = c; }\n else if (h < 300) { r = x; b = c; }\n else { r = c; b = x; }\n r += m; g += m; b += m;\n\n // Relative luminance (sRGB → linear)\n const lin = (v: number) => v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);\n const lum = 0.2126 * lin(r) + 0.7152 * lin(g) + 0.0722 * lin(b);\n\n return lum > 0.179 ? '#000000' : '#ffffff';\n}\n\n// ============================================\n// Avatar Component\n// ============================================\n\nconst AvatarBase = React.forwardRef<HTMLDivElement, AvatarProps>(\n function AvatarBase(\n {\n src,\n alt = '',\n initials,\n name,\n size = 'md',\n customSize,\n shape = 'circle',\n color,\n imageStyle,\n imageProps,\n className,\n style: styleProp,\n ...htmlProps\n },\n ref\n ) {\n const imgRef = React.useRef<HTMLImageElement>(null);\n const [imageError, setImageError] = React.useState(false);\n\n // Reset error state when src changes; check if already-loaded image failed\n React.useEffect(() => {\n setImageError(false);\n const img = imgRef.current;\n if (img && img.complete && img.naturalWidth === 0) {\n setImageError(true);\n }\n }, [src]);\n\n const showFallback = !src || imageError;\n const displayInitials = initials || (name ? getInitials(name) : '');\n const fallbackColor = color || (name ? stringToColor(name) : undefined);\n const fallbackLabel = alt || name;\n const hasFallbackLabel = showFallback && Boolean(fallbackLabel && fallbackLabel.trim().length > 0);\n\n const avatarClasses = [\n styles.avatar,\n styles[size],\n shape === 'square' && styles.square,\n className,\n ].filter(Boolean).join(' ');\n\n const style: React.CSSProperties = { ...styleProp };\n if (customSize !== undefined) {\n const resolvedSize = typeof customSize === 'number' ? `${customSize}px` : customSize;\n style.width = resolvedSize;\n style.height = resolvedSize;\n if (style.fontSize === undefined) {\n style.fontSize = `calc(${resolvedSize} * 0.4)`;\n }\n }\n\n if (showFallback && fallbackColor) {\n style.backgroundColor = fallbackColor;\n const textColor = getContrastTextColor(fallbackColor);\n if (textColor) {\n (style as Record<string, string>)['--avatar-initials-color'] = textColor;\n }\n }\n\n return (\n <div\n ref={ref}\n {...htmlProps}\n className={avatarClasses}\n style={style}\n role={hasFallbackLabel ? 'img' : undefined}\n aria-label={hasFallbackLabel ? fallbackLabel : undefined}\n aria-hidden={showFallback && !hasFallbackLabel ? true : undefined}\n >\n {!showFallback && (\n <img\n ref={imgRef}\n {...imageProps}\n src={src}\n alt={alt}\n className={styles.image}\n onError={(event) => {\n imageProps?.onError?.(event);\n if (!event.defaultPrevented) {\n setImageError(true);\n }\n }}\n style={{ ...imageStyle }}\n />\n )}\n {showFallback && displayInitials && (\n <span className={styles.initials}>{displayInitials}</span>\n )}\n {showFallback && !displayInitials && (\n <svg\n className={styles.fallbackIcon}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\" />\n </svg>\n )}\n </div>\n );\n }\n);\n\n// ============================================\n// Avatar Group Component\n// ============================================\n\nfunction AvatarGroup({\n max,\n size = 'md',\n children,\n className,\n ...htmlProps\n}: AvatarGroupProps) {\n const childArray = React.Children.toArray(children);\n const displayCount = max && max < childArray.length ? max : childArray.length;\n const overflowCount = max && childArray.length > max ? childArray.length - max : 0;\n\n const groupClasses = [styles.group, className].filter(Boolean).join(' ');\n\n return (\n <div {...htmlProps} className={groupClasses}>\n {childArray.slice(0, displayCount).map((child, index) => {\n if (React.isValidElement<AvatarProps>(child)) {\n return React.cloneElement(child, {\n key: index,\n size: child.props.size || size,\n className: [styles.groupItem, child.props.className].filter(Boolean).join(' '),\n });\n }\n return child;\n })}\n {overflowCount > 0 && (\n <div className={[styles.avatar, styles[size], styles.overflow].join(' ')}>\n <span className={styles.initials}>+{overflowCount}</span>\n </div>\n )}\n </div>\n );\n}\n\n// ============================================\n// Compound Component Export\n// ============================================\n\nexport const Avatar = Object.assign(AvatarBase, {\n Group: AvatarGroup,\n});\n"],"names":["AvatarBase"],"mappings":"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"}

package/dist/components/Badge/Badge.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Badge.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Badge/Badge.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Badge.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Badge/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Badge/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Button as BaseButton } from '@base-ui/react/button';\nimport styles from './Badge.module.scss';\n\n/**\n * Badge for status indicators, labels, and counts.\n * @see https://usefragments.com/components/badge\n */\nexport interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {\n children: React.ReactNode;\n /** Visual style variant.\n * @default \"default\"\n * @see https://usefragments.com/components/badge#variants */\n variant?: 'default' | 'success' | 'warning' | 'error' | 'info' | 'outline';\n /** Badge size.\n * @default \"md\" */\n size?: 'sm' | 'md' | 'lg';\n /** Show a status dot before the label */\n dot?: boolean;\n /** Icon element rendered before the label */\n icon?: React.ReactNode;\n /** Makes the badge removable. Called when dismiss button is clicked. */\n onRemove?: () => void;\n /** Announce badge content as status to assistive tech (opt-in).\n * @default false */\n announce?: boolean;\n}\n\nconst BadgeRoot = React.forwardRef<HTMLSpanElement, BadgeProps>(\n function Badge(\n {\n children,\n variant = 'default',\n size = 'md',\n dot = false,\n icon,\n onRemove,\n announce = false,\n className,\n 'aria-label': ariaLabel,\n role,\n ...htmlProps\n },\n ref\n ) {\n const classes = [styles.badge, styles[size], styles[variant], className]\n .filter(Boolean)\n .join(' ');\n\n // For status badges, include the status in the aria-label if not provided\n const effectiveAriaLabel = ariaLabel || (\n announce && variant !== 'default' && variant !== 'outline'\n ? `${variant}: ${typeof children === 'string' ? children : ''}`\n : undefined\n );\n\n return (\n <span\n ref={ref}\n {...htmlProps}\n className={classes}\n role={role ?? (announce ? 'status' : undefined)}\n aria-label={effectiveAriaLabel}\n >\n {dot && <span className={styles.dot} aria-hidden=\"true\" />}\n {icon && (\n <span className={styles.icon} aria-hidden=\"true\">\n {icon}\n </span>\n )}\n <span>{children}</span>\n {onRemove && (\n <BaseButton\n onClick={onRemove}\n aria-label={`Remove ${typeof children === 'string' ? children : 'badge'}`}\n className={styles.remove}\n >\n ×\n </BaseButton>\n )}\n </span>\n );\n }\n);\n\nexport const Badge = Object.assign(BadgeRoot, {\n Root: BadgeRoot,\n});\n"],"names":["React","Badge","styles","jsxs","jsx","BaseButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAM,YAAYA,iBAAM;AAAA,EACtB,SAASC,OACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU,CAACC,aAAAA,QAAO,OAAOA,aAAAA,QAAO,IAAI,GAAGA,aAAAA,QAAO,OAAO,GAAG,SAAS,EACpE,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,UAAM,qBAAqB,cACzB,YAAY,YAAY,aAAa,YAAY,YAC7C,GAAG,OAAO,KAAK,OAAO,aAAa,WAAW,WAAW,EAAE,KAC3D;AAGN,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACC,GAAG;AAAA,QACJ,WAAW;AAAA,QACX,MAAM,SAAS,WAAW,WAAW;AAAA,QACrC,cAAY;AAAA,QAEX,UAAA;AAAA,UAAA,sCAAQ,QAAA,EAAK,WAAWD,aAAAA,QAAO,KAAK,eAAY,QAAO;AAAA,UACvD,uCACE,QAAA,EAAK,WAAWA,aAAAA,QAAO,MAAM,eAAY,QACvC,UAAA,KAAA,CACH;AAAA,UAEFE,+BAAC,UAAM,UAAS;AAAA,UACf,YACCA,2BAAAA;AAAAA,YAACC,OAAAA;AAAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,cAAY,UAAU,OAAO,aAAa,WAAW,WAAW,OAAO;AAAA,cACvE,WAAWH,aAAAA,QAAO;AAAA,cACnB,UAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAED;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEO,MAAM,QAAQ,OAAO,OAAO,WAAW;AAAA,EAC5C,MAAM;AACR,CAAC;;"}

package/dist/components/Badge/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Badge/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Button as BaseButton } from '@base-ui/react/button';\nimport styles from './Badge.module.scss';\n\n/**\n * Badge for status indicators, labels, and counts.\n * @see https://usefragments.com/components/badge\n */\nexport interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {\n children: React.ReactNode;\n /** Visual style variant.\n * @default \"default\"\n * @see https://usefragments.com/components/badge#variants */\n variant?: 'default' | 'success' | 'warning' | 'error' | 'info' | 'outline';\n /** Badge size.\n * @default \"md\" */\n size?: 'sm' | 'md' | 'lg';\n /** Show a status dot before the label */\n dot?: boolean;\n /** Icon element rendered before the label */\n icon?: React.ReactNode;\n /** Makes the badge removable. Called when dismiss button is clicked. */\n onRemove?: () => void;\n /** Announce badge content as status to assistive tech (opt-in).\n * @default false */\n announce?: boolean;\n}\n\nconst BadgeRoot = React.forwardRef<HTMLSpanElement, BadgeProps>(\n function Badge(\n {\n children,\n variant = 'default',\n size = 'md',\n dot = false,\n icon,\n onRemove,\n announce = false,\n className,\n 'aria-label': ariaLabel,\n role,\n ...htmlProps\n },\n ref\n ) {\n const classes = [styles.badge, styles[size], styles[variant], className]\n .filter(Boolean)\n .join(' ');\n\n // For status badges, include the status in the aria-label if not provided\n const effectiveAriaLabel = ariaLabel || (\n announce && variant !== 'default' && variant !== 'outline'\n ? `${variant}: ${typeof children === 'string' ? children : ''}`\n : undefined\n );\n\n return (\n <span\n ref={ref}\n {...htmlProps}\n className={classes}\n role={role ?? (announce ? 'status' : undefined)}\n aria-label={effectiveAriaLabel}\n >\n {dot && <span className={styles.dot} aria-hidden=\"true\" />}\n {icon && (\n <span className={styles.icon} aria-hidden=\"true\">\n {icon}\n </span>\n )}\n <span>{children}</span>\n {onRemove && (\n <BaseButton\n onClick={onRemove}\n aria-label={`Remove ${typeof children === 'string' ? children : 'badge'}`}\n className={styles.remove}\n >\n ×\n </BaseButton>\n )}\n </span>\n );\n }\n);\n\nexport const Badge = Object.assign(BadgeRoot, {\n Root: BadgeRoot,\n});\n"],"names":["Badge","BaseButton"],"mappings":";;;;AA8BA,MAAM,YAAY,MAAM;AAAA,EACtB,SAASA,OACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV,OAAO;AAAA,IACP,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU,CAAC,OAAO,OAAO,OAAO,IAAI,GAAG,OAAO,OAAO,GAAG,SAAS,EACpE,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,UAAM,qBAAqB,cACzB,YAAY,YAAY,aAAa,YAAY,YAC7C,GAAG,OAAO,KAAK,OAAO,aAAa,WAAW,WAAW,EAAE,KAC3D;AAGN,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACC,GAAG;AAAA,QACJ,WAAW;AAAA,QACX,MAAM,SAAS,WAAW,WAAW;AAAA,QACrC,cAAY;AAAA,QAEX,UAAA;AAAA,UAAA,2BAAQ,QAAA,EAAK,WAAW,OAAO,KAAK,eAAY,QAAO;AAAA,UACvD,4BACE,QAAA,EAAK,WAAW,OAAO,MAAM,eAAY,QACvC,UAAA,KAAA,CACH;AAAA,UAEF,oBAAC,UAAM,UAAS;AAAA,UACf,YACC;AAAA,YAACC;AAAAA,YAAA;AAAA,cACC,SAAS;AAAA,cACT,cAAY,UAAU,OAAO,aAAa,WAAW,WAAW,OAAO;AAAA,cACvE,WAAW,OAAO;AAAA,cACnB,UAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAED;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEO,MAAM,QAAQ,OAAO,OAAO,WAAW;AAAA,EAC5C,MAAM;AACR,CAAC;"}

package/dist/components/BentoGrid/BentoGrid.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"BentoGrid.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/BentoGrid/BentoGrid.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"BentoGrid.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/BentoGrid/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/BentoGrid/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './BentoGrid.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\ntype SpanValue = 1 | 2 | 3;\n\nexport interface ResponsiveSpan {\n /** Default (mobile-first) */\n base?: SpanValue;\n /** ≥640px */\n sm?: SpanValue;\n /** ≥768px */\n md?: SpanValue;\n /** ≥1024px */\n lg?: SpanValue;\n /** ≥1280px */\n xl?: SpanValue;\n}\n\nexport interface BentoGridProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n /** Number of columns (default: 3) — auto-collapses responsively */\n columns?: 2 | 3 | 4;\n /** Gap between grid items */\n gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n}\n\nexport interface BentoGridItemProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n /** Columns to span — number for all breakpoints, object for per-breakpoint */\n colSpan?: SpanValue | ResponsiveSpan;\n /** Rows to span — number for all breakpoints, object for per-breakpoint */\n rowSpan?: SpanValue | ResponsiveSpan;\n}\n\n// ============================================\n// Helpers\n// ============================================\n\nconst gapClasses: Record<NonNullable<BentoGridProps['gap']>, string> = {\n none: styles.gapNone,\n xs: styles.gapXs,\n sm: styles.gapSm,\n md: styles.gapMd,\n lg: styles.gapLg,\n xl: styles.gapXl,\n};\n\nfunction getSpanVars(\n span: SpanValue | ResponsiveSpan | undefined,\n prefix: string\n): Record<string, number> {\n if (!span || span === 1) return {};\n if (typeof span === 'number') return { [`--${prefix}`]: span };\n const vars: Record<string, number> = {};\n if (span.base && span.base > 1) vars[`--${prefix}`] = span.base;\n if (span.sm) vars[`--${prefix}-sm`] = span.sm;\n if (span.md) vars[`--${prefix}-md`] = span.md;\n if (span.lg) vars[`--${prefix}-lg`] = span.lg;\n if (span.xl) vars[`--${prefix}-xl`] = span.xl;\n return vars;\n}\n\n// ============================================\n// BentoGrid Component\n// ============================================\n\nexport const BentoGrid = React.forwardRef<HTMLDivElement, BentoGridProps>(\n function BentoGrid(\n {\n children,\n columns = 3,\n gap = 'md',\n className,\n style,\n ...htmlProps\n },\n ref\n ) {\n const classes = [\n styles.grid,\n styles[`columns${columns}`],\n gapClasses[gap],\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes} style={style}>\n {children}\n </div>\n );\n }\n) as BentoGridComponent;\n\n// ============================================\n// BentoGrid.Item Sub-component\n// ============================================\n\nconst BentoGridItem = React.forwardRef<HTMLDivElement, BentoGridItemProps>(\n function BentoGridItem(\n {\n children,\n colSpan,\n rowSpan,\n className,\n style,\n ...htmlProps\n },\n ref\n ) {\n const spanVars = {\n ...getSpanVars(colSpan, 'bento-col-span'),\n ...getSpanVars(rowSpan, 'bento-row-span'),\n };\n\n const hasVars = Object.keys(spanVars).length > 0;\n const inlineStyle = hasVars\n ? ({ ...(spanVars as unknown as React.CSSProperties), ...style } as React.CSSProperties)\n : style;\n\n const classes = [styles.item, className].filter(Boolean).join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes} style={inlineStyle}>\n {children}\n </div>\n );\n }\n);\n\n// ============================================\n// Compound component type\n// ============================================\n\ninterface BentoGridComponent\n extends React.ForwardRefExoticComponent<BentoGridProps & React.RefAttributes<HTMLDivElement>> {\n Item: typeof BentoGridItem;\n}\n\n(BentoGrid as BentoGridComponent).Item = BentoGridItem;\n"],"names":["styles","React","BentoGrid","jsx","BentoGridItem"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAM,aAAiE;AAAA,EACrE,MAAMA,iBAAAA,QAAO;AAAA,EACb,IAAIA,iBAAAA,QAAO;AAAA,EACX,IAAIA,iBAAAA,QAAO;AAAA,EACX,IAAIA,iBAAAA,QAAO;AAAA,EACX,IAAIA,iBAAAA,QAAO;AAAA,EACX,IAAIA,iBAAAA,QAAO;AACb;AAEA,SAAS,YACP,MACA,QACwB;AACxB,MAAI,CAAC,QAAQ,SAAS,UAAU,CAAA;AAChC,MAAI,OAAO,SAAS,SAAU,QAAO,EAAE,CAAC,KAAK,MAAM,EAAE,GAAG,KAAA;AACxD,QAAM,OAA+B,CAAA;AACrC,MAAI,KAAK,QAAQ,KAAK,OAAO,QAAQ,KAAK,MAAM,EAAE,IAAI,KAAK;AAC3D,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,SAAO;AACT;AAMO,MAAM,YAAYC,iBAAM;AAAA,EAC7B,SAASC,WACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU;AAAA,MACdF,iBAAAA,QAAO;AAAA,MACPA,iBAAAA,QAAO,UAAU,OAAO,EAAE;AAAA,MAC1B,WAAW,GAAG;AAAA,MACd;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACEG,2BAAAA,IAAC,SAAI,KAAW,GAAG,WAAW,WAAW,SAAS,OAC/C,UACH;AAAA,EAEJ;AACF;AAMA,MAAM,gBAAgBF,iBAAM;AAAA,EAC1B,SAASG,eACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,WAAW;AAAA,MACf,GAAG,YAAY,SAAS,gBAAgB;AAAA,MACxC,GAAG,YAAY,SAAS,gBAAgB;AAAA,IAAA;AAG1C,UAAM,UAAU,OAAO,KAAK,QAAQ,EAAE,SAAS;AAC/C,UAAM,cAAc,UACf,EAAE,GAAI,UAA6C,GAAG,UACvD;AAEJ,UAAM,UAAU,CAACJ,iBAAAA,QAAO,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEjE,WACEG,+BAAC,SAAI,KAAW,GAAG,WAAW,WAAW,SAAS,OAAO,aACtD,SAAA,CACH;AAAA,EAEJ;AACF;AAWC,UAAiC,OAAO;;"}

package/dist/components/BentoGrid/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/BentoGrid/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './BentoGrid.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\ntype SpanValue = 1 | 2 | 3;\n\nexport interface ResponsiveSpan {\n /** Default (mobile-first) */\n base?: SpanValue;\n /** ≥640px */\n sm?: SpanValue;\n /** ≥768px */\n md?: SpanValue;\n /** ≥1024px */\n lg?: SpanValue;\n /** ≥1280px */\n xl?: SpanValue;\n}\n\nexport interface BentoGridProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n /** Number of columns (default: 3) — auto-collapses responsively */\n columns?: 2 | 3 | 4;\n /** Gap between grid items */\n gap?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n}\n\nexport interface BentoGridItemProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode;\n /** Columns to span — number for all breakpoints, object for per-breakpoint */\n colSpan?: SpanValue | ResponsiveSpan;\n /** Rows to span — number for all breakpoints, object for per-breakpoint */\n rowSpan?: SpanValue | ResponsiveSpan;\n}\n\n// ============================================\n// Helpers\n// ============================================\n\nconst gapClasses: Record<NonNullable<BentoGridProps['gap']>, string> = {\n none: styles.gapNone,\n xs: styles.gapXs,\n sm: styles.gapSm,\n md: styles.gapMd,\n lg: styles.gapLg,\n xl: styles.gapXl,\n};\n\nfunction getSpanVars(\n span: SpanValue | ResponsiveSpan | undefined,\n prefix: string\n): Record<string, number> {\n if (!span || span === 1) return {};\n if (typeof span === 'number') return { [`--${prefix}`]: span };\n const vars: Record<string, number> = {};\n if (span.base && span.base > 1) vars[`--${prefix}`] = span.base;\n if (span.sm) vars[`--${prefix}-sm`] = span.sm;\n if (span.md) vars[`--${prefix}-md`] = span.md;\n if (span.lg) vars[`--${prefix}-lg`] = span.lg;\n if (span.xl) vars[`--${prefix}-xl`] = span.xl;\n return vars;\n}\n\n// ============================================\n// BentoGrid Component\n// ============================================\n\nexport const BentoGrid = React.forwardRef<HTMLDivElement, BentoGridProps>(\n function BentoGrid(\n {\n children,\n columns = 3,\n gap = 'md',\n className,\n style,\n ...htmlProps\n },\n ref\n ) {\n const classes = [\n styles.grid,\n styles[`columns${columns}`],\n gapClasses[gap],\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes} style={style}>\n {children}\n </div>\n );\n }\n) as BentoGridComponent;\n\n// ============================================\n// BentoGrid.Item Sub-component\n// ============================================\n\nconst BentoGridItem = React.forwardRef<HTMLDivElement, BentoGridItemProps>(\n function BentoGridItem(\n {\n children,\n colSpan,\n rowSpan,\n className,\n style,\n ...htmlProps\n },\n ref\n ) {\n const spanVars = {\n ...getSpanVars(colSpan, 'bento-col-span'),\n ...getSpanVars(rowSpan, 'bento-row-span'),\n };\n\n const hasVars = Object.keys(spanVars).length > 0;\n const inlineStyle = hasVars\n ? ({ ...(spanVars as unknown as React.CSSProperties), ...style } as React.CSSProperties)\n : style;\n\n const classes = [styles.item, className].filter(Boolean).join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes} style={inlineStyle}>\n {children}\n </div>\n );\n }\n);\n\n// ============================================\n// Compound component type\n// ============================================\n\ninterface BentoGridComponent\n extends React.ForwardRefExoticComponent<BentoGridProps & React.RefAttributes<HTMLDivElement>> {\n Item: typeof BentoGridItem;\n}\n\n(BentoGrid as BentoGridComponent).Item = BentoGridItem;\n"],"names":["BentoGrid","BentoGridItem"],"mappings":";;;AA0CA,MAAM,aAAiE;AAAA,EACrE,MAAM,OAAO;AAAA,EACb,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AACb;AAEA,SAAS,YACP,MACA,QACwB;AACxB,MAAI,CAAC,QAAQ,SAAS,UAAU,CAAA;AAChC,MAAI,OAAO,SAAS,SAAU,QAAO,EAAE,CAAC,KAAK,MAAM,EAAE,GAAG,KAAA;AACxD,QAAM,OAA+B,CAAA;AACrC,MAAI,KAAK,QAAQ,KAAK,OAAO,QAAQ,KAAK,MAAM,EAAE,IAAI,KAAK;AAC3D,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,MAAI,KAAK,GAAI,MAAK,KAAK,MAAM,KAAK,IAAI,KAAK;AAC3C,SAAO;AACT;AAMO,MAAM,YAAY,MAAM;AAAA,EAC7B,SAASA,WACP;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV,MAAM;AAAA,IACN;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU;AAAA,MACd,OAAO;AAAA,MACP,OAAO,UAAU,OAAO,EAAE;AAAA,MAC1B,WAAW,GAAG;AAAA,MACd;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACE,oBAAC,SAAI,KAAW,GAAG,WAAW,WAAW,SAAS,OAC/C,UACH;AAAA,EAEJ;AACF;AAMA,MAAM,gBAAgB,MAAM;AAAA,EAC1B,SAASC,eACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,WAAW;AAAA,MACf,GAAG,YAAY,SAAS,gBAAgB;AAAA,MACxC,GAAG,YAAY,SAAS,gBAAgB;AAAA,IAAA;AAG1C,UAAM,UAAU,OAAO,KAAK,QAAQ,EAAE,SAAS;AAC/C,UAAM,cAAc,UACf,EAAE,GAAI,UAA6C,GAAG,UACvD;AAEJ,UAAM,UAAU,CAAC,OAAO,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEjE,WACE,oBAAC,SAAI,KAAW,GAAG,WAAW,WAAW,SAAS,OAAO,aACtD,SAAA,CACH;AAAA,EAEJ;AACF;AAWC,UAAiC,OAAO;"}

package/dist/components/Box/Box.module.scss.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"Box.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Box/Box.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Box.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Box/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Box/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './Box.module.scss';\n\nexport interface BoxProps extends Omit<React.HTMLAttributes<HTMLElement>, 'color'> {\n children?: React.ReactNode;\n /** HTML element to render */\n as?: 'div' | 'section' | 'article' | 'aside' | 'main' | 'header' | 'footer' | 'nav' | 'span';\n /** Padding on all sides */\n padding?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n /** Horizontal padding (overrides padding) */\n paddingX?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n /** Vertical padding (overrides padding) */\n paddingY?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n /** Margin on all sides */\n margin?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto';\n /** Horizontal margin (overrides margin) */\n marginX?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto';\n /** Vertical margin (overrides margin) */\n marginY?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto';\n /** Background color */\n background?: 'none' | 'primary' | 'secondary' | 'tertiary' | 'elevated';\n /** Border radius */\n rounded?: 'none' | 'sm' | 'md' | 'lg' | 'full';\n /** Border */\n border?: boolean;\n /** Top border */\n borderTop?: boolean;\n /** Bottom border */\n borderBottom?: boolean;\n /** Left border */\n borderLeft?: boolean;\n /** Right border */\n borderRight?: boolean;\n /** Border color variant */\n borderColor?: 'default' | 'strong' | 'accent' | 'danger';\n /** Box shadow */\n shadow?: 'sm' | 'md' | 'lg' | 'none';\n /** Overflow behavior */\n overflow?: 'hidden' | 'auto' | 'scroll' | 'visible';\n /** Text color */\n color?: 'primary' | 'secondary' | 'tertiary' | 'accent' | 'inverse';\n /** Display type */\n display?: 'block' | 'inline' | 'inline-block' | 'flex' | 'inline-flex' | 'grid' | 'none';\n /** Width (CSS value, e.g. \"100%\", \"300px\", 200) */\n width?: string | number;\n /** Min width */\n minWidth?: string | number;\n /** Max width */\n maxWidth?: string | number;\n /** Height (CSS value, e.g. \"100%\", \"300px\", 200) */\n height?: string | number;\n /** Min height */\n minHeight?: string | number;\n /** Max height */\n maxHeight?: string | number;\n /** Additional class name */\n className?: string;\n /** Inline styles */\n style?: React.CSSProperties;\n}\n\n/** Convert string | number to CSS value */\nfunction toCss(value: string | number): string {\n return typeof value === 'number' ? `${value}px` : value;\n}\n\nconst BoxRoot = React.forwardRef<HTMLElement, BoxProps>(\n function Box(\n {\n children,\n as: Component = 'div',\n padding,\n paddingX,\n paddingY,\n margin,\n marginX,\n marginY,\n background,\n rounded,\n border,\n borderTop,\n borderBottom,\n borderLeft,\n borderRight,\n borderColor,\n shadow,\n overflow,\n color,\n display,\n width,\n minWidth,\n maxWidth,\n height,\n minHeight,\n maxHeight,\n className,\n style,\n ...htmlProps\n },\n ref\n ) {\n const classes = [\n styles.box,\n padding && styles[`p-${padding}`],\n paddingX && styles[`px-${paddingX}`],\n paddingY && styles[`py-${paddingY}`],\n margin && styles[`m-${margin}`],\n marginX && styles[`mx-${marginX}`],\n marginY && styles[`my-${marginY}`],\n background && styles[`bg-${background}`],\n rounded && styles[`rounded-${rounded}`],\n border && styles.border,\n borderTop && styles.borderTop,\n borderBottom && styles.borderBottom,\n borderLeft && styles.borderLeft,\n borderRight && styles.borderRight,\n borderColor && styles[`borderColor-${borderColor}`],\n shadow && styles[`shadow-${shadow}`],\n overflow && styles[`overflow-${overflow}`],\n color && styles[`color-${color}`],\n display && styles[`display-${display}`],\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // Build sizing styles only when props are provided\n const sizingStyle: React.CSSProperties = {};\n if (width != null) sizingStyle.width = toCss(width);\n if (minWidth != null) sizingStyle.minWidth = toCss(minWidth);\n if (maxWidth != null) sizingStyle.maxWidth = toCss(maxWidth);\n if (height != null) sizingStyle.height = toCss(height);\n if (minHeight != null) sizingStyle.minHeight = toCss(minHeight);\n if (maxHeight != null) sizingStyle.maxHeight = toCss(maxHeight);\n\n const hasSizing = Object.keys(sizingStyle).length > 0;\n const mergedStyle = hasSizing ? { ...sizingStyle, ...style } : style;\n\n return (\n <Component\n ref={ref as React.Ref<never>}\n {...htmlProps}\n className={classes}\n style={mergedStyle}\n >\n {children}\n </Component>\n );\n }\n);\n\nexport const Box = Object.assign(BoxRoot, {\n Root: BoxRoot,\n});\n"],"names":["React","Box","styles","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA8DA,SAAS,MAAM,OAAgC;AAC7C,SAAO,OAAO,UAAU,WAAW,GAAG,KAAK,OAAO;AACpD;AAEA,MAAM,UAAUA,iBAAM;AAAA,EACpB,SAASC,KACP;AAAA,IACE;AAAA,IACA,IAAI,YAAY;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU;AAAA,MACdC,WAAAA,QAAO;AAAA,MACP,WAAWA,WAAAA,QAAO,KAAK,OAAO,EAAE;AAAA,MAChC,YAAYA,WAAAA,QAAO,MAAM,QAAQ,EAAE;AAAA,MACnC,YAAYA,WAAAA,QAAO,MAAM,QAAQ,EAAE;AAAA,MACnC,UAAUA,WAAAA,QAAO,KAAK,MAAM,EAAE;AAAA,MAC9B,WAAWA,WAAAA,QAAO,MAAM,OAAO,EAAE;AAAA,MACjC,WAAWA,WAAAA,QAAO,MAAM,OAAO,EAAE;AAAA,MACjC,cAAcA,WAAAA,QAAO,MAAM,UAAU,EAAE;AAAA,MACvC,WAAWA,WAAAA,QAAO,WAAW,OAAO,EAAE;AAAA,MACtC,UAAUA,WAAAA,QAAO;AAAA,MACjB,aAAaA,WAAAA,QAAO;AAAA,MACpB,gBAAgBA,WAAAA,QAAO;AAAA,MACvB,cAAcA,WAAAA,QAAO;AAAA,MACrB,eAAeA,WAAAA,QAAO;AAAA,MACtB,eAAeA,WAAAA,QAAO,eAAe,WAAW,EAAE;AAAA,MAClD,UAAUA,WAAAA,QAAO,UAAU,MAAM,EAAE;AAAA,MACnC,YAAYA,WAAAA,QAAO,YAAY,QAAQ,EAAE;AAAA,MACzC,SAASA,WAAAA,QAAO,SAAS,KAAK,EAAE;AAAA,MAChC,WAAWA,WAAAA,QAAO,WAAW,OAAO,EAAE;AAAA,MACtC;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,UAAM,cAAmC,CAAA;AACzC,QAAI,SAAS,KAAM,aAAY,QAAQ,MAAM,KAAK;AAClD,QAAI,YAAY,KAAM,aAAY,WAAW,MAAM,QAAQ;AAC3D,QAAI,YAAY,KAAM,aAAY,WAAW,MAAM,QAAQ;AAC3D,QAAI,UAAU,KAAM,aAAY,SAAS,MAAM,MAAM;AACrD,QAAI,aAAa,KAAM,aAAY,YAAY,MAAM,SAAS;AAC9D,QAAI,aAAa,KAAM,aAAY,YAAY,MAAM,SAAS;AAE9D,UAAM,YAAY,OAAO,KAAK,WAAW,EAAE,SAAS;AACpD,UAAM,cAAc,YAAY,EAAE,GAAG,aAAa,GAAG,UAAU;AAE/D,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACC,GAAG;AAAA,QACJ,WAAW;AAAA,QACX,OAAO;AAAA,QAEN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEO,MAAM,MAAM,OAAO,OAAO,SAAS;AAAA,EACxC,MAAM;AACR,CAAC;;"}

package/dist/components/Box/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Box/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './Box.module.scss';\n\nexport interface BoxProps extends Omit<React.HTMLAttributes<HTMLElement>, 'color'> {\n children?: React.ReactNode;\n /** HTML element to render */\n as?: 'div' | 'section' | 'article' | 'aside' | 'main' | 'header' | 'footer' | 'nav' | 'span';\n /** Padding on all sides */\n padding?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n /** Horizontal padding (overrides padding) */\n paddingX?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n /** Vertical padding (overrides padding) */\n paddingY?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n /** Margin on all sides */\n margin?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto';\n /** Horizontal margin (overrides margin) */\n marginX?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto';\n /** Vertical margin (overrides margin) */\n marginY?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto';\n /** Background color */\n background?: 'none' | 'primary' | 'secondary' | 'tertiary' | 'elevated';\n /** Border radius */\n rounded?: 'none' | 'sm' | 'md' | 'lg' | 'full';\n /** Border */\n border?: boolean;\n /** Top border */\n borderTop?: boolean;\n /** Bottom border */\n borderBottom?: boolean;\n /** Left border */\n borderLeft?: boolean;\n /** Right border */\n borderRight?: boolean;\n /** Border color variant */\n borderColor?: 'default' | 'strong' | 'accent' | 'danger';\n /** Box shadow */\n shadow?: 'sm' | 'md' | 'lg' | 'none';\n /** Overflow behavior */\n overflow?: 'hidden' | 'auto' | 'scroll' | 'visible';\n /** Text color */\n color?: 'primary' | 'secondary' | 'tertiary' | 'accent' | 'inverse';\n /** Display type */\n display?: 'block' | 'inline' | 'inline-block' | 'flex' | 'inline-flex' | 'grid' | 'none';\n /** Width (CSS value, e.g. \"100%\", \"300px\", 200) */\n width?: string | number;\n /** Min width */\n minWidth?: string | number;\n /** Max width */\n maxWidth?: string | number;\n /** Height (CSS value, e.g. \"100%\", \"300px\", 200) */\n height?: string | number;\n /** Min height */\n minHeight?: string | number;\n /** Max height */\n maxHeight?: string | number;\n /** Additional class name */\n className?: string;\n /** Inline styles */\n style?: React.CSSProperties;\n}\n\n/** Convert string | number to CSS value */\nfunction toCss(value: string | number): string {\n return typeof value === 'number' ? `${value}px` : value;\n}\n\nconst BoxRoot = React.forwardRef<HTMLElement, BoxProps>(\n function Box(\n {\n children,\n as: Component = 'div',\n padding,\n paddingX,\n paddingY,\n margin,\n marginX,\n marginY,\n background,\n rounded,\n border,\n borderTop,\n borderBottom,\n borderLeft,\n borderRight,\n borderColor,\n shadow,\n overflow,\n color,\n display,\n width,\n minWidth,\n maxWidth,\n height,\n minHeight,\n maxHeight,\n className,\n style,\n ...htmlProps\n },\n ref\n ) {\n const classes = [\n styles.box,\n padding && styles[`p-${padding}`],\n paddingX && styles[`px-${paddingX}`],\n paddingY && styles[`py-${paddingY}`],\n margin && styles[`m-${margin}`],\n marginX && styles[`mx-${marginX}`],\n marginY && styles[`my-${marginY}`],\n background && styles[`bg-${background}`],\n rounded && styles[`rounded-${rounded}`],\n border && styles.border,\n borderTop && styles.borderTop,\n borderBottom && styles.borderBottom,\n borderLeft && styles.borderLeft,\n borderRight && styles.borderRight,\n borderColor && styles[`borderColor-${borderColor}`],\n shadow && styles[`shadow-${shadow}`],\n overflow && styles[`overflow-${overflow}`],\n color && styles[`color-${color}`],\n display && styles[`display-${display}`],\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // Build sizing styles only when props are provided\n const sizingStyle: React.CSSProperties = {};\n if (width != null) sizingStyle.width = toCss(width);\n if (minWidth != null) sizingStyle.minWidth = toCss(minWidth);\n if (maxWidth != null) sizingStyle.maxWidth = toCss(maxWidth);\n if (height != null) sizingStyle.height = toCss(height);\n if (minHeight != null) sizingStyle.minHeight = toCss(minHeight);\n if (maxHeight != null) sizingStyle.maxHeight = toCss(maxHeight);\n\n const hasSizing = Object.keys(sizingStyle).length > 0;\n const mergedStyle = hasSizing ? { ...sizingStyle, ...style } : style;\n\n return (\n <Component\n ref={ref as React.Ref<never>}\n {...htmlProps}\n className={classes}\n style={mergedStyle}\n >\n {children}\n </Component>\n );\n }\n);\n\nexport const Box = Object.assign(BoxRoot, {\n Root: BoxRoot,\n});\n"],"names":["Box"],"mappings":";;;AA8DA,SAAS,MAAM,OAAgC;AAC7C,SAAO,OAAO,UAAU,WAAW,GAAG,KAAK,OAAO;AACpD;AAEA,MAAM,UAAU,MAAM;AAAA,EACpB,SAASA,KACP;AAAA,IACE;AAAA,IACA,IAAI,YAAY;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU;AAAA,MACd,OAAO;AAAA,MACP,WAAW,OAAO,KAAK,OAAO,EAAE;AAAA,MAChC,YAAY,OAAO,MAAM,QAAQ,EAAE;AAAA,MACnC,YAAY,OAAO,MAAM,QAAQ,EAAE;AAAA,MACnC,UAAU,OAAO,KAAK,MAAM,EAAE;AAAA,MAC9B,WAAW,OAAO,MAAM,OAAO,EAAE;AAAA,MACjC,WAAW,OAAO,MAAM,OAAO,EAAE;AAAA,MACjC,cAAc,OAAO,MAAM,UAAU,EAAE;AAAA,MACvC,WAAW,OAAO,WAAW,OAAO,EAAE;AAAA,MACtC,UAAU,OAAO;AAAA,MACjB,aAAa,OAAO;AAAA,MACpB,gBAAgB,OAAO;AAAA,MACvB,cAAc,OAAO;AAAA,MACrB,eAAe,OAAO;AAAA,MACtB,eAAe,OAAO,eAAe,WAAW,EAAE;AAAA,MAClD,UAAU,OAAO,UAAU,MAAM,EAAE;AAAA,MACnC,YAAY,OAAO,YAAY,QAAQ,EAAE;AAAA,MACzC,SAAS,OAAO,SAAS,KAAK,EAAE;AAAA,MAChC,WAAW,OAAO,WAAW,OAAO,EAAE;AAAA,MACtC;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,UAAM,cAAmC,CAAA;AACzC,QAAI,SAAS,KAAM,aAAY,QAAQ,MAAM,KAAK;AAClD,QAAI,YAAY,KAAM,aAAY,WAAW,MAAM,QAAQ;AAC3D,QAAI,YAAY,KAAM,aAAY,WAAW,MAAM,QAAQ;AAC3D,QAAI,UAAU,KAAM,aAAY,SAAS,MAAM,MAAM;AACrD,QAAI,aAAa,KAAM,aAAY,YAAY,MAAM,SAAS;AAC9D,QAAI,aAAa,KAAM,aAAY,YAAY,MAAM,SAAS;AAE9D,UAAM,YAAY,OAAO,KAAK,WAAW,EAAE,SAAS;AACpD,UAAM,cAAc,YAAY,EAAE,GAAG,aAAa,GAAG,UAAU;AAE/D,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACC,GAAG;AAAA,QACJ,WAAW;AAAA,QACX,OAAO;AAAA,QAEN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEO,MAAM,MAAM,OAAO,OAAO,SAAS;AAAA,EACxC,MAAM;AACR,CAAC;"}

package/dist/components/Breadcrumbs/Breadcrumbs.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Breadcrumbs.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Breadcrumbs/Breadcrumbs.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Breadcrumbs.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;"}

package/dist/components/Breadcrumbs/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Breadcrumbs/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Breadcrumbs.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport interface BreadcrumbsProps extends React.HTMLAttributes<HTMLElement> {\n children: React.ReactNode;\n /** Custom separator between items (default: '/') */\n separator?: React.ReactNode;\n /** Maximum visible items before collapsing middle items with ellipsis */\n maxItems?: number;\n /** Accessible label for the breadcrumb nav landmark (default: \"Breadcrumb\") */\n label?: string;\n}\n\nexport interface BreadcrumbsItemProps extends React.HTMLAttributes<HTMLLIElement> {\n children: React.ReactNode;\n /** URL to navigate to (renders <a> if provided) */\n href?: string;\n /** Icon element to display before the label */\n icon?: React.ReactNode;\n /** Marks this item as the current page */\n current?: boolean;\n}\n\nexport interface BreadcrumbsSeparatorProps {\n children?: React.ReactNode;\n className?: string;\n}\n\n// ============================================\n// Context for separator\n// ============================================\n\nconst BreadcrumbsSeparatorContext = React.createContext<React.ReactNode>('/');\n\n// ============================================\n// Components\n// ============================================\n\nfunction BreadcrumbsRoot({\n children,\n separator = '/',\n maxItems,\n label = 'Breadcrumb',\n className,\n 'aria-label': ariaLabel,\n ...htmlProps\n}: BreadcrumbsProps) {\n const classes = [styles.root, className].filter(Boolean).join(' ');\n\n let items = React.Children.toArray(children).filter(React.isValidElement);\n\n // Collapse middle items if maxItems is set\n let collapsed = false;\n let collapsedItems: React.ReactElement[] = [];\n if (maxItems != null && maxItems > 1 && items.length > maxItems) {\n collapsed = true;\n const first = items.slice(0, 1);\n const last = items.slice(-(maxItems - 1));\n collapsedItems = items.slice(1, items.length - (maxItems - 1)) as React.ReactElement[];\n items = [...first, ...last];\n }\n\n return (\n <BreadcrumbsSeparatorContext.Provider value={separator}>\n <nav {...htmlProps} aria-label={ariaLabel ?? label} className={classes}>\n <ol className={styles.list}>\n {items.map((item, index) => {\n const isFirst = index === 0;\n const showEllipsis = collapsed && index === 1;\n\n return (\n <React.Fragment key={(item as React.ReactElement).key ?? index}>\n {!isFirst && (\n <li role=\"presentation\" aria-hidden=\"true\" className={styles.separator}>\n {separator}\n </li>\n )}\n {showEllipsis && (\n <EllipsisItem items={collapsedItems} separator={separator} />\n )}\n {item}\n </React.Fragment>\n );\n })}\n </ol>\n </nav>\n </BreadcrumbsSeparatorContext.Provider>\n );\n}\n\nfunction EllipsisItem({\n items,\n separator,\n}: {\n items: React.ReactElement[];\n separator: React.ReactNode;\n}) {\n const [expanded, setExpanded] = React.useState(false);\n\n if (expanded) {\n return (\n <>\n {items.map((item, i) => (\n <React.Fragment key={item.key ?? `collapsed-${i}`}>\n {item}\n <li role=\"presentation\" aria-hidden=\"true\" className={styles.separator}>\n {separator}\n </li>\n </React.Fragment>\n ))}\n </>\n );\n }\n\n return (\n <>\n <li className={styles.item}>\n <button\n type=\"button\"\n className={styles.ellipsis}\n aria-label=\"Show collapsed breadcrumbs\"\n onClick={() => setExpanded(true)}\n >\n …\n </button>\n </li>\n <li role=\"presentation\" aria-hidden=\"true\" className={styles.separator}>\n {separator}\n </li>\n </>\n );\n}\n\nfunction BreadcrumbsItem({\n children,\n href,\n icon,\n current = false,\n className,\n ...htmlProps\n}: BreadcrumbsItemProps) {\n const classes = [styles.item, className].filter(Boolean).join(' ');\n\n const iconEl = icon ? <span className={styles.icon}>{icon}</span> : null;\n\n if (current) {\n return (\n <li className={classes} {...htmlProps}>\n <span className={styles.current} aria-current=\"page\">\n {iconEl}\n {children}\n </span>\n </li>\n );\n }\n\n if (href) {\n return (\n <li className={classes} {...htmlProps}>\n <a href={href} className={styles.link}>\n {iconEl}\n {children}\n </a>\n </li>\n );\n }\n\n return (\n <li className={classes} {...htmlProps}>\n <span className={styles.link}>\n {iconEl}\n {children}\n </span>\n </li>\n );\n}\n\nfunction BreadcrumbsSeparator({ children, className }: BreadcrumbsSeparatorProps) {\n const defaultSeparator = React.useContext(BreadcrumbsSeparatorContext);\n const classes = [styles.separator, className].filter(Boolean).join(' ');\n\n return (\n <span className={classes} role=\"presentation\" aria-hidden=\"true\">\n {children ?? defaultSeparator}\n </span>\n );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const Breadcrumbs = Object.assign(BreadcrumbsRoot, {\n Item: BreadcrumbsItem,\n Separator: BreadcrumbsSeparator,\n});\n\n// Re-export individual components\nexport { BreadcrumbsRoot, BreadcrumbsItem, BreadcrumbsSeparator };\n"],"names":["React","styles","jsx","jsxs","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsCA,MAAM,8BAA8BA,iBAAM,cAA+B,GAAG;AAM5E,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAAqB;AACnB,QAAM,UAAU,CAACC,mBAAAA,QAAO,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEjE,MAAI,QAAQD,iBAAM,SAAS,QAAQ,QAAQ,EAAE,OAAOA,iBAAM,cAAc;AAGxE,MAAI,YAAY;AAChB,MAAI,iBAAuC,CAAA;AAC3C,MAAI,YAAY,QAAQ,WAAW,KAAK,MAAM,SAAS,UAAU;AAC/D,gBAAY;AACZ,UAAM,QAAQ,MAAM,MAAM,GAAG,CAAC;AAC9B,UAAM,OAAO,MAAM,MAAM,EAAE,WAAW,EAAE;AACxC,qBAAiB,MAAM,MAAM,GAAG,MAAM,UAAU,WAAW,EAAE;AAC7D,YAAQ,CAAC,GAAG,OAAO,GAAG,IAAI;AAAA,EAC5B;AAEA,SACEE,2BAAAA,IAAC,4BAA4B,UAA5B,EAAqC,OAAO,WAC3C,UAAAA,2BAAAA,IAAC,OAAA,EAAK,GAAG,WAAW,cAAY,aAAa,OAAO,WAAW,SAC7D,UAAAA,2BAAAA,IAAC,MAAA,EAAG,WAAWD,mBAAAA,QAAO,MACnB,UAAA,MAAM,IAAI,CAAC,MAAM,UAAU;AAC1B,UAAM,UAAU,UAAU;AAC1B,UAAM,eAAe,aAAa,UAAU;AAE5C,WACEE,gCAACH,iBAAM,UAAN,EACE,UAAA;AAAA,MAAA,CAAC,WACAE,2BAAAA,IAAC,MAAA,EAAG,MAAK,gBAAe,eAAY,QAAO,WAAWD,mBAAAA,QAAO,WAC1D,UAAA,UAAA,CACH;AAAA,MAED,gBACCC,2BAAAA,IAAC,cAAA,EAAa,OAAO,gBAAgB,WAAsB;AAAA,MAE5D;AAAA,IAAA,KATmB,KAA4B,OAAO,KAUzD;AAAA,EAEJ,CAAC,EAAA,CACH,EAAA,CACF,GACF;AAEJ;AAEA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA;AACF,GAGG;AACD,QAAM,CAAC,UAAU,WAAW,IAAIF,iBAAM,SAAS,KAAK;AAEpD,MAAI,UAAU;AACZ,WACEE,2BAAAA,IAAAE,WAAAA,UAAA,EACG,gBAAM,IAAI,CAAC,MAAM,MAChBD,2BAAAA,KAACH,iBAAM,UAAN,EACE,UAAA;AAAA,MAAA;AAAA,MACDE,2BAAAA,IAAC,QAAG,MAAK,gBAAe,eAAY,QAAO,WAAWD,mBAAAA,QAAO,WAC1D,UAAA,UAAA,CACH;AAAA,IAAA,EAAA,GAJmB,KAAK,OAAO,aAAa,CAAC,EAK/C,CACD,GACH;AAAA,EAEJ;AAEA,SACEE,2BAAAA,KAAAC,qBAAA,EACE,UAAA;AAAA,IAAAF,2BAAAA,IAAC,MAAA,EAAG,WAAWD,mBAAAA,QAAO,MACpB,UAAAC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAWD,mBAAAA,QAAO;AAAA,QAClB,cAAW;AAAA,QACX,SAAS,MAAM,YAAY,IAAI;AAAA,QAChC,UAAA;AAAA,MAAA;AAAA,IAAA,GAGH;AAAA,IACAC,2BAAAA,IAAC,QAAG,MAAK,gBAAe,eAAY,QAAO,WAAWD,mBAAAA,QAAO,WAC1D,UAAA,UAAA,CACH;AAAA,EAAA,GACF;AAEJ;AAEA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,GAAG;AACL,GAAyB;AACvB,QAAM,UAAU,CAACA,mBAAAA,QAAO,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEjE,QAAM,SAAS,OAAOC,2BAAAA,IAAC,QAAA,EAAK,WAAWD,mBAAAA,QAAO,MAAO,gBAAK,IAAU;AAEpE,MAAI,SAAS;AACX,WACEC,2BAAAA,IAAC,MAAA,EAAG,WAAW,SAAU,GAAG,WAC1B,UAAAC,2BAAAA,KAAC,QAAA,EAAK,WAAWF,mBAAAA,QAAO,SAAS,gBAAa,QAC3C,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,EAAA,CACH,EAAA,CACF;AAAA,EAEJ;AAEA,MAAI,MAAM;AACR,WACEC,2BAAAA,IAAC,MAAA,EAAG,WAAW,SAAU,GAAG,WAC1B,UAAAC,2BAAAA,KAAC,KAAA,EAAE,MAAY,WAAWF,mBAAAA,QAAO,MAC9B,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,EAAA,CACH,EAAA,CACF;AAAA,EAEJ;AAEA,SACEC,2BAAAA,IAAC,MAAA,EAAG,WAAW,SAAU,GAAG,WAC1B,UAAAC,2BAAAA,KAAC,QAAA,EAAK,WAAWF,mBAAAA,QAAO,MACrB,UAAA;AAAA,IAAA;AAAA,IACA;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAEJ;AAEA,SAAS,qBAAqB,EAAE,UAAU,aAAwC;AAChF,QAAM,mBAAmBD,iBAAM,WAAW,2BAA2B;AACrE,QAAM,UAAU,CAACC,mBAAAA,QAAO,WAAW,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAEtE,SACEC,2BAAAA,IAAC,UAAK,WAAW,SAAS,MAAK,gBAAe,eAAY,QACvD,UAAA,YAAY,iBAAA,CACf;AAEJ;AAMO,MAAM,cAAc,OAAO,OAAO,iBAAiB;AAAA,EACxD,MAAM;AAAA,EACN,WAAW;AACb,CAAC;;;;;"}

package/dist/components/Breadcrumbs/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Breadcrumbs/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Breadcrumbs.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport interface BreadcrumbsProps extends React.HTMLAttributes<HTMLElement> {\n children: React.ReactNode;\n /** Custom separator between items (default: '/') */\n separator?: React.ReactNode;\n /** Maximum visible items before collapsing middle items with ellipsis */\n maxItems?: number;\n /** Accessible label for the breadcrumb nav landmark (default: \"Breadcrumb\") */\n label?: string;\n}\n\nexport interface BreadcrumbsItemProps extends React.HTMLAttributes<HTMLLIElement> {\n children: React.ReactNode;\n /** URL to navigate to (renders <a> if provided) */\n href?: string;\n /** Icon element to display before the label */\n icon?: React.ReactNode;\n /** Marks this item as the current page */\n current?: boolean;\n}\n\nexport interface BreadcrumbsSeparatorProps {\n children?: React.ReactNode;\n className?: string;\n}\n\n// ============================================\n// Context for separator\n// ============================================\n\nconst BreadcrumbsSeparatorContext = React.createContext<React.ReactNode>('/');\n\n// ============================================\n// Components\n// ============================================\n\nfunction BreadcrumbsRoot({\n children,\n separator = '/',\n maxItems,\n label = 'Breadcrumb',\n className,\n 'aria-label': ariaLabel,\n ...htmlProps\n}: BreadcrumbsProps) {\n const classes = [styles.root, className].filter(Boolean).join(' ');\n\n let items = React.Children.toArray(children).filter(React.isValidElement);\n\n // Collapse middle items if maxItems is set\n let collapsed = false;\n let collapsedItems: React.ReactElement[] = [];\n if (maxItems != null && maxItems > 1 && items.length > maxItems) {\n collapsed = true;\n const first = items.slice(0, 1);\n const last = items.slice(-(maxItems - 1));\n collapsedItems = items.slice(1, items.length - (maxItems - 1)) as React.ReactElement[];\n items = [...first, ...last];\n }\n\n return (\n <BreadcrumbsSeparatorContext.Provider value={separator}>\n <nav {...htmlProps} aria-label={ariaLabel ?? label} className={classes}>\n <ol className={styles.list}>\n {items.map((item, index) => {\n const isFirst = index === 0;\n const showEllipsis = collapsed && index === 1;\n\n return (\n <React.Fragment key={(item as React.ReactElement).key ?? index}>\n {!isFirst && (\n <li role=\"presentation\" aria-hidden=\"true\" className={styles.separator}>\n {separator}\n </li>\n )}\n {showEllipsis && (\n <EllipsisItem items={collapsedItems} separator={separator} />\n )}\n {item}\n </React.Fragment>\n );\n })}\n </ol>\n </nav>\n </BreadcrumbsSeparatorContext.Provider>\n );\n}\n\nfunction EllipsisItem({\n items,\n separator,\n}: {\n items: React.ReactElement[];\n separator: React.ReactNode;\n}) {\n const [expanded, setExpanded] = React.useState(false);\n\n if (expanded) {\n return (\n <>\n {items.map((item, i) => (\n <React.Fragment key={item.key ?? `collapsed-${i}`}>\n {item}\n <li role=\"presentation\" aria-hidden=\"true\" className={styles.separator}>\n {separator}\n </li>\n </React.Fragment>\n ))}\n </>\n );\n }\n\n return (\n <>\n <li className={styles.item}>\n <button\n type=\"button\"\n className={styles.ellipsis}\n aria-label=\"Show collapsed breadcrumbs\"\n onClick={() => setExpanded(true)}\n >\n …\n </button>\n </li>\n <li role=\"presentation\" aria-hidden=\"true\" className={styles.separator}>\n {separator}\n </li>\n </>\n );\n}\n\nfunction BreadcrumbsItem({\n children,\n href,\n icon,\n current = false,\n className,\n ...htmlProps\n}: BreadcrumbsItemProps) {\n const classes = [styles.item, className].filter(Boolean).join(' ');\n\n const iconEl = icon ? <span className={styles.icon}>{icon}</span> : null;\n\n if (current) {\n return (\n <li className={classes} {...htmlProps}>\n <span className={styles.current} aria-current=\"page\">\n {iconEl}\n {children}\n </span>\n </li>\n );\n }\n\n if (href) {\n return (\n <li className={classes} {...htmlProps}>\n <a href={href} className={styles.link}>\n {iconEl}\n {children}\n </a>\n </li>\n );\n }\n\n return (\n <li className={classes} {...htmlProps}>\n <span className={styles.link}>\n {iconEl}\n {children}\n </span>\n </li>\n );\n}\n\nfunction BreadcrumbsSeparator({ children, className }: BreadcrumbsSeparatorProps) {\n const defaultSeparator = React.useContext(BreadcrumbsSeparatorContext);\n const classes = [styles.separator, className].filter(Boolean).join(' ');\n\n return (\n <span className={classes} role=\"presentation\" aria-hidden=\"true\">\n {children ?? defaultSeparator}\n </span>\n );\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const Breadcrumbs = Object.assign(BreadcrumbsRoot, {\n Item: BreadcrumbsItem,\n Separator: BreadcrumbsSeparator,\n});\n\n// Re-export individual components\nexport { BreadcrumbsRoot, BreadcrumbsItem, BreadcrumbsSeparator };\n"],"names":[],"mappings":"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"}

package/dist/components/Button/Button.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Button.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Button/Button.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Button.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Button/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Button/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Button as BaseButton } from '@base-ui/react/button';\nimport styles from './Button.module.scss';\n\n/**\n * Button props.\n * @see https://usefragments.com/components/button\n */\ntype ButtonBaseProps = {\n children: React.ReactNode;\n /** Visual style variant. `\"outline\"` is an alias for `\"outlined\"`. `\"icon\"` is a convenience alias for a ghost icon-only button.\n * @default \"primary\"\n * @see https://usefragments.com/components/button#variants */\n variant?: 'primary' | 'secondary' | 'ghost' | 'danger' | 'outlined' | 'outline' | 'icon';\n /** Button size.\n * @default \"md\"\n * @see https://usefragments.com/components/button#sizes */\n size?: 'sm' | 'md' | 'lg';\n /** Render as icon-only button (square aspect ratio). Prefer `variant=\"icon\"` for the default ghost icon button. */\n icon?: boolean;\n /** Make button full width of container */\n fullWidth?: boolean;\n /** Merge props onto child element instead of rendering a button. Useful for composition with Link components.\n * @see https://usefragments.com/components/button#aschild */\n asChild?: boolean;\n};\n\n// Button as native button element\nexport interface ButtonAsButtonProps\n extends ButtonBaseProps,\n Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {\n as?: 'button';\n}\n\n// Button as anchor element\nexport interface ButtonAsAnchorProps\n extends ButtonBaseProps,\n Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> {\n as: 'a';\n}\n\nexport type ButtonProps = ButtonAsButtonProps | ButtonAsAnchorProps;\n\nconst ButtonRoot = React.forwardRef<\n HTMLButtonElement | HTMLAnchorElement,\n ButtonProps\n>(function Button(props, ref) {\n const {\n children,\n variant: variantProp = 'primary',\n size = 'md',\n icon = false,\n fullWidth = false,\n asChild = false,\n className,\n ...rest\n } = props;\n\n const iconOnly = icon || variantProp === 'icon';\n\n // Resolve aliases:\n // \"outline\" → \"outlined\"\n // \"icon\" → visual \"ghost\" + icon-only sizing\n const variant = variantProp === 'outline'\n ? 'outlined'\n : variantProp === 'icon'\n ? 'ghost'\n : variantProp;\n\n const classNames = [\n styles.button,\n styles[size],\n styles[variant],\n iconOnly && styles.icon,\n fullWidth && styles.fullWidth,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // asChild: merge button styling onto child element (e.g. Next.js Link)\n if (asChild && React.isValidElement(children)) {\n const { as: _as, ...childProps } = rest as ButtonProps & { as?: 'a' | 'button' };\n return React.cloneElement(children as React.ReactElement<Record<string, unknown>>, {\n ...childProps,\n className: [classNames, (children.props as Record<string, unknown>).className].filter(Boolean).join(' '),\n ref,\n });\n }\n\n // Render as anchor\n if (props.as === 'a') {\n const { as: _as, ...anchorProps } = rest as ButtonAsAnchorProps & { as?: 'a' };\n return (\n <a\n ref={ref as React.Ref<HTMLAnchorElement>}\n className={classNames}\n {...anchorProps}\n >\n {children}\n </a>\n );\n }\n\n // Render as button (default)\n const { as: _as, ...buttonProps } = rest as ButtonAsButtonProps;\n return (\n <BaseButton\n ref={ref as React.Ref<HTMLButtonElement>}\n type={(buttonProps as ButtonAsButtonProps).type || 'button'}\n disabled={(buttonProps as ButtonAsButtonProps).disabled || false}\n className={classNames}\n {...buttonProps}\n >\n {children}\n </BaseButton>\n );\n});\n\nexport const Button = Object.assign(ButtonRoot, {\n Root: ButtonRoot,\n});\n"],"names":["React","Button","styles","_as","jsx","BaseButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAM,aAAaA,iBAAM,WAGvB,SAASC,QAAO,OAAO,KAAK;AAC5B,QAAM;AAAA,IACJ;AAAA,IACA,SAAS,cAAc;AAAA,IACvB,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,IACV;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,QAAM,WAAW,QAAQ,gBAAgB;AAKzC,QAAM,UAAU,gBAAgB,YAC5B,aACA,gBAAgB,SACd,UACA;AAEN,QAAM,aAAa;AAAA,IACjBC,cAAAA,QAAO;AAAA,IACPA,cAAAA,QAAO,IAAI;AAAA,IACXA,cAAAA,QAAO,OAAO;AAAA,IACd,YAAYA,cAAAA,QAAO;AAAA,IACnB,aAAaA,cAAAA,QAAO;AAAA,IACpB;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,MAAI,WAAWF,iBAAM,eAAe,QAAQ,GAAG;AAC7C,UAAM,EAAE,IAAIG,MAAK,GAAG,eAAe;AACnC,WAAOH,iBAAM,aAAa,UAAyD;AAAA,MACjF,GAAG;AAAA,MACH,WAAW,CAAC,YAAa,SAAS,MAAkC,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,MACvG;AAAA,IAAA,CACD;AAAA,EACH;AAGA,MAAI,MAAM,OAAO,KAAK;AACpB,UAAM,EAAE,IAAIG,MAAK,GAAG,gBAAgB;AACpC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACV,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AAGA,QAAM,EAAE,IAAI,KAAK,GAAG,gBAAgB;AACpC,SACEA,2BAAAA;AAAAA,IAACC,OAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAO,YAAoC,QAAQ;AAAA,MACnD,UAAW,YAAoC,YAAY;AAAA,MAC3D,WAAW;AAAA,MACV,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEM,MAAM,SAAS,OAAO,OAAO,YAAY;AAAA,EAC9C,MAAM;AACR,CAAC;;"}

package/dist/components/Button/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Button/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Button as BaseButton } from '@base-ui/react/button';\nimport styles from './Button.module.scss';\n\n/**\n * Button props.\n * @see https://usefragments.com/components/button\n */\ntype ButtonBaseProps = {\n children: React.ReactNode;\n /** Visual style variant. `\"outline\"` is an alias for `\"outlined\"`. `\"icon\"` is a convenience alias for a ghost icon-only button.\n * @default \"primary\"\n * @see https://usefragments.com/components/button#variants */\n variant?: 'primary' | 'secondary' | 'ghost' | 'danger' | 'outlined' | 'outline' | 'icon';\n /** Button size.\n * @default \"md\"\n * @see https://usefragments.com/components/button#sizes */\n size?: 'sm' | 'md' | 'lg';\n /** Render as icon-only button (square aspect ratio). Prefer `variant=\"icon\"` for the default ghost icon button. */\n icon?: boolean;\n /** Make button full width of container */\n fullWidth?: boolean;\n /** Merge props onto child element instead of rendering a button. Useful for composition with Link components.\n * @see https://usefragments.com/components/button#aschild */\n asChild?: boolean;\n};\n\n// Button as native button element\nexport interface ButtonAsButtonProps\n extends ButtonBaseProps,\n Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {\n as?: 'button';\n}\n\n// Button as anchor element\nexport interface ButtonAsAnchorProps\n extends ButtonBaseProps,\n Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> {\n as: 'a';\n}\n\nexport type ButtonProps = ButtonAsButtonProps | ButtonAsAnchorProps;\n\nconst ButtonRoot = React.forwardRef<\n HTMLButtonElement | HTMLAnchorElement,\n ButtonProps\n>(function Button(props, ref) {\n const {\n children,\n variant: variantProp = 'primary',\n size = 'md',\n icon = false,\n fullWidth = false,\n asChild = false,\n className,\n ...rest\n } = props;\n\n const iconOnly = icon || variantProp === 'icon';\n\n // Resolve aliases:\n // \"outline\" → \"outlined\"\n // \"icon\" → visual \"ghost\" + icon-only sizing\n const variant = variantProp === 'outline'\n ? 'outlined'\n : variantProp === 'icon'\n ? 'ghost'\n : variantProp;\n\n const classNames = [\n styles.button,\n styles[size],\n styles[variant],\n iconOnly && styles.icon,\n fullWidth && styles.fullWidth,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // asChild: merge button styling onto child element (e.g. Next.js Link)\n if (asChild && React.isValidElement(children)) {\n const { as: _as, ...childProps } = rest as ButtonProps & { as?: 'a' | 'button' };\n return React.cloneElement(children as React.ReactElement<Record<string, unknown>>, {\n ...childProps,\n className: [classNames, (children.props as Record<string, unknown>).className].filter(Boolean).join(' '),\n ref,\n });\n }\n\n // Render as anchor\n if (props.as === 'a') {\n const { as: _as, ...anchorProps } = rest as ButtonAsAnchorProps & { as?: 'a' };\n return (\n <a\n ref={ref as React.Ref<HTMLAnchorElement>}\n className={classNames}\n {...anchorProps}\n >\n {children}\n </a>\n );\n }\n\n // Render as button (default)\n const { as: _as, ...buttonProps } = rest as ButtonAsButtonProps;\n return (\n <BaseButton\n ref={ref as React.Ref<HTMLButtonElement>}\n type={(buttonProps as ButtonAsButtonProps).type || 'button'}\n disabled={(buttonProps as ButtonAsButtonProps).disabled || false}\n className={classNames}\n {...buttonProps}\n >\n {children}\n </BaseButton>\n );\n});\n\nexport const Button = Object.assign(ButtonRoot, {\n Root: ButtonRoot,\n});\n"],"names":["Button","_as","BaseButton"],"mappings":";;;;AA6CA,MAAM,aAAa,MAAM,WAGvB,SAASA,QAAO,OAAO,KAAK;AAC5B,QAAM;AAAA,IACJ;AAAA,IACA,SAAS,cAAc;AAAA,IACvB,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,UAAU;AAAA,IACV;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,QAAM,WAAW,QAAQ,gBAAgB;AAKzC,QAAM,UAAU,gBAAgB,YAC5B,aACA,gBAAgB,SACd,UACA;AAEN,QAAM,aAAa;AAAA,IACjB,OAAO;AAAA,IACP,OAAO,IAAI;AAAA,IACX,OAAO,OAAO;AAAA,IACd,YAAY,OAAO;AAAA,IACnB,aAAa,OAAO;AAAA,IACpB;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAGX,MAAI,WAAW,MAAM,eAAe,QAAQ,GAAG;AAC7C,UAAM,EAAE,IAAIC,MAAK,GAAG,eAAe;AACnC,WAAO,MAAM,aAAa,UAAyD;AAAA,MACjF,GAAG;AAAA,MACH,WAAW,CAAC,YAAa,SAAS,MAAkC,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,MACvG;AAAA,IAAA,CACD;AAAA,EACH;AAGA,MAAI,MAAM,OAAO,KAAK;AACpB,UAAM,EAAE,IAAIA,MAAK,GAAG,gBAAgB;AACpC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,QACV,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AAGA,QAAM,EAAE,IAAI,KAAK,GAAG,gBAAgB;AACpC,SACE;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAO,YAAoC,QAAQ;AAAA,MACnD,UAAW,YAAoC,YAAY;AAAA,MAC3D,WAAW;AAAA,MACV,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEM,MAAM,SAAS,OAAO,OAAO,YAAY;AAAA,EAC9C,MAAM;AACR,CAAC;"}

package/dist/components/ButtonGroup/ButtonGroup.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"ButtonGroup.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/ButtonGroup/ButtonGroup.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"ButtonGroup.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/ButtonGroup/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/ButtonGroup/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './ButtonGroup.module.scss';\n\nexport interface ButtonGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n children: React.ReactNode;\n gap?: 'none' | 'xs' | 'sm' | 'md';\n wrap?: boolean;\n align?: 'start' | 'center' | 'end';\n}\n\nconst ButtonGroupRoot = React.forwardRef<HTMLDivElement, ButtonGroupProps>(\n function ButtonGroup(\n {\n children,\n gap = 'sm',\n wrap = false,\n align,\n className,\n ...htmlProps\n },\n ref\n ) {\n const classes = [\n styles.group,\n gap !== 'none' && styles[`gap-${gap}`],\n wrap && styles.wrap,\n align && styles[`align-${align}`],\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes}>\n {children}\n </div>\n );\n }\n);\n\nexport const ButtonGroup = Object.assign(ButtonGroupRoot, {\n Root: ButtonGroupRoot,\n});\n"],"names":["React","ButtonGroup","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,kBAAkBA,iBAAM;AAAA,EAC5B,SAASC,aACP;AAAA,IACE;AAAA,IACA,MAAM;AAAA,IACN,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU;AAAA,MACdC,mBAAAA,QAAO;AAAA,MACP,QAAQ,UAAUA,mBAAAA,QAAO,OAAO,GAAG,EAAE;AAAA,MACrC,QAAQA,mBAAAA,QAAO;AAAA,MACf,SAASA,mBAAAA,QAAO,SAAS,KAAK,EAAE;AAAA,MAChC;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,0CACG,OAAA,EAAI,KAAW,GAAG,WAAW,WAAW,SACtC,UACH;AAAA,EAEJ;AACF;AAEO,MAAM,cAAc,OAAO,OAAO,iBAAiB;AAAA,EACxD,MAAM;AACR,CAAC;;"}

package/dist/components/ButtonGroup/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/ButtonGroup/index.tsx"],"sourcesContent":["import * as React from 'react';\nimport styles from './ButtonGroup.module.scss';\n\nexport interface ButtonGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n children: React.ReactNode;\n gap?: 'none' | 'xs' | 'sm' | 'md';\n wrap?: boolean;\n align?: 'start' | 'center' | 'end';\n}\n\nconst ButtonGroupRoot = React.forwardRef<HTMLDivElement, ButtonGroupProps>(\n function ButtonGroup(\n {\n children,\n gap = 'sm',\n wrap = false,\n align,\n className,\n ...htmlProps\n },\n ref\n ) {\n const classes = [\n styles.group,\n gap !== 'none' && styles[`gap-${gap}`],\n wrap && styles.wrap,\n align && styles[`align-${align}`],\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes}>\n {children}\n </div>\n );\n }\n);\n\nexport const ButtonGroup = Object.assign(ButtonGroupRoot, {\n Root: ButtonGroupRoot,\n});\n"],"names":["ButtonGroup"],"mappings":";;;AAUA,MAAM,kBAAkB,MAAM;AAAA,EAC5B,SAASA,aACP;AAAA,IACE;AAAA,IACA,MAAM;AAAA,IACN,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,KACA;AACA,UAAM,UAAU;AAAA,MACd,OAAO;AAAA,MACP,QAAQ,UAAU,OAAO,OAAO,GAAG,EAAE;AAAA,MACrC,QAAQ,OAAO;AAAA,MACf,SAAS,OAAO,SAAS,KAAK,EAAE;AAAA,MAChC;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,+BACG,OAAA,EAAI,KAAW,GAAG,WAAW,WAAW,SACtC,UACH;AAAA,EAEJ;AACF;AAEO,MAAM,cAAc,OAAO,OAAO,iBAAiB;AAAA,EACxD,MAAM;AACR,CAAC;"}

package/dist/components/Card/Card.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Card.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Card/Card.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Card.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Card/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Card/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Card.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\n/**\n * Card container for grouping related content.\n * @see https://usefragments.com/components/card\n */\nexport interface CardProps extends Omit<React.HTMLAttributes<HTMLElement>, 'children'> {\n children: React.ReactNode;\n /** Visual style variant. `\"outline\"` is an alias for `\"outlined\"`.\n * @default \"default\"\n * @see https://usefragments.com/components/card#variants */\n variant?: 'default' | 'outlined' | 'outline' | 'elevated';\n /** Inner padding.\n * @default \"md\" */\n padding?: 'none' | 'sm' | 'md' | 'lg';\n /** Root element tag.\n * @default \"article\" */\n as?: 'article' | 'div' | 'section';\n}\n\nexport interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n}\n\nexport interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n children: React.ReactNode;\n}\n\nexport interface CardDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {\n children: React.ReactNode;\n}\n\nexport interface CardBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n}\n\nexport interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface CardContextValue {\n variant: 'default' | 'outlined' | 'elevated';\n padding: 'none' | 'sm' | 'md' | 'lg';\n isInteractive: boolean;\n}\n\nconst CardContext = React.createContext<CardContextValue | null>(null);\n\n// ============================================\n// Padding Map\n// ============================================\n\nconst paddingMap = {\n none: styles.paddingNone,\n sm: styles.paddingSm,\n md: styles.paddingMd,\n lg: styles.paddingLg,\n};\n\n// ============================================\n// Components\n// ============================================\n\nfunction CardRoot({\n children,\n variant: variantProp = 'default',\n padding = 'md',\n as: Component = 'article',\n className,\n style,\n ...htmlProps\n}: CardProps) {\n // Resolve alias: \"outline\" → \"outlined\"\n const variant = variantProp === 'outline' ? 'outlined' : variantProp;\n\n const isInteractive = typeof htmlProps.onClick === 'function';\n\n const classes = [\n styles.card,\n styles[variant],\n paddingMap[padding],\n isInteractive && styles.interactive,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const contextValue: CardContextValue = {\n variant,\n padding,\n isInteractive,\n };\n\n return (\n <CardContext.Provider value={contextValue}>\n <Component\n {...htmlProps}\n className={classes}\n style={style}\n >\n {children}\n </Component>\n </CardContext.Provider>\n );\n}\n\nfunction CardHeader({ children, className, ...htmlProps }: CardHeaderProps) {\n const classes = [styles.header, className].filter(Boolean).join(' ');\n return <div {...htmlProps} className={classes}>{children}</div>;\n}\n\nfunction CardTitle({ children, className, ...htmlProps }: CardTitleProps) {\n const classes = [styles.title, className].filter(Boolean).join(' ');\n return <h3 {...htmlProps} className={classes}>{children}</h3>;\n}\n\nfunction CardDescription({ children, className, ...htmlProps }: CardDescriptionProps) {\n const classes = [styles.description, className].filter(Boolean).join(' ');\n return <p {...htmlProps} className={classes}>{children}</p>;\n}\n\nfunction CardBody({ children, className, ...htmlProps }: CardBodyProps) {\n const classes = [styles.body, className].filter(Boolean).join(' ');\n return <div {...htmlProps} className={classes}>{children}</div>;\n}\n\nfunction CardFooter({ children, className, ...htmlProps }: CardFooterProps) {\n const classes = [styles.footer, className].filter(Boolean).join(' ');\n return <div {...htmlProps} className={classes}>{children}</div>;\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const Card = Object.assign(CardRoot, {\n Header: CardHeader,\n Title: CardTitle,\n Description: CardDescription,\n Body: CardBody,\n Footer: CardFooter,\n});\n\n// Re-export individual components for tree-shaking\nexport {\n CardRoot,\n CardHeader,\n CardTitle,\n CardDescription,\n CardBody,\n CardFooter,\n};\n"],"names":["React","styles","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAyDA,MAAM,cAAcA,iBAAM,cAAuC,IAAI;AAMrE,MAAM,aAAa;AAAA,EACjB,MAAMC,YAAAA,QAAO;AAAA,EACb,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AAAA,EACX,IAAIA,YAAAA,QAAO;AACb;AAMA,SAAS,SAAS;AAAA,EAChB;AAAA,EACA,SAAS,cAAc;AAAA,EACvB,UAAU;AAAA,EACV,IAAI,YAAY;AAAA,EAChB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAc;AAEZ,QAAM,UAAU,gBAAgB,YAAY,aAAa;AAEzD,QAAM,gBAAgB,OAAO,UAAU,YAAY;AAEnD,QAAM,UAAU;AAAA,IACdA,YAAAA,QAAO;AAAA,IACPA,YAAAA,QAAO,OAAO;AAAA,IACd,WAAW,OAAO;AAAA,IAClB,iBAAiBA,YAAAA,QAAO;AAAA,IACxB;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,QAAM,eAAiC;AAAA,IACrC;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAGF,SACEC,2BAAAA,IAAC,YAAY,UAAZ,EAAqB,OAAO,cAC3B,UAAAA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,MACX;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;AAEA,SAAS,WAAW,EAAE,UAAU,WAAW,GAAG,aAA8B;AAC1E,QAAM,UAAU,CAACD,YAAAA,QAAO,QAAQ,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACnE,wCAAQ,OAAA,EAAK,GAAG,WAAW,WAAW,SAAU,UAAS;AAC3D;AAEA,SAAS,UAAU,EAAE,UAAU,WAAW,GAAG,aAA6B;AACxE,QAAM,UAAU,CAACA,YAAAA,QAAO,OAAO,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAClE,wCAAQ,MAAA,EAAI,GAAG,WAAW,WAAW,SAAU,UAAS;AAC1D;AAEA,SAAS,gBAAgB,EAAE,UAAU,WAAW,GAAG,aAAmC;AACpF,QAAM,UAAU,CAACA,YAAAA,QAAO,aAAa,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACxE,wCAAQ,KAAA,EAAG,GAAG,WAAW,WAAW,SAAU,UAAS;AACzD;AAEA,SAAS,SAAS,EAAE,UAAU,WAAW,GAAG,aAA4B;AACtE,QAAM,UAAU,CAACA,YAAAA,QAAO,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACjE,wCAAQ,OAAA,EAAK,GAAG,WAAW,WAAW,SAAU,UAAS;AAC3D;AAEA,SAAS,WAAW,EAAE,UAAU,WAAW,GAAG,aAA8B;AAC1E,QAAM,UAAU,CAACA,YAAAA,QAAO,QAAQ,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACnE,wCAAQ,OAAA,EAAK,GAAG,WAAW,WAAW,SAAU,UAAS;AAC3D;AAMO,MAAM,OAAO,OAAO,OAAO,UAAU;AAAA,EAC1C,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb,MAAM;AAAA,EACN,QAAQ;AACV,CAAC;;;;;;;;"}

package/dist/components/Card/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Card/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Card.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\n/**\n * Card container for grouping related content.\n * @see https://usefragments.com/components/card\n */\nexport interface CardProps extends Omit<React.HTMLAttributes<HTMLElement>, 'children'> {\n children: React.ReactNode;\n /** Visual style variant. `\"outline\"` is an alias for `\"outlined\"`.\n * @default \"default\"\n * @see https://usefragments.com/components/card#variants */\n variant?: 'default' | 'outlined' | 'outline' | 'elevated';\n /** Inner padding.\n * @default \"md\" */\n padding?: 'none' | 'sm' | 'md' | 'lg';\n /** Root element tag.\n * @default \"article\" */\n as?: 'article' | 'div' | 'section';\n}\n\nexport interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n}\n\nexport interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n children: React.ReactNode;\n}\n\nexport interface CardDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {\n children: React.ReactNode;\n}\n\nexport interface CardBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n}\n\nexport interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {\n children: React.ReactNode;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface CardContextValue {\n variant: 'default' | 'outlined' | 'elevated';\n padding: 'none' | 'sm' | 'md' | 'lg';\n isInteractive: boolean;\n}\n\nconst CardContext = React.createContext<CardContextValue | null>(null);\n\n// ============================================\n// Padding Map\n// ============================================\n\nconst paddingMap = {\n none: styles.paddingNone,\n sm: styles.paddingSm,\n md: styles.paddingMd,\n lg: styles.paddingLg,\n};\n\n// ============================================\n// Components\n// ============================================\n\nfunction CardRoot({\n children,\n variant: variantProp = 'default',\n padding = 'md',\n as: Component = 'article',\n className,\n style,\n ...htmlProps\n}: CardProps) {\n // Resolve alias: \"outline\" → \"outlined\"\n const variant = variantProp === 'outline' ? 'outlined' : variantProp;\n\n const isInteractive = typeof htmlProps.onClick === 'function';\n\n const classes = [\n styles.card,\n styles[variant],\n paddingMap[padding],\n isInteractive && styles.interactive,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const contextValue: CardContextValue = {\n variant,\n padding,\n isInteractive,\n };\n\n return (\n <CardContext.Provider value={contextValue}>\n <Component\n {...htmlProps}\n className={classes}\n style={style}\n >\n {children}\n </Component>\n </CardContext.Provider>\n );\n}\n\nfunction CardHeader({ children, className, ...htmlProps }: CardHeaderProps) {\n const classes = [styles.header, className].filter(Boolean).join(' ');\n return <div {...htmlProps} className={classes}>{children}</div>;\n}\n\nfunction CardTitle({ children, className, ...htmlProps }: CardTitleProps) {\n const classes = [styles.title, className].filter(Boolean).join(' ');\n return <h3 {...htmlProps} className={classes}>{children}</h3>;\n}\n\nfunction CardDescription({ children, className, ...htmlProps }: CardDescriptionProps) {\n const classes = [styles.description, className].filter(Boolean).join(' ');\n return <p {...htmlProps} className={classes}>{children}</p>;\n}\n\nfunction CardBody({ children, className, ...htmlProps }: CardBodyProps) {\n const classes = [styles.body, className].filter(Boolean).join(' ');\n return <div {...htmlProps} className={classes}>{children}</div>;\n}\n\nfunction CardFooter({ children, className, ...htmlProps }: CardFooterProps) {\n const classes = [styles.footer, className].filter(Boolean).join(' ');\n return <div {...htmlProps} className={classes}>{children}</div>;\n}\n\n// ============================================\n// Export compound component\n// ============================================\n\nexport const Card = Object.assign(CardRoot, {\n Header: CardHeader,\n Title: CardTitle,\n Description: CardDescription,\n Body: CardBody,\n Footer: CardFooter,\n});\n\n// Re-export individual components for tree-shaking\nexport {\n CardRoot,\n CardHeader,\n CardTitle,\n CardDescription,\n CardBody,\n CardFooter,\n};\n"],"names":[],"mappings":";;;AAyDA,MAAM,cAAc,MAAM,cAAuC,IAAI;AAMrE,MAAM,aAAa;AAAA,EACjB,MAAM,OAAO;AAAA,EACb,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AAAA,EACX,IAAI,OAAO;AACb;AAMA,SAAS,SAAS;AAAA,EAChB;AAAA,EACA,SAAS,cAAc;AAAA,EACvB,UAAU;AAAA,EACV,IAAI,YAAY;AAAA,EAChB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAc;AAEZ,QAAM,UAAU,gBAAgB,YAAY,aAAa;AAEzD,QAAM,gBAAgB,OAAO,UAAU,YAAY;AAEnD,QAAM,UAAU;AAAA,IACd,OAAO;AAAA,IACP,OAAO,OAAO;AAAA,IACd,WAAW,OAAO;AAAA,IAClB,iBAAiB,OAAO;AAAA,IACxB;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,QAAM,eAAiC;AAAA,IACrC;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAGF,SACE,oBAAC,YAAY,UAAZ,EAAqB,OAAO,cAC3B,UAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,MACX;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;AAEA,SAAS,WAAW,EAAE,UAAU,WAAW,GAAG,aAA8B;AAC1E,QAAM,UAAU,CAAC,OAAO,QAAQ,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACnE,6BAAQ,OAAA,EAAK,GAAG,WAAW,WAAW,SAAU,UAAS;AAC3D;AAEA,SAAS,UAAU,EAAE,UAAU,WAAW,GAAG,aAA6B;AACxE,QAAM,UAAU,CAAC,OAAO,OAAO,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAClE,6BAAQ,MAAA,EAAI,GAAG,WAAW,WAAW,SAAU,UAAS;AAC1D;AAEA,SAAS,gBAAgB,EAAE,UAAU,WAAW,GAAG,aAAmC;AACpF,QAAM,UAAU,CAAC,OAAO,aAAa,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACxE,6BAAQ,KAAA,EAAG,GAAG,WAAW,WAAW,SAAU,UAAS;AACzD;AAEA,SAAS,SAAS,EAAE,UAAU,WAAW,GAAG,aAA4B;AACtE,QAAM,UAAU,CAAC,OAAO,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACjE,6BAAQ,OAAA,EAAK,GAAG,WAAW,WAAW,SAAU,UAAS;AAC3D;AAEA,SAAS,WAAW,EAAE,UAAU,WAAW,GAAG,aAA8B;AAC1E,QAAM,UAAU,CAAC,OAAO,QAAQ,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AACnE,6BAAQ,OAAA,EAAK,GAAG,WAAW,WAAW,SAAU,UAAS;AAC3D;AAMO,MAAM,OAAO,OAAO,OAAO,UAAU;AAAA,EAC1C,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb,MAAM;AAAA,EACN,QAAQ;AACV,CAAC;"}

package/dist/components/Chart/Chart.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Chart.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Chart/Chart.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Chart.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Checkbox/Checkbox.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Checkbox.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Checkbox/Checkbox.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Checkbox.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Checkbox/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Checkbox/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';\nimport styles from './Checkbox.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\n/**\n * Checkbox for boolean or indeterminate selections in forms.\n * @see https://usefragments.com/components/checkbox\n */\nexport interface CheckboxProps extends Omit<React.HTMLAttributes<HTMLLabelElement>, 'onChange' | 'defaultChecked'> {\n /** Whether the checkbox is checked */\n checked?: boolean;\n /** Default checked state (uncontrolled) */\n defaultChecked?: boolean;\n /** Callback when checked state changes */\n onCheckedChange?: (checked: boolean) => void;\n /** Alias for onCheckedChange */\n onChange?: (checked: boolean) => void;\n /** Whether the checkbox is in an indeterminate state */\n indeterminate?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Whether the checkbox is required */\n required?: boolean;\n /** Size variant.\n * @default \"md\" */\n size?: 'sm' | 'md' | 'lg';\n /** Label text */\n label?: string;\n /** Description text below the label */\n description?: string;\n /** Name attribute for form submission */\n name?: string;\n /** Value attribute for form submission */\n value?: string;\n /** ID for the checkbox input */\n id?: string;\n /** Class applied directly to the checkbox control element */\n controlClassName?: string;\n /** Class applied to the label/description content wrapper */\n contentClassName?: string;\n /** Accessible label for icon-only mode */\n 'aria-label'?: string;\n /** Accessible labelled-by relationship for icon-only mode */\n 'aria-labelledby'?: string;\n /** Accessible described-by relationship */\n 'aria-describedby'?: string;\n}\n\nfunction mergeAriaIds(...ids: Array<string | undefined>): string | undefined {\n const merged = ids.filter(Boolean).join(' ').trim();\n return merged.length > 0 ? merged : undefined;\n}\n\n// ============================================\n// Icons\n// ============================================\n\nfunction CheckIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <polyline points=\"20 6 9 17 4 12\" />\n </svg>\n );\n}\n\nfunction MinusIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n </svg>\n );\n}\n\n// ============================================\n// Component\n// ============================================\n\nconst CheckboxRoot = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n function Checkbox(\n {\n checked,\n defaultChecked,\n onCheckedChange,\n onChange,\n indeterminate = false,\n disabled = false,\n required = false,\n size = 'md',\n label,\n description,\n name,\n value,\n className,\n controlClassName,\n contentClassName,\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-describedby': ariaDescribedBy,\n ...htmlProps\n },\n ref\n ) {\n const generatedId = React.useId();\n const checkboxId = id ?? `checkbox-${generatedId}`;\n const labelId = label ? `${checkboxId}-label` : undefined;\n const descriptionId = description ? `${checkboxId}-description` : undefined;\n\n const checkboxClasses = [\n styles.checkbox,\n size === 'sm' && styles.sm,\n size === 'lg' && styles.lg,\n controlClassName,\n ].filter(Boolean).join(' ');\n\n const labelClasses = [\n styles.label,\n size === 'sm' && styles.labelSm,\n size === 'lg' && styles.labelLg,\n ].filter(Boolean).join(' ');\n\n const wrapperClasses = [styles.wrapper, className].filter(Boolean).join(' ');\n const handleCheckedChange = onChange ?? onCheckedChange;\n\n // If no label/description, render just the checkbox\n if (!label && !description) {\n const iconOnlyHtmlProps = htmlProps as unknown as Record<string, unknown>;\n return (\n <BaseCheckbox.Root\n {...iconOnlyHtmlProps}\n ref={ref}\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={handleCheckedChange}\n indeterminate={indeterminate}\n disabled={disabled}\n required={required}\n name={name}\n value={value}\n id={checkboxId}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={ariaDescribedBy}\n className={[checkboxClasses, className].filter(Boolean).join(' ')}\n >\n <BaseCheckbox.Indicator className={styles.indicator} keepMounted>\n {indeterminate ? <MinusIcon /> : <CheckIcon />}\n </BaseCheckbox.Indicator>\n </BaseCheckbox.Root>\n );\n }\n\n return (\n <label\n {...htmlProps}\n className={wrapperClasses}\n data-disabled={disabled || undefined}\n data-has-description={description ? true : undefined}\n >\n <BaseCheckbox.Root\n ref={ref}\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={handleCheckedChange}\n indeterminate={indeterminate}\n disabled={disabled}\n required={required}\n name={name}\n value={value}\n id={checkboxId}\n aria-label={ariaLabel}\n aria-labelledby={mergeAriaIds(ariaLabelledBy, labelId)}\n aria-describedby={mergeAriaIds(ariaDescribedBy, descriptionId)}\n className={checkboxClasses}\n >\n <BaseCheckbox.Indicator className={styles.indicator} keepMounted>\n {indeterminate ? <MinusIcon /> : <CheckIcon />}\n </BaseCheckbox.Indicator>\n </BaseCheckbox.Root>\n <div className={[styles.content, contentClassName].filter(Boolean).join(' ')}>\n <span id={labelId} className={labelClasses}>{label}</span>\n {description && (\n <span id={descriptionId} className={styles.description}>{description}</span>\n )}\n </div>\n </label>\n );\n }\n);\n\nexport const Checkbox = Object.assign(CheckboxRoot, {\n Root: CheckboxRoot,\n});\n"],"names":["jsx","React","Checkbox","styles","BaseCheckbox","jsxs"],"mappings":"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"}

package/dist/components/Checkbox/index.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.js","sources":["../../../src/components/Checkbox/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Checkbox as BaseCheckbox } from '@base-ui/react/checkbox';\nimport styles from './Checkbox.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\n/**\n * Checkbox for boolean or indeterminate selections in forms.\n * @see https://usefragments.com/components/checkbox\n */\nexport interface CheckboxProps extends Omit<React.HTMLAttributes<HTMLLabelElement>, 'onChange' | 'defaultChecked'> {\n /** Whether the checkbox is checked */\n checked?: boolean;\n /** Default checked state (uncontrolled) */\n defaultChecked?: boolean;\n /** Callback when checked state changes */\n onCheckedChange?: (checked: boolean) => void;\n /** Alias for onCheckedChange */\n onChange?: (checked: boolean) => void;\n /** Whether the checkbox is in an indeterminate state */\n indeterminate?: boolean;\n /** Whether the checkbox is disabled */\n disabled?: boolean;\n /** Whether the checkbox is required */\n required?: boolean;\n /** Size variant.\n * @default \"md\" */\n size?: 'sm' | 'md' | 'lg';\n /** Label text */\n label?: string;\n /** Description text below the label */\n description?: string;\n /** Name attribute for form submission */\n name?: string;\n /** Value attribute for form submission */\n value?: string;\n /** ID for the checkbox input */\n id?: string;\n /** Class applied directly to the checkbox control element */\n controlClassName?: string;\n /** Class applied to the label/description content wrapper */\n contentClassName?: string;\n /** Accessible label for icon-only mode */\n 'aria-label'?: string;\n /** Accessible labelled-by relationship for icon-only mode */\n 'aria-labelledby'?: string;\n /** Accessible described-by relationship */\n 'aria-describedby'?: string;\n}\n\nfunction mergeAriaIds(...ids: Array<string | undefined>): string | undefined {\n const merged = ids.filter(Boolean).join(' ').trim();\n return merged.length > 0 ? merged : undefined;\n}\n\n// ============================================\n// Icons\n// ============================================\n\nfunction CheckIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <polyline points=\"20 6 9 17 4 12\" />\n </svg>\n );\n}\n\nfunction MinusIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"3\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n >\n <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n </svg>\n );\n}\n\n// ============================================\n// Component\n// ============================================\n\nconst CheckboxRoot = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n function Checkbox(\n {\n checked,\n defaultChecked,\n onCheckedChange,\n onChange,\n indeterminate = false,\n disabled = false,\n required = false,\n size = 'md',\n label,\n description,\n name,\n value,\n className,\n controlClassName,\n contentClassName,\n id,\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-describedby': ariaDescribedBy,\n ...htmlProps\n },\n ref\n ) {\n const generatedId = React.useId();\n const checkboxId = id ?? `checkbox-${generatedId}`;\n const labelId = label ? `${checkboxId}-label` : undefined;\n const descriptionId = description ? `${checkboxId}-description` : undefined;\n\n const checkboxClasses = [\n styles.checkbox,\n size === 'sm' && styles.sm,\n size === 'lg' && styles.lg,\n controlClassName,\n ].filter(Boolean).join(' ');\n\n const labelClasses = [\n styles.label,\n size === 'sm' && styles.labelSm,\n size === 'lg' && styles.labelLg,\n ].filter(Boolean).join(' ');\n\n const wrapperClasses = [styles.wrapper, className].filter(Boolean).join(' ');\n const handleCheckedChange = onChange ?? onCheckedChange;\n\n // If no label/description, render just the checkbox\n if (!label && !description) {\n const iconOnlyHtmlProps = htmlProps as unknown as Record<string, unknown>;\n return (\n <BaseCheckbox.Root\n {...iconOnlyHtmlProps}\n ref={ref}\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={handleCheckedChange}\n indeterminate={indeterminate}\n disabled={disabled}\n required={required}\n name={name}\n value={value}\n id={checkboxId}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-describedby={ariaDescribedBy}\n className={[checkboxClasses, className].filter(Boolean).join(' ')}\n >\n <BaseCheckbox.Indicator className={styles.indicator} keepMounted>\n {indeterminate ? <MinusIcon /> : <CheckIcon />}\n </BaseCheckbox.Indicator>\n </BaseCheckbox.Root>\n );\n }\n\n return (\n <label\n {...htmlProps}\n className={wrapperClasses}\n data-disabled={disabled || undefined}\n data-has-description={description ? true : undefined}\n >\n <BaseCheckbox.Root\n ref={ref}\n checked={checked}\n defaultChecked={defaultChecked}\n onCheckedChange={handleCheckedChange}\n indeterminate={indeterminate}\n disabled={disabled}\n required={required}\n name={name}\n value={value}\n id={checkboxId}\n aria-label={ariaLabel}\n aria-labelledby={mergeAriaIds(ariaLabelledBy, labelId)}\n aria-describedby={mergeAriaIds(ariaDescribedBy, descriptionId)}\n className={checkboxClasses}\n >\n <BaseCheckbox.Indicator className={styles.indicator} keepMounted>\n {indeterminate ? <MinusIcon /> : <CheckIcon />}\n </BaseCheckbox.Indicator>\n </BaseCheckbox.Root>\n <div className={[styles.content, contentClassName].filter(Boolean).join(' ')}>\n <span id={labelId} className={labelClasses}>{label}</span>\n {description && (\n <span id={descriptionId} className={styles.description}>{description}</span>\n )}\n </div>\n </label>\n );\n }\n);\n\nexport const Checkbox = Object.assign(CheckboxRoot, {\n Root: CheckboxRoot,\n});\n"],"names":["Checkbox","BaseCheckbox"],"mappings":"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"}

package/dist/components/Chip/Chip.module.scss.cjs.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Chip.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Chip/Chip.module.scss.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"Chip.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Chip/index.cjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"index.cjs","sources":["../../../src/components/Chip/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Chip.module.scss';\n\n/**\n * Chip for selections, filters, and tags. Use with Chip.Group for multi-select.\n * @see https://usefragments.com/components/chip\n */\nexport interface ChipProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {\n children: React.ReactNode;\n /** Visual style variant. `\"outline\"` is an alias for `\"outlined\"`.\n * @default \"filled\"\n * @see https://usefragments.com/components/chip#variants */\n variant?: 'filled' | 'outlined' | 'outline' | 'soft';\n /** Chip size.\n * @default \"md\" */\n size?: 'sm' | 'md' | 'lg';\n /** Whether the chip is selected */\n selected?: boolean;\n /** Icon element rendered before the label */\n icon?: React.ReactNode;\n /** Avatar element rendered before the label */\n avatar?: React.ReactNode;\n /** Makes chip removable. Called when X is clicked. */\n onRemove?: () => void;\n /** Value identifier used by Chip.Group */\n value?: string;\n}\n\nexport interface ChipGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'onChange'> {\n children: React.ReactNode;\n /** Controlled selected values */\n value?: string[];\n /** Default selected values (uncontrolled) */\n defaultValue?: string[];\n /** Called when selection changes */\n onChange?: (value: string[]) => void;\n}\n\nconst ChipBase = React.forwardRef<HTMLButtonElement, ChipProps>(\n function Chip(\n {\n children,\n variant: variantProp = 'filled',\n size = 'md',\n selected = false,\n disabled = false,\n icon,\n avatar,\n onRemove,\n className,\n onClick,\n value: _value,\n ...htmlProps\n },\n ref\n ) {\n // Resolve alias: \"outline\" → \"outlined\"\n const variant = variantProp === 'outline' ? 'outlined' : variantProp;\n\n const classes = [\n styles.chip,\n styles[size],\n styles[variant],\n selected && styles.selected,\n onRemove && styles.withRemove,\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const handleRemoveClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n onRemove?.();\n };\n\n const removeAriaLabel = `Remove ${typeof children === 'string' ? children : 'chip'}`;\n\n const chipButton = (\n <button\n ref={ref}\n type=\"button\"\n aria-pressed={selected}\n disabled={disabled}\n className={classes}\n onClick={onClick}\n {...htmlProps}\n >\n {avatar && (\n <span className={styles.avatar} aria-hidden=\"true\">\n {avatar}\n </span>\n )}\n {icon && (\n <span className={styles.icon} aria-hidden=\"true\">\n {icon}\n </span>\n )}\n <span>{children}</span>\n </button>\n );\n\n if (!onRemove) {\n return chipButton;\n }\n\n return (\n <span className={styles.removableChip} data-disabled={disabled || undefined}>\n {chipButton}\n <button\n type=\"button\"\n className={styles.remove}\n onClick={handleRemoveClick}\n aria-label={removeAriaLabel}\n disabled={disabled}\n >\n ×\n </button>\n </span>\n );\n }\n);\n\nconst EMPTY_CHIP_GROUP: string[] = [];\n\nfunction ChipGroupInner(\n { children, value: controlledValue, defaultValue = EMPTY_CHIP_GROUP, onChange, className, ...htmlProps }: ChipGroupProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const [internalValue, setInternalValue] = React.useState<string[]>(defaultValue);\n const isControlled = controlledValue !== undefined;\n const currentValue = isControlled ? controlledValue : internalValue;\n\n const toggle = React.useCallback(\n (chipValue: string) => {\n const next = currentValue.includes(chipValue)\n ? currentValue.filter((v) => v !== chipValue)\n : [...currentValue, chipValue];\n\n if (!isControlled) {\n setInternalValue(next);\n }\n onChange?.(next);\n },\n [currentValue, isControlled, onChange]\n );\n\n const classes = [styles.group, className].filter(Boolean).join(' ');\n\n return (\n <div ref={ref} {...htmlProps} className={classes}>\n {React.Children.map(children, (child, index) => {\n if (!React.isValidElement<ChipProps>(child)) return child;\n const chipValue = (() => {\n if (child.props.value != null) return child.props.value;\n if (typeof child.props.children === 'string') return child.props.children;\n if (child.key != null) return String(child.key);\n if (process.env.NODE_ENV !== 'production') {\n // Non-string labels need an explicit value to avoid unstable group selection keys.\n console.warn('Chip.Group: Chips with non-string children should provide a `value` prop.');\n }\n return `__chip-${index}`;\n })();\n return React.cloneElement(child, {\n selected: currentValue.includes(chipValue),\n onClick: (e: React.MouseEvent<HTMLButtonElement>) => {\n child.props.onClick?.(e);\n if (!e.defaultPrevented) {\n toggle(chipValue);\n }\n },\n } as Partial<ChipProps>);\n })}\n </div>\n );\n}\n\nconst ChipGroup = React.forwardRef<HTMLDivElement, ChipGroupProps>(ChipGroupInner);\n\n// Compose Chip with static Group property\nexport const Chip = Object.assign(ChipBase, { Group: ChipGroup });\n"],"names":["React","Chip","styles","jsxs","jsx"],"mappings":"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"}