npm - @cloudflare/kumo - Versions diffs - 1.17.0 → 1.18.0 - Mend

@cloudflare/kumo 1.17.0 → 1.18.0

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

package/dist/chunks/{sidebar-jepeq7gaf4issuw6.js → sidebar-hljy3ssm8itc0ucx.js} RENAMED Viewed

@@ -4,8 +4,8 @@ import ke, { forwardRef as u, useState as k, useCallback as D, useMemo as W, cre
 import { CaretRightIcon as F, MagnifyingGlassIcon as Ce, SidebarSimpleIcon as Me } from "@phosphor-icons/react";
 import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
 import { u as X } from "./link-provider-mn2voeohon7cj9o4.js";
-import { a as Ie, T as Re } from "./tooltip-cit9ltlxfuhwctuj.js";
-import { bn as U, bo as V, ap as Te, au as ze, av as _e, aw as Be, bp as De } from "./vendor-base-ui-n30qblevnpk9cc5c.js";
+import { a as Ie, T as Re } from "./tooltip-belkznz8t8333h5f.js";
+import { bq as U, br as V, ap as Te, au as ze, av as _e, aw as Be, bs as De } from "./vendor-base-ui-k7bzesq81ie36nya.js";
 const $e = {
   variant: {
     sidebar: {
@@ -509,7 +509,7 @@ const re = u(
       // When a child sub-button is active, don't show active styling on the parent trigger
       "has-[[data-active]]:bg-transparent has-[[data-active]]:hover:bg-kumo-tint",
       // Focus
-      "focus-visible:ring-1 focus-visible:ring-kumo-ring",
+      "focus-visible:ring-1 focus-visible:ring-kumo-hairline",
       // Collapsed: px-2 centers the icon (48px sidebar − 16px content padding = 32px;
       // 32px − 2×8px padding = 16px = icon size). Padding transition keeps it smooth.
       "group-data-[state=collapsed]/sidebar:px-2",
@@ -610,7 +610,7 @@ const ce = u(({ className: t, active: a = !1, href: e, children: n, ...r }, o) =
     "text-kumo-default transition-colors duration-150",
     !a && "hover:bg-kumo-tint",
     a && "bg-kumo-tint",
-    "focus-visible:ring-1 focus-visible:ring-kumo-ring",
+    "focus-visible:ring-1 focus-visible:ring-kumo-hairline",
     t
   ), l = /* @__PURE__ */ s("span", { className: "flex-1 truncate text-left", children: n });
   let c;
@@ -872,4 +872,4 @@ export {
   xe as y,
   T as z
 };
-//# sourceMappingURL=sidebar-jepeq7gaf4issuw6.js.map
+//# sourceMappingURL=sidebar-hljy3ssm8itc0ucx.js.map

package/dist/chunks/sidebar-hljy3ssm8itc0ucx.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"sidebar-hljy3ssm8itc0ucx.js","sources":["../../src/components/sidebar/sidebar.tsx"],"sourcesContent":["import React, {\n type ComponentPropsWithoutRef,\n type CSSProperties,\n type ReactNode,\n createContext,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { Collapsible as CollapsibleBase } from \"@base-ui/react/collapsible\";\nimport { Dialog as DialogBase } from \"@base-ui/react/dialog\";\n\nimport {\n CaretRightIcon,\n MagnifyingGlassIcon,\n SidebarSimpleIcon,\n} from \"@phosphor-icons/react\";\nimport { cn } from \"../../utils/cn\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\nimport { Tooltip, TooltipProvider } from \"../tooltip\";\n\n// ============================================================================\n// Variants (required by Kumo convention)\n// ============================================================================\n\n/** Sidebar variant definitions mapping layout, collapse, and side options. */\nexport const KUMO_SIDEBAR_VARIANTS = {\n variant: {\n sidebar: {\n classes: \"\",\n description: \"Standard sidebar with border separator\",\n },\n floating: {\n classes: \"\",\n description: \"Floating sidebar with shadow and rounded corners\",\n },\n inset: {\n classes: \"\",\n description: \"Inset sidebar within the content area\",\n },\n },\n collapsible: {\n icon: {\n classes: \"\",\n description: \"Collapses to show icons only\",\n },\n offcanvas: {\n classes: \"\",\n description: \"Slides off screen when collapsed\",\n },\n none: {\n classes: \"\",\n description: \"Cannot be collapsed\",\n },\n },\n side: {\n left: {\n classes: \"\",\n description: \"Left-aligned sidebar\",\n },\n right: {\n classes: \"\",\n description: \"Right-aligned sidebar\",\n },\n },\n} as const;\n\nexport const KUMO_SIDEBAR_DEFAULT_VARIANTS = {\n variant: \"sidebar\",\n collapsible: \"icon\",\n side: \"left\",\n} as const;\n\nexport const KUMO_SIDEBAR_STYLING = {\n width: {\n expanded: \"16rem\",\n icon: \"3rem\",\n },\n mobile: {\n breakpoint: 768,\n },\n} as const;\n\nexport type SidebarSide = \"left\" | \"right\";\nexport type SidebarVariant = \"sidebar\" | \"floating\" | \"inset\";\nexport type SidebarCollapsible = \"icon\" | \"offcanvas\" | \"none\";\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst SIDEBAR_WIDTH = \"16rem\";\nconst SIDEBAR_WIDTH_ICON = \"3rem\";\nconst MOBILE_BREAKPOINT = 768;\n\n// ============================================================================\n// Mobile detection hook\n// ============================================================================\n\nfunction useIsMobile() {\n const [isMobile, setIsMobile] = useState(false);\n\n useEffect(() => {\n const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);\n const onChange = () => setIsMobile(mql.matches);\n mql.addEventListener(\"change\", onChange);\n setIsMobile(mql.matches);\n return () => mql.removeEventListener(\"change\", onChange);\n }, []);\n\n return isMobile;\n}\n\n// ============================================================================\n// Context\n// ============================================================================\n\nexport interface SidebarContextValue {\n state: \"expanded\" | \"collapsed\";\n open: boolean;\n setOpen: (open: boolean) => void;\n openMobile: boolean;\n setOpenMobile: (open: boolean) => void;\n isMobile: boolean;\n toggleSidebar: () => void;\n variant: \"sidebar\" | \"floating\" | \"inset\";\n side: \"left\" | \"right\";\n collapsible: \"icon\" | \"offcanvas\" | \"none\";\n width: number;\n resizable: boolean;\n minWidth: number;\n maxWidth: number;\n isResizing: boolean;\n setIsResizing: (resizing: boolean) => void;\n setWidth: (width: number) => void;\n}\n\nconst SidebarContext = createContext<SidebarContextValue | null>(null);\n\n/**\n * Hook to access sidebar state and actions from any descendant component.\n *\n * @example\n * ```tsx\n * const { state, open, toggleSidebar, isMobile } = useSidebar();\n * ```\n *\n * @throws Error if used outside a `Sidebar.Provider`.\n */\nexport function useSidebar() {\n const context = useContext(SidebarContext);\n if (!context) {\n throw new Error(\"useSidebar must be used within a Sidebar.Provider\");\n }\n return context;\n}\n\n// ============================================================================\n// Provider\n// ============================================================================\n\nexport interface SidebarProviderProps {\n /** Initial open state when uncontrolled. @default true */\n defaultOpen?: boolean;\n /** Controlled open state. */\n open?: boolean;\n /** Callback when open state changes (controlled mode). */\n onOpenChange?: (open: boolean) => void;\n /** Sidebar layout variant. @default \"sidebar\" */\n variant?: SidebarVariant;\n /** Which side the sidebar is on. @default \"left\" */\n side?: SidebarSide;\n collapsible?: \"icon\" | \"offcanvas\" | \"none\";\n /** Enable drag-to-resize on the sidebar edge. @default false */\n resizable?: boolean;\n /** Initial width in pixels when resizable. @default 256 */\n defaultWidth?: number;\n /** Minimum width in pixels when resizing. @default 200 */\n minWidth?: number;\n /** Maximum width in pixels when resizing. @default 480 */\n maxWidth?: number;\n /** Callback when width changes during resize. */\n onWidthChange?: (width: number) => void;\n /** Content — typically `<Sidebar>` + main content. */\n children: ReactNode;\n /** Additional CSS classes for the wrapper div. */\n className?: string;\n /** Inline styles for the wrapper div. */\n style?: CSSProperties;\n}\n\n/**\n * Sidebar context provider. Manages expand/collapse state and mobile detection.\n * Renders a flex wrapper div with CSS custom properties for sidebar width.\n *\n * @example\n * ```tsx\n * <Sidebar.Provider defaultOpen>\n * <Sidebar>{...}</Sidebar>\n * <main className=\"flex-1\">{...}</main>\n * </Sidebar.Provider>\n * ```\n */\nconst DEFAULT_WIDTH_PX = 256;\nconst MIN_WIDTH_PX = 200;\nconst MAX_WIDTH_PX = 480;\n\nfunction SidebarProvider({\n defaultOpen = true,\n open: openProp,\n onOpenChange: setOpenProp,\n variant = KUMO_SIDEBAR_DEFAULT_VARIANTS.variant,\n side = KUMO_SIDEBAR_DEFAULT_VARIANTS.side,\n collapsible = KUMO_SIDEBAR_DEFAULT_VARIANTS.collapsible,\n resizable = false,\n defaultWidth = DEFAULT_WIDTH_PX,\n minWidth = MIN_WIDTH_PX,\n maxWidth = MAX_WIDTH_PX,\n onWidthChange,\n children,\n className,\n style,\n}: SidebarProviderProps) {\n const isMobile = useIsMobile();\n const [openMobile, setOpenMobile] = useState(false);\n const [width, setWidthState] = useState(defaultWidth);\n const [isResizing, setIsResizing] = useState(false);\n\n const setWidth = useCallback(\n (newWidth: number) => {\n const clamped = Math.min(maxWidth, Math.max(minWidth, newWidth));\n setWidthState(clamped);\n onWidthChange?.(clamped);\n },\n [minWidth, maxWidth, onWidthChange],\n );\n\n const [_open, _setOpen] = useState(defaultOpen);\n const open = openProp ?? _open;\n const setOpen = useCallback(\n (value: boolean | ((prev: boolean) => boolean)) => {\n const next = typeof value === \"function\" ? value(open) : value;\n setOpenProp?.(next);\n _setOpen(next);\n },\n [setOpenProp, open],\n );\n\n const toggleSidebar = useCallback(() => {\n if (isMobile) {\n setOpenMobile((prev) => !prev);\n } else {\n setOpen((prev: boolean) => !prev);\n }\n }, [isMobile, setOpen]);\n\n const state = open ? \"expanded\" : \"collapsed\";\n\n const sidebarWidthValue = resizable ? `${width}px` : SIDEBAR_WIDTH;\n\n const contextValue = useMemo<SidebarContextValue>(\n () => ({\n state,\n open,\n setOpen,\n openMobile,\n setOpenMobile,\n isMobile,\n toggleSidebar,\n variant,\n side,\n collapsible,\n width,\n resizable,\n minWidth,\n maxWidth,\n isResizing,\n setIsResizing,\n setWidth,\n }),\n [\n state,\n open,\n setOpen,\n openMobile,\n setOpenMobile,\n isMobile,\n toggleSidebar,\n variant,\n side,\n collapsible,\n width,\n resizable,\n minWidth,\n maxWidth,\n isResizing,\n setIsResizing,\n setWidth,\n ],\n );\n\n return (\n <SidebarContext.Provider value={contextValue}>\n <div\n data-sidebar-wrapper=\"\"\n data-state={state}\n data-side={side}\n style={\n {\n \"--sidebar-width\": sidebarWidthValue,\n \"--sidebar-width-icon\": SIDEBAR_WIDTH_ICON,\n ...style,\n } as CSSProperties\n }\n className={cn(\n \"group/sidebar-wrapper flex min-h-svh w-full\",\n \"has-data-[variant=inset]:bg-kumo-recessed\",\n isResizing && \"select-none\",\n className,\n )}\n >\n {children}\n </div>\n </SidebarContext.Provider>\n );\n}\n\nSidebarProvider.displayName = \"Sidebar.Provider\";\n\n// ============================================================================\n// Sidebar Root\n// ============================================================================\n\nexport interface SidebarRootProps extends ComponentPropsWithoutRef<\"aside\"> {\n /** Additional CSS classes for the sidebar element. */\n className?: string;\n /** Sidebar content — Header, Content, Footer, etc. */\n children: ReactNode;\n}\n\n/**\n * Main sidebar container. Renders as `<aside>` on desktop, Dialog sheet on mobile.\n * Must be used inside `Sidebar.Provider`.\n *\n * @example\n * ```tsx\n * <Sidebar.Provider>\n * <Sidebar>\n * <Sidebar.Header>...</Sidebar.Header>\n * <Sidebar.Content>...</Sidebar.Content>\n * <Sidebar.Footer>...</Sidebar.Footer>\n * </Sidebar>\n * </Sidebar.Provider>\n * ```\n */\nconst SidebarRoot = forwardRef<HTMLElement, SidebarRootProps>(\n ({ className, children, ...props }, ref) => {\n const {\n state,\n isMobile,\n openMobile,\n setOpenMobile,\n side,\n variant,\n collapsible,\n isResizing,\n resizable,\n width,\n } = useSidebar();\n\n if (collapsible === \"none\") {\n return (\n <aside\n ref={ref}\n data-state=\"expanded\"\n data-side={side}\n data-variant={variant}\n data-sidebar=\"sidebar\"\n style={{\n width: \"var(--sidebar-width)\",\n minWidth: \"var(--sidebar-width)\",\n maxWidth: \"var(--sidebar-width)\",\n }}\n className={cn(\n \"relative flex h-full shrink-0 grow-0 flex-col overflow-hidden bg-kumo-base text-kumo-default\",\n variant === \"sidebar\" &&\n (side === \"left\"\n ? \"border-r border-kumo-line\"\n : \"border-l border-kumo-line\"),\n variant === \"floating\" &&\n \"m-2 rounded-lg border border-kumo-line shadow-lg\",\n className,\n )}\n {...props}\n >\n {children}\n </aside>\n );\n }\n\n if (isMobile) {\n return (\n <DialogBase.Root open={openMobile} onOpenChange={setOpenMobile}>\n <DialogBase.Portal>\n <DialogBase.Backdrop className=\"fixed inset-0 z-50 bg-black/50 transition-opacity duration-200 data-[ending-style]:opacity-0 data-[starting-style]:opacity-0\" />\n <DialogBase.Popup\n className={cn(\n \"fixed inset-y-0 z-50 flex w-[--sidebar-width] flex-col bg-kumo-base p-0\",\n \"duration-200 data-[ending-style]:opacity-0 data-[starting-style]:opacity-0\",\n side === \"left\" &&\n \"left-0 data-[ending-style]:-translate-x-full data-[starting-style]:-translate-x-full\",\n side === \"right\" &&\n \"right-0 data-[ending-style]:translate-x-full data-[starting-style]:translate-x-full\",\n )}\n style={\n {\n \"--sidebar-width\": SIDEBAR_WIDTH,\n transitionProperty: \"transform, opacity\",\n transitionTimingFunction:\n \"var(--default-transition-timing-function)\",\n } as CSSProperties\n }\n >\n <div\n data-sidebar=\"sidebar\"\n data-mobile=\"true\"\n className={cn(\n \"flex h-full w-full flex-col bg-kumo-base text-kumo-default\",\n className,\n )}\n >\n {children}\n </div>\n </DialogBase.Popup>\n </DialogBase.Portal>\n </DialogBase.Root>\n );\n }\n\n // Resolve the target width from CSS variables or literal values\n const collapsedWidth =\n collapsible === \"icon\" ? \"var(--sidebar-width-icon)\" : \"0px\";\n const expandedWidth = resizable ? `${width}px` : \"var(--sidebar-width)\";\n const targetWidth = state === \"expanded\" ? expandedWidth : collapsedWidth;\n\n return (\n <aside\n ref={ref}\n data-state={state}\n data-side={side}\n data-variant={variant}\n data-collapsible={collapsible}\n data-sidebar=\"sidebar\"\n style={{ width: targetWidth }}\n className={cn(\n \"group/sidebar relative flex h-full shrink-0 grow-0 flex-col\",\n // overflow-hidden makes flex min-width resolve to 0 (per spec),\n // preventing children from pushing the sidebar wider than its width\n \"min-w-0 overflow-hidden whitespace-nowrap\",\n \"bg-kumo-base text-kumo-default\",\n // Transition width — matches production SidebarNav curve exactly\n \"transition-[width] duration-250 ease-[cubic-bezier(0.77,0,0.175,1)] will-change-[width]\",\n \"motion-reduce:transition-none\",\n // Disable transition during resize drag\n isResizing && \"transition-none!\",\n variant === \"sidebar\" &&\n (side === \"left\"\n ? \"border-r border-kumo-line\"\n : \"border-l border-kumo-line\"),\n variant === \"floating\" &&\n \"m-2 rounded-lg border border-kumo-line shadow-lg\",\n className,\n )}\n {...props}\n >\n {/* TooltipProvider groups all collapsed-state tooltips so hovering\n between icons shows tooltips instantly (no repeated delay). */}\n <TooltipProvider>{children}</TooltipProvider>\n </aside>\n );\n },\n);\n\nSidebarRoot.displayName = \"Sidebar\";\n\n// ============================================================================\n// Sidebar Header\n// ============================================================================\n\n/**\n * Top section of the sidebar. Typically contains a logo, title, and action button.\n *\n * @example\n * ```tsx\n * <Sidebar.Header>\n * <CloudflareLogo />\n * <span>Design Engineering</span>\n * <Button shape=\"square\" icon={CaretUpDownIcon} aria-label=\"Switch\" />\n * </Sidebar.Header>\n * ```\n */\nconst SidebarHeader = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-sidebar=\"header\"\n className={cn(\n \"flex items-center gap-2 border-b border-kumo-line px-2 py-3\",\n \"overflow-hidden\",\n // Collapsed: just remove border, keep same height\n \"group-data-[state=collapsed]/sidebar:border-b-0\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarHeader.displayName = \"Sidebar.Header\";\n\n// ============================================================================\n// Sidebar Content\n// ============================================================================\n\n/**\n * Scrollable middle section of the sidebar. Contains nav groups and menus.\n *\n * @example\n * ```tsx\n * <Sidebar.Content>\n * <Sidebar.Group>...</Sidebar.Group>\n * </Sidebar.Content>\n * ```\n */\nconst SidebarContent = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-sidebar=\"content\"\n className={cn(\n \"flex min-w-0 flex-1 flex-col gap-2 overflow-y-auto overflow-x-hidden px-2 py-2\",\n // Collapsed: flatten spacing so icons are evenly spaced\n \"group-data-[state=collapsed]/sidebar:gap-0 group-data-[state=collapsed]/sidebar:py-0\",\n \"group-data-[state=collapsed]/sidebar:overflow-x-hidden\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarContent.displayName = \"Sidebar.Content\";\n\n// ============================================================================\n// Sidebar Footer\n// ============================================================================\n\n/**\n * Bottom-pinned section of the sidebar. Typically contains toggle button and help actions.\n *\n * @example\n * ```tsx\n * <Sidebar.Footer>\n * <Sidebar.Trigger />\n * <Button shape=\"square\" icon={InfoIcon} aria-label=\"Help\" />\n * </Sidebar.Footer>\n * ```\n */\nconst SidebarFooter = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-sidebar=\"footer\"\n className={cn(\n \"flex min-w-0 flex-col gap-2 border-t border-kumo-line px-2 py-2\",\n // Collapsed: remove border, tighten padding\n \"group-data-[state=collapsed]/sidebar:border-t-0 group-data-[state=collapsed]/sidebar:py-1\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarFooter.displayName = \"Sidebar.Footer\";\n\n// ============================================================================\n// Sidebar Group\n// ============================================================================\n\n/** Context to signal children they're inside a collapsible group and provide open state. */\ninterface SidebarGroupCollapsibleContextValue {\n isCollapsible: boolean;\n isOpen: boolean;\n}\nconst SidebarGroupCollapsibleContext =\n createContext<SidebarGroupCollapsibleContextValue>({\n isCollapsible: false,\n isOpen: true,\n });\n\nexport interface SidebarGroupProps extends ComponentPropsWithoutRef<\"div\"> {\n /** When true, the group can be expanded/collapsed via its label. @default false */\n collapsible?: boolean;\n /** Initial open state when collapsible and uncontrolled. @default true */\n defaultOpen?: boolean;\n /** Controlled open state (collapsible mode only). */\n open?: boolean;\n /** Callback when open state changes (collapsible mode only). */\n onOpenChange?: (open: boolean) => void;\n}\n\n/**\n * Groups related menu items with an optional label.\n * When `collapsible` is set, wraps content with Base UI Collapsible for\n * animated expand/collapse via the group label.\n *\n * @example Non-collapsible group\n * ```tsx\n * <Sidebar.Group>\n * <Sidebar.GroupLabel>Build</Sidebar.GroupLabel>\n * <Sidebar.Menu>...</Sidebar.Menu>\n * </Sidebar.Group>\n * ```\n *\n * @example Collapsible group (requires GroupContent for animation)\n * ```tsx\n * <Sidebar.Group collapsible defaultOpen>\n * <Sidebar.GroupLabel>Build</Sidebar.GroupLabel>\n * <Sidebar.GroupContent>\n * <Sidebar.Menu>...</Sidebar.Menu>\n * </Sidebar.GroupContent>\n * </Sidebar.Group>\n * ```\n */\nconst SidebarGroup = forwardRef<HTMLDivElement, SidebarGroupProps>(\n (\n {\n className,\n collapsible = false,\n defaultOpen = true,\n open: openProp,\n onOpenChange,\n children,\n ...props\n },\n ref,\n ) => {\n // Track internal open state for uncontrolled mode\n const [internalOpen, setInternalOpen] = useState(defaultOpen);\n const isOpen = openProp ?? internalOpen;\n\n const handleOpenChange = useCallback(\n (newOpen: boolean) => {\n setInternalOpen(newOpen);\n onOpenChange?.(newOpen);\n },\n [onOpenChange],\n );\n\n const contextValue = useMemo(\n () => ({ isCollapsible: collapsible, isOpen }),\n [collapsible, isOpen],\n );\n\n const content = (\n <div\n ref={ref}\n data-sidebar=\"group\"\n className={cn(\n \"flex min-w-0 flex-col gap-0.5\",\n // Collapsed: remove internal gap so icons stack uniformly\n \"group-data-[state=collapsed]/sidebar:gap-0\",\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n\n if (!collapsible) {\n return (\n <SidebarGroupCollapsibleContext.Provider value={contextValue}>\n {content}\n </SidebarGroupCollapsibleContext.Provider>\n );\n }\n\n return (\n <SidebarGroupCollapsibleContext.Provider value={contextValue}>\n <CollapsibleBase.Root\n defaultOpen={defaultOpen}\n open={openProp}\n onOpenChange={handleOpenChange}\n className=\"min-w-0\"\n >\n {content}\n </CollapsibleBase.Root>\n </SidebarGroupCollapsibleContext.Provider>\n );\n },\n);\n\nSidebarGroup.displayName = \"Sidebar.Group\";\n\n// ============================================================================\n// Sidebar GroupLabel\n// ============================================================================\n\n/**\n * Section label for a sidebar group (e.g., \"Build\", \"Protect & Connect\").\n * Hidden when the sidebar is collapsed to icon-only mode.\n *\n * When used inside a collapsible `Sidebar.Group`, renders as a\n * `Collapsible.Trigger` with an auto-rotating chevron.\n *\n * @example\n * ```tsx\n * <Sidebar.GroupLabel>Build</Sidebar.GroupLabel>\n * ```\n */\nconst SidebarGroupLabel = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(({ className, children, ...props }, ref) => {\n const { isCollapsible } = useContext(SidebarGroupCollapsibleContext);\n\n if (isCollapsible) {\n return (\n <CollapsibleBase.Trigger\n ref={ref as React.Ref<HTMLButtonElement>}\n data-sidebar=\"group-label\"\n className={cn(\n \"group/group-label flex w-full cursor-pointer items-center px-3 py-1 text-xs font-medium text-kumo-subtle\",\n \"group-data-[state=collapsed]/sidebar:hidden\",\n className,\n )}\n {...(props as ComponentPropsWithoutRef<\"button\">)}\n >\n <span className=\"flex-1 truncate text-left\">{children}</span>\n <CaretRightIcon\n className={cn(\n \"ml-auto size-3 shrink-0 text-kumo-subtle transition-transform duration-200\",\n \"group-data-[panel-open]/group-label:rotate-90\",\n )}\n />\n </CollapsibleBase.Trigger>\n );\n }\n\n return (\n <div\n ref={ref}\n data-sidebar=\"group-label\"\n className={cn(\n \"truncate px-3 py-1 text-xs font-medium text-kumo-subtle\",\n \"group-data-[state=collapsed]/sidebar:hidden\",\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n});\n\nSidebarGroupLabel.displayName = \"Sidebar.GroupLabel\";\n\n// ============================================================================\n// Sidebar GroupContent\n// ============================================================================\n\n/**\n * Animation wrapper for collapsible group content. Uses CSS grid-rows\n * for smooth height transitions when the group is expanded/collapsed.\n *\n * **Only needed for collapsible groups.** For non-collapsible groups,\n * place `Menu` directly inside `Group` — no wrapper required.\n *\n * @example Collapsible group (GroupContent required)\n * ```tsx\n * <Sidebar.Group collapsible defaultOpen>\n * <Sidebar.GroupLabel>Build</Sidebar.GroupLabel>\n * <Sidebar.GroupContent>\n * <Sidebar.Menu>...</Sidebar.Menu>\n * </Sidebar.GroupContent>\n * </Sidebar.Group>\n * ```\n *\n * @example Non-collapsible group (no GroupContent needed)\n * ```tsx\n * <Sidebar.Group>\n * <Sidebar.GroupLabel>Overview</Sidebar.GroupLabel>\n * <Sidebar.Menu>...</Sidebar.Menu>\n * </Sidebar.Group>\n * ```\n */\nconst SidebarGroupContent = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(({ className, children, ...props }, ref) => {\n const { isCollapsible, isOpen } = useContext(SidebarGroupCollapsibleContext);\n\n if (isCollapsible) {\n return (\n <div\n ref={ref}\n data-sidebar=\"group-content\"\n className={cn(\n \"grid\",\n // Animate height via grid-rows — matches production NavGroup pattern\n \"transition-[grid-template-rows] duration-250 ease-[cubic-bezier(0.77,0,0.175,1)]\",\n \"motion-reduce:transition-none\",\n // Default: collapsed\n \"grid-rows-[0fr]\",\n // When sidebar is expanded, respect group open/close state\n isOpen\n ? \"group-data-[state=expanded]/sidebar:grid-rows-[1fr]\"\n : \"group-data-[state=expanded]/sidebar:grid-rows-[0fr]\",\n className,\n )}\n {...props}\n >\n <div className=\"overflow-hidden\">{children}</div>\n </div>\n );\n }\n\n return (\n <div\n ref={ref}\n data-sidebar=\"group-content\"\n className={cn(\"flex flex-col\", className)}\n {...props}\n >\n {children}\n </div>\n );\n});\n\nSidebarGroupContent.displayName = \"Sidebar.GroupContent\";\n\n// ============================================================================\n// MenuItem / MenuSubItem auto-wrap contexts\n// ============================================================================\n\n/**\n * When `true`, indicates the component is already wrapped in a `MenuItem` `<li>`.\n * `MenuButton` checks this: if `false`, it auto-wraps itself in an `<li>`.\n */\nconst MenuItemContext = createContext(false);\n\n/**\n * When `true`, indicates the component is already wrapped in a `MenuSubItem` `<li>`.\n * `MenuSubButton` checks this: if `false`, it auto-wraps itself in an `<li>`.\n */\nconst MenuSubItemContext = createContext(false);\n\n// ============================================================================\n// Sidebar Menu\n// ============================================================================\n\n/**\n * Navigation menu list. Renders as `<ul>`.\n *\n * `MenuButton` auto-wraps in `<li>` so `MenuItem` is optional for simple items.\n *\n * @example Simple usage\n * ```tsx\n * <Sidebar.Menu>\n * <Sidebar.MenuButton icon={HouseIcon} active>Account home</Sidebar.MenuButton>\n * <Sidebar.MenuButton icon={GlobeIcon}>Domains</Sidebar.MenuButton>\n * </Sidebar.Menu>\n * ```\n *\n * @example With explicit MenuItem (needed for MenuAction sibling)\n * ```tsx\n * <Sidebar.Menu>\n * <Sidebar.MenuItem>\n * <Sidebar.MenuButton icon={GearIcon}>Settings</Sidebar.MenuButton>\n * <Sidebar.MenuAction><PencilIcon /></Sidebar.MenuAction>\n * </Sidebar.MenuItem>\n * </Sidebar.Menu>\n * ```\n */\nconst SidebarMenu = forwardRef<\n HTMLUListElement,\n ComponentPropsWithoutRef<\"ul\">\n>(({ className, ...props }, ref) => (\n <ul\n ref={ref}\n data-sidebar=\"menu\"\n className={cn(\n \"m-0 flex min-w-0 list-none flex-col gap-0.5 p-0\",\n \"group-data-[state=collapsed]/sidebar:gap-0\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarMenu.displayName = \"Sidebar.Menu\";\n\n// ============================================================================\n// Sidebar MenuItem\n// ============================================================================\n\n/**\n * Individual menu list item. Renders as `<li>`.\n *\n * **Optional when using `MenuButton` directly** — `MenuButton` auto-wraps\n * itself in a `<li>` when not already inside a `MenuItem`. Use `MenuItem`\n * explicitly when you need to place siblings (e.g., `MenuAction`) alongside\n * a `MenuButton`.\n *\n * @example Explicit usage (needed for MenuAction sibling)\n * ```tsx\n * <Sidebar.MenuItem>\n * <Sidebar.MenuButton icon={GearIcon}>Settings</Sidebar.MenuButton>\n * <Sidebar.MenuAction><PencilIcon /></Sidebar.MenuAction>\n * </Sidebar.MenuItem>\n * ```\n */\nconst SidebarMenuItem = forwardRef<\n HTMLLIElement,\n ComponentPropsWithoutRef<\"li\">\n>(({ className, children, ...props }, ref) => (\n <MenuItemContext.Provider value={true}>\n <li\n ref={ref}\n data-sidebar=\"menu-item\"\n className={cn(\"relative\", className)}\n {...props}\n >\n {children}\n </li>\n </MenuItemContext.Provider>\n));\n\nSidebarMenuItem.displayName = \"Sidebar.MenuItem\";\n\n// ============================================================================\n// Sidebar MenuButton\n// ============================================================================\n\nexport type SidebarMenuButtonSize = \"base\" | \"sm\";\n\nexport interface SidebarMenuButtonProps\n extends Omit<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n \"className\" | \"children\"\n > {\n icon?: React.ComponentType<{ className?: string }> | React.ReactNode;\n active?: boolean;\n /**\n * Button size.\n * - `\"base\"` — Standard nav item\n * - `\"sm\"` — Compact nav item\n * @default \"base\"\n */\n size?: SidebarMenuButtonSize;\n href?: string;\n tooltip?: string;\n className?: string;\n children?: ReactNode;\n}\n\n/**\n * Primary interactive element inside a menu item. Renders as a `<button>` or link.\n * Supports icons, active state, and auto-tooltip when the sidebar is collapsed.\n *\n * **Auto-wraps in `<li>`** when not already inside a `Sidebar.MenuItem`.\n * Use `MenuItem` explicitly only when you need siblings (e.g., `MenuAction`).\n *\n * When used as a `Collapsible.Trigger` via `render` prop, the expand/collapse chevron\n * auto-rotates thanks to Base UI's `data-panel-open` attribute combined with\n * `group/menu-button` CSS grouping.\n *\n * @example Simple usage (auto-wrapped in `<li>`)\n * ```tsx\n * <Sidebar.Menu>\n * <Sidebar.MenuButton icon={GlobeIcon} active>Domains</Sidebar.MenuButton>\n * <Sidebar.MenuButton icon={ClockIcon} href=\"/recents\">Recents</Sidebar.MenuButton>\n * </Sidebar.Menu>\n * ```\n *\n * @example With MenuAction sibling (explicit MenuItem needed)\n * ```tsx\n * <Sidebar.MenuItem>\n * <Sidebar.MenuButton icon={GearIcon}>Settings</Sidebar.MenuButton>\n * <Sidebar.MenuAction><PencilIcon /></Sidebar.MenuAction>\n * </Sidebar.MenuItem>\n * ```\n */\nconst SidebarMenuButton = forwardRef<HTMLButtonElement, SidebarMenuButtonProps>(\n (\n {\n className,\n icon: IconProp,\n active = false,\n size = \"base\",\n href,\n tooltip,\n children,\n ...props\n },\n ref,\n ) => {\n const { state } = useSidebar();\n const LinkComponent = useLinkComponent();\n const isInsideMenuItem = useContext(MenuItemContext);\n\n // Render icon — supports both component types and React elements\n const iconNode = (() => {\n if (!IconProp) return null;\n if (React.isValidElement(IconProp)) return IconProp;\n const Comp = IconProp as React.ComponentType<{ className?: string }>;\n return (\n <Comp\n className={cn(\"shrink-0\", size === \"base\" ? \"size-4\" : \"size-3.5\")}\n />\n );\n })();\n\n const content = (\n <>\n {iconNode}\n <span\n className={cn(\n \"flex flex-1 items-center min-w-0 text-left overflow-hidden\",\n \"group-data-[state=collapsed]/sidebar:hidden\",\n )}\n >\n {children}\n </span>\n </>\n );\n\n const buttonClasses = cn(\n // Layout\n \"group/menu-button flex w-full min-w-0 items-center gap-2 rounded-lg outline-none cursor-pointer\",\n // Sizing\n size === \"base\" && \"min-h-[34px] px-3 py-1.5 text-sm font-medium\",\n size === \"sm\" && \"min-h-[28px] px-2 py-1 text-sm\",\n // Default state — transition includes padding so collapsed centering animates smoothly\n \"text-kumo-default\",\n \"transition-[color,background-color,padding] duration-0 ease-[cubic-bezier(0.77,0,0.175,1)]\",\n // Icon color\n \"[&>svg]:text-kumo-subtle\",\n !active && \"hover:bg-kumo-tint\",\n // Active state\n active && \"bg-kumo-tint\",\n // When a child sub-button is active, don't show active styling on the parent trigger\n \"has-[[data-active]]:bg-transparent has-[[data-active]]:hover:bg-kumo-tint\",\n // Focus\n \"focus-visible:ring-1 focus-visible:ring-kumo-hairline\",\n // Collapsed: px-2 centers the icon (48px sidebar − 16px content padding = 32px;\n // 32px − 2×8px padding = 16px = icon size). Padding transition keeps it smooth.\n \"group-data-[state=collapsed]/sidebar:px-2\",\n className,\n );\n\n let button: React.ReactNode;\n\n if (href) {\n button = (\n <LinkComponent\n ref={ref as React.Ref<HTMLAnchorElement>}\n className={cn(buttonClasses, \"no-underline!\")}\n href={href}\n to={href}\n data-active={active || undefined}\n data-sidebar=\"menu-button\"\n data-size={size}\n onClick={\n props.onClick as unknown as React.MouseEventHandler<HTMLAnchorElement>\n }\n >\n {content}\n </LinkComponent>\n );\n } else {\n button = (\n <button\n ref={ref}\n type=\"button\"\n className={buttonClasses}\n data-active={active || undefined}\n data-sidebar=\"menu-button\"\n data-size={size}\n {...props}\n >\n {content}\n </button>\n );\n }\n\n // Wrap in Tooltip when collapsed and tooltip text is provided.\n // Use asChild so TooltipTrigger merges onto the button/link via render prop\n // instead of wrapping it in another <button> (which would cause invalid nesting).\n if (state === \"collapsed\" && tooltip) {\n button = (\n <Tooltip content={tooltip} side=\"right\" asChild>\n {button}\n </Tooltip>\n );\n }\n\n // Auto-wrap in <li> when not already inside a MenuItem\n if (!isInsideMenuItem) {\n return (\n <li data-sidebar=\"menu-item\" className=\"relative\">\n {button}\n </li>\n );\n }\n\n return button;\n },\n);\n\nSidebarMenuButton.displayName = \"Sidebar.MenuButton\";\n\n// ============================================================================\n// Sidebar MenuAction\n// ============================================================================\n\n/**\n * Right-aligned action button inside a menu item (e.g., settings gear, plus icon).\n * Positioned absolutely so it overlays the menu button.\n * Hidden when the sidebar is collapsed.\n */\nconst SidebarMenuAction = forwardRef<\n HTMLButtonElement,\n ComponentPropsWithoutRef<\"button\">\n>(({ className, ...props }, ref) => (\n <button\n ref={ref}\n type=\"button\"\n data-sidebar=\"menu-action\"\n className={cn(\n \"absolute right-1.5 top-1/2 flex -translate-y-1/2 items-center justify-center rounded-md p-1\",\n \"text-kumo-strong hover:bg-kumo-overlay\",\n \"transition-colors duration-150\",\n \"group-data-[state=collapsed]/sidebar:hidden\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarMenuAction.displayName = \"Sidebar.MenuAction\";\n\n// ============================================================================\n// Sidebar MenuBadge\n// ============================================================================\n\n/**\n * Badge pill displayed inside a menu button (e.g., \"Beta\", \"New\").\n * Uses dashed border styling matching the Cloudflare design system.\n *\n * @example\n * ```tsx\n * <Sidebar.MenuSubButton>\n * Containers\n * <Sidebar.MenuBadge>Beta</Sidebar.MenuBadge>\n * </Sidebar.MenuSubButton>\n * ```\n */\nconst SidebarMenuBadge = forwardRef<\n HTMLSpanElement,\n ComponentPropsWithoutRef<\"span\">\n>(({ className, ...props }, ref) => (\n <span\n ref={ref}\n data-sidebar=\"menu-badge\"\n className={cn(\n \"inline-flex shrink-0 items-center rounded-full border border-dashed border-kumo-line\",\n \"select-none px-1.5 py-0.5 text-[11px]/none font-medium text-kumo-strong\",\n // Hidden when collapsed\n \"group-data-[state=collapsed]/sidebar:hidden\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarMenuBadge.displayName = \"Sidebar.MenuBadge\";\n\n// ============================================================================\n// Sidebar MenuSub\n// ============================================================================\n\n/**\n * Indented sub-menu container for child navigation items. Renders as `<ul>` with\n * a left border accent for visual hierarchy.\n *\n * `MenuSubButton` auto-wraps in `<li>` so `MenuSubItem` is optional.\n *\n * @example\n * ```tsx\n * <Sidebar.MenuSub>\n * <Sidebar.MenuSubButton active>Workers & Pages</Sidebar.MenuSubButton>\n * <Sidebar.MenuSubButton>Durable Objects</Sidebar.MenuSubButton>\n * </Sidebar.MenuSub>\n * ```\n */\nconst SidebarMenuSub = forwardRef<\n HTMLUListElement,\n ComponentPropsWithoutRef<\"ul\">\n>(({ className, ...props }, ref) => (\n <ul\n ref={ref}\n data-sidebar=\"menu-sub\"\n className={cn(\n \"m-0 ml-3.5 flex min-w-0 list-none flex-col gap-0.5 border-l border-kumo-line p-0 pl-2.5\",\n // Hidden when collapsed\n \"group-data-[state=collapsed]/sidebar:hidden\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarMenuSub.displayName = \"Sidebar.MenuSub\";\n\n// ============================================================================\n// Sidebar MenuSubItem\n// ============================================================================\n\n/**\n * Individual item inside a sub-menu. Renders as `<li>`.\n *\n * **Optional when using `MenuSubButton` directly** — `MenuSubButton` auto-wraps\n * itself in a `<li>` when not already inside a `MenuSubItem`.\n */\nconst SidebarMenuSubItem = forwardRef<\n HTMLLIElement,\n ComponentPropsWithoutRef<\"li\">\n>(({ className, children, ...props }, ref) => (\n <MenuSubItemContext.Provider value={true}>\n <li\n ref={ref}\n data-sidebar=\"menu-sub-item\"\n className={cn(\"relative\", className)}\n {...props}\n >\n {children}\n </li>\n </MenuSubItemContext.Provider>\n));\n\nSidebarMenuSubItem.displayName = \"Sidebar.MenuSubItem\";\n\n// ============================================================================\n// Sidebar MenuSubButton\n// ============================================================================\n\nexport interface SidebarMenuSubButtonProps\n extends ComponentPropsWithoutRef<\"button\"> {\n /** Marks this sub-item as currently active/selected. @default false */\n active?: boolean;\n /** Navigation URL. When set, renders as a link via LinkProvider. */\n href?: string;\n}\n\n/**\n * Button inside a sub-menu item. Does not render an icon (sub-items are\n * indented instead). Supports active state and link rendering.\n *\n * **Auto-wraps in `<li>`** when not already inside a `Sidebar.MenuSubItem`.\n *\n * @example Simple usage (auto-wrapped in `<li>`)\n * ```tsx\n * <Sidebar.MenuSub>\n * <Sidebar.MenuSubButton active>Workers & Pages</Sidebar.MenuSubButton>\n * <Sidebar.MenuSubButton href=\"/observability\">Observability</Sidebar.MenuSubButton>\n * </Sidebar.MenuSub>\n * ```\n */\nconst SidebarMenuSubButton = forwardRef<\n HTMLButtonElement,\n SidebarMenuSubButtonProps\n>(({ className, active = false, href, children, ...props }, ref) => {\n const LinkComponent = useLinkComponent();\n const isInsideMenuSubItem = useContext(MenuSubItemContext);\n\n const buttonClasses = cn(\n \"flex w-full min-w-0 items-center gap-2 rounded-lg min-h-[34px] px-3 py-1 text-sm font-medium outline-none\",\n \"text-kumo-default transition-colors duration-150\",\n !active && \"hover:bg-kumo-tint\",\n active && \"bg-kumo-tint\",\n \"focus-visible:ring-1 focus-visible:ring-kumo-hairline\",\n className,\n );\n\n const content = <span className=\"flex-1 truncate text-left\">{children}</span>;\n\n let button: React.ReactNode;\n\n if (href) {\n button = (\n <LinkComponent\n ref={ref as React.Ref<HTMLAnchorElement>}\n className={cn(buttonClasses, \"no-underline!\")}\n href={href}\n to={href}\n data-active={active || undefined}\n data-sidebar=\"menu-sub-button\"\n onClick={\n props.onClick as unknown as React.MouseEventHandler<HTMLAnchorElement>\n }\n >\n {content}\n </LinkComponent>\n );\n } else {\n button = (\n <button\n ref={ref}\n type=\"button\"\n className={buttonClasses}\n data-active={active || undefined}\n data-sidebar=\"menu-sub-button\"\n {...props}\n >\n {content}\n </button>\n );\n }\n\n // Auto-wrap in <li> when not already inside a MenuSubItem\n if (!isInsideMenuSubItem) {\n return (\n <li data-sidebar=\"menu-sub-item\" className=\"relative\">\n {button}\n </li>\n );\n }\n\n return button;\n});\n\nSidebarMenuSubButton.displayName = \"Sidebar.MenuSubButton\";\n\n// ============================================================================\n// Sidebar Separator\n// ============================================================================\n\n/**\n * Horizontal divider line between sidebar sections.\n */\nconst SidebarSeparator = forwardRef<\n HTMLHRElement,\n ComponentPropsWithoutRef<\"hr\">\n>(({ className, ...props }, ref) => (\n <hr\n ref={ref}\n data-sidebar=\"separator\"\n className={cn(\"mx-2 min-h-px h-px border-0 bg-kumo-line\", className)}\n {...props}\n />\n));\n\nSidebarSeparator.displayName = \"Sidebar.Separator\";\n\n// ============================================================================\n// Sidebar Input\n// ============================================================================\n\nexport interface SidebarInputProps extends ComponentPropsWithoutRef<\"button\"> {\n /** Placeholder text displayed inside the search trigger. @default \"Search...\" */\n placeholder?: string;\n /** Keyboard shortcut hint (e.g., \"⌘K\"). */\n shortcut?: string;\n}\n\n/**\n * Search trigger button styled as an input. Typically opens a command palette.\n *\n * @example\n * ```tsx\n * <Sidebar.Input placeholder=\"Quick search...\" shortcut=\"⌘K\" onClick={openSearch} />\n * ```\n */\nconst SidebarInput = forwardRef<HTMLButtonElement, SidebarInputProps>(\n (\n { className, placeholder = \"Search...\", shortcut, children, ...props },\n ref,\n ) => (\n <button\n ref={ref}\n type=\"button\"\n data-sidebar=\"input\"\n className={cn(\n \"flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm\",\n \"bg-kumo-base text-kumo-subtle ring ring-kumo-line\",\n \"transition-[color,background-color,padding,box-shadow] duration-250 ease-[cubic-bezier(0.77,0,0.175,1)]\",\n \"hover:bg-kumo-overlay\",\n // Collapsed: icon-only, padding centers icon, ring fades via box-shadow transition\n \"group-data-[state=collapsed]/sidebar:px-2 group-data-[state=collapsed]/sidebar:ring-0\",\n className,\n )}\n {...props}\n >\n <MagnifyingGlassIcon className=\"size-4 shrink-0 text-kumo-subtle\" />\n <span className=\"flex-1 truncate text-left group-data-[state=collapsed]/sidebar:hidden\">\n {children ?? placeholder}\n </span>\n {shortcut && (\n <kbd className=\"ml-auto font-sans text-xs text-kumo-subtle group-data-[state=collapsed]/sidebar:hidden\">\n {shortcut}\n </kbd>\n )}\n </button>\n ),\n);\n\nSidebarInput.displayName = \"Sidebar.Input\";\n\n// ============================================================================\n// Sidebar Trigger\n// ============================================================================\n\n/**\n * Button that toggles the sidebar open/collapsed. Uses `toggleSidebar()` from context.\n * Defaults to a `SidebarSimpleIcon`, left-aligned.\n *\n * @example\n * ```tsx\n * <Sidebar.Trigger />\n * <Sidebar.Trigger><PanelLeftIcon className=\"size-5\" /></Sidebar.Trigger>\n * ```\n */\nconst SidebarTrigger = forwardRef<\n HTMLButtonElement,\n ComponentPropsWithoutRef<\"button\">\n>(({ className, children, onClick, ...props }, ref) => {\n const { toggleSidebar } = useSidebar();\n\n return (\n <button\n ref={ref}\n type=\"button\"\n data-sidebar=\"trigger\"\n aria-label=\"Toggle sidebar\"\n className={cn(\n \"flex items-center rounded-md p-1.5\",\n \"text-kumo-subtle hover:text-kumo-strong hover:bg-kumo-overlay\",\n \"transition-colors duration-150\",\n className,\n )}\n onClick={(e) => {\n onClick?.(e);\n toggleSidebar();\n }}\n {...props}\n >\n {children ?? <SidebarSimpleIcon className=\"size-5\" />}\n </button>\n );\n});\n\nSidebarTrigger.displayName = \"Sidebar.Trigger\";\n\n// ============================================================================\n// Sidebar Rail\n// ============================================================================\n\n/**\n * Invisible interaction strip at the sidebar edge for click-to-toggle.\n * Renders a thin hover-sensitive area between the sidebar and main content.\n */\nconst SidebarRail = forwardRef<\n HTMLButtonElement,\n ComponentPropsWithoutRef<\"button\">\n>(({ className, ...props }, ref) => {\n const { toggleSidebar } = useSidebar();\n\n return (\n <button\n ref={ref}\n type=\"button\"\n data-sidebar=\"rail\"\n aria-label=\"Toggle sidebar\"\n tabIndex={-1}\n className={cn(\n \"absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 cursor-pointer transition-all\",\n \"after:absolute after:inset-y-0 after:left-1/2 after:w-0.5\",\n \"hover:after:bg-kumo-brand/20\",\n \"group-data-[side=left]/sidebar-wrapper:right-0\",\n \"group-data-[side=right]/sidebar-wrapper:left-0\",\n \"sm:flex\",\n className,\n )}\n onClick={toggleSidebar}\n {...props}\n />\n );\n});\n\nSidebarRail.displayName = \"Sidebar.Rail\";\n\n// ============================================================================\n// Sidebar ResizeHandle\n// ============================================================================\n\n/**\n * Drag handle for resizing the sidebar. Renders when `resizable` is true in\n * both expanded and collapsed states.\n *\n * - **Expanded → drag inward past `minWidth`**: auto-collapses to icon-only.\n * - **Collapsed → drag outward past `minWidth`**: auto-expands and begins\n * tracking width from `minWidth`.\n */\nconst SidebarResizeHandle = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<\"div\">\n>(({ className, ...props }, ref) => {\n const {\n side,\n resizable,\n setIsResizing,\n setWidth,\n setOpen,\n open,\n minWidth,\n } = useSidebar();\n const startX = useRef(0);\n const startWidth = useRef(0);\n const wasCollapsed = useRef(false);\n\n if (!resizable) return null;\n\n const handlePointerDown = (e: React.PointerEvent<HTMLDivElement>) => {\n e.preventDefault();\n setIsResizing(true);\n startX.current = e.clientX;\n wasCollapsed.current = !open;\n\n const wrapper = (e.currentTarget as HTMLElement).closest(\n \"[data-sidebar-wrapper]\",\n );\n const sidebar = wrapper?.querySelector(\"[data-sidebar='sidebar']\");\n startWidth.current = sidebar?.getBoundingClientRect().width ?? 0;\n\n const cleanup = () => {\n setIsResizing(false);\n document.removeEventListener(\"pointermove\", handlePointerMove);\n document.removeEventListener(\"pointerup\", handlePointerUp);\n };\n\n const handlePointerMove = (moveEvent: PointerEvent) => {\n const delta =\n side === \"left\"\n ? moveEvent.clientX - startX.current\n : startX.current - moveEvent.clientX;\n const rawWidth = startWidth.current + delta;\n\n if (wasCollapsed.current) {\n // Dragging outward from collapsed — expand once past minWidth\n if (rawWidth >= minWidth) {\n wasCollapsed.current = false;\n setOpen(true);\n setWidth(rawWidth);\n }\n return;\n }\n\n // Dragging inward while expanded — collapse when below minWidth\n if (rawWidth < minWidth) {\n setOpen(false);\n wasCollapsed.current = true;\n return;\n }\n\n setWidth(rawWidth);\n };\n\n const handlePointerUp = () => {\n cleanup();\n };\n\n document.addEventListener(\"pointermove\", handlePointerMove);\n document.addEventListener(\"pointerup\", handlePointerUp);\n };\n\n return (\n <div\n ref={ref}\n data-sidebar=\"resize-handle\"\n className={cn(\n \"absolute inset-y-0 z-20 hidden w-1 cursor-col-resize transition-colors sm:block\",\n \"hover:bg-kumo-brand/30 active:bg-kumo-brand/50\",\n side === \"left\" && \"right-0\",\n side === \"right\" && \"left-0\",\n className,\n )}\n onPointerDown={handlePointerDown}\n {...props}\n />\n );\n});\n\nSidebarResizeHandle.displayName = \"Sidebar.ResizeHandle\";\n\n// ============================================================================\n// Sidebar MenuChevron\n// ============================================================================\n\n/**\n * Auto-rotating chevron for collapsible menu items. When the parent\n * `MenuButton` is used as a `Collapsible.Trigger`, Base UI sets\n * `data-panel-open` on the trigger — the chevron rotates automatically via CSS.\n *\n * @example\n * ```tsx\n * <Sidebar.CollapsibleTrigger render={<Sidebar.MenuButton icon={ComputeIcon} />}>\n * Compute\n * <Sidebar.MenuChevron />\n * </Sidebar.CollapsibleTrigger>\n * ```\n */\nfunction SidebarMenuChevron({ className }: { className?: string }) {\n return (\n <CaretRightIcon\n className={cn(\n \"ml-auto size-4 shrink-0 text-kumo-subtle transition-transform duration-200\",\n // Auto-rotate when inside an open Collapsible trigger\n \"group-data-[panel-open]/menu-button:rotate-90\",\n // Hidden when collapsed\n \"group-data-[state=collapsed]/sidebar:hidden\",\n className,\n )}\n />\n );\n}\n\nSidebarMenuChevron.displayName = \"Sidebar.MenuChevron\";\n\n// ============================================================================\n// Collapsible re-exports\n// ============================================================================\n\n/**\n * Base UI Collapsible.Root for sidebar sub-menu expand/collapse.\n * @see https://base-ui.com/react/components/collapsible\n */\nconst SidebarCollapsible = CollapsibleBase.Root;\n\n/**\n * Base UI Collapsible.Trigger for sidebar sub-menu toggle.\n * Use `render` prop to compose with `Sidebar.MenuButton`.\n *\n * @example\n * ```tsx\n * <Sidebar.CollapsibleTrigger render={<Sidebar.MenuButton icon={DiamondIcon} />}>\n * Compute\n * <Sidebar.MenuChevron />\n * </Sidebar.CollapsibleTrigger>\n * ```\n */\nconst SidebarCollapsibleTrigger = CollapsibleBase.Trigger;\n\n/**\n * Animated collapsible panel for sidebar sub-menu content.\n * Wraps Base UI `Collapsible.Panel` with a height transition driven by the\n * `--collapsible-panel-height` CSS variable that Base UI measures automatically.\n *\n * Uses `keepMounted` by default so the exit animation plays before removal.\n *\n * Animation flow:\n * - **Opening**: `data-starting-style` (h=0) → `data-open` (h=measured) — transition up\n * - **Closing**: `data-open` removed + `data-ending-style` (h=0) — transition down\n * - **Closed**: `data-closed` (h=0) — stays collapsed while mounted\n */\nconst SidebarCollapsibleContent = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<typeof CollapsibleBase.Panel>\n>(({ className, keepMounted = true, ...props }, ref) => (\n <CollapsibleBase.Panel\n ref={ref}\n keepMounted={keepMounted}\n className={cn(\n \"overflow-hidden\",\n // Default: show at measured height (when data-open, no override matches)\n \"h-[var(--collapsible-panel-height)]\",\n // Transition height — matches production NavGroup easing\n \"transition-[height] duration-250 ease-[cubic-bezier(0.77,0,0.175,1)]\",\n \"motion-reduce:transition-none\",\n // Closed / animating in / animating out: height 0\n \"data-[closed]:h-0 data-[starting-style]:h-0 data-[ending-style]:h-0\",\n className,\n )}\n {...props}\n />\n));\n\nSidebarCollapsibleContent.displayName = \"Sidebar.CollapsibleContent\";\n\n// ============================================================================\n// Compound Component Export\n// ============================================================================\n\n/**\n * Sidebar — responsive navigation panel with expand/collapse support.\n *\n * Compound component: `Sidebar` (root `<aside>`), `.Provider`, `.Header`,\n * `.Content`, `.Footer`, `.Group`, `.GroupLabel`, `.GroupContent`,\n * `.Menu`, `.MenuItem`, `.MenuButton`, `.MenuAction`, `.MenuBadge`,\n * `.MenuSub`, `.MenuSubItem`, `.MenuSubButton`, `.Separator`,\n * `.Input`, `.Trigger`, `.Rail`, `.MenuChevron`,\n * `.Collapsible`, `.CollapsibleTrigger`, `.CollapsibleContent`.\n *\n * Built on `@base-ui/react/collapsible` + `@base-ui/react/dialog`.\n *\n * @example\n * ```tsx\n * <Sidebar.Provider defaultOpen>\n * <Sidebar>\n * <Sidebar.Content>\n * <Sidebar.Group>\n * <Sidebar.GroupLabel>Overview</Sidebar.GroupLabel>\n * <Sidebar.Menu>\n * <Sidebar.MenuButton icon={HouseIcon} active>Home</Sidebar.MenuButton>\n * <Sidebar.MenuButton icon={GlobeIcon}>Domains</Sidebar.MenuButton>\n * </Sidebar.Menu>\n * </Sidebar.Group>\n * </Sidebar.Content>\n * <Sidebar.Footer>\n * <Sidebar.Trigger />\n * </Sidebar.Footer>\n * </Sidebar>\n * </Sidebar.Provider>\n * ```\n */\nexport const Sidebar = Object.assign(SidebarRoot, {\n Provider: SidebarProvider,\n Header: SidebarHeader,\n Content: SidebarContent,\n Footer: SidebarFooter,\n Group: SidebarGroup,\n GroupLabel: SidebarGroupLabel,\n GroupContent: SidebarGroupContent,\n Menu: SidebarMenu,\n MenuItem: SidebarMenuItem,\n MenuButton: SidebarMenuButton,\n MenuAction: SidebarMenuAction,\n MenuBadge: SidebarMenuBadge,\n MenuSub: SidebarMenuSub,\n MenuSubItem: SidebarMenuSubItem,\n MenuSubButton: SidebarMenuSubButton,\n Separator: SidebarSeparator,\n Input: SidebarInput,\n Trigger: SidebarTrigger,\n Rail: SidebarRail,\n ResizeHandle: SidebarResizeHandle,\n MenuChevron: SidebarMenuChevron,\n Collapsible: SidebarCollapsible,\n CollapsibleTrigger: SidebarCollapsibleTrigger,\n CollapsibleContent: SidebarCollapsibleContent,\n});\n\nexport {\n SidebarProvider,\n SidebarRoot,\n SidebarHeader,\n SidebarContent,\n SidebarFooter,\n SidebarGroup,\n SidebarGroupLabel,\n SidebarGroupContent,\n SidebarMenu,\n SidebarMenuItem,\n SidebarMenuButton,\n SidebarMenuAction,\n SidebarMenuBadge,\n SidebarMenuSub,\n SidebarMenuSubItem,\n SidebarMenuSubButton,\n SidebarSeparator,\n SidebarInput,\n SidebarTrigger,\n SidebarRail,\n SidebarResizeHandle,\n SidebarMenuChevron,\n SidebarCollapsible,\n SidebarCollapsibleTrigger,\n SidebarCollapsibleContent,\n};\n"],"names":["KUMO_SIDEBAR_VARIANTS","KUMO_SIDEBAR_DEFAULT_VARIANTS","KUMO_SIDEBAR_STYLING","SIDEBAR_WIDTH","SIDEBAR_WIDTH_ICON","MOBILE_BREAKPOINT","useIsMobile","isMobile","setIsMobile","useState","useEffect","mql","onChange","SidebarContext","createContext","useSidebar","context","useContext","DEFAULT_WIDTH_PX","MIN_WIDTH_PX","MAX_WIDTH_PX","SidebarProvider","defaultOpen","openProp","setOpenProp","variant","side","collapsible","resizable","defaultWidth","minWidth","maxWidth","onWidthChange","children","className","style","openMobile","setOpenMobile","width","setWidthState","isResizing","setIsResizing","setWidth","useCallback","newWidth","clamped","_open","_setOpen","open","setOpen","value","next","toggleSidebar","prev","state","sidebarWidthValue","contextValue","useMemo","jsx","cn","SidebarRoot","forwardRef","props","ref","DialogBase.Root","jsxs","DialogBase.Portal","DialogBase.Backdrop","DialogBase.Popup","collapsedWidth","expandedWidth","TooltipProvider","SidebarHeader","SidebarContent","SidebarFooter","SidebarGroupCollapsibleContext","SidebarGroup","onOpenChange","internalOpen","setInternalOpen","isOpen","handleOpenChange","newOpen","content","CollapsibleBase.Root","SidebarGroupLabel","isCollapsible","CollapsibleBase.Trigger","CaretRightIcon","SidebarGroupContent","MenuItemContext","MenuSubItemContext","SidebarMenu","SidebarMenuItem","SidebarMenuButton","IconProp","active","size","href","tooltip","LinkComponent","useLinkComponent","isInsideMenuItem","iconNode","React","Fragment","buttonClasses","button","Tooltip","SidebarMenuAction","SidebarMenuBadge","SidebarMenuSub","SidebarMenuSubItem","SidebarMenuSubButton","isInsideMenuSubItem","SidebarSeparator","SidebarInput","placeholder","shortcut","MagnifyingGlassIcon","SidebarTrigger","onClick","e","SidebarSimpleIcon","SidebarRail","SidebarResizeHandle","startX","useRef","startWidth","wasCollapsed","handlePointerDown","sidebar","cleanup","handlePointerMove","handlePointerUp","moveEvent","delta","rawWidth","SidebarMenuChevron","SidebarCollapsible","SidebarCollapsibleTrigger","SidebarCollapsibleContent","keepMounted","CollapsibleBase.Panel","Sidebar"],"mappings":"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"}

package/dist/chunks/{surface-blo81kgy9g0sexgm.js → surface-cilvbyhmyujz1bee.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import { forwardRef as t, createElement as m } from "react";
 import { c as d } from "./cn-ct4n7r74mh8y0f48.js";
-import { b3 as l, b4 as f } from "./vendor-base-ui-n30qblevnpk9cc5c.js";
+import { b6 as l, b7 as f } from "./vendor-base-ui-k7bzesq81ie36nya.js";
 const u = {
   color: {
     primary: {
@@ -33,4 +33,4 @@ p.displayName = "Surface";
 export {
   p as S
 };
-//# sourceMappingURL=surface-blo81kgy9g0sexgm.js.map
+//# sourceMappingURL=surface-cilvbyhmyujz1bee.js.map

package/dist/chunks/{surface-blo81kgy9g0sexgm.js.map → surface-cilvbyhmyujz1bee.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"surface-~~blo81kgy9g0sexgm~~.js","sources":["../../src/components/surface/surface.tsx"],"sourcesContent":["import { createElement, forwardRef, type ElementType } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\n\n/** Surface color variant definitions. /\nexport const KUMO_SURFACE_VARIANTS = {\n color: {\n primary: {\n classes: \"\",\n description: \"Primary surface color\",\n },\n secondary: {\n classes: \"\",\n description: \"Secondary surface color\",\n },\n },\n} as const;\n\nexport const KUMO_SURFACE_DEFAULT_VARIANTS = {\n color: \"primary\",\n} as const;\n\n// Derived types from KUMO_SURFACE_VARIANTS\nexport type KumoSurfaceColor = keyof typeof KUMO_SURFACE_VARIANTS.color;\n\nexport interface KumoSurfaceVariantsProps {\n /\n Surface color variant.\n * - `\"primary\"` — Primary surface color\n * - `\"secondary\"` — Secondary surface color\n * @default \"primary\"\n /\n color?: KumoSurfaceColor;\n}\n\nexport function surfaceVariants({\n color = KUMO_SURFACE_DEFAULT_VARIANTS.color,\n}: KumoSurfaceVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-xs ring ring-kumo-line\",\n // Apply color-specific styles\n KUMO_SURFACE_VARIANTS.color[color].classes,\n );\n}\n\n/\n Surface component props.\n \n @example\n * ```tsx\n * <Surface className=\"rounded-lg p-4\">Card content</Surface>\n * <Surface render={<section />} className=\"rounded-lg p-6\">Section content</Surface>\n * ```\n /\nexport type SurfaceProps = useRender.ComponentProps<\"div\"> &\n KumoSurfaceVariantsProps & {\n /\n @deprecated Use the `render` prop instead.\n * @example `<Surface render={<section />}>` instead of `<Surface as=\"section\">`\n /\n as?: ElementType;\n };\n\n/\n Polymorphic container with consistent background, shadow, and border styling.\n \n Use the `render` prop to change the underlying element:\n * ```tsx\n * <Surface render={<section />} className=\"rounded-lg p-4\">Card content</Surface>\n * ```\n \n @example\n * ```tsx\n * <Surface className=\"rounded-lg p-4\">Card content</Surface>\n * ```\n */\nexport const Surface = forwardRef<HTMLDivElement, SurfaceProps>(\n function Surface(\n { color = \"primary\", className, render, as: asProp, ...props },\n ref,\n ) {\n const defaultProps: useRender.ElementProps<\"div\"> = {\n className: cn(\n \"bg-kumo-base shadow-xs ring ring-kumo-line\",\n KUMO_SURFACE_VARIANTS.color[color].classes,\n ),\n };\n\n // Support deprecated `as` prop by converting to a render element.\n const resolvedRender =\n render ?? (asProp ? createElement(asProp) : undefined);\n\n return useRender({\n defaultTagName: \"div\",\n render: resolvedRender,\n ref,\n props: mergeProps<\"div\">(defaultProps, props, { className }),\n });\n },\n);\n\nSurface.displayName = \"Surface\";\n"],"names":["KUMO_SURFACE_VARIANTS","Surface","forwardRef","color","className","render","asProp","props","ref","defaultProps","cn","resolvedRender","createElement","useRender","mergeProps"],"mappings":";;;;AAMO,MAAMA,IAAwB;AAAA,EACnC,OAAO;AAAA,IACL,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,WAAW;AAAA,MACT,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GA6DaC,IAAUC;AAAA,EACrB,SACE,EAAE,OAAAC,IAAQ,WAAW,WAAAC,GAAW,QAAAC,GAAQ,IAAIC,GAAQ,GAAGC,EAAA,GACvDC,GACA;AACA,UAAMC,IAA8C;AAAA,MAClD,WAAWC;AAAA,QACT;AAAA,QACAV,EAAsB,MAAMG,CAAK,EAAE;AAAA,MAAA;AAAA,IACrC,GAIIQ,IACJN,MAAWC,IAASM,EAAcN,CAAM,IAAI;AAE9C,WAAOO,EAAU;AAAA,MACf,gBAAgB;AAAA,MAChB,QAAQF;AAAA,MACR,KAAAH;AAAA,MACA,OAAOM,EAAkBL,GAAcF,GAAO,EAAE,WAAAH,GAAW;AAAA,IAAA,CAC5D;AAAA,EACH;AACF;AAEAH,EAAQ,cAAc;"}
1	+ {"version":3,"file":"surface-cilvbyhmyujz1bee.js","sources":["../../src/components/surface/surface.tsx"],"sourcesContent":["import { createElement, forwardRef, type ElementType } from \"react\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { mergeProps } from \"@base-ui/react/merge-props\";\nimport { cn } from \"../../utils/cn\";\n\n/** Surface color variant definitions. /\nexport const KUMO_SURFACE_VARIANTS = {\n color: {\n primary: {\n classes: \"\",\n description: \"Primary surface color\",\n },\n secondary: {\n classes: \"\",\n description: \"Secondary surface color\",\n },\n },\n} as const;\n\nexport const KUMO_SURFACE_DEFAULT_VARIANTS = {\n color: \"primary\",\n} as const;\n\n// Derived types from KUMO_SURFACE_VARIANTS\nexport type KumoSurfaceColor = keyof typeof KUMO_SURFACE_VARIANTS.color;\n\nexport interface KumoSurfaceVariantsProps {\n /\n Surface color variant.\n * - `\"primary\"` — Primary surface color\n * - `\"secondary\"` — Secondary surface color\n * @default \"primary\"\n /\n color?: KumoSurfaceColor;\n}\n\nexport function surfaceVariants({\n color = KUMO_SURFACE_DEFAULT_VARIANTS.color,\n}: KumoSurfaceVariantsProps = {}) {\n return cn(\n // Base styles\n \"shadow-xs ring ring-kumo-line\",\n // Apply color-specific styles\n KUMO_SURFACE_VARIANTS.color[color].classes,\n );\n}\n\n/\n Surface component props.\n \n @example\n * ```tsx\n * <Surface className=\"rounded-lg p-4\">Card content</Surface>\n * <Surface render={<section />} className=\"rounded-lg p-6\">Section content</Surface>\n * ```\n /\nexport type SurfaceProps = useRender.ComponentProps<\"div\"> &\n KumoSurfaceVariantsProps & {\n /\n @deprecated Use the `render` prop instead.\n * @example `<Surface render={<section />}>` instead of `<Surface as=\"section\">`\n /\n as?: ElementType;\n };\n\n/\n Polymorphic container with consistent background, shadow, and border styling.\n \n Use the `render` prop to change the underlying element:\n * ```tsx\n * <Surface render={<section />} className=\"rounded-lg p-4\">Card content</Surface>\n * ```\n \n @example\n * ```tsx\n * <Surface className=\"rounded-lg p-4\">Card content</Surface>\n * ```\n */\nexport const Surface = forwardRef<HTMLDivElement, SurfaceProps>(\n function Surface(\n { color = \"primary\", className, render, as: asProp, ...props },\n ref,\n ) {\n const defaultProps: useRender.ElementProps<\"div\"> = {\n className: cn(\n \"bg-kumo-base shadow-xs ring ring-kumo-line\",\n KUMO_SURFACE_VARIANTS.color[color].classes,\n ),\n };\n\n // Support deprecated `as` prop by converting to a render element.\n const resolvedRender =\n render ?? (asProp ? createElement(asProp) : undefined);\n\n return useRender({\n defaultTagName: \"div\",\n render: resolvedRender,\n ref,\n props: mergeProps<\"div\">(defaultProps, props, { className }),\n });\n },\n);\n\nSurface.displayName = \"Surface\";\n"],"names":["KUMO_SURFACE_VARIANTS","Surface","forwardRef","color","className","render","asProp","props","ref","defaultProps","cn","resolvedRender","createElement","useRender","mergeProps"],"mappings":";;;;AAMO,MAAMA,IAAwB;AAAA,EACnC,OAAO;AAAA,IACL,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,WAAW;AAAA,MACT,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GA6DaC,IAAUC;AAAA,EACrB,SACE,EAAE,OAAAC,IAAQ,WAAW,WAAAC,GAAW,QAAAC,GAAQ,IAAIC,GAAQ,GAAGC,EAAA,GACvDC,GACA;AACA,UAAMC,IAA8C;AAAA,MAClD,WAAWC;AAAA,QACT;AAAA,QACAV,EAAsB,MAAMG,CAAK,EAAE;AAAA,MAAA;AAAA,IACrC,GAIIQ,IACJN,MAAWC,IAASM,EAAcN,CAAM,IAAI;AAE9C,WAAOO,EAAU;AAAA,MACf,gBAAgB;AAAA,MAChB,QAAQF;AAAA,MACR,KAAAH;AAAA,MACA,OAAOM,EAAkBL,GAAcF,GAAO,EAAE,WAAAH,GAAW;AAAA,IAAA,CAC5D;AAAA,EACH;AACF;AAEAH,EAAQ,cAAc;"}

package/dist/chunks/{switch-i0zwcp3wq6vsxm1c.js → switch-ihaydbzem62bey4p.js} RENAMED Viewed

@@ -1,10 +1,10 @@
 "use client";
-import { jsx as e, jsxs as I } from "react/jsx-runtime";
-import { forwardRef as P, createContext as K, useContext as M } from "react";
-import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
-import { F as O } from "./field-fq504lyu7ttsh5m9.js";
-import { P as H, Q as V, b5 as z } from "./vendor-base-ui-n30qblevnpk9cc5c.js";
-const $ = {
+import { jsx as e, jsxs as P } from "react/jsx-runtime";
+import { forwardRef as z, createContext as M, useContext as O } from "react";
+import { c as l } from "./cn-ct4n7r74mh8y0f48.js";
+import { F as H } from "./field-krp6z6vfbkrvufz2.js";
+import { P as V, Q as W, b8 as A } from "./vendor-base-ui-k7bzesq81ie36nya.js";
+const ee = {
   size: {
     sm: {
       classes: "h-5.5 w-8.5",
@@ -29,213 +29,215 @@ const $ = {
       description: "Monochrome switch with squircle shape for subtle toggles"
     }
   }
-}, ee = {
+}, re = {
   size: "base",
   variant: "default"
-}, A = K({
+}, T = M({
   controlFirst: !0
-}), T = P(
+}), j = z(
   ({
-    className: n,
-    checked: c,
+    className: i,
+    checked: n,
     disabled: a,
     size: o = "base",
-    variant: u = "default",
-    label: s,
-    labelTooltip: d,
+    variant: c = "default",
+    label: t,
+    labelTooltip: u,
     required: f,
     controlFirst: w = !0,
     onCheckedChange: x,
     transitioning: N,
-    ...r
+    id: r,
+    ...d
   }, v) => {
-    const _ = typeof s == "string" ? s : "Switch", b = /* @__PURE__ */ e(
-      z,
+    const _ = typeof t == "string" ? t : "Switch", S = /* @__PURE__ */ e(
+      A,
       {
         ref: v,
-        checked: c,
+        id: r,
+        checked: n,
         disabled: a,
         onCheckedChange: x,
         nativeButton: !0,
-        render: (R, t) => {
+        render: (R, s) => {
           const {
-            ref: S,
-            className: m,
-            role: h,
-            "aria-checked": L,
-            "aria-pressed": k,
+            ref: m,
+            className: h,
+            role: q,
+            "aria-checked": k,
+            "aria-pressed": F,
             ...y
-          } = R, g = u === "neutral", p = "rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]", l = {
+          } = R, g = c === "neutral", p = "rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]", b = {
             sm: { track: "h-4 w-8", thumb: "w-4", slide: "left-4" },
             base: { track: "h-4.5 w-9", thumb: "w-4.5", slide: "left-4.5" },
             lg: { track: "h-5 w-10", thumb: "w-5", slide: "left-5" }
-          }[o], C = g ? t.checked ? "bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700" : "bg-neutral-150 dark:bg-kumo-base ring-kumo-line" : t.checked ? "bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500" : "bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600", U = g ? t.checked ? "bg-kumo-base dark:bg-neutral-400" : "bg-kumo-base dark:bg-neutral-850" : t.checked ? "bg-kumo-base dark:bg-blue-300" : "bg-kumo-base dark:bg-neutral-850", B = i(
+          }[o], U = g ? s.checked ? "bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700" : "bg-neutral-150 dark:bg-kumo-base ring-kumo-line" : s.checked ? "bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500" : "bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600", B = g ? s.checked ? "bg-kumo-base dark:bg-neutral-400" : "bg-kumo-base dark:bg-neutral-850" : s.checked ? "bg-kumo-base dark:bg-blue-300" : "bg-kumo-base dark:bg-neutral-850", D = l(
             "relative inline-flex items-center ring cursor-pointer border-none p-0",
             "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500",
             "transition-colors duration-150 ease-out motion-reduce:transition-none",
             "disabled:cursor-not-allowed disabled:opacity-50",
-            l.track,
+            b.track,
             p,
-            C,
-            n,
-            m
-          ), D = i(
+            U,
+            i,
+            h
+          ), G = l(
             "absolute top-0 bottom-0 shadow-[0_0_1px_0.5px_var(--color-kumo-shadow-edge),0_1px_2px_var(--color-kumo-shadow-drop)]",
-            l.thumb,
+            b.thumb,
             p,
-            U,
+            B,
             "transition-all duration-150 ease-out motion-reduce:transition-none",
-            t.checked ? l.slide : "left-0"
-          ), F = r.role ?? h ?? "switch", G = F === "switch" ? { "aria-checked": t.checked } : { "aria-pressed": t.checked };
+            s.checked ? b.slide : "left-0"
+          ), I = d.role ?? q ?? "switch", K = I === "switch" ? { "aria-checked": s.checked } : { "aria-pressed": s.checked };
           return /* @__PURE__ */ e(
             "button",
             {
               ...y,
-              ...r,
-              ref: S,
+              ...d,
+              ref: m,
               type: "button",
-              role: F,
-              ...G,
+              role: I,
+              ...K,
               "aria-busy": N || void 0,
-              "aria-label": r["aria-label"] ?? _,
-              className: B,
-              children: /* @__PURE__ */ e("div", { className: D })
+              "aria-label": d["aria-label"] ?? _,
+              className: D,
+              children: /* @__PURE__ */ e("div", { className: G })
             }
           );
         }
       }
     );
-    return s ? /* @__PURE__ */ e(
-      O,
+    return t ? /* @__PURE__ */ e(
+      H,
       {
-        label: s,
+        label: t,
         required: f,
-        labelTooltip: d,
+        labelTooltip: u,
         controlFirst: w,
-        children: b
+        children: S
       }
-    ) : b;
+    ) : S;
   }
 );
-T.displayName = "Switch";
-const j = P(
+j.displayName = "Switch";
+const L = z(
   ({
-    className: n,
-    checked: c,
+    className: i,
+    checked: n,
     disabled: a,
     size: o = "base",
-    variant: u = "default",
-    label: s,
-    onCheckedChange: d,
+    variant: c = "default",
+    label: t,
+    onCheckedChange: u,
     transitioning: f
   }, w) => {
-    const { controlFirst: x } = M(A);
-    return /* @__PURE__ */ I(
+    const { controlFirst: x } = O(T);
+    return /* @__PURE__ */ P(
       "label",
       {
-        className: i(
+        className: l(
           "m-0 relative inline-flex items-center gap-2",
           // Control first (default): switch before label
           // Label first: label before switch using flex-row-reverse
           !x && "flex-row-reverse justify-end",
           a ? "cursor-not-allowed opacity-50" : "cursor-pointer",
-          n
+          i
         ),
         children: [
           /* @__PURE__ */ e(
-            z,
+            A,
             {
               ref: w,
-              checked: c,
+              checked: n,
               disabled: a,
-              onCheckedChange: d,
+              onCheckedChange: u,
               nativeButton: !0,
               render: (N, r) => {
                 const {
-                  ref: v,
-                  className: _,
-                  role: b,
-                  "aria-checked": R,
-                  "aria-pressed": t,
-                  ...S
-                } = N, m = u === "neutral", h = "rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]", k = {
+                  ref: d,
+                  className: v,
+                  role: _,
+                  "aria-checked": S,
+                  "aria-pressed": R,
+                  ...s
+                } = N, m = c === "neutral", h = "rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]", k = {
                   sm: { track: "h-4 w-8", thumb: "w-4", slide: "left-4" },
                   base: { track: "h-4.5 w-9", thumb: "w-4.5", slide: "left-4.5" },
                   lg: { track: "h-5 w-10", thumb: "w-5", slide: "left-5" }
-                }[o], y = m ? r.checked ? "bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700" : "bg-neutral-150 dark:bg-kumo-base ring-kumo-line" : r.checked ? "bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500" : "bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600", g = m ? r.checked ? "bg-kumo-base dark:bg-neutral-400" : "bg-kumo-base dark:bg-neutral-850" : r.checked ? "bg-kumo-base dark:bg-blue-300" : "bg-kumo-base dark:bg-neutral-850", p = i(
+                }[o], F = m ? r.checked ? "bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700" : "bg-neutral-150 dark:bg-kumo-base ring-kumo-line" : r.checked ? "bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500" : "bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600", y = m ? r.checked ? "bg-kumo-base dark:bg-neutral-400" : "bg-kumo-base dark:bg-neutral-850" : r.checked ? "bg-kumo-base dark:bg-blue-300" : "bg-kumo-base dark:bg-neutral-850", g = l(
                   "relative inline-flex items-center ring cursor-pointer border-none p-0",
                   "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500",
                   "transition-colors duration-150 ease-out motion-reduce:transition-none",
                   "disabled:cursor-not-allowed disabled:opacity-50",
                   k.track,
                   h,
-                  y,
-                  _
-                ), q = i(
+                  F,
+                  v
+                ), p = l(
                   "absolute top-0 bottom-0 shadow-[0_0_1px_0.5px_var(--color-kumo-shadow-edge),0_1px_2px_var(--color-kumo-shadow-drop)]",
                   k.thumb,
                   h,
-                  g,
+                  y,
                   "transition-all duration-150 ease-out motion-reduce:transition-none",
                   r.checked ? k.slide : "left-0"
-                ), l = b ?? "switch", C = l === "switch" ? { "aria-checked": r.checked } : { "aria-pressed": r.checked };
+                ), C = _ ?? "switch", b = C === "switch" ? { "aria-checked": r.checked } : { "aria-pressed": r.checked };
                 return /* @__PURE__ */ e(
                   "button",
                   {
-                    ...S,
-                    ref: v,
+                    ...s,
+                    ref: d,
                     type: "button",
-                    role: l,
-                    ...C,
+                    role: C,
+                    ...b,
                     "aria-busy": f || void 0,
-                    className: p,
-                    children: /* @__PURE__ */ e("div", { className: q })
+                    className: g,
+                    children: /* @__PURE__ */ e("div", { className: p })
                   }
                 );
               }
             }
           ),
-          /* @__PURE__ */ e("span", { className: "text-base font-medium text-kumo-default", children: s })
+          /* @__PURE__ */ e("span", { className: "text-base font-medium text-kumo-default", children: t })
         ]
       }
     );
   }
 );
-j.displayName = "Switch.Item";
-function W({
-  legend: n,
-  children: c,
+L.displayName = "Switch.Item";
+function E({
+  legend: i,
+  children: n,
   error: a,
   description: o,
-  disabled: u,
-  controlFirst: s = !0,
-  className: d
+  disabled: c,
+  controlFirst: t = !0,
+  className: u
 }) {
-  return /* @__PURE__ */ e(A.Provider, { value: { controlFirst: s }, children: /* @__PURE__ */ I(
-    H,
+  return /* @__PURE__ */ e(T.Provider, { value: { controlFirst: t }, children: /* @__PURE__ */ P(
+    V,
     {
-      className: i(
+      className: l(
         "flex flex-col gap-4 rounded-lg border border-kumo-line p-4",
-        d
+        u
       ),
-      disabled: u,
+      disabled: c,
       children: [
-        /* @__PURE__ */ e(V, { className: "text-lg font-medium text-kumo-default", children: n }),
-        /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: c }),
+        /* @__PURE__ */ e(W, { className: "text-lg font-medium text-kumo-default", children: i }),
+        /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: n }),
         a && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-danger", children: a }),
         o && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-subtle", children: o })
       ]
     }
   ) });
 }
-const E = Object.assign(T, {
-  Item: j,
-  Group: W
+const Q = Object.assign(j, {
+  Item: L,
+  Group: E
 });
-E.displayName = "Switch";
+Q.displayName = "Switch";
 export {
-  $ as K,
-  E as S,
-  ee as a
+  ee as K,
+  Q as S,
+  re as a
 };
-//# sourceMappingURL=switch-i0zwcp3wq6vsxm1c.js.map
+//# sourceMappingURL=switch-ihaydbzem62bey4p.js.map