npm - @acronis-platform/ui-react - Versions diffs - 4.0.0 → 5.0.0 - Mend

@acronis-platform/ui-react 4.0.0 → 5.0.0

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

Files changed (628) hide show

package/dist/components/ui/sidebar-secondary/sidebar-secondary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-secondary.js","sources":["../../../../src/components/ui/sidebar-secondary/sidebar-secondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { useRender } from '@base-ui/react/use-render';\nimport { Collapsible } from '@base-ui/react/collapsible';\nimport {\n ChevronDownIcon,\n SquareArrowUpRightIcon,\n} from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { useDocDir } from '@/lib/use-doc-dir';\nimport {\n Tooltip,\n TooltipContent,\n TooltipTrigger,\n} from '@/components/ui/tooltip';\n\n/*\n Tracks whether `ref`'s element is clipping its own content (`scrollWidth >\n * clientWidth`) — used to gate a tooltip so it only opens when a truncated\n * label is actually cut off. Re-measures via `ResizeObserver` (covers the\n * rail's expand/collapse width transition); `enabled` skips measurement\n * entirely (e.g. while collapsed, where the label is `sr-only`).\n /\nfunction useIsOverflowing<T extends Element>(\n ref: React.RefObject<T \| null>,\n { enabled }: { enabled: boolean }\n): boolean {\n const [isOverflowing, setIsOverflowing] = React.useState(false);\n\n React.useEffect(() => {\n const element = ref.current;\n if (!enabled \|\| !element) {\n setIsOverflowing(false);\n return;\n }\n const measure = () =>\n setIsOverflowing(element.scrollWidth > element.clientWidth);\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(element);\n return () => observer.disconnect();\n }, [ref, enabled]);\n\n return isOverflowing;\n}\n\n// Resize constraints — mirrors the design-token defaults.\n// CSS still uses `var(--ui-sidebar-secondary-expanded-container-width)` so\n// brands that override the token get the correct visual width; these JS\n// constants only govern the drag-resize clamping range.\nconst SIDEBAR_EXPANDED_WIDTH = 256; // --ui-sidebar-secondary-expanded-container-width\nconst SIDEBAR_MAX_WIDTH = SIDEBAR_EXPANDED_WIDTH 2;\n\n// Composable SidebarSecondary primitives mirroring the Figma \"SidebarSecondary\"\n// component set (node 2468:59502, variant expanded\|collapsed). Every color and\n// metric is wired to a next-gen `--ui-sidebar-secondary-` token from\n// @acronis-platform/tokens-pd — no hex, no invented tokens.\n//\n// Like SidebarPrimary, expanded/collapsed is a width-reflow state (not a panel\n// show/hide), modelled as a controlled/uncontrolled `expanded` prop (default\n// true) that sets `data-state=\"expanded\|collapsed\"` on the root and is shared to\n// descendants via context. The collapsed rail replaces the section list with a\n// vertical breadcrumb (parent → separator → current page), toggled purely by the\n// `data-[state]` selectors so it is SSR-present and needs no JS branch.\n//\n// Menu-item color wiring DIVERGES from Primary (DESIGN §6.2): Secondary recolors\n// only the CONTAINER per selected/unselected; the icon and label use the shared\n// `--ui-sidebar-secondary-menu-item-global-{icon,label}-color-color` tokens\n// across both variants and every interaction state (the next-gen token sync\n// collapsed the former per-state idle/hover/active icon+label colors into a\n// single value each). So the cva base carries the global icon/label colors and\n// the two variants only swap the container fill.\n//\n// R6 (collapsed separator icon): resolved from the Figma node metadata — the\n// collapsed `iconSeparator` instance's mainComponent is \"ChevronDown\" (updated\n// from ChevronRight), so the separator defaults to `ChevronDownIcon` (16px),\n// tinted by `--ui-sidebar-secondary-collapsed-icon-separator-color`. In the\n// vertical breadcrumb flow (writing-mode: vertical-rl) the downward chevron\n// visually points \"forward\" in the reading direction. The disclosure chevron\n// uses `ChevronDownIcon` rotated via `data-panel-open`. The focus ring reuses the\n// shared `--ui-focus-brand` (no sidebar focus token exists — R1).\n\nconst defaultResizeTooltipExpanded = (\n <>\n <span className=\"font-semibold\">Resize:</span> Drag\n <br />\n <span className=\"font-semibold\">Collapse:</span> Click\n <br />\n <span className=\"font-semibold\">Reset size:</span> Double click\n </>\n);\n\nconst defaultResizeTooltipCollapsed = (\n <>\n <span className=\"font-semibold\">Resize:</span> Drag\n <br />\n <span className=\"font-semibold\">Expand:</span> Click\n </>\n);\n\ninterface SidebarSecondaryContextValue {\n expanded: boolean;\n /* Flip the panel width — drives the controlled/uncontrolled `expanded` state. /\n toggleExpanded: () => void;\n /* Whether resize is enabled. /\n resizable: boolean;\n /* Current width in px (only meaningful when resizable + expanded). /\n width: number;\n /* Update the width (used by the resize edge during drag). /\n setWidth: (width: number) => void;\n /* Min resize width — derived from `--ui-sidebar-secondary-expanded-container-width`. /\n minWidth: number;\n /* Max resize width — expanded-width × RESIZE_MAX_WIDTH_FACTOR. /\n maxWidth: number;\n /* Default (reset) width — equals expanded-container-width token. /\n defaultWidth: number;\n /* Label registered by `SidebarSecondaryHeader` — consumed by the collapsed breadcrumb. /\n headerLabel: React.ReactNode;\n /* Register the header label (called by `SidebarSecondaryHeader`). /\n setHeaderLabel: (label: React.ReactNode) => void;\n /* Label of the currently selected `MenuItem` — consumed by the collapsed breadcrumb. /\n selectedLabel: React.ReactNode;\n /* Register the selected item label (called by `SidebarSecondaryMenuItem`). /\n setSelectedLabel: (label: React.ReactNode) => void;\n /* Accessible label for the resize edge separator. /\n resizeAriaLabel: string;\n /* Tooltip content shown when the sidebar is expanded. /\n resizeTooltipExpanded: React.ReactNode;\n /* Tooltip content shown when the sidebar is collapsed. /\n resizeTooltipCollapsed: React.ReactNode;\n}\n\nconst SidebarSecondaryContext =\n React.createContext<SidebarSecondaryContextValue \| null>(null);\n\nfunction useSidebarSecondaryContext(): SidebarSecondaryContextValue {\n // Default to expanded so parts render standalone (in isolation tests /\n // stories) without a wrapping root; the toggle is a no-op outside a root.\n return (\n React.useContext(SidebarSecondaryContext) ?? {\n expanded: true,\n toggleExpanded: () => {},\n resizable: false,\n width: SIDEBAR_EXPANDED_WIDTH,\n setWidth: () => {},\n minWidth: SIDEBAR_EXPANDED_WIDTH,\n maxWidth: SIDEBAR_MAX_WIDTH,\n defaultWidth: SIDEBAR_EXPANDED_WIDTH,\n headerLabel: undefined,\n setHeaderLabel: () => {},\n selectedLabel: undefined,\n setSelectedLabel: () => {},\n resizeAriaLabel: 'Resize sidebar',\n resizeTooltipExpanded: defaultResizeTooltipExpanded,\n resizeTooltipCollapsed: defaultResizeTooltipCollapsed,\n }\n );\n}\n\n/\n Controlled + uncontrolled boolean state (the Base UI idiom). When `controlled`\n * is provided it wins and the setter only emits the change callback; otherwise\n * the setter updates internal state. `onChange` is ALWAYS invoked with the next\n * value so a consumer can react in either mode.\n /\nfunction useControllableBoolean(\n controlled: boolean \| undefined,\n defaultValue: boolean,\n onChange?: (next: boolean) => void\n): [boolean, (next: boolean) => void] {\n const [uncontrolled, setUncontrolled] = React.useState(defaultValue);\n const isControlled = controlled !== undefined;\n const value = isControlled ? controlled : uncontrolled;\n const setValue = React.useCallback(\n (next: boolean) => {\n if (!isControlled) setUncontrolled(next);\n onChange?.(next);\n },\n [isControlled, onChange]\n );\n return [value, setValue];\n}\n\nexport interface SidebarSecondaryProps extends React.ComponentPropsWithoutRef<'nav'> {\n /* Controlled expanded (rail width) state. /\n expanded?: boolean;\n /* Uncontrolled initial expanded state. Defaults to `true` (full width). /\n defaultExpanded?: boolean;\n /* Fires when the expanded state changes (e.g. a consumer toggle). /\n onExpandedChange?: (expanded: boolean) => void;\n /\n Enable the draggable resize edge on the right border.\n * When `true`, the sidebar can be resized between the expanded-width token\n * and twice that value.\n /\n resizable?: boolean;\n /* Controlled width in px (only used when `resizable`). /\n width?: number;\n /* Fires when the width changes due to a drag interaction. /\n onWidthChange?: (width: number) => void;\n /* Accessible label for the resize edge (`role=\"separator\"`). Defaults to `'Resize sidebar'`. /\n resizeAriaLabel?: string;\n /* Tooltip content shown when the sidebar is expanded. Pass `null` to hide the tooltip entirely. /\n resizeTooltipExpanded?: React.ReactNode;\n /* Tooltip content shown when the sidebar is collapsed. Pass `null` to hide the tooltip entirely. /\n resizeTooltipCollapsed?: React.ReactNode;\n /\n Replace the rendered `<nav>` with another element or component\n * (Base UI composition). Accepts a React element or a render function.\n /\n render?: useRender.RenderProp;\n}\n\n// ---------------------------------------------------------------------------\n// SidebarSecondaryResizeEdge — internal drag/click handle on the right edge\n// ---------------------------------------------------------------------------\n// Styled after `ResizableHandle` (Figma 4649:6681): a hit area that takes up no\n// layout space around a 1px divider, idle → `--ui-border-on-surface-border`,\n// hover → `--ui-resizable-border-color-hover`,\n// drag → `--ui-resizable-border-color-active`.\n// ---------------------------------------------------------------------------\n\nfunction SidebarSecondaryResizeEdge() {\n const ctx = useSidebarSecondaryContext();\n const { expanded, toggleExpanded, resizable } = ctx;\n const dir = useDocDir();\n\n // Mutable ref so the closure-captured pointermove handler always reads\n // the latest context without re-attaching listeners.\n const ctxRef = React.useRef(ctx);\n ctxRef.current = ctx;\n\n // Track whether a pointermove actually happened between down→up so we can\n // suppress the click that the browser fires after every pointerup.\n const didDragRef = React.useRef(false);\n\n // Hide the tooltip while dragging.\n const [tooltipOpen, setTooltipOpen] = React.useState(false);\n const [dragging, setDragging] = React.useState(false);\n\n // Delay single-click so a double-click can cancel it.\n const clickTimerRef = React.useRef<ReturnType<typeof setTimeout> \| null>(\n null\n );\n\n // Clear any pending click timer on unmount.\n React.useEffect(() => {\n return () => {\n if (clickTimerRef.current) clearTimeout(clickTimerRef.current);\n };\n }, []);\n\n if (!resizable) return null;\n\n const handlePointerDown = (e: React.PointerEvent<HTMLDivElement>) => {\n e.preventDefault();\n const el = e.currentTarget;\n el.setPointerCapture(e.pointerId);\n didDragRef.current = false;\n setDragging(true);\n setTooltipOpen(false);\n\n // Disable the width transition while dragging so resize follows the\n // cursor without animation lag.\n const sidebarEl = el.closest('[data-state]') as HTMLElement \| null;\n if (!sidebarEl) {\n setDragging(false);\n el.releasePointerCapture(e.pointerId);\n return;\n }\n sidebarEl.style.transitionProperty = 'none';\n const isRtl = getComputedStyle(sidebarEl).direction === 'rtl';\n const sidebarRect = sidebarEl.getBoundingClientRect();\n\n const { minWidth, maxWidth } = ctxRef.current;\n const collapseThreshold = minWidth / 2;\n\n const onPointerMove = (ev: PointerEvent) => {\n didDragRef.current = true;\n const newWidth = isRtl\n ? sidebarRect.right - ev.clientX\n : ev.clientX - sidebarRect.left;\n const { expanded: isExpanded } = ctxRef.current;\n\n if (isExpanded) {\n if (newWidth < collapseThreshold) {\n ctxRef.current.toggleExpanded();\n } else {\n ctxRef.current.setWidth(\n Math.min(Math.max(newWidth, minWidth), maxWidth)\n );\n }\n } else {\n if (newWidth > collapseThreshold) {\n ctxRef.current.toggleExpanded();\n }\n }\n };\n\n const onPointerUp = () => {\n setDragging(false);\n // Restore transition so collapse/expand animates.\n if (sidebarEl) sidebarEl.style.transitionProperty = '';\n window.removeEventListener('pointermove', onPointerMove);\n window.removeEventListener('pointerup', onPointerUp);\n };\n\n window.addEventListener('pointermove', onPointerMove);\n window.addEventListener('pointerup', onPointerUp);\n };\n\n const handleClick = () => {\n // Suppress click when the interaction was a drag.\n if (didDragRef.current) return;\n // Cancel any pending click timer (dblclick fires two clicks).\n if (clickTimerRef.current) clearTimeout(clickTimerRef.current);\n // Wait to see if a double-click follows.\n clickTimerRef.current = setTimeout(() => {\n toggleExpanded();\n }, 250);\n };\n\n const handleDoubleClick = () => {\n // Cancel the pending single-click toggle.\n if (clickTimerRef.current) {\n clearTimeout(clickTimerRef.current);\n clickTimerRef.current = null;\n }\n if (!expanded) toggleExpanded();\n ctxRef.current.setWidth(ctxRef.current.defaultWidth);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n const {\n minWidth,\n maxWidth,\n defaultWidth,\n width: w,\n setWidth: sw,\n expanded: exp,\n toggleExpanded: te,\n } = ctxRef.current;\n const step = 16;\n const growKey = dir === 'rtl' ? 'ArrowLeft' : 'ArrowRight';\n const shrinkKey = dir === 'rtl' ? 'ArrowRight' : 'ArrowLeft';\n if (e.key === growKey && exp) {\n e.preventDefault();\n sw(Math.min(w + step, maxWidth));\n } else if (e.key === growKey && !exp) {\n e.preventDefault();\n te();\n } else if (e.key === shrinkKey && exp) {\n e.preventDefault();\n const next = w - step;\n if (next < minWidth) {\n te();\n } else {\n sw(next);\n }\n } else if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n te();\n } else if (e.key === 'Home') {\n e.preventDefault();\n if (!exp) te();\n sw(defaultWidth);\n }\n };\n\n const handleTooltipOpenChange = (open: boolean) => {\n // Never open the tooltip while dragging.\n if (dragging) return;\n setTooltipOpen(open);\n };\n\n return (\n <Tooltip open={tooltipOpen} onOpenChange={handleTooltipOpenChange} trackCursorAxis=\"y\">\n <TooltipTrigger\n render={\n <div\n role=\"separator\"\n aria-orientation=\"vertical\"\n aria-label={ctx.resizeAriaLabel}\n className={cn(\n // 17px hit area, absolutely positioned on inline-end edge.\n // The sidebar's own border-e provides the visible 1px line; its color\n // changes via :has() on hover/active/focus-visible.\n 'absolute end-0 top-0 h-full w-[17px] ltr:translate-x-1/2 rtl:-translate-x-1/2 cursor-[var(--ui-resizable-cursor,ew-resize)] z-10',\n // On focus: 1px active-color line (after pseudo, CSS border for pixel-snap) + 3px box-shadow ring centered on it.\n 'after:absolute after:inset-y-0 after:inset-x-0 after:mx-auto after:w-0 after:pointer-events-none',\n 'after:[border-inline-start-width:var(--ui-resizable-border-width,1px)] after:border-solid after:border-transparent',\n 'focus-visible:outline-none focus-visible:after:[border-inline-start-color:var(--ui-resizable-border-color-active)] focus-visible:after:[box-shadow:0_0_0_3px_var(--ui-focus-primary)]'\n )}\n tabIndex={0}\n onKeyDown={handleKeyDown}\n onPointerDown={handlePointerDown}\n onClick={handleClick}\n onDoubleClick={handleDoubleClick}\n />\n }\n />\n {(expanded ? ctx.resizeTooltipExpanded : ctx.resizeTooltipCollapsed) !=\n null && (\n <TooltipContent side={dir === 'rtl' ? 'left' : 'right'} align=\"center\">\n {expanded ? ctx.resizeTooltipExpanded : ctx.resizeTooltipCollapsed}\n </TooltipContent>\n )}\n </Tooltip>\n );\n}\n\nconst SidebarSecondary = React.forwardRef<HTMLElement, SidebarSecondaryProps>(\n (\n {\n className,\n expanded: expandedProp,\n defaultExpanded = true,\n onExpandedChange,\n resizable: resizableProp = true,\n width: widthProp,\n onWidthChange,\n resizeAriaLabel = 'Resize sidebar',\n resizeTooltipExpanded = defaultResizeTooltipExpanded,\n resizeTooltipCollapsed = defaultResizeTooltipCollapsed,\n 'aria-label': ariaLabel = 'Section navigation',\n render,\n children,\n ...props\n },\n ref\n ) => {\n const [expanded, setExpanded] = useControllableBoolean(\n expandedProp,\n defaultExpanded,\n onExpandedChange\n );\n\n // Width is independent of expanded/collapsed — it persists across cycles.\n const [width, setWidthState] = React.useState(SIDEBAR_EXPANDED_WIDTH);\n const isWidthControlled = widthProp !== undefined;\n const currentWidth = isWidthControlled ? widthProp : width;\n const setWidth = React.useCallback(\n (next: number) => {\n if (!isWidthControlled) setWidthState(next);\n onWidthChange?.(next);\n },\n [isWidthControlled, onWidthChange]\n );\n\n // Collapse is driven by the consumer through the layout context — the\n // `SidebarSecondaryCollapseTrigger` calls `toggleExpanded`, which updates\n // uncontrolled state and always emits `onExpandedChange`. Controlled\n // consumers ignore the internal state and react to the callback.\n // Breadcrumb auto-wiring: Header and the selected MenuItem register their\n // labels so the collapsed breadcrumb can display them without manual props.\n const [headerLabel, setHeaderLabel] =\n React.useState<React.ReactNode>(undefined);\n const [selectedLabel, setSelectedLabel] =\n React.useState<React.ReactNode>(undefined);\n\n const context = React.useMemo<SidebarSecondaryContextValue>(\n () => ({\n expanded,\n toggleExpanded: () => setExpanded(!expanded),\n resizable: resizableProp,\n width: currentWidth,\n setWidth,\n minWidth: SIDEBAR_EXPANDED_WIDTH,\n maxWidth: SIDEBAR_MAX_WIDTH,\n defaultWidth: SIDEBAR_EXPANDED_WIDTH,\n headerLabel,\n setHeaderLabel,\n selectedLabel,\n setSelectedLabel,\n resizeAriaLabel,\n resizeTooltipExpanded,\n resizeTooltipCollapsed,\n }),\n [\n expanded,\n setExpanded,\n resizableProp,\n currentWidth,\n setWidth,\n headerLabel,\n selectedLabel,\n resizeAriaLabel,\n resizeTooltipExpanded,\n resizeTooltipCollapsed,\n ]\n );\n\n // When resizable + expanded, apply inline width ONLY when the user has\n // actively resized (or width is controlled). Otherwise the CSS token\n // `--ui-sidebar-secondary-expanded-container-width` drives the width,\n // so brand overrides are honoured and no inline style wins specificity.\n const hasWidthOverride =\n isWidthControlled \|\| currentWidth !== SIDEBAR_EXPANDED_WIDTH;\n const inlineStyle: React.CSSProperties \| undefined =\n resizableProp && expanded && hasWidthOverride\n ? { width: currentWidth }\n : undefined;\n\n const element = useRender({\n render,\n ref,\n defaultTagName: 'nav',\n props: mergeProps<'nav'>(\n {\n 'aria-label': ariaLabel,\n // `data-state` drives every collapsed/expanded token switch via\n // attribute selectors; typed loosely because React's nav attribute\n // map doesn't include arbitrary data- keys as literals.\n ...({ 'data-state': expanded ? 'expanded' : 'collapsed' } as Record<\n string,\n string\n >),\n style: inlineStyle,\n className: cn(\n 'group/sidebar relative flex h-full flex-col bg-[var(--ui-sidebar-secondary-global-container-color)] border-e border-[var(--ui-sidebar-secondary-global-container-border-color)] [border-inline-end-width:var(--ui-sidebar-secondary-global-container-border-width)] w-[var(--ui-sidebar-secondary-collapsed-container-width)] data-[state=expanded]:w-[var(--ui-sidebar-secondary-expanded-container-width)] transition-[width]',\n resizableProp &&\n 'transition-[width,border-color] has-[[role=separator]:hover]:[border-inline-end-color:var(--ui-resizable-border-color-hover)] has-[[role=separator]:active]:[border-inline-end-color:var(--ui-resizable-border-color-active)] has-[[role=separator]:focus-visible]:[border-inline-end-color:var(--ui-resizable-border-color-active)]',\n className\n ),\n children: (\n <>\n <SidebarSecondaryCollapsedBreadcrumb />\n {children}\n <SidebarSecondaryResizeEdge />\n </>\n ),\n },\n props\n ),\n });\n\n return (\n <SidebarSecondaryContext.Provider value={context}>\n {element}\n </SidebarSecondaryContext.Provider>\n );\n }\n);\nSidebarSecondary.displayName = 'SidebarSecondary';\n\nexport interface SidebarSecondaryHeaderProps extends React.ComponentPropsWithoutRef<'div'> {\n /** Heading text (or pass as children). /\n label?: React.ReactNode;\n}\n\nconst SidebarSecondaryHeader = React.forwardRef<\n HTMLDivElement,\n SidebarSecondaryHeaderProps\n>(({ className, label, children, ...props }, ref) => {\n const { setHeaderLabel } = useSidebarSecondaryContext();\n const resolvedLabel = label ?? children;\n\n // Register the header text so the collapsed breadcrumb can auto-display it.\n React.useEffect(() => {\n setHeaderLabel(resolvedLabel);\n }, [resolvedLabel, setHeaderLabel]);\n\n return (\n <div\n ref={ref}\n className={cn(\n 'hidden items-center shrink-0',\n 'group-data-[state=expanded]/sidebar:flex',\n 'px-[var(--ui-sidebar-secondary-global-container-header-padding-x)] py-[var(--ui-sidebar-secondary-global-container-header-padding-y)]',\n className\n )}\n {...props}\n >\n <h2 className=\"ui-sidebar-secondary-global-header-label-text-style truncate text-[var(--ui-sidebar-secondary-global-header-label-color)]\">\n {resolvedLabel}\n </h2>\n </div>\n );\n});\nSidebarSecondaryHeader.displayName = 'SidebarSecondaryHeader';\n\nconst SidebarSecondaryContent = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<'div'>\n>(({ className, ...props }, ref) => (\n // Expanded: the section list. Hidden in collapsed mode, where the\n // CollapsedBreadcrumb sibling takes over.\n <div\n ref={ref}\n className={cn(\n 'flex flex-1 flex-col overflow-y-auto gap-[var(--ui-sidebar-secondary-global-section-list-gap)]',\n 'hidden group-data-[state=expanded]/sidebar:flex',\n className\n )}\n {...props}\n />\n));\nSidebarSecondaryContent.displayName = 'SidebarSecondaryContent';\n\nexport interface SidebarSecondaryCollapsedBreadcrumbProps extends React.ComponentPropsWithoutRef<'div'> {\n /\n The parent section label (breadcrumbLabel).\n * Auto-derived from the `SidebarSecondaryHeader` label when omitted.\n /\n parentLabel?: React.ReactNode;\n /\n The current page label (labelCurrentPage).\n * Auto-derived from the selected `SidebarSecondaryMenuItem` when omitted.\n /\n currentLabel?: React.ReactNode;\n /* Separator between the two; defaults to a 16px ChevronDownIcon. /\n separator?: React.ReactNode;\n}\n\nconst SidebarSecondaryCollapsedBreadcrumb = React.forwardRef<\n HTMLDivElement,\n SidebarSecondaryCollapsedBreadcrumbProps\n>(({ className, parentLabel, currentLabel, separator, ...props }, ref) => {\n const { headerLabel, selectedLabel } = useSidebarSecondaryContext();\n const resolvedParent = parentLabel ?? headerLabel;\n const resolvedCurrent = currentLabel ?? selectedLabel;\n\n return (\n // Shown only in collapsed mode — toggled by the same data-[state] selector so\n // it stays in the DOM (SSR-present) with no JS branch. Laid out vertically:\n // parent → separator → current page.\n <div\n ref={ref}\n className={cn(\n 'flex flex-1 flex-col items-center min-h-0',\n 'gap-[var(--ui-sidebar-secondary-collapsed-container-content-gap)] py-[var(--ui-sidebar-secondary-collapsed-container-content-padding-y)]',\n 'flex group-data-[state=expanded]/sidebar:hidden',\n className\n )}\n {...props}\n >\n <span className=\"[writing-mode:vertical-rl] [direction:ltr] shrink-0 ui-sidebar-secondary-collapsed-breadcrumb-label-text-style text-[var(--ui-sidebar-secondary-collapsed-breadcrumb-label-color)]\">\n {resolvedParent}\n </span>\n <span\n aria-hidden=\"true\"\n className=\"inline-flex items-center text-[var(--ui-sidebar-secondary-collapsed-icon-separator-color)] [&>svg]:size-[var(--ui-sidebar-secondary-collapsed-icon-separator-size)]\"\n >\n {separator ?? <ChevronDownIcon size={16} />}\n </span>\n <span className=\"[writing-mode:vertical-rl] [direction:ltr] flex-1 min-h-0 overflow-hidden ui-sidebar-secondary-collapsed-label-current-page-text-style text-[var(--ui-sidebar-secondary-collapsed-label-current-page-color)]\">\n {resolvedCurrent}\n </span>\n </div>\n );\n});\nSidebarSecondaryCollapsedBreadcrumb.displayName =\n 'SidebarSecondaryCollapsedBreadcrumb';\n\nconst SidebarSecondaryFooter = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<'div'>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex flex-col shrink-0',\n 'border-t border-[var(--ui-sidebar-secondary-global-container-footer-border-color)] [border-top-width:var(--ui-sidebar-secondary-global-container-footer-border-width)]',\n 'py-[var(--ui-sidebar-secondary-section-container-padding-y)]',\n className\n )}\n {...props}\n />\n));\nSidebarSecondaryFooter.displayName = 'SidebarSecondaryFooter';\n\n// A section can be a static group (label + items) or an EXPANDABLE disclosure\n// (Figma Section `expandable=yes-`): the label becomes a chevron toggle that\n// shows/hides the whole item list. Whether a section is expandable is shared to\n// its label + menu via this context (default: static), so the same `SectionLabel`\n// / `Menu` parts adapt without a separate component set.\ninterface SidebarSecondarySectionContextValue {\n expandable: boolean;\n}\n\nconst SidebarSecondarySectionContext =\n React.createContext<SidebarSecondarySectionContextValue>({\n expandable: false,\n });\n\nconst SECTION_STATIC: SidebarSecondarySectionContextValue = {\n expandable: false,\n};\nconst SECTION_EXPANDABLE: SidebarSecondarySectionContextValue = {\n expandable: true,\n};\n\nexport interface SidebarSecondarySectionProps extends React.ComponentPropsWithoutRef<'div'> {\n /*\n Make the section a collapsible disclosure: the `SidebarSecondarySectionLabel`\n * becomes a chevron toggle and the `SidebarSecondaryMenu` becomes its panel.\n /\n expandable?: boolean;\n /* Controlled open state (expandable sections only). /\n open?: boolean;\n /* Uncontrolled initial open state (expandable sections only). Defaults to open. /\n defaultOpen?: boolean;\n /* Fires with the next open value when an expandable section toggles. /\n onOpenChange?: (open: boolean) => void;\n}\n\nconst SidebarSecondarySection = React.forwardRef<\n HTMLDivElement,\n SidebarSecondarySectionProps\n>(\n (\n {\n className,\n expandable = false,\n open,\n defaultOpen = true,\n onOpenChange,\n children,\n ...props\n },\n ref\n ) => {\n // Sections are separated by vertical padding + the section label; the next-gen\n // token sync removed the inter-section divider (no\n // `--ui-sidebar-secondary-section-container-border-` token survives).\n const sectionClass = cn(\n 'flex flex-col py-[var(--ui-sidebar-secondary-section-container-padding-y)]',\n className\n );\n\n if (!expandable) {\n return (\n <SidebarSecondarySectionContext.Provider value={SECTION_STATIC}>\n <div ref={ref} className={sectionClass} {...props}>\n {children}\n </div>\n </SidebarSecondarySectionContext.Provider>\n );\n }\n\n // Expandable: Base UI Collapsible owns the open state (controlled or\n // uncontrolled) + the aria-expanded/aria-controls wiring on the trigger.\n return (\n <SidebarSecondarySectionContext.Provider value={SECTION_EXPANDABLE}>\n <Collapsible.Root\n ref={ref}\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n render={<div className={sectionClass} />}\n {...props}\n >\n {children}\n </Collapsible.Root>\n </SidebarSecondarySectionContext.Provider>\n );\n }\n);\nSidebarSecondarySection.displayName = 'SidebarSecondarySection';\n\nexport interface SidebarSecondarySectionLabelProps extends React.ComponentPropsWithoutRef<'div'> {\n /** Trailing header actions (e.g. a ghost `ButtonIcon`). Rendered outside the toggle. /\n actions?: React.ReactNode;\n /\n A rollup badge (e.g. a `Tag` with an unread count) shown in the header only\n * when an expandable section is collapsed. Ignored for static sections.\n /\n unreadRollup?: React.ReactNode;\n}\n\nconst sectionLabelTextClass =\n 'ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-sidebar-secondary-section-label-section-color)]';\nconst sectionHeaderPadClass =\n 'min-h-[var(--ui-sidebar-secondary-menu-item-global-container-height-min)] py-[var(--ui-sidebar-secondary-section-container-header-padding-y)] px-[var(--ui-sidebar-secondary-section-container-header-padding-x)]';\n\nconst SidebarSecondarySectionLabel = React.forwardRef<\n HTMLDivElement,\n SidebarSecondarySectionLabelProps\n>(({ className, actions, unreadRollup, children, ...props }, ref) => {\n const { expandable } = React.useContext(SidebarSecondarySectionContext);\n const dir = useDocDir();\n const rowRef = React.useRef<HTMLDivElement>(null);\n const labelRef = React.useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing(labelRef, { enabled: true });\n const setRowRef = (node: HTMLDivElement \| null) => {\n rowRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n };\n\n // Anchored to the row (not the label span) so it lines up with the\n // sidebar's right edge regardless of how much the label shrinks for\n // trailing actions/rollup.\n const labelTooltip = (\n <Tooltip disabled={!isOverflowing}>\n <TooltipTrigger\n render={\n <span\n ref={labelRef}\n className=\"min-w-0 flex-1 truncate\"\n />\n }\n >\n {children}\n </TooltipTrigger>\n <TooltipContent anchor={rowRef} side={dir === 'rtl' ? 'left' : 'right'}>\n {children}\n </TooltipContent>\n </Tooltip>\n );\n\n if (!expandable) {\n // Static header: preserve the original markup when there are no actions so\n // existing layouts/baselines are unchanged.\n const base = cn(sectionLabelTextClass, sectionHeaderPadClass, className);\n if (actions == null) {\n return (\n <div\n ref={setRowRef}\n className={cn(\n base,\n 'flex items-center'\n )}\n {...props}\n >\n {labelTooltip}\n </div>\n );\n }\n return (\n <div\n ref={setRowRef}\n className={cn(\n base,\n 'flex items-center gap-[var(--ui-sidebar-secondary-section-container-header-gap)]'\n )}\n {...props}\n >\n {labelTooltip}\n <span className=\"flex shrink-0 items-center\">{actions}</span>\n </div>\n );\n }\n\n // Expandable header: a chevron toggle (the Collapsible trigger) plus optional\n // trailing actions kept OUTSIDE the trigger button (no nested buttons). The\n // unread-rollup badge sits inside the trigger and shows only while collapsed.\n return (\n <div\n ref={setRowRef}\n className={cn(\n 'flex items-center gap-[var(--ui-sidebar-secondary-section-container-header-gap)]',\n sectionHeaderPadClass,\n className\n )}\n {...props}\n >\n <Collapsible.Trigger\n className={cn(\n 'group/section flex min-w-0 flex-1 items-center gap-[var(--ui-sidebar-secondary-section-container-header-gap)] text-start cursor-pointer',\n sectionLabelTextClass,\n 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset'\n )}\n >\n <ChevronDownIcon\n size={16}\n aria-hidden=\"true\"\n className=\"shrink-0 ltr:-rotate-90 rtl:rotate-90 transition-transform group-data-[panel-open]/section:rotate-0 text-[var(--ui-sidebar-secondary-section-icon-arrow-color)]\"\n />\n {labelTooltip}\n {unreadRollup != null && (\n <span className=\"flex shrink-0 items-center group-data-[panel-open]/section:hidden\">\n {unreadRollup}\n </span>\n )}\n </Collapsible.Trigger>\n {actions != null && (\n <span className=\"flex shrink-0 items-center\">{actions}</span>\n )}\n </div>\n );\n});\nSidebarSecondarySectionLabel.displayName = 'SidebarSecondarySectionLabel';\n\nconst SidebarSecondaryMenu = React.forwardRef<\n HTMLUListElement,\n React.ComponentPropsWithoutRef<'ul'>\n>(({ className, ...props }, ref) => {\n const { expandable } = React.useContext(SidebarSecondarySectionContext);\n const list = (\n <ul\n ref={ref}\n className={cn(\n 'flex flex-col gap-[var(--ui-sidebar-secondary-section-menu-item-list-gap)]',\n className\n )}\n {...props}\n />\n );\n // Inside an expandable section the item list IS the collapsible panel, so it\n // mounts/unmounts with the section's open state.\n return expandable ? <Collapsible.Panel>{list}</Collapsible.Panel> : list;\n});\nSidebarSecondaryMenu.displayName = 'SidebarSecondaryMenu';\n\n// Shared row geometry + the GLOBAL icon/label state colors (shared across\n// selected/unselected — DESIGN §6.2). The cva `variant` only swaps the container\n// fill. Each interaction state is wired to its own token even where acronis's\n// value is unchanged (runtime var() references honor brand overrides only on the\n// referenced token).\nconst sidebarSecondaryRowClasses =\n 'group/row flex w-full items-start gap-[var(--ui-sidebar-secondary-menu-item-global-container-gap)] min-h-[var(--ui-sidebar-secondary-menu-item-global-container-height-min)] px-[var(--ui-sidebar-secondary-menu-item-global-container-padding-x)] py-[var(--ui-sidebar-secondary-menu-item-global-container-padding-y)] no-underline ui-sidebar-secondary-menu-item-global-label-text-style transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset text-[var(--ui-sidebar-secondary-menu-item-global-label-color-color)] [&_svg]:shrink-0 [&_svg]:size-[var(--ui-sidebar-secondary-menu-item-global-icon-size)] [&_svg]:text-[var(--ui-sidebar-secondary-menu-item-global-icon-color-color)]';\n\nconst sidebarSecondaryMenuItemVariants = cva(sidebarSecondaryRowClasses, {\n variants: {\n variant: {\n unselected:\n 'bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-idle)] hover:bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-hover)] active:bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-active)]',\n selected:\n 'bg-[var(--ui-sidebar-secondary-menu-item-selected-container-color-idle)] hover:bg-[var(--ui-sidebar-secondary-menu-item-selected-container-color-hover)] active:bg-[var(--ui-sidebar-secondary-menu-item-selected-container-color-active)]',\n },\n },\n defaultVariants: {\n variant: 'unselected',\n },\n});\n\nexport interface SidebarSecondaryMenuItemProps\n extends\n Omit<React.ComponentPropsWithoutRef<'a'>, 'children'>,\n Omit<VariantProps<typeof sidebarSecondaryMenuItemVariants>, 'variant'> {\n /* Marks the current route: sets the `selected` variant + `aria-current=\"page\"`. /\n selected?: boolean;\n /* Optional leading 16px icon (`hasIcon` in Figma). /\n icon?: React.ReactNode;\n /* Trailing extras (tag, shortcut, external-link icon — `hasExtras` in Figma). /\n extras?: React.ReactNode;\n children?: React.ReactNode;\n /* Replace the rendered `<a>` (e.g. a router `Link` or a `<button>`). /\n render?: useRender.RenderProp;\n}\n\nconst SidebarSecondaryMenuItem = React.forwardRef<\n HTMLAnchorElement,\n SidebarSecondaryMenuItemProps\n>(\n (\n { className, selected = false, icon, extras, render, children, ...props },\n ref\n ) => {\n const { expanded, setSelectedLabel } = useSidebarSecondaryContext();\n const { expandable } = React.useContext(SidebarSecondarySectionContext);\n const dir = useDocDir();\n const rowRef = React.useRef<HTMLAnchorElement>(null);\n const labelRef = React.useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing(labelRef, { enabled: expanded });\n\n // Register this item's label when selected so the collapsed breadcrumb\n // auto-displays the current page without manual props.\n React.useEffect(() => {\n if (selected) setSelectedLabel(children);\n }, [selected, children, setSelectedLabel]);\n\n const inner = useRender({\n render,\n ref: [ref, rowRef],\n defaultTagName: 'a',\n props: mergeProps<'a'>(\n {\n className: cn(\n sidebarSecondaryMenuItemVariants({\n variant: selected ? 'selected' : 'unselected',\n }),\n // Inside an expandable section, increase start padding so the\n // label aligns with the section header text (after chevron + gap)\n // while keeping the container full-width for hover/active fills.\n expandable &&\n 'ps-[calc(var(--ui-sidebar-secondary-menu-item-global-container-padding-x)+var(--ui-sidebar-secondary-section-container-header-gap)+16px)]',\n className\n ),\n 'aria-current': selected ? 'page' : undefined,\n onKeyDown: (e: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (e.key === ' ') {\n e.preventDefault();\n e.currentTarget.click();\n }\n },\n children: (\n <>\n {icon != null && (\n <span className=\"flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)]\">\n {icon}\n </span>\n )}\n {/ Keep the label in the DOM as `sr-only` in collapsed/rail mode so\n an icon-only row keeps an accessible name (a11y §7). The tooltip\n trigger is the label span itself — it only opens when the label\n is actually clipped. It's anchored to the row (not the label\n span) so it lines up with the sidebar's right edge regardless\n of how much the label shrinks for extras. /}\n <Tooltip disabled={!isOverflowing}>\n <TooltipTrigger\n render={\n <span\n ref={labelRef}\n className={cn(\n 'flex-1 min-w-[60px] truncate text-start',\n !expanded && 'sr-only'\n )}\n />\n }\n >\n {children}\n </TooltipTrigger>\n <TooltipContent\n anchor={rowRef}\n side={dir === 'rtl' ? 'left' : 'right'}\n >\n {children}\n </TooltipContent>\n </Tooltip>\n {extras}\n </>\n ),\n },\n props\n ),\n });\n\n return (\n <li className=\"contents\">\n {/ In collapsed/rail mode the label above is `sr-only` (zero-size), so\n it never receives the hover that would open its tooltip — wrap the\n whole row so the icon itself is hoverable and always shows the\n item's label as a tooltip while collapsed. /}\n <Tooltip disabled={expanded}>\n <TooltipTrigger render={inner} />\n <TooltipContent side={dir === 'rtl' ? 'left' : 'right'}>\n {children}\n </TooltipContent>\n </Tooltip>\n </li>\n );\n }\n);\nSidebarSecondaryMenuItem.displayName = 'SidebarSecondaryMenuItem';\n\nexport interface SidebarSecondaryMenuItemExtrasProps extends React.ComponentPropsWithoutRef<'span'> {\n /* Which trailing affordance to render. /\n variant: 'tag' \| 'externalLink' \| 'shortcut' \| 'tag-externalLink';\n /* Shortcut text for the `shortcut` variant. /\n shortcut?: string;\n /* Tag content for the `tag` / `tag-externalLink` variants. /\n tag?: React.ReactNode;\n}\n\nconst SidebarSecondaryMenuItemExtras = React.forwardRef<\n HTMLSpanElement,\n SidebarSecondaryMenuItemExtrasProps\n>(({ className, variant, shortcut, tag, children, ...props }, ref) => {\n const { expanded } = useSidebarSecondaryContext();\n const showTag = variant === 'tag' \|\| variant === 'tag-externalLink';\n const showExternal =\n variant === 'externalLink' \|\| variant === 'tag-externalLink';\n const showShortcut = variant === 'shortcut';\n\n return (\n <span\n ref={ref}\n className={cn(\n 'inline-flex items-center shrink-0 min-h-6 overflow-clip gap-[var(--ui-sidebar-secondary-menu-item-extras-global-container-gap)]',\n !expanded && 'hidden',\n className\n )}\n {...props}\n >\n {showTag && (tag ?? children)}\n {showShortcut && (\n <span className=\"ui-sidebar-secondary-menu-item-extras-global-shortcut-text-style text-[var(--ui-sidebar-secondary-menu-item-extras-global-shortcut-color)]\">\n {shortcut ?? children}\n </span>\n )}\n {showExternal && (\n <SquareArrowUpRightIcon\n size={16}\n className=\"text-[var(--ui-sidebar-secondary-menu-item-extras-global-external-icon-color)] size-[var(--ui-sidebar-secondary-menu-item-extras-global-external-icon-size)]\"\n />\n )}\n </span>\n );\n});\nSidebarSecondaryMenuItemExtras.displayName = 'SidebarSecondaryMenuItemExtras';\n\nexport interface SidebarSecondaryCollapseTriggerProps extends Omit<\n React.ComponentPropsWithoutRef<'button'>,\n 'children'\n> {\n /* Leading 16px icon (e.g. a panel-left glyph). Rotates 180° between expanded/collapsed — same as `SidebarPrimaryCollapseTrigger`. /\n icon?: React.ReactNode;\n /* Tooltip text shown when the sidebar is collapsed. Defaults to `'Expand'`. /\n expandTooltip?: React.ReactNode;\n /* Trailing extras (e.g. a keyboard shortcut hint), same slot as `SidebarSecondaryMenuItem`. */\n extras?: React.ReactNode;\n children?: React.ReactNode;\n}\n\n// The footer \"Collapse menu\" affordance. A row-styled `<button>` that flips the\n// panel width via the layout context — the live wiring for the controllable\n// `expanded` state (B1). Keeps its label as `sr-only` in collapsed mode.\n// When collapsed, wraps the button in a Tooltip showing \"Expand\".\nconst SidebarSecondaryCollapseTrigger = React.forwardRef<\n HTMLButtonElement,\n SidebarSecondaryCollapseTriggerProps\n>(\n (\n {\n className,\n icon,\n expandTooltip = 'Expand',\n extras,\n children,\n onClick,\n ...props\n },\n ref\n ) => {\n const { expanded, toggleExpanded } = useSidebarSecondaryContext();\n const dir = useDocDir();\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const labelRef = React.useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing(labelRef, { enabled: expanded });\n\n const button = (\n <button\n ref={(node) => {\n buttonRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n }}\n type=\"button\"\n aria-expanded={expanded}\n className={cn(\n sidebarSecondaryMenuItemVariants({ variant: 'unselected' }),\n 'text-start',\n className\n )}\n onClick={(event) => {\n onClick?.(event);\n if (!event.defaultPrevented) toggleExpanded();\n }}\n {...props}\n >\n {icon != null && (\n <span\n className={cn(\n 'flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)] transition-transform',\n expanded ? 'rtl:rotate-180' : 'ltr:rotate-180'\n )}\n >\n {icon}\n </span>\n )}\n <Tooltip disabled={!isOverflowing}>\n <TooltipTrigger\n render={\n <span\n ref={labelRef}\n className={cn('flex-1 min-w-[60px] truncate', !expanded && 'sr-only')}\n />\n }\n >\n {children}\n </TooltipTrigger>\n <TooltipContent anchor={buttonRef} side={dir === 'rtl' ? 'left' : 'right'}>\n {children}\n </TooltipContent>\n </Tooltip>\n {extras}\n </button>\n );\n\n return (\n <li className=\"contents\">\n <Tooltip disabled={expanded}>\n <TooltipTrigger render={button} />\n <TooltipContent side={dir === 'rtl' ? 'left' : 'right'}>\n {expandTooltip}\n </TooltipContent>\n </Tooltip>\n </li>\n );\n }\n);\nSidebarSecondaryCollapseTrigger.displayName = 'SidebarSecondaryCollapseTrigger';\n\nexport {\n SidebarSecondary,\n SidebarSecondaryHeader,\n SidebarSecondaryContent,\n SidebarSecondaryCollapsedBreadcrumb,\n SidebarSecondaryFooter,\n SidebarSecondarySection,\n SidebarSecondarySectionLabel,\n SidebarSecondaryMenu,\n SidebarSecondaryMenuItem,\n SidebarSecondaryMenuItemExtras,\n SidebarSecondaryCollapseTrigger,\n sidebarSecondaryMenuItemVariants,\n};\n"],"names":["useIsOverflowing","ref","enabled","isOverflowing","setIsOverflowing","React","element","measure","observer","SIDEBAR_EXPANDED_WIDTH","SIDEBAR_MAX_WIDTH","defaultResizeTooltipExpanded","jsxs","Fragment","jsx","defaultResizeTooltipCollapsed","SidebarSecondaryContext","useSidebarSecondaryContext","useControllableBoolean","controlled","defaultValue","onChange","uncontrolled","setUncontrolled","isControlled","value","setValue","next","SidebarSecondaryResizeEdge","ctx","expanded","toggleExpanded","resizable","dir","useDocDir","ctxRef","didDragRef","tooltipOpen","setTooltipOpen","dragging","setDragging","clickTimerRef","handlePointerDown","e","el","sidebarEl","isRtl","sidebarRect","minWidth","maxWidth","collapseThreshold","onPointerMove","ev","newWidth","isExpanded","onPointerUp","handleClick","handleDoubleClick","handleKeyDown","defaultWidth","w","sw","exp","te","step","growKey","shrinkKey","Tooltip","open","TooltipTrigger","cn","TooltipContent","SidebarSecondary","className","expandedProp","defaultExpanded","onExpandedChange","resizableProp","widthProp","onWidthChange","resizeAriaLabel","resizeTooltipExpanded","resizeTooltipCollapsed","ariaLabel","render","children","props","setExpanded","width","setWidthState","isWidthControlled","currentWidth","setWidth","headerLabel","setHeaderLabel","selectedLabel","setSelectedLabel","context","useRender","mergeProps","SidebarSecondaryCollapsedBreadcrumb","SidebarSecondaryHeader","label","resolvedLabel","SidebarSecondaryContent","parentLabel","currentLabel","separator","resolvedParent","resolvedCurrent","ChevronDownIcon","SidebarSecondaryFooter","SidebarSecondarySectionContext","SECTION_STATIC","SECTION_EXPANDABLE","SidebarSecondarySection","expandable","defaultOpen","onOpenChange","sectionClass","Collapsible","sectionLabelTextClass","sectionHeaderPadClass","SidebarSecondarySectionLabel","actions","unreadRollup","rowRef","labelRef","setRowRef","node","labelTooltip","base","SidebarSecondaryMenu","list","sidebarSecondaryRowClasses","sidebarSecondaryMenuItemVariants","cva","SidebarSecondaryMenuItem","selected","icon","extras","inner","SidebarSecondaryMenuItemExtras","variant","shortcut","tag","showTag","showExternal","showShortcut","SquareArrowUpRightIcon","SidebarSecondaryCollapseTrigger","expandTooltip","onClick","buttonRef","button","event"],"mappings":"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"}
1	+ {"version":3,"file":"sidebar-secondary.js","names":[],"sources":["../../../../src/components/ui/sidebar-secondary/sidebar-secondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mergeProps } from '@base-ui/react/merge-props';\nimport { useRender } from '@base-ui/react/use-render';\nimport { Collapsible } from '@base-ui/react/collapsible';\nimport {\n ChevronDownIcon,\n SquareArrowUpRightIcon,\n} from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { useDocDir } from '@/lib/use-doc-dir';\nimport {\n Tooltip,\n TooltipContent,\n TooltipTrigger,\n} from '@/components/ui/tooltip';\n\n/*\n Tracks whether `ref`'s element is clipping its own content (`scrollWidth >\n * clientWidth`) — used to gate a tooltip so it only opens when a truncated\n * label is actually cut off. Re-measures via `ResizeObserver` (covers the\n * rail's expand/collapse width transition); `enabled` skips measurement\n * entirely (e.g. while collapsed, where the label is `sr-only`).\n /\nfunction useIsOverflowing<T extends Element>(\n ref: React.RefObject<T \| null>,\n { enabled }: { enabled: boolean }\n): boolean {\n const [isOverflowing, setIsOverflowing] = React.useState(false);\n\n React.useEffect(() => {\n const element = ref.current;\n if (!enabled \|\| !element) {\n setIsOverflowing(false);\n return;\n }\n const measure = () =>\n setIsOverflowing(element.scrollWidth > element.clientWidth);\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(element);\n return () => observer.disconnect();\n }, [ref, enabled]);\n\n return isOverflowing;\n}\n\n// Resize constraints — mirrors the design-token defaults.\n// CSS still uses `var(--ui-sidebar-secondary-expanded-container-width)` so\n// brands that override the token get the correct visual width; these JS\n// constants only govern the drag-resize clamping range.\nconst SIDEBAR_EXPANDED_WIDTH = 256; // --ui-sidebar-secondary-expanded-container-width\nconst SIDEBAR_MAX_WIDTH = SIDEBAR_EXPANDED_WIDTH 2;\n\n// Composable SidebarSecondary primitives mirroring the Figma \"SidebarSecondary\"\n// component set (node 2468:59502, variant expanded\|collapsed). Every color and\n// metric is wired to a next-gen `--ui-sidebar-secondary-` token from\n// @acronis-platform/tokens-pd — no hex, no invented tokens.\n//\n// Like SidebarPrimary, expanded/collapsed is a width-reflow state (not a panel\n// show/hide), modelled as a controlled/uncontrolled `expanded` prop (default\n// true) that sets `data-state=\"expanded\|collapsed\"` on the root and is shared to\n// descendants via context. The collapsed rail replaces the section list with a\n// vertical breadcrumb (parent → separator → current page), toggled purely by the\n// `data-[state]` selectors so it is SSR-present and needs no JS branch.\n//\n// Menu-item color wiring DIVERGES from Primary (DESIGN §6.2): Secondary recolors\n// only the CONTAINER per selected/unselected; the icon and label use the shared\n// `--ui-sidebar-secondary-menu-item-global-{icon,label}-color-color` tokens\n// across both variants and every interaction state (the next-gen token sync\n// collapsed the former per-state idle/hover/active icon+label colors into a\n// single value each). So the cva base carries the global icon/label colors and\n// the two variants only swap the container fill.\n//\n// R6 (collapsed separator icon): resolved from the Figma node metadata — the\n// collapsed `iconSeparator` instance's mainComponent is \"ChevronDown\" (updated\n// from ChevronRight), so the separator defaults to `ChevronDownIcon` (16px),\n// tinted by `--ui-sidebar-secondary-collapsed-icon-separator-color`. In the\n// vertical breadcrumb flow (writing-mode: vertical-rl) the downward chevron\n// visually points \"forward\" in the reading direction. The disclosure chevron\n// uses `ChevronDownIcon` rotated via `data-panel-open`. The focus ring reuses the\n// shared `--ui-focus-brand` (no sidebar focus token exists — R1).\n\nconst defaultResizeTooltipExpanded = (\n <>\n <span className=\"font-semibold\">Resize:</span> Drag\n <br />\n <span className=\"font-semibold\">Collapse:</span> Click\n <br />\n <span className=\"font-semibold\">Reset size:</span> Double click\n </>\n);\n\nconst defaultResizeTooltipCollapsed = (\n <>\n <span className=\"font-semibold\">Resize:</span> Drag\n <br />\n <span className=\"font-semibold\">Expand:</span> Click\n </>\n);\n\ninterface SidebarSecondaryContextValue {\n expanded: boolean;\n /* Flip the panel width — drives the controlled/uncontrolled `expanded` state. /\n toggleExpanded: () => void;\n /* Whether resize is enabled. /\n resizable: boolean;\n /* Current width in px (only meaningful when resizable + expanded). /\n width: number;\n /* Update the width (used by the resize edge during drag). /\n setWidth: (width: number) => void;\n /* Min resize width — derived from `--ui-sidebar-secondary-expanded-container-width`. /\n minWidth: number;\n /* Max resize width — expanded-width × RESIZE_MAX_WIDTH_FACTOR. /\n maxWidth: number;\n /* Default (reset) width — equals expanded-container-width token. /\n defaultWidth: number;\n /* Label registered by `SidebarSecondaryHeader` — consumed by the collapsed breadcrumb. /\n headerLabel: React.ReactNode;\n /* Register the header label (called by `SidebarSecondaryHeader`). /\n setHeaderLabel: (label: React.ReactNode) => void;\n /* Label of the currently selected `MenuItem` — consumed by the collapsed breadcrumb. /\n selectedLabel: React.ReactNode;\n /* Register the selected item label (called by `SidebarSecondaryMenuItem`). /\n setSelectedLabel: (label: React.ReactNode) => void;\n /* Accessible label for the resize edge separator. /\n resizeAriaLabel: string;\n /* Tooltip content shown when the sidebar is expanded. /\n resizeTooltipExpanded: React.ReactNode;\n /* Tooltip content shown when the sidebar is collapsed. /\n resizeTooltipCollapsed: React.ReactNode;\n}\n\nconst SidebarSecondaryContext =\n React.createContext<SidebarSecondaryContextValue \| null>(null);\n\nfunction useSidebarSecondaryContext(): SidebarSecondaryContextValue {\n // Default to expanded so parts render standalone (in isolation tests /\n // stories) without a wrapping root; the toggle is a no-op outside a root.\n return (\n React.useContext(SidebarSecondaryContext) ?? {\n expanded: true,\n toggleExpanded: () => {},\n resizable: false,\n width: SIDEBAR_EXPANDED_WIDTH,\n setWidth: () => {},\n minWidth: SIDEBAR_EXPANDED_WIDTH,\n maxWidth: SIDEBAR_MAX_WIDTH,\n defaultWidth: SIDEBAR_EXPANDED_WIDTH,\n headerLabel: undefined,\n setHeaderLabel: () => {},\n selectedLabel: undefined,\n setSelectedLabel: () => {},\n resizeAriaLabel: 'Resize sidebar',\n resizeTooltipExpanded: defaultResizeTooltipExpanded,\n resizeTooltipCollapsed: defaultResizeTooltipCollapsed,\n }\n );\n}\n\n/\n Controlled + uncontrolled boolean state (the Base UI idiom). When `controlled`\n * is provided it wins and the setter only emits the change callback; otherwise\n * the setter updates internal state. `onChange` is ALWAYS invoked with the next\n * value so a consumer can react in either mode.\n /\nfunction useControllableBoolean(\n controlled: boolean \| undefined,\n defaultValue: boolean,\n onChange?: (next: boolean) => void\n): [boolean, (next: boolean) => void] {\n const [uncontrolled, setUncontrolled] = React.useState(defaultValue);\n const isControlled = controlled !== undefined;\n const value = isControlled ? controlled : uncontrolled;\n const setValue = React.useCallback(\n (next: boolean) => {\n if (!isControlled) setUncontrolled(next);\n onChange?.(next);\n },\n [isControlled, onChange]\n );\n return [value, setValue];\n}\n\nexport interface SidebarSecondaryProps extends React.ComponentPropsWithoutRef<'nav'> {\n /* Controlled expanded (rail width) state. /\n expanded?: boolean;\n /* Uncontrolled initial expanded state. Defaults to `true` (full width). /\n defaultExpanded?: boolean;\n /* Fires when the expanded state changes (e.g. a consumer toggle). /\n onExpandedChange?: (expanded: boolean) => void;\n /\n Enable the draggable resize edge on the right border.\n * When `true`, the sidebar can be resized between the expanded-width token\n * and twice that value.\n /\n resizable?: boolean;\n /* Controlled width in px (only used when `resizable`). /\n width?: number;\n /* Fires when the width changes due to a drag interaction. /\n onWidthChange?: (width: number) => void;\n /* Accessible label for the resize edge (`role=\"separator\"`). Defaults to `'Resize sidebar'`. /\n resizeAriaLabel?: string;\n /* Tooltip content shown when the sidebar is expanded. Pass `null` to hide the tooltip entirely. /\n resizeTooltipExpanded?: React.ReactNode;\n /* Tooltip content shown when the sidebar is collapsed. Pass `null` to hide the tooltip entirely. /\n resizeTooltipCollapsed?: React.ReactNode;\n /\n Replace the rendered `<nav>` with another element or component\n * (Base UI composition). Accepts a React element or a render function.\n /\n render?: useRender.RenderProp;\n}\n\n// ---------------------------------------------------------------------------\n// SidebarSecondaryResizeEdge — internal drag/click handle on the right edge\n// ---------------------------------------------------------------------------\n// Styled after `ResizableHandle` (Figma 4649:6681): a hit area that takes up no\n// layout space around a 1px divider, idle → `--ui-border-on-surface-border`,\n// hover → `--ui-resizable-border-color-hover`,\n// drag → `--ui-resizable-border-color-active`.\n// ---------------------------------------------------------------------------\n\nfunction SidebarSecondaryResizeEdge() {\n const ctx = useSidebarSecondaryContext();\n const { expanded, toggleExpanded, resizable } = ctx;\n const dir = useDocDir();\n\n // Mutable ref so the closure-captured pointermove handler always reads\n // the latest context without re-attaching listeners.\n const ctxRef = React.useRef(ctx);\n ctxRef.current = ctx;\n\n // Track whether a pointermove actually happened between down→up so we can\n // suppress the click that the browser fires after every pointerup.\n const didDragRef = React.useRef(false);\n\n // Hide the tooltip while dragging.\n const [tooltipOpen, setTooltipOpen] = React.useState(false);\n const [dragging, setDragging] = React.useState(false);\n\n // Delay single-click so a double-click can cancel it.\n const clickTimerRef = React.useRef<ReturnType<typeof setTimeout> \| null>(\n null\n );\n\n // Clear any pending click timer on unmount.\n React.useEffect(() => {\n return () => {\n if (clickTimerRef.current) clearTimeout(clickTimerRef.current);\n };\n }, []);\n\n if (!resizable) return null;\n\n const handlePointerDown = (e: React.PointerEvent<HTMLDivElement>) => {\n e.preventDefault();\n const el = e.currentTarget;\n el.setPointerCapture(e.pointerId);\n didDragRef.current = false;\n setDragging(true);\n setTooltipOpen(false);\n\n // Disable the width transition while dragging so resize follows the\n // cursor without animation lag.\n const sidebarEl = el.closest('[data-state]') as HTMLElement \| null;\n if (!sidebarEl) {\n setDragging(false);\n el.releasePointerCapture(e.pointerId);\n return;\n }\n sidebarEl.style.transitionProperty = 'none';\n const isRtl = getComputedStyle(sidebarEl).direction === 'rtl';\n const sidebarRect = sidebarEl.getBoundingClientRect();\n\n const { minWidth, maxWidth } = ctxRef.current;\n const collapseThreshold = minWidth / 2;\n\n const onPointerMove = (ev: PointerEvent) => {\n didDragRef.current = true;\n const newWidth = isRtl\n ? sidebarRect.right - ev.clientX\n : ev.clientX - sidebarRect.left;\n const { expanded: isExpanded } = ctxRef.current;\n\n if (isExpanded) {\n if (newWidth < collapseThreshold) {\n ctxRef.current.toggleExpanded();\n } else {\n ctxRef.current.setWidth(\n Math.min(Math.max(newWidth, minWidth), maxWidth)\n );\n }\n } else {\n if (newWidth > collapseThreshold) {\n ctxRef.current.toggleExpanded();\n }\n }\n };\n\n const onPointerUp = () => {\n setDragging(false);\n // Restore transition so collapse/expand animates.\n if (sidebarEl) sidebarEl.style.transitionProperty = '';\n window.removeEventListener('pointermove', onPointerMove);\n window.removeEventListener('pointerup', onPointerUp);\n };\n\n window.addEventListener('pointermove', onPointerMove);\n window.addEventListener('pointerup', onPointerUp);\n };\n\n const handleClick = () => {\n // Suppress click when the interaction was a drag.\n if (didDragRef.current) return;\n // Cancel any pending click timer (dblclick fires two clicks).\n if (clickTimerRef.current) clearTimeout(clickTimerRef.current);\n // Wait to see if a double-click follows.\n clickTimerRef.current = setTimeout(() => {\n toggleExpanded();\n }, 250);\n };\n\n const handleDoubleClick = () => {\n // Cancel the pending single-click toggle.\n if (clickTimerRef.current) {\n clearTimeout(clickTimerRef.current);\n clickTimerRef.current = null;\n }\n if (!expanded) toggleExpanded();\n ctxRef.current.setWidth(ctxRef.current.defaultWidth);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n const {\n minWidth,\n maxWidth,\n defaultWidth,\n width: w,\n setWidth: sw,\n expanded: exp,\n toggleExpanded: te,\n } = ctxRef.current;\n const step = 16;\n const growKey = dir === 'rtl' ? 'ArrowLeft' : 'ArrowRight';\n const shrinkKey = dir === 'rtl' ? 'ArrowRight' : 'ArrowLeft';\n if (e.key === growKey && exp) {\n e.preventDefault();\n sw(Math.min(w + step, maxWidth));\n } else if (e.key === growKey && !exp) {\n e.preventDefault();\n te();\n } else if (e.key === shrinkKey && exp) {\n e.preventDefault();\n const next = w - step;\n if (next < minWidth) {\n te();\n } else {\n sw(next);\n }\n } else if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n te();\n } else if (e.key === 'Home') {\n e.preventDefault();\n if (!exp) te();\n sw(defaultWidth);\n }\n };\n\n const handleTooltipOpenChange = (open: boolean) => {\n // Never open the tooltip while dragging.\n if (dragging) return;\n setTooltipOpen(open);\n };\n\n return (\n <Tooltip open={tooltipOpen} onOpenChange={handleTooltipOpenChange} trackCursorAxis=\"y\">\n <TooltipTrigger\n render={\n <div\n role=\"separator\"\n aria-orientation=\"vertical\"\n aria-label={ctx.resizeAriaLabel}\n className={cn(\n // 17px hit area, absolutely positioned on inline-end edge.\n // The sidebar's own border-e provides the visible 1px line; its color\n // changes via :has() on hover/active/focus-visible.\n 'absolute end-0 top-0 h-full w-[17px] ltr:translate-x-1/2 rtl:-translate-x-1/2 cursor-[var(--ui-resizable-cursor,ew-resize)] z-10',\n // On focus: 1px active-color line (after pseudo, CSS border for pixel-snap) + 3px box-shadow ring centered on it.\n 'after:absolute after:inset-y-0 after:inset-x-0 after:mx-auto after:w-0 after:pointer-events-none',\n 'after:[border-inline-start-width:var(--ui-resizable-border-width,1px)] after:border-solid after:border-transparent',\n 'focus-visible:outline-none focus-visible:after:[border-inline-start-color:var(--ui-resizable-border-color-active)] focus-visible:after:[box-shadow:0_0_0_3px_var(--ui-focus-primary)]'\n )}\n tabIndex={0}\n onKeyDown={handleKeyDown}\n onPointerDown={handlePointerDown}\n onClick={handleClick}\n onDoubleClick={handleDoubleClick}\n />\n }\n />\n {(expanded ? ctx.resizeTooltipExpanded : ctx.resizeTooltipCollapsed) !=\n null && (\n <TooltipContent side={dir === 'rtl' ? 'left' : 'right'} align=\"center\">\n {expanded ? ctx.resizeTooltipExpanded : ctx.resizeTooltipCollapsed}\n </TooltipContent>\n )}\n </Tooltip>\n );\n}\n\nconst SidebarSecondary = React.forwardRef<HTMLElement, SidebarSecondaryProps>(\n (\n {\n className,\n expanded: expandedProp,\n defaultExpanded = true,\n onExpandedChange,\n resizable: resizableProp = true,\n width: widthProp,\n onWidthChange,\n resizeAriaLabel = 'Resize sidebar',\n resizeTooltipExpanded = defaultResizeTooltipExpanded,\n resizeTooltipCollapsed = defaultResizeTooltipCollapsed,\n 'aria-label': ariaLabel = 'Section navigation',\n render,\n children,\n ...props\n },\n ref\n ) => {\n const [expanded, setExpanded] = useControllableBoolean(\n expandedProp,\n defaultExpanded,\n onExpandedChange\n );\n\n // Width is independent of expanded/collapsed — it persists across cycles.\n const [width, setWidthState] = React.useState(SIDEBAR_EXPANDED_WIDTH);\n const isWidthControlled = widthProp !== undefined;\n const currentWidth = isWidthControlled ? widthProp : width;\n const setWidth = React.useCallback(\n (next: number) => {\n if (!isWidthControlled) setWidthState(next);\n onWidthChange?.(next);\n },\n [isWidthControlled, onWidthChange]\n );\n\n // Collapse is driven by the consumer through the layout context — the\n // `SidebarSecondaryCollapseTrigger` calls `toggleExpanded`, which updates\n // uncontrolled state and always emits `onExpandedChange`. Controlled\n // consumers ignore the internal state and react to the callback.\n // Breadcrumb auto-wiring: Header and the selected MenuItem register their\n // labels so the collapsed breadcrumb can display them without manual props.\n const [headerLabel, setHeaderLabel] =\n React.useState<React.ReactNode>(undefined);\n const [selectedLabel, setSelectedLabel] =\n React.useState<React.ReactNode>(undefined);\n\n const context = React.useMemo<SidebarSecondaryContextValue>(\n () => ({\n expanded,\n toggleExpanded: () => setExpanded(!expanded),\n resizable: resizableProp,\n width: currentWidth,\n setWidth,\n minWidth: SIDEBAR_EXPANDED_WIDTH,\n maxWidth: SIDEBAR_MAX_WIDTH,\n defaultWidth: SIDEBAR_EXPANDED_WIDTH,\n headerLabel,\n setHeaderLabel,\n selectedLabel,\n setSelectedLabel,\n resizeAriaLabel,\n resizeTooltipExpanded,\n resizeTooltipCollapsed,\n }),\n [\n expanded,\n setExpanded,\n resizableProp,\n currentWidth,\n setWidth,\n headerLabel,\n selectedLabel,\n resizeAriaLabel,\n resizeTooltipExpanded,\n resizeTooltipCollapsed,\n ]\n );\n\n // When resizable + expanded, apply inline width ONLY when the user has\n // actively resized (or width is controlled). Otherwise the CSS token\n // `--ui-sidebar-secondary-expanded-container-width` drives the width,\n // so brand overrides are honoured and no inline style wins specificity.\n const hasWidthOverride =\n isWidthControlled \|\| currentWidth !== SIDEBAR_EXPANDED_WIDTH;\n const inlineStyle: React.CSSProperties \| undefined =\n resizableProp && expanded && hasWidthOverride\n ? { width: currentWidth }\n : undefined;\n\n const element = useRender({\n render,\n ref,\n defaultTagName: 'nav',\n props: mergeProps<'nav'>(\n {\n 'aria-label': ariaLabel,\n // `data-state` drives every collapsed/expanded token switch via\n // attribute selectors; typed loosely because React's nav attribute\n // map doesn't include arbitrary data- keys as literals.\n ...({ 'data-state': expanded ? 'expanded' : 'collapsed' } as Record<\n string,\n string\n >),\n style: inlineStyle,\n className: cn(\n 'group/sidebar relative flex h-full flex-col bg-[var(--ui-sidebar-secondary-global-container-color)] border-e border-[var(--ui-sidebar-secondary-global-container-border-color)] [border-inline-end-width:var(--ui-sidebar-secondary-global-container-border-width)] w-[var(--ui-sidebar-secondary-collapsed-container-width)] data-[state=expanded]:w-[var(--ui-sidebar-secondary-expanded-container-width)] transition-[width]',\n resizableProp &&\n 'transition-[width,border-color] has-[[role=separator]:hover]:[border-inline-end-color:var(--ui-resizable-border-color-hover)] has-[[role=separator]:active]:[border-inline-end-color:var(--ui-resizable-border-color-active)] has-[[role=separator]:focus-visible]:[border-inline-end-color:var(--ui-resizable-border-color-active)]',\n className\n ),\n children: (\n <>\n <SidebarSecondaryCollapsedBreadcrumb />\n {children}\n <SidebarSecondaryResizeEdge />\n </>\n ),\n },\n props\n ),\n });\n\n return (\n <SidebarSecondaryContext.Provider value={context}>\n {element}\n </SidebarSecondaryContext.Provider>\n );\n }\n);\nSidebarSecondary.displayName = 'SidebarSecondary';\n\nexport interface SidebarSecondaryHeaderProps extends React.ComponentPropsWithoutRef<'div'> {\n /** Heading text (or pass as children). /\n label?: React.ReactNode;\n}\n\nconst SidebarSecondaryHeader = React.forwardRef<\n HTMLDivElement,\n SidebarSecondaryHeaderProps\n>(({ className, label, children, ...props }, ref) => {\n const { setHeaderLabel } = useSidebarSecondaryContext();\n const resolvedLabel = label ?? children;\n\n // Register the header text so the collapsed breadcrumb can auto-display it.\n React.useEffect(() => {\n setHeaderLabel(resolvedLabel);\n }, [resolvedLabel, setHeaderLabel]);\n\n return (\n <div\n ref={ref}\n className={cn(\n 'hidden items-center shrink-0',\n 'group-data-[state=expanded]/sidebar:flex',\n 'px-[var(--ui-sidebar-secondary-global-container-header-padding-x)] py-[var(--ui-sidebar-secondary-global-container-header-padding-y)]',\n className\n )}\n {...props}\n >\n <h2 className=\"ui-sidebar-secondary-global-header-label-text-style truncate text-[var(--ui-sidebar-secondary-global-header-label-color)]\">\n {resolvedLabel}\n </h2>\n </div>\n );\n});\nSidebarSecondaryHeader.displayName = 'SidebarSecondaryHeader';\n\nconst SidebarSecondaryContent = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<'div'>\n>(({ className, ...props }, ref) => (\n // Expanded: the section list. Hidden in collapsed mode, where the\n // CollapsedBreadcrumb sibling takes over.\n <div\n ref={ref}\n className={cn(\n 'flex flex-1 flex-col overflow-y-auto gap-[var(--ui-sidebar-secondary-global-section-list-gap)]',\n 'hidden group-data-[state=expanded]/sidebar:flex',\n className\n )}\n {...props}\n />\n));\nSidebarSecondaryContent.displayName = 'SidebarSecondaryContent';\n\nexport interface SidebarSecondaryCollapsedBreadcrumbProps extends React.ComponentPropsWithoutRef<'div'> {\n /\n The parent section label (breadcrumbLabel).\n * Auto-derived from the `SidebarSecondaryHeader` label when omitted.\n /\n parentLabel?: React.ReactNode;\n /\n The current page label (labelCurrentPage).\n * Auto-derived from the selected `SidebarSecondaryMenuItem` when omitted.\n /\n currentLabel?: React.ReactNode;\n /* Separator between the two; defaults to a 16px ChevronDownIcon. /\n separator?: React.ReactNode;\n}\n\nconst SidebarSecondaryCollapsedBreadcrumb = React.forwardRef<\n HTMLDivElement,\n SidebarSecondaryCollapsedBreadcrumbProps\n>(({ className, parentLabel, currentLabel, separator, ...props }, ref) => {\n const { headerLabel, selectedLabel } = useSidebarSecondaryContext();\n const resolvedParent = parentLabel ?? headerLabel;\n const resolvedCurrent = currentLabel ?? selectedLabel;\n\n return (\n // Shown only in collapsed mode — toggled by the same data-[state] selector so\n // it stays in the DOM (SSR-present) with no JS branch. Laid out vertically:\n // parent → separator → current page.\n <div\n ref={ref}\n className={cn(\n 'flex flex-1 flex-col items-center min-h-0',\n 'gap-[var(--ui-sidebar-secondary-collapsed-container-content-gap)] py-[var(--ui-sidebar-secondary-collapsed-container-content-padding-y)]',\n 'flex group-data-[state=expanded]/sidebar:hidden',\n className\n )}\n {...props}\n >\n <span className=\"[writing-mode:vertical-rl] [direction:ltr] shrink-0 ui-sidebar-secondary-collapsed-breadcrumb-label-text-style text-[var(--ui-sidebar-secondary-collapsed-breadcrumb-label-color)]\">\n {resolvedParent}\n </span>\n <span\n aria-hidden=\"true\"\n className=\"inline-flex items-center text-[var(--ui-sidebar-secondary-collapsed-icon-separator-color)] [&>svg]:size-[var(--ui-sidebar-secondary-collapsed-icon-separator-size)]\"\n >\n {separator ?? <ChevronDownIcon size={16} />}\n </span>\n <span className=\"[writing-mode:vertical-rl] [direction:ltr] flex-1 min-h-0 overflow-hidden ui-sidebar-secondary-collapsed-label-current-page-text-style text-[var(--ui-sidebar-secondary-collapsed-label-current-page-color)]\">\n {resolvedCurrent}\n </span>\n </div>\n );\n});\nSidebarSecondaryCollapsedBreadcrumb.displayName =\n 'SidebarSecondaryCollapsedBreadcrumb';\n\nconst SidebarSecondaryFooter = React.forwardRef<\n HTMLDivElement,\n React.ComponentPropsWithoutRef<'div'>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex flex-col shrink-0',\n 'border-t border-[var(--ui-sidebar-secondary-global-container-footer-border-color)] [border-top-width:var(--ui-sidebar-secondary-global-container-footer-border-width)]',\n 'py-[var(--ui-sidebar-secondary-section-container-padding-y)]',\n className\n )}\n {...props}\n />\n));\nSidebarSecondaryFooter.displayName = 'SidebarSecondaryFooter';\n\n// A section can be a static group (label + items) or an EXPANDABLE disclosure\n// (Figma Section `expandable=yes-`): the label becomes a chevron toggle that\n// shows/hides the whole item list. Whether a section is expandable is shared to\n// its label + menu via this context (default: static), so the same `SectionLabel`\n// / `Menu` parts adapt without a separate component set.\ninterface SidebarSecondarySectionContextValue {\n expandable: boolean;\n}\n\nconst SidebarSecondarySectionContext =\n React.createContext<SidebarSecondarySectionContextValue>({\n expandable: false,\n });\n\nconst SECTION_STATIC: SidebarSecondarySectionContextValue = {\n expandable: false,\n};\nconst SECTION_EXPANDABLE: SidebarSecondarySectionContextValue = {\n expandable: true,\n};\n\nexport interface SidebarSecondarySectionProps extends React.ComponentPropsWithoutRef<'div'> {\n /*\n Make the section a collapsible disclosure: the `SidebarSecondarySectionLabel`\n * becomes a chevron toggle and the `SidebarSecondaryMenu` becomes its panel.\n /\n expandable?: boolean;\n /* Controlled open state (expandable sections only). /\n open?: boolean;\n /* Uncontrolled initial open state (expandable sections only). Defaults to open. /\n defaultOpen?: boolean;\n /* Fires with the next open value when an expandable section toggles. /\n onOpenChange?: (open: boolean) => void;\n}\n\nconst SidebarSecondarySection = React.forwardRef<\n HTMLDivElement,\n SidebarSecondarySectionProps\n>(\n (\n {\n className,\n expandable = false,\n open,\n defaultOpen = true,\n onOpenChange,\n children,\n ...props\n },\n ref\n ) => {\n // Sections are separated by vertical padding + the section label; the next-gen\n // token sync removed the inter-section divider (no\n // `--ui-sidebar-secondary-section-container-border-` token survives).\n const sectionClass = cn(\n 'flex flex-col py-[var(--ui-sidebar-secondary-section-container-padding-y)]',\n className\n );\n\n if (!expandable) {\n return (\n <SidebarSecondarySectionContext.Provider value={SECTION_STATIC}>\n <div ref={ref} className={sectionClass} {...props}>\n {children}\n </div>\n </SidebarSecondarySectionContext.Provider>\n );\n }\n\n // Expandable: Base UI Collapsible owns the open state (controlled or\n // uncontrolled) + the aria-expanded/aria-controls wiring on the trigger.\n return (\n <SidebarSecondarySectionContext.Provider value={SECTION_EXPANDABLE}>\n <Collapsible.Root\n ref={ref}\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange}\n render={<div className={sectionClass} />}\n {...props}\n >\n {children}\n </Collapsible.Root>\n </SidebarSecondarySectionContext.Provider>\n );\n }\n);\nSidebarSecondarySection.displayName = 'SidebarSecondarySection';\n\nexport interface SidebarSecondarySectionLabelProps extends React.ComponentPropsWithoutRef<'div'> {\n /** Trailing header actions (e.g. a ghost `ButtonIcon`). Rendered outside the toggle. /\n actions?: React.ReactNode;\n /\n A rollup badge (e.g. a `Tag` with an unread count) shown in the header only\n * when an expandable section is collapsed. Ignored for static sections.\n /\n unreadRollup?: React.ReactNode;\n}\n\nconst sectionLabelTextClass =\n 'ui-sidebar-secondary-section-label-section-text-style text-[var(--ui-sidebar-secondary-section-label-section-color)]';\nconst sectionHeaderPadClass =\n 'min-h-[var(--ui-sidebar-secondary-menu-item-global-container-height-min)] py-[var(--ui-sidebar-secondary-section-container-header-padding-y)] px-[var(--ui-sidebar-secondary-section-container-header-padding-x)]';\n\nconst SidebarSecondarySectionLabel = React.forwardRef<\n HTMLDivElement,\n SidebarSecondarySectionLabelProps\n>(({ className, actions, unreadRollup, children, ...props }, ref) => {\n const { expandable } = React.useContext(SidebarSecondarySectionContext);\n const dir = useDocDir();\n const rowRef = React.useRef<HTMLDivElement>(null);\n const labelRef = React.useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing(labelRef, { enabled: true });\n const setRowRef = (node: HTMLDivElement \| null) => {\n rowRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n };\n\n // Anchored to the row (not the label span) so it lines up with the\n // sidebar's right edge regardless of how much the label shrinks for\n // trailing actions/rollup.\n const labelTooltip = (\n <Tooltip disabled={!isOverflowing}>\n <TooltipTrigger\n render={\n <span\n ref={labelRef}\n className=\"min-w-0 flex-1 truncate\"\n />\n }\n >\n {children}\n </TooltipTrigger>\n <TooltipContent anchor={rowRef} side={dir === 'rtl' ? 'left' : 'right'}>\n {children}\n </TooltipContent>\n </Tooltip>\n );\n\n if (!expandable) {\n // Static header: preserve the original markup when there are no actions so\n // existing layouts/baselines are unchanged.\n const base = cn(sectionLabelTextClass, sectionHeaderPadClass, className);\n if (actions == null) {\n return (\n <div\n ref={setRowRef}\n className={cn(\n base,\n 'flex items-center'\n )}\n {...props}\n >\n {labelTooltip}\n </div>\n );\n }\n return (\n <div\n ref={setRowRef}\n className={cn(\n base,\n 'flex items-center gap-[var(--ui-sidebar-secondary-section-container-header-gap)]'\n )}\n {...props}\n >\n {labelTooltip}\n <span className=\"flex shrink-0 items-center\">{actions}</span>\n </div>\n );\n }\n\n // Expandable header: a chevron toggle (the Collapsible trigger) plus optional\n // trailing actions kept OUTSIDE the trigger button (no nested buttons). The\n // unread-rollup badge sits inside the trigger and shows only while collapsed.\n return (\n <div\n ref={setRowRef}\n className={cn(\n 'flex items-center gap-[var(--ui-sidebar-secondary-section-container-header-gap)]',\n sectionHeaderPadClass,\n className\n )}\n {...props}\n >\n <Collapsible.Trigger\n className={cn(\n 'group/section flex min-w-0 flex-1 items-center gap-[var(--ui-sidebar-secondary-section-container-header-gap)] text-start cursor-pointer',\n sectionLabelTextClass,\n 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset'\n )}\n >\n <ChevronDownIcon\n size={16}\n aria-hidden=\"true\"\n className=\"shrink-0 ltr:-rotate-90 rtl:rotate-90 transition-transform group-data-[panel-open]/section:rotate-0 text-[var(--ui-sidebar-secondary-section-icon-arrow-color)]\"\n />\n {labelTooltip}\n {unreadRollup != null && (\n <span className=\"flex shrink-0 items-center group-data-[panel-open]/section:hidden\">\n {unreadRollup}\n </span>\n )}\n </Collapsible.Trigger>\n {actions != null && (\n <span className=\"flex shrink-0 items-center\">{actions}</span>\n )}\n </div>\n );\n});\nSidebarSecondarySectionLabel.displayName = 'SidebarSecondarySectionLabel';\n\nconst SidebarSecondaryMenu = React.forwardRef<\n HTMLUListElement,\n React.ComponentPropsWithoutRef<'ul'>\n>(({ className, ...props }, ref) => {\n const { expandable } = React.useContext(SidebarSecondarySectionContext);\n const list = (\n <ul\n ref={ref}\n className={cn(\n 'flex flex-col gap-[var(--ui-sidebar-secondary-section-menu-item-list-gap)]',\n className\n )}\n {...props}\n />\n );\n // Inside an expandable section the item list IS the collapsible panel, so it\n // mounts/unmounts with the section's open state.\n return expandable ? <Collapsible.Panel>{list}</Collapsible.Panel> : list;\n});\nSidebarSecondaryMenu.displayName = 'SidebarSecondaryMenu';\n\n// Shared row geometry + the GLOBAL icon/label state colors (shared across\n// selected/unselected — DESIGN §6.2). The cva `variant` only swaps the container\n// fill. Each interaction state is wired to its own token even where acronis's\n// value is unchanged (runtime var() references honor brand overrides only on the\n// referenced token).\nconst sidebarSecondaryRowClasses =\n 'group/row flex w-full items-start gap-[var(--ui-sidebar-secondary-menu-item-global-container-gap)] min-h-[var(--ui-sidebar-secondary-menu-item-global-container-height-min)] px-[var(--ui-sidebar-secondary-menu-item-global-container-padding-x)] py-[var(--ui-sidebar-secondary-menu-item-global-container-padding-y)] no-underline ui-sidebar-secondary-menu-item-global-label-text-style transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-brand)] focus-visible:ring-inset text-[var(--ui-sidebar-secondary-menu-item-global-label-color-color)] [&_svg]:shrink-0 [&_svg]:size-[var(--ui-sidebar-secondary-menu-item-global-icon-size)] [&_svg]:text-[var(--ui-sidebar-secondary-menu-item-global-icon-color-color)]';\n\nconst sidebarSecondaryMenuItemVariants = cva(sidebarSecondaryRowClasses, {\n variants: {\n variant: {\n unselected:\n 'bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-idle)] hover:bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-hover)] active:bg-[var(--ui-sidebar-secondary-menu-item-unselected-container-color-active)]',\n selected:\n 'bg-[var(--ui-sidebar-secondary-menu-item-selected-container-color-idle)] hover:bg-[var(--ui-sidebar-secondary-menu-item-selected-container-color-hover)] active:bg-[var(--ui-sidebar-secondary-menu-item-selected-container-color-active)]',\n },\n },\n defaultVariants: {\n variant: 'unselected',\n },\n});\n\nexport interface SidebarSecondaryMenuItemProps\n extends\n Omit<React.ComponentPropsWithoutRef<'a'>, 'children'>,\n Omit<VariantProps<typeof sidebarSecondaryMenuItemVariants>, 'variant'> {\n /* Marks the current route: sets the `selected` variant + `aria-current=\"page\"`. /\n selected?: boolean;\n /* Optional leading 16px icon (`hasIcon` in Figma). /\n icon?: React.ReactNode;\n /* Trailing extras (tag, shortcut, external-link icon — `hasExtras` in Figma). /\n extras?: React.ReactNode;\n children?: React.ReactNode;\n /* Replace the rendered `<a>` (e.g. a router `Link` or a `<button>`). /\n render?: useRender.RenderProp;\n}\n\nconst SidebarSecondaryMenuItem = React.forwardRef<\n HTMLAnchorElement,\n SidebarSecondaryMenuItemProps\n>(\n (\n { className, selected = false, icon, extras, render, children, ...props },\n ref\n ) => {\n const { expanded, setSelectedLabel } = useSidebarSecondaryContext();\n const { expandable } = React.useContext(SidebarSecondarySectionContext);\n const dir = useDocDir();\n const rowRef = React.useRef<HTMLAnchorElement>(null);\n const labelRef = React.useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing(labelRef, { enabled: expanded });\n\n // Register this item's label when selected so the collapsed breadcrumb\n // auto-displays the current page without manual props.\n React.useEffect(() => {\n if (selected) setSelectedLabel(children);\n }, [selected, children, setSelectedLabel]);\n\n const inner = useRender({\n render,\n ref: [ref, rowRef],\n defaultTagName: 'a',\n props: mergeProps<'a'>(\n {\n className: cn(\n sidebarSecondaryMenuItemVariants({\n variant: selected ? 'selected' : 'unselected',\n }),\n // Inside an expandable section, increase start padding so the\n // label aligns with the section header text (after chevron + gap)\n // while keeping the container full-width for hover/active fills.\n expandable &&\n 'ps-[calc(var(--ui-sidebar-secondary-menu-item-global-container-padding-x)+var(--ui-sidebar-secondary-section-container-header-gap)+16px)]',\n className\n ),\n 'aria-current': selected ? 'page' : undefined,\n onKeyDown: (e: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (e.key === ' ') {\n e.preventDefault();\n e.currentTarget.click();\n }\n },\n children: (\n <>\n {icon != null && (\n <span className=\"flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)]\">\n {icon}\n </span>\n )}\n {/ Keep the label in the DOM as `sr-only` in collapsed/rail mode so\n an icon-only row keeps an accessible name (a11y §7). The tooltip\n trigger is the label span itself — it only opens when the label\n is actually clipped. It's anchored to the row (not the label\n span) so it lines up with the sidebar's right edge regardless\n of how much the label shrinks for extras. /}\n <Tooltip disabled={!isOverflowing}>\n <TooltipTrigger\n render={\n <span\n ref={labelRef}\n className={cn(\n 'flex-1 min-w-[60px] truncate text-start',\n !expanded && 'sr-only'\n )}\n />\n }\n >\n {children}\n </TooltipTrigger>\n <TooltipContent\n anchor={rowRef}\n side={dir === 'rtl' ? 'left' : 'right'}\n >\n {children}\n </TooltipContent>\n </Tooltip>\n {extras}\n </>\n ),\n },\n props\n ),\n });\n\n return (\n <li className=\"contents\">\n {/ In collapsed/rail mode the label above is `sr-only` (zero-size), so\n it never receives the hover that would open its tooltip — wrap the\n whole row so the icon itself is hoverable and always shows the\n item's label as a tooltip while collapsed. /}\n <Tooltip disabled={expanded}>\n <TooltipTrigger render={inner} />\n <TooltipContent side={dir === 'rtl' ? 'left' : 'right'}>\n {children}\n </TooltipContent>\n </Tooltip>\n </li>\n );\n }\n);\nSidebarSecondaryMenuItem.displayName = 'SidebarSecondaryMenuItem';\n\nexport interface SidebarSecondaryMenuItemExtrasProps extends React.ComponentPropsWithoutRef<'span'> {\n /* Which trailing affordance to render. /\n variant: 'tag' \| 'externalLink' \| 'shortcut' \| 'tag-externalLink';\n /* Shortcut text for the `shortcut` variant. /\n shortcut?: string;\n /* Tag content for the `tag` / `tag-externalLink` variants. /\n tag?: React.ReactNode;\n}\n\nconst SidebarSecondaryMenuItemExtras = React.forwardRef<\n HTMLSpanElement,\n SidebarSecondaryMenuItemExtrasProps\n>(({ className, variant, shortcut, tag, children, ...props }, ref) => {\n const { expanded } = useSidebarSecondaryContext();\n const showTag = variant === 'tag' \|\| variant === 'tag-externalLink';\n const showExternal =\n variant === 'externalLink' \|\| variant === 'tag-externalLink';\n const showShortcut = variant === 'shortcut';\n\n return (\n <span\n ref={ref}\n className={cn(\n 'inline-flex items-center shrink-0 min-h-6 overflow-clip gap-[var(--ui-sidebar-secondary-menu-item-extras-global-container-gap)]',\n !expanded && 'hidden',\n className\n )}\n {...props}\n >\n {showTag && (tag ?? children)}\n {showShortcut && (\n <span className=\"ui-sidebar-secondary-menu-item-extras-global-shortcut-text-style text-[var(--ui-sidebar-secondary-menu-item-extras-global-shortcut-color)]\">\n {shortcut ?? children}\n </span>\n )}\n {showExternal && (\n <SquareArrowUpRightIcon\n size={16}\n className=\"text-[var(--ui-sidebar-secondary-menu-item-extras-global-external-icon-color)] size-[var(--ui-sidebar-secondary-menu-item-extras-global-external-icon-size)]\"\n />\n )}\n </span>\n );\n});\nSidebarSecondaryMenuItemExtras.displayName = 'SidebarSecondaryMenuItemExtras';\n\nexport interface SidebarSecondaryCollapseTriggerProps extends Omit<\n React.ComponentPropsWithoutRef<'button'>,\n 'children'\n> {\n /* Leading 16px icon (e.g. a panel-left glyph). Rotates 180° between expanded/collapsed — same as `SidebarPrimaryCollapseTrigger`. /\n icon?: React.ReactNode;\n /* Tooltip text shown when the sidebar is collapsed. Defaults to `'Expand'`. /\n expandTooltip?: React.ReactNode;\n /* Trailing extras (e.g. a keyboard shortcut hint), same slot as `SidebarSecondaryMenuItem`. */\n extras?: React.ReactNode;\n children?: React.ReactNode;\n}\n\n// The footer \"Collapse menu\" affordance. A row-styled `<button>` that flips the\n// panel width via the layout context — the live wiring for the controllable\n// `expanded` state (B1). Keeps its label as `sr-only` in collapsed mode.\n// When collapsed, wraps the button in a Tooltip showing \"Expand\".\nconst SidebarSecondaryCollapseTrigger = React.forwardRef<\n HTMLButtonElement,\n SidebarSecondaryCollapseTriggerProps\n>(\n (\n {\n className,\n icon,\n expandTooltip = 'Expand',\n extras,\n children,\n onClick,\n ...props\n },\n ref\n ) => {\n const { expanded, toggleExpanded } = useSidebarSecondaryContext();\n const dir = useDocDir();\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n const labelRef = React.useRef<HTMLSpanElement>(null);\n const isOverflowing = useIsOverflowing(labelRef, { enabled: expanded });\n\n const button = (\n <button\n ref={(node) => {\n buttonRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n }}\n type=\"button\"\n aria-expanded={expanded}\n className={cn(\n sidebarSecondaryMenuItemVariants({ variant: 'unselected' }),\n 'text-start',\n className\n )}\n onClick={(event) => {\n onClick?.(event);\n if (!event.defaultPrevented) toggleExpanded();\n }}\n {...props}\n >\n {icon != null && (\n <span\n className={cn(\n 'flex shrink-0 items-center self-start mt-[var(--ui-sidebar-secondary-menu-item-global-icon-margin-t)] transition-transform',\n expanded ? 'rtl:rotate-180' : 'ltr:rotate-180'\n )}\n >\n {icon}\n </span>\n )}\n <Tooltip disabled={!isOverflowing}>\n <TooltipTrigger\n render={\n <span\n ref={labelRef}\n className={cn('flex-1 min-w-[60px] truncate', !expanded && 'sr-only')}\n />\n }\n >\n {children}\n </TooltipTrigger>\n <TooltipContent anchor={buttonRef} side={dir === 'rtl' ? 'left' : 'right'}>\n {children}\n </TooltipContent>\n </Tooltip>\n {extras}\n </button>\n );\n\n return (\n <li className=\"contents\">\n <Tooltip disabled={expanded}>\n <TooltipTrigger render={button} />\n <TooltipContent side={dir === 'rtl' ? 'left' : 'right'}>\n {expandTooltip}\n </TooltipContent>\n </Tooltip>\n </li>\n );\n }\n);\nSidebarSecondaryCollapseTrigger.displayName = 'SidebarSecondaryCollapseTrigger';\n\nexport {\n SidebarSecondary,\n SidebarSecondaryHeader,\n SidebarSecondaryContent,\n SidebarSecondaryCollapsedBreadcrumb,\n SidebarSecondaryFooter,\n SidebarSecondarySection,\n SidebarSecondarySectionLabel,\n SidebarSecondaryMenu,\n SidebarSecondaryMenuItem,\n SidebarSecondaryMenuItemExtras,\n SidebarSecondaryCollapseTrigger,\n sidebarSecondaryMenuItemVariants,\n};\n"],"mappings":"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"}

package/dist/components/ui/skeleton/skeleton.js CHANGED Viewed

@@ -1,22 +1,15 @@
-import { jsx as r } from "react/jsx-runtime";
+import { cn as e } from "../../../lib/utils.js";
 import * as t from "react";
-import { cn as m } from "../../../lib/utils.js";
-const s = t.forwardRef(
-  ({ className: e, ...a }, o) => /* @__PURE__ */ r(
-    "div",
-    {
-      ref: o,
-      "data-slot": "skeleton",
-      className: m(
-        "animate-pulse rounded-md bg-[var(--ui-background-surface-active)]",
-        e
-      ),
-      ...a
-    }
-  )
-);
-s.displayName = "Skeleton";
-export {
-  s as Skeleton
-};
-//# sourceMappingURL=skeleton.js.map
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/ui/skeleton/skeleton.tsx
+var r = t.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ n("div", {
+	ref: i,
+	"data-slot": "skeleton",
+	className: e("animate-pulse rounded-md bg-[var(--ui-background-surface-active)]", t),
+	...r
+}));
+r.displayName = "Skeleton";
+//#endregion
+export { r as Skeleton };
+//# sourceMappingURL=skeleton.js.map

package/dist/components/ui/skeleton/skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"skeleton.js","sources":["../../../../src/components/ui/skeleton/skeleton.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `skeleton`\n// (packages/ui-legacy/src/components/ui/skeleton.tsx). A pulsing placeholder box\n// for loading states — no Base UI primitive, just a styled `<div>`. The legacy\n// `bg-muted` (--ui-background-surface-secondary) is near-white and nearly\n// invisible on a white surface, so the fill uses the more visible\n// `--ui-background-surface-active` gray (still subtle in dark). Shape and size\n// come from the caller's className.\nexport type SkeletonProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst Skeleton = React.forwardRef<HTMLDivElement, SkeletonProps>(\n ({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"skeleton\"\n className={cn(\n 'animate-pulse rounded-md bg-[var(--ui-background-surface-active)]',\n className\n )}\n {...props}\n />\n )\n);\nSkeleton.displayName = 'Skeleton';\n\nexport { Skeleton };\n"],"~~names":["Skeleton","React","className","props","ref","jsx","cn"],"~~mappings":"~~;;;~~AAaA,~~MAAMA~~,~~IAAWC~~,EAAM~~;AAAA~~,~~EACrB~~,~~CAAC,~~EAAE,~~WAAAC~~,~~GAAW~~,~~GAAGC~~,~~EAAA,GAASC,~~MACxB,~~gBAAAC;AAAA~~,~~IAAC~~;~~AAAA,IAAA~~;~~AAAA~~,~~MACC,KAAAD;AAAA,MACA,~~aAAU;~~AAAA~~,~~MACV~~,~~WAAWE;AAAA~~,~~QACT;AAAA~~,~~QACAJ~~;~~AAAA~~,~~MAAA~~;~~AAAA~~,~~MAED~~,~~GAAGC~~;~~AAAA~~,~~IAAA;AAAA,EAAA;AAGV;AACAH,~~EAAS,cAAc;"}
1	+ {"version":3,"file":"skeleton.js","names":[],"sources":["../../../../src/components/ui/skeleton/skeleton.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `skeleton`\n// (packages/ui-legacy/src/components/ui/skeleton.tsx). A pulsing placeholder box\n// for loading states — no Base UI primitive, just a styled `<div>`. The legacy\n// `bg-muted` (--ui-background-surface-secondary) is near-white and nearly\n// invisible on a white surface, so the fill uses the more visible\n// `--ui-background-surface-active` gray (still subtle in dark). Shape and size\n// come from the caller's className.\nexport type SkeletonProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst Skeleton = React.forwardRef<HTMLDivElement, SkeletonProps>(\n ({ className, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"skeleton\"\n className={cn(\n 'animate-pulse rounded-md bg-[var(--ui-background-surface-active)]',\n className\n )}\n {...props}\n />\n )\n);\nSkeleton.displayName = 'Skeleton';\n\nexport { Skeleton };\n"],"mappings":";;;;AAaA,IAAM,IAAW,EAAM,YACpB,EAAE,cAAW,GAAG,KAAS,MACxB,kBAAC,OAAD;CACO;CACL,aAAU;CACV,WAAW,EACT,qEACA,CACF;CACA,GAAI;AACL,CAAA,CAEL;AACA,EAAS,cAAc"}

package/dist/components/ui/slider/slider.js CHANGED Viewed

@@ -1,42 +1,28 @@
-import { jsx as o, jsxs as b } from "react/jsx-runtime";
-import * as g from "react";
-import { Slider as r } from "@base-ui/react/slider";
-import { cn as s } from "../../../lib/utils.js";
-const m = g.forwardRef(
-  ({ className: d, defaultValue: a, value: e, ...l }, t) => {
-    const n = e != null ? Array.isArray(e) ? e : [e] : void 0, i = a != null ? Array.isArray(a) ? a : [a] : [0], u = (n ?? i).length;
-    return /* @__PURE__ */ o(
-      r.Root,
-      {
-        ref: t,
-        value: n,
-        defaultValue: i,
-        className: s(
-          "group relative flex w-full touch-none select-none items-center",
-          d
-        ),
-        ...l,
-        children: /* @__PURE__ */ b(r.Control, { className: "relative flex w-full items-center py-2", children: [
-          /* @__PURE__ */ o(r.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-[var(--ui-border-on-surface-border)]", children: /* @__PURE__ */ o(r.Indicator, { className: "rounded-full bg-[var(--ui-background-brand-secondary)] group-data-[disabled]:bg-[var(--ui-background-status-strong-neutral)]" }) }),
-          Array.from({ length: u }, (f, c) => /* @__PURE__ */ o(
-            r.Thumb,
-            {
-              className: s(
-                "block size-4 rounded-full border border-[var(--ui-background-brand-secondary)] bg-background shadow-sm transition-colors",
-                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]",
-                "data-dragging:ring-2 data-dragging:ring-[var(--ui-focus-primary)]",
-                "data-disabled:pointer-events-none data-disabled:border-[var(--ui-background-status-strong-neutral)] data-disabled:opacity-50"
-              )
-            },
-            c
-          ))
-        ] })
-      }
-    );
-  }
-);
-m.displayName = "Slider";
-export {
-  m as Slider
-};
-//# sourceMappingURL=slider.js.map
+"use client";
+import { cn as e } from "../../../lib/utils.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Slider as i } from "@base-ui/react/slider";
+//#region src/components/ui/slider/slider.tsx
+var a = t.forwardRef(({ className: t, defaultValue: a, value: o, ...s }, c) => {
+	let l = o == null ? void 0 : Array.isArray(o) ? o : [o], u = a == null ? [0] : Array.isArray(a) ? a : [a], d = (l ?? u).length;
+	return /* @__PURE__ */ n(i.Root, {
+		ref: c,
+		value: l,
+		defaultValue: u,
+		className: e("group relative flex w-full touch-none select-none items-center", t),
+		...s,
+		children: /* @__PURE__ */ r(i.Control, {
+			className: "relative flex w-full items-center py-2",
+			children: [/* @__PURE__ */ n(i.Track, {
+				className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-[var(--ui-border-on-surface-border)]",
+				children: /* @__PURE__ */ n(i.Indicator, { className: "rounded-full bg-[var(--ui-background-brand-secondary)] group-data-[disabled]:bg-[var(--ui-background-status-strong-neutral)]" })
+			}), Array.from({ length: d }, (t, r) => /* @__PURE__ */ n(i.Thumb, { className: e("block size-4 rounded-full border border-[var(--ui-background-brand-secondary)] bg-background shadow-sm transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]", "data-dragging:ring-2 data-dragging:ring-[var(--ui-focus-primary)]", "data-disabled:pointer-events-none data-disabled:border-[var(--ui-background-status-strong-neutral)] data-disabled:opacity-50") }, r))]
+		})
+	});
+});
+a.displayName = "Slider";
+//#endregion
+export { a as Slider };
+//# sourceMappingURL=slider.js.map

package/dist/components/ui/slider/slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.js","sources":["../../../../src/components/ui/slider/slider.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Slider as SliderPrimitive } from '@base-ui/react/slider';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform`'s `slider`, on Base UI's Slider (Root / Control /\n// Track / Indicator / Thumb). Supports a single value or a range (array value) —\n// the thumb count follows the value/defaultValue length. No `--ui-slider-*` tier,\n// so it uses semantic tokens: the rail is the divider gray\n// (`--ui-border-on-surface-border`); the filled indicator and the thumb border use\n// the action blue (`--ui-background-brand-secondary`) — note legacy's `bg-primary`\n// is the dark navy in ui-react, so the action color is `secondary`.\nexport type SliderProps = React.ComponentPropsWithoutRef<\n typeof SliderPrimitive.Root\n>;\n\nconst Slider = React.forwardRef<HTMLDivElement, SliderProps>(\n ({ className, defaultValue, value, ...props }, ref) => {\n const normalizedValue =\n value != null ? (Array.isArray(value) ? value : [value]) : undefined;\n const normalizedDefaultValue =\n defaultValue != null\n ? Array.isArray(defaultValue)\n ? defaultValue\n : [defaultValue]\n : [0];\n const thumbCount = (normalizedValue ?? normalizedDefaultValue).length;\n\n return (\n <SliderPrimitive.Root\n ref={ref}\n value={normalizedValue}\n defaultValue={normalizedDefaultValue}\n className={cn(\n 'group relative flex w-full touch-none select-none items-center',\n className\n )}\n {...props}\n >\n <SliderPrimitive.Control className=\"relative flex w-full items-center py-2\">\n <SliderPrimitive.Track className=\"relative h-1.5 w-full grow overflow-hidden rounded-full bg-[var(--ui-border-on-surface-border)]\">\n <SliderPrimitive.Indicator className=\"rounded-full bg-[var(--ui-background-brand-secondary)] group-data-[disabled]:bg-[var(--ui-background-status-strong-neutral)]\" />\n </SliderPrimitive.Track>\n {Array.from({ length: thumbCount }, (_, i) => (\n <SliderPrimitive.Thumb\n key={i}\n className={cn(\n 'block size-4 rounded-full border border-[var(--ui-background-brand-secondary)] bg-background shadow-sm transition-colors',\n 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]',\n 'data-dragging:ring-2 data-dragging:ring-[var(--ui-focus-primary)]',\n 'data-disabled:pointer-events-none data-disabled:border-[var(--ui-background-status-strong-neutral)] data-disabled:opacity-50'\n )}\n />\n ))}\n </SliderPrimitive.Control>\n </SliderPrimitive.Root>\n );\n }\n);\nSlider.displayName = 'Slider';\n\nexport { Slider };\n"],"~~names":["Slider","React","className","defaultValue","value","props","ref","normalizedValue","normalizedDefaultValue","thumbCount","jsx","SliderPrimitive","cn","jsxs","_","i"],"~~mappings":"~~;;;;~~AAkBA,~~MAAMA~~,~~IAASC~~,EAAM~~;AAAA~~,~~EACnB~~,~~CAAC,~~EAAE,~~WAAAC~~,~~GAAW~~,~~cAAAC~~,~~GAAc~~,~~OAAAC~~,~~GAAO,GAAGC,EAAA,GAASC,~~MAAQ;~~AACrD~~,~~UAAMC~~,~~IACJH~~,KAAS,~~OAAQ~~,MAAM,~~QAAQA~~,CAAK,~~IAAIA~~,IAAQ,~~CAACA~~,CAAK,~~IAAK~~,~~QACvDI~~,~~IACJL,~~KAAgB,~~OACZ~~,MAAM,~~QAAQA~~,CAAY,~~IACxBA~~,IACA,~~CAACA~~,CAAY,~~IACf~~,~~CAAC~~,~~CAAC~~,~~GACFM~~,~~KAAcF,KAAmBC,GAAwB~~;~~AAE~~/D,~~WACE~~,~~gBAAAE;AAAA~~,~~MAACC,~~EAAgB~~;AAAA~~,~~MAAhB~~;~~AAAA,QACC,KAAAL~~;~~AAAA~~,~~QACA,OAAOC~~;~~AAAA~~,~~QACP,cAAcC~~;~~AAAA~~,~~QACd~~,~~WAAWI;AAAA~~,~~UACT;AAAA~~,~~UACAV~~;~~AAAA~~,~~QAAA~~;~~AAAA~~,~~QAED,GAAGG;AAAA,QAEJ,~~UAAA,~~gBAAAQ~~,~~EAACF,~~EAAgB,~~SAAhB~~,~~EAAwB,~~WAAU~~,0CACjC,UAAA~~;~~AAAA~~,UAAA,~~gBAAAD~~,~~EAACC~~,EAAgB,~~OAAhB~~,~~EAAsB,~~WAAU~~,mGAC~~/B,UAAA,~~gBAAAD~~,~~EAACC,~~EAAgB,~~WAAhB~~,~~EAA0B~~,WAAU,+~~HAAA~~,~~CAA+H~~,~~EAAA~~,~~CACtK;AAAA~~,~~UACC,~~MAAM,KAAK,EAAE,~~QAAQF~~,~~KAAc~~,~~CAACK~~,~~GAAGC~~,MACtC,~~gBAAAL;AAAA~~,~~YAACC,~~EAAgB~~;AAAA~~,~~YAAhB;AAAA~~,~~cAEC~~,~~WAAWC;AAAA~~,~~gBACT;AAAA~~,~~gBACA;AAAA~~,~~gBACA;AAAA~~,~~gBACA;AAAA~~,~~cAAA;AAAA~~,~~YACF;AAAA~~,~~YANKG;AAAA~~,~~UAAA~~,~~CAQR;AAAA~~,~~QAAA~~,~~EAAA,CACH~~;~~AAAA~~,~~MAAA~~;~~AAAA~~,~~IAAA;AAAA,EAGN;AACF;AACAf,~~EAAO,cAAc;"}
1	+ {"version":3,"file":"slider.js","names":[],"sources":["../../../../src/components/ui/slider/slider.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Slider as SliderPrimitive } from '@base-ui/react/slider';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform`'s `slider`, on Base UI's Slider (Root / Control /\n// Track / Indicator / Thumb). Supports a single value or a range (array value) —\n// the thumb count follows the value/defaultValue length. No `--ui-slider-*` tier,\n// so it uses semantic tokens: the rail is the divider gray\n// (`--ui-border-on-surface-border`); the filled indicator and the thumb border use\n// the action blue (`--ui-background-brand-secondary`) — note legacy's `bg-primary`\n// is the dark navy in ui-react, so the action color is `secondary`.\nexport type SliderProps = React.ComponentPropsWithoutRef<\n typeof SliderPrimitive.Root\n>;\n\nconst Slider = React.forwardRef<HTMLDivElement, SliderProps>(\n ({ className, defaultValue, value, ...props }, ref) => {\n const normalizedValue =\n value != null ? (Array.isArray(value) ? value : [value]) : undefined;\n const normalizedDefaultValue =\n defaultValue != null\n ? Array.isArray(defaultValue)\n ? defaultValue\n : [defaultValue]\n : [0];\n const thumbCount = (normalizedValue ?? normalizedDefaultValue).length;\n\n return (\n <SliderPrimitive.Root\n ref={ref}\n value={normalizedValue}\n defaultValue={normalizedDefaultValue}\n className={cn(\n 'group relative flex w-full touch-none select-none items-center',\n className\n )}\n {...props}\n >\n <SliderPrimitive.Control className=\"relative flex w-full items-center py-2\">\n <SliderPrimitive.Track className=\"relative h-1.5 w-full grow overflow-hidden rounded-full bg-[var(--ui-border-on-surface-border)]\">\n <SliderPrimitive.Indicator className=\"rounded-full bg-[var(--ui-background-brand-secondary)] group-data-[disabled]:bg-[var(--ui-background-status-strong-neutral)]\" />\n </SliderPrimitive.Track>\n {Array.from({ length: thumbCount }, (_, i) => (\n <SliderPrimitive.Thumb\n key={i}\n className={cn(\n 'block size-4 rounded-full border border-[var(--ui-background-brand-secondary)] bg-background shadow-sm transition-colors',\n 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)]',\n 'data-dragging:ring-2 data-dragging:ring-[var(--ui-focus-primary)]',\n 'data-disabled:pointer-events-none data-disabled:border-[var(--ui-background-status-strong-neutral)] data-disabled:opacity-50'\n )}\n />\n ))}\n </SliderPrimitive.Control>\n </SliderPrimitive.Root>\n );\n }\n);\nSlider.displayName = 'Slider';\n\nexport { Slider };\n"],"mappings":";;;;;;AAkBA,IAAM,IAAS,EAAM,YAClB,EAAE,cAAW,iBAAc,UAAO,GAAG,KAAS,MAAQ;CACrD,IAAM,IACJ,KAAS,OAAkD,KAAA,IAA1C,MAAM,QAAQ,CAAK,IAAI,IAAQ,CAAC,CAAK,GAClD,IACJ,KAAgB,OAIZ,CAAC,CAAC,IAHF,MAAM,QAAQ,CAAY,IACxB,IACA,CAAC,CAAY,GAEf,KAAc,KAAmB,EAAA,CAAwB;CAE/D,OACE,kBAAC,EAAgB,MAAjB;EACO;EACL,OAAO;EACP,cAAc;EACd,WAAW,EACT,kEACA,CACF;EACA,GAAI;EAEJ,UAAA,kBAAC,EAAgB,SAAjB;GAAyB,WAAU;GAAnC,UAAA,CACE,kBAAC,EAAgB,OAAjB;IAAuB,WAAU;IAC/B,UAAA,kBAAC,EAAgB,WAAjB,EAA2B,WAAU,+HAAgI,CAAA;GAChJ,CAAA,GACtB,MAAM,KAAK,EAAE,QAAQ,EAAW,IAAI,GAAG,MACtC,kBAAC,EAAgB,OAAjB,EAEE,WAAW,EACT,4HACA,gGACA,qEACA,8HACF,EACD,GAPM,CAON,CACF,CACsB;;CACL,CAAA;AAE1B,CACF;AACA,EAAO,cAAc"}

package/dist/components/ui/spinner/spinner.js CHANGED Viewed

@@ -1,38 +1,29 @@
-import { jsx as r } from "react/jsx-runtime";
+import { cn as e } from "../../../lib/utils.js";
+import { cva as t } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
 import * as n from "react";
-import { cva as o } from "../../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { cn as t } from "../../../lib/utils.js";
-const d = o(
-  "inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent text-secondary",
-  {
-    variants: {
-      size: {
-        sm: "size-4",
-        md: "size-6",
-        lg: "size-8",
-        xl: "size-12"
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  }
-), l = n.forwardRef(
-  ({ className: e, size: a, ...i }, s) => /* @__PURE__ */ r(
-    "div",
-    {
-      ref: s,
-      role: "status",
-      "aria-label": "Loading",
-      className: t(d({ size: a }), e),
-      ...i,
-      children: /* @__PURE__ */ r("span", { className: "sr-only", children: "Loading…" })
-    }
-  )
-);
-l.displayName = "Spinner";
-export {
-  l as Spinner,
-  d as spinnerVariants
-};
-//# sourceMappingURL=spinner.js.map
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/ui/spinner/spinner.tsx
+var i = t("inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent text-secondary", {
+	variants: { size: {
+		sm: "size-4",
+		md: "size-6",
+		lg: "size-8",
+		xl: "size-12"
+	} },
+	defaultVariants: { size: "md" }
+}), a = n.forwardRef(({ className: t, size: n, ...a }, o) => /* @__PURE__ */ r("div", {
+	ref: o,
+	role: "status",
+	"aria-label": "Loading",
+	className: e(i({ size: n }), t),
+	...a,
+	children: /* @__PURE__ */ r("span", {
+		className: "sr-only",
+		children: "Loading…"
+	})
+}));
+a.displayName = "Spinner";
+//#endregion
+export { a as Spinner, i as spinnerVariants };
+//# sourceMappingURL=spinner.js.map

package/dist/components/ui/spinner/spinner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spinner.js","sources":["../../../../src/components/ui/spinner/spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `spinner`\n// (packages/ui-legacy/src/components/ui/spinner.tsx). A CSS loading spinner — no\n// Base UI primitive. No `--ui-spinner-` tier; the ring color defaults to the\n// brand action blue via `text-secondary` (--ui-background-brand-secondary, used\n// through `border-current`), replacing the legacy `--spinner-color` var.\n// Override the color with a `text-` class. `size` mirrors the legacy scale.\n//\n// Internal primitive — deliberately NOT re-exported from `src/index.ts` (mirrors\n// the InputBox/SearchBox pattern). Consumed by `Loading` (its icon), `Toast` (a\n// small inline icon), and `ChartState`. Apps building a standalone loading\n// state should use `Loading`, which wraps this ring with a label and\n// placement-context container tokens.\nconst spinnerVariants = cva(\n 'inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent text-secondary',\n {\n variants: {\n size: {\n sm: 'size-4',\n md: 'size-6',\n lg: 'size-8',\n xl: 'size-12',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n }\n);\n\nexport interface SpinnerProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof spinnerVariants> {}\n\nconst Spinner = React.forwardRef<HTMLDivElement, SpinnerProps>(\n ({ className, size, ...props }, ref) => (\n <div\n ref={ref}\n role=\"status\"\n aria-label=\"Loading\"\n className={cn(spinnerVariants({ size }), className)}\n {...props}\n >\n <span className=\"sr-only\">Loading…</span>\n </div>\n )\n);\nSpinner.displayName = 'Spinner';\n\nexport { Spinner, spinnerVariants };\n"],"~~names":["spinnerVariants","cva","Spinner","React","className","size","props","ref","jsx","cn"],"~~mappings":"~~;;;;~~AAiBA,~~MAAMA~~,~~IAAkBC;AAAA~~,EACtB~~;AAAA~~,~~EACA~~;~~AAAA~~,~~IACE,~~UAAU~~;AAAA~~,~~MACR~~,MAAM;~~AAAA~~,~~QACJ,~~IAAI;~~AAAA~~,~~QACJ,~~IAAI;~~AAAA~~,~~QACJ,~~IAAI;~~AAAA~~,~~QACJ,~~IAAI;~~AAAA~~,~~MAAA~~;~~AAAA~~,~~IACN;AAAA,IAEF,~~iBAAiB~~;AAAA~~,~~MACf~~,MAAM~~;AAAA~~,~~IAAA~~;~~AAAA~~,~~EACR;AAEJ~~,~~GAMMC~~,~~IAAUC~~,EAAM~~;AAAA~~,~~EACpB~~,~~CAAC,~~EAAE,~~WAAAC~~,~~GAAW~~,~~MAAAC~~,~~GAAM~~,~~GAAGC,EAAA,GAASC,~~MAC9B,~~gBAAAC;AAAA~~,~~IAAC~~;~~AAAA,IAAA~~;~~AAAA~~,~~MACC,KAAAD;AAAA,MACA,~~MAAK;~~AAAA~~,~~MACL,~~cAAW;~~AAAA~~,~~MACX~~,~~WAAWE~~,~~EAAGT,~~EAAgB,EAAE,~~MAAAK~~,~~EAAA~~,~~CAAM~~,~~GAAGD,~~CAAS;~~AAAA~~,~~MACjD,GAAGE~~;~~AAAA~~,~~MAEJ,~~UAAA,~~gBAAAE~~,~~EAAC~~,~~QAAA,EAAK,~~WAAU,~~WAAU,~~UAAA~~,WAAA,CAAQ~~;~~AAAA~~,~~IAAA~~;~~AAAA~~,~~EAAA~~;~~AAGxC;AACAN~~,EAAQ,cAAc;"}
1	+ {"version":3,"file":"spinner.js","names":[],"sources":["../../../../src/components/ui/spinner/spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\n\n// Ported from `@acronis-platform/shadcn-uikit`'s `spinner`\n// (packages/ui-legacy/src/components/ui/spinner.tsx). A CSS loading spinner — no\n// Base UI primitive. No `--ui-spinner-` tier; the ring color defaults to the\n// brand action blue via `text-secondary` (--ui-background-brand-secondary, used\n// through `border-current`), replacing the legacy `--spinner-color` var.\n// Override the color with a `text-` class. `size` mirrors the legacy scale.\n//\n// Internal primitive — deliberately NOT re-exported from `src/index.ts` (mirrors\n// the InputBox/SearchBox pattern). Consumed by `Loading` (its icon), `Toast` (a\n// small inline icon), and `ChartState`. Apps building a standalone loading\n// state should use `Loading`, which wraps this ring with a label and\n// placement-context container tokens.\nconst spinnerVariants = cva(\n 'inline-block animate-spin rounded-full border-2 border-solid border-current border-r-transparent text-secondary',\n {\n variants: {\n size: {\n sm: 'size-4',\n md: 'size-6',\n lg: 'size-8',\n xl: 'size-12',\n },\n },\n defaultVariants: {\n size: 'md',\n },\n }\n);\n\nexport interface SpinnerProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof spinnerVariants> {}\n\nconst Spinner = React.forwardRef<HTMLDivElement, SpinnerProps>(\n ({ className, size, ...props }, ref) => (\n <div\n ref={ref}\n role=\"status\"\n aria-label=\"Loading\"\n className={cn(spinnerVariants({ size }), className)}\n {...props}\n >\n <span className=\"sr-only\">Loading…</span>\n </div>\n )\n);\nSpinner.displayName = 'Spinner';\n\nexport { Spinner, spinnerVariants };\n"],"mappings":";;;;;AAiBA,IAAM,IAAkB,EACtB,mHACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;CACN,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CACF,GAMM,IAAU,EAAM,YACnB,EAAE,cAAW,SAAM,GAAG,KAAS,MAC9B,kBAAC,OAAD;CACO;CACL,MAAK;CACL,cAAW;CACX,WAAW,EAAG,EAAgB,EAAE,QAAK,CAAC,GAAG,CAAS;CAClD,GAAI;CAEJ,UAAA,kBAAC,QAAD;EAAM,WAAU;EAAU,UAAA;CAAc,CAAA;AACrC,CAAA,CAET;AACA,EAAQ,cAAc"}