@adea-ai/ui 0.98.0 → 0.99.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (62) hide show
  1. package/dist/components/composites/action-button/action-button.d.ts +1 -0
  2. package/dist/components/composites/action-button/action-button.d.ts.map +1 -1
  3. package/dist/components/composites/action-button/action-button.js +1 -1
  4. package/dist/components/composites/action-button/action-button.js.map +1 -1
  5. package/dist/components/composites/appearance-editor/appearance-choices.d.ts.map +1 -1
  6. package/dist/components/composites/appearance-editor/appearance-choices.js +32 -28
  7. package/dist/components/composites/appearance-editor/appearance-choices.js.map +1 -1
  8. package/dist/components/composites/appearance-editor/appearance-rows.d.ts.map +1 -1
  9. package/dist/components/composites/appearance-editor/appearance-rows.js +1 -1
  10. package/dist/components/composites/appearance-editor/appearance-rows.js.map +1 -1
  11. package/dist/components/layout/side-rail/side-rail.d.ts.map +1 -1
  12. package/dist/components/layout/side-rail/side-rail.js +10 -7
  13. package/dist/components/layout/side-rail/side-rail.js.map +1 -1
  14. package/dist/components/layout/top-bar/top-bar.d.ts +7 -0
  15. package/dist/components/layout/top-bar/top-bar.d.ts.map +1 -1
  16. package/dist/components/layout/top-bar/top-bar.js +11 -5
  17. package/dist/components/layout/top-bar/top-bar.js.map +1 -1
  18. package/dist/components/ui/dropdown-menu/dropdown-menu.d.ts.map +1 -1
  19. package/dist/components/ui/dropdown-menu/dropdown-menu.js +4 -2
  20. package/dist/components/ui/dropdown-menu/dropdown-menu.js.map +1 -1
  21. package/dist/components/ui/kbd/kbd.d.ts.map +1 -1
  22. package/dist/components/ui/kbd/kbd.js +1 -1
  23. package/dist/components/ui/kbd/kbd.js.map +1 -1
  24. package/dist/components/ui/status-chip/status-chip.d.ts.map +1 -1
  25. package/dist/components/ui/status-chip/status-chip.js +0 -1
  26. package/dist/components/ui/status-chip/status-chip.js.map +1 -1
  27. package/dist/components/ui/tooltip/tooltip.d.ts +1 -4
  28. package/dist/components/ui/tooltip/tooltip.d.ts.map +1 -1
  29. package/dist/components/ui/tooltip/tooltip.js +3 -3
  30. package/dist/components/ui/tooltip/tooltip.js.map +1 -1
  31. package/dist/lib/overlay.d.ts +7 -0
  32. package/dist/lib/overlay.d.ts.map +1 -1
  33. package/dist/lib/overlay.js +8 -1
  34. package/dist/lib/overlay.js.map +1 -1
  35. package/dist/lib/tokens.d.ts.map +1 -1
  36. package/dist/lib/tokens.js +5 -0
  37. package/dist/lib/tokens.js.map +1 -1
  38. package/dist/r/src/components/composites/action-button/action-button.tsx +2 -1
  39. package/dist/r/src/components/composites/appearance-editor/appearance-choices.tsx +35 -20
  40. package/dist/r/src/components/composites/appearance-editor/appearance-rows.tsx +6 -2
  41. package/dist/r/src/components/layout/side-rail/side-rail.tsx +7 -3
  42. package/dist/r/src/components/layout/top-bar/top-bar.tsx +13 -2
  43. package/dist/r/src/components/ui/dropdown-menu/dropdown-menu.tsx +10 -2
  44. package/dist/r/src/components/ui/kbd/kbd.tsx +0 -2
  45. package/dist/r/src/components/ui/status-chip/status-chip.tsx +1 -3
  46. package/dist/r/src/components/ui/tooltip/tooltip.tsx +7 -7
  47. package/dist/r/src/lib/overlay.ts +9 -0
  48. package/dist/r/src/lib/tokens.ts +6 -0
  49. package/dist/r/src/styles/theme.css +5 -0
  50. package/package.json +1 -1
  51. package/src/components/composites/action-button/action-button.tsx +2 -1
  52. package/src/components/composites/appearance-editor/appearance-choices.tsx +35 -20
  53. package/src/components/composites/appearance-editor/appearance-rows.tsx +6 -2
  54. package/src/components/layout/side-rail/side-rail.tsx +7 -3
  55. package/src/components/layout/top-bar/top-bar.tsx +13 -2
  56. package/src/components/ui/dropdown-menu/dropdown-menu.tsx +10 -2
  57. package/src/components/ui/kbd/kbd.tsx +0 -2
  58. package/src/components/ui/status-chip/status-chip.tsx +1 -3
  59. package/src/components/ui/tooltip/tooltip.tsx +7 -7
  60. package/src/lib/overlay.ts +9 -0
  61. package/src/lib/tokens.ts +6 -0
  62. package/src/styles/theme.css +5 -0
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.js","names":["Tooltip","KobalteTooltip","useTooltipContext","ComponentProps","createContext","createEffect","createSignal","createUniqueId","onCleanup","splitProps","useContext","isServer","cn","TooltipTiming","openDelay","closeDelay","skipDelayDuration","tooltipDefaults","TooltipTimingContext","TooltipInteraction","id","trigger","HTMLElement","setTrigger","element","isOpen","isDisabled","isTriggerFocused","markOpenIntent","clearOpenIntent","requestCloseFromAnotherTooltip","markPointerCloseIntent","clearPointerCloseIntent","markCloseIntent","TooltipInteractionContext","openTooltipInteractions","Set","pendingTooltipOpenId","tooltipScrollListenerAttached","clearPendingTooltipOpen","undefined","tooltipScrollContainsTrigger","event","Event","target","window","Node","contains","handleTooltipScroll","interaction","handleTooltipPointerMove","PointerEvent","setTooltipInteractionOpen","open","has","add","addEventListener","document","delete","size","removeEventListener","registerTooltipInteraction","invokeEventHandler","handler","Array","isArray","callback","data","TooltipProviderProps","children","TooltipProvider","props","_$createComponent","Provider","value","TooltipRootProps","timing","local","rest","controlled","uncontrolledOpen","setUncontrolledOpen","defaultOpen","closeIntent","ignoreDuplicateClose","onOpenChange","next","source","pointerCloseIntentUntil","pointerCloseIntentTimeout","ReturnType","setTimeout","clearTimeout","Date","now","queueMicrotask","disabled","Boolean","activeElement","openInteraction","focusedTrigger","anotherTooltipOpening","pointerClosePending","handleKeyDown","KeyboardEvent","key","_$mergeProps","TooltipTrigger","Trigger","ref","onFocus","defaultPrevented","onBlur","onPointerEnter","onPointerLeave","onClick","TooltipContentProps","Content","hideArrow","TooltipContent","context","Portal","class","aria-hidden","_$memo","onEscapeKeyDown","onPointerDownOutside","Arrow","_$createComponent","Tooltip","KobalteTooltip","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/tooltip/tooltip.tsx"],"sourcesContent":["import { Tooltip as KobalteTooltip, useTooltipContext } from '@kobalte/core/tooltip'\nimport type { ComponentProps } from 'solid-js'\nimport {\n createContext,\n createEffect,\n createSignal,\n createUniqueId,\n onCleanup,\n splitProps,\n useContext,\n} from 'solid-js'\nimport { isServer } from 'solid-js/web'\nimport { cn } from '#lib/utils'\n\n/**\n * The provider sets the *timing* defaults for every tooltip below it.\n *\n * Timing is the part of a tooltip that has to agree across an app: one that\n * opens in 200ms in a toolbar and 700ms in a sidebar reads as a bug. The\n * provider is where that agreement lives. It is optional — a tooltip outside a\n * provider falls back to the same defaults — so a consumer can drop it in\n * without restructuring anything.\n */\ntype TooltipTiming = {\n openDelay: number\n closeDelay: number\n skipDelayDuration: number\n}\n\nconst tooltipDefaults: TooltipTiming = {\n /** Long enough that a pointer crossing a toolbar does not strobe tooltips. */\n openDelay: 400,\n /** Short, because the pointer has already left the control. */\n closeDelay: 80,\n /**\n * After a tooltip has been seen, the next one opens immediately for this\n * long. This is what makes moving along a row of icons feel like one\n * gesture instead of four separate waits.\n */\n skipDelayDuration: 500,\n}\n\nconst TooltipTimingContext = createContext<TooltipTiming>(tooltipDefaults)\n\ntype TooltipInteraction = {\n id: string\n trigger: () => HTMLElement | undefined\n setTrigger: (element: HTMLElement) => void\n isOpen: () => boolean\n isDisabled: () => boolean\n isTriggerFocused: () => boolean\n markOpenIntent: () => void\n clearOpenIntent: () => void\n requestCloseFromAnotherTooltip: () => void\n markPointerCloseIntent: () => void\n clearPointerCloseIntent: () => void\n markCloseIntent: () => void\n}\n\nconst TooltipInteractionContext = createContext<TooltipInteraction>()\nconst openTooltipInteractions = new Set<TooltipInteraction>()\nlet pendingTooltipOpenId: string | undefined\nlet tooltipScrollListenerAttached = false\n\nfunction clearPendingTooltipOpen(id: string) {\n if (pendingTooltipOpenId === id) pendingTooltipOpenId = undefined\n}\n\nfunction tooltipScrollContainsTrigger(event: Event, trigger: HTMLElement) {\n const target = event.target\n return target === window || (target instanceof Node && target.contains(trigger))\n}\n\nfunction handleTooltipScroll(event: Event) {\n for (const interaction of openTooltipInteractions) {\n const trigger = interaction.trigger()\n if (interaction.isOpen() && trigger && tooltipScrollContainsTrigger(event, trigger)) {\n interaction.markCloseIntent()\n }\n }\n}\n\nfunction handleTooltipPointerMove(event: PointerEvent) {\n for (const interaction of openTooltipInteractions) {\n const trigger = interaction.trigger()\n const target = event.target\n if (\n interaction.isOpen() &&\n interaction.isTriggerFocused() &&\n trigger &&\n !(target instanceof Node && trigger.contains(target))\n ) {\n interaction.markPointerCloseIntent()\n }\n }\n}\n\nfunction setTooltipInteractionOpen(interaction: TooltipInteraction, open: boolean) {\n if (isServer) return\n\n if (open) {\n if (openTooltipInteractions.has(interaction)) return\n openTooltipInteractions.add(interaction)\n if (!tooltipScrollListenerAttached) {\n tooltipScrollListenerAttached = true\n // Register before Kobalte's global listeners so intentional scroll\n // dismissal can be distinguished from its delayed pointer dismissal.\n window.addEventListener('scroll', handleTooltipScroll, true)\n document.addEventListener('pointermove', handleTooltipPointerMove, true)\n }\n } else {\n openTooltipInteractions.delete(interaction)\n if (openTooltipInteractions.size === 0 && tooltipScrollListenerAttached) {\n tooltipScrollListenerAttached = false\n window.removeEventListener('scroll', handleTooltipScroll, true)\n document.removeEventListener('pointermove', handleTooltipPointerMove, true)\n }\n }\n}\n\nfunction registerTooltipInteraction(interaction: TooltipInteraction) {\n onCleanup(() => {\n setTooltipInteractionOpen(interaction, false)\n clearPendingTooltipOpen(interaction.id)\n })\n}\n\nfunction invokeEventHandler(handler: unknown, event: Event) {\n if (Array.isArray(handler)) {\n const [callback, data] = handler as [(data: unknown, event: Event) => void, unknown]\n callback(data, event)\n } else if (typeof handler === 'function') {\n const callback = handler as (event: Event) => void\n callback(event)\n }\n}\n\nexport type TooltipProviderProps = {\n children?: ComponentProps<'div'>['children']\n openDelay?: number\n closeDelay?: number\n skipDelayDuration?: number\n}\n\nexport function TooltipProvider(props: TooltipProviderProps) {\n return (\n <TooltipTimingContext.Provider\n value={{\n openDelay: props.openDelay ?? tooltipDefaults.openDelay,\n closeDelay: props.closeDelay ?? tooltipDefaults.closeDelay,\n skipDelayDuration: props.skipDelayDuration ?? tooltipDefaults.skipDelayDuration,\n }}\n >\n {props.children}\n </TooltipTimingContext.Provider>\n )\n}\n\nexport type TooltipRootProps = ComponentProps<typeof KobalteTooltip>\n\nexport function Tooltip(props: TooltipRootProps) {\n const timing = useContext(TooltipTimingContext)\n const [local, rest] = splitProps(props, ['open', 'defaultOpen', 'onOpenChange', 'disabled'])\n const id = createUniqueId()\n const controlled = () => local.open !== undefined\n const [uncontrolledOpen, setUncontrolledOpen] = createSignal(local.defaultOpen ?? false)\n const isOpen = () => (controlled() ? (local.open ?? false) : uncontrolledOpen())\n const [trigger, setTrigger] = createSignal<HTMLElement>()\n let closeIntent = false\n let ignoreDuplicateClose = false\n let onOpenChange: (next: boolean, source?: 'handoff') => void\n let pointerCloseIntentUntil = 0\n let pointerCloseIntentTimeout: ReturnType<typeof setTimeout> | undefined\n const clearPointerCloseIntent = () => {\n pointerCloseIntentUntil = 0\n if (pointerCloseIntentTimeout) clearTimeout(pointerCloseIntentTimeout)\n pointerCloseIntentTimeout = undefined\n }\n const markPointerCloseIntent = () => {\n if (!isOpen()) return\n clearPointerCloseIntent()\n const closeDelay = props.closeDelay ?? timing.closeDelay\n pointerCloseIntentUntil = Date.now() + closeDelay + 50\n pointerCloseIntentTimeout = setTimeout(clearPointerCloseIntent, closeDelay + 50)\n }\n const markCloseIntent = () => {\n closeIntent = true\n clearPointerCloseIntent()\n queueMicrotask(() => {\n closeIntent = false\n })\n }\n const requestCloseFromAnotherTooltip = () => {\n if (!isOpen()) return\n\n // Another trigger is an explicit handoff, even when a focused tooltip has\n // a pending pointer-close intent that would otherwise suppress Kobalte's\n // close callback. Route the request through the same controlled/uncontrolled\n // state contract as Kobalte and ignore its duplicate callback for this turn.\n ignoreDuplicateClose = true\n queueMicrotask(() => {\n ignoreDuplicateClose = false\n })\n onOpenChange(false, 'handoff')\n }\n const interaction: TooltipInteraction = {\n id,\n trigger,\n setTrigger,\n isOpen,\n isDisabled: () => local.disabled ?? false,\n isTriggerFocused: () =>\n Boolean(trigger() && typeof document !== 'undefined' && trigger() === document.activeElement),\n markOpenIntent: () => {\n clearPointerCloseIntent()\n pendingTooltipOpenId = id\n // A focused tooltip ignores ordinary pointer movement, but entering or\n // focusing another tooltip is an explicit transfer.\n for (const openInteraction of openTooltipInteractions) {\n if (openInteraction.id !== id) openInteraction.requestCloseFromAnotherTooltip()\n }\n },\n clearOpenIntent: () => clearPendingTooltipOpen(id),\n requestCloseFromAnotherTooltip,\n markPointerCloseIntent,\n clearPointerCloseIntent,\n markCloseIntent,\n }\n registerTooltipInteraction(interaction)\n onCleanup(() => {\n clearPointerCloseIntent()\n ignoreDuplicateClose = false\n })\n if (isOpen()) setTooltipInteractionOpen(interaction, true)\n createEffect(() => setTooltipInteractionOpen(interaction, isOpen()))\n onOpenChange = (next: boolean, source) => {\n if (!next && source !== 'handoff' && ignoreDuplicateClose) return\n\n if (next) {\n clearPendingTooltipOpen(id)\n clearPointerCloseIntent()\n // Install this capture listener before Kobalte's open-state effect adds\n // its scroll listener later in the same update.\n setTooltipInteractionOpen(interaction, true)\n } else {\n const focusedTrigger = interaction.isTriggerFocused()\n const anotherTooltipOpening =\n pendingTooltipOpenId !== undefined && pendingTooltipOpenId !== id\n const pointerClosePending = Date.now() <= pointerCloseIntentUntil\n if (\n source !== 'handoff' &&\n focusedTrigger &&\n pointerClosePending &&\n !closeIntent &&\n !anotherTooltipOpening\n ) {\n clearPointerCloseIntent()\n return\n }\n closeIntent = false\n clearPointerCloseIntent()\n clearPendingTooltipOpen(id)\n }\n\n if (!controlled()) setUncontrolledOpen(next)\n local.onOpenChange?.(next)\n if (next) {\n // A controlled parent can reject the open request without changing its\n // signal, so the effect above would not rerun to release this listener.\n queueMicrotask(() => {\n if (!isOpen()) setTooltipInteractionOpen(interaction, false)\n })\n }\n }\n\n // Kobalte dismisses on Escape only when its content owns the top-most\n // layer, and a handoff keeps the previous tooltip's content mounted while\n // it exits — swallowing the key for the tooltip that just took over.\n // Listening on document (capture) closes this tooltip first; the layer's\n // own handler still runs for anything stacked above it.\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key !== 'Escape') return\n markCloseIntent()\n onOpenChange(false)\n }\n createEffect(() => {\n if (isServer || !isOpen()) return\n document.addEventListener('keydown', handleKeyDown, true)\n onCleanup(() => document.removeEventListener('keydown', handleKeyDown, true))\n })\n\n return (\n <TooltipInteractionContext.Provider value={interaction}>\n <KobalteTooltip\n open={isOpen()}\n onOpenChange={onOpenChange}\n disabled={local.disabled}\n openDelay={props.openDelay ?? timing.openDelay}\n closeDelay={props.closeDelay ?? timing.closeDelay}\n skipDelayDuration={props.skipDelayDuration ?? timing.skipDelayDuration}\n {...rest}\n />\n </TooltipInteractionContext.Provider>\n )\n}\n\nexport function TooltipTrigger(props: ComponentProps<typeof KobalteTooltip.Trigger>) {\n const interaction = useContext(TooltipInteractionContext)\n const [local, rest] = splitProps(props, [\n 'ref',\n 'onFocus',\n 'onBlur',\n 'onPointerEnter',\n 'onPointerLeave',\n 'onClick',\n ])\n\n return (\n <KobalteTooltip.Trigger\n {...rest}\n ref={(element) => {\n interaction?.setTrigger(element)\n if (typeof local.ref === 'function') local.ref(element)\n }}\n onFocus={(event) => {\n invokeEventHandler(local.onFocus, event)\n if (!event.defaultPrevented && !interaction?.isDisabled()) interaction?.markOpenIntent()\n }}\n onBlur={(event) => {\n invokeEventHandler(local.onBlur, event)\n interaction?.clearOpenIntent()\n interaction?.markCloseIntent()\n }}\n onPointerEnter={(event) => {\n invokeEventHandler(local.onPointerEnter, event)\n if (!event.defaultPrevented && !interaction?.isDisabled()) interaction?.markOpenIntent()\n }}\n onPointerLeave={(event) => {\n invokeEventHandler(local.onPointerLeave, event)\n interaction?.clearOpenIntent()\n interaction?.markPointerCloseIntent()\n }}\n onClick={(event) => {\n invokeEventHandler(local.onClick, event)\n interaction?.markCloseIntent()\n }}\n />\n )\n}\n\nexport type TooltipContentProps = ComponentProps<typeof KobalteTooltip.Content> & {\n /** Hide the caret pointing at the trigger. */\n hideArrow?: boolean\n}\n\nexport function TooltipContent(props: TooltipContentProps) {\n const interaction = useContext(TooltipInteractionContext)\n const [local, rest] = splitProps(props, [\n 'class',\n 'hideArrow',\n 'children',\n 'aria-hidden',\n 'onEscapeKeyDown',\n 'onPointerDownOutside',\n ])\n const context = useTooltipContext()\n\n // Kobalte keeps force-mounted and exiting content present after close. Hide\n // that retained tooltip from assistive technology until it opens again.\n return (\n <KobalteTooltip.Portal>\n <KobalteTooltip.Content\n class={cn(\n 'bg-scrim text-scrim-foreground z-(--z-tooltip) w-fit max-w-64 rounded-md px-2 py-1 text-xs',\n 'origin-(--kb-tooltip-content-transform-origin) text-balance',\n 'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n 'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n 'data-expanded:duration-150 data-closed:duration-100',\n local.class\n )}\n aria-hidden={context.isOpen() ? local['aria-hidden'] : true}\n onEscapeKeyDown={(event) => {\n invokeEventHandler(local.onEscapeKeyDown, event)\n if (!event.defaultPrevented) interaction?.markCloseIntent()\n }}\n onPointerDownOutside={(event) => {\n invokeEventHandler(local.onPointerDownOutside, event)\n if (!event.defaultPrevented) interaction?.markCloseIntent()\n }}\n {...rest}\n >\n {local.children}\n {!local.hideArrow && <KobalteTooltip.Arrow aria-hidden=\"true\" />}\n </KobalteTooltip.Content>\n </KobalteTooltip.Portal>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"tooltip.js","names":["Tooltip","KobalteTooltip","useTooltipContext","ComponentProps","createContext","createEffect","createSignal","createUniqueId","onCleanup","splitProps","useContext","isServer","tooltipTip","cn","TooltipTiming","openDelay","closeDelay","skipDelayDuration","tooltipDefaults","TooltipTimingContext","TooltipInteraction","id","trigger","HTMLElement","setTrigger","element","isOpen","isDisabled","isTriggerFocused","markOpenIntent","clearOpenIntent","requestCloseFromAnotherTooltip","markPointerCloseIntent","clearPointerCloseIntent","markCloseIntent","TooltipInteractionContext","openTooltipInteractions","Set","pendingTooltipOpenId","tooltipScrollListenerAttached","clearPendingTooltipOpen","undefined","tooltipScrollContainsTrigger","event","Event","target","window","Node","contains","handleTooltipScroll","interaction","handleTooltipPointerMove","PointerEvent","setTooltipInteractionOpen","open","has","add","addEventListener","document","delete","size","removeEventListener","registerTooltipInteraction","invokeEventHandler","handler","Array","isArray","callback","data","TooltipProviderProps","children","TooltipProvider","props","_$createComponent","Provider","value","TooltipRootProps","timing","local","rest","controlled","uncontrolledOpen","setUncontrolledOpen","defaultOpen","closeIntent","ignoreDuplicateClose","onOpenChange","next","source","pointerCloseIntentUntil","pointerCloseIntentTimeout","ReturnType","setTimeout","clearTimeout","Date","now","queueMicrotask","disabled","Boolean","activeElement","openInteraction","focusedTrigger","anotherTooltipOpening","pointerClosePending","handleKeyDown","KeyboardEvent","key","_$mergeProps","TooltipTrigger","Trigger","ref","onFocus","defaultPrevented","onBlur","onPointerEnter","onPointerLeave","onClick","TooltipContentProps","Content","TooltipContent","context","Portal","class","aria-hidden","_$memo","onEscapeKeyDown","onPointerDownOutside","_$createComponent","Tooltip","KobalteTooltip","_$mergeProps","_$memo"],"sources":["../../../../src/components/ui/tooltip/tooltip.tsx"],"sourcesContent":["import { Tooltip as KobalteTooltip, useTooltipContext } from '@kobalte/core/tooltip'\nimport type { ComponentProps } from 'solid-js'\nimport {\n createContext,\n createEffect,\n createSignal,\n createUniqueId,\n onCleanup,\n splitProps,\n useContext,\n} from 'solid-js'\nimport { isServer } from 'solid-js/web'\nimport { tooltipTip } from '#lib/overlay'\nimport { cn } from '#lib/utils'\n\n/**\n * The provider sets the *timing* defaults for every tooltip below it.\n *\n * Timing is the part of a tooltip that has to agree across an app: one that\n * opens in 200ms in a toolbar and 700ms in a sidebar reads as a bug. The\n * provider is where that agreement lives. It is optional — a tooltip outside a\n * provider falls back to the same defaults — so a consumer can drop it in\n * without restructuring anything.\n */\ntype TooltipTiming = {\n openDelay: number\n closeDelay: number\n skipDelayDuration: number\n}\n\nconst tooltipDefaults: TooltipTiming = {\n /** Long enough that a pointer crossing a toolbar does not strobe tooltips. */\n openDelay: 400,\n /** Short, because the pointer has already left the control. */\n closeDelay: 80,\n /**\n * After a tooltip has been seen, the next one opens immediately for this\n * long. This is what makes moving along a row of icons feel like one\n * gesture instead of four separate waits.\n */\n skipDelayDuration: 500,\n}\n\nconst TooltipTimingContext = createContext<TooltipTiming>(tooltipDefaults)\n\ntype TooltipInteraction = {\n id: string\n trigger: () => HTMLElement | undefined\n setTrigger: (element: HTMLElement) => void\n isOpen: () => boolean\n isDisabled: () => boolean\n isTriggerFocused: () => boolean\n markOpenIntent: () => void\n clearOpenIntent: () => void\n requestCloseFromAnotherTooltip: () => void\n markPointerCloseIntent: () => void\n clearPointerCloseIntent: () => void\n markCloseIntent: () => void\n}\n\nconst TooltipInteractionContext = createContext<TooltipInteraction>()\nconst openTooltipInteractions = new Set<TooltipInteraction>()\nlet pendingTooltipOpenId: string | undefined\nlet tooltipScrollListenerAttached = false\n\nfunction clearPendingTooltipOpen(id: string) {\n if (pendingTooltipOpenId === id) pendingTooltipOpenId = undefined\n}\n\nfunction tooltipScrollContainsTrigger(event: Event, trigger: HTMLElement) {\n const target = event.target\n return target === window || (target instanceof Node && target.contains(trigger))\n}\n\nfunction handleTooltipScroll(event: Event) {\n for (const interaction of openTooltipInteractions) {\n const trigger = interaction.trigger()\n if (interaction.isOpen() && trigger && tooltipScrollContainsTrigger(event, trigger)) {\n interaction.markCloseIntent()\n }\n }\n}\n\nfunction handleTooltipPointerMove(event: PointerEvent) {\n for (const interaction of openTooltipInteractions) {\n const trigger = interaction.trigger()\n const target = event.target\n if (\n interaction.isOpen() &&\n interaction.isTriggerFocused() &&\n trigger &&\n !(target instanceof Node && trigger.contains(target))\n ) {\n interaction.markPointerCloseIntent()\n }\n }\n}\n\nfunction setTooltipInteractionOpen(interaction: TooltipInteraction, open: boolean) {\n if (isServer) return\n\n if (open) {\n if (openTooltipInteractions.has(interaction)) return\n openTooltipInteractions.add(interaction)\n if (!tooltipScrollListenerAttached) {\n tooltipScrollListenerAttached = true\n // Register before Kobalte's global listeners so intentional scroll\n // dismissal can be distinguished from its delayed pointer dismissal.\n window.addEventListener('scroll', handleTooltipScroll, true)\n document.addEventListener('pointermove', handleTooltipPointerMove, true)\n }\n } else {\n openTooltipInteractions.delete(interaction)\n if (openTooltipInteractions.size === 0 && tooltipScrollListenerAttached) {\n tooltipScrollListenerAttached = false\n window.removeEventListener('scroll', handleTooltipScroll, true)\n document.removeEventListener('pointermove', handleTooltipPointerMove, true)\n }\n }\n}\n\nfunction registerTooltipInteraction(interaction: TooltipInteraction) {\n onCleanup(() => {\n setTooltipInteractionOpen(interaction, false)\n clearPendingTooltipOpen(interaction.id)\n })\n}\n\nfunction invokeEventHandler(handler: unknown, event: Event) {\n if (Array.isArray(handler)) {\n const [callback, data] = handler as [(data: unknown, event: Event) => void, unknown]\n callback(data, event)\n } else if (typeof handler === 'function') {\n const callback = handler as (event: Event) => void\n callback(event)\n }\n}\n\nexport type TooltipProviderProps = {\n children?: ComponentProps<'div'>['children']\n openDelay?: number\n closeDelay?: number\n skipDelayDuration?: number\n}\n\nexport function TooltipProvider(props: TooltipProviderProps) {\n return (\n <TooltipTimingContext.Provider\n value={{\n openDelay: props.openDelay ?? tooltipDefaults.openDelay,\n closeDelay: props.closeDelay ?? tooltipDefaults.closeDelay,\n skipDelayDuration: props.skipDelayDuration ?? tooltipDefaults.skipDelayDuration,\n }}\n >\n {props.children}\n </TooltipTimingContext.Provider>\n )\n}\n\nexport type TooltipRootProps = ComponentProps<typeof KobalteTooltip>\n\nexport function Tooltip(props: TooltipRootProps) {\n const timing = useContext(TooltipTimingContext)\n const [local, rest] = splitProps(props, ['open', 'defaultOpen', 'onOpenChange', 'disabled'])\n const id = createUniqueId()\n const controlled = () => local.open !== undefined\n const [uncontrolledOpen, setUncontrolledOpen] = createSignal(local.defaultOpen ?? false)\n const isOpen = () => (controlled() ? (local.open ?? false) : uncontrolledOpen())\n const [trigger, setTrigger] = createSignal<HTMLElement>()\n let closeIntent = false\n let ignoreDuplicateClose = false\n let onOpenChange: (next: boolean, source?: 'handoff') => void\n let pointerCloseIntentUntil = 0\n let pointerCloseIntentTimeout: ReturnType<typeof setTimeout> | undefined\n const clearPointerCloseIntent = () => {\n pointerCloseIntentUntil = 0\n if (pointerCloseIntentTimeout) clearTimeout(pointerCloseIntentTimeout)\n pointerCloseIntentTimeout = undefined\n }\n const markPointerCloseIntent = () => {\n if (!isOpen()) return\n clearPointerCloseIntent()\n const closeDelay = props.closeDelay ?? timing.closeDelay\n pointerCloseIntentUntil = Date.now() + closeDelay + 50\n pointerCloseIntentTimeout = setTimeout(clearPointerCloseIntent, closeDelay + 50)\n }\n const markCloseIntent = () => {\n closeIntent = true\n clearPointerCloseIntent()\n queueMicrotask(() => {\n closeIntent = false\n })\n }\n const requestCloseFromAnotherTooltip = () => {\n if (!isOpen()) return\n\n // Another trigger is an explicit handoff, even when a focused tooltip has\n // a pending pointer-close intent that would otherwise suppress Kobalte's\n // close callback. Route the request through the same controlled/uncontrolled\n // state contract as Kobalte and ignore its duplicate callback for this turn.\n ignoreDuplicateClose = true\n queueMicrotask(() => {\n ignoreDuplicateClose = false\n })\n onOpenChange(false, 'handoff')\n }\n const interaction: TooltipInteraction = {\n id,\n trigger,\n setTrigger,\n isOpen,\n isDisabled: () => local.disabled ?? false,\n isTriggerFocused: () =>\n Boolean(trigger() && typeof document !== 'undefined' && trigger() === document.activeElement),\n markOpenIntent: () => {\n clearPointerCloseIntent()\n pendingTooltipOpenId = id\n // A focused tooltip ignores ordinary pointer movement, but entering or\n // focusing another tooltip is an explicit transfer.\n for (const openInteraction of openTooltipInteractions) {\n if (openInteraction.id !== id) openInteraction.requestCloseFromAnotherTooltip()\n }\n },\n clearOpenIntent: () => clearPendingTooltipOpen(id),\n requestCloseFromAnotherTooltip,\n markPointerCloseIntent,\n clearPointerCloseIntent,\n markCloseIntent,\n }\n registerTooltipInteraction(interaction)\n onCleanup(() => {\n clearPointerCloseIntent()\n ignoreDuplicateClose = false\n })\n if (isOpen()) setTooltipInteractionOpen(interaction, true)\n createEffect(() => setTooltipInteractionOpen(interaction, isOpen()))\n onOpenChange = (next: boolean, source) => {\n if (!next && source !== 'handoff' && ignoreDuplicateClose) return\n\n if (next) {\n clearPendingTooltipOpen(id)\n clearPointerCloseIntent()\n // Install this capture listener before Kobalte's open-state effect adds\n // its scroll listener later in the same update.\n setTooltipInteractionOpen(interaction, true)\n } else {\n const focusedTrigger = interaction.isTriggerFocused()\n const anotherTooltipOpening =\n pendingTooltipOpenId !== undefined && pendingTooltipOpenId !== id\n const pointerClosePending = Date.now() <= pointerCloseIntentUntil\n if (\n source !== 'handoff' &&\n focusedTrigger &&\n pointerClosePending &&\n !closeIntent &&\n !anotherTooltipOpening\n ) {\n clearPointerCloseIntent()\n return\n }\n closeIntent = false\n clearPointerCloseIntent()\n clearPendingTooltipOpen(id)\n }\n\n if (!controlled()) setUncontrolledOpen(next)\n local.onOpenChange?.(next)\n if (next) {\n // A controlled parent can reject the open request without changing its\n // signal, so the effect above would not rerun to release this listener.\n queueMicrotask(() => {\n if (!isOpen()) setTooltipInteractionOpen(interaction, false)\n })\n }\n }\n\n // Kobalte dismisses on Escape only when its content owns the top-most\n // layer, and a handoff keeps the previous tooltip's content mounted while\n // it exits — swallowing the key for the tooltip that just took over.\n // Listening on document (capture) closes this tooltip first; the layer's\n // own handler still runs for anything stacked above it.\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key !== 'Escape') return\n markCloseIntent()\n onOpenChange(false)\n }\n createEffect(() => {\n if (isServer || !isOpen()) return\n document.addEventListener('keydown', handleKeyDown, true)\n onCleanup(() => document.removeEventListener('keydown', handleKeyDown, true))\n })\n\n return (\n <TooltipInteractionContext.Provider value={interaction}>\n <KobalteTooltip\n open={isOpen()}\n onOpenChange={onOpenChange}\n disabled={local.disabled}\n openDelay={props.openDelay ?? timing.openDelay}\n closeDelay={props.closeDelay ?? timing.closeDelay}\n skipDelayDuration={props.skipDelayDuration ?? timing.skipDelayDuration}\n {...rest}\n />\n </TooltipInteractionContext.Provider>\n )\n}\n\nexport function TooltipTrigger(props: ComponentProps<typeof KobalteTooltip.Trigger>) {\n const interaction = useContext(TooltipInteractionContext)\n const [local, rest] = splitProps(props, [\n 'ref',\n 'onFocus',\n 'onBlur',\n 'onPointerEnter',\n 'onPointerLeave',\n 'onClick',\n ])\n\n return (\n <KobalteTooltip.Trigger\n {...rest}\n ref={(element) => {\n interaction?.setTrigger(element)\n if (typeof local.ref === 'function') local.ref(element)\n }}\n onFocus={(event) => {\n invokeEventHandler(local.onFocus, event)\n if (!event.defaultPrevented && !interaction?.isDisabled()) interaction?.markOpenIntent()\n }}\n onBlur={(event) => {\n invokeEventHandler(local.onBlur, event)\n interaction?.clearOpenIntent()\n interaction?.markCloseIntent()\n }}\n onPointerEnter={(event) => {\n invokeEventHandler(local.onPointerEnter, event)\n if (!event.defaultPrevented && !interaction?.isDisabled()) interaction?.markOpenIntent()\n }}\n onPointerLeave={(event) => {\n invokeEventHandler(local.onPointerLeave, event)\n interaction?.clearOpenIntent()\n interaction?.markPointerCloseIntent()\n }}\n onClick={(event) => {\n invokeEventHandler(local.onClick, event)\n interaction?.markCloseIntent()\n }}\n />\n )\n}\n\nexport type TooltipContentProps = ComponentProps<typeof KobalteTooltip.Content>\n\nexport function TooltipContent(props: TooltipContentProps) {\n const interaction = useContext(TooltipInteractionContext)\n const [local, rest] = splitProps(props, [\n 'class',\n 'children',\n 'aria-hidden',\n 'onEscapeKeyDown',\n 'onPointerDownOutside',\n ])\n const context = useTooltipContext()\n\n // Kobalte keeps force-mounted and exiting content present after close. Hide\n // that retained tooltip from assistive technology until it opens again.\n return (\n <KobalteTooltip.Portal>\n <KobalteTooltip.Content\n class={cn(\n tooltipTip,\n // The max width is a token, not a fixed measure: it has to fall\n // behind the viewport at large root font sizes or the tip — which\n // Kobalte can shift but never shrink — forces a horizontal scroll.\n 'z-(--z-tooltip) w-fit max-w-(--tooltip-max-width) px-2 py-1',\n 'origin-(--kb-tooltip-content-transform-origin) text-balance',\n 'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n 'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n 'data-expanded:duration-150 data-closed:duration-100',\n local.class\n )}\n aria-hidden={context.isOpen() ? local['aria-hidden'] : true}\n onEscapeKeyDown={(event) => {\n invokeEventHandler(local.onEscapeKeyDown, event)\n if (!event.defaultPrevented) interaction?.markCloseIntent()\n }}\n onPointerDownOutside={(event) => {\n invokeEventHandler(local.onPointerDownOutside, event)\n if (!event.defaultPrevented) interaction?.markCloseIntent()\n }}\n {...rest}\n >\n {local.children}\n </KobalteTooltip.Content>\n </KobalteTooltip.Portal>\n )\n}\n"],"mappings":"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"}
@@ -15,6 +15,13 @@ export declare const overlaySurface = "bg-popover text-popover-foreground rounde
15
15
  export declare const overlayPositioner = "fixed inset-0 z-(--z-dialog) grid place-items-center p-4";
16
16
  /** The dimming layer behind a modal overlay. */
17
17
  export declare const overlayScrim = "fixed inset-0 z-(--z-dialog) bg-scrim/50 supports-[backdrop-filter]:backdrop-blur-xs";
18
+ /**
19
+ * The tip: the card-toned bubble an explanation shows in. The side rail draws
20
+ * it flush to a collapsed row and every floating tooltip composes the same
21
+ * fill, edge, and type, so a control never explains itself in two visual
22
+ * languages.
23
+ */
24
+ export declare const tooltipTip = "bg-card text-card-foreground rounded-md border border-border text-sm font-medium shadow-lg";
18
25
  /**
19
26
  * Entrance and exit motion, expressed as data-state classes.
20
27
  *
@@ -1 +1 @@
1
- {"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../src/lib/overlay.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,gEAAgE;AAChE,eAAO,MAAM,cAAc,iFACqD,CAAA;AAEhF,yEAAyE;AACzE,eAAO,MAAM,iBAAiB,6DAA6D,CAAA;AAE3F,gDAAgD;AAChD,eAAO,MAAM,YAAY,yFAC+D,CAAA;AAExF;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa,QAIf,CAAA;AAEX;qCACqC;AACrC,eAAO,MAAM,aAAa,QAGf,CAAA;AAEX,+DAA+D;AAC/D,eAAO,MAAM,YAAY,+BAA+B,CAAA;AAExD;;;GAGG;AACH,eAAO,MAAM,QAAQ,QAOV,CAAA;AAEX,qFAAqF;AACrF,eAAO,MAAM,mBAAmB,kGACiE,CAAA;AAEjG,4CAA4C;AAC5C,eAAO,MAAM,SAAS,mFAC4D,CAAA;AAElF,oCAAoC;AACpC,eAAO,MAAM,aAAa,8BAA8B,CAAA;AAExD,iDAAiD;AACjD,eAAO,MAAM,kBAAkB,QAAQ,CAAA"}
1
+ {"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../src/lib/overlay.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,gEAAgE;AAChE,eAAO,MAAM,cAAc,iFACqD,CAAA;AAEhF,yEAAyE;AACzE,eAAO,MAAM,iBAAiB,6DAA6D,CAAA;AAE3F,gDAAgD;AAChD,eAAO,MAAM,YAAY,yFAC+D,CAAA;AAExF;;;;;GAKG;AACH,eAAO,MAAM,UAAU,+FACuE,CAAA;AAE9F;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa,QAIf,CAAA;AAEX;qCACqC;AACrC,eAAO,MAAM,aAAa,QAGf,CAAA;AAEX,+DAA+D;AAC/D,eAAO,MAAM,YAAY,+BAA+B,CAAA;AAExD;;;GAGG;AACH,eAAO,MAAM,QAAQ,QAOV,CAAA;AAEX,qFAAqF;AACrF,eAAO,MAAM,mBAAmB,kGACiE,CAAA;AAEjG,4CAA4C;AAC5C,eAAO,MAAM,SAAS,mFAC4D,CAAA;AAElF,oCAAoC;AACpC,eAAO,MAAM,aAAa,8BAA8B,CAAA;AAExD,iDAAiD;AACjD,eAAO,MAAM,kBAAkB,QAAQ,CAAA"}
@@ -17,6 +17,13 @@ var overlayPositioner = "fixed inset-0 z-(--z-dialog) grid place-items-center p-
17
17
  /** The dimming layer behind a modal overlay. */
18
18
  var overlayScrim = "fixed inset-0 z-(--z-dialog) bg-scrim/50 supports-[backdrop-filter]:backdrop-blur-xs";
19
19
  /**
20
+ * The tip: the card-toned bubble an explanation shows in. The side rail draws
21
+ * it flush to a collapsed row and every floating tooltip composes the same
22
+ * fill, edge, and type, so a control never explains itself in two visual
23
+ * languages.
24
+ */
25
+ var tooltipTip = "bg-card text-card-foreground rounded-md border border-border text-sm font-medium shadow-lg";
26
+ /**
20
27
  * Entrance and exit motion, expressed as data-state classes.
21
28
  *
22
29
  * `data-expanded` / `data-closed` are Kobalte's; `data-side-*` come from its
@@ -54,6 +61,6 @@ var menuLabel = "px-2 py-1.5 text-2xs font-medium tracking-wide text-muted-foreg
54
61
  /** The rule between menu groups. */
55
62
  var menuSeparator = "bg-border -mx-1 my-1 h-px";
56
63
  //#endregion
57
- export { destructiveMenuItem, menuItem, menuLabel, menuSeparator, overlayMotion, overlayPositioner, overlayScrim, overlaySurface, popoverArrow, popoverMotion };
64
+ export { destructiveMenuItem, menuItem, menuLabel, menuSeparator, overlayMotion, overlayPositioner, overlayScrim, overlaySurface, popoverArrow, popoverMotion, tooltipTip };
58
65
 
59
66
  //# sourceMappingURL=overlay.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"overlay.js","names":[],"sources":["../../src/lib/overlay.ts"],"sourcesContent":["/**\n * Shared strings for the overlay layer: dialogs, sheets, menus, popovers,\n * tooltips and the command palette.\n *\n * These live here rather than in each component because the overlay family is\n * where consistency is most visible and least likely to survive duplication.\n * A dialog, a sheet and a dropdown that disagree about their border, radius,\n * motion or shadow read as three different apps — and an app that adopts this\n * library would inherit all three. Declaring the surface once is what makes\n * \"an overlay looks like this\" a fact rather than a convention.\n */\n\n/** The panel itself: fill, hairline edge, radius, elevation. */\nexport const overlaySurface =\n 'bg-popover text-popover-foreground rounded-xl border border-border shadow-lg'\n\n/** The span of the portal wrapper that centres a dialog-like overlay. */\nexport const overlayPositioner = 'fixed inset-0 z-(--z-dialog) grid place-items-center p-4'\n\n/** The dimming layer behind a modal overlay. */\nexport const overlayScrim =\n 'fixed inset-0 z-(--z-dialog) bg-scrim/50 supports-[backdrop-filter]:backdrop-blur-xs'\n\n/**\n * Entrance and exit motion, expressed as data-state classes.\n *\n * `data-expanded` / `data-closed` are Kobalte's; `data-side-*` come from its\n * popper positioning and let a menu slide in from the edge it is anchored to,\n * which is what makes a dropdown feel attached to its trigger rather than\n * dropped on the screen. Exit motion is shorter than entry, because a\n * dismissal should feel immediate while an arrival benefits from being seen.\n */\nexport const overlayMotion = [\n 'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n 'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n 'data-expanded:duration-200 data-closed:duration-150',\n].join(' ')\n\n/** Popover-style motion: no zoom, so a panel anchored to a control does not\n * appear to breathe away from it. */\nexport const popoverMotion = [\n 'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n 'data-expanded:duration-150 data-closed:duration-100',\n].join(' ')\n\n/** The popper arrow. Sized in the component; coloured here. */\nexport const popoverArrow = 'fill-popover stroke-border'\n\n/**\n * A menu row: the shared height, radius, hover fill and focus treatment for\n * every item inside a menu, listbox or command list.\n */\nexport const menuItem = [\n 'relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none',\n 'transition-colors ease-out',\n 'data-[highlighted]:bg-surface-hover data-[highlighted]:text-foreground',\n 'data-[disabled]:pointer-events-none data-[disabled]:text-muted-foreground',\n '[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-4',\n '[&_svg:not([class*=text-])]:text-muted-foreground',\n].join(' ')\n\n/** A destructive action keeps readable text and marks its row with a status edge. */\nexport const destructiveMenuItem =\n 'border-s-2 border-destructive ps-1.5 text-foreground data-[highlighted]:bg-destructive-subtle'\n\n/** The label above a group of menu rows. */\nexport const menuLabel =\n 'px-2 py-1.5 text-2xs font-medium tracking-wide text-muted-foreground uppercase'\n\n/** The rule between menu groups. */\nexport const menuSeparator = 'bg-border -mx-1 my-1 h-px'\n\n/** Padding shared by every menu-list surface. */\nexport const menuContentPadding = 'p-1'\n"],"mappings":";;;;;;;;;;;;;AAaA,IAAa,iBACX;;AAGF,IAAa,oBAAoB;;AAGjC,IAAa,eACX;;;;;;;;;;AAWF,IAAa,gBAAgB;CAC3B;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;;;AAIV,IAAa,gBAAgB,CAC3B,mGACA,qDACF,CAAC,CAAC,KAAK,GAAG;;AAGV,IAAa,eAAe;;;;;AAM5B,IAAa,WAAW;CACtB;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;;AAGV,IAAa,sBACX;;AAGF,IAAa,YACX;;AAGF,IAAa,gBAAgB"}
1
+ {"version":3,"file":"overlay.js","names":[],"sources":["../../src/lib/overlay.ts"],"sourcesContent":["/**\n * Shared strings for the overlay layer: dialogs, sheets, menus, popovers,\n * tooltips and the command palette.\n *\n * These live here rather than in each component because the overlay family is\n * where consistency is most visible and least likely to survive duplication.\n * A dialog, a sheet and a dropdown that disagree about their border, radius,\n * motion or shadow read as three different apps — and an app that adopts this\n * library would inherit all three. Declaring the surface once is what makes\n * \"an overlay looks like this\" a fact rather than a convention.\n */\n\n/** The panel itself: fill, hairline edge, radius, elevation. */\nexport const overlaySurface =\n 'bg-popover text-popover-foreground rounded-xl border border-border shadow-lg'\n\n/** The span of the portal wrapper that centres a dialog-like overlay. */\nexport const overlayPositioner = 'fixed inset-0 z-(--z-dialog) grid place-items-center p-4'\n\n/** The dimming layer behind a modal overlay. */\nexport const overlayScrim =\n 'fixed inset-0 z-(--z-dialog) bg-scrim/50 supports-[backdrop-filter]:backdrop-blur-xs'\n\n/**\n * The tip: the card-toned bubble an explanation shows in. The side rail draws\n * it flush to a collapsed row and every floating tooltip composes the same\n * fill, edge, and type, so a control never explains itself in two visual\n * languages.\n */\nexport const tooltipTip =\n 'bg-card text-card-foreground rounded-md border border-border text-sm font-medium shadow-lg'\n\n/**\n * Entrance and exit motion, expressed as data-state classes.\n *\n * `data-expanded` / `data-closed` are Kobalte's; `data-side-*` come from its\n * popper positioning and let a menu slide in from the edge it is anchored to,\n * which is what makes a dropdown feel attached to its trigger rather than\n * dropped on the screen. Exit motion is shorter than entry, because a\n * dismissal should feel immediate while an arrival benefits from being seen.\n */\nexport const overlayMotion = [\n 'data-expanded:animate-in data-expanded:fade-in-0 data-expanded:zoom-in-95',\n 'data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n 'data-expanded:duration-200 data-closed:duration-150',\n].join(' ')\n\n/** Popover-style motion: no zoom, so a panel anchored to a control does not\n * appear to breathe away from it. */\nexport const popoverMotion = [\n 'data-expanded:animate-in data-expanded:fade-in-0 data-closed:animate-out data-closed:fade-out-0',\n 'data-expanded:duration-150 data-closed:duration-100',\n].join(' ')\n\n/** The popper arrow. Sized in the component; coloured here. */\nexport const popoverArrow = 'fill-popover stroke-border'\n\n/**\n * A menu row: the shared height, radius, hover fill and focus treatment for\n * every item inside a menu, listbox or command list.\n */\nexport const menuItem = [\n 'relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none select-none',\n 'transition-colors ease-out',\n 'data-[highlighted]:bg-surface-hover data-[highlighted]:text-foreground',\n 'data-[disabled]:pointer-events-none data-[disabled]:text-muted-foreground',\n '[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:size-4',\n '[&_svg:not([class*=text-])]:text-muted-foreground',\n].join(' ')\n\n/** A destructive action keeps readable text and marks its row with a status edge. */\nexport const destructiveMenuItem =\n 'border-s-2 border-destructive ps-1.5 text-foreground data-[highlighted]:bg-destructive-subtle'\n\n/** The label above a group of menu rows. */\nexport const menuLabel =\n 'px-2 py-1.5 text-2xs font-medium tracking-wide text-muted-foreground uppercase'\n\n/** The rule between menu groups. */\nexport const menuSeparator = 'bg-border -mx-1 my-1 h-px'\n\n/** Padding shared by every menu-list surface. */\nexport const menuContentPadding = 'p-1'\n"],"mappings":";;;;;;;;;;;;;AAaA,IAAa,iBACX;;AAGF,IAAa,oBAAoB;;AAGjC,IAAa,eACX;;;;;;;AAQF,IAAa,aACX;;;;;;;;;;AAWF,IAAa,gBAAgB;CAC3B;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;;;AAIV,IAAa,gBAAgB,CAC3B,mGACA,qDACF,CAAC,CAAC,KAAK,GAAG;;AAGV,IAAa,eAAe;;;;;AAM5B,IAAa,WAAW;CACtB;CACA;CACA;CACA;CACA;CACA;AACF,CAAC,CAAC,KAAK,GAAG;;AAGV,IAAa,sBACX;;AAGF,IAAa,YACX;;AAGF,IAAa,gBAAgB"}
@@ -1 +1 @@
1
- {"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/lib/tokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAIH,MAAM,MAAM,SAAS,GACjB,OAAO,GACP,WAAW,GACX,aAAa,GACb,QAAQ,GACR,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,MAAM,CAAA;AAEV,MAAM,MAAM,eAAe,GAAG;IAC5B,0DAA0D;IAC1D,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,SAAS,CAAA;IACf,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAA;IACnB,oEAAoE;IACpE,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,eAAe,EAoUxC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,eAAe,EAezC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,eAAe,EAyE7C,CAAA;AAED;;+EAE+E;AAC/E,eAAO,MAAM,aAAa,EAAE,eAAe,EA6E1C,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,eAAe,EA2B5C,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,eAAe,EAkBzC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,eAAe,EAyBzC,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,qEAAqE;IACrE,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAA;IACnB,uEAAuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,SAAS,YAAY,EAQ/C,CAAA;AAEF;;;;;;;;;GASG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,oFAAoF;IACpF,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,gDAAgD;IAChD,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;CAChC,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,SAAS,UAAU,EA+B3C,CAAA;AAEF,qCAAqC;AACrC,eAAO,MAAM,YAAY;;;;;;;;CAQf,CAAA;AAEV,yDAAyD;AACzD,eAAO,MAAM,SAAS,EAAE,eAAe,EAAuC,CAAA;AAE9E;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,EAAE,MAAM,EAAe,CAAA"}
1
+ {"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/lib/tokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAIH,MAAM,MAAM,SAAS,GACjB,OAAO,GACP,WAAW,GACX,aAAa,GACb,QAAQ,GACR,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,MAAM,CAAA;AAEV,MAAM,MAAM,eAAe,GAAG;IAC5B,0DAA0D;IAC1D,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,SAAS,CAAA;IACf,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAA;IACnB,oEAAoE;IACpE,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,eAAe,EAoUxC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,eAAe,EAezC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,eAAe,EAyE7C,CAAA;AAED;;+EAE+E;AAC/E,eAAO,MAAM,aAAa,EAAE,eAAe,EAmF1C,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,eAAe,EA2B5C,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,eAAe,EAkBzC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,eAAe,EAyBzC,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,qEAAqE;IACrE,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAA;IACnB,uEAAuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,SAAS,YAAY,EAQ/C,CAAA;AAEF;;;;;;;;;GASG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB,oFAAoF;IACpF,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,gDAAgD;IAChD,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;CAChC,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,SAAS,UAAU,EA+B3C,CAAA;AAEF,qCAAqC;AACrC,eAAO,MAAM,YAAY;;;;;;;;CAQf,CAAA;AAEV,yDAAyD;AACzD,eAAO,MAAM,SAAS,EAAE,eAAe,EAAuC,CAAA;AAE9E;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,EAAE,MAAM,EAAe,CAAA"}
@@ -660,6 +660,11 @@ var densityTokens = [
660
660
  name: "statusbar-height",
661
661
  kind: "dimension",
662
662
  description: "28px — the bottom readout strip."
663
+ },
664
+ {
665
+ name: "tooltip-max-width",
666
+ kind: "dimension",
667
+ description: "The lesser of the 16rem readable measure and one viewport minus a gutter — a tip wraps before it can push its document wider than itself."
663
668
  }
664
669
  ];
665
670
  var elevationTokens = [
@@ -1 +1 @@
1
- {"version":3,"file":"tokens.js","names":[],"sources":["../../src/lib/tokens.ts"],"sourcesContent":["/**\n * The design system's token manifest.\n *\n * `theme.css` is the source of truth for token *values*. This file is the\n * source of truth for token *names and meaning* — what each one is for, and\n * which ones a theme may vary.\n *\n * It exists because a manifest that is only documentation rots. Two things read\n * it instead:\n *\n * - the token galleries in Storybook, so the review surface shows every token\n * rather than the ones an author remembered;\n * - `tests/tokens.test.ts`, which parses `theme.css` and fails when a token\n * is declared in one place and missing from the other.\n *\n * That pairing is what makes \"every token is documented and every documented\n * token exists\" a property the build enforces rather than a promise.\n */\n\nimport { ACCENTS } from '@adea-ai/themes'\n\nexport type TokenKind =\n | 'color'\n | 'dimension'\n | 'font-family'\n | 'number'\n | 'duration'\n | 'easing'\n | 'shadow'\n | 'text'\n\nexport type TokenDefinition = {\n /** The custom property name, without the leading `--`. */\n name: string\n kind: TokenKind\n /** One line: what this token is for. Shown in the gallery. */\n description: string\n /** True when the light and dark themes give it different values. */\n themed?: boolean\n}\n\n/**\n * Colour roles, in the order they appear in a page: surfaces first, then text,\n * then the lines between them, then the semantic fills. The order is the\n * documentation — reading the gallery top to bottom walks the surface ladder.\n */\nexport const colorTokens: TokenDefinition[] = [\n // Surfaces\n {\n name: 'background',\n kind: 'color',\n themed: true,\n description: 'The canvas every panel sits on.',\n },\n {\n name: 'foreground',\n kind: 'color',\n themed: true,\n description: 'Default body text on the canvas.',\n },\n {\n name: 'card',\n kind: 'color',\n themed: true,\n description: 'A panel or card raised one rung above the canvas.',\n },\n { name: 'card-foreground', kind: 'color', themed: true, description: 'Text on `card`.' },\n {\n name: 'popover',\n kind: 'color',\n themed: true,\n description: 'A floating surface: dialog, menu, popover, tooltip-free.',\n },\n { name: 'popover-foreground', kind: 'color', themed: true, description: 'Text on `popover`.' },\n {\n name: 'surface',\n kind: 'color',\n themed: true,\n description: 'Alias of `background`, for code that means \"a surface\" not \"the page\".',\n },\n {\n name: 'surface-sunken',\n kind: 'color',\n themed: true,\n description: 'A well: code blocks, inset lists, empty states.',\n },\n {\n name: 'surface-raised',\n kind: 'color',\n themed: true,\n description: 'Alias of `card`, for panels that sit on the canvas.',\n },\n {\n name: 'surface-overlay',\n kind: 'color',\n themed: true,\n description: 'Alias of `popover`, for floating layers.',\n },\n {\n name: 'surface-hover',\n kind: 'color',\n themed: true,\n description: 'The hover fill shared by rows, menu items and ghost controls.',\n },\n {\n name: 'surface-active',\n kind: 'color',\n themed: true,\n description: 'The pressed/selected fill, one rung past hover.',\n },\n {\n name: 'chrome',\n kind: 'color',\n themed: true,\n description: 'Window chrome: the top bar and its frosted fill.',\n },\n {\n name: 'chrome-alpha',\n kind: 'number',\n themed: true,\n description: 'Opacity of the chrome fill behind a blur.',\n },\n\n // The brand action\n {\n name: 'primary',\n kind: 'color',\n themed: true,\n description: 'The Adea emerald. The one primary action in a view.',\n },\n {\n name: 'primary-foreground',\n kind: 'color',\n themed: true,\n description: 'Label on `primary`. Black in dark, white in light — the accent flips polarity.',\n },\n {\n name: 'primary-hover',\n kind: 'color',\n themed: true,\n description: 'Hover rung for a primary action.',\n },\n {\n name: 'primary-subtle',\n kind: 'color',\n themed: true,\n description: 'Tinted primary fill: selected rows, focus rings, subtle buttons.',\n },\n\n {\n name: 'secondary',\n kind: 'color',\n themed: true,\n description: 'A quieter filled surface for a secondary action.',\n },\n {\n name: 'secondary-foreground',\n kind: 'color',\n themed: true,\n description: 'Label on `secondary`.',\n },\n {\n name: 'muted',\n kind: 'color',\n themed: true,\n description: 'A neutral fill: skeletons, inert chips, table footers.',\n },\n {\n name: 'muted-foreground',\n kind: 'color',\n themed: true,\n description: 'De-emphasised text. Measured to clear 4.5:1 on both `background` and `card`.',\n },\n {\n name: 'accent',\n kind: 'color',\n themed: true,\n description: \"shadcn's hover-surface accent. Not the brand colour — that is `primary`.\",\n },\n { name: 'accent-foreground', kind: 'color', themed: true, description: 'Text on `accent`.' },\n\n // Status\n {\n name: 'destructive',\n kind: 'color',\n themed: true,\n description: 'The canonical error hue for semantic status indicators and tinted notices.',\n },\n {\n name: 'destructive-foreground',\n kind: 'color',\n themed: true,\n description:\n 'Text on the canonical error hue; solid actions use `destructive-action-foreground`.',\n },\n {\n name: 'destructive-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque destructive tint against the canvas; subtle labels use foreground.',\n },\n {\n name: 'destructive-action',\n kind: 'color',\n themed: true,\n description: 'Contrast-safe solid fill for destructive actions, derived from the error role.',\n },\n {\n name: 'destructive-action-foreground',\n kind: 'color',\n themed: true,\n description: 'Text on the destructive action fill and its 90% hover composition.',\n },\n { name: 'success', kind: 'color', themed: true, description: 'A completed or healthy state.' },\n { name: 'success-foreground', kind: 'color', themed: true, description: 'Label on `success`.' },\n {\n name: 'success-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque success tint against the canvas; subtle labels use foreground.',\n },\n {\n name: 'warning',\n kind: 'color',\n themed: true,\n description: 'Something needs attention but is not broken.',\n },\n { name: 'warning-foreground', kind: 'color', themed: true, description: 'Label on `warning`.' },\n {\n name: 'warning-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque warning tint against the canvas; subtle labels use foreground.',\n },\n { name: 'info', kind: 'color', themed: true, description: 'Neutral information.' },\n { name: 'info-foreground', kind: 'color', themed: true, description: 'Label on `info`.' },\n {\n name: 'info-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque info tint against the canvas; subtle labels use foreground.',\n },\n\n // Lines\n {\n name: 'border',\n kind: 'color',\n themed: true,\n description: 'Every hairline: panel edges, dividers, card outlines.',\n },\n {\n name: 'input',\n kind: 'color',\n themed: true,\n description:\n 'The edge of an editable control. A rung stronger than `border` so a field is findable.',\n },\n {\n name: 'ring',\n kind: 'color',\n themed: true,\n description: 'The focus ring. Always paired with `primary-subtle` as its glow.',\n },\n\n // Theme-invariant glass\n {\n name: 'scrim',\n kind: 'color',\n description: 'Dark glass for overlays and on-screen controls. Same in both themes.',\n },\n { name: 'scrim-foreground', kind: 'color', description: 'Text drawn on `scrim`.' },\n { name: 'scrim-edge', kind: 'color', description: 'The hairline drawn on `scrim`.' },\n\n // Diff and code\n { name: 'diff-add', kind: 'color', themed: true, description: 'Background of an added line.' },\n {\n name: 'diff-add-foreground',\n kind: 'color',\n themed: true,\n description: 'Text of an added line.',\n },\n {\n name: 'diff-delete',\n kind: 'color',\n themed: true,\n description: 'Background of a removed line.',\n },\n {\n name: 'diff-delete-foreground',\n kind: 'color',\n themed: true,\n description: 'Text of a removed line.',\n },\n { name: 'diff-hunk', kind: 'color', themed: true, description: 'Background of a hunk header.' },\n {\n name: 'diff-hunk-foreground',\n kind: 'color',\n themed: true,\n description: 'Text of a hunk header.',\n },\n {\n name: 'diff-meta-foreground',\n kind: 'color',\n themed: true,\n description: 'File headers and line numbers in a diff.',\n },\n\n // Charts\n {\n name: 'chart-1',\n kind: 'color',\n themed: true,\n description: 'Categorical series 1. The set is closed at six.',\n },\n { name: 'chart-2', kind: 'color', themed: true, description: 'Categorical series 2.' },\n { name: 'chart-3', kind: 'color', themed: true, description: 'Categorical series 3.' },\n { name: 'chart-4', kind: 'color', themed: true, description: 'Categorical series 4.' },\n { name: 'chart-5', kind: 'color', themed: true, description: 'Categorical series 5.' },\n { name: 'chart-6', kind: 'color', themed: true, description: 'Categorical series 6.' },\n\n // Sidebar (the shadcn contract, kept whole)\n {\n name: 'sidebar',\n kind: 'color',\n themed: true,\n description: 'The rail and sidebar surface, tinted against the canvas.',\n },\n {\n name: 'sidebar-foreground',\n kind: 'color',\n themed: true,\n description: 'Default text in the rail and sidebar.',\n },\n {\n name: 'sidebar-primary',\n kind: 'color',\n themed: true,\n description: 'The active destination in the rail.',\n },\n {\n name: 'sidebar-primary-foreground',\n kind: 'color',\n themed: true,\n description: 'Text on the active rail destination.',\n },\n {\n name: 'sidebar-accent',\n kind: 'color',\n themed: true,\n description: 'Hover and selected fill for rail and sidebar rows.',\n },\n {\n name: 'sidebar-accent-foreground',\n kind: 'color',\n themed: true,\n description: 'Text on `sidebar-accent`.',\n },\n {\n name: 'sidebar-border',\n kind: 'color',\n themed: true,\n description: 'The rule between the rail and the canvas.',\n },\n { name: 'sidebar-ring', kind: 'color', themed: true, description: 'Focus ring inside the rail.' },\n {\n name: 'sidebar-muted-foreground',\n kind: 'color',\n themed: true,\n description: 'Rail labels that are not the current destination.',\n },\n]\n\nexport const radiusTokens: TokenDefinition[] = [\n {\n name: 'radius-lg',\n kind: 'dimension',\n description:\n '10px — cards and panels. Also the knob: move this one value to re-round the whole system.',\n },\n { name: 'radius-sm', kind: 'dimension', description: '6px — badges, keyboard keys, menu items.' },\n {\n name: 'radius-md',\n kind: 'dimension',\n description: '8px — every control: buttons, inputs, selects.',\n },\n { name: 'radius-xl', kind: 'dimension', description: '14px — dialogs, menus, sheets.' },\n { name: 'radius-2xl', kind: 'dimension', description: '18px — full-window surfaces and media.' },\n]\n\nexport const typographyTokens: TokenDefinition[] = [\n {\n name: 'font-sans',\n kind: 'font-family',\n description: 'The selected interface face. Space Grotesk unless the font axis says otherwise.',\n },\n {\n name: 'font-mono',\n kind: 'font-family',\n description: 'The selected monospace face. Code, terminals, ids, paths.',\n },\n {\n name: 'font-family-space-grotesk',\n kind: 'font-family',\n description: 'The interface default, and the face the visual language was drawn against.',\n },\n {\n name: 'font-family-jetbrains-mono',\n kind: 'font-family',\n description: 'The monospace default. Code, terminals, diffs.',\n },\n {\n name: 'font-family-geist',\n kind: 'font-family',\n description: 'An alternative interface face. cortana already ships it.',\n },\n {\n name: 'font-family-geist-mono',\n kind: 'font-family',\n description: 'The monospace counterpart to Geist.',\n },\n {\n name: 'font-family-system',\n kind: 'font-family',\n description: \"The platform's own interface face. First-class, not a fallback.\",\n },\n {\n name: 'font-family-system-mono',\n kind: 'font-family',\n description: \"The platform's own monospace face.\",\n },\n {\n name: 'ui-tracking',\n kind: 'text',\n description:\n 'Letter spacing for measured chrome. `normal` on a proportional face, tightened when the UI font is monospace — which is roughly 20% wider at the same size.',\n },\n {\n name: 'ui-word-spacing',\n kind: 'text',\n description:\n \"Word spacing for measured chrome. Mono's space is a full advance-width cell, so a two-word label reads as two floating words without this.\",\n },\n {\n name: 'text-2xs',\n kind: 'text',\n description: '11px — the smallest label the system permits: kbd keys, status bar.',\n },\n { name: 'text-xs', kind: 'text', description: '12px — metadata, badges, secondary rows.' },\n {\n name: 'text-sm',\n kind: 'text',\n description: '14px — the interface default. Body copy, labels, controls.',\n },\n { name: 'text-base', kind: 'text', description: '16px — card titles and dialog titles.' },\n { name: 'text-lg', kind: 'text', description: '18px — a section heading inside a page.' },\n { name: 'text-xl', kind: 'text', description: '20px — a page title.' },\n { name: 'text-2xl', kind: 'text', description: '24px — a display figure.' },\n {\n name: 'text-3xl',\n kind: 'text',\n description: '30px — the largest size in the system. Reserved for an empty-state headline.',\n },\n]\n\n/** Height tokens also size both axes of icon controls through Tailwind's --size\n * namespace. Padding has its own --spacing mapping. Nominal pixel descriptions\n * use a 16px rem; rendered dimensions follow the consumer's root font size. */\nexport const densityTokens: TokenDefinition[] = [\n { name: 'control-height-2xs', kind: 'dimension', description: '20px — an inline chip control.' },\n { name: 'control-height-xs', kind: 'dimension', description: '24px — a dense table row action.' },\n { name: 'control-height-sm', kind: 'dimension', description: '28px — the toolbar default.' },\n {\n name: 'control-height-md',\n kind: 'dimension',\n description: '32px — the form default. Button and Input are this size unless told otherwise.',\n },\n { name: 'control-height-lg', kind: 'dimension', description: '36px — a primary form action.' },\n {\n name: 'control-height-xl',\n kind: 'dimension',\n description: '40px — a hero control in an empty state.',\n },\n {\n name: 'control-height-2xl',\n kind: 'dimension',\n description: '48px — a stable touch target, unchanged by compact density.',\n },\n {\n name: 'control-padding-2xs',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 20px control.',\n },\n {\n name: 'control-padding-xs',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 24px control.',\n },\n {\n name: 'control-padding-sm',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 28px control.',\n },\n {\n name: 'control-padding-md',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 32px control.',\n },\n {\n name: 'control-padding-lg',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 36px control.',\n },\n {\n name: 'control-padding-xl',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 40px control.',\n },\n {\n name: 'control-padding-2xl',\n kind: 'dimension',\n description: 'Inline padding that pairs with the stable 48px touch target.',\n },\n { name: 'row-height-sm', kind: 'dimension', description: '28px — a dense list row.' },\n { name: 'row-height-md', kind: 'dimension', description: '32px — the default list row.' },\n { name: 'row-height-lg', kind: 'dimension', description: '36px — a two-line list row.' },\n { name: 'rail-width', kind: 'dimension', description: '56px — the icon-only rail.' },\n { name: 'rail-width-expanded', kind: 'dimension', description: '236px — the labelled rail.' },\n {\n name: 'rail-item-height',\n kind: 'dimension',\n description: '36px — a rail or sidebar destination.',\n },\n {\n name: 'sidebar-width',\n kind: 'dimension',\n description: '256px — the secondary navigation column.',\n },\n {\n name: 'sidebar-width-compact',\n kind: 'dimension',\n description: '48px — the collapsed secondary column.',\n },\n { name: 'topbar-height', kind: 'dimension', description: '48px — the window title row.' },\n { name: 'statusbar-height', kind: 'dimension', description: '28px — the bottom readout strip.' },\n]\n\nexport const elevationTokens: TokenDefinition[] = [\n {\n name: 'shadow-2xs',\n kind: 'shadow',\n themed: true,\n description: 'Barely there: a chip resting on a card.',\n },\n {\n name: 'shadow-xs',\n kind: 'shadow',\n themed: true,\n description: 'A card or panel on the canvas.',\n },\n {\n name: 'shadow-sm',\n kind: 'shadow',\n themed: true,\n description: 'A control that lifts: a pressed toggle, a thumb.',\n },\n { name: 'shadow-md', kind: 'shadow', themed: true, description: 'A menu or popover.' },\n { name: 'shadow-lg', kind: 'shadow', themed: true, description: 'A dialog or sheet.' },\n {\n name: 'shadow-xl',\n kind: 'shadow',\n themed: true,\n description: 'The command palette, above everything.',\n },\n]\n\nexport const motionTokens: TokenDefinition[] = [\n {\n name: 'duration-fast',\n kind: 'duration',\n description: '120ms — a state change the user is already watching.',\n },\n { name: 'duration-normal', kind: 'duration', description: '200ms — an entrance.' },\n { name: 'duration-slow', kind: 'duration', description: '320ms — a layout settle.' },\n {\n name: 'ease-out',\n kind: 'easing',\n description: 'A fast start and a long settle. Reads as decisive rather than floaty.',\n },\n {\n name: 'ease-in-out',\n kind: 'easing',\n description: 'For a loop that has no start or end, such as a shimmer.',\n },\n]\n\nexport const zIndexTokens: TokenDefinition[] = [\n { name: 'z-base', kind: 'number', description: 'In flow, at the document order.' },\n {\n name: 'z-docked',\n kind: 'number',\n description: 'A sticky table header standing above its own scroll body.',\n },\n { name: 'z-sticky', kind: 'number', description: 'The top bar and any other pinned chrome.' },\n { name: 'z-drawer', kind: 'number', description: 'A drawer, below a modal dialog.' },\n { name: 'z-dialog', kind: 'number', description: 'A modal dialog and its scrim.' },\n {\n name: 'z-menu',\n kind: 'number',\n description: 'Menus, popovers and comboboxes. Above dialogs, because a dialog can contain one.',\n },\n {\n name: 'z-tooltip',\n kind: 'number',\n description: 'Tooltips. Above menus, because a menu item can carry one.',\n },\n {\n name: 'z-toast',\n kind: 'number',\n description: 'Notifications. Above everything, so they are never hidden by a dialog.',\n },\n]\n\n/**\n * The accent axis.\n *\n * adea's accent presets, as a selection rather than a constant. `theme` is the\n * default and means \"the variant's own primary\" — monochrome in adea's palette —\n * and each named preset overrides the interactive roles through the\n * `[data-accent]` blocks in `theme.css`.\n *\n * These are the same six presets `accentPresets` exports in adea's own\n * `appearance.ts`, and the values match. A consumer's appearance picker and the\n * workshop's theme toolbar read this one list, so the two cannot disagree about\n * what a preset is called or what colour it is.\n */\nexport type AccentPreset = {\n /** The `data-accent` value. `theme` is the variant's own primary. */\n id: string\n label: string\n /** What the preset is for, in the gallery and in a picker. */\n description: string\n /** The accent as it appears in the light theme. Absent for `theme`. */\n light?: string\n /** The accent as it appears in the dark theme. Absent for `theme`. */\n dark?: string\n}\n\nexport const accentPresets: readonly AccentPreset[] = Object.freeze([\n {\n id: 'theme',\n label: 'Theme',\n description:\n \"The variant's own primary. Neutral in adea's palette, so the interface stays monochrome.\",\n },\n ...ACCENTS,\n])\n\n/**\n * The font axis.\n *\n * The family is a selection, like the accent: `data-font` sits on the same element\n * and each option swaps the interface face. `space-grotesk` is the default because\n * it is the face the visual language was drawn against, and `system` is a\n * first-class option rather than a fallback — an application that wants the\n * platform's own face should be able to say so without losing the rest of the\n * system.\n */\nexport type FontOption = {\n /** The `data-font` value. `space-grotesk` is the default and needs no attribute. */\n id: string\n label: string\n description: string\n /** Which of the two stacks this option sets. */\n stack: 'sans' | 'mono' | 'both'\n}\n\nexport const fontOptions: readonly FontOption[] = Object.freeze([\n {\n id: 'space-grotesk',\n label: 'Space Grotesk',\n description: 'The default, and the face the visual language was drawn against.',\n stack: 'both',\n },\n {\n id: 'system',\n label: 'System',\n description: \"The platform's own face. What a terminal or editor usually wants.\",\n stack: 'both',\n },\n {\n id: 'geist',\n label: 'Geist',\n description: 'The face cortana already ships. Neutral and wide.',\n stack: 'both',\n },\n {\n id: 'geist-mono',\n label: 'Geist Mono',\n description: 'Monospace throughout, for someone who wants a uniform texture.',\n stack: 'both',\n },\n {\n id: 'jetbrains-mono',\n label: 'JetBrains Mono',\n description: 'Monospace throughout, with coding ligatures off.',\n stack: 'both',\n },\n])\n\n/** Every token, in gallery order. */\nexport const designTokens = {\n color: colorTokens,\n radius: radiusTokens,\n typography: typographyTokens,\n density: densityTokens,\n elevation: elevationTokens,\n motion: motionTokens,\n zIndex: zIndexTokens,\n} as const\n\n/** Flat list, for completeness checks and for search. */\nexport const allTokens: TokenDefinition[] = Object.values(designTokens).flat()\n\n/**\n * Aliases that exist only to make a call site read better, and which therefore\n * have no gallery row of their own. Kept explicit so the completeness check\n * below can tell \"deliberately absent\" from \"forgotten\".\n */\nexport const undocumentedTokenAliases: string[] = ['radius']\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,IAAa,cAAiC;CAE5C;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAmB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAkB;CACvF;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAsB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAqB;CAC7F;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CAGA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CAEA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAqB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAoB;CAG3F;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aACE;CACJ;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAW,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAgC;CAC7F;EAAE,MAAM;EAAsB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAsB;CAC9F;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAsB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAsB;CAC9F;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAQ,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAuB;CACjF;EAAE,MAAM;EAAmB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAmB;CACxF;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CAGA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aACE;CACJ;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CAGA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAoB,MAAM;EAAS,aAAa;CAAyB;CACjF;EAAE,MAAM;EAAc,MAAM;EAAS,aAAa;CAAiC;CAGnF;EAAE,MAAM;EAAY,MAAM;EAAS,QAAQ;EAAM,aAAa;CAA+B;CAC7F;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAa,MAAM;EAAS,QAAQ;EAAM,aAAa;CAA+B;CAC9F;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CAGA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAW,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAwB;CACrF;EAAE,MAAM;EAAW,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAwB;CACrF;EAAE,MAAM;EAAW,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAwB;CACrF;EAAE,MAAM;EAAW,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAwB;CACrF;EAAE,MAAM;EAAW,MAAM;EAAS,QAAQ;EAAM,aAAa;CAAwB;CAGrF;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAgB,MAAM;EAAS,QAAQ;EAAM,aAAa;CAA8B;CAChG;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;AACF;AAEA,IAAa,eAAkC;CAC7C;EACE,MAAM;EACN,MAAM;EACN,aACE;CACJ;CACA;EAAE,MAAM;EAAa,MAAM;EAAa,aAAa;CAA2C;CAChG;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAa,MAAM;EAAa,aAAa;CAAiC;CACtF;EAAE,MAAM;EAAc,MAAM;EAAa,aAAa;CAAyC;AACjG;AAEA,IAAa,mBAAsC;CACjD;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aACE;CACJ;CACA;EACE,MAAM;EACN,MAAM;EACN,aACE;CACJ;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAW,MAAM;EAAQ,aAAa;CAA2C;CACzF;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAa,MAAM;EAAQ,aAAa;CAAwC;CACxF;EAAE,MAAM;EAAW,MAAM;EAAQ,aAAa;CAA0C;CACxF;EAAE,MAAM;EAAW,MAAM;EAAQ,aAAa;CAAuB;CACrE;EAAE,MAAM;EAAY,MAAM;EAAQ,aAAa;CAA2B;CAC1E;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;AACF;;;;AAKA,IAAa,gBAAmC;CAC9C;EAAE,MAAM;EAAsB,MAAM;EAAa,aAAa;CAAiC;CAC/F;EAAE,MAAM;EAAqB,MAAM;EAAa,aAAa;CAAmC;CAChG;EAAE,MAAM;EAAqB,MAAM;EAAa,aAAa;CAA8B;CAC3F;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAqB,MAAM;EAAa,aAAa;CAAgC;CAC7F;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAiB,MAAM;EAAa,aAAa;CAA2B;CACpF;EAAE,MAAM;EAAiB,MAAM;EAAa,aAAa;CAA+B;CACxF;EAAE,MAAM;EAAiB,MAAM;EAAa,aAAa;CAA8B;CACvF;EAAE,MAAM;EAAc,MAAM;EAAa,aAAa;CAA6B;CACnF;EAAE,MAAM;EAAuB,MAAM;EAAa,aAAa;CAA6B;CAC5F;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAiB,MAAM;EAAa,aAAa;CAA+B;CACxF;EAAE,MAAM;EAAoB,MAAM;EAAa,aAAa;CAAmC;AACjG;AAEA,IAAa,kBAAqC;CAChD;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;CACA;EAAE,MAAM;EAAa,MAAM;EAAU,QAAQ;EAAM,aAAa;CAAqB;CACrF;EAAE,MAAM;EAAa,MAAM;EAAU,QAAQ;EAAM,aAAa;CAAqB;CACrF;EACE,MAAM;EACN,MAAM;EACN,QAAQ;EACR,aAAa;CACf;AACF;AAEA,IAAa,eAAkC;CAC7C;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAmB,MAAM;EAAY,aAAa;CAAuB;CACjF;EAAE,MAAM;EAAiB,MAAM;EAAY,aAAa;CAA2B;CACnF;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;AACF;AAEA,IAAa,eAAkC;CAC7C;EAAE,MAAM;EAAU,MAAM;EAAU,aAAa;CAAkC;CACjF;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EAAE,MAAM;EAAY,MAAM;EAAU,aAAa;CAA2C;CAC5F;EAAE,MAAM;EAAY,MAAM;EAAU,aAAa;CAAkC;CACnF;EAAE,MAAM;EAAY,MAAM;EAAU,aAAa;CAAgC;CACjF;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;CACA;EACE,MAAM;EACN,MAAM;EACN,aAAa;CACf;AACF;AA2BA,IAAa,gBAAyC,OAAO,OAAO,CAClE;CACE,IAAI;CACJ,OAAO;CACP,aACE;AACJ,GACA,GAAG,OACL,CAAC;AAqBD,IAAa,cAAqC,OAAO,OAAO;CAC9D;EACE,IAAI;EACJ,OAAO;EACP,aAAa;EACb,OAAO;CACT;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;EACb,OAAO;CACT;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;EACb,OAAO;CACT;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;EACb,OAAO;CACT;CACA;EACE,IAAI;EACJ,OAAO;EACP,aAAa;EACb,OAAO;CACT;AACF,CAAC;;AAGD,IAAa,eAAe;CAC1B,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,SAAS;CACT,WAAW;CACX,QAAQ;CACR,QAAQ;AACV;;AAGA,IAAa,YAA+B,OAAO,OAAO,YAAY,CAAC,CAAC,KAAK;;;;;;AAO7E,IAAa,2BAAqC,CAAC,QAAQ"}
1
+ {"version":3,"file":"tokens.js","names":[],"sources":["../../src/lib/tokens.ts"],"sourcesContent":["/**\n * The design system's token manifest.\n *\n * `theme.css` is the source of truth for token *values*. This file is the\n * source of truth for token *names and meaning* — what each one is for, and\n * which ones a theme may vary.\n *\n * It exists because a manifest that is only documentation rots. Two things read\n * it instead:\n *\n * - the token galleries in Storybook, so the review surface shows every token\n * rather than the ones an author remembered;\n * - `tests/tokens.test.ts`, which parses `theme.css` and fails when a token\n * is declared in one place and missing from the other.\n *\n * That pairing is what makes \"every token is documented and every documented\n * token exists\" a property the build enforces rather than a promise.\n */\n\nimport { ACCENTS } from '@adea-ai/themes'\n\nexport type TokenKind =\n | 'color'\n | 'dimension'\n | 'font-family'\n | 'number'\n | 'duration'\n | 'easing'\n | 'shadow'\n | 'text'\n\nexport type TokenDefinition = {\n /** The custom property name, without the leading `--`. */\n name: string\n kind: TokenKind\n /** One line: what this token is for. Shown in the gallery. */\n description: string\n /** True when the light and dark themes give it different values. */\n themed?: boolean\n}\n\n/**\n * Colour roles, in the order they appear in a page: surfaces first, then text,\n * then the lines between them, then the semantic fills. The order is the\n * documentation — reading the gallery top to bottom walks the surface ladder.\n */\nexport const colorTokens: TokenDefinition[] = [\n // Surfaces\n {\n name: 'background',\n kind: 'color',\n themed: true,\n description: 'The canvas every panel sits on.',\n },\n {\n name: 'foreground',\n kind: 'color',\n themed: true,\n description: 'Default body text on the canvas.',\n },\n {\n name: 'card',\n kind: 'color',\n themed: true,\n description: 'A panel or card raised one rung above the canvas.',\n },\n { name: 'card-foreground', kind: 'color', themed: true, description: 'Text on `card`.' },\n {\n name: 'popover',\n kind: 'color',\n themed: true,\n description: 'A floating surface: dialog, menu, popover, tooltip-free.',\n },\n { name: 'popover-foreground', kind: 'color', themed: true, description: 'Text on `popover`.' },\n {\n name: 'surface',\n kind: 'color',\n themed: true,\n description: 'Alias of `background`, for code that means \"a surface\" not \"the page\".',\n },\n {\n name: 'surface-sunken',\n kind: 'color',\n themed: true,\n description: 'A well: code blocks, inset lists, empty states.',\n },\n {\n name: 'surface-raised',\n kind: 'color',\n themed: true,\n description: 'Alias of `card`, for panels that sit on the canvas.',\n },\n {\n name: 'surface-overlay',\n kind: 'color',\n themed: true,\n description: 'Alias of `popover`, for floating layers.',\n },\n {\n name: 'surface-hover',\n kind: 'color',\n themed: true,\n description: 'The hover fill shared by rows, menu items and ghost controls.',\n },\n {\n name: 'surface-active',\n kind: 'color',\n themed: true,\n description: 'The pressed/selected fill, one rung past hover.',\n },\n {\n name: 'chrome',\n kind: 'color',\n themed: true,\n description: 'Window chrome: the top bar and its frosted fill.',\n },\n {\n name: 'chrome-alpha',\n kind: 'number',\n themed: true,\n description: 'Opacity of the chrome fill behind a blur.',\n },\n\n // The brand action\n {\n name: 'primary',\n kind: 'color',\n themed: true,\n description: 'The Adea emerald. The one primary action in a view.',\n },\n {\n name: 'primary-foreground',\n kind: 'color',\n themed: true,\n description: 'Label on `primary`. Black in dark, white in light — the accent flips polarity.',\n },\n {\n name: 'primary-hover',\n kind: 'color',\n themed: true,\n description: 'Hover rung for a primary action.',\n },\n {\n name: 'primary-subtle',\n kind: 'color',\n themed: true,\n description: 'Tinted primary fill: selected rows, focus rings, subtle buttons.',\n },\n\n {\n name: 'secondary',\n kind: 'color',\n themed: true,\n description: 'A quieter filled surface for a secondary action.',\n },\n {\n name: 'secondary-foreground',\n kind: 'color',\n themed: true,\n description: 'Label on `secondary`.',\n },\n {\n name: 'muted',\n kind: 'color',\n themed: true,\n description: 'A neutral fill: skeletons, inert chips, table footers.',\n },\n {\n name: 'muted-foreground',\n kind: 'color',\n themed: true,\n description: 'De-emphasised text. Measured to clear 4.5:1 on both `background` and `card`.',\n },\n {\n name: 'accent',\n kind: 'color',\n themed: true,\n description: \"shadcn's hover-surface accent. Not the brand colour — that is `primary`.\",\n },\n { name: 'accent-foreground', kind: 'color', themed: true, description: 'Text on `accent`.' },\n\n // Status\n {\n name: 'destructive',\n kind: 'color',\n themed: true,\n description: 'The canonical error hue for semantic status indicators and tinted notices.',\n },\n {\n name: 'destructive-foreground',\n kind: 'color',\n themed: true,\n description:\n 'Text on the canonical error hue; solid actions use `destructive-action-foreground`.',\n },\n {\n name: 'destructive-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque destructive tint against the canvas; subtle labels use foreground.',\n },\n {\n name: 'destructive-action',\n kind: 'color',\n themed: true,\n description: 'Contrast-safe solid fill for destructive actions, derived from the error role.',\n },\n {\n name: 'destructive-action-foreground',\n kind: 'color',\n themed: true,\n description: 'Text on the destructive action fill and its 90% hover composition.',\n },\n { name: 'success', kind: 'color', themed: true, description: 'A completed or healthy state.' },\n { name: 'success-foreground', kind: 'color', themed: true, description: 'Label on `success`.' },\n {\n name: 'success-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque success tint against the canvas; subtle labels use foreground.',\n },\n {\n name: 'warning',\n kind: 'color',\n themed: true,\n description: 'Something needs attention but is not broken.',\n },\n { name: 'warning-foreground', kind: 'color', themed: true, description: 'Label on `warning`.' },\n {\n name: 'warning-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque warning tint against the canvas; subtle labels use foreground.',\n },\n { name: 'info', kind: 'color', themed: true, description: 'Neutral information.' },\n { name: 'info-foreground', kind: 'color', themed: true, description: 'Label on `info`.' },\n {\n name: 'info-subtle',\n kind: 'color',\n themed: true,\n description: 'Opaque info tint against the canvas; subtle labels use foreground.',\n },\n\n // Lines\n {\n name: 'border',\n kind: 'color',\n themed: true,\n description: 'Every hairline: panel edges, dividers, card outlines.',\n },\n {\n name: 'input',\n kind: 'color',\n themed: true,\n description:\n 'The edge of an editable control. A rung stronger than `border` so a field is findable.',\n },\n {\n name: 'ring',\n kind: 'color',\n themed: true,\n description: 'The focus ring. Always paired with `primary-subtle` as its glow.',\n },\n\n // Theme-invariant glass\n {\n name: 'scrim',\n kind: 'color',\n description: 'Dark glass for overlays and on-screen controls. Same in both themes.',\n },\n { name: 'scrim-foreground', kind: 'color', description: 'Text drawn on `scrim`.' },\n { name: 'scrim-edge', kind: 'color', description: 'The hairline drawn on `scrim`.' },\n\n // Diff and code\n { name: 'diff-add', kind: 'color', themed: true, description: 'Background of an added line.' },\n {\n name: 'diff-add-foreground',\n kind: 'color',\n themed: true,\n description: 'Text of an added line.',\n },\n {\n name: 'diff-delete',\n kind: 'color',\n themed: true,\n description: 'Background of a removed line.',\n },\n {\n name: 'diff-delete-foreground',\n kind: 'color',\n themed: true,\n description: 'Text of a removed line.',\n },\n { name: 'diff-hunk', kind: 'color', themed: true, description: 'Background of a hunk header.' },\n {\n name: 'diff-hunk-foreground',\n kind: 'color',\n themed: true,\n description: 'Text of a hunk header.',\n },\n {\n name: 'diff-meta-foreground',\n kind: 'color',\n themed: true,\n description: 'File headers and line numbers in a diff.',\n },\n\n // Charts\n {\n name: 'chart-1',\n kind: 'color',\n themed: true,\n description: 'Categorical series 1. The set is closed at six.',\n },\n { name: 'chart-2', kind: 'color', themed: true, description: 'Categorical series 2.' },\n { name: 'chart-3', kind: 'color', themed: true, description: 'Categorical series 3.' },\n { name: 'chart-4', kind: 'color', themed: true, description: 'Categorical series 4.' },\n { name: 'chart-5', kind: 'color', themed: true, description: 'Categorical series 5.' },\n { name: 'chart-6', kind: 'color', themed: true, description: 'Categorical series 6.' },\n\n // Sidebar (the shadcn contract, kept whole)\n {\n name: 'sidebar',\n kind: 'color',\n themed: true,\n description: 'The rail and sidebar surface, tinted against the canvas.',\n },\n {\n name: 'sidebar-foreground',\n kind: 'color',\n themed: true,\n description: 'Default text in the rail and sidebar.',\n },\n {\n name: 'sidebar-primary',\n kind: 'color',\n themed: true,\n description: 'The active destination in the rail.',\n },\n {\n name: 'sidebar-primary-foreground',\n kind: 'color',\n themed: true,\n description: 'Text on the active rail destination.',\n },\n {\n name: 'sidebar-accent',\n kind: 'color',\n themed: true,\n description: 'Hover and selected fill for rail and sidebar rows.',\n },\n {\n name: 'sidebar-accent-foreground',\n kind: 'color',\n themed: true,\n description: 'Text on `sidebar-accent`.',\n },\n {\n name: 'sidebar-border',\n kind: 'color',\n themed: true,\n description: 'The rule between the rail and the canvas.',\n },\n { name: 'sidebar-ring', kind: 'color', themed: true, description: 'Focus ring inside the rail.' },\n {\n name: 'sidebar-muted-foreground',\n kind: 'color',\n themed: true,\n description: 'Rail labels that are not the current destination.',\n },\n]\n\nexport const radiusTokens: TokenDefinition[] = [\n {\n name: 'radius-lg',\n kind: 'dimension',\n description:\n '10px — cards and panels. Also the knob: move this one value to re-round the whole system.',\n },\n { name: 'radius-sm', kind: 'dimension', description: '6px — badges, keyboard keys, menu items.' },\n {\n name: 'radius-md',\n kind: 'dimension',\n description: '8px — every control: buttons, inputs, selects.',\n },\n { name: 'radius-xl', kind: 'dimension', description: '14px — dialogs, menus, sheets.' },\n { name: 'radius-2xl', kind: 'dimension', description: '18px — full-window surfaces and media.' },\n]\n\nexport const typographyTokens: TokenDefinition[] = [\n {\n name: 'font-sans',\n kind: 'font-family',\n description: 'The selected interface face. Space Grotesk unless the font axis says otherwise.',\n },\n {\n name: 'font-mono',\n kind: 'font-family',\n description: 'The selected monospace face. Code, terminals, ids, paths.',\n },\n {\n name: 'font-family-space-grotesk',\n kind: 'font-family',\n description: 'The interface default, and the face the visual language was drawn against.',\n },\n {\n name: 'font-family-jetbrains-mono',\n kind: 'font-family',\n description: 'The monospace default. Code, terminals, diffs.',\n },\n {\n name: 'font-family-geist',\n kind: 'font-family',\n description: 'An alternative interface face. cortana already ships it.',\n },\n {\n name: 'font-family-geist-mono',\n kind: 'font-family',\n description: 'The monospace counterpart to Geist.',\n },\n {\n name: 'font-family-system',\n kind: 'font-family',\n description: \"The platform's own interface face. First-class, not a fallback.\",\n },\n {\n name: 'font-family-system-mono',\n kind: 'font-family',\n description: \"The platform's own monospace face.\",\n },\n {\n name: 'ui-tracking',\n kind: 'text',\n description:\n 'Letter spacing for measured chrome. `normal` on a proportional face, tightened when the UI font is monospace — which is roughly 20% wider at the same size.',\n },\n {\n name: 'ui-word-spacing',\n kind: 'text',\n description:\n \"Word spacing for measured chrome. Mono's space is a full advance-width cell, so a two-word label reads as two floating words without this.\",\n },\n {\n name: 'text-2xs',\n kind: 'text',\n description: '11px — the smallest label the system permits: kbd keys, status bar.',\n },\n { name: 'text-xs', kind: 'text', description: '12px — metadata, badges, secondary rows.' },\n {\n name: 'text-sm',\n kind: 'text',\n description: '14px — the interface default. Body copy, labels, controls.',\n },\n { name: 'text-base', kind: 'text', description: '16px — card titles and dialog titles.' },\n { name: 'text-lg', kind: 'text', description: '18px — a section heading inside a page.' },\n { name: 'text-xl', kind: 'text', description: '20px — a page title.' },\n { name: 'text-2xl', kind: 'text', description: '24px — a display figure.' },\n {\n name: 'text-3xl',\n kind: 'text',\n description: '30px — the largest size in the system. Reserved for an empty-state headline.',\n },\n]\n\n/** Height tokens also size both axes of icon controls through Tailwind's --size\n * namespace. Padding has its own --spacing mapping. Nominal pixel descriptions\n * use a 16px rem; rendered dimensions follow the consumer's root font size. */\nexport const densityTokens: TokenDefinition[] = [\n { name: 'control-height-2xs', kind: 'dimension', description: '20px — an inline chip control.' },\n { name: 'control-height-xs', kind: 'dimension', description: '24px — a dense table row action.' },\n { name: 'control-height-sm', kind: 'dimension', description: '28px — the toolbar default.' },\n {\n name: 'control-height-md',\n kind: 'dimension',\n description: '32px — the form default. Button and Input are this size unless told otherwise.',\n },\n { name: 'control-height-lg', kind: 'dimension', description: '36px — a primary form action.' },\n {\n name: 'control-height-xl',\n kind: 'dimension',\n description: '40px — a hero control in an empty state.',\n },\n {\n name: 'control-height-2xl',\n kind: 'dimension',\n description: '48px — a stable touch target, unchanged by compact density.',\n },\n {\n name: 'control-padding-2xs',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 20px control.',\n },\n {\n name: 'control-padding-xs',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 24px control.',\n },\n {\n name: 'control-padding-sm',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 28px control.',\n },\n {\n name: 'control-padding-md',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 32px control.',\n },\n {\n name: 'control-padding-lg',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 36px control.',\n },\n {\n name: 'control-padding-xl',\n kind: 'dimension',\n description: 'Inline padding that pairs with the 40px control.',\n },\n {\n name: 'control-padding-2xl',\n kind: 'dimension',\n description: 'Inline padding that pairs with the stable 48px touch target.',\n },\n { name: 'row-height-sm', kind: 'dimension', description: '28px — a dense list row.' },\n { name: 'row-height-md', kind: 'dimension', description: '32px — the default list row.' },\n { name: 'row-height-lg', kind: 'dimension', description: '36px — a two-line list row.' },\n { name: 'rail-width', kind: 'dimension', description: '56px — the icon-only rail.' },\n { name: 'rail-width-expanded', kind: 'dimension', description: '236px — the labelled rail.' },\n {\n name: 'rail-item-height',\n kind: 'dimension',\n description: '36px — a rail or sidebar destination.',\n },\n {\n name: 'sidebar-width',\n kind: 'dimension',\n description: '256px — the secondary navigation column.',\n },\n {\n name: 'sidebar-width-compact',\n kind: 'dimension',\n description: '48px — the collapsed secondary column.',\n },\n { name: 'topbar-height', kind: 'dimension', description: '48px — the window title row.' },\n { name: 'statusbar-height', kind: 'dimension', description: '28px — the bottom readout strip.' },\n {\n name: 'tooltip-max-width',\n kind: 'dimension',\n description:\n 'The lesser of the 16rem readable measure and one viewport minus a gutter — a tip wraps before it can push its document wider than itself.',\n },\n]\n\nexport const elevationTokens: TokenDefinition[] = [\n {\n name: 'shadow-2xs',\n kind: 'shadow',\n themed: true,\n description: 'Barely there: a chip resting on a card.',\n },\n {\n name: 'shadow-xs',\n kind: 'shadow',\n themed: true,\n description: 'A card or panel on the canvas.',\n },\n {\n name: 'shadow-sm',\n kind: 'shadow',\n themed: true,\n description: 'A control that lifts: a pressed toggle, a thumb.',\n },\n { name: 'shadow-md', kind: 'shadow', themed: true, description: 'A menu or popover.' },\n { name: 'shadow-lg', kind: 'shadow', themed: true, description: 'A dialog or sheet.' },\n {\n name: 'shadow-xl',\n kind: 'shadow',\n themed: true,\n description: 'The command palette, above everything.',\n },\n]\n\nexport const motionTokens: TokenDefinition[] = [\n {\n name: 'duration-fast',\n kind: 'duration',\n description: '120ms — a state change the user is already watching.',\n },\n { name: 'duration-normal', kind: 'duration', description: '200ms — an entrance.' },\n { name: 'duration-slow', kind: 'duration', description: '320ms — a layout settle.' },\n {\n name: 'ease-out',\n kind: 'easing',\n description: 'A fast start and a long settle. Reads as decisive rather than floaty.',\n },\n {\n name: 'ease-in-out',\n kind: 'easing',\n description: 'For a loop that has no start or end, such as a shimmer.',\n },\n]\n\nexport const zIndexTokens: TokenDefinition[] = [\n { name: 'z-base', kind: 'number', description: 'In flow, at the document order.' },\n {\n name: 'z-docked',\n kind: 'number',\n description: 'A sticky table header standing above its own scroll body.',\n },\n { name: 'z-sticky', kind: 'number', description: 'The top bar and any other pinned chrome.' },\n { name: 'z-drawer', kind: 'number', description: 'A drawer, below a modal dialog.' },\n { name: 'z-dialog', kind: 'number', description: 'A modal dialog and its scrim.' },\n {\n name: 'z-menu',\n kind: 'number',\n description: 'Menus, popovers and comboboxes. Above dialogs, because a dialog can contain one.',\n },\n {\n name: 'z-tooltip',\n kind: 'number',\n description: 'Tooltips. Above menus, because a menu item can carry one.',\n },\n {\n name: 'z-toast',\n kind: 'number',\n description: 'Notifications. Above everything, so they are never hidden by a dialog.',\n },\n]\n\n/**\n * The accent axis.\n *\n * adea's accent presets, as a selection rather than a constant. `theme` is the\n * default and means \"the variant's own primary\" — monochrome in adea's palette —\n * and each named preset overrides the interactive roles through the\n * `[data-accent]` blocks in `theme.css`.\n *\n * These are the same six presets `accentPresets` exports in adea's own\n * `appearance.ts`, and the values match. A consumer's appearance picker and the\n * workshop's theme toolbar read this one list, so the two cannot disagree about\n * what a preset is called or what colour it is.\n */\nexport type AccentPreset = {\n /** The `data-accent` value. `theme` is the variant's own primary. */\n id: string\n label: string\n /** What the preset is for, in the gallery and in a picker. */\n description: string\n /** The accent as it appears in the light theme. Absent for `theme`. */\n light?: string\n /** The accent as it appears in the dark theme. Absent for `theme`. */\n dark?: string\n}\n\nexport const accentPresets: readonly AccentPreset[] = Object.freeze([\n {\n id: 'theme',\n label: 'Theme',\n description:\n \"The variant's own primary. Neutral in adea's palette, so the interface stays monochrome.\",\n },\n ...ACCENTS,\n])\n\n/**\n * The font axis.\n *\n * The family is a selection, like the accent: `data-font` sits on the same element\n * and each option swaps the interface face. `space-grotesk` is the default because\n * it is the face the visual language was drawn against, and `system` is a\n * first-class option rather than a fallback — an application that wants the\n * platform's own face should be able to say so without losing the rest of the\n * system.\n */\nexport type FontOption = {\n /** The `data-font` value. `space-grotesk` is the default and needs no attribute. */\n id: string\n label: string\n description: string\n /** Which of the two stacks this option sets. */\n stack: 'sans' | 'mono' | 'both'\n}\n\nexport const fontOptions: readonly FontOption[] = Object.freeze([\n {\n id: 'space-grotesk',\n label: 'Space Grotesk',\n description: 'The default, and the face the visual language was drawn against.',\n stack: 'both',\n },\n {\n id: 'system',\n label: 'System',\n description: \"The platform's own face. What a terminal or editor usually wants.\",\n stack: 'both',\n },\n {\n id: 'geist',\n label: 'Geist',\n description: 'The face cortana already ships. Neutral and wide.',\n stack: 'both',\n },\n {\n id: 'geist-mono',\n label: 'Geist Mono',\n description: 'Monospace throughout, for someone who wants a uniform texture.',\n stack: 'both',\n },\n {\n id: 'jetbrains-mono',\n label: 'JetBrains Mono',\n description: 'Monospace throughout, with coding ligatures off.',\n stack: 'both',\n },\n])\n\n/** Every token, in gallery order. */\nexport const designTokens = {\n color: colorTokens,\n radius: radiusTokens,\n typography: typographyTokens,\n density: densityTokens,\n elevation: elevationTokens,\n motion: motionTokens,\n zIndex: zIndexTokens,\n} as const\n\n/** Flat list, for completeness checks and for search. */\nexport const allTokens: TokenDefinition[] = Object.values(designTokens).flat()\n\n/**\n * Aliases that exist only to make a call site read better, and which therefore\n * have no gallery row of their own. Kept explicit so the completeness check\n * below can tell \"deliberately absent\" from \"forgotten\".\n */\nexport const undocumentedTokenAliases: string[] = ['radius']\n"],"mappings":"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"}
@@ -27,6 +27,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from '../../ui/tooltip'
27
27
  export type ActionButtonProps<T extends ValidComponent = 'button'> = ButtonProps<T> & {
28
28
  /** A short explanation, also shown on keyboard focus. The Button still needs its own name. */
29
29
  tooltip?: string
30
+ /** Placement of the explanation; icon actions live in bars, so it defaults below the control. */
30
31
  tooltipSide?: 'top' | 'right' | 'bottom' | 'left'
31
32
  /** Disables the action and announces the busy label through a polite status region. */
32
33
  busy?: boolean
@@ -173,7 +174,7 @@ export function ActionButton<T extends ValidComponent = 'button'>(props: ActionB
173
174
  >
174
175
  {contents()}
175
176
  </TooltipTrigger>
176
- <TooltipContent side={local.tooltipSide}>{local.tooltip}</TooltipContent>
177
+ <TooltipContent side={local.tooltipSide ?? 'bottom'}>{local.tooltip}</TooltipContent>
177
178
  </Tooltip>
178
179
  </Show>
179
180
  <Show when={busy()}>
@@ -83,6 +83,11 @@ export function ModeChoices(props: AppearanceEditorProps) {
83
83
  }
84
84
 
85
85
  export function AccentChoices(props: AppearanceEditorProps) {
86
+ // The resolved appearance decides which side of a preset pair — and which
87
+ // theme accent — the swatches paint, so the row previews each choice as the
88
+ // user will see it.
89
+ const resolvedAppearance = () =>
90
+ props.draft.mode === 'system' ? props.resolvedAppearance : props.draft.mode
86
91
  const custom = () =>
87
92
  props.draft.accent !== 'theme' &&
88
93
  !props.accentOptions.some((option) => option.id === props.draft.accent)
@@ -93,9 +98,9 @@ export function AccentChoices(props: AppearanceEditorProps) {
93
98
  disabled={props.saving}
94
99
  orientation="horizontal"
95
100
  aria-label="Accent"
96
- // Two chips in a column beside a 3x2 swatch grid: one line of six
97
- // swatches plus chips overflows the settings sidebar's control column,
98
- // and the column keeps both rows of the pair balanced (2 x 28px + gap).
101
+ // One chip (custom) beside a capped swatch grid: a chip-per-state column
102
+ // beside a full-width swatch line overflowed the settings sidebar's
103
+ // control column, so the pair stays a narrow chip plus a wrapped grid.
99
104
  class="flex items-center gap-3"
100
105
  onChange={(accent) =>
101
106
  props.onChange({
@@ -103,21 +108,29 @@ export function AccentChoices(props: AppearanceEditorProps) {
103
108
  })
104
109
  }
105
110
  >
106
- <div class="flex flex-col gap-2">
107
- <Radio.Item value="theme">
111
+ <div class="grid grid-cols-4 gap-2">
112
+ {/* The theme's own accent is the first swatch. Picking it is the same
113
+ act the old dedicated "Theme default" chip performed, without a
114
+ second control for the state the row starts in. */}
115
+ <Radio.Item
116
+ value="theme"
117
+ class="rounded-full focus-within:ring-3 focus-within:ring-ring/50"
118
+ >
108
119
  <Radio.ItemInput />
109
- <Radio.ItemLabel class="flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary">
110
- Theme default
120
+ <Radio.ItemLabel class="block size-7 cursor-pointer rounded-full border p-0.5 data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary">
121
+ <span
122
+ class="block size-full rounded-full"
123
+ aria-hidden="true"
124
+ style={{
125
+ 'background-color':
126
+ resolvedAppearance() === 'light'
127
+ ? props.lightTheme.colors.accent
128
+ : props.darkTheme.colors.accent,
129
+ }}
130
+ />
131
+ <span class="sr-only">Theme default</span>
111
132
  </Radio.ItemLabel>
112
133
  </Radio.Item>
113
- <Radio.Item value="custom">
114
- <Radio.ItemInput />
115
- <Radio.ItemLabel class="flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary">
116
- Custom
117
- </Radio.ItemLabel>
118
- </Radio.Item>
119
- </div>
120
- <div class="grid grid-cols-3 gap-2">
121
134
  <For each={props.accentOptions}>
122
135
  {(option) => (
123
136
  <Radio.Item
@@ -131,11 +144,7 @@ export function AccentChoices(props: AppearanceEditorProps) {
131
144
  aria-hidden="true"
132
145
  style={{
133
146
  'background-color':
134
- (props.draft.mode === 'system'
135
- ? props.resolvedAppearance
136
- : props.draft.mode) === 'light'
137
- ? option.light
138
- : option.dark,
147
+ resolvedAppearance() === 'light' ? option.light : option.dark,
139
148
  }}
140
149
  />
141
150
  <span class="sr-only">{option.label}</span>
@@ -144,6 +153,12 @@ export function AccentChoices(props: AppearanceEditorProps) {
144
153
  )}
145
154
  </For>
146
155
  </div>
156
+ <Radio.Item value="custom">
157
+ <Radio.ItemInput />
158
+ <Radio.ItemLabel class="flex h-7 cursor-pointer items-center rounded-md border px-2 text-xs whitespace-nowrap data-[checked]:border-primary data-[checked]:ring-1 data-[checked]:ring-primary">
159
+ Custom
160
+ </Radio.ItemLabel>
161
+ </Radio.Item>
147
162
  </Radio>
148
163
  )
149
164
  }
@@ -210,10 +210,14 @@ function ThemeSelectMenu(props: {
210
210
  </DropdownMenuTrigger>
211
211
  <DropdownMenuContent
212
212
  portalMount={portalMount()}
213
- // Sized to content (at least the trigger width, never wider than the
213
+ // A fixed height with its own scroll: an adaptive cap measured the
214
+ // host panel instead, and opening a long theme list scrolled the
215
+ // sidebar to reveal the menu. The content scrolls internally at the
216
+ // cap, so the panel around the trigger never moves. Width still
217
+ // follows content (at least the trigger width, never wider than the
214
218
  // popper allows) so long theme names render in full with padding for
215
219
  // the selection indicator instead of truncating at the anchor width.
216
- class="max-h-(--kb-popper-content-available-height) w-max min-w-(--kb-popper-anchor-width) max-w-(--kb-popper-content-available-width) overflow-x-hidden overflow-y-auto"
220
+ class="max-h-80 w-max min-w-(--kb-popper-anchor-width) max-w-(--kb-popper-content-available-width) overflow-x-hidden overflow-y-auto"
217
221
  onInteractOutside={(event) => {
218
222
  if (event.detail.originalEvent.type !== 'pointerdown') return
219
223
  const parentDialog = portalMount()?.closest<HTMLElement>('[role="dialog"]')
@@ -2,6 +2,7 @@ import { Polymorphic, type PolymorphicProps } from '@kobalte/core/polymorphic'
2
2
  import type { ComponentProps, JSX, ValidComponent } from 'solid-js'
3
3
  import { Show, createMemo, createSignal, splitProps } from 'solid-js'
4
4
  import { Portal } from 'solid-js/web'
5
+ import { tooltipTip } from '../../../lib/overlay'
5
6
  import { cn } from '../../../lib/utils'
6
7
  import { SideRailContext, createSideRailValue } from './side-rail-context'
7
8
 
@@ -305,8 +306,8 @@ export function SideRailItem<T extends ValidComponent = 'a'>(props: SideRailItem
305
306
  aria-hidden="true"
306
307
  data-slot="side-rail-tip"
307
308
  class={cn(
308
- 'bg-card text-card-foreground border-border pointer-events-none fixed z-(--z-tooltip)',
309
- 'flex items-center gap-2.5 rounded-md border ps-3 pe-3 text-sm font-medium whitespace-nowrap shadow-lg'
309
+ tooltipTip,
310
+ 'pointer-events-none fixed z-(--z-tooltip) flex items-center gap-2.5 ps-3 pe-3 whitespace-nowrap'
310
311
  )}
311
312
  style={{
312
313
  top: `${position().top}px`,
@@ -398,7 +399,10 @@ export function SideRailButton(
398
399
  <div
399
400
  aria-hidden="true"
400
401
  data-slot="side-rail-tip"
401
- class="bg-card text-card-foreground border-border pointer-events-none fixed z-(--z-tooltip) flex items-center gap-2.5 rounded-md border ps-3 pe-3 text-sm font-medium whitespace-nowrap shadow-lg"
402
+ class={cn(
403
+ tooltipTip,
404
+ 'pointer-events-none fixed z-(--z-tooltip) flex items-center gap-2.5 ps-3 pe-3 whitespace-nowrap'
405
+ )}
402
406
  style={{
403
407
  top: `${position().top}px`,
404
408
  left: `${position().left}px`,
@@ -125,6 +125,13 @@ export type TopBarSearchProps = ComponentProps<'button'> & {
125
125
  placeholder?: string
126
126
  /** The shortcut chip drawn at the trailing edge, e.g. "⌘K". */
127
127
  shortcut?: string
128
+ /**
129
+ * The parseable chord behind `shortcut`, e.g. `Meta+K`. The chip is
130
+ * `aria-hidden` — reading it out would pollute the button's accessible
131
+ * name — so this is what assistive technology announces instead. Supply it
132
+ * whenever `shortcut` is drawn.
133
+ */
134
+ keyshortcuts?: string
128
135
  }
129
136
 
130
137
  /**
@@ -137,7 +144,7 @@ export type TopBarSearchProps = ComponentProps<'button'> & {
137
144
  * like from the user's side.
138
145
  */
139
146
  export function TopBarSearch(props: TopBarSearchProps) {
140
- const [local, rest] = splitProps(props, ['class', 'placeholder', 'shortcut'])
147
+ const [local, rest] = splitProps(props, ['class', 'placeholder', 'shortcut', 'keyshortcuts'])
141
148
 
142
149
  return (
143
150
  <button
@@ -151,12 +158,16 @@ export function TopBarSearch(props: TopBarSearchProps) {
151
158
  'window-no-drag',
152
159
  local.class
153
160
  )}
161
+ aria-keyshortcuts={local.keyshortcuts}
154
162
  {...rest}
155
163
  >
156
164
  <Search aria-hidden="true" class="size-4 shrink-0 sm:hidden" />
157
165
  <span class="sr-only sm:not-sr-only sm:truncate">{local.placeholder ?? 'Search'}</span>
158
166
  <Show when={local.shortcut}>
159
- <kbd class="bg-muted ms-auto hidden h-5 shrink-0 items-center rounded-sm border border-border px-1.5 font-mono text-2xs sm:flex">
167
+ <kbd
168
+ aria-hidden="true"
169
+ class="bg-muted ms-auto hidden h-5 shrink-0 items-center rounded-sm border border-border px-1.5 font-mono text-2xs sm:flex"
170
+ >
160
171
  {local.shortcut}
161
172
  </kbd>
162
173
  </Show>
@@ -153,7 +153,10 @@ export function DropdownMenuCheckboxItem(
153
153
  return (
154
154
  <KobalteDropdownMenu.CheckboxItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>
155
155
  {local.children}
156
- <KobalteDropdownMenu.ItemIndicator class="absolute end-2 flex size-4 items-center justify-center">
156
+ <KobalteDropdownMenu.ItemIndicator
157
+ data-slot="dropdown-menu-indicator"
158
+ class="absolute end-2 flex size-4 items-center justify-center text-primary"
159
+ >
157
160
  <Check class="size-4" />
158
161
  </KobalteDropdownMenu.ItemIndicator>
159
162
  </KobalteDropdownMenu.CheckboxItem>
@@ -172,7 +175,12 @@ export function DropdownMenuRadioItem(props: ComponentProps<typeof KobalteDropdo
172
175
  return (
173
176
  <KobalteDropdownMenu.RadioItem class={cn(menuItem, 'pe-8', local.class)} {...rest}>
174
177
  {local.children}
175
- <KobalteDropdownMenu.ItemIndicator class="absolute end-2 flex size-4 items-center justify-center">
178
+ {/* The indicator reads in the accent, like every other selected state in
179
+ the system — a canvas-colored dot on a checked row reads as decoration. */}
180
+ <KobalteDropdownMenu.ItemIndicator
181
+ data-slot="dropdown-menu-indicator"
182
+ class="absolute end-2 flex size-4 items-center justify-center text-primary"
183
+ >
176
184
  <Circle class="size-2 fill-current" />
177
185
  </KobalteDropdownMenu.ItemIndicator>
178
186
  </KobalteDropdownMenu.RadioItem>