@cloudflare/kumo 1.19.0 → 2.0.0

package/dist/chunks/sidebar-ltbfius1eolkl8tb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sidebar-ltbfius1eolkl8tb.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-hairline\"\n                : \"border-l border-kumo-hairline\"),\n            variant === \"floating\" &&\n              \"m-2 rounded-lg border border-kumo-hairline 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-hairline\"\n              : \"border-l border-kumo-hairline\"),\n          variant === \"floating\" &&\n            \"m-2 rounded-lg border border-kumo-hairline 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-hairline 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-hairline 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 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 render prop so Tooltip merges onto the button/link\n    // instead of wrapping it in another <button> (which would cause invalid nesting).\n    if (state === \"collapsed\" && tooltip) {\n      button = <Tooltip content={tooltip} side=\"right\" render={button} />;\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-hairline\",\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-hairline 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 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-hairline\", 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-hairline\",\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 { side, resizable, setIsResizing, setWidth, setOpen, open, 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, measured height retained until `data-ending-style` (h=0) — transition down\n * - **Closed**: `data-closed` while hidden/mounted; no extra height override needed\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: keep the measured height that Base UI writes to --collapsible-panel-height.\n      // This must also remain true during the initial close frame so the exit transition has\n      // a real starting height before data-ending-style flips it to 0.\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      // Only force height 0 during the active enter/exit transition phases.\n      // Applying h-0 for data-closed snaps the panel shut before Base UI adds\n      // data-ending-style, skipping the collapse animation.\n      \"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":";;;;;;;;AA8BO,MAAMA,KAAwB;AAAA,EACnC,SAAS;AAAA,IACP,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,UAAU;AAAA,MACR,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,aAAa;AAAA,IACX,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,WAAW;AAAA,MACT,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,MAAM;AAAA,IACJ,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ,GAEaC,IAAgC;AAAA,EAC3C,SAAS;AAAA,EACT,aAAa;AAAA,EACb,MAAM;AACR,GAEaC,KAAuB;AAAA,EAClC,OAAO;AAAA,IACL,UAAU;AAAA,IACV,MAAM;AAAA,EAAA;AAAA,EAER,QAAQ;AAAA,IACN,YAAY;AAAA,EAAA;AAEhB,GAUMC,IAAgB,SAChBC,KAAqB,QACrBC,KAAoB;AAM1B,SAASC,KAAc;AACrB,QAAM,CAACC,GAAUC,CAAW,IAAIC,EAAS,EAAK;AAE9C,SAAAC,GAAU,MAAM;AACd,UAAMC,IAAM,OAAO,WAAW,eAAeN,KAAoB,CAAC,KAAK,GACjEO,IAAW,MAAMJ,EAAYG,EAAI,OAAO;AAC9C,WAAAA,EAAI,iBAAiB,UAAUC,CAAQ,GACvCJ,EAAYG,EAAI,OAAO,GAChB,MAAMA,EAAI,oBAAoB,UAAUC,CAAQ;AAAA,EACzD,GAAG,CAAA,CAAE,GAEEL;AACT;AA0BA,MAAMM,IAAiBC,EAA0C,IAAI;AAY9D,SAASC,IAAa;AAC3B,QAAMC,IAAUC,EAAWJ,CAAc;AACzC,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,mDAAmD;AAErE,SAAOA;AACT;AAgDA,MAAME,KAAmB,KACnBC,KAAe,KACfC,KAAe;AAErB,SAASC,EAAgB;AAAA,EACvB,aAAAC,IAAc;AAAA,EACd,MAAMC;AAAA,EACN,cAAcC;AAAA,EACd,SAAAC,IAAUxB,EAA8B;AAAA,EACxC,MAAAyB,IAAOzB,EAA8B;AAAA,EACrC,aAAA0B,IAAc1B,EAA8B;AAAA,EAC5C,WAAA2B,IAAY;AAAA,EACZ,cAAAC,IAAeX;AAAA,EACf,UAAAY,IAAWX;AAAA,EACX,UAAAY,IAAWX;AAAA,EACX,eAAAY;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AACF,GAAyB;AACvB,QAAM5B,IAAWD,GAAA,GACX,CAAC8B,GAAYC,CAAa,IAAI5B,EAAS,EAAK,GAC5C,CAAC6B,GAAOC,CAAa,IAAI9B,EAASoB,CAAY,GAC9C,CAACW,GAAYC,CAAa,IAAIhC,EAAS,EAAK,GAE5CiC,IAAWC;AAAA,IACf,CAACC,MAAqB;AACpB,YAAMC,IAAU,KAAK,IAAId,GAAU,KAAK,IAAID,GAAUc,CAAQ,CAAC;AAC/D,MAAAL,EAAcM,CAAO,GACrBb,IAAgBa,CAAO;AAAA,IACzB;AAAA,IACA,CAACf,GAAUC,GAAUC,CAAa;AAAA,EAAA,GAG9B,CAACc,GAAOC,EAAQ,IAAItC,EAASa,CAAW,GACxC0B,IAAOzB,KAAYuB,GACnBG,IAAUN;AAAA,IACd,CAACO,MAAkD;AACjD,YAAMC,IAAO,OAAOD,KAAU,aAAaA,EAAMF,CAAI,IAAIE;AACzD,MAAA1B,IAAc2B,CAAI,GAClBJ,GAASI,CAAI;AAAA,IACf;AAAA,IACA,CAAC3B,GAAawB,CAAI;AAAA,EAAA,GAGdI,IAAgBT,EAAY,MAAM;AACtC,IAAIpC,IACF8B,EAAc,CAACgB,MAAS,CAACA,CAAI,IAE7BJ,EAAQ,CAACI,MAAkB,CAACA,CAAI;AAAA,EAEpC,GAAG,CAAC9C,GAAU0C,CAAO,CAAC,GAEhBK,IAAQN,IAAO,aAAa,aAE5BO,KAAoB3B,IAAY,GAAGU,CAAK,OAAOnC,GAE/CqD,KAAeC;AAAA,IACnB,OAAO;AAAA,MACL,OAAAH;AAAA,MACA,MAAAN;AAAA,MACA,SAAAC;AAAA,MACA,YAAAb;AAAA,MACA,eAAAC;AAAA,MACA,UAAA9B;AAAA,MACA,eAAA6C;AAAA,MACA,SAAA3B;AAAA,MACA,MAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OAAAW;AAAA,MACA,WAAAV;AAAA,MACA,UAAAE;AAAA,MACA,UAAAC;AAAA,MACA,YAAAS;AAAA,MACA,eAAAC;AAAA,MACA,UAAAC;AAAA,IAAA;AAAA,IAEF;AAAA,MACEY;AAAA,MACAN;AAAA,MACAC;AAAA,MACAb;AAAA,MACAC;AAAA,MACA9B;AAAA,MACA6C;AAAA,MACA3B;AAAA,MACAC;AAAA,MACAC;AAAA,MACAW;AAAA,MACAV;AAAA,MACAE;AAAA,MACAC;AAAA,MACAS;AAAA,MACAC;AAAA,MACAC;AAAA,IAAA;AAAA,EACF;AAGF,SACE,gBAAAgB,EAAC7C,EAAe,UAAf,EAAwB,OAAO2C,IAC9B,UAAA,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,wBAAqB;AAAA,MACrB,cAAYJ;AAAA,MACZ,aAAW5B;AAAA,MACX,OACE;AAAA,QACE,mBAAmB6B;AAAA,QACnB,wBAAwBnD;AAAA,QACxB,GAAG+B;AAAA,MAAA;AAAA,MAGP,WAAWwB;AAAA,QACT;AAAA,QACA;AAAA,QACAnB,KAAc;AAAA,QACdN;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;AAEAZ,EAAgB,cAAc;AA4B9B,MAAMuC,IAAcC;AAAA,EAClB,CAAC,EAAE,WAAA3B,GAAW,UAAAD,GAAU,GAAG6B,EAAA,GAASC,MAAQ;AAC1C,UAAM;AAAA,MACJ,OAAAT;AAAA,MACA,UAAA/C;AAAA,MACA,YAAA6B;AAAA,MACA,eAAAC;AAAA,MACA,MAAAX;AAAA,MACA,SAAAD;AAAA,MACA,aAAAE;AAAA,MACA,YAAAa;AAAA,MACA,WAAAZ;AAAA,MACA,OAAAU;AAAA,IAAA,IACEvB,EAAA;AAEJ,QAAIY,MAAgB;AAClB,aACE,gBAAA+B;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAAK;AAAA,UACA,cAAW;AAAA,UACX,aAAWrC;AAAA,UACX,gBAAcD;AAAA,UACd,gBAAa;AAAA,UACb,OAAO;AAAA,YACL,OAAO;AAAA,YACP,UAAU;AAAA,YACV,UAAU;AAAA,UAAA;AAAA,UAEZ,WAAWkC;AAAA,YACT;AAAA,YACAlC,MAAY,cACTC,MAAS,SACN,kCACA;AAAA,YACND,MAAY,cACV;AAAA,YACFS;AAAA,UAAA;AAAA,UAED,GAAG4B;AAAA,UAEH,UAAA7B;AAAA,QAAA;AAAA,MAAA;AAKP,QAAI1B;AACF,aACE,gBAAAmD,EAACM,IAAA,EAAgB,MAAM5B,GAAY,cAAcC,GAC/C,UAAA,gBAAA4B,EAACC,IAAA,EACC,UAAA;AAAA,QAAA,gBAAAR,EAACS,IAAA,EAAoB,WAAU,+HAAA,CAA+H;AAAA,QAC9J,gBAAAT;AAAA,UAACU;AAAAA,UAAA;AAAA,YACC,WAAWT;AAAA,cACT;AAAA,cACA;AAAA,cACAjC,MAAS,UACP;AAAA,cACFA,MAAS,WACP;AAAA,YAAA;AAAA,YAEJ,OACE;AAAA,cACE,mBAAmBvB;AAAA,cACnB,oBAAoB;AAAA,cACpB,0BACE;AAAA,YAAA;AAAA,YAIN,UAAA,gBAAAuD;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,gBAAa;AAAA,gBACb,eAAY;AAAA,gBACZ,WAAWC;AAAA,kBACT;AAAA,kBACAzB;AAAA,gBAAA;AAAA,gBAGD,UAAAD;AAAA,cAAA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,MACF,EAAA,CACF,EAAA,CACF;AAKJ,UAAMoC,IACJ1C,MAAgB,SAAS,8BAA8B,OACnD2C,IAAgB1C,IAAY,GAAGU,CAAK,OAAO;AAGjD,WACE,gBAAAoB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAK;AAAA,QACA,cAAYT;AAAA,QACZ,aAAW5B;AAAA,QACX,gBAAcD;AAAA,QACd,oBAAkBE;AAAA,QAClB,gBAAa;AAAA,QACb,OAAO,EAAE,OAVO2B,MAAU,aAAagB,IAAgBD,EAUvC;AAAA,QAChB,WAAWV;AAAA,UACT;AAAA;AAAA;AAAA,UAGA;AAAA,UACA;AAAA;AAAA,UAEA;AAAA,UACA;AAAA;AAAA,UAEAnB,KAAc;AAAA,UACdf,MAAY,cACTC,MAAS,SACN,kCACA;AAAA,UACND,MAAY,cACV;AAAA,UACFS;AAAA,QAAA;AAAA,QAED,GAAG4B;AAAA,QAIJ,UAAA,gBAAAJ,EAACa,MAAiB,UAAAtC,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjC;AACF;AAEA2B,EAAY,cAAc;AAkB1B,MAAMY,IAAgBX,EAGpB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAEDU,EAAc,cAAc;AAgB5B,MAAMC,IAAiBZ,EAGrB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAEDW,EAAe,cAAc;AAiB7B,MAAMC,IAAgBb,EAGpB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA;AAAA,MAEA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAEDY,EAAc,cAAc;AAW5B,MAAMC,IACJ7D,EAAmD;AAAA,EACjD,eAAe;AAAA,EACf,QAAQ;AACV,CAAC,GAoCG8D,IAAef;AAAA,EACnB,CACE;AAAA,IACE,WAAA3B;AAAA,IACA,aAAAP,IAAc;AAAA,IACd,aAAAL,IAAc;AAAA,IACd,MAAMC;AAAA,IACN,cAAAsD;AAAA,IACA,UAAA5C;AAAA,IACA,GAAG6B;AAAA,EAAA,GAELC,MACG;AAEH,UAAM,CAACe,GAAcC,CAAe,IAAItE,EAASa,CAAW,GACtD0D,IAASzD,KAAYuD,GAErBG,IAAmBtC;AAAA,MACvB,CAACuC,MAAqB;AACpB,QAAAH,EAAgBG,CAAO,GACvBL,IAAeK,CAAO;AAAA,MACxB;AAAA,MACA,CAACL,CAAY;AAAA,IAAA,GAGTrB,IAAeC;AAAA,MACnB,OAAO,EAAE,eAAe9B,GAAa,QAAAqD;MACrC,CAACrD,GAAaqD,CAAM;AAAA,IAAA,GAGhBG,IACJ,gBAAAzB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAK;AAAA,QACA,gBAAa;AAAA,QACb,WAAWJ;AAAA,UACT;AAAA;AAAA,UAEA;AAAA,UACAzB;AAAA,QAAA;AAAA,QAED,GAAG4B;AAAA,QAEH,UAAA7B;AAAA,MAAA;AAAA,IAAA;AAIL,WAAKN,IASH,gBAAA+B,EAACiB,EAA+B,UAA/B,EAAwC,OAAOnB,GAC9C,UAAA,gBAAAE;AAAA,MAAC0B;AAAAA,MAAA;AAAA,QACC,aAAA9D;AAAA,QACA,MAAMC;AAAA,QACN,cAAc0D;AAAA,QACd,WAAU;AAAA,QAET,UAAAE;AAAA,MAAA;AAAA,IAAA,GAEL,sBAhBGR,EAA+B,UAA/B,EAAwC,OAAOnB,GAC7C,UAAA2B,GACH;AAAA,EAgBN;AACF;AAEAP,EAAa,cAAc;AAkB3B,MAAMS,KAAoBxB,EAGxB,CAAC,EAAE,WAAA3B,GAAW,UAAAD,GAAU,GAAG6B,EAAA,GAASC,MAAQ;AAC5C,QAAM,EAAE,eAAAuB,EAAA,IAAkBrE,EAAW0D,CAA8B;AAEnE,SAAIW,IAEA,gBAAArB;AAAA,IAACsB;AAAAA,IAAA;AAAA,MACC,KAAAxB;AAAA,MACA,gBAAa;AAAA,MACb,WAAWJ;AAAA,QACT;AAAA,QACA;AAAA,QACAzB;AAAA,MAAA;AAAA,MAED,GAAI4B;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAJ,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAzB,EAAA,CAAS;AAAA,QACtD,gBAAAyB;AAAA,UAAC8B;AAAA,UAAA;AAAA,YACC,WAAW7B;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA,IAMJ,gBAAAD;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,gBAAa;AAAA,MACb,WAAWJ;AAAA,QACT;AAAA,QACA;AAAA,QACAzB;AAAA,MAAA;AAAA,MAED,GAAG4B;AAAA,MAEH,UAAA7B;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEDoD,GAAkB,cAAc;AA+BhC,MAAMI,KAAsB5B,EAG1B,CAAC,EAAE,WAAA3B,GAAW,UAAAD,GAAU,GAAG6B,EAAA,GAASC,MAAQ;AAC5C,QAAM,EAAE,eAAAuB,GAAe,QAAAN,MAAW/D,EAAW0D,CAA8B;AAE3E,SAAIW,IAEA,gBAAA5B;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,gBAAa;AAAA,MACb,WAAWJ;AAAA,QACT;AAAA;AAAA,QAEA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA;AAAA,QAEAqB,IACI,wDACA;AAAA,QACJ9C;AAAA,MAAA;AAAA,MAED,GAAG4B;AAAA,MAEJ,UAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAU,mBAAmB,UAAAzB,EAAA,CAAS;AAAA,IAAA;AAAA,EAAA,IAM/C,gBAAAyB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,gBAAa;AAAA,MACb,WAAWJ,EAAG,iBAAiBzB,CAAS;AAAA,MACvC,GAAG4B;AAAA,MAEH,UAAA7B;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEDwD,GAAoB,cAAc;AAUlC,MAAMC,KAAkB5E,EAAc,EAAK,GAMrC6E,KAAqB7E,EAAc,EAAK,GA6BxC8E,KAAc/B,EAGlB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA,MACA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAED8B,GAAY,cAAc;AAsB1B,MAAMC,KAAkBhC,EAGtB,CAAC,EAAE,WAAA3B,GAAW,UAAAD,GAAU,GAAG6B,EAAA,GAASC,MACpC,gBAAAL,EAACgC,GAAgB,UAAhB,EAAyB,OAAO,IAC/B,UAAA,gBAAAhC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ,EAAG,YAAYzB,CAAS;AAAA,IAClC,GAAG4B;AAAA,IAEH,UAAA7B;AAAA,EAAA;AACH,GACF,CACD;AAED4D,GAAgB,cAAc;AAsD9B,MAAMC,KAAoBjC;AAAA,EACxB,CACE;AAAA,IACE,WAAA3B;AAAA,IACA,MAAM6D;AAAA,IACN,QAAAC,IAAS;AAAA,IACT,MAAAC,IAAO;AAAA,IACP,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAlE;AAAA,IACA,GAAG6B;AAAA,EAAA,GAELC,MACG;AACH,UAAM,EAAE,OAAAT,EAAA,IAAUvC,EAAA,GACZqF,IAAgBC,EAAA,GAChBC,IAAmBrF,EAAWyE,EAAe,GAG7Ca,IACCR,IACDS,GAAM,eAAeT,CAAQ,IAAUA,IAGzC,gBAAArC;AAAA,MAFWqC;AAAA,MAEV;AAAA,QACC,WAAWpC,EAAG,YAAYsC,MAAS,SAAS,WAAW,UAAU;AAAA,MAAA;AAAA,IAAA,IAL/C,MAUlBd,IACJ,gBAAAlB,EAAAwC,IAAA,EACG,UAAA;AAAA,MAAAF;AAAA,MACD,gBAAA7C;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWC;AAAA,YACT;AAAA,YACA;AAAA,UAAA;AAAA,UAGD,UAAA1B;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GACF,GAGIyE,IAAgB/C;AAAA;AAAA,MAEpB;AAAA;AAAA,MAEAsC,MAAS,UAAU;AAAA,MACnBA,MAAS,QAAQ;AAAA;AAAA,MAEjB;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA,CAACD,KAAU;AAAA;AAAA,MAEXA,KAAU;AAAA;AAAA,MAEV;AAAA;AAAA,MAEA;AAAA;AAAA;AAAA,MAGA;AAAA,MACA9D;AAAA,IAAA;AAGF,QAAIyE;AA2CJ,WAzCIT,IACFS,IACE,gBAAAjD;AAAA,MAAC0C;AAAA,MAAA;AAAA,QACC,KAAArC;AAAA,QACA,WAAWJ,EAAG+C,GAAe,eAAe;AAAA,QAC5C,MAAAR;AAAA,QACA,IAAIA;AAAA,QACJ,eAAaF,KAAU;AAAA,QACvB,gBAAa;AAAA,QACb,aAAWC;AAAA,QACX,SACEnC,EAAM;AAAA,QAGP,UAAAqB;AAAA,MAAA;AAAA,IAAA,IAILwB,IACE,gBAAAjD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAK;AAAA,QACA,MAAK;AAAA,QACL,WAAW2C;AAAA,QACX,eAAaV,KAAU;AAAA,QACvB,gBAAa;AAAA,QACb,aAAWC;AAAA,QACV,GAAGnC;AAAA,QAEH,UAAAqB;AAAA,MAAA;AAAA,IAAA,GAQH7B,MAAU,eAAe6C,MAC3BQ,sBAAUC,IAAA,EAAQ,SAAST,GAAS,MAAK,SAAQ,QAAQQ,GAAQ,IAI9DL,IAQEK,sBANF,MAAA,EAAG,gBAAa,aAAY,WAAU,YACpC,UAAAA,GACH;AAAA,EAKN;AACF;AAEAb,GAAkB,cAAc;AAWhC,MAAMe,KAAoBhD,EAGxB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,MAAK;AAAA,IACL,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAED+C,GAAkB,cAAc;AAkBhC,MAAMC,KAAmBjD,EAGvB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAEDgD,GAAiB,cAAc;AAoB/B,MAAMC,KAAiBlD,EAGrB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ;AAAA,MACT;AAAA;AAAA,MAEA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAEDiD,GAAe,cAAc;AAY7B,MAAMC,KAAqBnD,EAGzB,CAAC,EAAE,WAAA3B,GAAW,UAAAD,GAAU,GAAG6B,EAAA,GAASC,MACpC,gBAAAL,EAACiC,GAAmB,UAAnB,EAA4B,OAAO,IAClC,UAAA,gBAAAjC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ,EAAG,YAAYzB,CAAS;AAAA,IAClC,GAAG4B;AAAA,IAEH,UAAA7B;AAAA,EAAA;AACH,GACF,CACD;AAED+E,GAAmB,cAAc;AA2BjC,MAAMC,KAAuBpD,EAG3B,CAAC,EAAE,WAAA3B,GAAW,QAAA8D,IAAS,IAAO,MAAAE,GAAM,UAAAjE,GAAU,GAAG6B,EAAA,GAASC,MAAQ;AAClE,QAAMqC,IAAgBC,EAAA,GAChBa,IAAsBjG,EAAW0E,EAAkB,GAEnDe,IAAgB/C;AAAA,IACpB;AAAA,IACA;AAAA,IACA,CAACqC,KAAU;AAAA,IACXA,KAAU;AAAA,IACV;AAAA,IACA9D;AAAA,EAAA,GAGIiD,IAAU,gBAAAzB,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAzB,GAAS;AAEtE,MAAI0E;AAkCJ,SAhCIT,IACFS,IACE,gBAAAjD;AAAA,IAAC0C;AAAA,IAAA;AAAA,MACC,KAAArC;AAAA,MACA,WAAWJ,EAAG+C,GAAe,eAAe;AAAA,MAC5C,MAAAR;AAAA,MACA,IAAIA;AAAA,MACJ,eAAaF,KAAU;AAAA,MACvB,gBAAa;AAAA,MACb,SACElC,EAAM;AAAA,MAGP,UAAAqB;AAAA,IAAA;AAAA,EAAA,IAILwB,IACE,gBAAAjD;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,MAAK;AAAA,MACL,WAAW2C;AAAA,MACX,eAAaV,KAAU;AAAA,MACvB,gBAAa;AAAA,MACZ,GAAGlC;AAAA,MAEH,UAAAqB;AAAA,IAAA;AAAA,EAAA,GAMF+B,IAQEP,sBANF,MAAA,EAAG,gBAAa,iBAAgB,WAAU,YACxC,UAAAA,GACH;AAKN,CAAC;AAEDM,GAAqB,cAAc;AASnC,MAAME,KAAmBtD,EAGvB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAC1B,gBAAAL;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAK;AAAA,IACA,gBAAa;AAAA,IACb,WAAWJ,EAAG,gDAAgDzB,CAAS;AAAA,IACtE,GAAG4B;AAAA,EAAA;AACN,CACD;AAEDqD,GAAiB,cAAc;AAqB/B,MAAMC,KAAevD;AAAA,EACnB,CACE,EAAE,WAAA3B,GAAW,aAAAmF,IAAc,aAAa,UAAAC,GAAU,UAAArF,GAAU,GAAG6B,KAC/DC,MAEA,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,MAAK;AAAA,MACL,gBAAa;AAAA,MACb,WAAWJ;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,QAEA;AAAA,QACAzB;AAAA,MAAA;AAAA,MAED,GAAG4B;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAJ,EAAC6D,IAAA,EAAoB,WAAU,mCAAA,CAAmC;AAAA,QAClE,gBAAA7D,EAAC,QAAA,EAAK,WAAU,yEACb,eAAY2D,GACf;AAAA,QACCC,KACC,gBAAA5D,EAAC,OAAA,EAAI,WAAU,0FACZ,UAAA4D,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;AAEAF,GAAa,cAAc;AAgB3B,MAAMI,KAAiB3D,EAGrB,CAAC,EAAE,WAAA3B,GAAW,UAAAD,GAAU,SAAAwF,GAAS,GAAG3D,EAAA,GAASC,MAAQ;AACrD,QAAM,EAAE,eAAAX,EAAA,IAAkBrC,EAAA;AAE1B,SACE,gBAAA2C;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,MAAK;AAAA,MACL,gBAAa;AAAA,MACb,cAAW;AAAA,MACX,WAAWJ;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACAzB;AAAA,MAAA;AAAA,MAEF,SAAS,CAACwF,MAAM;AACd,QAAAD,IAAUC,CAAC,GACXtE,EAAA;AAAA,MACF;AAAA,MACC,GAAGU;AAAA,MAEH,UAAA7B,KAAY,gBAAAyB,EAACiE,IAAA,EAAkB,WAAU,SAAA,CAAS;AAAA,IAAA;AAAA,EAAA;AAGzD,CAAC;AAEDH,GAAe,cAAc;AAU7B,MAAMI,KAAc/D,EAGlB,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAAQ;AAClC,QAAM,EAAE,eAAAX,EAAA,IAAkBrC,EAAA;AAE1B,SACE,gBAAA2C;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,MAAK;AAAA,MACL,gBAAa;AAAA,MACb,cAAW;AAAA,MACX,UAAU;AAAA,MACV,WAAWJ;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACAzB;AAAA,MAAA;AAAA,MAEF,SAASkB;AAAA,MACR,GAAGU;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;AAED8D,GAAY,cAAc;AAc1B,MAAMC,KAAsBhE,EAG1B,CAAC,EAAE,WAAA3B,GAAW,GAAG4B,EAAA,GAASC,MAAQ;AAClC,QAAM,EAAE,MAAArC,GAAM,WAAAE,GAAW,eAAAa,GAAe,UAAAC,GAAU,SAAAO,GAAS,MAAAD,GAAM,UAAAlB,EAAA,IAC/Df,EAAA,GACI+G,IAASC,EAAO,CAAC,GACjBC,IAAaD,EAAO,CAAC,GACrBE,IAAeF,EAAO,EAAK;AAEjC,MAAI,CAACnG,EAAW,QAAO;AAEvB,QAAMsG,IAAoB,CAACR,MAA0C;AACnE,IAAAA,EAAE,eAAA,GACFjF,EAAc,EAAI,GAClBqF,EAAO,UAAUJ,EAAE,SACnBO,EAAa,UAAU,CAACjF;AAKxB,UAAMmF,IAHWT,EAAE,cAA8B;AAAA,MAC/C;AAAA,IAAA,GAEuB,cAAc,0BAA0B;AACjE,IAAAM,EAAW,UAAUG,GAAS,sBAAA,EAAwB,SAAS;AAE/D,UAAMC,IAAU,MAAM;AACpB,MAAA3F,EAAc,EAAK,GACnB,SAAS,oBAAoB,eAAe4F,CAAiB,GAC7D,SAAS,oBAAoB,aAAaC,CAAe;AAAA,IAC3D,GAEMD,IAAoB,CAACE,MAA4B;AACrD,YAAMC,IACJ9G,MAAS,SACL6G,EAAU,UAAUT,EAAO,UAC3BA,EAAO,UAAUS,EAAU,SAC3BE,IAAWT,EAAW,UAAUQ;AAEtC,UAAIP,EAAa,SAAS;AAExB,QAAIQ,KAAY3G,MACdmG,EAAa,UAAU,IACvBhF,EAAQ,EAAI,GACZP,EAAS+F,CAAQ;AAEnB;AAAA,MACF;AAGA,UAAIA,IAAW3G,GAAU;AACvB,QAAAmB,EAAQ,EAAK,GACbgF,EAAa,UAAU;AACvB;AAAA,MACF;AAEA,MAAAvF,EAAS+F,CAAQ;AAAA,IACnB,GAEMH,IAAkB,MAAM;AAC5B,MAAAF,EAAA;AAAA,IACF;AAEA,aAAS,iBAAiB,eAAeC,CAAiB,GAC1D,SAAS,iBAAiB,aAAaC,CAAe;AAAA,EACxD;AAEA,SACE,gBAAA5E;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAK;AAAA,MACA,gBAAa;AAAA,MACb,WAAWJ;AAAA,QACT;AAAA,QACA;AAAA,QACAjC,MAAS,UAAU;AAAA,QACnBA,MAAS,WAAW;AAAA,QACpBQ;AAAA,MAAA;AAAA,MAEF,eAAegG;AAAA,MACd,GAAGpE;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;AAED+D,GAAoB,cAAc;AAmBlC,SAASa,GAAmB,EAAE,WAAAxG,KAAqC;AACjE,SACE,gBAAAwB;AAAA,IAAC8B;AAAA,IAAA;AAAA,MACC,WAAW7B;AAAA,QACT;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA;AAAA,QACAzB;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAGN;AAEAwG,GAAmB,cAAc;AAUjC,MAAMC,KAAqBvD,GAcrBwD,KAA4BrD,GAc5BsD,KAA4BhF,EAGhC,CAAC,EAAE,WAAA3B,GAAW,aAAA4G,IAAc,IAAM,GAAGhF,KAASC,MAC9C,gBAAAL;AAAA,EAACqF;AAAAA,EAAA;AAAA,IACC,KAAAhF;AAAA,IACA,aAAA+E;AAAA,IACA,WAAWnF;AAAA,MACT;AAAA;AAAA;AAAA;AAAA,MAIA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA;AAAA;AAAA;AAAA,MAIA;AAAA,MACAzB;AAAA,IAAA;AAAA,IAED,GAAG4B;AAAA,EAAA;AACN,CACD;AAED+E,GAA0B,cAAc;AAsCjC,MAAMG,KAAU,OAAO,OAAOpF,GAAa;AAAA,EAChD,UAAUvC;AAAA,EACV,QAAQmD;AAAA,EACR,SAASC;AAAA,EACT,QAAQC;AAAA,EACR,OAAOE;AAAA,EACP,YAAYS;AAAA,EACZ,cAAcI;AAAA,EACd,MAAMG;AAAA,EACN,UAAUC;AAAA,EACV,YAAYC;AAAA,EACZ,YAAYe;AAAA,EACZ,WAAWC;AAAA,EACX,SAASC;AAAA,EACT,aAAaC;AAAA,EACb,eAAeC;AAAA,EACf,WAAWE;AAAA,EACX,OAAOC;AAAA,EACP,SAASI;AAAA,EACT,MAAMI;AAAA,EACN,cAAcC;AAAA,EACd,aAAaa;AAAA,EACb,aAAaC;AAAA,EACb,oBAAoBC;AAAA,EACpB,oBAAoBC;AACtB,CAAC;"}

package/dist/chunks/switch-fbv3iawqo3o3jgap.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"switch-fbv3iawqo3o3jgap.js","sources":["../../src/components/switch/switch.tsx"],"sourcesContent":["import { Switch as BaseSwitch } from \"@base-ui/react/switch\";\nimport {\n  forwardRef,\n  type ButtonHTMLAttributes,\n  type Ref,\n  type ReactNode,\n  createContext,\n  useContext,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Field } from \"../field/field\";\nimport { Fieldset } from \"@base-ui/react/fieldset\";\n\n/** Switch size and variant definitions mapping names to their Tailwind classes. */\nexport const KUMO_SWITCH_VARIANTS = {\n  size: {\n    sm: {\n      classes: \"h-5.5 w-8.5\",\n      description: \"Small switch for compact UIs\",\n    },\n    base: {\n      classes: \"h-6.5 w-10.5\",\n      description: \"Default switch size\",\n    },\n    lg: {\n      classes: \"h-7.5 w-12.5\",\n      description: \"Large switch for prominent toggles\",\n    },\n  },\n  variant: {\n    default: {\n      classes: \"\",\n      description: \"Default switch with squircle shape and brand blue color\",\n    },\n    neutral: {\n      classes: \"\",\n      description: \"Monochrome switch with squircle shape for subtle toggles\",\n    },\n  },\n} as const;\n\nexport const KUMO_SWITCH_DEFAULT_VARIANTS = {\n  size: \"base\",\n  variant: \"default\",\n} as const;\n\n// Derived types from KUMO_SWITCH_VARIANTS\nexport type KumoSwitchSize = keyof typeof KUMO_SWITCH_VARIANTS.size;\nexport type KumoSwitchVariant = keyof typeof KUMO_SWITCH_VARIANTS.variant;\n\nexport interface KumoSwitchVariantsProps {\n  /**\n   * Switch size.\n   * - `\"sm\"` — Small for compact UIs\n   * - `\"base\"` — Default size\n   * - `\"lg\"` — Large for prominent toggles\n   * @default \"base\"\n   */\n  size?: KumoSwitchSize;\n  /**\n   * Visual variant.\n   * - `\"default\"` — Standard switch appearance\n   * - `\"error\"` — Error state for validation failures\n   * @default \"default\"\n   */\n  variant?: KumoSwitchVariant;\n}\n\nexport function switchVariants({\n  size = KUMO_SWITCH_DEFAULT_VARIANTS.size,\n  variant = KUMO_SWITCH_DEFAULT_VARIANTS.variant,\n}: KumoSwitchVariantsProps = {}) {\n  // Fallback to defaults if invalid size/variant passed\n  const sizeConfig =\n    KUMO_SWITCH_VARIANTS.size[size] ?? KUMO_SWITCH_VARIANTS.size.base;\n  const variantConfig =\n    KUMO_SWITCH_VARIANTS.variant[variant] ??\n    KUMO_SWITCH_VARIANTS.variant.default;\n  return cn(sizeConfig.classes, variantConfig.classes);\n}\n\n// Legacy type aliases for backwards compatibility\nexport type SwitchSize = KumoSwitchSize;\nexport type SwitchVariant = KumoSwitchVariant;\n\n// Context for passing controlFirst from Group to Items\nconst SwitchGroupContext = createContext<{ controlFirst: boolean }>({\n  controlFirst: true,\n});\n\n/**\n * Single switch component props (with built-in Field)\n *\n * Usage patterns:\n *\n * Basic usage:\n * ```tsx\n * <Switch label=\"Enable notifications\" checked={true} onCheckedChange={setChecked} />\n * ```\n *\n * Label first layout:\n * ```tsx\n * <Switch label=\"Dark mode\" checked={false} onCheckedChange={setChecked} controlFirst={false} />\n * ```\n *\n * Neutral variant (monochrome, squircle shape):\n * ```tsx\n * <Switch label=\"Setting\" variant=\"neutral\" checked={false} onCheckedChange={setChecked} />\n * ```\n *\n * @property {string} label - Label text for the switch (Field wrapper is built-in)\n * @property {boolean} [controlFirst] - When true (default), switch appears before label\n */\nexport type SwitchProps = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"children\"\n> & {\n  /** Visual variant: \"default\" (pill, brand color) or \"neutral\" (squircle, monochrome) */\n  variant?: SwitchVariant;\n  /** Label content for the switch (Field wrapper is built-in) - can be a string or any React node. Optional when used standalone for visual-only purposes. */\n  label?: ReactNode;\n  /** Tooltip content to display next to the label via an info icon */\n  labelTooltip?: ReactNode;\n  /**\n   * Whether the switch is required.\n   * When explicitly false, shows \"(optional)\" text after the label.\n   */\n  required?: boolean;\n  /** When true (default), switch appears before label. When false, label appears before switch. */\n  controlFirst?: boolean;\n  size?: KumoSwitchSize;\n  checked?: boolean;\n  disabled?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n  transitioning?: boolean;\n};\n\n/**\n * Switch group component props (with built-in Fieldset)\n *\n * Usage:\n * ```tsx\n * <Switch.Group\n *   legend=\"Notification settings\"\n *   error=\"You must enable at least one notification type\"\n * >\n *   <Switch.Item label=\"Email notifications\" value=\"email\" />\n *   <Switch.Item label=\"SMS notifications\" value=\"sms\" />\n * </Switch.Group>\n * ```\n */\nexport interface SwitchGroupProps {\n  /** Legend text for the group */\n  legend: string;\n  /** Child Switch.Item components */\n  children: ReactNode;\n  /** Error message for the group (only appears in groups, not single switches) */\n  error?: string;\n  /** Helper text for the group */\n  description?: ReactNode;\n  /** Whether all switches in the group are disabled */\n  disabled?: boolean;\n  /** When true (default), switch appears before label. When false, label appears before switch. */\n  controlFirst?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n}\n\n/**\n * Individual switch item within a group\n */\nexport type SwitchItemProps = {\n  /** Visual variant: \"default\" or \"error\" for validation failures */\n  variant?: SwitchVariant;\n  /** Label text displayed next to switch */\n  label: string;\n  /** Additional CSS classes for the label wrapper */\n  className?: string;\n  checked?: boolean;\n  disabled?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n  size?: KumoSwitchSize;\n  transitioning?: boolean;\n};\n\n// Single switch with built-in Field\nconst SwitchBase = forwardRef<HTMLButtonElement, SwitchProps>(\n  (\n    {\n      className,\n      checked,\n      disabled,\n      size = \"base\",\n      variant = \"default\",\n      label,\n      labelTooltip,\n      required,\n      controlFirst = true,\n      onCheckedChange,\n      transitioning,\n      id,\n      ...props\n    },\n    ref,\n  ) => {\n    // For aria-label, only use string labels (ReactNode labels can't be used for aria-label)\n    const ariaLabelFallback = typeof label === \"string\" ? label : \"Switch\";\n    const switchControl = (\n      <BaseSwitch.Root\n        ref={ref}\n        id={id}\n        checked={checked}\n        disabled={disabled}\n        onCheckedChange={onCheckedChange}\n        nativeButton\n        render={(rootProps, state) => {\n          const {\n            ref: rootRef,\n            className: baseClassName,\n            role: baseRole,\n            \"aria-checked\": _ariaChecked,\n            \"aria-pressed\": _ariaPressed,\n            ...restRootProps\n          } = rootProps as typeof rootProps & {\n            ref?: Ref<HTMLButtonElement>;\n            className?: string;\n            role?: string;\n            \"aria-checked\"?: boolean;\n            \"aria-pressed\"?: boolean;\n          };\n\n          const isNeutral = variant === \"neutral\";\n\n          // Squircle-aware border-radius (used by both variants)\n          const squircleRadius =\n            \"rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]\";\n\n          // Size styles matching Kyle's stratus implementation\n          const sizeStyles = {\n            sm: { track: \"h-4 w-8\", thumb: \"w-4\", slide: \"left-4\" },\n            base: { track: \"h-4.5 w-9\", thumb: \"w-4.5\", slide: \"left-4.5\" },\n            lg: { track: \"h-5 w-10\", thumb: \"w-5\", slide: \"left-5\" },\n          };\n          const s = sizeStyles[size];\n\n          // Track colors based on variant\n          const trackColors = isNeutral\n            ? state.checked\n              ? \"bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700\"\n              : \"bg-neutral-150 dark:bg-kumo-base ring-kumo-hairline\"\n            : state.checked\n              ? \"bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500\"\n              : \"bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600\";\n\n          // Thumb colors based on variant\n          const thumbColors = isNeutral\n            ? state.checked\n              ? \"bg-kumo-base dark:bg-neutral-400\"\n              : \"bg-kumo-base dark:bg-neutral-850\"\n            : state.checked\n              ? \"bg-kumo-base dark:bg-blue-300\"\n              : \"bg-kumo-base dark:bg-neutral-850\";\n\n          const trackClassName = cn(\n            \"relative inline-flex items-center ring cursor-pointer border-none p-0\",\n            \"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500\",\n            \"transition-colors duration-150 ease-out motion-reduce:transition-none\",\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            s.track,\n            squircleRadius,\n            trackColors,\n            className,\n            baseClassName,\n          );\n\n          const thumbClassName = cn(\n            \"absolute top-0 bottom-0 shadow-[0_0_1px_0.5px_var(--color-kumo-shadow-edge),0_1px_2px_var(--color-kumo-shadow-drop)]\",\n            s.thumb,\n            squircleRadius,\n            thumbColors,\n            \"transition-all duration-150 ease-out motion-reduce:transition-none\",\n            state.checked ? s.slide : \"left-0\",\n          );\n\n          const role =\n            (props.role as string | undefined) ?? baseRole ?? \"switch\";\n          const checkedA11yProps =\n            role === \"switch\"\n              ? { \"aria-checked\": state.checked }\n              : { \"aria-pressed\": state.checked };\n\n          return (\n            <button\n              {...restRootProps}\n              {...props}\n              ref={rootRef}\n              type=\"button\"\n              role={role}\n              {...checkedA11yProps}\n              aria-busy={transitioning || undefined}\n              aria-label={props[\"aria-label\"] ?? ariaLabelFallback}\n              className={trackClassName}\n            >\n              <div className={thumbClassName} />\n            </button>\n          );\n        }}\n      />\n    );\n\n    // Wrap in Field (built-in) - no description for single switches\n    // If no label provided, return bare switch (for use in other components)\n    if (!label) {\n      return switchControl;\n    }\n\n    return (\n      <Field\n        label={label}\n        required={required}\n        labelTooltip={labelTooltip}\n        controlFirst={controlFirst}\n      >\n        {switchControl}\n      </Field>\n    );\n  },\n);\n\nSwitchBase.displayName = \"Switch\";\n\n// Switch.Item for use within Switch.Group\nconst SwitchItem = forwardRef<HTMLButtonElement, SwitchItemProps>(\n  (\n    {\n      className,\n      checked,\n      disabled,\n      size = \"base\",\n      variant = \"default\",\n      label,\n      onCheckedChange,\n      transitioning,\n    },\n    ref,\n  ) => {\n    const { controlFirst } = useContext(SwitchGroupContext);\n\n    return (\n      <label\n        className={cn(\n          \"m-0 relative inline-flex items-center gap-2\",\n          // Control first (default): switch before label\n          // Label first: label before switch using flex-row-reverse\n          !controlFirst && \"flex-row-reverse justify-end\",\n          disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer\",\n          className,\n        )}\n      >\n        <BaseSwitch.Root\n          ref={ref}\n          checked={checked}\n          disabled={disabled}\n          onCheckedChange={onCheckedChange}\n          nativeButton\n          render={(rootProps, state) => {\n            const {\n              ref: rootRef,\n              className: baseClassName,\n              role: baseRole,\n              \"aria-checked\": _ariaChecked,\n              \"aria-pressed\": _ariaPressed,\n              ...restRootProps\n            } = rootProps as typeof rootProps & {\n              ref?: Ref<HTMLButtonElement>;\n              className?: string;\n              role?: string;\n              \"aria-checked\"?: boolean;\n              \"aria-pressed\"?: boolean;\n            };\n\n            const isNeutral = variant === \"neutral\";\n\n            // Squircle-aware border-radius (used by both variants)\n            const squircleRadius =\n              \"rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]\";\n\n            // Size styles matching Kyle's stratus implementation\n            const sizeStyles = {\n              sm: { track: \"h-4 w-8\", thumb: \"w-4\", slide: \"left-4\" },\n              base: { track: \"h-4.5 w-9\", thumb: \"w-4.5\", slide: \"left-4.5\" },\n              lg: { track: \"h-5 w-10\", thumb: \"w-5\", slide: \"left-5\" },\n            };\n            const s = sizeStyles[size];\n\n            // Track colors based on variant\n            const trackColors = isNeutral\n              ? state.checked\n                ? \"bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700\"\n                : \"bg-neutral-150 dark:bg-kumo-base ring-kumo-hairline\"\n              : state.checked\n                ? \"bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500\"\n                : \"bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600\";\n\n            // Thumb colors based on variant\n            const thumbColors = isNeutral\n              ? state.checked\n                ? \"bg-kumo-base dark:bg-neutral-400\"\n                : \"bg-kumo-base dark:bg-neutral-850\"\n              : state.checked\n                ? \"bg-kumo-base dark:bg-blue-300\"\n                : \"bg-kumo-base dark:bg-neutral-850\";\n\n            const trackClassName = cn(\n              \"relative inline-flex items-center ring cursor-pointer border-none p-0\",\n              \"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-500\",\n              \"transition-colors duration-150 ease-out motion-reduce:transition-none\",\n              \"disabled:cursor-not-allowed disabled:opacity-50\",\n              s.track,\n              squircleRadius,\n              trackColors,\n              baseClassName,\n            );\n\n            const thumbClassName = cn(\n              \"absolute top-0 bottom-0 shadow-[0_0_1px_0.5px_var(--color-kumo-shadow-edge),0_1px_2px_var(--color-kumo-shadow-drop)]\",\n              s.thumb,\n              squircleRadius,\n              thumbColors,\n              \"transition-all duration-150 ease-out motion-reduce:transition-none\",\n              state.checked ? s.slide : \"left-0\",\n            );\n\n            const role = baseRole ?? \"switch\";\n            const checkedA11yProps =\n              role === \"switch\"\n                ? { \"aria-checked\": state.checked }\n                : { \"aria-pressed\": state.checked };\n\n            return (\n              <button\n                {...restRootProps}\n                ref={rootRef}\n                type=\"button\"\n                role={role}\n                {...checkedA11yProps}\n                aria-busy={transitioning || undefined}\n                className={trackClassName}\n              >\n                <div className={thumbClassName} />\n              </button>\n            );\n          }}\n        />\n        <span className=\"text-base font-medium text-kumo-default\">{label}</span>\n      </label>\n    );\n  },\n);\n\nSwitchItem.displayName = \"Switch.Item\";\n\n// Switch.Group with built-in Fieldset\nfunction SwitchGroup({\n  legend,\n  children,\n  error,\n  description,\n  disabled,\n  controlFirst = true,\n  className,\n}: SwitchGroupProps) {\n  return (\n    <SwitchGroupContext.Provider value={{ controlFirst }}>\n      <Fieldset.Root\n        className={cn(\n          \"flex flex-col gap-4 rounded-lg border border-kumo-hairline p-4\",\n          className,\n        )}\n        disabled={disabled}\n      >\n        <Fieldset.Legend className=\"text-lg font-medium text-kumo-default\">\n          {legend}\n        </Fieldset.Legend>\n        <div className=\"flex flex-col gap-2\">{children}</div>\n        {error && <p className=\"text-sm text-kumo-danger\">{error}</p>}\n        {description && (\n          <p className=\"text-sm text-kumo-subtle\">{description}</p>\n        )}\n      </Fieldset.Root>\n    </SwitchGroupContext.Provider>\n  );\n}\n\n// Compound component\nexport const Switch = Object.assign(SwitchBase, {\n  Item: SwitchItem,\n  Group: SwitchGroup,\n});\n\nSwitch.displayName = \"Switch\";\n"],"names":["KUMO_SWITCH_VARIANTS","KUMO_SWITCH_DEFAULT_VARIANTS","SwitchGroupContext","createContext","SwitchBase","forwardRef","className","checked","disabled","size","variant","label","labelTooltip","required","controlFirst","onCheckedChange","transitioning","id","props","ref","ariaLabelFallback","switchControl","jsx","BaseSwitch.Root","rootProps","state","rootRef","baseClassName","baseRole","_ariaChecked","_ariaPressed","restRootProps","isNeutral","squircleRadius","s","trackColors","thumbColors","trackClassName","cn","thumbClassName","role","checkedA11yProps","Field","SwitchItem","useContext","jsxs","SwitchGroup","legend","children","error","description","Fieldset.Root","Fieldset.Legend","Switch"],"mappings":"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"}

package/dist/chunks/table-of-contents-f813ivi7ta23vqdm.js

@@ -1,88 +0,0 @@
-"use client";
-import { jsx as a, jsxs as u, Fragment as C } from "react/jsx-runtime";
-import { forwardRef as l, isValidElement as k, cloneElement as v } from "react";
-import { c as o } from "./cn-ct4n7r74mh8y0f48.js";
-const m = {
-  state: {
-    default: {
-      classes: "text-kumo-subtle hover:bg-kumo-tint hover:text-kumo-default hover:font-medium",
-      description: "Inactive section link"
-    },
-    active: {
-      classes: "text-kumo-default font-medium",
-      description: "Currently visible / active section"
-    }
-  }
-}, g = {
-  state: "default"
-}, y = "group relative block w-full truncate rounded-md py-1 pl-5 text-sm text-left no-underline transition-all duration-500", h = "absolute inset-y-0 left-0.5 w-0.5 rounded-full transition-all duration-200 bg-kumo-brand", d = l(
-  ({ className: e, "aria-label": t = "Table of contents", ...s }, n) => /* @__PURE__ */ a("nav", { ref: n, "aria-label": t, className: e, ...s })
-), f = l(({ className: e, ...t }, s) => /* @__PURE__ */ a(
-  "p",
-  {
-    ref: s,
-    className: o(
-      "mb-3 text-xs font-semibold tracking-wide text-kumo-subtle uppercase",
-      e
-    ),
-    ...t
-  }
-)), b = l(({ className: e, ...t }, s) => /* @__PURE__ */ a(
-  "div",
-  {
-    ref: s,
-    className: o(
-      "relative space-y-1.5 before:absolute before:inset-y-0 before:left-0.5 before:w-px before:bg-kumo-line",
-      e
-    ),
-    ...t
-  }
-)), p = l(({ active: e = !1, className: t, children: s, render: n, ...i }, r) => {
-  const N = e ? m.state.active.classes : m.state.default.classes, x = o(y, N, t), O = /* @__PURE__ */ u(C, { children: [
-    /* @__PURE__ */ a(
-      "span",
-      {
-        "aria-hidden": "true",
-        className: o(
-          h,
-          e ? "opacity-100" : "opacity-0 group-hover:opacity-60"
-        )
-      }
-    ),
-    /* @__PURE__ */ a("span", { className: "block min-w-0 leading-5", children: s })
-  ] }), c = {
-    ref: r,
-    "aria-current": e ? "true" : void 0,
-    className: x,
-    children: O,
-    ...i
-  };
-  return n && k(n) ? v(n, c) : /* @__PURE__ */ a("a", { ...c });
-}), T = l(({ label: e, href: t, className: s, children: n, ...i }, r) => /* @__PURE__ */ u("div", { ref: r, className: o("mt-3", s), ...i, children: [
-  t ? /* @__PURE__ */ a(
-    "a",
-    {
-      href: t,
-      className: "mb-1.5 block pl-5 text-xs font-medium text-kumo-subtle no-underline hover:text-kumo-default",
-      children: e
-    }
-  ) : /* @__PURE__ */ a("p", { className: "mb-1.5 pl-5 text-xs font-medium text-kumo-subtle", children: e }),
-  /* @__PURE__ */ a("div", { className: "space-y-1.5 pl-3", children: n })
-] }));
-d.displayName = "TableOfContents";
-f.displayName = "TableOfContents.Title";
-b.displayName = "TableOfContents.List";
-p.displayName = "TableOfContents.Item";
-T.displayName = "TableOfContents.Group";
-const I = Object.assign(d, {
-  Title: f,
-  List: b,
-  Item: p,
-  Group: T
-});
-export {
-  m as K,
-  I as T,
-  g as a
-};
-//# sourceMappingURL=table-of-contents-f813ivi7ta23vqdm.js.map

package/dist/chunks/table-of-contents-f813ivi7ta23vqdm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-of-contents-f813ivi7ta23vqdm.js","sources":["../../src/components/table-of-contents/table-of-contents.tsx"],"sourcesContent":["import { cloneElement, forwardRef, isValidElement } from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** TableOfContents item state variant definitions. */\nexport const KUMO_TABLE_OF_CONTENTS_VARIANTS = {\n  state: {\n    default: {\n      classes:\n        \"text-kumo-subtle hover:bg-kumo-tint hover:text-kumo-default hover:font-medium\",\n      description: \"Inactive section link\",\n    },\n    active: {\n      classes: \"text-kumo-default font-medium\",\n      description: \"Currently visible / active section\",\n    },\n  },\n} as const;\n\nexport const KUMO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS = {\n  state: \"default\",\n} as const;\n\nexport type KumoTableOfContentsState =\n  keyof typeof KUMO_TABLE_OF_CONTENTS_VARIANTS.state;\n\nconst ITEM_BASE =\n  \"group relative block w-full truncate rounded-md py-1 pl-5 text-sm text-left no-underline transition-all duration-500\";\n\nconst INDICATOR_BASE =\n  \"absolute inset-y-0 left-0.5 w-0.5 rounded-full transition-all duration-200 bg-kumo-brand\";\n\nexport type TableOfContentsProps = React.HTMLAttributes<HTMLElement>;\n\nconst TableOfContentsRoot = forwardRef<HTMLElement, TableOfContentsProps>(\n  (\n    { className, \"aria-label\": ariaLabel = \"Table of contents\", ...props },\n    ref,\n  ) => (\n    <nav ref={ref} aria-label={ariaLabel} className={className} {...props} />\n  ),\n);\n\nexport type TableOfContentsTitleProps =\n  React.HTMLAttributes<HTMLParagraphElement>;\n\nconst TableOfContentsTitle = forwardRef<\n  HTMLParagraphElement,\n  TableOfContentsTitleProps\n>(({ className, ...props }, ref) => (\n  <p\n    ref={ref}\n    className={cn(\n      \"mb-3 text-xs font-semibold tracking-wide text-kumo-subtle uppercase\",\n      className,\n    )}\n    {...props}\n  />\n));\n\nexport type TableOfContentsListProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst TableOfContentsList = forwardRef<\n  HTMLDivElement,\n  TableOfContentsListProps\n>(({ className, ...props }, ref) => (\n  <div\n    ref={ref}\n    className={cn(\n      \"relative space-y-1.5 before:absolute before:inset-y-0 before:left-0.5 before:w-px before:bg-kumo-line\",\n      className,\n    )}\n    {...props}\n  />\n));\nexport interface TableOfContentsItemProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n  /** Whether this item represents the currently active section. */\n  active?: boolean;\n  /**\n   * Custom element to render as the link. Use this to integrate with\n   * framework routers (e.g., Next.js `<Link>`, React Router `<NavLink>`).\n   * The element receives all anchor props including `href`, `className`, and `children`.\n   *\n   * @example\n   * ```tsx\n   * <TableOfContents.Item render={<Link />} href=\"/intro\" active>\n   *   Introduction\n   * </TableOfContents.Item>\n   * ```\n   */\n  render?: React.ReactElement;\n}\n\nconst TableOfContentsItem = forwardRef<\n  HTMLAnchorElement,\n  TableOfContentsItemProps\n>(({ active = false, className, children, render, ...props }, ref) => {\n  const stateClasses = active\n    ? KUMO_TABLE_OF_CONTENTS_VARIANTS.state.active.classes\n    : KUMO_TABLE_OF_CONTENTS_VARIANTS.state.default.classes;\n\n  const combinedClassName = cn(ITEM_BASE, stateClasses, className);\n\n  const innerContent = (\n    <>\n      <span\n        aria-hidden=\"true\"\n        className={cn(\n          INDICATOR_BASE,\n          active ? \"opacity-100\" : \"opacity-0 group-hover:opacity-60\",\n        )}\n      />\n      <span className=\"block min-w-0 leading-5\">{children}</span>\n    </>\n  );\n\n  const sharedProps = {\n    ref,\n    \"aria-current\": active ? (\"true\" as const) : undefined,\n    className: combinedClassName,\n    children: innerContent,\n    ...props,\n  };\n\n  // If a render prop is provided, clone it with our props\n  if (render && isValidElement(render)) {\n    return cloneElement(render, sharedProps);\n  }\n\n  // Default to anchor tag\n  // oxlint-disable-next-line anchor-has-content -- children are in sharedProps\n  return <a {...sharedProps} />;\n});\n\nexport interface TableOfContentsGroupProps extends Omit<\n  React.HTMLAttributes<HTMLDivElement>,\n  \"title\"\n> {\n  /** Label displayed above the group's items. */\n  label: string;\n  /** URL the group label links to. */\n  href?: string;\n}\n\nconst TableOfContentsGroup = forwardRef<\n  HTMLDivElement,\n  TableOfContentsGroupProps\n>(({ label, href, className, children, ...props }, ref) => (\n  <div ref={ref} className={cn(\"mt-3\", className)} {...props}>\n    {href ? (\n      <a\n        href={href}\n        className=\"mb-1.5 block pl-5 text-xs font-medium text-kumo-subtle no-underline hover:text-kumo-default\"\n      >\n        {label}\n      </a>\n    ) : (\n      <p className=\"mb-1.5 pl-5 text-xs font-medium text-kumo-subtle\">\n        {label}\n      </p>\n    )}\n    <div className=\"space-y-1.5 pl-3\">{children}</div>\n  </div>\n));\n\nTableOfContentsRoot.displayName = \"TableOfContents\";\nTableOfContentsTitle.displayName = \"TableOfContents.Title\";\nTableOfContentsList.displayName = \"TableOfContents.List\";\nTableOfContentsItem.displayName = \"TableOfContents.Item\";\nTableOfContentsGroup.displayName = \"TableOfContents.Group\";\n\n/**\n * TableOfContents — presentational compound component for section navigation.\n *\n * Purely visual; all interaction logic (scroll tracking, active state management)\n * is left to the consumer.\n *\n * @example\n * ```tsx\n * <TableOfContents>\n *   <TableOfContents.Title>On this page</TableOfContents.Title>\n *   <TableOfContents.List>\n *     <TableOfContents.Item href=\"#intro\" active>Introduction</TableOfContents.Item>\n *     <TableOfContents.Group label=\"Getting Started\">\n *       <TableOfContents.Item href=\"#install\">Installation</TableOfContents.Item>\n *       <TableOfContents.Item href=\"#setup\">Setup</TableOfContents.Item>\n *     </TableOfContents.Group>\n *   </TableOfContents.List>\n * </TableOfContents>\n * ```\n */\nexport const TableOfContents = Object.assign(TableOfContentsRoot, {\n  Title: TableOfContentsTitle,\n  List: TableOfContentsList,\n  Item: TableOfContentsItem,\n  Group: TableOfContentsGroup,\n});\n"],"names":["KUMO_TABLE_OF_CONTENTS_VARIANTS","KUMO_TABLE_OF_CONTENTS_DEFAULT_VARIANTS","ITEM_BASE","INDICATOR_BASE","TableOfContentsRoot","forwardRef","className","ariaLabel","props","ref","TableOfContentsTitle","jsx","cn","TableOfContentsList","TableOfContentsItem","active","children","render","stateClasses","combinedClassName","innerContent","jsxs","Fragment","sharedProps","isValidElement","cloneElement","TableOfContentsGroup","label","href","TableOfContents"],"mappings":"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"}

package/dist/chunks/table-olwwulga2l3hdwlx.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"table-olwwulga2l3hdwlx.js","sources":["../../src/components/table/table.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils\";\nimport { Checkbox } from \"../checkbox\";\n\n/** Table layout and row variant definitions mapping names to their Tailwind classes. */\nexport const KUMO_TABLE_VARIANTS = {\n  layout: {\n    auto: {\n      classes: \"\",\n      description: \"Auto table layout - columns resize based on content\",\n    },\n    fixed: {\n      classes: \"table-fixed\",\n      description:\n        \"Fixed table layout - columns have equal width, controlled via colgroup\",\n    },\n  },\n  variant: {\n    default: {\n      classes: \"\",\n      description: \"Default row variant\",\n    },\n    selected: {\n      classes: \"bg-kumo-tint\",\n      description: \"Selected row variant\",\n    },\n  },\n  sticky: {\n    left: {\n      classes: \"sticky left-0\",\n      description: \"Pin column to the left edge of the scroll container\",\n    },\n    right: {\n      classes: \"sticky right-0\",\n      description: \"Pin column to the right edge of the scroll container\",\n    },\n  },\n} as const;\n\nexport type KumoTableStickyColumn = keyof typeof KUMO_TABLE_VARIANTS.sticky;\n\n/**\n * Shared sticky-column styles for `<th>` and `<td>`.\n *\n * - Opaque background so scrolling content doesn't show through.\n * - Gradient fade on the inner edge so the sticky boundary isn't a hard clip.\n * - z-index kept to z-0/z-1/z-2 within the table's `isolate` stacking context:\n *   - `z-0` — normal cells (default)\n *   - `z-1` — sticky body cells (`<td>`)\n *   - `z-2` — sticky header cells (`<th>`) so they sit above sticky body cells\n *\n * Header cells use `:has()` to detect if they're in a compact header (which has\n * `bg-kumo-elevated`) and adjust both the background and gradient fade colors.\n */\nconst stickyColumnClasses = (\n  side: KumoTableStickyColumn,\n  /** \"head\" renders at z-2, \"cell\" at z-1 */\n  element: \"head\" | \"cell\",\n) => {\n  const base = KUMO_TABLE_VARIANTS.sticky[side].classes;\n  const z = element === \"head\" ? \"z-2\" : \"z-1\";\n\n  const fadePosition = side === \"right\" ? \"before:-left-6\" : \"before:-right-6\";\n  const fadeBase =\n    \"before:pointer-events-none before:absolute before:inset-y-0 before:w-6\";\n\n  if (element === \"cell\") {\n    // Body cells always use kumo-base\n    const fade =\n      side === \"right\"\n        ? \"before:bg-gradient-to-r before:from-transparent before:to-kumo-base\"\n        : \"before:bg-gradient-to-l before:from-transparent before:to-kumo-base\";\n    return cn(base, z, \"bg-kumo-base\", fadeBase, fadePosition, fade);\n  }\n\n  // Header cells: use kumo-base by default, kumo-elevated when in compact header\n  // The compact header applies a data attribute we can target with :has()\n  const bg = \"bg-kumo-base group-data-[compact]/header:bg-kumo-elevated\";\n  const fade =\n    side === \"right\"\n      ? \"before:bg-gradient-to-r before:from-transparent before:to-kumo-base group-data-[compact]/header:before:to-kumo-elevated\"\n      : \"before:bg-gradient-to-l before:from-transparent before:to-kumo-base group-data-[compact]/header:before:to-kumo-elevated\";\n\n  return cn(base, z, bg, fadeBase, fadePosition, fade);\n};\n\nexport const KUMO_TABLE_DEFAULT_VARIANTS = {\n  layout: \"auto\",\n  variant: \"default\",\n} as const;\n\nexport type KumoTableRowVariant = keyof typeof KUMO_TABLE_VARIANTS.variant;\nexport type KumoTableLayout = keyof typeof KUMO_TABLE_VARIANTS.layout;\n\n/**\n * Table root — applies layout, borders, padding, and header styles.\n *\n * @example\n * ```tsx\n * <Table layout=\"fixed\">\n *   <Table.Header>\n *     <Table.Row>\n *       <Table.Head>Name</Table.Head>\n *       <Table.Head>Status</Table.Head>\n *     </Table.Row>\n *   </Table.Header>\n *   <Table.Body>\n *     <Table.Row>\n *       <Table.Cell>Worker A</Table.Cell>\n *       <Table.Cell>Active</Table.Cell>\n *     </Table.Row>\n *   </Table.Body>\n * </Table>\n * ```\n */\nconst TableRoot = forwardRef<\n  HTMLTableElement,\n  React.HTMLAttributes<HTMLTableElement> & {\n    /**\n     * Table layout algorithm.\n     * - `\"auto\"` — columns resize based on content\n     * - `\"fixed\"` — equal-width columns, controlled via `<colgroup>`\n     * @default \"auto\"\n     */\n    layout?: KumoTableLayout;\n  }\n>(({ layout = \"auto\", ...props }, ref) => {\n  const className = cn(\n    \"isolate w-full\", // isolate creates a stacking context so z-0/z-1/z-2 never leak out\n    KUMO_TABLE_VARIANTS.layout[layout].classes,\n    \"[&_td]:border-b [&_td]:border-kumo-fill [&_tr:last-child_td]:border-b-0\", // Row border\n    \"[&_td]:p-3\", // Cell padding\n    \"[&_th]:border-b [&_th]:border-kumo-fill [&_th]:p-3 [&_th]:font-semibold [&_th]:text-base\", // Header styles\n    \"[&_th]:bg-kumo-base\", // Header background color\n    \"text-left text-kumo-default\",\n    props.className,\n  );\n\n  return <table ref={ref} {...props} className={className} />;\n});\n\nconst TableHeader = forwardRef<\n  HTMLTableSectionElement,\n  React.HTMLAttributes<HTMLTableSectionElement> & {\n    variant?: \"default\" | \"compact\";\n    /**\n     * Make the header row stick to the top of the scroll container.\n     * Requires the table's parent to have a constrained height with\n     * `overflow-y: auto`.\n     */\n    sticky?: boolean;\n  }\n>(({ variant = \"default\", sticky, ...props }, ref) => {\n  const isCompact = variant === \"compact\";\n  const className = cn(\n    \"group/header\",\n    isCompact && \"[&_th]:bg-kumo-elevated [&_th]:py-2 text-xs text-kumo-strong\",\n    sticky && \"[&_th]:sticky [&_th]:top-0 [&_th]:z-1\",\n    props.className,\n  );\n\n  return (\n    <thead\n      ref={ref}\n      {...props}\n      className={className}\n      {...(isCompact && { \"data-compact\": \"\" })}\n    />\n  );\n});\n\nconst TableHead = forwardRef<\n  HTMLTableCellElement,\n  React.HTMLAttributes<HTMLTableCellElement> & {\n    /**\n     * Pin this header cell to the left or right edge of the scroll container.\n     * Adds `position: sticky`, an opaque background, and a gradient fade on the\n     * inner edge. Sticky header columns render at `z-2` so they sit above both\n     * normal cells and sticky body cells (`z-1`).\n     */\n    sticky?: KumoTableStickyColumn;\n  }\n>(({ sticky, ...props }, ref) => {\n  const className = cn(\n    \"group relative\",\n    sticky && stickyColumnClasses(sticky, \"head\"),\n    props.className,\n  );\n  return <th ref={ref} {...props} className={className} />;\n});\n\nconst TableRow = forwardRef<\n  HTMLTableRowElement,\n  React.HTMLAttributes<HTMLTableRowElement> & {\n    variant?: KumoTableRowVariant;\n  }\n>(({ variant = KUMO_TABLE_DEFAULT_VARIANTS.variant, ...props }, ref) => {\n  const className = cn(\n    KUMO_TABLE_VARIANTS.variant[variant].classes,\n    props.className,\n  );\n\n  return <tr ref={ref} {...props} className={className} />;\n});\n\nconst TableBody = forwardRef<\n  HTMLTableSectionElement,\n  React.HTMLAttributes<HTMLTableSectionElement>\n>((props, ref) => {\n  return <tbody ref={ref} {...props} />;\n});\n\nconst TableCell = forwardRef<\n  HTMLTableCellElement,\n  React.TdHTMLAttributes<HTMLTableCellElement> & {\n    /**\n     * Pin this cell to the left or right edge of the scroll container.\n     * Adds `position: sticky`, an opaque background, and a gradient fade on\n     * the inner edge. Requires the table's parent to have `overflow-x: auto`.\n     */\n    sticky?: KumoTableStickyColumn;\n  }\n>(({ sticky, ...props }, ref) => {\n  const className = cn(\n    sticky && stickyColumnClasses(sticky, \"cell\"),\n    props.className,\n  );\n  return <td ref={ref} {...props} className={className} />;\n});\n\nconst TableFooter = forwardRef<\n  HTMLTableSectionElement,\n  React.HTMLAttributes<HTMLTableSectionElement>\n>((props, ref) => {\n  return <tfoot ref={ref} {...props} />;\n});\n\nconst TableResizeHandle = forwardRef<\n  HTMLButtonElement,\n  React.HTMLAttributes<HTMLButtonElement>\n>((props, ref) => {\n  return (\n    <button\n      ref={ref}\n      {...props}\n      type=\"button\"\n      aria-label=\"Resize column\"\n      className={cn(\n        \"invisible h-full group-hover:visible\", // Make the handle invisible by default\n        \"w-[10px]\", // Hitting area\n        \"flex items-center justify-center\", // Center the handle\n        \"cursor-col-resize touch-none select-none\", // Prevent selection and touch events\n        \"absolute top-0 right-0\", // Position the handle\n        \"m-0 bg-kumo-base p-0\", // Override the stratus button styles\n      )}\n    >\n      <span className=\"h-5 w-[2px] rounded bg-kumo-hairline\" />\n    </button>\n  );\n});\n\n/**\n * Special cell that makes the entire cell area a hit target for the checkbox.\n */\n\nconst TableCheckCell = forwardRef<\n  HTMLTableCellElement,\n  React.TdHTMLAttributes<HTMLTableCellElement> & {\n    checked?: boolean;\n    indeterminate?: boolean;\n    onValueChange?: (checked: boolean) => void;\n    label?: string;\n    disabled?: boolean;\n  }\n>(\n  (\n    { checked, indeterminate, onValueChange, label, disabled, ...props },\n    ref,\n  ) => {\n    return (\n      <TableCell\n        ref={ref}\n        {...props}\n        className={cn(\"w-10 leading-none\", props.className)}\n      >\n        <Checkbox\n          checked={checked}\n          indeterminate={indeterminate}\n          onCheckedChange={(newChecked) => {\n            onValueChange?.(newChecked);\n          }}\n          aria-label={label ?? \"Select row\"}\n          disabled={disabled}\n          className=\"relative before:absolute before:-inset-3 before:content-['']\"\n        />\n      </TableCell>\n    );\n  },\n);\n\nconst TableCheckHead = forwardRef<\n  HTMLTableCellElement,\n  React.ThHTMLAttributes<HTMLTableCellElement> & {\n    checked?: boolean;\n    indeterminate?: boolean;\n    onValueChange?: (checked: boolean) => void;\n    label?: string;\n    disabled?: boolean;\n  }\n>(\n  (\n    { checked, indeterminate, onValueChange, label, disabled, ...props },\n    ref,\n  ) => {\n    return (\n      <TableHead\n        ref={ref}\n        {...props}\n        className={cn(\"w-10 leading-none\", props.className)}\n      >\n        <Checkbox\n          checked={checked}\n          indeterminate={indeterminate}\n          onCheckedChange={(newChecked) => {\n            onValueChange?.(newChecked);\n          }}\n          aria-label={label ?? \"Select all rows\"}\n          disabled={disabled}\n          className=\"relative before:absolute before:-inset-3 before:content-['']\"\n        />\n      </TableHead>\n    );\n  },\n);\n\nTableRoot.displayName = \"Table\";\nTableBody.displayName = \"Table.Body\";\nTableHead.displayName = \"Table.Head\";\nTableRow.displayName = \"Table.Row\";\nTableCell.displayName = \"Table.Cell\";\nTableFooter.displayName = \"Table.Footer\";\nTableHeader.displayName = \"Table.Header\";\nTableResizeHandle.displayName = \"Table.ResizeHandle\";\nTableCheckCell.displayName = \"Table.CheckCell\";\nTableCheckHead.displayName = \"Table.CheckHead\";\n\n/**\n * Table — semantic HTML table with styled rows, cells, and selection support.\n *\n * Compound component: `Table` (Root), `.Header`, `.Head`, `.Body`, `.Row`,\n * `.Cell`, `.Footer`, `.CheckCell`, `.CheckHead`, `.ResizeHandle`.\n *\n * @example\n * ```tsx\n * <Table>\n *   <Table.Header>\n *     <Table.Row>\n *       <Table.CheckHead checked={allSelected} onValueChange={toggleAll} />\n *       <Table.Head>Name</Table.Head>\n *     </Table.Row>\n *   </Table.Header>\n *   <Table.Body>\n *     {rows.map((row) => (\n *       <Table.Row key={row.id} variant={selected.has(row.id) ? \"selected\" : \"default\"}>\n *         <Table.CheckCell checked={selected.has(row.id)} onValueChange={() => toggle(row.id)} />\n *         <Table.Cell>{row.name}</Table.Cell>\n *       </Table.Row>\n *     ))}\n *   </Table.Body>\n * </Table>\n * ```\n */\nexport const Table = Object.assign(TableRoot, {\n  Header: TableHeader,\n  Head: TableHead,\n  Row: TableRow,\n  Body: TableBody,\n  Cell: TableCell,\n  CheckCell: TableCheckCell,\n  CheckHead: TableCheckHead,\n  Footer: TableFooter,\n  ResizeHandle: TableResizeHandle,\n});\n"],"names":["KUMO_TABLE_VARIANTS","stickyColumnClasses","side","element","base","z","fadePosition","fadeBase","cn","KUMO_TABLE_DEFAULT_VARIANTS","TableRoot","forwardRef","layout","props","ref","className","jsx","TableHeader","variant","sticky","isCompact","TableHead","TableRow","TableBody","TableCell","TableFooter","TableResizeHandle","TableCheckCell","checked","indeterminate","onValueChange","label","disabled","Checkbox","newChecked","TableCheckHead","Table"],"mappings":"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"}

package/dist/chunks/text-nmyi1rkwdj37f30f.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"text-nmyi1rkwdj37f30f.js","sources":["../../src/components/text/text.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type ComponentPropsWithoutRef,\n  type ElementRef,\n  type ForwardedRef,\n  forwardRef,\n  useMemo,\n  type ElementType,\n} from \"react\";\nimport { cn } from \"../../utils/cn\";\n\n/** Text variant and size definitions mapping names to their Tailwind classes. */\nexport const KUMO_TEXT_VARIANTS = {\n  variant: {\n    heading1: {\n      classes: \"text-3xl font-semibold\",\n      description: \"Large heading for page titles\",\n    },\n    heading2: {\n      classes: \"text-2xl font-semibold\",\n      description: \"Medium heading for section titles\",\n    },\n    heading3: {\n      classes: \"text-lg font-semibold\",\n      description: \"Small heading for subsections\",\n    },\n    body: {\n      classes: \"text-kumo-default\",\n      description: \"Default body text\",\n    },\n    secondary: {\n      classes: \"text-kumo-subtle\",\n      description: \"Muted text for secondary information\",\n    },\n    success: {\n      classes: \"text-kumo-link\",\n      description: \"Success state text\",\n    },\n    error: {\n      classes: \"text-kumo-danger\",\n      description: \"Error state text\",\n    },\n    mono: {\n      classes: \"font-mono\",\n      description: \"Monospace text for code\",\n    },\n    \"mono-secondary\": {\n      classes: \"font-mono text-kumo-subtle\",\n      description: \"Muted monospace text\",\n    },\n  },\n  size: {\n    xs: {\n      classes: \"text-xs\",\n      description: \"Extra small text\",\n    },\n    sm: {\n      classes: \"text-sm\",\n      description: \"Small text\",\n    },\n    base: {\n      classes: \"text-base\",\n      description: \"Default text size\",\n    },\n    lg: {\n      classes: \"text-lg\",\n      description: \"Large text\",\n    },\n  },\n} as const;\n\nexport const KUMO_TEXT_DEFAULT_VARIANTS = {\n  variant: \"body\",\n  size: \"base\",\n} as const;\n\n/**\n * KUMO_TEXT_STYLING - Typography metadata for Figma generator\n *\n * This export provides structured styling information extracted from text.tsx\n * for use by the Figma plugin generator. It documents font sizes, weights,\n * colors, and font families used across all Text variants.\n *\n * Source of truth chain:\n * text.tsx (this file) → component-registry.json → text.ts (Figma generator)\n */\nexport const KUMO_TEXT_STYLING = {\n  fontSizes: {\n    xs: 12,\n    sm: 14,\n    base: 16,\n    lg: 18,\n    xl: 20,\n    \"2xl\": 24,\n    \"3xl\": 30,\n  },\n  fontWeights: {\n    normal: 400,\n    medium: 500,\n    semibold: 600,\n  },\n  baseColor: \"text-kumo-default\",\n  variantColors: {\n    body: \"text-kumo-default\",\n    secondary: \"text-kumo-subtle\",\n    success: \"text-kumo-link\",\n    error: \"text-kumo-danger\",\n    mono: \"text-kumo-default\",\n    \"mono-secondary\": \"text-kumo-subtle\",\n  },\n  fontFamilies: {\n    default: \"sans-serif\",\n    mono: \"monospace\",\n  },\n} as const;\n\n// Derived types from KUMO_TEXT_VARIANTS\nexport type KumoTextVariant = keyof typeof KUMO_TEXT_VARIANTS.variant;\nexport type KumoTextSize = keyof typeof KUMO_TEXT_VARIANTS.size;\n\nexport interface KumoTextVariantsProps {\n  variant?: KumoTextVariant;\n  size?: KumoTextSize;\n}\n\nexport function textVariants({\n  variant = KUMO_TEXT_DEFAULT_VARIANTS.variant,\n  size = KUMO_TEXT_DEFAULT_VARIANTS.size,\n}: KumoTextVariantsProps = {}) {\n  return cn(\n    KUMO_TEXT_VARIANTS.variant[variant].classes,\n    KUMO_TEXT_VARIANTS.size[size].classes,\n  );\n}\n\n// Legacy types for backwards compatibility\ntype Heading = \"heading1\" | \"heading2\" | \"heading3\";\ntype Copy = \"body\" | \"secondary\" | \"success\" | \"error\";\ntype Monospace = \"mono\" | \"mono-secondary\";\ntype TextSize = KumoTextSize;\ntype TextVariant = KumoTextVariant;\n\ntype BaseTextProps = Omit<\n  ComponentPropsWithoutRef<\"span\">,\n  \"className\" | \"style\"\n> & {\n  DANGEROUS_className?: string;\n  DANGEROUS_style?: CSSProperties;\n  as?: ElementType;\n};\n\ntype TextPropsInternal<Variant extends TextVariant = \"body\"> = BaseTextProps &\n  (Variant extends Copy\n    ? {\n        variant?: Variant;\n        bold?: boolean;\n        size?: TextSize;\n        truncate?: boolean;\n      }\n    : Variant extends Monospace\n      ? {\n          variant?: Variant;\n          bold?: never;\n          size?: \"lg\";\n          truncate?: boolean;\n        }\n      : Variant extends Heading\n        ? {\n            variant?: Variant;\n            bold?: never;\n            size?: never;\n            truncate?: boolean;\n          }\n        : never);\n\n/**\n * Text component props.\n *\n * @example\n * ```tsx\n * <Text variant=\"heading1\">Page Title</Text>\n * <Text variant=\"body\">Default paragraph text.</Text>\n * <Text variant=\"secondary\" size=\"sm\">Muted helper text</Text>\n * <Text variant=\"error\">Something went wrong</Text>\n * <Text variant=\"mono\">console.log(\"code\")</Text>\n * ```\n */\nexport interface TextProps {\n  /**\n   * Text style variant. Determines color, font, and weight.\n   * - `\"heading1\"` — Large page title (30px, semibold)\n   * - `\"heading2\"` — Section title (24px, semibold)\n   * - `\"heading3\"` — Subsection title (18px, semibold)\n   * - `\"body\"` — Default body text\n   * - `\"secondary\"` — Muted text for secondary information\n   * - `\"success\"` — Success state text\n   * - `\"error\"` — Error state text\n   * - `\"mono\"` — Monospace text for code\n   * - `\"mono-secondary\"` — Muted monospace text\n   * @default \"body\"\n   */\n  variant?: KumoTextVariant;\n  /**\n   * Text size (only applies to body/secondary/success/error variants).\n   * - `\"xs\"` — 12px\n   * - `\"sm\"` — 14px\n   * - `\"base\"` — 16px\n   * - `\"lg\"` — 18px\n   * @default \"base\"\n   */\n  size?: KumoTextSize;\n  /** Whether to use bold font weight (only applies to body variants). */\n  bold?: boolean;\n  /** Whether to truncate overflowing text with an ellipsis. Adds `truncate min-w-0` classes. */\n  truncate?: boolean;\n  /** The HTML element type to render as (e.g. `\"span\"`, `\"p\"`, `\"h1\"`). Auto-selected based on variant if omitted. */\n  as?: ElementType;\n  /** Text content. */\n  children?: React.ReactNode;\n}\n\n/**\n * Typography component for rendering text with consistent styling.\n * Automatically selects the appropriate HTML element based on variant\n * (`h1`/`h2`/`h3` for headings, `p` for body, `span` for mono).\n *\n * @example\n * ```tsx\n * <Text variant=\"heading1\">Dashboard</Text>\n * <Text>Default body text</Text>\n * ```\n */\nfunction _Text<Variant extends TextVariant = \"body\">(\n  {\n    variant = \"body\" as Variant,\n    bold = false,\n    size = \"base\",\n    truncate = false,\n    children,\n    DANGEROUS_className,\n    DANGEROUS_style,\n    as,\n    ...props\n  }: TextPropsInternal<Variant>,\n  ref: ForwardedRef<HTMLHeadingElement>,\n) {\n  const isCopy = [\"body\", \"secondary\", \"success\", \"error\"].includes(variant);\n  const isMono = [\"mono\", \"mono-secondary\"].includes(variant);\n\n  const Component = useMemo(() => {\n    if (as) return as;\n    if (variant === \"heading1\") return \"h1\";\n    if (variant === \"heading2\") return \"h2\";\n    if (variant === \"heading3\") return \"h3\";\n    if ([\"mono\", \"mono-secondary\"].includes(variant)) return \"span\";\n    return \"p\";\n  }, [variant, as]);\n\n  return (\n    <Component\n      ref={ref}\n      className={cn(\n        \"text-kumo-default\",\n        KUMO_TEXT_VARIANTS.variant[variant].classes,\n        isCopy ? KUMO_TEXT_VARIANTS.size[size].classes : \"\",\n        isCopy && bold ? \"font-medium\" : \"\",\n        // Monospace fonts need to be 1pt smaller than body text to optically match\n        isMono &&\n          (size === \"lg\"\n            ? KUMO_TEXT_VARIANTS.size.base.classes\n            : KUMO_TEXT_VARIANTS.size.sm.classes),\n        truncate && \"truncate min-w-0\",\n        DANGEROUS_className,\n      )}\n      style={DANGEROUS_style}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n}\n\nexport const Text = forwardRef(_Text) as <Variant extends TextVariant = \"body\">(\n  props: TextPropsInternal<Variant> & {\n    ref?: ForwardedRef<ElementRef<\"span\">>;\n  },\n) => React.ReactElement;\n"],"names":["KUMO_TEXT_VARIANTS","_Text","variant","bold","size","truncate","children","DANGEROUS_className","DANGEROUS_style","as","props","ref","isCopy","isMono","Component","useMemo","jsx","cn","Text","forwardRef"],"mappings":";;;;AAYO,MAAMA,IAAqB;AAAA,EAChC,SAAS;AAAA,IACP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,UAAU;AAAA,MACR,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,UAAU;AAAA,MACR,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,WAAW;AAAA,MACT,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,OAAO;AAAA,MACL,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,kBAAkB;AAAA,MAChB,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAAA,EAEF,MAAM;AAAA,IACJ,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,IAEf,IAAI;AAAA,MACF,SAAS;AAAA,MACT,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ;AAmKA,SAASC,EACP;AAAA,EACE,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,UAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,IAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAS,CAAC,QAAQ,aAAa,WAAW,OAAO,EAAE,SAASV,CAAO,GACnEW,IAAS,CAAC,QAAQ,gBAAgB,EAAE,SAASX,CAAO,GAEpDY,IAAYC,EAAQ,MACpBN,MACAP,MAAY,aAAmB,OAC/BA,MAAY,aAAmB,OAC/BA,MAAY,aAAmB,OAC/B,CAAC,QAAQ,gBAAgB,EAAE,SAASA,CAAO,IAAU,SAClD,MACN,CAACA,GAASO,CAAE,CAAC;AAEhB,SACE,gBAAAO;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,KAAAH;AAAA,MACA,WAAWM;AAAA,QACT;AAAA,QACAjB,EAAmB,QAAQE,CAAO,EAAE;AAAA,QACpCU,IAASZ,EAAmB,KAAKI,CAAI,EAAE,UAAU;AAAA,QACjDQ,KAAUT,IAAO,gBAAgB;AAAA;AAAA,QAEjCU,MACGT,MAAS,OACNJ,EAAmB,KAAK,KAAK,UAC7BA,EAAmB,KAAK,GAAG;AAAA,QACjCK,KAAY;AAAA,QACZE;AAAA,MAAA;AAAA,MAEF,OAAOC;AAAA,MACN,GAAGE;AAAA,MAEH,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP;AAEO,MAAMY,IAAOC,EAAWlB,CAAK;"}