npm - @abumble/design-system - Versions diffs - 0.0.46 → 0.0.47 - Mend

@abumble/design-system 0.0.46 → 0.0.47

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 (17) hide show

package/dist/components/Sidebar.js +1 -1
package/dist/components/Sidebar.js.map +1 -1
package/dist/components/ThemeSelector/ThemeSelector.d.ts.map +1 -1
package/dist/components/ThemeSelector.js +12 -10
package/dist/components/ThemeSelector.js.map +1 -1
package/dist/index.css +1 -1
package/dist/themes/ThemeProvider.d.ts +3 -1
package/dist/themes/ThemeProvider.d.ts.map +1 -1
package/dist/themes.js +25 -25
package/dist/themes.js.map +1 -1
package/package.json +2 -1
package/src/styles.css +10 -0
package/src/themes/ThemeProvider.tsx +4 -2
package/src/themes/dusk.css +128 -0
package/src/themes/linen.css +0 -4
package/src/themes/sage.css +128 -0
package/src/themes/steel.css +0 -2

package/dist/components/Sidebar.js CHANGED Viewed

@@ -283,7 +283,7 @@ function ge({ className: a, ...e }) {
     {
       "data-slot": "sidebar-content",
       className: r(
-        "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
+        "flex min-h-0 flex-1 flex-col gap-2 overflow-x-hidden overflow-y-auto group-data-[collapsible=icon]:overflow-hidden",
         a
       ),
       ...e

package/dist/components/Sidebar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Sidebar.js","sources":["../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { ChevronsLeft } from 'lucide-react'\nimport * as React from 'react'\n\nimport { useIsMobile } from '@/hooks/use-mobile'\nimport { cn } from '@/utils'\nimport { Button } from '../Button'\nimport { Input } from '../Input'\nimport { Separator } from '../Separator'\nimport {\n\tSheet,\n\tSheetContent,\n\tSheetDescription,\n\tSheetHeader,\n\tSheetTitle,\n} from '../Sheet'\nimport { Skeleton } from '../Skeleton'\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipProvider,\n\tTooltipTrigger,\n} from '../Tooltip'\n\n// const SIDEBAR_COOKIE_NAME = 'sidebar_state'\n// const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7\nconst SIDEBAR_WIDTH = '18rem'\nconst SIDEBAR_WIDTH_MOBILE = '18rem'\nconst SIDEBAR_WIDTH_ICON = '3rem'\nconst SIDEBAR_KEYBOARD_SHORTCUT = 'b'\n\ntype SidebarContextProps = {\n\tstate: 'expanded' \| 'collapsed'\n\topen: boolean\n\tsetOpen: (open: boolean) => void\n\topenMobile: boolean\n\tsetOpenMobile: (open: boolean) => void\n\tisMobile: boolean\n\ttoggleSidebar: () => void\n}\n\nconst SidebarContext = React.createContext<SidebarContextProps \| null>(null)\n\nfunction useSidebar() {\n\tconst context = React.useContext(SidebarContext)\n\tif (!context) {\n\t\tthrow new Error('useSidebar must be used within a SidebarProvider.')\n\t}\n\n\treturn context\n}\n\nfunction SidebarProvider({\n\tdefaultOpen = true,\n\topen: openProp,\n\tonOpenChange: setOpenProp,\n\tclassName,\n\tstyle,\n\tchildren,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tdefaultOpen?: boolean\n\topen?: boolean\n\tonOpenChange?: (open: boolean) => void\n}) {\n\tconst isMobile = useIsMobile()\n\tconst [openMobile, setOpenMobile] = React.useState(false)\n\n\t// This is the internal state of the sidebar.\n\t// We use openProp and setOpenProp for control from outside the component.\n\tconst [_open, _setOpen] = React.useState(defaultOpen)\n\tconst open = openProp ?? _open\n\tconst setOpen = React.useCallback(\n\t\t(value: boolean \| ((value: boolean) => boolean)) => {\n\t\t\tconst openState = typeof value === 'function' ? value(open) : value\n\t\t\tif (setOpenProp) {\n\t\t\t\tsetOpenProp(openState)\n\t\t\t} else {\n\t\t\t\t_setOpen(openState)\n\t\t\t}\n\n\t\t\t// This sets the cookie to keep the sidebar state.\n\t\t\t// document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`\n\t\t},\n\t\t[setOpenProp, open],\n\t)\n\n\t// Helper to toggle the sidebar.\n\tconst toggleSidebar = React.useCallback(() => {\n\t\treturn isMobile\n\t\t\t? setOpenMobile((open) => !open)\n\t\t\t: setOpen((open) => !open)\n\t}, [isMobile, setOpen, setOpenMobile])\n\n\t// Adds a keyboard shortcut to toggle the sidebar.\n\tReact.useEffect(() => {\n\t\tconst handleKeyDown = (event: KeyboardEvent) => {\n\t\t\tif (\n\t\t\t\tevent.key === SIDEBAR_KEYBOARD_SHORTCUT &&\n\t\t\t\t(event.metaKey \|\| event.ctrlKey)\n\t\t\t) {\n\t\t\t\tevent.preventDefault()\n\t\t\t\ttoggleSidebar()\n\t\t\t}\n\t\t}\n\n\t\twindow.addEventListener('keydown', handleKeyDown)\n\t\treturn () => window.removeEventListener('keydown', handleKeyDown)\n\t}, [toggleSidebar])\n\n\t// We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n\t// This makes it easier to style the sidebar with Tailwind classes.\n\tconst state = open ? 'expanded' : 'collapsed'\n\n\tconst contextValue = React.useMemo<SidebarContextProps>(\n\t\t() => ({\n\t\t\tstate,\n\t\t\topen,\n\t\t\tsetOpen,\n\t\t\tisMobile,\n\t\t\topenMobile,\n\t\t\tsetOpenMobile,\n\t\t\ttoggleSidebar,\n\t\t}),\n\t\t[\n\t\t\tstate,\n\t\t\topen,\n\t\t\tsetOpen,\n\t\t\tisMobile,\n\t\t\topenMobile,\n\t\t\tsetOpenMobile,\n\t\t\ttoggleSidebar,\n\t\t],\n\t)\n\n\treturn (\n\t\t<SidebarContext.Provider value={contextValue}>\n\t\t\t<TooltipProvider delayDuration={0}>\n\t\t\t\t<div\n\t\t\t\t\tdata-slot=\"sidebar-wrapper\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'--sidebar-width': SIDEBAR_WIDTH,\n\t\t\t\t\t\t\t'--sidebar-width-icon': SIDEBAR_WIDTH_ICON,\n\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t\t}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t'group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex w-full',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</TooltipProvider>\n\t\t</SidebarContext.Provider>\n\t)\n}\n\nfunction Sidebar({\n\tside = 'left',\n\tvariant = 'sidebar',\n\tcollapsible = 'offcanvas',\n\tclassName,\n\tchildren,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tside?: 'left' \| 'right'\n\tvariant?: 'sidebar' \| 'floating' \| 'inset'\n\tcollapsible?: 'offcanvas' \| 'icon' \| 'none'\n}) {\n\tconst { isMobile, state, openMobile, setOpenMobile } = useSidebar()\n\n\tif (collapsible === 'none') {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tdata-slot=\"sidebar\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'sidebar flex w-(--sidebar-width) flex-col',\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t)\n\t}\n\n\tif (isMobile) {\n\t\treturn (\n\t\t\t<Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>\n\t\t\t\t<SheetContent\n\t\t\t\t\tdata-slot=\"sidebar\"\n\t\t\t\t\tdata-mobile=\"true\"\n\t\t\t\t\tclassName=\"sidebar w-(--sidebar-width) p-0 [&>button]:hidden\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'--sidebar-width': SIDEBAR_WIDTH_MOBILE,\n\t\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t\t}\n\t\t\t\t\tside={side}\n\t\t\t\t>\n\t\t\t\t\t<SheetHeader className=\"sr-only\">\n\t\t\t\t\t\t<SheetTitle>Sidebar</SheetTitle>\n\t\t\t\t\t\t<SheetDescription>\n\t\t\t\t\t\t\tDisplays the mobile sidebar.\n\t\t\t\t\t\t</SheetDescription>\n\t\t\t\t\t</SheetHeader>\n\t\t\t\t\t<div className=\"flex w-full flex-col\">{children}</div>\n\t\t\t\t</SheetContent>\n\t\t\t</Sheet>\n\t\t)\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"group peer text-sidebar-foreground hidden md:block\"\n\t\t\tdata-state={state}\n\t\t\tdata-collapsible={state === 'collapsed' ? collapsible : ''}\n\t\t\tdata-variant={variant}\n\t\t\tdata-side={side}\n\t\t\tdata-slot=\"sidebar\"\n\t\t>\n\t\t\t{/* This is what handles the sidebar gap on desktop /}\n\t\t\t<div\n\t\t\t\tdata-slot=\"sidebar-gap\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear',\n\t\t\t\t\t'group-data-[collapsible=offcanvas]:w-0',\n\t\t\t\t\t'group-data-[side=right]:rotate-180',\n\t\t\t\t\t'group-data-[state=collapsed]:mr-0 mr-6',\n\t\t\t\t\tvariant === 'floating' \|\| variant === 'inset'\n\t\t\t\t\t\t? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]'\n\t\t\t\t\t\t: 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)',\n\t\t\t\t)}\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tdata-slot=\"sidebar-container\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'fixed z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',\n\t\t\t\t\tside === 'left'\n\t\t\t\t\t\t? 'group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)-1)]'\n\t\t\t\t\t\t: 'group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)-1)]',\n\t\t\t\t\t// Adjust the padding for floating and inset variants.\n\t\t\t\t\tvariant === 'floating' \|\| variant === 'inset'\n\t\t\t\t\t\t? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]'\n\t\t\t\t\t\t: 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l',\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tdata-slot=\"sidebar-inner\"\n\t\t\t\t\tclassName=\"sidebar group-data-[variant=floating]:border-sidebar-border flex w-full flex-col group-data-[variant=floating]:rounded group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm flex-1\"\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\nfunction SidebarTrigger({\n\tclassName,\n\tonClick,\n\t...props\n}: React.ComponentProps<typeof Button>) {\n\tconst { isMobile, open, toggleSidebar } = useSidebar()\n\tconst rotationStyle = isMobile \|\| !open ? 'rotate-180' : ''\n\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\tdata-slot=\"sidebar-trigger\"\n\t\t\t\tvariant=\"ghost\"\n\t\t\t\tsize=\"icon\"\n\t\t\t\tclassName={cn('rounded-full', className)}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event)\n\t\t\t\t\ttoggleSidebar()\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<ChevronsLeft\n\t\t\t\t\tclassName={`transition-transform ${rotationStyle} size-6`}\n\t\t\t\t/>\n\t\t\t\t<span className=\"sr-only\">Toggle Sidebar</span>\n\t\t\t</Button>\n\t\t</>\n\t)\n}\n\nfunction SidebarRail({ className, ...props }: React.ComponentProps<'button'>) {\n\tconst { toggleSidebar } = useSidebar()\n\n\treturn (\n\t\t<button\n\t\t\tdata-slot=\"sidebar-rail\"\n\t\t\taria-label=\"Toggle Sidebar\"\n\t\t\ttabIndex={-1}\n\t\t\tonClick={toggleSidebar}\n\t\t\ttitle=\"Toggle Sidebar\"\n\t\t\tclassName={cn(\n\t\t\t\t'hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex',\n\t\t\t\t'in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize',\n\t\t\t\t'[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',\n\t\t\t\t'hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full',\n\t\t\t\t'[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',\n\t\t\t\t'[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarInset({ className, ...props }: React.ComponentProps<'main'>) {\n\treturn (\n\t\t<main\n\t\t\tdata-slot=\"sidebar-inset\"\n\t\t\tclassName={cn(\n\t\t\t\t'bg-background relative flex w-full flex-1 flex-col',\n\t\t\t\t'md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarInput({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof Input>) {\n\treturn (\n\t\t<Input\n\t\t\tdata-slot=\"sidebar-input\"\n\t\t\tclassName={cn('bg-background h-8 w-full shadow-none', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarHeader({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-header\"\n\t\t\tclassName={cn('flex flex-col gap-2 p-2', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarFooter({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-footer\"\n\t\t\tclassName={cn('flex flex-col gap-2 p-2', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarSeparator({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof Separator>) {\n\treturn (\n\t\t<Separator\n\t\t\tdata-slot=\"sidebar-separator\"\n\t\t\tclassName={cn('bg-sidebar-border mx-2 w-auto', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-content\"\n\t\t\tclassName={cn(\n\t\t\t\t'flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-group\"\n\t\t\tclassName={cn(\n\t\t\t\t'relative flex w-full min-w-0 flex-col p-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroupLabel({\n\tclassName,\n\tasChild = false,\n\t...props\n}: React.ComponentProps<'div'> & { asChild?: boolean }) {\n\tconst Comp = asChild ? Slot : 'div'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-group-label\"\n\t\t\tclassName={cn(\n\t\t\t\t'sidebar-text outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t'group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroupAction({\n\tclassName,\n\tasChild = false,\n\t...props\n}: React.ComponentProps<'button'> & { asChild?: boolean }) {\n\tconst Comp = asChild ? Slot : 'button'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-group-action\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t// Increases the hit area of the button on mobile.\n\t\t\t\t'after:absolute after:-inset-2 md:after:hidden',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroupContent({\n\tclassName,\n\t...props\n}: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-group-content\"\n\t\t\tclassName={cn('w-full text-sm', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"sidebar-menu\"\n\t\t\tclassName={cn('flex w-full min-w-0 flex-col gap-1', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"sidebar-menu-item\"\n\t\t\tclassName={cn('group/menu-item relative', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nconst sidebarMenuButtonVariants = cva(\n\t'peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[slot=sidebar-menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault:\n\t\t\t\t\t'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',\n\t\t\t\toutline:\n\t\t\t\t\t'bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]',\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: 'h-8 text-sm',\n\t\t\t\tsm: 'h-7 text-xs',\n\t\t\t\tlg: 'h-12 text-sm group-data-[collapsible=icon]:p-0!',\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: 'default',\n\t\t\tsize: 'default',\n\t\t},\n\t},\n)\n\nfunction SidebarMenuButton({\n\tasChild = false,\n\tisActive = false,\n\tvariant = 'default',\n\tsize = 'default',\n\ttooltip,\n\tclassName,\n\t...props\n}: React.ComponentProps<'button'> & {\n\tasChild?: boolean\n\tisActive?: boolean\n\ttooltip?: string \| React.ComponentProps<typeof TooltipContent>\n} & VariantProps<typeof sidebarMenuButtonVariants>) {\n\tconst Comp = asChild ? Slot : 'button'\n\tconst { isMobile, state } = useSidebar()\n\n\tconst button = (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-menu-button\"\n\t\t\tdata-size={size}\n\t\t\tdata-active={isActive}\n\t\t\tclassName={cn(\n\t\t\t\tsidebarMenuButtonVariants({ variant, size }),\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n\n\tif (!tooltip) {\n\t\treturn button\n\t}\n\n\tif (typeof tooltip === 'string') {\n\t\ttooltip = {\n\t\t\tchildren: tooltip,\n\t\t}\n\t}\n\n\treturn (\n\t\t<Tooltip>\n\t\t\t<TooltipTrigger asChild>{button}</TooltipTrigger>\n\t\t\t<TooltipContent\n\t\t\t\tside=\"right\"\n\t\t\t\talign=\"center\"\n\t\t\t\thidden={state !== 'collapsed' \|\| isMobile}\n\t\t\t\t{...tooltip}\n\t\t\t/>\n\t\t</Tooltip>\n\t)\n}\n\nfunction SidebarMenuAction({\n\tclassName,\n\tasChild = false,\n\tshowOnHover = false,\n\t...props\n}: React.ComponentProps<'button'> & {\n\tasChild?: boolean\n\tshowOnHover?: boolean\n}) {\n\tconst Comp = asChild ? Slot : 'button'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-menu-action\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t// Increases the hit area of the button on mobile.\n\t\t\t\t'after:absolute after:-inset-2 md:after:hidden',\n\t\t\t\t'peer-data-[size=sm]/menu-button:top-1',\n\t\t\t\t'peer-data-[size=default]/menu-button:top-1.5',\n\t\t\t\t'peer-data-[size=lg]/menu-button:top-2.5',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tshowOnHover &&\n\t\t\t\t\t'peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuBadge({\n\tclassName,\n\t...props\n}: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-menu-badge\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded px-1 text-xs font-medium tabular-nums select-none',\n\t\t\t\t'peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground',\n\t\t\t\t'peer-data-[size=sm]/menu-button:top-1',\n\t\t\t\t'peer-data-[size=default]/menu-button:top-1.5',\n\t\t\t\t'peer-data-[size=lg]/menu-button:top-2.5',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuSkeleton({\n\tclassName,\n\tshowIcon = false,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tshowIcon?: boolean\n}) {\n\t// Random width between 50 to 90%.\n\tconst width = React.useMemo(() => {\n\t\treturn `${Math.floor(Math.random() 40) + 50}%`\n\t}, [])\n\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-menu-skeleton\"\n\t\t\tclassName={cn(\n\t\t\t\t'flex h-8 items-center gap-2 rounded px-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{showIcon && <Skeleton className=\"size-4 rounded\" />}\n\t\t\t<Skeleton\n\t\t\t\tclassName=\"h-4 max-w-(--skeleton-width) flex-1\"\n\t\t\t\tstyle={\n\t\t\t\t\t{\n\t\t\t\t\t\t'--skeleton-width': width,\n\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n\nfunction SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"sidebar-menu-sub\"\n\t\t\tclassName={cn(\n\t\t\t\t'border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuSubItem({\n\tclassName,\n\t...props\n}: React.ComponentProps<'li'>) {\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"sidebar-menu-sub-item\"\n\t\t\tclassName={cn('group/menu-sub-item relative', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuSubButton({\n\tasChild = false,\n\tsize = 'md',\n\tisActive = false,\n\tclassName,\n\t...props\n}: React.ComponentProps<'a'> & {\n\tasChild?: boolean\n\tsize?: 'sm' \| 'md'\n\tisActive?: boolean\n}) {\n\tconst Comp = asChild ? Slot : 'a'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-menu-sub-button\"\n\t\t\tdata-size={size}\n\t\t\tdata-active={isActive}\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',\n\t\t\t\tsize === 'sm' && 'text-xs',\n\t\t\t\tsize === 'md' && 'text-sm',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport {\n\tSidebar,\n\tSidebarContent,\n\tSidebarFooter,\n\tSidebarGroup,\n\tSidebarGroupAction,\n\tSidebarGroupContent,\n\tSidebarGroupLabel,\n\tSidebarHeader,\n\tSidebarInput,\n\tSidebarInset,\n\tSidebarMenu,\n\tSidebarMenuAction,\n\tSidebarMenuBadge,\n\tSidebarMenuButton,\n\tSidebarMenuItem,\n\tSidebarMenuSkeleton,\n\tSidebarMenuSub,\n\tSidebarMenuSubButton,\n\tSidebarMenuSubItem,\n\tSidebarProvider,\n\tSidebarRail,\n\tSidebarSeparator,\n\tSidebarTrigger,\n\tuseSidebar,\n}\n"],"names":["SIDEBAR_WIDTH","SIDEBAR_WIDTH_MOBILE","SIDEBAR_WIDTH_ICON","SIDEBAR_KEYBOARD_SHORTCUT","SidebarContext","React","useSidebar","context","SidebarProvider","defaultOpen","openProp","setOpenProp","className","style","children","props","isMobile","useIsMobile","openMobile","setOpenMobile","_open","_setOpen","open","setOpen","value","openState","toggleSidebar","handleKeyDown","event","state","contextValue","jsx","TooltipProvider","cn","Sidebar","side","variant","collapsible","Sheet","jsxs","SheetContent","SheetHeader","SheetTitle","SheetDescription","SidebarTrigger","onClick","rotationStyle","Fragment","Button","ChevronsLeft","SidebarRail","SidebarInset","SidebarInput","Input","SidebarHeader","SidebarFooter","SidebarSeparator","Separator","SidebarContent","SidebarGroup","SidebarGroupLabel","asChild","Slot","SidebarGroupAction","SidebarGroupContent","SidebarMenu","SidebarMenuItem","sidebarMenuButtonVariants","cva","SidebarMenuButton","isActive","size","tooltip","Comp","button","Tooltip","TooltipTrigger","TooltipContent","SidebarMenuAction","showOnHover","SidebarMenuBadge","SidebarMenuSkeleton","showIcon","width","Skeleton","SidebarMenuSub","SidebarMenuSubItem","SidebarMenuSubButton"],"mappings":"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"}
1	+ {"version":3,"file":"Sidebar.js","sources":["../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["'use client'\n\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { ChevronsLeft } from 'lucide-react'\nimport * as React from 'react'\n\nimport { useIsMobile } from '@/hooks/use-mobile'\nimport { cn } from '@/utils'\nimport { Button } from '../Button'\nimport { Input } from '../Input'\nimport { Separator } from '../Separator'\nimport {\n\tSheet,\n\tSheetContent,\n\tSheetDescription,\n\tSheetHeader,\n\tSheetTitle,\n} from '../Sheet'\nimport { Skeleton } from '../Skeleton'\nimport {\n\tTooltip,\n\tTooltipContent,\n\tTooltipProvider,\n\tTooltipTrigger,\n} from '../Tooltip'\n\n// const SIDEBAR_COOKIE_NAME = 'sidebar_state'\n// const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7\nconst SIDEBAR_WIDTH = '18rem'\nconst SIDEBAR_WIDTH_MOBILE = '18rem'\nconst SIDEBAR_WIDTH_ICON = '3rem'\nconst SIDEBAR_KEYBOARD_SHORTCUT = 'b'\n\ntype SidebarContextProps = {\n\tstate: 'expanded' \| 'collapsed'\n\topen: boolean\n\tsetOpen: (open: boolean) => void\n\topenMobile: boolean\n\tsetOpenMobile: (open: boolean) => void\n\tisMobile: boolean\n\ttoggleSidebar: () => void\n}\n\nconst SidebarContext = React.createContext<SidebarContextProps \| null>(null)\n\nfunction useSidebar() {\n\tconst context = React.useContext(SidebarContext)\n\tif (!context) {\n\t\tthrow new Error('useSidebar must be used within a SidebarProvider.')\n\t}\n\n\treturn context\n}\n\nfunction SidebarProvider({\n\tdefaultOpen = true,\n\topen: openProp,\n\tonOpenChange: setOpenProp,\n\tclassName,\n\tstyle,\n\tchildren,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tdefaultOpen?: boolean\n\topen?: boolean\n\tonOpenChange?: (open: boolean) => void\n}) {\n\tconst isMobile = useIsMobile()\n\tconst [openMobile, setOpenMobile] = React.useState(false)\n\n\t// This is the internal state of the sidebar.\n\t// We use openProp and setOpenProp for control from outside the component.\n\tconst [_open, _setOpen] = React.useState(defaultOpen)\n\tconst open = openProp ?? _open\n\tconst setOpen = React.useCallback(\n\t\t(value: boolean \| ((value: boolean) => boolean)) => {\n\t\t\tconst openState = typeof value === 'function' ? value(open) : value\n\t\t\tif (setOpenProp) {\n\t\t\t\tsetOpenProp(openState)\n\t\t\t} else {\n\t\t\t\t_setOpen(openState)\n\t\t\t}\n\n\t\t\t// This sets the cookie to keep the sidebar state.\n\t\t\t// document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`\n\t\t},\n\t\t[setOpenProp, open],\n\t)\n\n\t// Helper to toggle the sidebar.\n\tconst toggleSidebar = React.useCallback(() => {\n\t\treturn isMobile\n\t\t\t? setOpenMobile((open) => !open)\n\t\t\t: setOpen((open) => !open)\n\t}, [isMobile, setOpen, setOpenMobile])\n\n\t// Adds a keyboard shortcut to toggle the sidebar.\n\tReact.useEffect(() => {\n\t\tconst handleKeyDown = (event: KeyboardEvent) => {\n\t\t\tif (\n\t\t\t\tevent.key === SIDEBAR_KEYBOARD_SHORTCUT &&\n\t\t\t\t(event.metaKey \|\| event.ctrlKey)\n\t\t\t) {\n\t\t\t\tevent.preventDefault()\n\t\t\t\ttoggleSidebar()\n\t\t\t}\n\t\t}\n\n\t\twindow.addEventListener('keydown', handleKeyDown)\n\t\treturn () => window.removeEventListener('keydown', handleKeyDown)\n\t}, [toggleSidebar])\n\n\t// We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n\t// This makes it easier to style the sidebar with Tailwind classes.\n\tconst state = open ? 'expanded' : 'collapsed'\n\n\tconst contextValue = React.useMemo<SidebarContextProps>(\n\t\t() => ({\n\t\t\tstate,\n\t\t\topen,\n\t\t\tsetOpen,\n\t\t\tisMobile,\n\t\t\topenMobile,\n\t\t\tsetOpenMobile,\n\t\t\ttoggleSidebar,\n\t\t}),\n\t\t[\n\t\t\tstate,\n\t\t\topen,\n\t\t\tsetOpen,\n\t\t\tisMobile,\n\t\t\topenMobile,\n\t\t\tsetOpenMobile,\n\t\t\ttoggleSidebar,\n\t\t],\n\t)\n\n\treturn (\n\t\t<SidebarContext.Provider value={contextValue}>\n\t\t\t<TooltipProvider delayDuration={0}>\n\t\t\t\t<div\n\t\t\t\t\tdata-slot=\"sidebar-wrapper\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'--sidebar-width': SIDEBAR_WIDTH,\n\t\t\t\t\t\t\t'--sidebar-width-icon': SIDEBAR_WIDTH_ICON,\n\t\t\t\t\t\t\t...style,\n\t\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t\t}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t'group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex w-full',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</TooltipProvider>\n\t\t</SidebarContext.Provider>\n\t)\n}\n\nfunction Sidebar({\n\tside = 'left',\n\tvariant = 'sidebar',\n\tcollapsible = 'offcanvas',\n\tclassName,\n\tchildren,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tside?: 'left' \| 'right'\n\tvariant?: 'sidebar' \| 'floating' \| 'inset'\n\tcollapsible?: 'offcanvas' \| 'icon' \| 'none'\n}) {\n\tconst { isMobile, state, openMobile, setOpenMobile } = useSidebar()\n\n\tif (collapsible === 'none') {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tdata-slot=\"sidebar\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'sidebar flex w-(--sidebar-width) flex-col',\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t)\n\t}\n\n\tif (isMobile) {\n\t\treturn (\n\t\t\t<Sheet open={openMobile} onOpenChange={setOpenMobile} {...props}>\n\t\t\t\t<SheetContent\n\t\t\t\t\tdata-slot=\"sidebar\"\n\t\t\t\t\tdata-mobile=\"true\"\n\t\t\t\t\tclassName=\"sidebar w-(--sidebar-width) p-0 [&>button]:hidden\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'--sidebar-width': SIDEBAR_WIDTH_MOBILE,\n\t\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t\t}\n\t\t\t\t\tside={side}\n\t\t\t\t>\n\t\t\t\t\t<SheetHeader className=\"sr-only\">\n\t\t\t\t\t\t<SheetTitle>Sidebar</SheetTitle>\n\t\t\t\t\t\t<SheetDescription>\n\t\t\t\t\t\t\tDisplays the mobile sidebar.\n\t\t\t\t\t\t</SheetDescription>\n\t\t\t\t\t</SheetHeader>\n\t\t\t\t\t<div className=\"flex w-full flex-col\">{children}</div>\n\t\t\t\t</SheetContent>\n\t\t\t</Sheet>\n\t\t)\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"group peer text-sidebar-foreground hidden md:block\"\n\t\t\tdata-state={state}\n\t\t\tdata-collapsible={state === 'collapsed' ? collapsible : ''}\n\t\t\tdata-variant={variant}\n\t\t\tdata-side={side}\n\t\t\tdata-slot=\"sidebar\"\n\t\t>\n\t\t\t{/* This is what handles the sidebar gap on desktop /}\n\t\t\t<div\n\t\t\t\tdata-slot=\"sidebar-gap\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear',\n\t\t\t\t\t'group-data-[collapsible=offcanvas]:w-0',\n\t\t\t\t\t'group-data-[side=right]:rotate-180',\n\t\t\t\t\t'group-data-[state=collapsed]:mr-0 mr-6',\n\t\t\t\t\tvariant === 'floating' \|\| variant === 'inset'\n\t\t\t\t\t\t? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]'\n\t\t\t\t\t\t: 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)',\n\t\t\t\t)}\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tdata-slot=\"sidebar-container\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'fixed z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',\n\t\t\t\t\tside === 'left'\n\t\t\t\t\t\t? 'group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)-1)]'\n\t\t\t\t\t\t: 'group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)-1)]',\n\t\t\t\t\t// Adjust the padding for floating and inset variants.\n\t\t\t\t\tvariant === 'floating' \|\| variant === 'inset'\n\t\t\t\t\t\t? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]'\n\t\t\t\t\t\t: 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l',\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tdata-slot=\"sidebar-inner\"\n\t\t\t\t\tclassName=\"sidebar group-data-[variant=floating]:border-sidebar-border flex w-full flex-col group-data-[variant=floating]:rounded group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm flex-1\"\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\nfunction SidebarTrigger({\n\tclassName,\n\tonClick,\n\t...props\n}: React.ComponentProps<typeof Button>) {\n\tconst { isMobile, open, toggleSidebar } = useSidebar()\n\tconst rotationStyle = isMobile \|\| !open ? 'rotate-180' : ''\n\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\tdata-slot=\"sidebar-trigger\"\n\t\t\t\tvariant=\"ghost\"\n\t\t\t\tsize=\"icon\"\n\t\t\t\tclassName={cn('rounded-full', className)}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event)\n\t\t\t\t\ttoggleSidebar()\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<ChevronsLeft\n\t\t\t\t\tclassName={`transition-transform ${rotationStyle} size-6`}\n\t\t\t\t/>\n\t\t\t\t<span className=\"sr-only\">Toggle Sidebar</span>\n\t\t\t</Button>\n\t\t</>\n\t)\n}\n\nfunction SidebarRail({ className, ...props }: React.ComponentProps<'button'>) {\n\tconst { toggleSidebar } = useSidebar()\n\n\treturn (\n\t\t<button\n\t\t\tdata-slot=\"sidebar-rail\"\n\t\t\taria-label=\"Toggle Sidebar\"\n\t\t\ttabIndex={-1}\n\t\t\tonClick={toggleSidebar}\n\t\t\ttitle=\"Toggle Sidebar\"\n\t\t\tclassName={cn(\n\t\t\t\t'hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex',\n\t\t\t\t'in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize',\n\t\t\t\t'[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',\n\t\t\t\t'hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full',\n\t\t\t\t'[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',\n\t\t\t\t'[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarInset({ className, ...props }: React.ComponentProps<'main'>) {\n\treturn (\n\t\t<main\n\t\t\tdata-slot=\"sidebar-inset\"\n\t\t\tclassName={cn(\n\t\t\t\t'bg-background relative flex w-full flex-1 flex-col',\n\t\t\t\t'md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarInput({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof Input>) {\n\treturn (\n\t\t<Input\n\t\t\tdata-slot=\"sidebar-input\"\n\t\t\tclassName={cn('bg-background h-8 w-full shadow-none', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarHeader({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-header\"\n\t\t\tclassName={cn('flex flex-col gap-2 p-2', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarFooter({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-footer\"\n\t\t\tclassName={cn('flex flex-col gap-2 p-2', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarSeparator({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof Separator>) {\n\treturn (\n\t\t<Separator\n\t\t\tdata-slot=\"sidebar-separator\"\n\t\t\tclassName={cn('bg-sidebar-border mx-2 w-auto', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-content\"\n\t\t\tclassName={cn(\n\t\t\t\t'flex min-h-0 flex-1 flex-col gap-2 overflow-x-hidden overflow-y-auto group-data-[collapsible=icon]:overflow-hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-group\"\n\t\t\tclassName={cn(\n\t\t\t\t'relative flex w-full min-w-0 flex-col p-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroupLabel({\n\tclassName,\n\tasChild = false,\n\t...props\n}: React.ComponentProps<'div'> & { asChild?: boolean }) {\n\tconst Comp = asChild ? Slot : 'div'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-group-label\"\n\t\t\tclassName={cn(\n\t\t\t\t'sidebar-text outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t'group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroupAction({\n\tclassName,\n\tasChild = false,\n\t...props\n}: React.ComponentProps<'button'> & { asChild?: boolean }) {\n\tconst Comp = asChild ? Slot : 'button'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-group-action\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t// Increases the hit area of the button on mobile.\n\t\t\t\t'after:absolute after:-inset-2 md:after:hidden',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarGroupContent({\n\tclassName,\n\t...props\n}: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-group-content\"\n\t\t\tclassName={cn('w-full text-sm', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"sidebar-menu\"\n\t\t\tclassName={cn('flex w-full min-w-0 flex-col gap-1', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"sidebar-menu-item\"\n\t\t\tclassName={cn('group/menu-item relative', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nconst sidebarMenuButtonVariants = cva(\n\t'peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[slot=sidebar-menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault:\n\t\t\t\t\t'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',\n\t\t\t\toutline:\n\t\t\t\t\t'bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]',\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: 'h-8 text-sm',\n\t\t\t\tsm: 'h-7 text-xs',\n\t\t\t\tlg: 'h-12 text-sm group-data-[collapsible=icon]:p-0!',\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: 'default',\n\t\t\tsize: 'default',\n\t\t},\n\t},\n)\n\nfunction SidebarMenuButton({\n\tasChild = false,\n\tisActive = false,\n\tvariant = 'default',\n\tsize = 'default',\n\ttooltip,\n\tclassName,\n\t...props\n}: React.ComponentProps<'button'> & {\n\tasChild?: boolean\n\tisActive?: boolean\n\ttooltip?: string \| React.ComponentProps<typeof TooltipContent>\n} & VariantProps<typeof sidebarMenuButtonVariants>) {\n\tconst Comp = asChild ? Slot : 'button'\n\tconst { isMobile, state } = useSidebar()\n\n\tconst button = (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-menu-button\"\n\t\t\tdata-size={size}\n\t\t\tdata-active={isActive}\n\t\t\tclassName={cn(\n\t\t\t\tsidebarMenuButtonVariants({ variant, size }),\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n\n\tif (!tooltip) {\n\t\treturn button\n\t}\n\n\tif (typeof tooltip === 'string') {\n\t\ttooltip = {\n\t\t\tchildren: tooltip,\n\t\t}\n\t}\n\n\treturn (\n\t\t<Tooltip>\n\t\t\t<TooltipTrigger asChild>{button}</TooltipTrigger>\n\t\t\t<TooltipContent\n\t\t\t\tside=\"right\"\n\t\t\t\talign=\"center\"\n\t\t\t\thidden={state !== 'collapsed' \|\| isMobile}\n\t\t\t\t{...tooltip}\n\t\t\t/>\n\t\t</Tooltip>\n\t)\n}\n\nfunction SidebarMenuAction({\n\tclassName,\n\tasChild = false,\n\tshowOnHover = false,\n\t...props\n}: React.ComponentProps<'button'> & {\n\tasChild?: boolean\n\tshowOnHover?: boolean\n}) {\n\tconst Comp = asChild ? Slot : 'button'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-menu-action\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t// Increases the hit area of the button on mobile.\n\t\t\t\t'after:absolute after:-inset-2 md:after:hidden',\n\t\t\t\t'peer-data-[size=sm]/menu-button:top-1',\n\t\t\t\t'peer-data-[size=default]/menu-button:top-1.5',\n\t\t\t\t'peer-data-[size=lg]/menu-button:top-2.5',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tshowOnHover &&\n\t\t\t\t\t'peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuBadge({\n\tclassName,\n\t...props\n}: React.ComponentProps<'div'>) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-menu-badge\"\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded px-1 text-xs font-medium tabular-nums select-none',\n\t\t\t\t'peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground',\n\t\t\t\t'peer-data-[size=sm]/menu-button:top-1',\n\t\t\t\t'peer-data-[size=default]/menu-button:top-1.5',\n\t\t\t\t'peer-data-[size=lg]/menu-button:top-2.5',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuSkeleton({\n\tclassName,\n\tshowIcon = false,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tshowIcon?: boolean\n}) {\n\t// Random width between 50 to 90%.\n\tconst width = React.useMemo(() => {\n\t\treturn `${Math.floor(Math.random() 40) + 50}%`\n\t}, [])\n\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-menu-skeleton\"\n\t\t\tclassName={cn(\n\t\t\t\t'flex h-8 items-center gap-2 rounded px-2',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{showIcon && <Skeleton className=\"size-4 rounded\" />}\n\t\t\t<Skeleton\n\t\t\t\tclassName=\"h-4 max-w-(--skeleton-width) flex-1\"\n\t\t\t\tstyle={\n\t\t\t\t\t{\n\t\t\t\t\t\t'--skeleton-width': width,\n\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t}\n\t\t\t/>\n\t\t</div>\n\t)\n}\n\nfunction SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"sidebar-menu-sub\"\n\t\t\tclassName={cn(\n\t\t\t\t'border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuSubItem({\n\tclassName,\n\t...props\n}: React.ComponentProps<'li'>) {\n\treturn (\n\t\t<li\n\t\t\tdata-slot=\"sidebar-menu-sub-item\"\n\t\t\tclassName={cn('group/menu-sub-item relative', className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction SidebarMenuSubButton({\n\tasChild = false,\n\tsize = 'md',\n\tisActive = false,\n\tclassName,\n\t...props\n}: React.ComponentProps<'a'> & {\n\tasChild?: boolean\n\tsize?: 'sm' \| 'md'\n\tisActive?: boolean\n}) {\n\tconst Comp = asChild ? Slot : 'a'\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"sidebar-menu-sub-button\"\n\t\t\tdata-size={size}\n\t\t\tdata-active={isActive}\n\t\t\tclassName={cn(\n\t\t\t\t'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',\n\t\t\t\t'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',\n\t\t\t\tsize === 'sm' && 'text-xs',\n\t\t\t\tsize === 'md' && 'text-sm',\n\t\t\t\t'group-data-[collapsible=icon]:hidden',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport {\n\tSidebar,\n\tSidebarContent,\n\tSidebarFooter,\n\tSidebarGroup,\n\tSidebarGroupAction,\n\tSidebarGroupContent,\n\tSidebarGroupLabel,\n\tSidebarHeader,\n\tSidebarInput,\n\tSidebarInset,\n\tSidebarMenu,\n\tSidebarMenuAction,\n\tSidebarMenuBadge,\n\tSidebarMenuButton,\n\tSidebarMenuItem,\n\tSidebarMenuSkeleton,\n\tSidebarMenuSub,\n\tSidebarMenuSubButton,\n\tSidebarMenuSubItem,\n\tSidebarProvider,\n\tSidebarRail,\n\tSidebarSeparator,\n\tSidebarTrigger,\n\tuseSidebar,\n}\n"],"names":["SIDEBAR_WIDTH","SIDEBAR_WIDTH_MOBILE","SIDEBAR_WIDTH_ICON","SIDEBAR_KEYBOARD_SHORTCUT","SidebarContext","React","useSidebar","context","SidebarProvider","defaultOpen","openProp","setOpenProp","className","style","children","props","isMobile","useIsMobile","openMobile","setOpenMobile","_open","_setOpen","open","setOpen","value","openState","toggleSidebar","handleKeyDown","event","state","contextValue","jsx","TooltipProvider","cn","Sidebar","side","variant","collapsible","Sheet","jsxs","SheetContent","SheetHeader","SheetTitle","SheetDescription","SidebarTrigger","onClick","rotationStyle","Fragment","Button","ChevronsLeft","SidebarRail","SidebarInset","SidebarInput","Input","SidebarHeader","SidebarFooter","SidebarSeparator","Separator","SidebarContent","SidebarGroup","SidebarGroupLabel","asChild","Slot","SidebarGroupAction","SidebarGroupContent","SidebarMenu","SidebarMenuItem","sidebarMenuButtonVariants","cva","SidebarMenuButton","isActive","size","tooltip","Comp","button","Tooltip","TooltipTrigger","TooltipContent","SidebarMenuAction","showOnHover","SidebarMenuBadge","SidebarMenuSkeleton","showIcon","width","Skeleton","SidebarMenuSub","SidebarMenuSubItem","SidebarMenuSubButton"],"mappings":"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"}

package/dist/components/ThemeSelector/ThemeSelector.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeSelector.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeSelector/ThemeSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;~~AAOlC~~,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,2CAmBxF"}
1	+ {"version":3,"file":"ThemeSelector.d.ts","sourceRoot":"","sources":["../../../src/components/ThemeSelector/ThemeSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AASlC,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,2CAmBxF"}

package/dist/components/ThemeSelector.js CHANGED Viewed

@@ -1,23 +1,25 @@
-import { jsx as o } from "react/jsx-runtime";
+import { jsx as l } from "react/jsx-runtime";
 import "react";
 import { u as m } from "../shared/useTheme.js";
 import { S as i } from "../shared/Select.js";
-const c = [
+const s = [
   { value: "linen", label: "Linen" },
-  { value: "steel", label: "Steel" }
+  { value: "steel", label: "Steel" },
+  { value: "sage", label: "Sage" },
+  { value: "dusk", label: "Dusk" }
 ];
-function S({ onChange: l, ...t }) {
-  const { colorTheme: r, setColorTheme: n } = m();
-  return /* @__PURE__ */ o(
+function S({ onChange: o, ...a }) {
+  const { colorTheme: t, setColorTheme: r } = m();
+  return /* @__PURE__ */ l(
     i,
     {
-      value: r,
+      value: t,
       "aria-label": "Select color theme",
       onChange: (e) => {
-        n(e.target.value), l?.(e);
+        r(e.target.value), o?.(e);
       },
-      ...t,
-      children: c.map(({ value: e, label: a }) => /* @__PURE__ */ o("option", { value: e, children: a }, e))
+      ...a,
+      children: s.map(({ value: e, label: n }) => /* @__PURE__ */ l("option", { value: e, children: n }, e))
     }
   );
 }

package/dist/components/ThemeSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeSelector.js","sources":["../../src/components/ThemeSelector/ThemeSelector.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useTheme } from '@/themes'\nimport type { ColorTheme } from '@/themes'\nimport { Select } from '../Select'\n\nconst COLOR_THEMES: { value: ColorTheme; label: string }[] = [\n\t{ value: 'linen', label: 'Linen' },\n\t{ value: 'steel', label: 'Steel' },\n]\n\nexport function ThemeSelector({ onChange, ...props }: React.ComponentProps<typeof Select>) {\n\tconst { colorTheme, setColorTheme } = useTheme()\n\treturn (\n\t\t<Select\n\t\t\tvalue={colorTheme}\n\t\t\taria-label=\"Select color theme\"\n\t\t\tonChange={(e) => {\n\t\t\t\tsetColorTheme(e.target.value as ColorTheme)\n\t\t\t\tonChange?.(e)\n\t\t\t}}\n\t\t\t{...props}\n\t\t>\n\t\t\t{COLOR_THEMES.map(({ value, label }) => (\n\t\t\t\t<option key={value} value={value}>\n\t\t\t\t\t{label}\n\t\t\t\t</option>\n\t\t\t))}\n\t\t</Select>\n\t)\n}\n"],"names":["COLOR_THEMES","ThemeSelector","onChange","props","colorTheme","setColorTheme","useTheme","jsx","Select","value","label"],"mappings":";;;;AAKA,MAAMA,IAAuD;AAAA,EAC5D,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,SAAS,OAAO,QAAA;~~AAC1B~~;AAEO,SAASC,EAAc,EAAE,UAAAC,GAAU,GAAGC,KAA8C;AAC1F,QAAM,EAAE,YAAAC,GAAY,eAAAC,EAAA,IAAkBC,EAAA;AACtC,SACC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,OAAOJ;AAAA,MACP,cAAW;AAAA,MACX,UAAU,CAAC,MAAM;AAChB,QAAAC,EAAc,EAAE,OAAO,KAAmB,GAC1CH,IAAW,CAAC;AAAA,MACb;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH,EAAa,IAAI,CAAC,EAAE,OAAAS,GAAO,OAAAC,EAAA,MAC3B,gBAAAH,EAAC,UAAA,EAAmB,OAAAE,GAClB,UAAAC,EAAA,GADWD,CAEb,CACA;AAAA,IAAA;AAAA,EAAA;AAGJ;"}
1	+ {"version":3,"file":"ThemeSelector.js","sources":["../../src/components/ThemeSelector/ThemeSelector.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useTheme } from '@/themes'\nimport type { ColorTheme } from '@/themes'\nimport { Select } from '../Select'\n\nconst COLOR_THEMES: { value: ColorTheme; label: string }[] = [\n\t{ value: 'linen', label: 'Linen' },\n\t{ value: 'steel', label: 'Steel' },\n\t{ value: 'sage', label: 'Sage' },\n\t{ value: 'dusk', label: 'Dusk' },\n]\n\nexport function ThemeSelector({ onChange, ...props }: React.ComponentProps<typeof Select>) {\n\tconst { colorTheme, setColorTheme } = useTheme()\n\treturn (\n\t\t<Select\n\t\t\tvalue={colorTheme}\n\t\t\taria-label=\"Select color theme\"\n\t\t\tonChange={(e) => {\n\t\t\t\tsetColorTheme(e.target.value as ColorTheme)\n\t\t\t\tonChange?.(e)\n\t\t\t}}\n\t\t\t{...props}\n\t\t>\n\t\t\t{COLOR_THEMES.map(({ value, label }) => (\n\t\t\t\t<option key={value} value={value}>\n\t\t\t\t\t{label}\n\t\t\t\t</option>\n\t\t\t))}\n\t\t</Select>\n\t)\n}\n"],"names":["COLOR_THEMES","ThemeSelector","onChange","props","colorTheme","setColorTheme","useTheme","jsx","Select","value","label"],"mappings":";;;;AAKA,MAAMA,IAAuD;AAAA,EAC5D,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,SAAS,OAAO,QAAA;AAAA,EACzB,EAAE,OAAO,QAAQ,OAAO,OAAA;AAAA,EACxB,EAAE,OAAO,QAAQ,OAAO,OAAA;AACzB;AAEO,SAASC,EAAc,EAAE,UAAAC,GAAU,GAAGC,KAA8C;AAC1F,QAAM,EAAE,YAAAC,GAAY,eAAAC,EAAA,IAAkBC,EAAA;AACtC,SACC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,OAAOJ;AAAA,MACP,cAAW;AAAA,MACX,UAAU,CAAC,MAAM;AAChB,QAAAC,EAAc,EAAE,OAAO,KAAmB,GAC1CH,IAAW,CAAC;AAAA,MACb;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH,EAAa,IAAI,CAAC,EAAE,OAAAS,GAAO,OAAAC,EAAA,MAC3B,gBAAAH,EAAC,UAAA,EAAmB,OAAAE,GAClB,UAAAC,EAAA,GADWD,CAEb,CACA;AAAA,IAAA;AAAA,EAAA;AAGJ;"}

package/dist/index.css CHANGED Viewed

	@@ -1 +1 @@
1	- :root{--background: oklch(.992 .003 85);--foreground: oklch(.2 .01 85);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.18 .01 85);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.18 .01 85);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(1 0 0);--accent-foreground: oklch(.18 .01 85);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.18 .01 85 / .1);--radius: .6rem;--sidebar: oklch(.995 .002 85);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.18 .01 85);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.97 .01 85);--sidebar-accent-foreground: oklch(.18 .01 85);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.15 .01 60);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}[data-theme=linen]{--background: oklch(.992 .003 85);--foreground: oklch(.2 .01 85);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.18 .01 85);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.18 .01 85);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(1 0 0);--accent-foreground: oklch(.18 .01 85);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.18 .01 85 / .1);--radius: .6rem;--sidebar: oklch(.995 .002 85);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.18 .01 85);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.97 .01 85);--sidebar-accent-foreground: oklch(.18 .01 85);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.15 .01 60);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}:root.dark,[data-theme=linen].dark{--background: oklch(.14 .01 80);--foreground: oklch(.93 .01 85);--card: oklch(.19 .012 80 / .75);--card-foreground: oklch(.93 .01 85);--popover: oklch(.17 .01 80);--popover-foreground: oklch(.93 .01 85);--primary: oklch(.86 .05 85);--primary-foreground: oklch(.14 .01 80);--secondary: oklch(.24 .01 80);--secondary-foreground: oklch(.86 .05 85);--muted: oklch(.24 .01 80);--muted-foreground: oklch(.6 .01 85);--accent: oklch(.24 .01 80);--accent-foreground: oklch(.86 .05 85);--destructive: oklch(.48 .15 25);--destructive-foreground: oklch(.93 .01 85);--border: oklch(.28 .01 80);--input: oklch(.28 .01 80);--ring: oklch(.86 .05 85 / .3);--sidebar: oklch(.17 .01 80);--sidebar-foreground: oklch(.93 .01 85);--sidebar-primary: oklch(.86 .05 85);--sidebar-primary-foreground: oklch(.14 .01 80);--sidebar-accent: oklch(.23 .01 80);--sidebar-accent-foreground: oklch(.93 .01 85);--sidebar-border: oklch(.28 .01 80);--banner-info: oklch(.22 .04 230);--banner-info-foreground: oklch(.88 .05 230);--banner-info-border: oklch(.48 .16 235);--banner-note: oklch(.22 .04 155);--banner-note-foreground: oklch(.88 .06 155);--banner-note-border: oklch(.44 .1 155);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.44 .12 150);--badge-success-foreground: oklch(.93 .01 85);--checkbox-checked: oklch(.86 .05 85);--checkbox-checked-foreground: oklch(.14 .01 80);--checkbox-unchecked-bg: oklch(.22 .01 80);--checkbox-unchecked-border: oklch(.35 .01 80)}[data-theme=steel]{--background: oklch(.95 .005 250);--foreground: oklch(.2 .02 250);--card: oklch(.98 .005 250 / .85);--card-foreground: oklch(.2 .02 250);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 250);--primary: oklch(.3 .05 250);--primary-foreground: oklch(.98 .005 250);--secondary: oklch(.97 .005 250);--secondary-foreground: oklch(.3 .05 250);--muted: oklch(.93 .005 250);--muted-foreground: oklch(.5 .02 250);--accent: oklch(.91 .008 250);--accent-foreground: oklch(.3 .05 250);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.88 .005 250);--input: oklch(.88 .005 250);--ring: oklch(.3 .05 250 / .15);--radius: .25rem;--sidebar: oklch(.97 .005 250);--sidebar-foreground: oklch(.25 .02 250);--sidebar-primary: oklch(.3 .05 250);--sidebar-primary-foreground: oklch(.98 .005 250);--sidebar-accent: oklch(.93 .008 250);--sidebar-accent-foreground: oklch(.25 .02 250);--sidebar-border: oklch(.9 .005 250);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 162);--banner-note-foreground: oklch(.24 .1 162);--banner-note-border: oklch(.48 .16 162);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .05 250);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.85 .01 250)}[data-theme=steel].dark{--background: oklch(.18 .015 260);--foreground: oklch(.985 0 0);--card: oklch(.23 .02 260 / .75);--card-foreground: oklch(.985 0 0);--popover: oklch(.21 .015 260);--popover-foreground: oklch(.985 0 0);--primary: oklch(.9 .1 220);--primary-foreground: oklch(.18 .015 260);--secondary: oklch(.28 .02 260);--secondary-foreground: oklch(.9 .1 220);--muted: oklch(.28 .02 260);--muted-foreground: oklch(.705 .015 260);--accent: oklch(.28 .02 260);--accent-foreground: oklch(.9 .1 220);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.985 0 0);--border: oklch(.32 .02 260);--input: oklch(.32 .02 260);--ring: oklch(.9 .1 220 / .3);--sidebar: oklch(.21 .015 260);--sidebar-foreground: oklch(.985 0 0);--sidebar-primary: oklch(.9 .1 220);--sidebar-primary-foreground: oklch(.18 .015 260);--sidebar-accent: oklch(.28 .02 260);--sidebar-accent-foreground: oklch(.985 0 0);--sidebar-border: oklch(.32 .02 260);--banner-info: oklch(.274 .079 260);--banner-info-foreground: oklch(.925 .033 260);--banner-info-border: oklch(.488 .2 260);--banner-note: oklch(.266 .065 152);--banner-note-foreground: oklch(.962 .044 156);--banner-note-border: oklch(.45 .1 152);--banner-warning: oklch(.55 .22 100);--banner-warning-foreground: oklch(.99 .15 102);--banner-warning-border: oklch(.75 .25 100);--banner-alert: oklch(.293 .084 27);--banner-alert-foreground: oklch(.969 .071 27);--banner-alert-border: oklch(.45 .12 27);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.9 .1 220);--checkbox-checked-foreground: oklch(.18 .015 260);--checkbox-unchecked-bg: oklch(.25 .01 260);--checkbox-unchecked-border: oklch(.4 .01 260)}
1	+ :root{--background: oklch(.992 .003 85);--foreground: oklch(.2 .01 85);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.18 .01 85);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.18 .01 85);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(1 0 0);--accent-foreground: oklch(.18 .01 85);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.18 .01 85 / .1);--sidebar: oklch(.995 .002 85);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.18 .01 85);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.97 .01 85);--sidebar-accent-foreground: oklch(.18 .01 85);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.15 .01 60);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}[data-theme=linen]{--background: oklch(.992 .003 85);--foreground: oklch(.2 .01 85);--card: oklch(1 0 0 / .75);--card-foreground: oklch(.2 .01 85);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .01 85);--primary: oklch(.18 .01 85);--primary-foreground: oklch(1 0 0);--secondary: oklch(1 0 0);--secondary-foreground: oklch(.18 .01 85);--muted: oklch(1 0 0);--muted-foreground: oklch(.5 .01 85);--accent: oklch(1 0 0);--accent-foreground: oklch(.18 .01 85);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.94 .005 85);--input: oklch(.94 .005 85);--ring: oklch(.18 .01 85 / .1);--sidebar: oklch(.995 .002 85);--sidebar-foreground: oklch(.2 .01 85);--sidebar-primary: oklch(.18 .01 85);--sidebar-primary-foreground: oklch(1 0 0);--sidebar-accent: oklch(.97 .01 85);--sidebar-accent-foreground: oklch(.18 .01 85);--sidebar-border: oklch(.95 .005 85);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.4 .1 240);--banner-info-border: oklch(.85 .05 240);--banner-note: oklch(.94 .02 160);--banner-note-foreground: oklch(.35 .1 160);--banner-note-border: oklch(.85 .05 160);--banner-warning: oklch(.95 .03 80);--banner-warning-foreground: oklch(.45 .1 60);--banner-warning-border: oklch(.88 .05 70);--banner-alert: oklch(.95 .03 25);--banner-alert-foreground: oklch(.45 .12 25);--banner-alert-border: oklch(.88 .08 25);--badge-success: oklch(.4 .1 160);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.15 .01 60);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.88 .01 60)}:root.dark,[data-theme=linen].dark{--background: oklch(.14 .01 80);--foreground: oklch(.93 .01 85);--card: oklch(.19 .012 80 / .75);--card-foreground: oklch(.93 .01 85);--popover: oklch(.17 .01 80);--popover-foreground: oklch(.93 .01 85);--primary: oklch(.86 .05 85);--primary-foreground: oklch(.14 .01 80);--secondary: oklch(.24 .01 80);--secondary-foreground: oklch(.86 .05 85);--muted: oklch(.24 .01 80);--muted-foreground: oklch(.6 .01 85);--accent: oklch(.24 .01 80);--accent-foreground: oklch(.86 .05 85);--destructive: oklch(.48 .15 25);--destructive-foreground: oklch(.93 .01 85);--border: oklch(.28 .01 80);--input: oklch(.28 .01 80);--ring: oklch(.86 .05 85 / .3);--sidebar: oklch(.17 .01 80);--sidebar-foreground: oklch(.93 .01 85);--sidebar-primary: oklch(.86 .05 85);--sidebar-primary-foreground: oklch(.14 .01 80);--sidebar-accent: oklch(.23 .01 80);--sidebar-accent-foreground: oklch(.93 .01 85);--sidebar-border: oklch(.28 .01 80);--banner-info: oklch(.22 .04 230);--banner-info-foreground: oklch(.88 .05 230);--banner-info-border: oklch(.48 .16 235);--banner-note: oklch(.22 .04 155);--banner-note-foreground: oklch(.88 .06 155);--banner-note-border: oklch(.44 .1 155);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.44 .12 150);--badge-success-foreground: oklch(.93 .01 85);--checkbox-checked: oklch(.86 .05 85);--checkbox-checked-foreground: oklch(.14 .01 80);--checkbox-unchecked-bg: oklch(.22 .01 80);--checkbox-unchecked-border: oklch(.35 .01 80)}[data-theme=steel]{--background: oklch(.95 .005 250);--foreground: oklch(.2 .02 250);--card: oklch(.98 .005 250 / .85);--card-foreground: oklch(.2 .02 250);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 250);--primary: oklch(.3 .05 250);--primary-foreground: oklch(.98 .005 250);--secondary: oklch(.97 .005 250);--secondary-foreground: oklch(.3 .05 250);--muted: oklch(.93 .005 250);--muted-foreground: oklch(.5 .02 250);--accent: oklch(.91 .008 250);--accent-foreground: oklch(.3 .05 250);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.88 .005 250);--input: oklch(.88 .005 250);--ring: oklch(.3 .05 250 / .15);--sidebar: oklch(.97 .005 250);--sidebar-foreground: oklch(.25 .02 250);--sidebar-primary: oklch(.3 .05 250);--sidebar-primary-foreground: oklch(.98 .005 250);--sidebar-accent: oklch(.93 .008 250);--sidebar-accent-foreground: oklch(.25 .02 250);--sidebar-border: oklch(.9 .005 250);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 162);--banner-note-foreground: oklch(.24 .1 162);--banner-note-border: oklch(.48 .16 162);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .05 250);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.85 .01 250)}[data-theme=steel].dark{--background: oklch(.18 .015 260);--foreground: oklch(.985 0 0);--card: oklch(.23 .02 260 / .75);--card-foreground: oklch(.985 0 0);--popover: oklch(.21 .015 260);--popover-foreground: oklch(.985 0 0);--primary: oklch(.9 .1 220);--primary-foreground: oklch(.18 .015 260);--secondary: oklch(.28 .02 260);--secondary-foreground: oklch(.9 .1 220);--muted: oklch(.28 .02 260);--muted-foreground: oklch(.705 .015 260);--accent: oklch(.28 .02 260);--accent-foreground: oklch(.9 .1 220);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.985 0 0);--border: oklch(.32 .02 260);--input: oklch(.32 .02 260);--ring: oklch(.9 .1 220 / .3);--sidebar: oklch(.21 .015 260);--sidebar-foreground: oklch(.985 0 0);--sidebar-primary: oklch(.9 .1 220);--sidebar-primary-foreground: oklch(.18 .015 260);--sidebar-accent: oklch(.28 .02 260);--sidebar-accent-foreground: oklch(.985 0 0);--sidebar-border: oklch(.32 .02 260);--banner-info: oklch(.274 .079 260);--banner-info-foreground: oklch(.925 .033 260);--banner-info-border: oklch(.488 .2 260);--banner-note: oklch(.266 .065 152);--banner-note-foreground: oklch(.962 .044 156);--banner-note-border: oklch(.45 .1 152);--banner-warning: oklch(.55 .22 100);--banner-warning-foreground: oklch(.99 .15 102);--banner-warning-border: oklch(.75 .25 100);--banner-alert: oklch(.293 .084 27);--banner-alert-foreground: oklch(.969 .071 27);--banner-alert-border: oklch(.45 .12 27);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.9 .1 220);--checkbox-checked-foreground: oklch(.18 .015 260);--checkbox-unchecked-bg: oklch(.25 .01 260);--checkbox-unchecked-border: oklch(.4 .01 260)}[data-theme=sage]{--background: oklch(.965 .007 145);--foreground: oklch(.18 .02 145);--card: oklch(.99 .004 145 / .75);--card-foreground: oklch(.18 .02 145);--popover: oklch(1 0 0);--popover-foreground: oklch(.18 .02 145);--primary: oklch(.25 .06 145);--primary-foreground: oklch(.97 .005 145);--secondary: oklch(.97 .006 145);--secondary-foreground: oklch(.25 .06 145);--muted: oklch(.94 .006 145);--muted-foreground: oklch(.5 .02 145);--accent: oklch(.92 .008 145);--accent-foreground: oklch(.25 .06 145);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.9 .006 145);--input: oklch(.9 .006 145);--ring: oklch(.25 .06 145 / .15);--sidebar: oklch(.97 .006 145);--sidebar-foreground: oklch(.22 .02 145);--sidebar-primary: oklch(.25 .06 145);--sidebar-primary-foreground: oklch(.97 .005 145);--sidebar-accent: oklch(.93 .008 145);--sidebar-accent-foreground: oklch(.22 .02 145);--sidebar-border: oklch(.91 .006 145);--banner-info: oklch(.94 .02 240);--banner-info-foreground: oklch(.24 .09 240);--banner-info-border: oklch(.52 .18 240);--banner-note: oklch(.94 .02 145);--banner-note-foreground: oklch(.24 .1 145);--banner-note-border: oklch(.48 .16 145);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 145);--badge-success-foreground: oklch(.98 .01 145);--checkbox-checked: oklch(.25 .06 145);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.87 .008 145)}[data-theme=sage].dark{--background: oklch(.14 .015 145);--foreground: oklch(.93 .01 145);--card: oklch(.19 .018 145 / .75);--card-foreground: oklch(.93 .01 145);--popover: oklch(.17 .015 145);--popover-foreground: oklch(.93 .01 145);--primary: oklch(.8 .1 145);--primary-foreground: oklch(.14 .015 145);--secondary: oklch(.24 .015 145);--secondary-foreground: oklch(.8 .1 145);--muted: oklch(.24 .015 145);--muted-foreground: oklch(.62 .015 145);--accent: oklch(.24 .015 145);--accent-foreground: oklch(.8 .1 145);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.93 .01 145);--border: oklch(.28 .015 145);--input: oklch(.28 .015 145);--ring: oklch(.8 .1 145 / .3);--sidebar: oklch(.17 .015 145);--sidebar-foreground: oklch(.93 .01 145);--sidebar-primary: oklch(.8 .1 145);--sidebar-primary-foreground: oklch(.14 .015 145);--sidebar-accent: oklch(.23 .015 145);--sidebar-accent-foreground: oklch(.93 .01 145);--sidebar-border: oklch(.28 .015 145);--banner-info: oklch(.22 .04 240);--banner-info-foreground: oklch(.88 .05 240);--banner-info-border: oklch(.48 .16 240);--banner-note: oklch(.22 .05 145);--banner-note-foreground: oklch(.88 .06 145);--banner-note-border: oklch(.5 .12 145);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 145);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.8 .1 145);--checkbox-checked-foreground: oklch(.14 .015 145);--checkbox-unchecked-bg: oklch(.22 .01 145);--checkbox-unchecked-border: oklch(.38 .01 145)}[data-theme=dusk]{--background: oklch(.965 .006 295);--foreground: oklch(.2 .02 295);--card: oklch(.99 .004 295 / .85);--card-foreground: oklch(.2 .02 295);--popover: oklch(1 0 0);--popover-foreground: oklch(.2 .02 295);--primary: oklch(.3 .06 295);--primary-foreground: oklch(.98 .005 295);--secondary: oklch(.97 .005 295);--secondary-foreground: oklch(.3 .06 295);--muted: oklch(.94 .005 295);--muted-foreground: oklch(.52 .02 295);--accent: oklch(.92 .008 295);--accent-foreground: oklch(.3 .06 295);--destructive: oklch(.55 .15 25);--destructive-foreground: oklch(1 0 0);--border: oklch(.89 .006 295);--input: oklch(.89 .006 295);--ring: oklch(.3 .06 295 / .15);--sidebar: oklch(.97 .005 295);--sidebar-foreground: oklch(.25 .02 295);--sidebar-primary: oklch(.3 .06 295);--sidebar-primary-foreground: oklch(.98 .005 295);--sidebar-accent: oklch(.93 .008 295);--sidebar-accent-foreground: oklch(.25 .02 295);--sidebar-border: oklch(.91 .006 295);--banner-info: oklch(.94 .02 245);--banner-info-foreground: oklch(.24 .09 245);--banner-info-border: oklch(.52 .18 245);--banner-note: oklch(.94 .02 295);--banner-note-foreground: oklch(.24 .1 295);--banner-note-border: oklch(.48 .16 295);--banner-warning: oklch(.95 .04 78);--banner-warning-foreground: oklch(.34 .13 62);--banner-warning-border: oklch(.62 .18 72);--banner-alert: oklch(.95 .03 22);--banner-alert-foreground: oklch(.34 .14 22);--banner-alert-border: oklch(.52 .2 22);--badge-success: oklch(.35 .1 160);--badge-success-foreground: oklch(.98 .01 160);--checkbox-checked: oklch(.3 .06 295);--checkbox-checked-foreground: oklch(1 0 0);--checkbox-unchecked-bg: oklch(1 0 0);--checkbox-unchecked-border: oklch(.86 .008 295)}[data-theme=dusk].dark{--background: oklch(.17 .015 280);--foreground: oklch(.95 .005 295);--card: oklch(.22 .018 280 / .75);--card-foreground: oklch(.95 .005 295);--popover: oklch(.2 .015 280);--popover-foreground: oklch(.95 .005 295);--primary: oklch(.88 .08 295);--primary-foreground: oklch(.17 .015 280);--secondary: oklch(.27 .02 280);--secondary-foreground: oklch(.88 .08 295);--muted: oklch(.27 .02 280);--muted-foreground: oklch(.68 .015 295);--accent: oklch(.27 .02 280);--accent-foreground: oklch(.88 .08 295);--destructive: oklch(.45 .15 25);--destructive-foreground: oklch(.95 .005 295);--border: oklch(.31 .02 280);--input: oklch(.31 .02 280);--ring: oklch(.88 .08 295 / .3);--sidebar: oklch(.2 .015 280);--sidebar-foreground: oklch(.95 .005 295);--sidebar-primary: oklch(.88 .08 295);--sidebar-primary-foreground: oklch(.17 .015 280);--sidebar-accent: oklch(.27 .02 280);--sidebar-accent-foreground: oklch(.95 .005 295);--sidebar-border: oklch(.31 .02 280);--banner-info: oklch(.22 .04 260);--banner-info-foreground: oklch(.88 .05 260);--banner-info-border: oklch(.48 .16 260);--banner-note: oklch(.22 .05 295);--banner-note-foreground: oklch(.88 .06 295);--banner-note-border: oklch(.5 .12 295);--banner-warning: oklch(.26 .06 70);--banner-warning-foreground: oklch(.92 .1 80);--banner-warning-border: oklch(.65 .2 75);--banner-alert: oklch(.23 .05 25);--banner-alert-foreground: oklch(.9 .06 25);--banner-alert-border: oklch(.44 .14 25);--badge-success: oklch(.48 .15 150);--badge-success-foreground: oklch(1 0 0);--checkbox-checked: oklch(.88 .08 295);--checkbox-checked-foreground: oklch(.17 .015 280);--checkbox-unchecked-bg: oklch(.24 .01 280);--checkbox-unchecked-border: oklch(.38 .01 280)}

package/dist/themes/ThemeProvider.d.ts CHANGED Viewed

@@ -1,8 +1,10 @@
 import type { ReactNode } from 'react';
 import './linen.css';
 import './steel.css';
+import './sage.css';
+import './dusk.css';
 export type Theme = 'light' | 'dark' | 'system';
-export type ColorTheme = 'linen' | 'steel';
+export type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk';
 export declare function ThemeProvider({ children, defaultColorTheme, }: {
     children: ReactNode;
     defaultColorTheme?: ColorTheme;

package/dist/themes/ThemeProvider.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/themes/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,OAAO,aAAa,CAAA;AACpB,OAAO,aAAa,CAAA;~~AAEpB~~,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,CAAA;~~AAiC1C~~,wBAAgB,aAAa,CAAC,EAC7B,QAAQ,EACR,iBAA2B,GAC3B,EAAE;IACF,QAAQ,EAAE,SAAS,CAAA;IACnB,iBAAiB,CAAC,EAAE,UAAU,CAAA;CAC9B,2CA8CA"}
1	+ {"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../src/themes/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,OAAO,aAAa,CAAA;AACpB,OAAO,aAAa,CAAA;AACpB,OAAO,YAAY,CAAA;AACnB,OAAO,YAAY,CAAA;AAEnB,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAA;AAC/C,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAA;AAiC5D,wBAAgB,aAAa,CAAC,EAC7B,QAAQ,EACR,iBAA2B,GAC3B,EAAE;IACF,QAAQ,EAAE,SAAS,CAAA;IACnB,iBAAiB,CAAC,EAAE,UAAU,CAAA;CAC9B,2CA8CA"}

package/dist/themes.js CHANGED Viewed

@@ -1,52 +1,52 @@
-import { jsx as k } from "react/jsx-runtime";
-import { useState as m, useEffect as c, useCallback as l, useMemo as E } from "react";
+import { jsx as S } from "react/jsx-runtime";
+import { useState as m, useEffect as a, useCallback as l, useMemo as E } from "react";
 import { T as y } from "./shared/useTheme.js";
 import { u as b } from "./shared/useTheme.js";
-const h = "theme", u = "color-theme";
+const u = "theme", h = "color-theme";
 function v() {
   if (typeof window > "u") return "system";
-  const e = localStorage.getItem(h);
+  const e = localStorage.getItem(u);
   return e === "light" || e === "dark" || e === "system" ? e : "dark";
 }
 function w(e) {
   if (typeof window > "u") return e;
-  const o = localStorage.getItem(u);
-  return o === "linen" || o === "steel" ? o : e;
+  const t = localStorage.getItem(h);
+  return t === "linen" || t === "steel" || t === "sage" || t === "dusk" ? t : e;
 }
 function C(e) {
-  const o = document.documentElement;
-  e === "dark" ? o.classList.add("dark") : o.classList.remove("dark");
+  const t = document.documentElement;
+  e === "dark" ? t.classList.add("dark") : t.classList.remove("dark");
 }
 function L(e) {
   document.documentElement.setAttribute("data-theme", e);
 }
 function _({
   children: e,
-  defaultColorTheme: o = "steel"
+  defaultColorTheme: t = "steel"
 }) {
   const [r, f] = m(v), [s, T] = m(
-    () => w(o)
-  ), [p, g] = m(
+    () => w(t)
+  ), [g, p] = m(
     () => window.matchMedia("(prefers-color-scheme: dark)").matches
-  ), n = r === "system" ? p ? "dark" : "light" : r;
-  c(() => {
+  ), n = r === "system" ? g ? "dark" : "light" : r;
+  a(() => {
     C(n);
-  }, [n]), c(() => {
+  }, [n]), a(() => {
     L(s);
-  }, [s]), c(() => {
+  }, [s]), a(() => {
     if (r !== "system") return;
-    const t = window.matchMedia("(prefers-color-scheme: dark)"), i = () => g(t.matches);
-    return t.addEventListener("change", i), () => t.removeEventListener("change", i);
+    const o = window.matchMedia("(prefers-color-scheme: dark)"), i = () => p(o.matches);
+    return o.addEventListener("change", i), () => o.removeEventListener("change", i);
   }, [r]);
-  const a = l((t) => {
-    f(t), localStorage.setItem(h, t);
-  }, []), d = l((t) => {
-    T(t), localStorage.setItem(u, t);
-  }, []), S = E(
-    () => ({ theme: r, setTheme: a, effectiveTheme: n, colorTheme: s, setColorTheme: d }),
-    [r, a, n, s, d]
+  const c = l((o) => {
+    f(o), localStorage.setItem(u, o);
+  }, []), d = l((o) => {
+    T(o), localStorage.setItem(h, o);
+  }, []), k = E(
+    () => ({ theme: r, setTheme: c, effectiveTheme: n, colorTheme: s, setColorTheme: d }),
+    [r, c, n, s, d]
   );
-  return /* @__PURE__ */ k(y.Provider, { value: S, children: e });
+  return /* @__PURE__ */ S(y.Provider, { value: k, children: e });
 }
 export {
   _ as ThemeProvider,

package/dist/themes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"themes.js","sources":["../src/themes/ThemeProvider.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { ThemeContext } from './ThemeContext'\nimport './linen.css'\nimport './steel.css'\n\nexport type Theme = 'light' \| 'dark' \| 'system'\nexport type ColorTheme = 'linen' \| 'steel'\n\nconst STORAGE_KEY = 'theme'\nconst COLOR_THEME_STORAGE_KEY = 'color-theme'\n\nfunction getStoredTheme(): Theme {\n\tif (typeof window === 'undefined') return 'system'\n\tconst stored = localStorage.getItem(STORAGE_KEY)\n\tif (stored === 'light' \|\| stored === 'dark' \|\| stored === 'system')\n\t\treturn stored\n\treturn 'dark'\n}\n\nfunction getStoredColorTheme(defaultColorTheme: ColorTheme): ColorTheme {\n\tif (typeof window === 'undefined') return defaultColorTheme\n\tconst stored = localStorage.getItem(COLOR_THEME_STORAGE_KEY)\n\tif (stored === 'linen' \|\| stored === 'steel') return stored\n\treturn defaultColorTheme\n}\n\nfunction applyTheme(effective: 'light' \| 'dark') {\n\tconst root = document.documentElement\n\tif (effective === 'dark') {\n\t\troot.classList.add('dark')\n\t} else {\n\t\troot.classList.remove('dark')\n\t}\n}\n\nfunction applyColorTheme(colorTheme: ColorTheme) {\n\tdocument.documentElement.setAttribute('data-theme', colorTheme)\n}\n\nexport function ThemeProvider({\n\tchildren,\n\tdefaultColorTheme = 'steel',\n}: {\n\tchildren: ReactNode\n\tdefaultColorTheme?: ColorTheme\n}) {\n\tconst [theme, setThemeState] = useState<Theme>(getStoredTheme)\n\tconst [colorTheme, setColorThemeState] = useState<ColorTheme>(() =>\n\t\tgetStoredColorTheme(defaultColorTheme),\n\t)\n\tconst [systemDark, setSystemDark] = useState(\n\t\t() => window.matchMedia('(prefers-color-scheme: dark)').matches,\n\t)\n\n\tconst effectiveTheme: 'light' \| 'dark' =\n\t\ttheme === 'system' ? (systemDark ? 'dark' : 'light') : theme\n\n\tuseEffect(() => {\n\t\tapplyTheme(effectiveTheme)\n\t}, [effectiveTheme])\n\n\tuseEffect(() => {\n\t\tapplyColorTheme(colorTheme)\n\t}, [colorTheme])\n\n\tuseEffect(() => {\n\t\tif (theme !== 'system') return\n\t\tconst media = window.matchMedia('(prefers-color-scheme: dark)')\n\t\tconst handler = () => setSystemDark(media.matches)\n\t\tmedia.addEventListener('change', handler)\n\t\treturn () => media.removeEventListener('change', handler)\n\t}, [theme])\n\n\tconst setTheme = useCallback((next: Theme) => {\n\t\tsetThemeState(next)\n\t\tlocalStorage.setItem(STORAGE_KEY, next)\n\t}, [])\n\n\tconst setColorTheme = useCallback((next: ColorTheme) => {\n\t\tsetColorThemeState(next)\n\t\tlocalStorage.setItem(COLOR_THEME_STORAGE_KEY, next)\n\t}, [])\n\n\tconst value = useMemo(\n\t\t() => ({ theme, setTheme, effectiveTheme, colorTheme, setColorTheme }),\n\t\t[theme, setTheme, effectiveTheme, colorTheme, setColorTheme],\n\t)\n\n\treturn (\n\t\t<ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n\t)\n}\n"],"names":["STORAGE_KEY","COLOR_THEME_STORAGE_KEY","getStoredTheme","stored","getStoredColorTheme","defaultColorTheme","applyTheme","effective","root","applyColorTheme","colorTheme","ThemeProvider","children","theme","setThemeState","useState","setColorThemeState","systemDark","setSystemDark","effectiveTheme","useEffect","media","handler","setTheme","useCallback","next","setColorTheme","value","useMemo","jsx","ThemeContext"],"mappings":";;;;~~AASA~~,MAAMA,IAAc,SACdC,IAA0B;AAEhC,SAASC,IAAwB;AAChC,MAAI,OAAO,SAAW,IAAa,QAAO;AAC1C,QAAMC,IAAS,aAAa,QAAQH,CAAW;AAC/C,SAAIG,MAAW,WAAWA,MAAW,UAAUA,MAAW,WAClDA,IACD;AACR;AAEA,SAASC,EAAoBC,GAA2C;AACvE,MAAI,OAAO,SAAW,IAAa,QAAOA;AAC1C,QAAMF,IAAS,aAAa,QAAQF,CAAuB;AAC3D,SAAIE,MAAW,WAAWA,MAAW,~~UAAgBA~~,~~IAC9CE~~;AACR;AAEA,SAASC,EAAWC,GAA6B;AAChD,QAAMC,IAAO,SAAS;AACtB,EAAID,MAAc,SACjBC,EAAK,UAAU,IAAI,MAAM,IAEzBA,EAAK,UAAU,OAAO,MAAM;AAE9B;AAEA,SAASC,EAAgBC,GAAwB;AAChD,WAAS,gBAAgB,aAAa,cAAcA,CAAU;AAC/D;AAEO,SAASC,EAAc;AAAA,EAC7B,UAAAC;AAAA,EACA,mBAAAP,IAAoB;AACrB,GAGG;AACF,QAAM,CAACQ,GAAOC,CAAa,IAAIC,EAAgBb,CAAc,GACvD,CAACQ,GAAYM,CAAkB,IAAID;AAAA,IAAqB,MAC7DX,EAAoBC,CAAiB;AAAA,EAAA,GAEhC,CAACY,GAAYC,CAAa,IAAIH;AAAA,IACnC,MAAM,OAAO,WAAW,8BAA8B,EAAE;AAAA,EAAA,GAGnDI,IACLN,MAAU,WAAYI,IAAa,SAAS,UAAWJ;AAExD,EAAAO,EAAU,MAAM;AACf,IAAAd,EAAWa,CAAc;AAAA,EAC1B,GAAG,CAACA,CAAc,CAAC,GAEnBC,EAAU,MAAM;AACf,IAAAX,EAAgBC,CAAU;AAAA,EAC3B,GAAG,CAACA,CAAU,CAAC,GAEfU,EAAU,MAAM;AACf,QAAIP,MAAU,SAAU;AACxB,UAAMQ,IAAQ,OAAO,WAAW,8BAA8B,GACxDC,IAAU,MAAMJ,EAAcG,EAAM,OAAO;AACjD,WAAAA,EAAM,iBAAiB,UAAUC,CAAO,GACjC,MAAMD,EAAM,oBAAoB,UAAUC,CAAO;AAAA,EACzD,GAAG,CAACT,CAAK,CAAC;AAEV,QAAMU,IAAWC,EAAY,CAACC,MAAgB;AAC7C,IAAAX,EAAcW,CAAI,GAClB,aAAa,QAAQzB,GAAayB,CAAI;AAAA,EACvC,GAAG,CAAA,CAAE,GAECC,IAAgBF,EAAY,CAACC,MAAqB;AACvD,IAAAT,EAAmBS,CAAI,GACvB,aAAa,QAAQxB,GAAyBwB,CAAI;AAAA,EACnD,GAAG,CAAA,CAAE,GAECE,IAAQC;AAAA,IACb,OAAO,EAAE,OAAAf,GAAO,UAAAU,GAAU,gBAAAJ,GAAgB,YAAAT,GAAY,eAAAgB,EAAA;AAAA,IACtD,CAACb,GAAOU,GAAUJ,GAAgBT,GAAYgB,CAAa;AAAA,EAAA;AAG5D,SACC,gBAAAG,EAACC,EAAa,UAAb,EAAsB,OAAAH,GAAe,UAAAf,EAAA,CAAS;AAEjD;"}
1	+ {"version":3,"file":"themes.js","sources":["../src/themes/ThemeProvider.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { ThemeContext } from './ThemeContext'\nimport './linen.css'\nimport './steel.css'\nimport './sage.css'\nimport './dusk.css'\n\nexport type Theme = 'light' \| 'dark' \| 'system'\nexport type ColorTheme = 'linen' \| 'steel' \| 'sage' \| 'dusk'\n\nconst STORAGE_KEY = 'theme'\nconst COLOR_THEME_STORAGE_KEY = 'color-theme'\n\nfunction getStoredTheme(): Theme {\n\tif (typeof window === 'undefined') return 'system'\n\tconst stored = localStorage.getItem(STORAGE_KEY)\n\tif (stored === 'light' \|\| stored === 'dark' \|\| stored === 'system')\n\t\treturn stored\n\treturn 'dark'\n}\n\nfunction getStoredColorTheme(defaultColorTheme: ColorTheme): ColorTheme {\n\tif (typeof window === 'undefined') return defaultColorTheme\n\tconst stored = localStorage.getItem(COLOR_THEME_STORAGE_KEY)\n\tif (stored === 'linen' \|\| stored === 'steel' \|\| stored === 'sage' \|\| stored === 'dusk') return stored\n\treturn defaultColorTheme\n}\n\nfunction applyTheme(effective: 'light' \| 'dark') {\n\tconst root = document.documentElement\n\tif (effective === 'dark') {\n\t\troot.classList.add('dark')\n\t} else {\n\t\troot.classList.remove('dark')\n\t}\n}\n\nfunction applyColorTheme(colorTheme: ColorTheme) {\n\tdocument.documentElement.setAttribute('data-theme', colorTheme)\n}\n\nexport function ThemeProvider({\n\tchildren,\n\tdefaultColorTheme = 'steel',\n}: {\n\tchildren: ReactNode\n\tdefaultColorTheme?: ColorTheme\n}) {\n\tconst [theme, setThemeState] = useState<Theme>(getStoredTheme)\n\tconst [colorTheme, setColorThemeState] = useState<ColorTheme>(() =>\n\t\tgetStoredColorTheme(defaultColorTheme),\n\t)\n\tconst [systemDark, setSystemDark] = useState(\n\t\t() => window.matchMedia('(prefers-color-scheme: dark)').matches,\n\t)\n\n\tconst effectiveTheme: 'light' \| 'dark' =\n\t\ttheme === 'system' ? (systemDark ? 'dark' : 'light') : theme\n\n\tuseEffect(() => {\n\t\tapplyTheme(effectiveTheme)\n\t}, [effectiveTheme])\n\n\tuseEffect(() => {\n\t\tapplyColorTheme(colorTheme)\n\t}, [colorTheme])\n\n\tuseEffect(() => {\n\t\tif (theme !== 'system') return\n\t\tconst media = window.matchMedia('(prefers-color-scheme: dark)')\n\t\tconst handler = () => setSystemDark(media.matches)\n\t\tmedia.addEventListener('change', handler)\n\t\treturn () => media.removeEventListener('change', handler)\n\t}, [theme])\n\n\tconst setTheme = useCallback((next: Theme) => {\n\t\tsetThemeState(next)\n\t\tlocalStorage.setItem(STORAGE_KEY, next)\n\t}, [])\n\n\tconst setColorTheme = useCallback((next: ColorTheme) => {\n\t\tsetColorThemeState(next)\n\t\tlocalStorage.setItem(COLOR_THEME_STORAGE_KEY, next)\n\t}, [])\n\n\tconst value = useMemo(\n\t\t() => ({ theme, setTheme, effectiveTheme, colorTheme, setColorTheme }),\n\t\t[theme, setTheme, effectiveTheme, colorTheme, setColorTheme],\n\t)\n\n\treturn (\n\t\t<ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>\n\t)\n}\n"],"names":["STORAGE_KEY","COLOR_THEME_STORAGE_KEY","getStoredTheme","stored","getStoredColorTheme","defaultColorTheme","applyTheme","effective","root","applyColorTheme","colorTheme","ThemeProvider","children","theme","setThemeState","useState","setColorThemeState","systemDark","setSystemDark","effectiveTheme","useEffect","media","handler","setTheme","useCallback","next","setColorTheme","value","useMemo","jsx","ThemeContext"],"mappings":";;;;AAWA,MAAMA,IAAc,SACdC,IAA0B;AAEhC,SAASC,IAAwB;AAChC,MAAI,OAAO,SAAW,IAAa,QAAO;AAC1C,QAAMC,IAAS,aAAa,QAAQH,CAAW;AAC/C,SAAIG,MAAW,WAAWA,MAAW,UAAUA,MAAW,WAClDA,IACD;AACR;AAEA,SAASC,EAAoBC,GAA2C;AACvE,MAAI,OAAO,SAAW,IAAa,QAAOA;AAC1C,QAAMF,IAAS,aAAa,QAAQF,CAAuB;AAC3D,SAAIE,MAAW,WAAWA,MAAW,WAAWA,MAAW,UAAUA,MAAW,SAAeA,IACxFE;AACR;AAEA,SAASC,EAAWC,GAA6B;AAChD,QAAMC,IAAO,SAAS;AACtB,EAAID,MAAc,SACjBC,EAAK,UAAU,IAAI,MAAM,IAEzBA,EAAK,UAAU,OAAO,MAAM;AAE9B;AAEA,SAASC,EAAgBC,GAAwB;AAChD,WAAS,gBAAgB,aAAa,cAAcA,CAAU;AAC/D;AAEO,SAASC,EAAc;AAAA,EAC7B,UAAAC;AAAA,EACA,mBAAAP,IAAoB;AACrB,GAGG;AACF,QAAM,CAACQ,GAAOC,CAAa,IAAIC,EAAgBb,CAAc,GACvD,CAACQ,GAAYM,CAAkB,IAAID;AAAA,IAAqB,MAC7DX,EAAoBC,CAAiB;AAAA,EAAA,GAEhC,CAACY,GAAYC,CAAa,IAAIH;AAAA,IACnC,MAAM,OAAO,WAAW,8BAA8B,EAAE;AAAA,EAAA,GAGnDI,IACLN,MAAU,WAAYI,IAAa,SAAS,UAAWJ;AAExD,EAAAO,EAAU,MAAM;AACf,IAAAd,EAAWa,CAAc;AAAA,EAC1B,GAAG,CAACA,CAAc,CAAC,GAEnBC,EAAU,MAAM;AACf,IAAAX,EAAgBC,CAAU;AAAA,EAC3B,GAAG,CAACA,CAAU,CAAC,GAEfU,EAAU,MAAM;AACf,QAAIP,MAAU,SAAU;AACxB,UAAMQ,IAAQ,OAAO,WAAW,8BAA8B,GACxDC,IAAU,MAAMJ,EAAcG,EAAM,OAAO;AACjD,WAAAA,EAAM,iBAAiB,UAAUC,CAAO,GACjC,MAAMD,EAAM,oBAAoB,UAAUC,CAAO;AAAA,EACzD,GAAG,CAACT,CAAK,CAAC;AAEV,QAAMU,IAAWC,EAAY,CAACC,MAAgB;AAC7C,IAAAX,EAAcW,CAAI,GAClB,aAAa,QAAQzB,GAAayB,CAAI;AAAA,EACvC,GAAG,CAAA,CAAE,GAECC,IAAgBF,EAAY,CAACC,MAAqB;AACvD,IAAAT,EAAmBS,CAAI,GACvB,aAAa,QAAQxB,GAAyBwB,CAAI;AAAA,EACnD,GAAG,CAAA,CAAE,GAECE,IAAQC;AAAA,IACb,OAAO,EAAE,OAAAf,GAAO,UAAAU,GAAU,gBAAAJ,GAAgB,YAAAT,GAAY,eAAAgB,EAAA;AAAA,IACtD,CAACb,GAAOU,GAAUJ,GAAgBT,GAAYgB,CAAa;AAAA,EAAA;AAG5D,SACC,gBAAAG,EAACC,EAAa,UAAb,EAAsB,OAAAH,GAAe,UAAAf,EAAA,CAAS;AAEjD;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
 	"name": "@abumble/design-system",
-	"version": "0.0.46",
+	"version": "0.0.47",
 	"files": [
 		"dist",
 		"src/styles.css",
@@ -52,6 +52,7 @@
 		"prepublishOnly": "npm run build",
 		"publish:npm": "npm publish --access public",
 		"dev": "vite",
+		"sandbox": "vite --config sandbox/vite.config.ts",
 		"storybook": "storybook dev -p 6006",
 		"build-storybook": "storybook build"
 	},

package/src/styles.css CHANGED Viewed

@@ -2,6 +2,8 @@
 @import 'tw-animate-css';
 @import './themes/linen.css';
 @import './themes/steel.css';
+@import './themes/sage.css';
+@import './themes/dusk.css';
 @tailwind base;
 @tailwind components;
@@ -9,6 +11,10 @@
 @custom-variant dark (&:is(.dark *));
+:root {
+	--radius: 0.3rem;
+}
 @theme {
 	/*
     This defines the utility class 'list-square'
@@ -120,6 +126,10 @@
 	@apply z-50 fixed w-full h-14 top-0 px-3 flex justify-between text-card-foreground bg-card border-container items-center;
 }
+.app-title {
+	@apply text-xl font-bold tracking-tight ml-2;
+}
 .sub-heading {
 	@apply mt-8 mb-1 font-semibold text-foreground;
 }

package/src/themes/ThemeProvider.tsx CHANGED Viewed

@@ -3,9 +3,11 @@ import { useCallback, useEffect, useMemo, useState } from 'react'
 import { ThemeContext } from './ThemeContext'
 import './linen.css'
 import './steel.css'
+import './sage.css'
+import './dusk.css'
 export type Theme = 'light' | 'dark' | 'system'
-export type ColorTheme = 'linen' | 'steel'
+export type ColorTheme = 'linen' | 'steel' | 'sage' | 'dusk'
 const STORAGE_KEY = 'theme'
 const COLOR_THEME_STORAGE_KEY = 'color-theme'
@@ -21,7 +23,7 @@ function getStoredTheme(): Theme {
 function getStoredColorTheme(defaultColorTheme: ColorTheme): ColorTheme {
 	if (typeof window === 'undefined') return defaultColorTheme
 	const stored = localStorage.getItem(COLOR_THEME_STORAGE_KEY)
-	if (stored === 'linen' || stored === 'steel') return stored
+	if (stored === 'linen' || stored === 'steel' || stored === 'sage' || stored === 'dusk') return stored
 	return defaultColorTheme
 }

package/src/themes/dusk.css ADDED Viewed

@@ -0,0 +1,128 @@
+[data-theme="dusk"] {
+	/* --- Light Theme (Creative, Sophisticated - Pale Lavender) --- */
+	--background: oklch(0.965 0.006 295);
+	--foreground: oklch(0.2 0.02 295);
+	/* Surfaces */
+	--card: oklch(0.99 0.004 295 / 0.85);
+	--card-foreground: oklch(0.2 0.02 295);
+	--popover: oklch(1 0 0);
+	--popover-foreground: oklch(0.2 0.02 295);
+	/* Primary: Deep Violet */
+	--primary: oklch(0.3 0.06 295);
+	--primary-foreground: oklch(0.98 0.005 295);
+	/* Button/Surface Colors */
+	--secondary: oklch(0.97 0.005 295);
+	--secondary-foreground: oklch(0.3 0.06 295);
+	--muted: oklch(0.94 0.005 295);
+	--muted-foreground: oklch(0.52 0.02 295);
+	--accent: oklch(0.92 0.008 295);
+	--accent-foreground: oklch(0.3 0.06 295);
+	--destructive: oklch(0.55 0.15 25);
+	--destructive-foreground: oklch(1 0 0);
+	--border: oklch(0.89 0.006 295);
+	--input: oklch(0.89 0.006 295);
+	--ring: oklch(0.3 0.06 295 / 0.15);
+	/* Sidebar (Soft Lavender) */
+	--sidebar: oklch(0.97 0.005 295);
+	--sidebar-foreground: oklch(0.25 0.02 295);
+	--sidebar-primary: oklch(0.3 0.06 295);
+	--sidebar-primary-foreground: oklch(0.98 0.005 295);
+	--sidebar-accent: oklch(0.93 0.008 295);
+	--sidebar-accent-foreground: oklch(0.25 0.02 295);
+	--sidebar-border: oklch(0.91 0.006 295);
+	/* Banners */
+	--banner-info: oklch(0.94 0.02 245);
+	--banner-info-foreground: oklch(0.24 0.09 245);
+	--banner-info-border: oklch(0.52 0.18 245);
+	--banner-note: oklch(0.94 0.02 295);
+	--banner-note-foreground: oklch(0.24 0.1 295);
+	--banner-note-border: oklch(0.48 0.16 295);
+	--banner-warning: oklch(0.95 0.04 78);
+	--banner-warning-foreground: oklch(0.34 0.13 62);
+	--banner-warning-border: oklch(0.62 0.18 72);
+	--banner-alert: oklch(0.95 0.03 22);
+	--banner-alert-foreground: oklch(0.34 0.14 22);
+	--banner-alert-border: oklch(0.52 0.2 22);
+	/* Interactive Elements */
+	--badge-success: oklch(0.35 0.1 160);
+	--badge-success-foreground: oklch(0.98 0.01 160);
+	--checkbox-checked: oklch(0.3 0.06 295);
+	--checkbox-checked-foreground: oklch(1 0 0);
+	--checkbox-unchecked-bg: oklch(1 0 0);
+	--checkbox-unchecked-border: oklch(0.86 0.008 295);
+}
+[data-theme="dusk"].dark {
+	/* --- Dark Theme (Deep Violet with Bright Lavender Glow) --- */
+	--background: oklch(0.17 0.015 280);
+	--foreground: oklch(0.95 0.005 295);
+	/* Card Elevation */
+	--card: oklch(0.22 0.018 280 / 0.75);
+	--card-foreground: oklch(0.95 0.005 295);
+	--popover: oklch(0.20 0.015 280);
+	--popover-foreground: oklch(0.95 0.005 295);
+	/* Primary: Bright Lavender Glow */
+	--primary: oklch(0.88 0.08 295);
+	--primary-foreground: oklch(0.17 0.015 280);
+	--secondary: oklch(0.27 0.02 280);
+	--secondary-foreground: oklch(0.88 0.08 295);
+	--muted: oklch(0.27 0.02 280);
+	--muted-foreground: oklch(0.68 0.015 295);
+	--accent: oklch(0.27 0.02 280);
+	--accent-foreground: oklch(0.88 0.08 295);
+	--destructive: oklch(0.45 0.15 25);
+	--destructive-foreground: oklch(0.95 0.005 295);
+	--border: oklch(0.31 0.02 280);
+	--input: oklch(0.31 0.02 280);
+	--ring: oklch(0.88 0.08 295 / 0.3);
+	/* Sidebar (Dark Violet) */
+	--sidebar: oklch(0.20 0.015 280);
+	--sidebar-foreground: oklch(0.95 0.005 295);
+	--sidebar-primary: oklch(0.88 0.08 295);
+	--sidebar-primary-foreground: oklch(0.17 0.015 280);
+	--sidebar-accent: oklch(0.27 0.02 280);
+	--sidebar-accent-foreground: oklch(0.95 0.005 295);
+	--sidebar-border: oklch(0.31 0.02 280);
+	/* Banners (Dark) */
+	--banner-info: oklch(0.22 0.04 260);
+	--banner-info-foreground: oklch(0.88 0.05 260);
+	--banner-info-border: oklch(0.48 0.16 260);
+	--banner-note: oklch(0.22 0.05 295);
+	--banner-note-foreground: oklch(0.88 0.06 295);
+	--banner-note-border: oklch(0.5 0.12 295);
+	--banner-warning: oklch(0.26 0.06 70);
+	--banner-warning-foreground: oklch(0.92 0.1 80);
+	--banner-warning-border: oklch(0.65 0.2 75);
+	--banner-alert: oklch(0.23 0.05 25);
+	--banner-alert-foreground: oklch(0.9 0.06 25);
+	--banner-alert-border: oklch(0.44 0.14 25);
+	/* Interactive Elements (Dark) */
+	--badge-success: oklch(0.48 0.15 150);
+	--badge-success-foreground: oklch(1 0 0);
+	--checkbox-checked: oklch(0.88 0.08 295);
+	--checkbox-checked-foreground: oklch(0.17 0.015 280);
+	--checkbox-unchecked-bg: oklch(0.24 0.01 280);
+	--checkbox-unchecked-border: oklch(0.38 0.01 280);
+}

package/src/themes/linen.css CHANGED Viewed

@@ -31,8 +31,6 @@
 	--input: oklch(0.94 0.005 85);
 	--ring: oklch(0.18 0.01 85 / 0.1);
-	--radius: 0.6rem;
 	/* Sidebar (Soft White) */
 	--sidebar: oklch(0.995 0.002 85);
 	--sidebar-foreground: oklch(0.2 0.01 85);
@@ -98,8 +96,6 @@
 	--input: oklch(0.94 0.005 85);
 	--ring: oklch(0.18 0.01 85 / 0.1);
-	--radius: 0.6rem;
 	/* Sidebar (Soft White) */
 	--sidebar: oklch(0.995 0.002 85);
 	--sidebar-foreground: oklch(0.2 0.01 85);

package/src/themes/sage.css ADDED Viewed

@@ -0,0 +1,128 @@
+[data-theme="sage"] {
+	/* --- Light Theme (Natural, Organic - Pale Sage) --- */
+	--background: oklch(0.965 0.007 145);
+	--foreground: oklch(0.18 0.02 145);
+	/* Surfaces - Frosted with green tint */
+	--card: oklch(0.99 0.004 145 / 0.75);
+	--card-foreground: oklch(0.18 0.02 145);
+	--popover: oklch(1 0 0);
+	--popover-foreground: oklch(0.18 0.02 145);
+	/* Primary: Deep Forest Green */
+	--primary: oklch(0.25 0.06 145);
+	--primary-foreground: oklch(0.97 0.005 145);
+	/* Button/Surface Colors */
+	--secondary: oklch(0.97 0.006 145);
+	--secondary-foreground: oklch(0.25 0.06 145);
+	--muted: oklch(0.94 0.006 145);
+	--muted-foreground: oklch(0.5 0.02 145);
+	--accent: oklch(0.92 0.008 145);
+	--accent-foreground: oklch(0.25 0.06 145);
+	--destructive: oklch(0.55 0.15 25);
+	--destructive-foreground: oklch(1 0 0);
+	--border: oklch(0.9 0.006 145);
+	--input: oklch(0.9 0.006 145);
+	--ring: oklch(0.25 0.06 145 / 0.15);
+	/* Sidebar (Soft Sage) */
+	--sidebar: oklch(0.97 0.006 145);
+	--sidebar-foreground: oklch(0.22 0.02 145);
+	--sidebar-primary: oklch(0.25 0.06 145);
+	--sidebar-primary-foreground: oklch(0.97 0.005 145);
+	--sidebar-accent: oklch(0.93 0.008 145);
+	--sidebar-accent-foreground: oklch(0.22 0.02 145);
+	--sidebar-border: oklch(0.91 0.006 145);
+	/* Banners */
+	--banner-info: oklch(0.94 0.02 240);
+	--banner-info-foreground: oklch(0.24 0.09 240);
+	--banner-info-border: oklch(0.52 0.18 240);
+	--banner-note: oklch(0.94 0.02 145);
+	--banner-note-foreground: oklch(0.24 0.1 145);
+	--banner-note-border: oklch(0.48 0.16 145);
+	--banner-warning: oklch(0.95 0.04 78);
+	--banner-warning-foreground: oklch(0.34 0.13 62);
+	--banner-warning-border: oklch(0.62 0.18 72);
+	--banner-alert: oklch(0.95 0.03 22);
+	--banner-alert-foreground: oklch(0.34 0.14 22);
+	--banner-alert-border: oklch(0.52 0.2 22);
+	/* Interactive Elements */
+	--badge-success: oklch(0.35 0.1 145);
+	--badge-success-foreground: oklch(0.98 0.01 145);
+	--checkbox-checked: oklch(0.25 0.06 145);
+	--checkbox-checked-foreground: oklch(1 0 0);
+	--checkbox-unchecked-bg: oklch(1 0 0);
+	--checkbox-unchecked-border: oklch(0.87 0.008 145);
+}
+[data-theme="sage"].dark {
+	/* --- Dark Theme (Deep Forest with Moss Glow) --- */
+	--background: oklch(0.14 0.015 145);
+	--foreground: oklch(0.93 0.01 145);
+	/* Card Elevation */
+	--card: oklch(0.19 0.018 145 / 0.75);
+	--card-foreground: oklch(0.93 0.01 145);
+	--popover: oklch(0.17 0.015 145);
+	--popover-foreground: oklch(0.93 0.01 145);
+	/* Primary: Bright Moss Green */
+	--primary: oklch(0.8 0.1 145);
+	--primary-foreground: oklch(0.14 0.015 145);
+	--secondary: oklch(0.24 0.015 145);
+	--secondary-foreground: oklch(0.8 0.1 145);
+	--muted: oklch(0.24 0.015 145);
+	--muted-foreground: oklch(0.62 0.015 145);
+	--accent: oklch(0.24 0.015 145);
+	--accent-foreground: oklch(0.8 0.1 145);
+	--destructive: oklch(0.45 0.15 25);
+	--destructive-foreground: oklch(0.93 0.01 145);
+	--border: oklch(0.28 0.015 145);
+	--input: oklch(0.28 0.015 145);
+	--ring: oklch(0.8 0.1 145 / 0.3);
+	/* Sidebar (Dark Forest) */
+	--sidebar: oklch(0.17 0.015 145);
+	--sidebar-foreground: oklch(0.93 0.01 145);
+	--sidebar-primary: oklch(0.8 0.1 145);
+	--sidebar-primary-foreground: oklch(0.14 0.015 145);
+	--sidebar-accent: oklch(0.23 0.015 145);
+	--sidebar-accent-foreground: oklch(0.93 0.01 145);
+	--sidebar-border: oklch(0.28 0.015 145);
+	/* Banners (Dark) */
+	--banner-info: oklch(0.22 0.04 240);
+	--banner-info-foreground: oklch(0.88 0.05 240);
+	--banner-info-border: oklch(0.48 0.16 240);
+	--banner-note: oklch(0.22 0.05 145);
+	--banner-note-foreground: oklch(0.88 0.06 145);
+	--banner-note-border: oklch(0.5 0.12 145);
+	--banner-warning: oklch(0.26 0.06 70);
+	--banner-warning-foreground: oklch(0.92 0.1 80);
+	--banner-warning-border: oklch(0.65 0.2 75);
+	--banner-alert: oklch(0.23 0.05 25);
+	--banner-alert-foreground: oklch(0.9 0.06 25);
+	--banner-alert-border: oklch(0.44 0.14 25);
+	/* Interactive Elements (Dark) */
+	--badge-success: oklch(0.48 0.15 145);
+	--badge-success-foreground: oklch(1 0 0);
+	--checkbox-checked: oklch(0.8 0.1 145);
+	--checkbox-checked-foreground: oklch(0.14 0.015 145);
+	--checkbox-unchecked-bg: oklch(0.22 0.01 145);
+	--checkbox-unchecked-border: oklch(0.38 0.01 145);
+}

package/src/themes/steel.css CHANGED Viewed

@@ -31,8 +31,6 @@
 	--input: oklch(0.88 0.005 250);
 	--ring: oklch(0.3 0.05 250 / 0.15);
-	--radius: 0.25rem; /* Sharper for robotic feel */
 	/* Sidebar (Cold Slate) */
 	--sidebar: oklch(0.97 0.005 250);
 	--sidebar-foreground: oklch(0.25 0.02 250);