@weasel-js/ui 0.7.0 → 0.7.2

package/dist/chunks/{Tabs-DelDecks.js.map → Tabs-DOW5jtnq.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Tabs-DelDecks.js","names":[],"sources":["../../src/components/Tabs/Tabs.module.css","../../src/components/Tabs/Tabs.tsx"],"sourcesContent":[".tabs {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  font-family: var(--wzl-font-ui);\n  color: var(--wzl-fg);\n}\n\n.tabs[data-orientation=\"horizontal\"] {\n  flex-direction: column;\n}\n\n.tabs[data-orientation=\"vertical\"] {\n  flex-direction: row;\n  gap: 12px;\n}\n\n.list {\n  display: flex;\n  gap: 2px;\n  border-bottom: 1px solid var(--wzl-border);\n}\n\n.tabs[data-orientation=\"vertical\"] .list {\n  flex-direction: column;\n  border-bottom: none;\n  border-right: 1px solid var(--wzl-border);\n  padding-right: 8px;\n}\n\n.tab {\n  position: relative;\n  padding: 6px 10px;\n  background: transparent;\n  border: none;\n  color: var(--wzl-fg-muted);\n  font: inherit;\n  font-size: 12px;\n  cursor: pointer;\n  outline: none;\n  transition: color var(--wzl-motion-fast);\n}\n\n.tab[data-hovered]:not([data-disabled]) {\n  color: var(--wzl-fg);\n}\n\n.tab[data-selected] {\n  color: var(--wzl-fg);\n}\n\n.tab[data-selected]::after {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: -1px;\n  height: 2px;\n  background: var(--wzl-accent-strong);\n}\n\n.tabs[data-orientation=\"vertical\"] .tab[data-selected]::after {\n  left: auto;\n  right: -9px;\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  height: auto;\n}\n\n.tab[data-focus-visible] {\n  box-shadow: inset 0 0 0 2px var(--wzl-focus-ring);\n  border-radius: var(--wzl-radius-sm);\n}\n\n.tab[data-disabled] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.panel {\n  padding: 12px 0;\n  outline: none;\n}\n\n.panel[data-focus-visible] {\n  box-shadow: inset 0 0 0 2px var(--wzl-focus-ring);\n  border-radius: var(--wzl-radius-sm);\n}\n","import type { ReactNode } from 'react';\nimport {\n  Tabs as RACTabs,\n  TabList as RACTabList,\n  Tab as RACTab,\n  TabPanel as RACTabPanel,\n  type TabsProps as RACTabsProps,\n  type TabListProps as RACTabListProps,\n  type TabProps as RACTabProps,\n  type TabPanelProps as RACTabPanelProps,\n} from 'react-aria-components';\nimport s from './Tabs.module.css';\n\nexport type TabsProps = Omit<RACTabsProps, 'className' | 'children'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\nexport function Tabs({ children, className, ...rest }: TabsProps) {\n  return (\n    <RACTabs {...rest} className={[s.tabs, className].filter(Boolean).join(' ')}>\n      {children}\n    </RACTabs>\n  );\n}\n\nexport type TabListProps<T extends object> = Omit<RACTabListProps<T>, 'className'> & {\n  className?: string;\n};\n\nexport function TabList<T extends object>({ className, ...rest }: TabListProps<T>) {\n  return <RACTabList<T> {...rest} className={[s.list, className].filter(Boolean).join(' ')} />;\n}\n\nexport type TabProps = Omit<RACTabProps, 'className' | 'children'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\nexport function Tab({ children, className, ...rest }: TabProps) {\n  return (\n    <RACTab {...rest} className={[s.tab, className].filter(Boolean).join(' ')}>\n      {children}\n    </RACTab>\n  );\n}\n\nexport type TabPanelProps = Omit<RACTabPanelProps, 'className' | 'children'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\nexport function TabPanel({ children, className, ...rest }: TabPanelProps) {\n  return (\n    <RACTabPanel {...rest} className={[s.panel, className].filter(Boolean).join(' ')}>\n      {children}\n    </RACTabPanel>\n  );\n}\n"],"mappings":";;;;;;;;;;ACkBA,SAAgB,EAAK,EAAE,aAAU,cAAW,GAAG,KAAmB;CAChE,OACE,kBAAC,GAAD;EAAS,GAAI;EAAM,WAAW,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EACxE;EACO,CAAA;;AAQd,SAAgB,EAA0B,EAAE,cAAW,GAAG,KAAyB;CACjF,OAAO,kBAAC,GAAD;EAAe,GAAI;EAAM,WAAW,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAAI,CAAA;;AAQ9F,SAAgB,EAAI,EAAE,aAAU,cAAW,GAAG,KAAkB;CAC9D,OACE,kBAAC,GAAD;EAAQ,GAAI;EAAM,WAAW,CAAC,EAAE,KAAK,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EACtE;EACM,CAAA;;AASb,SAAgB,EAAS,EAAE,aAAU,cAAW,GAAG,KAAuB;CACxE,OACE,kBAAC,GAAD;EAAa,GAAI;EAAM,WAAW,CAAC,EAAE,OAAO,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAC7E;EACW,CAAA"}
+{"version":3,"file":"Tabs-DOW5jtnq.js","names":[],"sources":["../../src/components/Tabs/Tabs.module.css","../../src/components/Tabs/Tabs.tsx"],"sourcesContent":[".tabs {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  font-family: var(--wzl-font-ui);\n  color: var(--wzl-fg);\n}\n\n.tabs[data-orientation=\"horizontal\"] {\n  flex-direction: column;\n}\n\n.tabs[data-orientation=\"vertical\"] {\n  flex-direction: row;\n  gap: 12px;\n}\n\n.list {\n  display: flex;\n  gap: 2px;\n  border-bottom: 1px solid var(--wzl-border);\n}\n\n.tabs[data-orientation=\"vertical\"] .list {\n  flex-direction: column;\n  border-bottom: none;\n  border-right: 1px solid var(--wzl-border);\n  padding-right: 8px;\n}\n\n.tab {\n  position: relative;\n  padding: 6px 10px;\n  background: transparent;\n  border: none;\n  color: var(--wzl-fg-muted);\n  font: inherit;\n  font-size: 12px;\n  cursor: pointer;\n  outline: none;\n  transition: color var(--wzl-motion-fast);\n}\n\n.tab[data-hovered]:not([data-disabled]) {\n  color: var(--wzl-fg);\n}\n\n.tab[data-selected] {\n  color: var(--wzl-fg);\n}\n\n.tab[data-selected]::after {\n  content: '';\n  position: absolute;\n  left: 0;\n  right: 0;\n  bottom: -1px;\n  height: 2px;\n  background: var(--wzl-accent-strong);\n}\n\n.tabs[data-orientation=\"vertical\"] .tab[data-selected]::after {\n  left: auto;\n  right: -9px;\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  height: auto;\n}\n\n.tab[data-focus-visible] {\n  box-shadow: inset 0 0 0 2px var(--wzl-focus-ring);\n  border-radius: var(--wzl-radius-sm);\n}\n\n.tab[data-disabled] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.panel {\n  padding: 12px 0;\n  outline: none;\n}\n\n.panel[data-focus-visible] {\n  box-shadow: inset 0 0 0 2px var(--wzl-focus-ring);\n  border-radius: var(--wzl-radius-sm);\n}\n","import type { ReactNode } from 'react';\nimport {\n  Tabs as RACTabs,\n  TabList as RACTabList,\n  Tab as RACTab,\n  TabPanel as RACTabPanel,\n  type TabsProps as RACTabsProps,\n  type TabListProps as RACTabListProps,\n  type TabProps as RACTabProps,\n  type TabPanelProps as RACTabPanelProps,\n} from 'react-aria-components';\nimport s from './Tabs.module.css';\n\nexport type TabsProps = Omit<RACTabsProps, 'className' | 'children'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\nexport function Tabs({ children, className, ...rest }: TabsProps) {\n  return (\n    <RACTabs {...rest} className={[s.tabs, className].filter(Boolean).join(' ')}>\n      {children}\n    </RACTabs>\n  );\n}\n\nexport type TabListProps<T extends object> = Omit<RACTabListProps<T>, 'className'> & {\n  className?: string;\n};\n\nexport function TabList<T extends object>({ className, ...rest }: TabListProps<T>) {\n  return <RACTabList<T> {...rest} className={[s.list, className].filter(Boolean).join(' ')} />;\n}\n\nexport type TabProps = Omit<RACTabProps, 'className' | 'children'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\nexport function Tab({ children, className, ...rest }: TabProps) {\n  return (\n    <RACTab {...rest} className={[s.tab, className].filter(Boolean).join(' ')}>\n      {children}\n    </RACTab>\n  );\n}\n\nexport type TabPanelProps = Omit<RACTabPanelProps, 'className' | 'children'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\nexport function TabPanel({ children, className, ...rest }: TabPanelProps) {\n  return (\n    <RACTabPanel {...rest} className={[s.panel, className].filter(Boolean).join(' ')}>\n      {children}\n    </RACTabPanel>\n  );\n}\n"],"mappings":";;;;;;;;;;ACkBA,SAAgB,EAAK,EAAE,aAAU,cAAW,GAAG,KAAmB;AAChE,QACE,kBAAC,GAAD;EAAS,GAAI;EAAM,WAAW,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EACxE;EACO,CAAA;;AAQd,SAAgB,EAA0B,EAAE,cAAW,GAAG,KAAyB;AACjF,QAAO,kBAAC,GAAD;EAAe,GAAI;EAAM,WAAW,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAAI,CAAA;;AAQ9F,SAAgB,EAAI,EAAE,aAAU,cAAW,GAAG,KAAkB;AAC9D,QACE,kBAAC,GAAD;EAAQ,GAAI;EAAM,WAAW,CAAC,EAAE,KAAK,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EACtE;EACM,CAAA;;AASb,SAAgB,EAAS,EAAE,aAAU,cAAW,GAAG,KAAuB;AACxE,QACE,kBAAC,GAAD;EAAa,GAAI;EAAM,WAAW,CAAC,EAAE,OAAO,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;EAC7E;EACW,CAAA"}

package/dist/chunks/{Toast-Bw3XQxmV.js → Toast-DLM2AsTz.js}

@@ -125,4 +125,4 @@ function S(i) {
 //#endregion
 export { v as a, g as i, p as n, m as r, S as t };
 
-//# sourceMappingURL=Toast-Bw3XQxmV.js.map
+//# sourceMappingURL=Toast-DLM2AsTz.js.map

package/dist/chunks/{Toast-Bw3XQxmV.js.map → Toast-DLM2AsTz.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Toast-Bw3XQxmV.js","names":[],"sources":["../../src/components/Toast/queue.ts","../../src/components/Toast/Toast.module.css","../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { UNSTABLE_ToastQueue } from 'react-aria-components';\nimport { flushSync } from 'react-dom';\n\nexport type ToastTone = 'info' | 'success' | 'warning' | 'error';\n\n/** Kit-owned payload rendered inside each toast. */\nexport interface ToastContent {\n  title: string;\n  description?: string;\n  tone: ToastTone;\n}\n\nexport interface ToastOptions {\n  description?: string;\n  /**\n   * Auto-dismiss delay in ms. Default 8000. `null` — sticky until dismissed.\n   * Must be > 0; RAC treats 0 as no timer (sticky).\n   */\n  ttlMs?: number | null;\n  /** Stable identity: re-adding with the same id replaces the earlier toast. */\n  id?: string;\n}\n\nconst DEFAULT_TTL_MS = 8000;\n\n// Tracks overlapping toast-triggered view transitions so the `:root`\n// marker class survives until the *last* one settles.\nlet activeToastTransitions = 0;\n\n/**\n * RAC's sanctioned toast-animation hook: wrap every queue mutation in a\n * view transition so entry, exit, and the surviving stack's reflow all\n * animate (choreography lives in `toastViewTransitions.css`). Falls back\n * to a plain synchronous update when the browser lacks the API or the\n * user prefers reduced motion — i.e. exactly the pre-animation behavior.\n * The jsdom test environment always takes the fallback path.\n */\nfunction viewTransitionWrapUpdate(fn: () => void): void {\n  const reduceMotion =\n    typeof matchMedia === 'function' && matchMedia('(prefers-reduced-motion: reduce)').matches;\n  if (typeof document === 'undefined' || !('startViewTransition' in document) || reduceMotion) {\n    fn();\n    return;\n  }\n  // The marker class scopes the CSS that un-names `:root` (keeps the rest\n  // of the page live and interactive during the transition) to\n  // toast-owned transitions only.\n  const root = document.documentElement;\n  activeToastTransitions++;\n  root.classList.add('wzl-toast-vt');\n  // flushSync: the DOM must reflect the queue change inside the\n  // transition callback, before the browser snapshots the new state.\n  const vt = document.startViewTransition(() => flushSync(fn));\n  // `ready` rejects when the browser skips the transition — routine under\n  // a rapid burst of toasts, where each new transition supersedes the\n  // in-flight one. The DOM update has still applied by then, but an\n  // untouched `ready` surfaces the rejection as a console error, so\n  // consume it.\n  vt.ready.catch(() => {});\n  void vt.finished.finally(() => {\n    if (--activeToastTransitions === 0) root.classList.remove('wzl-toast-vt');\n  });\n}\n\n// The wrapped RAC queue lives in a module-scoped WeakMap so the public\n// class surface carries no RAC (UNSTABLE_) types — see the design spec's\n// containment rule. `racQueueOf` below is the folder-internal accessor.\nconst RAC_QUEUES = new WeakMap<ToastQueue, UNSTABLE_ToastQueue<ToastContent>>();\n\n/**\n * Kit-owned toast queue. Create isolated instances with\n * `createToastQueue()` (tests, secondary roots); most apps use the\n * module-level `defaultToastQueue` via `toast()`.\n *\n * At most 5 toasts are visible at once; adding a 6th shows immediately\n * and hides the oldest (it returns when a slot frees, with its ttl\n * restarted).\n */\nexport class ToastQueue {\n  private keysById = new Map<string, string>();\n\n  constructor() {\n    RAC_QUEUES.set(\n      this,\n      new UNSTABLE_ToastQueue<ToastContent>({\n        maxVisibleToasts: 5,\n        wrapUpdate: viewTransitionWrapUpdate,\n      }),\n    );\n  }\n\n  add(tone: ToastTone, title: string, options: ToastOptions = {}): void {\n    const { description, ttlMs = DEFAULT_TTL_MS, id } = options;\n    const rac = RAC_QUEUES.get(this)!;\n    if (id !== undefined) {\n      const existing = this.keysById.get(id);\n      if (existing !== undefined) rac.close(existing);\n    }\n    let key: string;\n    const racOptions: { timeout?: number; onClose?: () => void } =\n      ttlMs === null ? {} : { timeout: ttlMs };\n    if (id !== undefined) {\n      racOptions.onClose = () => {\n        if (this.keysById.get(id) === key) this.keysById.delete(id);\n      };\n    }\n    key = rac.add({ title, description, tone }, racOptions);\n    if (id !== undefined) this.keysById.set(id, key);\n  }\n\n  /** Dismiss the toast previously added with this `id`. No-op if none is live. */\n  dismiss(id: string): void {\n    const key = this.keysById.get(id);\n    if (key !== undefined) RAC_QUEUES.get(this)!.close(key);\n  }\n\n  /** Dismiss every queued toast. */\n  clear(): void {\n    RAC_QUEUES.get(this)!.clear();\n    this.keysById.clear();\n  }\n}\n\nexport function createToastQueue(): ToastQueue {\n  return new ToastQueue();\n}\n\n/**\n * Folder-internal bridge to the wrapped RAC queue for `ToastRegion`.\n * Deliberately NOT exported from the Toast folder's `index.ts` — the\n * RAC toast surface is unstable and must not leak past this folder.\n */\nexport function racQueueOf(queue: ToastQueue): UNSTABLE_ToastQueue<ToastContent> {\n  return RAC_QUEUES.get(queue)!;\n}\n\n/** Module-level default queue used by `toast()` and `<ToastRegion>`. */\nexport const defaultToastQueue = createToastQueue();\n\ntype ToastFn = {\n  (title: string, options?: ToastOptions): void;\n  info(title: string, options?: ToastOptions): void;\n  success(title: string, options?: ToastOptions): void;\n  warning(title: string, options?: ToastOptions): void;\n  error(title: string, options?: ToastOptions): void;\n};\n\nfunction tonedAdd(tone: ToastTone) {\n  return (title: string, options?: ToastOptions) => defaultToastQueue.add(tone, title, options);\n}\n\n/** Imperative convenience over `defaultToastQueue`. Bare `toast(...)` is `info`. */\nexport const toast: ToastFn = Object.assign(tonedAdd('info'), {\n  info: tonedAdd('info'),\n  success: tonedAdd('success'),\n  warning: tonedAdd('warning'),\n  error: tonedAdd('error'),\n});\n",".region {\n  position: fixed;\n  z-index: 1100;\n  display: flex;\n  /* RAC unshifts new toasts to the front of the DOM (newest-first), and the\n   * ol/li wrappers are display:contents, so the flex direction alone\n   * decides which end of the stack the newest toast lands on. Base\n   * (bottom corners): column-reverse puts DOM-first (newest) at the\n   * bottom, hugging the corner. Top corners override back to column so\n   * DOM-first still hugs the top edge. */\n  flex-direction: column-reverse;\n  gap: 8px;\n  max-width: 360px;\n  outline: none;\n}\n\n.bottomRight { bottom: 16px; right: 16px; }\n.bottomLeft { bottom: 16px; left: 16px; }\n.topRight { top: 16px; right: 16px; flex-direction: column; }\n.topLeft { top: 16px; left: 16px; flex-direction: column; }\n\n.toast {\n  --toast-accent: var(--wzl-accent-strong);\n  /* Groups every toast under one ident so toastViewTransitions.css can\n   * target `::view-transition-new/old(.wzl-toast)` without knowing the\n   * per-toast view-transition-name (set inline in Toast.tsx). */\n  view-transition-class: wzl-toast;\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  background: var(--wzl-surface);\n  border: 1px solid var(--wzl-border);\n  border-left: 3px solid var(--toast-accent);\n  border-radius: var(--wzl-radius-md);\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);\n  color: var(--wzl-fg);\n  font-family: var(--wzl-font-ui);\n  padding: 10px 12px;\n  outline: none;\n}\n\n.region[data-focus-visible],\n.toast[data-focus-visible] {\n  outline: 2px solid var(--wzl-focus-ring);\n  outline-offset: 1px;\n}\n\n.toneInfo { /* default accent — uses --toast-accent fallback */ }\n.toneSuccess { --toast-accent: var(--wzl-success, #2ec27e); }\n.toneWarning { --toast-accent: var(--wzl-warning, #d99a3f); }\n.toneError { --toast-accent: var(--wzl-danger, #d94a3f); }\n\n.content {\n  flex: 1;\n  min-width: 0;\n}\n\n.title {\n  display: block;\n  font-size: 13px;\n  font-weight: 600;\n}\n\n.description {\n  display: block;\n  margin-top: 2px;\n  font-size: 12px;\n  color: var(--wzl-fg-muted);\n}\n\n.close {\n  flex: 0 0 auto;\n  background: none;\n  border: none;\n  color: var(--wzl-fg-muted);\n  font-size: 16px;\n  line-height: 1;\n  padding: 2px 4px;\n  cursor: pointer;\n  border-radius: var(--wzl-radius-sm);\n}\n\n.close:hover {\n  color: var(--wzl-fg);\n}\n","import {\n  UNSTABLE_ToastRegion as RACToastRegion,\n  UNSTABLE_Toast as RACToast,\n  UNSTABLE_ToastContent as RACToastContent,\n  Text,\n  Button,\n} from 'react-aria-components';\nimport { defaultToastQueue, racQueueOf, type ToastQueue, type ToastTone } from './queue';\nimport s from './Toast.module.css';\nimport './toastViewTransitions.css';\n\nexport type ToastPlacement = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';\n\nexport interface ToastRegionProps {\n  /** Queue to render. Defaults to the module-level `defaultToastQueue`. */\n  queue?: ToastQueue;\n  /** Screen corner for the stack. Default `bottom-right`. */\n  placement?: ToastPlacement;\n  className?: string;\n}\n\nconst placementClass: Record<ToastPlacement, string> = {\n  'bottom-right': s.bottomRight,\n  'bottom-left': s.bottomLeft,\n  'top-right': s.topRight,\n  'top-left': s.topLeft,\n};\n\nconst toneClass: Record<ToastTone, string> = {\n  info: s.toneInfo,\n  success: s.toneSuccess,\n  warning: s.toneWarning,\n  error: s.toneError,\n};\n\n/**\n * Renders the toast stack for a queue. Mount once, near the app root.\n * From the underlying React Aria region: landmark semantics (keyboard /\n * F6 reachable), screen-reader announcements, and hover pausing the\n * auto-dismiss timers.\n */\nexport function ToastRegion(props: ToastRegionProps) {\n  const { queue = defaultToastQueue, placement = 'bottom-right', className } = props;\n  return (\n    <RACToastRegion\n      queue={racQueueOf(queue)}\n      aria-label=\"Notifications\"\n      className={[s.region, placementClass[placement], className].filter(Boolean).join(' ')}\n    >\n      {({ toast: t }) => (\n        <RACToast\n          toast={t}\n          className={[s.toast, toneClass[t.content.tone]].filter(Boolean).join(' ')}\n          // Inline style is the one sanctioned exception here: each toast\n          // needs a *unique* view-transition-name (so enter/exit/reflow\n          // track per-toast), and a class can't mint unique idents. The\n          // prefix keeps the ident valid (RAC keys can start with digits).\n          style={{ viewTransitionName: `wzl-toast-${t.key.replace(/[^a-zA-Z0-9_-]/g, '_')}` }}\n        >\n          <RACToastContent className={s.content}>\n            <Text slot=\"title\" className={s.title}>{t.content.title}</Text>\n            {t.content.description !== undefined && (\n              <Text slot=\"description\" className={s.description}>{t.content.description}</Text>\n            )}\n          </RACToastContent>\n          <Button slot=\"close\" className={s.close} aria-label=\"Dismiss notification\">\n            ×\n          </Button>\n        </RACToast>\n      )}\n    </RACToastRegion>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Toast-DLM2AsTz.js","names":[],"sources":["../../src/components/Toast/queue.ts","../../src/components/Toast/Toast.module.css","../../src/components/Toast/Toast.tsx"],"sourcesContent":["import { UNSTABLE_ToastQueue } from 'react-aria-components';\nimport { flushSync } from 'react-dom';\n\nexport type ToastTone = 'info' | 'success' | 'warning' | 'error';\n\n/** Kit-owned payload rendered inside each toast. */\nexport interface ToastContent {\n  title: string;\n  description?: string;\n  tone: ToastTone;\n}\n\nexport interface ToastOptions {\n  description?: string;\n  /**\n   * Auto-dismiss delay in ms. Default 8000. `null` — sticky until dismissed.\n   * Must be > 0; RAC treats 0 as no timer (sticky).\n   */\n  ttlMs?: number | null;\n  /** Stable identity: re-adding with the same id replaces the earlier toast. */\n  id?: string;\n}\n\nconst DEFAULT_TTL_MS = 8000;\n\n// Tracks overlapping toast-triggered view transitions so the `:root`\n// marker class survives until the *last* one settles.\nlet activeToastTransitions = 0;\n\n/**\n * RAC's sanctioned toast-animation hook: wrap every queue mutation in a\n * view transition so entry, exit, and the surviving stack's reflow all\n * animate (choreography lives in `toastViewTransitions.css`). Falls back\n * to a plain synchronous update when the browser lacks the API or the\n * user prefers reduced motion — i.e. exactly the pre-animation behavior.\n * The jsdom test environment always takes the fallback path.\n */\nfunction viewTransitionWrapUpdate(fn: () => void): void {\n  const reduceMotion =\n    typeof matchMedia === 'function' && matchMedia('(prefers-reduced-motion: reduce)').matches;\n  if (typeof document === 'undefined' || !('startViewTransition' in document) || reduceMotion) {\n    fn();\n    return;\n  }\n  // The marker class scopes the CSS that un-names `:root` (keeps the rest\n  // of the page live and interactive during the transition) to\n  // toast-owned transitions only.\n  const root = document.documentElement;\n  activeToastTransitions++;\n  root.classList.add('wzl-toast-vt');\n  // flushSync: the DOM must reflect the queue change inside the\n  // transition callback, before the browser snapshots the new state.\n  const vt = document.startViewTransition(() => flushSync(fn));\n  // `ready` rejects when the browser skips the transition — routine under\n  // a rapid burst of toasts, where each new transition supersedes the\n  // in-flight one. The DOM update has still applied by then, but an\n  // untouched `ready` surfaces the rejection as a console error, so\n  // consume it.\n  vt.ready.catch(() => {});\n  void vt.finished.finally(() => {\n    if (--activeToastTransitions === 0) root.classList.remove('wzl-toast-vt');\n  });\n}\n\n// The wrapped RAC queue lives in a module-scoped WeakMap so the public\n// class surface carries no RAC (UNSTABLE_) types — see the design spec's\n// containment rule. `racQueueOf` below is the folder-internal accessor.\nconst RAC_QUEUES = new WeakMap<ToastQueue, UNSTABLE_ToastQueue<ToastContent>>();\n\n/**\n * Kit-owned toast queue. Create isolated instances with\n * `createToastQueue()` (tests, secondary roots); most apps use the\n * module-level `defaultToastQueue` via `toast()`.\n *\n * At most 5 toasts are visible at once; adding a 6th shows immediately\n * and hides the oldest (it returns when a slot frees, with its ttl\n * restarted).\n */\nexport class ToastQueue {\n  private keysById = new Map<string, string>();\n\n  constructor() {\n    RAC_QUEUES.set(\n      this,\n      new UNSTABLE_ToastQueue<ToastContent>({\n        maxVisibleToasts: 5,\n        wrapUpdate: viewTransitionWrapUpdate,\n      }),\n    );\n  }\n\n  add(tone: ToastTone, title: string, options: ToastOptions = {}): void {\n    const { description, ttlMs = DEFAULT_TTL_MS, id } = options;\n    const rac = RAC_QUEUES.get(this)!;\n    if (id !== undefined) {\n      const existing = this.keysById.get(id);\n      if (existing !== undefined) rac.close(existing);\n    }\n    let key: string;\n    const racOptions: { timeout?: number; onClose?: () => void } =\n      ttlMs === null ? {} : { timeout: ttlMs };\n    if (id !== undefined) {\n      racOptions.onClose = () => {\n        if (this.keysById.get(id) === key) this.keysById.delete(id);\n      };\n    }\n    key = rac.add({ title, description, tone }, racOptions);\n    if (id !== undefined) this.keysById.set(id, key);\n  }\n\n  /** Dismiss the toast previously added with this `id`. No-op if none is live. */\n  dismiss(id: string): void {\n    const key = this.keysById.get(id);\n    if (key !== undefined) RAC_QUEUES.get(this)!.close(key);\n  }\n\n  /** Dismiss every queued toast. */\n  clear(): void {\n    RAC_QUEUES.get(this)!.clear();\n    this.keysById.clear();\n  }\n}\n\nexport function createToastQueue(): ToastQueue {\n  return new ToastQueue();\n}\n\n/**\n * Folder-internal bridge to the wrapped RAC queue for `ToastRegion`.\n * Deliberately NOT exported from the Toast folder's `index.ts` — the\n * RAC toast surface is unstable and must not leak past this folder.\n */\nexport function racQueueOf(queue: ToastQueue): UNSTABLE_ToastQueue<ToastContent> {\n  return RAC_QUEUES.get(queue)!;\n}\n\n/** Module-level default queue used by `toast()` and `<ToastRegion>`. */\nexport const defaultToastQueue = createToastQueue();\n\ntype ToastFn = {\n  (title: string, options?: ToastOptions): void;\n  info(title: string, options?: ToastOptions): void;\n  success(title: string, options?: ToastOptions): void;\n  warning(title: string, options?: ToastOptions): void;\n  error(title: string, options?: ToastOptions): void;\n};\n\nfunction tonedAdd(tone: ToastTone) {\n  return (title: string, options?: ToastOptions) => defaultToastQueue.add(tone, title, options);\n}\n\n/** Imperative convenience over `defaultToastQueue`. Bare `toast(...)` is `info`. */\nexport const toast: ToastFn = Object.assign(tonedAdd('info'), {\n  info: tonedAdd('info'),\n  success: tonedAdd('success'),\n  warning: tonedAdd('warning'),\n  error: tonedAdd('error'),\n});\n",".region {\n  position: fixed;\n  z-index: 1100;\n  display: flex;\n  /* RAC unshifts new toasts to the front of the DOM (newest-first), and the\n   * ol/li wrappers are display:contents, so the flex direction alone\n   * decides which end of the stack the newest toast lands on. Base\n   * (bottom corners): column-reverse puts DOM-first (newest) at the\n   * bottom, hugging the corner. Top corners override back to column so\n   * DOM-first still hugs the top edge. */\n  flex-direction: column-reverse;\n  gap: 8px;\n  max-width: 360px;\n  outline: none;\n}\n\n.bottomRight { bottom: 16px; right: 16px; }\n.bottomLeft { bottom: 16px; left: 16px; }\n.topRight { top: 16px; right: 16px; flex-direction: column; }\n.topLeft { top: 16px; left: 16px; flex-direction: column; }\n\n.toast {\n  --toast-accent: var(--wzl-accent-strong);\n  /* Groups every toast under one ident so toastViewTransitions.css can\n   * target `::view-transition-new/old(.wzl-toast)` without knowing the\n   * per-toast view-transition-name (set inline in Toast.tsx). */\n  view-transition-class: wzl-toast;\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  background: var(--wzl-surface);\n  border: 1px solid var(--wzl-border);\n  border-left: 3px solid var(--toast-accent);\n  border-radius: var(--wzl-radius-md);\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);\n  color: var(--wzl-fg);\n  font-family: var(--wzl-font-ui);\n  padding: 10px 12px;\n  outline: none;\n}\n\n.region[data-focus-visible],\n.toast[data-focus-visible] {\n  outline: 2px solid var(--wzl-focus-ring);\n  outline-offset: 1px;\n}\n\n.toneInfo { /* default accent — uses --toast-accent fallback */ }\n.toneSuccess { --toast-accent: var(--wzl-success, #2ec27e); }\n.toneWarning { --toast-accent: var(--wzl-warning, #d99a3f); }\n.toneError { --toast-accent: var(--wzl-danger, #d94a3f); }\n\n.content {\n  flex: 1;\n  min-width: 0;\n}\n\n.title {\n  display: block;\n  font-size: 13px;\n  font-weight: 600;\n}\n\n.description {\n  display: block;\n  margin-top: 2px;\n  font-size: 12px;\n  color: var(--wzl-fg-muted);\n}\n\n.close {\n  flex: 0 0 auto;\n  background: none;\n  border: none;\n  color: var(--wzl-fg-muted);\n  font-size: 16px;\n  line-height: 1;\n  padding: 2px 4px;\n  cursor: pointer;\n  border-radius: var(--wzl-radius-sm);\n}\n\n.close:hover {\n  color: var(--wzl-fg);\n}\n","import {\n  UNSTABLE_ToastRegion as RACToastRegion,\n  UNSTABLE_Toast as RACToast,\n  UNSTABLE_ToastContent as RACToastContent,\n  Text,\n  Button,\n} from 'react-aria-components';\nimport { defaultToastQueue, racQueueOf, type ToastQueue, type ToastTone } from './queue';\nimport s from './Toast.module.css';\nimport './toastViewTransitions.css';\n\nexport type ToastPlacement = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';\n\nexport interface ToastRegionProps {\n  /** Queue to render. Defaults to the module-level `defaultToastQueue`. */\n  queue?: ToastQueue;\n  /** Screen corner for the stack. Default `bottom-right`. */\n  placement?: ToastPlacement;\n  className?: string;\n}\n\nconst placementClass: Record<ToastPlacement, string> = {\n  'bottom-right': s.bottomRight,\n  'bottom-left': s.bottomLeft,\n  'top-right': s.topRight,\n  'top-left': s.topLeft,\n};\n\nconst toneClass: Record<ToastTone, string> = {\n  info: s.toneInfo,\n  success: s.toneSuccess,\n  warning: s.toneWarning,\n  error: s.toneError,\n};\n\n/**\n * Renders the toast stack for a queue. Mount once, near the app root.\n * From the underlying React Aria region: landmark semantics (keyboard /\n * F6 reachable), screen-reader announcements, and hover pausing the\n * auto-dismiss timers.\n */\nexport function ToastRegion(props: ToastRegionProps) {\n  const { queue = defaultToastQueue, placement = 'bottom-right', className } = props;\n  return (\n    <RACToastRegion\n      queue={racQueueOf(queue)}\n      aria-label=\"Notifications\"\n      className={[s.region, placementClass[placement], className].filter(Boolean).join(' ')}\n    >\n      {({ toast: t }) => (\n        <RACToast\n          toast={t}\n          className={[s.toast, toneClass[t.content.tone]].filter(Boolean).join(' ')}\n          // Inline style is the one sanctioned exception here: each toast\n          // needs a *unique* view-transition-name (so enter/exit/reflow\n          // track per-toast), and a class can't mint unique idents. The\n          // prefix keeps the ident valid (RAC keys can start with digits).\n          style={{ viewTransitionName: `wzl-toast-${t.key.replace(/[^a-zA-Z0-9_-]/g, '_')}` }}\n        >\n          <RACToastContent className={s.content}>\n            <Text slot=\"title\" className={s.title}>{t.content.title}</Text>\n            {t.content.description !== undefined && (\n              <Text slot=\"description\" className={s.description}>{t.content.description}</Text>\n            )}\n          </RACToastContent>\n          <Button slot=\"close\" className={s.close} aria-label=\"Dismiss notification\">\n            ×\n          </Button>\n        </RACToast>\n      )}\n    </RACToastRegion>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/ToggleBar-Defj6Asn.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleBar-Defj6Asn.js","names":[],"sources":["../../src/components/ToggleBar/ToggleBar.module.css","../../src/components/ToggleBar/ToggleBar.tsx"],"sourcesContent":["/* Aqua-glass segmented control. The track is a pill-shaped well; the\n   selected segment becomes a tinted glass cylinder that reads as the same\n   \"lozenge\" family as the standalone Button. Visual params come from the\n   `--btn-*` custom properties (see Button.module.css) so the Button Lab\n   can tune both surfaces with one set of sliders. */\n.root {\n  display: inline-flex;\n  height: var(--wzl-tb-height, 28px);\n  padding: 2px;\n  background: linear-gradient(\n    180deg,\n    rgba(0, 0, 0, 0.18) 0%,\n    rgba(0, 0, 0, 0.05) 100%\n  );\n  border-radius: 999px;\n  /* Clip segments to the track outline so interior corners read crisp and\n     the selected segment's glass treatment doesn't paint over the rounded\n     outer pixels. */\n  overflow: hidden;\n  box-shadow:\n    inset 0 1px 2px rgba(0, 0, 0, 0.4),\n    0 1px 0 rgba(255, 255, 255, 0.06);\n  user-select: none;\n  -webkit-user-select: none;\n  touch-action: none;\n}\n\n.segment {\n  position: relative;\n  flex: 1 1 0;\n  min-width: 0;\n  padding: 0 12px;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  margin: 0;\n  font-family: var(--wzl-font-ui);\n  font-weight: 300;\n  font-size: var(--btn-fontsize, 14px);\n  line-height: 1;\n  color: var(--wzl-fg-muted);\n  cursor: pointer;\n  /* Only round the outer corners of the bar — middle segments stay square\n     so the seams between them don't render as facing parentheses. */\n  border-radius: 0;\n  isolation: isolate;\n  overflow: hidden;\n  transition: color var(--wzl-motion-fast);\n}\n\n.segment:first-child {\n  border-radius: 999px 0 0 999px;\n}\n\n.segment:last-child {\n  border-radius: 0 999px 999px 0;\n}\n\n.segment:only-child {\n  border-radius: 999px;\n}\n\n.segment:focus-visible {\n  outline: 2px solid var(--wzl-accent);\n  outline-offset: -2px;\n}\n\n.segment:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.segment:hover:not(:disabled):not(.segmentSelected) {\n  color: var(--wzl-fg);\n}\n\n/* Selected segment — full Aqua glass cylinder. Mirrors Button.variant_primary. */\n.segmentSelected {\n  background: linear-gradient(\n    180deg,\n    color-mix(in srgb, var(--wzl-accent) var(--btn-top-alpha, 45%), transparent) 0%,\n    color-mix(in srgb, var(--wzl-accent) var(--btn-upper-alpha, 70%), transparent) calc(var(--btn-equator, 52%) - var(--btn-equator-spread, 12%)),\n    color-mix(in srgb, var(--wzl-accent) var(--btn-equator-tint, 95%), white) var(--btn-equator, 52%),\n    var(--wzl-accent) calc(var(--btn-equator, 52%) + var(--btn-equator-spread, 12%) * 1.6),\n    color-mix(in srgb, var(--wzl-accent) var(--btn-base-tint, 70%), black) 100%\n  );\n  backdrop-filter: blur(var(--btn-blur, 6px)) saturate(var(--btn-saturate, 1.3));\n  -webkit-backdrop-filter: blur(var(--btn-blur, 6px)) saturate(var(--btn-saturate, 1.3));\n  color: var(--wzl-fg-on-accent);\n  text-shadow:\n    0 1px 0 rgba(0, 0, 0, var(--btn-text-shadow, 0.35)),\n    var(--btn-text-inset-x, 0px) var(--btn-text-inset-y, 1px) 0 rgba(0, 0, 0, var(--btn-text-inset, 0.55)),\n    0 0 6px rgba(0, 0, 0, calc(var(--btn-text-shadow, 0.35) * 0.5));\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, var(--btn-inset-hi, 0.42)),\n    inset 0 -1px 2px rgba(0, 0, 0, var(--btn-inset-lo, 0.3)),\n    0 0 0 1px rgba(0, 0, 0, var(--btn-rim, 0.22)),\n    0 1px 2px rgba(0, 0, 0, var(--btn-drop-near, 0.3)),\n    0 2px 4px rgba(0, 0, 0, calc(var(--btn-drop-far, 0.18) * 0.8));\n}\n\n/* Specular gloss on the selected segment. Top corners inherit the\n   segment's radius so they hug the upper edge cleanly; bottom corners\n   are flattened so the gloss ends in a straight line at the equator\n   instead of two little curves that read as `)(` brackets. */\n.segmentSelected::before {\n  content: '';\n  position: absolute;\n  inset: 1px 1px var(--btn-gloss-bottom, 50%) 1px;\n  border-radius: inherit;\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  background: linear-gradient(\n    180deg,\n    rgba(255, 255, 255, var(--btn-gloss-top, 0.42)) 0%,\n    rgba(255, 255, 255, var(--btn-gloss-mid, 0.12)) 60%,\n    rgba(255, 255, 255, 0) 100%\n  );\n  pointer-events: none;\n  z-index: 1;\n}\n\n.segmentSelected > * {\n  position: relative;\n  z-index: 2;\n}\n\n/* Mixed segment (`aria-pressed=\"mixed\"`) — the sources disagree. Reads as a\n   deliberate third state rather than a dimmed \"on\": a flat accent wash with\n   none of the selected segment's gloss/cylinder treatment, so it can't be\n   mistaken for the glass lozenge at a glance. */\n.segmentMixed {\n  background: color-mix(in srgb, var(--wzl-accent) 22%, transparent);\n  color: var(--wzl-fg);\n  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wzl-accent) 45%, transparent);\n}\n\n.segmentMixed:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--wzl-accent) 32%, transparent);\n}\n\n.variant_minimal .segmentMixed {\n  background: color-mix(in srgb, var(--wzl-accent) 18%, transparent);\n  box-shadow: none;\n  color: var(--wzl-fg);\n}\n\n/* Small variant — ~60% of the default height, with proportionally reduced\n   padding and font. Sized for dense surfaces (lab control panels, inline\n   filters, etc.). */\n.size_sm {\n  height: 17px;\n  padding: 1px;\n}\n\n.size_sm .segment {\n  padding: 0 8px;\n  font-size: 11px;\n}\n\n/* Minimal variant — strips the pill track, glass selected state, inset\n   shadows, and outer padding. Used in dense diagnostic surfaces (dispatch\n   trace, lab inspectors) where the bar must read as plain text controls. */\n.variant_minimal {\n  height: auto;\n  padding: 0;\n  background: none;\n  border: 1px solid var(--wzl-border, rgba(255, 255, 255, 0.18));\n  border-radius: 3px;\n  box-shadow: none;\n  gap: 0;\n}\n\n.variant_minimal .segment {\n  padding: 0 6px;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1.4;\n  border-radius: 0;\n  color: var(--wzl-fg-muted);\n  transition: none;\n}\n\n/* Dividers between segments make the mutual-exclusion grouping visible\n   without a heavy track. Only the inner edges get a rule — the outer\n   border on `.variant_minimal` handles the perimeter. */\n.variant_minimal .segment + .segment {\n  border-left: 1px solid var(--wzl-border, rgba(255, 255, 255, 0.18));\n}\n\n.variant_minimal .segment:first-child,\n.variant_minimal .segment:last-child,\n.variant_minimal .segment:only-child {\n  border-radius: 0;\n}\n\n.variant_minimal .segment:hover:not(:disabled):not(.segmentSelected) {\n  color: var(--wzl-fg);\n  background: rgba(255, 255, 255, 0.06);\n}\n\n.variant_minimal .segmentSelected {\n  background: none;\n  backdrop-filter: none;\n  -webkit-backdrop-filter: none;\n  color: var(--wzl-accent-fg, var(--wzl-accent));\n  text-shadow: none;\n  box-shadow: none;\n  font-weight: 500;\n}\n\n.variant_minimal .segmentSelected::before {\n  content: none;\n}\n","import { useRef, type CSSProperties, type KeyboardEvent as ReactKeyboardEvent, type ReactElement, type ReactNode } from 'react';\nimport s from './ToggleBar.module.css';\n\nexport type ToggleBarItem<V extends string | number = string> = {\n  value: V;\n  label?: ReactNode;\n  ariaLabel?: string;\n  disabled?: boolean;\n};\n\nexport type ToggleBarSize = 'sm' | 'md';\nexport type ToggleBarVariant = 'default' | 'minimal';\n\ntype CommonProps = {\n  ariaLabel?: string;\n  className?: string;\n  height?: number;\n  /** Size variant. `sm` is ~60% of the default height with reduced padding\n   *  and font size — sized for dense surfaces like lab control panels. */\n  size?: ToggleBarSize;\n  /** Visual variant. `minimal` strips the pill track and glass treatment;\n   *  selection becomes a flat accent. For dense diagnostic surfaces. */\n  variant?: ToggleBarVariant;\n};\n\nexport type ToggleBarProps<V extends string | number = string> =\n  | (CommonProps & {\n      mode?: 'single';\n      items: readonly ToggleBarItem<V>[];\n      value: V | null;\n      onChange: (next: V | null) => void;\n      allowDeselect?: boolean;\n    })\n  | (CommonProps & {\n      mode: 'multiple';\n      items: readonly ToggleBarItem<V>[];\n      value: readonly V[];\n      /**\n       * Values that are neither on nor off — the sources this bar\n       * aggregates disagree (a text range that is bold in part of it, a\n       * multi-selection whose nodes differ). Rendered `aria-pressed=\"mixed\"`,\n       * the ARIA tri-state a toggle button actually has, rather than\n       * `SelectionPanel`'s reduced-opacity-plus-`title` workaround for\n       * `Switch`, which has no indeterminate state to render.\n       *\n       * `value` wins where the two lists overlap, so a caller that can't\n       * cheaply keep them disjoint doesn't get an ambiguous segment.\n       *\n       * Clicking a mixed segment turns it fully **on**, matching the\n       * everywhere-else convention (and `toggleFlagInRange`'s rule for a\n       * partially-styled text range) that a mixed toggle resolves toward\n       * the affirmative rather than clearing.\n       */\n      mixedValues?: readonly V[];\n      onChange: (next: V[]) => void;\n    });\n\nfunction firstEnabledIndex(items: readonly ToggleBarItem<string | number>[]): number {\n  for (let i = 0; i < items.length; i++) if (!items[i].disabled) return i;\n  return -1;\n}\n\nfunction lastEnabledIndex(items: readonly ToggleBarItem<string | number>[]): number {\n  for (let i = items.length - 1; i >= 0; i--) if (!items[i].disabled) return i;\n  return -1;\n}\n\nfunction nextEnabledIndex(items: readonly ToggleBarItem<string | number>[], from: number): number {\n  const n = items.length;\n  for (let k = 1; k <= n; k++) {\n    const i = (from + k + n) % n;\n    if (!items[i].disabled) return i;\n  }\n  return from;\n}\n\nfunction prevEnabledIndex(items: readonly ToggleBarItem<string | number>[], from: number): number {\n  const n = items.length;\n  for (let k = 1; k <= n; k++) {\n    const i = (from - k + n) % n;\n    if (!items[i].disabled) return i;\n  }\n  return from;\n}\n\nexport function ToggleBar<V extends string | number = string>(props: ToggleBarProps<V>): ReactElement {\n  const { items, ariaLabel, className, height, size, variant } = props;\n  const mode = props.mode ?? 'single';\n  const rootRef = useRef<HTMLDivElement | null>(null);\n\n  const isSelected = (value: V): boolean => {\n    if (mode === 'multiple') return (props.value as readonly V[]).includes(value);\n    return (props.value as V | null) === value;\n  };\n\n  /** Mixed only in multiple mode, and only where `value` doesn't already\n   *  claim the segment. Single mode has nothing to be mixed about — its\n   *  aggregate is one value or none. */\n  const isMixed = (value: V): boolean => {\n    if (mode !== 'multiple') return false;\n    const mixed = (props as { mixedValues?: readonly V[] }).mixedValues;\n    return mixed !== undefined && mixed.includes(value) && !isSelected(value);\n  };\n\n  let tabStopIndex = -1;\n  if (mode === 'single') {\n    const sel = items.findIndex(it => it.value === (props.value as V | null));\n    tabStopIndex = sel >= 0 && !items[sel].disabled ? sel : firstEnabledIndex(items);\n  } else {\n    tabStopIndex = firstEnabledIndex(items);\n  }\n\n  const handleClick = (index: number) => () => {\n    const item = items[index];\n    if (item.disabled) return;\n    if (mode === 'multiple') {\n      const current = props.value as readonly V[];\n      const next = current.includes(item.value)\n        ? current.filter(v => v !== item.value)\n        : [...current, item.value];\n      (props.onChange as (n: V[]) => void)(next);\n    } else {\n      const current = props.value as V | null;\n      if (current === item.value) {\n        if ((props as { allowDeselect?: boolean }).allowDeselect) {\n          (props.onChange as (n: V | null) => void)(null);\n        }\n        return;\n      }\n      (props.onChange as (n: V | null) => void)(item.value);\n    }\n  };\n\n  const focusSegment = (index: number) => {\n    const root = rootRef.current;\n    if (!root) return;\n    const buttons = root.querySelectorAll<HTMLButtonElement>(`.${s.segment}`);\n    buttons[index]?.focus();\n  };\n\n  const handleKeyDown = (index: number) => (e: ReactKeyboardEvent<HTMLButtonElement>) => {\n    let nextIndex = -1;\n    switch (e.key) {\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        nextIndex = prevEnabledIndex(items, index);\n        break;\n      case 'ArrowRight':\n      case 'ArrowDown':\n        nextIndex = nextEnabledIndex(items, index);\n        break;\n      case 'Home':\n        nextIndex = firstEnabledIndex(items);\n        break;\n      case 'End':\n        nextIndex = lastEnabledIndex(items);\n        break;\n      case ' ':\n      case 'Enter':\n        if (mode === 'multiple') {\n          e.preventDefault();\n          handleClick(index)();\n        }\n        return;\n      default:\n        return;\n    }\n    if (nextIndex < 0 || nextIndex === index) return;\n    e.preventDefault();\n    if (mode === 'single') {\n      const item = items[nextIndex];\n      (props.onChange as (n: V | null) => void)(item.value);\n    }\n    focusSegment(nextIndex);\n  };\n\n  const style: CSSProperties | undefined = height !== undefined\n    ? ({ ['--wzl-tb-height' as string]: `${height}px` } as CSSProperties)\n    : undefined;\n\n  const rootCls = [\n    s.root,\n    size && s[`size_${size}`],\n    variant && s[`variant_${variant}`],\n    className,\n  ].filter(Boolean).join(' ');\n\n  return (\n    <div\n      ref={rootRef}\n      className={rootCls}\n      role={mode === 'multiple' ? 'group' : 'radiogroup'}\n      aria-label={ariaLabel}\n      style={style}\n    >\n      {items.map((item, i) => {\n        const selected = isSelected(item.value);\n        const mixed = isMixed(item.value);\n        const cls = [s.segment, selected && s.segmentSelected, mixed && s.segmentMixed]\n          .filter(Boolean)\n          .join(' ');\n        return (\n          <button\n            key={item.value}\n            type=\"button\"\n            role={mode === 'multiple' ? undefined : 'radio'}\n            aria-checked={mode === 'multiple' ? undefined : selected}\n            aria-pressed={mode === 'multiple' ? (mixed ? 'mixed' : selected) : undefined}\n            aria-label={item.ariaLabel}\n            disabled={item.disabled}\n            tabIndex={i === tabStopIndex ? 0 : -1}\n            className={cls}\n            onClick={handleClick(i)}\n            onKeyDown={handleKeyDown(i)}\n          >\n            {item.label}\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ToggleBar-Defj6Asn.js","names":[],"sources":["../../src/components/ToggleBar/ToggleBar.module.css","../../src/components/ToggleBar/ToggleBar.tsx"],"sourcesContent":["/* Aqua-glass segmented control. The track is a pill-shaped well; the\n   selected segment becomes a tinted glass cylinder that reads as the same\n   \"lozenge\" family as the standalone Button. Visual params come from the\n   `--btn-*` custom properties (see Button.module.css) so the Button Lab\n   can tune both surfaces with one set of sliders. */\n.root {\n  display: inline-flex;\n  height: var(--wzl-tb-height, 28px);\n  padding: 2px;\n  background: linear-gradient(\n    180deg,\n    rgba(0, 0, 0, 0.18) 0%,\n    rgba(0, 0, 0, 0.05) 100%\n  );\n  border-radius: 999px;\n  /* Clip segments to the track outline so interior corners read crisp and\n     the selected segment's glass treatment doesn't paint over the rounded\n     outer pixels. */\n  overflow: hidden;\n  box-shadow:\n    inset 0 1px 2px rgba(0, 0, 0, 0.4),\n    0 1px 0 rgba(255, 255, 255, 0.06);\n  user-select: none;\n  -webkit-user-select: none;\n  touch-action: none;\n}\n\n.segment {\n  position: relative;\n  flex: 1 1 0;\n  min-width: 0;\n  padding: 0 12px;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: none;\n  margin: 0;\n  font-family: var(--wzl-font-ui);\n  font-weight: 300;\n  font-size: var(--btn-fontsize, 14px);\n  line-height: 1;\n  color: var(--wzl-fg-muted);\n  cursor: pointer;\n  /* Only round the outer corners of the bar — middle segments stay square\n     so the seams between them don't render as facing parentheses. */\n  border-radius: 0;\n  isolation: isolate;\n  overflow: hidden;\n  transition: color var(--wzl-motion-fast);\n}\n\n.segment:first-child {\n  border-radius: 999px 0 0 999px;\n}\n\n.segment:last-child {\n  border-radius: 0 999px 999px 0;\n}\n\n.segment:only-child {\n  border-radius: 999px;\n}\n\n.segment:focus-visible {\n  outline: 2px solid var(--wzl-accent);\n  outline-offset: -2px;\n}\n\n.segment:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.segment:hover:not(:disabled):not(.segmentSelected) {\n  color: var(--wzl-fg);\n}\n\n/* Selected segment — full Aqua glass cylinder. Mirrors Button.variant_primary. */\n.segmentSelected {\n  background: linear-gradient(\n    180deg,\n    color-mix(in srgb, var(--wzl-accent) var(--btn-top-alpha, 45%), transparent) 0%,\n    color-mix(in srgb, var(--wzl-accent) var(--btn-upper-alpha, 70%), transparent) calc(var(--btn-equator, 52%) - var(--btn-equator-spread, 12%)),\n    color-mix(in srgb, var(--wzl-accent) var(--btn-equator-tint, 95%), white) var(--btn-equator, 52%),\n    var(--wzl-accent) calc(var(--btn-equator, 52%) + var(--btn-equator-spread, 12%) * 1.6),\n    color-mix(in srgb, var(--wzl-accent) var(--btn-base-tint, 70%), black) 100%\n  );\n  backdrop-filter: blur(var(--btn-blur, 6px)) saturate(var(--btn-saturate, 1.3));\n  -webkit-backdrop-filter: blur(var(--btn-blur, 6px)) saturate(var(--btn-saturate, 1.3));\n  color: var(--wzl-fg-on-accent);\n  text-shadow:\n    0 1px 0 rgba(0, 0, 0, var(--btn-text-shadow, 0.35)),\n    var(--btn-text-inset-x, 0px) var(--btn-text-inset-y, 1px) 0 rgba(0, 0, 0, var(--btn-text-inset, 0.55)),\n    0 0 6px rgba(0, 0, 0, calc(var(--btn-text-shadow, 0.35) * 0.5));\n  box-shadow:\n    inset 0 1px 0 rgba(255, 255, 255, var(--btn-inset-hi, 0.42)),\n    inset 0 -1px 2px rgba(0, 0, 0, var(--btn-inset-lo, 0.3)),\n    0 0 0 1px rgba(0, 0, 0, var(--btn-rim, 0.22)),\n    0 1px 2px rgba(0, 0, 0, var(--btn-drop-near, 0.3)),\n    0 2px 4px rgba(0, 0, 0, calc(var(--btn-drop-far, 0.18) * 0.8));\n}\n\n/* Specular gloss on the selected segment. Top corners inherit the\n   segment's radius so they hug the upper edge cleanly; bottom corners\n   are flattened so the gloss ends in a straight line at the equator\n   instead of two little curves that read as `)(` brackets. */\n.segmentSelected::before {\n  content: '';\n  position: absolute;\n  inset: 1px 1px var(--btn-gloss-bottom, 50%) 1px;\n  border-radius: inherit;\n  border-bottom-left-radius: 0;\n  border-bottom-right-radius: 0;\n  background: linear-gradient(\n    180deg,\n    rgba(255, 255, 255, var(--btn-gloss-top, 0.42)) 0%,\n    rgba(255, 255, 255, var(--btn-gloss-mid, 0.12)) 60%,\n    rgba(255, 255, 255, 0) 100%\n  );\n  pointer-events: none;\n  z-index: 1;\n}\n\n.segmentSelected > * {\n  position: relative;\n  z-index: 2;\n}\n\n/* Mixed segment (`aria-pressed=\"mixed\"`) — the sources disagree. Reads as a\n   deliberate third state rather than a dimmed \"on\": a flat accent wash with\n   none of the selected segment's gloss/cylinder treatment, so it can't be\n   mistaken for the glass lozenge at a glance. */\n.segmentMixed {\n  background: color-mix(in srgb, var(--wzl-accent) 22%, transparent);\n  color: var(--wzl-fg);\n  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wzl-accent) 45%, transparent);\n}\n\n.segmentMixed:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--wzl-accent) 32%, transparent);\n}\n\n.variant_minimal .segmentMixed {\n  background: color-mix(in srgb, var(--wzl-accent) 18%, transparent);\n  box-shadow: none;\n  color: var(--wzl-fg);\n}\n\n/* Small variant — ~60% of the default height, with proportionally reduced\n   padding and font. Sized for dense surfaces (lab control panels, inline\n   filters, etc.). */\n.size_sm {\n  height: 17px;\n  padding: 1px;\n}\n\n.size_sm .segment {\n  padding: 0 8px;\n  font-size: 11px;\n}\n\n/* Minimal variant — strips the pill track, glass selected state, inset\n   shadows, and outer padding. Used in dense diagnostic surfaces (dispatch\n   trace, lab inspectors) where the bar must read as plain text controls. */\n.variant_minimal {\n  height: auto;\n  padding: 0;\n  background: none;\n  border: 1px solid var(--wzl-border, rgba(255, 255, 255, 0.18));\n  border-radius: 3px;\n  box-shadow: none;\n  gap: 0;\n}\n\n.variant_minimal .segment {\n  padding: 0 6px;\n  font-size: 11px;\n  font-weight: 400;\n  line-height: 1.4;\n  border-radius: 0;\n  color: var(--wzl-fg-muted);\n  transition: none;\n}\n\n/* Dividers between segments make the mutual-exclusion grouping visible\n   without a heavy track. Only the inner edges get a rule — the outer\n   border on `.variant_minimal` handles the perimeter. */\n.variant_minimal .segment + .segment {\n  border-left: 1px solid var(--wzl-border, rgba(255, 255, 255, 0.18));\n}\n\n.variant_minimal .segment:first-child,\n.variant_minimal .segment:last-child,\n.variant_minimal .segment:only-child {\n  border-radius: 0;\n}\n\n.variant_minimal .segment:hover:not(:disabled):not(.segmentSelected) {\n  color: var(--wzl-fg);\n  background: rgba(255, 255, 255, 0.06);\n}\n\n.variant_minimal .segmentSelected {\n  background: none;\n  backdrop-filter: none;\n  -webkit-backdrop-filter: none;\n  color: var(--wzl-accent-fg, var(--wzl-accent));\n  text-shadow: none;\n  box-shadow: none;\n  font-weight: 500;\n}\n\n.variant_minimal .segmentSelected::before {\n  content: none;\n}\n","import { useRef, type CSSProperties, type KeyboardEvent as ReactKeyboardEvent, type ReactElement, type ReactNode } from 'react';\nimport s from './ToggleBar.module.css';\n\nexport type ToggleBarItem<V extends string | number = string> = {\n  value: V;\n  label?: ReactNode;\n  ariaLabel?: string;\n  disabled?: boolean;\n};\n\nexport type ToggleBarSize = 'sm' | 'md';\nexport type ToggleBarVariant = 'default' | 'minimal';\n\ntype CommonProps = {\n  ariaLabel?: string;\n  className?: string;\n  height?: number;\n  /** Size variant. `sm` is ~60% of the default height with reduced padding\n   *  and font size — sized for dense surfaces like lab control panels. */\n  size?: ToggleBarSize;\n  /** Visual variant. `minimal` strips the pill track and glass treatment;\n   *  selection becomes a flat accent. For dense diagnostic surfaces. */\n  variant?: ToggleBarVariant;\n};\n\nexport type ToggleBarProps<V extends string | number = string> =\n  | (CommonProps & {\n      mode?: 'single';\n      items: readonly ToggleBarItem<V>[];\n      value: V | null;\n      onChange: (next: V | null) => void;\n      allowDeselect?: boolean;\n    })\n  | (CommonProps & {\n      mode: 'multiple';\n      items: readonly ToggleBarItem<V>[];\n      value: readonly V[];\n      /**\n       * Values that are neither on nor off — the sources this bar\n       * aggregates disagree (a text range that is bold in part of it, a\n       * multi-selection whose nodes differ). Rendered `aria-pressed=\"mixed\"`,\n       * the ARIA tri-state a toggle button actually has, rather than\n       * `SelectionPanel`'s reduced-opacity-plus-`title` workaround for\n       * `Switch`, which has no indeterminate state to render.\n       *\n       * `value` wins where the two lists overlap, so a caller that can't\n       * cheaply keep them disjoint doesn't get an ambiguous segment.\n       *\n       * Clicking a mixed segment turns it fully **on**, matching the\n       * everywhere-else convention (and `toggleFlagInRange`'s rule for a\n       * partially-styled text range) that a mixed toggle resolves toward\n       * the affirmative rather than clearing.\n       */\n      mixedValues?: readonly V[];\n      onChange: (next: V[]) => void;\n    });\n\nfunction firstEnabledIndex(items: readonly ToggleBarItem<string | number>[]): number {\n  for (let i = 0; i < items.length; i++) if (!items[i].disabled) return i;\n  return -1;\n}\n\nfunction lastEnabledIndex(items: readonly ToggleBarItem<string | number>[]): number {\n  for (let i = items.length - 1; i >= 0; i--) if (!items[i].disabled) return i;\n  return -1;\n}\n\nfunction nextEnabledIndex(items: readonly ToggleBarItem<string | number>[], from: number): number {\n  const n = items.length;\n  for (let k = 1; k <= n; k++) {\n    const i = (from + k + n) % n;\n    if (!items[i].disabled) return i;\n  }\n  return from;\n}\n\nfunction prevEnabledIndex(items: readonly ToggleBarItem<string | number>[], from: number): number {\n  const n = items.length;\n  for (let k = 1; k <= n; k++) {\n    const i = (from - k + n) % n;\n    if (!items[i].disabled) return i;\n  }\n  return from;\n}\n\nexport function ToggleBar<V extends string | number = string>(props: ToggleBarProps<V>): ReactElement {\n  const { items, ariaLabel, className, height, size, variant } = props;\n  const mode = props.mode ?? 'single';\n  const rootRef = useRef<HTMLDivElement | null>(null);\n\n  const isSelected = (value: V): boolean => {\n    if (mode === 'multiple') return (props.value as readonly V[]).includes(value);\n    return (props.value as V | null) === value;\n  };\n\n  /** Mixed only in multiple mode, and only where `value` doesn't already\n   *  claim the segment. Single mode has nothing to be mixed about — its\n   *  aggregate is one value or none. */\n  const isMixed = (value: V): boolean => {\n    if (mode !== 'multiple') return false;\n    const mixed = (props as { mixedValues?: readonly V[] }).mixedValues;\n    return mixed !== undefined && mixed.includes(value) && !isSelected(value);\n  };\n\n  let tabStopIndex = -1;\n  if (mode === 'single') {\n    const sel = items.findIndex(it => it.value === (props.value as V | null));\n    tabStopIndex = sel >= 0 && !items[sel].disabled ? sel : firstEnabledIndex(items);\n  } else {\n    tabStopIndex = firstEnabledIndex(items);\n  }\n\n  const handleClick = (index: number) => () => {\n    const item = items[index];\n    if (item.disabled) return;\n    if (mode === 'multiple') {\n      const current = props.value as readonly V[];\n      const next = current.includes(item.value)\n        ? current.filter(v => v !== item.value)\n        : [...current, item.value];\n      (props.onChange as (n: V[]) => void)(next);\n    } else {\n      const current = props.value as V | null;\n      if (current === item.value) {\n        if ((props as { allowDeselect?: boolean }).allowDeselect) {\n          (props.onChange as (n: V | null) => void)(null);\n        }\n        return;\n      }\n      (props.onChange as (n: V | null) => void)(item.value);\n    }\n  };\n\n  const focusSegment = (index: number) => {\n    const root = rootRef.current;\n    if (!root) return;\n    const buttons = root.querySelectorAll<HTMLButtonElement>(`.${s.segment}`);\n    buttons[index]?.focus();\n  };\n\n  const handleKeyDown = (index: number) => (e: ReactKeyboardEvent<HTMLButtonElement>) => {\n    let nextIndex = -1;\n    switch (e.key) {\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        nextIndex = prevEnabledIndex(items, index);\n        break;\n      case 'ArrowRight':\n      case 'ArrowDown':\n        nextIndex = nextEnabledIndex(items, index);\n        break;\n      case 'Home':\n        nextIndex = firstEnabledIndex(items);\n        break;\n      case 'End':\n        nextIndex = lastEnabledIndex(items);\n        break;\n      case ' ':\n      case 'Enter':\n        if (mode === 'multiple') {\n          e.preventDefault();\n          handleClick(index)();\n        }\n        return;\n      default:\n        return;\n    }\n    if (nextIndex < 0 || nextIndex === index) return;\n    e.preventDefault();\n    if (mode === 'single') {\n      const item = items[nextIndex];\n      (props.onChange as (n: V | null) => void)(item.value);\n    }\n    focusSegment(nextIndex);\n  };\n\n  const style: CSSProperties | undefined = height !== undefined\n    ? ({ ['--wzl-tb-height' as string]: `${height}px` } as CSSProperties)\n    : undefined;\n\n  const rootCls = [\n    s.root,\n    size && s[`size_${size}`],\n    variant && s[`variant_${variant}`],\n    className,\n  ].filter(Boolean).join(' ');\n\n  return (\n    <div\n      ref={rootRef}\n      className={rootCls}\n      role={mode === 'multiple' ? 'group' : 'radiogroup'}\n      aria-label={ariaLabel}\n      style={style}\n    >\n      {items.map((item, i) => {\n        const selected = isSelected(item.value);\n        const mixed = isMixed(item.value);\n        const cls = [s.segment, selected && s.segmentSelected, mixed && s.segmentMixed]\n          .filter(Boolean)\n          .join(' ');\n        return (\n          <button\n            key={item.value}\n            type=\"button\"\n            role={mode === 'multiple' ? undefined : 'radio'}\n            aria-checked={mode === 'multiple' ? undefined : selected}\n            aria-pressed={mode === 'multiple' ? (mixed ? 'mixed' : selected) : undefined}\n            aria-label={item.ariaLabel}\n            disabled={item.disabled}\n            tabIndex={i === tabStopIndex ? 0 : -1}\n            className={cls}\n            onClick={handleClick(i)}\n            onKeyDown={handleKeyDown(i)}\n          >\n            {item.label}\n          </button>\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/{ToolButton-Dk_uJf7N.js → ToolButton-Dv6NdZKh.js}

@@ -50,4 +50,4 @@ function o(o) {
 //#endregion
 export { o as t };
 
-//# sourceMappingURL=ToolButton-Dk_uJf7N.js.map
+//# sourceMappingURL=ToolButton-Dv6NdZKh.js.map

package/dist/chunks/{ToolButton-Dk_uJf7N.js.map → ToolButton-Dv6NdZKh.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ToolButton-Dk_uJf7N.js","names":[],"sources":["../../src/components/ToolButton/ToolButton.module.css","../../src/components/ToolButton/ToolButton.tsx"],"sourcesContent":[".button {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 2px;\n  min-width: 44px;\n  padding: 6px 4px;\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: 3px;\n  color: var(--wzl-text);\n  cursor: default;\n  font-family: inherit;\n  font-size: 10px;\n  line-height: 1.1;\n}\n.button:hover:not([disabled]) {\n  background: var(--wzl-button-fill-hover);\n  color: var(--wzl-button-text);\n}\n.button:focus-visible {\n  outline: 2px solid var(--wzl-accent);\n  outline-offset: -2px;\n}\n.button.active {\n  background: var(--wzl-button-fill-pressed);\n  border-color: var(--wzl-accent);\n  color: var(--wzl-button-text);\n}\n.button[disabled] {\n  opacity: 0.4;\n}\n\n.icon { display: block; }\n.icon > svg { display: block; }\n.label { font-size: 10px; }\n.shortcut {\n  color: var(--wzl-text-muted);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  font-size: 9px;\n}\n","import type { ReactNode } from 'react';\nimport { Focusable } from 'react-aria-components';\nimport { Tooltip, TooltipTrigger } from '../Tooltip';\nimport s from './ToolButton.module.css';\n\nexport interface ToolButtonProps {\n  /** Icon node (typically an SVG component). */\n  icon: ReactNode;\n  /** Human-readable label shown under the icon. */\n  label: string;\n  /** Optional shortcut hint (e.g. \"V\" or \"⌘Z\"). */\n  shortcut?: string;\n  /** Selected/active state — toggles the active visual treatment. */\n  active?: boolean;\n  /** Disabled state — passes through to the underlying button. */\n  disabled?: boolean;\n  /**\n   * When true, sets `aria-disabled=\"true\"` on the button without using the\n   * native `disabled` attribute. This keeps the button focusable and reachable\n   * by keyboard (roving-tabindex still applies) while marking it as ineligible\n   * to screen readers. The caller is responsible for making `onClick` a no-op.\n   */\n  ariaDisabled?: boolean;\n  /**\n   * Whether this button is the currently tabbable member of its toolbar.\n   * Toolbars use roving tabindex: exactly one button has `tabIndex=0` at\n   * a time; the rest are `-1`. Caller manages which.\n   */\n  tabbable?: boolean;\n  /** Click handler. */\n  onClick(): void;\n  /**\n   * Tooltip content. Defaults to `label` (plus `shortcut` if provided).\n   */\n  title?: string;\n  /** Additional class for the root button. */\n  className?: string;\n}\n\n/**\n * Generic icon-+-label toolbar button — building block for `ToolPalette`\n * and similar surfaces. Headless about layout direction (parent group\n * supplies flex direction via `ToolGroup`). Theme via `--wzl-*` tokens.\n */\nexport function ToolButton(props: ToolButtonProps) {\n  const { icon, label, shortcut, active, disabled, ariaDisabled, tabbable, onClick, title, className } = props;\n  const resolvedTitle = title ?? (shortcut ? `${label} (${shortcut})` : label);\n  const cls = [s.button, active && s.active, className].filter(Boolean).join(' ');\n  return (\n    <TooltipTrigger isDisabled={disabled}>\n      <Focusable isDisabled={disabled}>\n        <button\n          type=\"button\"\n          tabIndex={tabbable ? 0 : -1}\n          className={cls}\n          aria-current={active ? 'true' : undefined}\n          aria-disabled={ariaDisabled ? 'true' : undefined}\n          disabled={disabled}\n          onClick={onClick}\n        >\n          <span className={s.icon} aria-hidden=\"true\">{icon}</span>\n          <span className={s.label}>{label}</span>\n          {shortcut && <span className={s.shortcut}>{shortcut}</span>}\n        </button>\n      </Focusable>\n      <Tooltip>{resolvedTitle}</Tooltip>\n    </TooltipTrigger>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AC4CA,SAAgB,EAAW,GAAwB;CACjD,IAAM,EAAE,SAAM,UAAO,aAAU,WAAQ,aAAU,iBAAc,aAAU,YAAS,UAAO,iBAAc,GACjG,IAAgB,MAAU,IAAW,GAAG,EAAM,IAAI,EAAS,KAAK,IAChE,IAAM;EAAC,EAAE;EAAQ,KAAU,EAAE;EAAQ;EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;CAC/E,OACE,kBAAC,GAAD;EAAgB,YAAY;YAA5B,CACE,kBAAC,GAAD;GAAW,YAAY;aACrB,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,IAAW,IAAI;IACzB,WAAW;IACX,gBAAc,IAAS,SAAS,KAAA;IAChC,iBAAe,IAAe,SAAS,KAAA;IAC7B;IACD;cAPX;KASE,kBAAC,QAAD;MAAM,WAAW,EAAE;MAAM,eAAY;gBAAQ;MAAY,CAAA;KACzD,kBAAC,QAAD;MAAM,WAAW,EAAE;gBAAQ;MAAa,CAAA;KACvC,KAAY,kBAAC,QAAD;MAAM,WAAW,EAAE;gBAAW;MAAgB,CAAA;KACpD;;GACC,CAAA,EACZ,kBAAC,GAAD,EAAA,UAAU,GAAwB,CAAA,CACnB"}
+{"version":3,"file":"ToolButton-Dv6NdZKh.js","names":[],"sources":["../../src/components/ToolButton/ToolButton.module.css","../../src/components/ToolButton/ToolButton.tsx"],"sourcesContent":[".button {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 2px;\n  min-width: 44px;\n  padding: 6px 4px;\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: 3px;\n  color: var(--wzl-text);\n  cursor: default;\n  font-family: inherit;\n  font-size: 10px;\n  line-height: 1.1;\n}\n.button:hover:not([disabled]) {\n  background: var(--wzl-button-fill-hover);\n  color: var(--wzl-button-text);\n}\n.button:focus-visible {\n  outline: 2px solid var(--wzl-accent);\n  outline-offset: -2px;\n}\n.button.active {\n  background: var(--wzl-button-fill-pressed);\n  border-color: var(--wzl-accent);\n  color: var(--wzl-button-text);\n}\n.button[disabled] {\n  opacity: 0.4;\n}\n\n.icon { display: block; }\n.icon > svg { display: block; }\n.label { font-size: 10px; }\n.shortcut {\n  color: var(--wzl-text-muted);\n  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n  font-size: 9px;\n}\n","import type { ReactNode } from 'react';\nimport { Focusable } from 'react-aria-components';\nimport { Tooltip, TooltipTrigger } from '../Tooltip';\nimport s from './ToolButton.module.css';\n\nexport interface ToolButtonProps {\n  /** Icon node (typically an SVG component). */\n  icon: ReactNode;\n  /** Human-readable label shown under the icon. */\n  label: string;\n  /** Optional shortcut hint (e.g. \"V\" or \"⌘Z\"). */\n  shortcut?: string;\n  /** Selected/active state — toggles the active visual treatment. */\n  active?: boolean;\n  /** Disabled state — passes through to the underlying button. */\n  disabled?: boolean;\n  /**\n   * When true, sets `aria-disabled=\"true\"` on the button without using the\n   * native `disabled` attribute. This keeps the button focusable and reachable\n   * by keyboard (roving-tabindex still applies) while marking it as ineligible\n   * to screen readers. The caller is responsible for making `onClick` a no-op.\n   */\n  ariaDisabled?: boolean;\n  /**\n   * Whether this button is the currently tabbable member of its toolbar.\n   * Toolbars use roving tabindex: exactly one button has `tabIndex=0` at\n   * a time; the rest are `-1`. Caller manages which.\n   */\n  tabbable?: boolean;\n  /** Click handler. */\n  onClick(): void;\n  /**\n   * Tooltip content. Defaults to `label` (plus `shortcut` if provided).\n   */\n  title?: string;\n  /** Additional class for the root button. */\n  className?: string;\n}\n\n/**\n * Generic icon-+-label toolbar button — building block for `ToolPalette`\n * and similar surfaces. Headless about layout direction (parent group\n * supplies flex direction via `ToolGroup`). Theme via `--wzl-*` tokens.\n */\nexport function ToolButton(props: ToolButtonProps) {\n  const { icon, label, shortcut, active, disabled, ariaDisabled, tabbable, onClick, title, className } = props;\n  const resolvedTitle = title ?? (shortcut ? `${label} (${shortcut})` : label);\n  const cls = [s.button, active && s.active, className].filter(Boolean).join(' ');\n  return (\n    <TooltipTrigger isDisabled={disabled}>\n      <Focusable isDisabled={disabled}>\n        <button\n          type=\"button\"\n          tabIndex={tabbable ? 0 : -1}\n          className={cls}\n          aria-current={active ? 'true' : undefined}\n          aria-disabled={ariaDisabled ? 'true' : undefined}\n          disabled={disabled}\n          onClick={onClick}\n        >\n          <span className={s.icon} aria-hidden=\"true\">{icon}</span>\n          <span className={s.label}>{label}</span>\n          {shortcut && <span className={s.shortcut}>{shortcut}</span>}\n        </button>\n      </Focusable>\n      <Tooltip>{resolvedTitle}</Tooltip>\n    </TooltipTrigger>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AC4CA,SAAgB,EAAW,GAAwB;CACjD,IAAM,EAAE,SAAM,UAAO,aAAU,WAAQ,aAAU,iBAAc,aAAU,YAAS,UAAO,iBAAc,GACjG,IAAgB,MAAU,IAAW,GAAG,EAAM,IAAI,EAAS,KAAK,IAChE,IAAM;EAAC,EAAE;EAAQ,KAAU,EAAE;EAAQ;EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;AAC/E,QACE,kBAAC,GAAD;EAAgB,YAAY;YAA5B,CACE,kBAAC,GAAD;GAAW,YAAY;aACrB,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,IAAW,IAAI;IACzB,WAAW;IACX,gBAAc,IAAS,SAAS,KAAA;IAChC,iBAAe,IAAe,SAAS,KAAA;IAC7B;IACD;cAPX;KASE,kBAAC,QAAD;MAAM,WAAW,EAAE;MAAM,eAAY;gBAAQ;MAAY,CAAA;KACzD,kBAAC,QAAD;MAAM,WAAW,EAAE;gBAAQ;MAAa,CAAA;KACvC,KAAY,kBAAC,QAAD;MAAM,WAAW,EAAE;gBAAW;MAAgB,CAAA;KACpD;;GACC,CAAA,EACZ,kBAAC,GAAD,EAAA,UAAU,GAAwB,CAAA,CACnB"}

package/dist/chunks/{ToolGroup-D8-qdtuw.js → ToolGroup-BAthcF5H.js}

@@ -22,4 +22,4 @@ function n(n) {
 //#endregion
 export { n as t };
 
-//# sourceMappingURL=ToolGroup-D8-qdtuw.js.map
+//# sourceMappingURL=ToolGroup-BAthcF5H.js.map

package/dist/chunks/{ToolGroup-D8-qdtuw.js.map → ToolGroup-BAthcF5H.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ToolGroup-D8-qdtuw.js","names":[],"sources":["../../src/components/ToolGroup/ToolGroup.module.css","../../src/components/ToolGroup/ToolGroup.tsx"],"sourcesContent":[".group {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n.group.horizontal {\n  flex-direction: row;\n}\n","import type { ReactNode } from 'react';\nimport s from './ToolGroup.module.css';\n\nexport interface ToolGroupProps {\n  children: ReactNode;\n  /**\n   * Lays children along an axis. `'vertical'` (default) stacks them in\n   * a column; `'horizontal'` lays them in a row. Independent of the\n   * parent toolbar's own orientation.\n   */\n  orientation?: 'vertical' | 'horizontal';\n  /**\n   * Optional `data-group` attribute — useful for parents that want to\n   * select the group from CSS or tests by name.\n   */\n  groupKey?: string;\n  /** Accessible name for the group (rendered as `aria-label`). */\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * Generic toolbar group — a `role=\"group\"` flex container that arranges\n * `<ToolButton>`s (or any children) along a chosen axis. No visual chrome\n * beyond layout; theming lives on the buttons.\n */\nexport function ToolGroup(props: ToolGroupProps) {\n  const { children, orientation = 'vertical', groupKey, ariaLabel, className } = props;\n  const cls = [s.group, orientation === 'horizontal' && s.horizontal, className]\n    .filter(Boolean).join(' ');\n  return (\n    <div className={cls} role=\"group\" data-group={groupKey} aria-label={ariaLabel}>\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AC0BA,SAAgB,EAAU,GAAuB;CAC/C,IAAM,EAAE,aAAU,iBAAc,YAAY,aAAU,cAAW,iBAAc;CAG/E,OACE,kBAAC,OAAD;EAAK,WAHK;GAAC,EAAE;GAAO,MAAgB,gBAAgB,EAAE;GAAY;GAAU,CAC3E,OAAO,QAAQ,CAAC,KAAK,IAEN;EAAK,MAAK;EAAQ,cAAY;EAAU,cAAY;EACjE;EACG,CAAA"}
+{"version":3,"file":"ToolGroup-BAthcF5H.js","names":[],"sources":["../../src/components/ToolGroup/ToolGroup.module.css","../../src/components/ToolGroup/ToolGroup.tsx"],"sourcesContent":[".group {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n.group.horizontal {\n  flex-direction: row;\n}\n","import type { ReactNode } from 'react';\nimport s from './ToolGroup.module.css';\n\nexport interface ToolGroupProps {\n  children: ReactNode;\n  /**\n   * Lays children along an axis. `'vertical'` (default) stacks them in\n   * a column; `'horizontal'` lays them in a row. Independent of the\n   * parent toolbar's own orientation.\n   */\n  orientation?: 'vertical' | 'horizontal';\n  /**\n   * Optional `data-group` attribute — useful for parents that want to\n   * select the group from CSS or tests by name.\n   */\n  groupKey?: string;\n  /** Accessible name for the group (rendered as `aria-label`). */\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * Generic toolbar group — a `role=\"group\"` flex container that arranges\n * `<ToolButton>`s (or any children) along a chosen axis. No visual chrome\n * beyond layout; theming lives on the buttons.\n */\nexport function ToolGroup(props: ToolGroupProps) {\n  const { children, orientation = 'vertical', groupKey, ariaLabel, className } = props;\n  const cls = [s.group, orientation === 'horizontal' && s.horizontal, className]\n    .filter(Boolean).join(' ');\n  return (\n    <div className={cls} role=\"group\" data-group={groupKey} aria-label={ariaLabel}>\n      {children}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AC0BA,SAAgB,EAAU,GAAuB;CAC/C,IAAM,EAAE,aAAU,iBAAc,YAAY,aAAU,cAAW,iBAAc;AAG/E,QACE,kBAAC,OAAD;EAAK,WAHK;GAAC,EAAE;GAAO,MAAgB,gBAAgB,EAAE;GAAY;GAAU,CAC3E,OAAO,QAAQ,CAAC,KAAK,IAEN;EAAK,MAAK;EAAQ,cAAY;EAAU,cAAY;EACjE;EACG,CAAA"}

package/dist/chunks/ToolOptionsBar-ChiL-HVA.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolOptionsBar-ChiL-HVA.js","names":[],"sources":["../../src/components/ToolOptionsBar/ToolOptionsBar.module.css","../../src/components/ToolOptionsBar/ToolOptionsBar.tsx"],"sourcesContent":["/* Horizontal strip reserved above the workspace for contextual tool\n   options. Fixed height so mounting/unmounting content never resizes\n   the workspace beneath it — that's the whole reason this row exists\n   as permanent chrome rather than an on-demand overlay.\n\n   Overflow: when controls exceed the available width, `.controls`\n   scrolls horizontally rather than wrapping (which would grow the row\n   and defeat the fixed-height guarantee above) or clipping (which\n   would hide controls with no way to reach them). A flyout/long-press\n   affordance was considered and rejected — grouped, directly visible\n   layouts are preferred in this repo. */\n\n.root {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  height: var(--wzl-tb-height, 28px);\n  padding: 0 8px;\n  background: var(--wzl-panel-bg);\n  border-bottom: 1px solid var(--wzl-panel-border);\n  color: var(--wzl-text);\n  overflow: hidden;\n}\n\n.label {\n  flex: 0 0 auto;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--wzl-text-muted);\n  white-space: nowrap;\n}\n\n.controls {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  flex: 1 1 auto;\n  min-width: 0;\n  height: 100%;\n  overflow-x: auto;\n  overflow-y: hidden;\n  scrollbar-width: thin;\n}\n\n/* Firefox gets a thin scrollbar for free via `scrollbar-width` above.\n * Chromium/WebKit need it spelled out — on a classic (non-overlay)\n * scrollbar theme (default on Windows Chrome/Edge), an unstyled\n * horizontal scrollbar is ~15-17px tall and renders *inside* this box,\n * clipping/off-centering the row's controls. That would reintroduce the\n * exact height instability the scroll-over-wrap overflow choice above\n * exists to avoid — just at the row's inner edge instead of its outer\n * one. Pin it thin and out of the way instead. */\n.controls::-webkit-scrollbar {\n  height: 4px;\n}\n.controls::-webkit-scrollbar-track {\n  background: transparent;\n}\n.controls::-webkit-scrollbar-thumb {\n  background: var(--wzl-panel-border);\n  border-radius: 2px;\n}\n","import type { ReactNode } from 'react';\nimport s from './ToolOptionsBar.module.css';\n\nexport interface ToolOptionsBarProps {\n  /**\n   * Context label for the row — e.g. the active tool's name. Rendered\n   * before the children and doubles as the toolbar's `aria-label`. Omit\n   * it and the row still renders (it's a permanently reserved slot), just\n   * without an accessible name.\n   *\n   * Using `label` for both the visible text and `aria-label` means a\n   * screen reader announces it twice when landing on the toolbar (\"Text,\n   * toolbar\", then \"Text\" again when browsing into the visible span).\n   * `aria-labelledby` would avoid the echo at the cost of id plumbing and\n   * an awkward no-`id`-to-point-at case when `label` is omitted. The\n   * double-announcement is common enough for labelled landmark regions\n   * that it's left as-is — considered, not missed.\n   */\n  label?: string;\n  children?: ReactNode;\n  className?: string;\n}\n\n/**\n * Horizontal strip reserved above the workspace for contextual tool\n * options — its first tenant is the character controls a text tool\n * exposes while a caret range is active. Pure chrome: it renders an\n * optional label and a children slot, nothing else. It knows nothing\n * about text, or about any specific tool — any tool can fill it.\n *\n * The row always renders, even with no `label` and no `children`,\n * because the app reserves its height permanently rather than mounting\n * it on demand — mounting mid-edit would resize the workspace under a\n * canvas that's sized to the page.\n *\n * `role=\"toolbar\"` without roving tabindex: the ARIA authoring practices\n * expect arrow-key roving focus across a toolbar's items, but this\n * component doesn't own or know the shape of its children — they're\n * arbitrary, possibly compound controls (`NumberField`, `Select`,\n * `ColorField`) that already use arrow keys for their own value editing.\n * Imposing roving focus here would fight those controls' own key\n * handling. Tab order falls back to normal DOM order for now; revisit\n * once the first tenant's control set is concrete and a roving-focus\n * contract can be designed in coordination with those controls.\n */\nexport function ToolOptionsBar(props: ToolOptionsBarProps) {\n  const { label, children, className } = props;\n  const cls = [s.root, className].filter(Boolean).join(' ');\n  return (\n    <div className={cls} role=\"toolbar\" aria-label={label}>\n      {label !== undefined && <span className={s.label}>{label}</span>}\n      <div className={s.controls}>{children}</div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AC6CA,SAAgB,EAAe,GAA4B;CACzD,IAAM,EAAE,UAAO,aAAU,iBAAc;CAEvC,OACE,kBAAC,OAAD;EAAK,WAFK,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAEnC;EAAK,MAAK;EAAU,cAAY;YAAhD,CACG,MAAU,KAAA,KAAa,kBAAC,QAAD;GAAM,WAAW,EAAE;aAAQ;GAAa,CAAA,EAChE,kBAAC,OAAD;GAAK,WAAW,EAAE;GAAW;GAAe,CAAA,CACxC"}
+{"version":3,"file":"ToolOptionsBar-ChiL-HVA.js","names":[],"sources":["../../src/components/ToolOptionsBar/ToolOptionsBar.module.css","../../src/components/ToolOptionsBar/ToolOptionsBar.tsx"],"sourcesContent":["/* Horizontal strip reserved above the workspace for contextual tool\n   options. Fixed height so mounting/unmounting content never resizes\n   the workspace beneath it — that's the whole reason this row exists\n   as permanent chrome rather than an on-demand overlay.\n\n   Overflow: when controls exceed the available width, `.controls`\n   scrolls horizontally rather than wrapping (which would grow the row\n   and defeat the fixed-height guarantee above) or clipping (which\n   would hide controls with no way to reach them). A flyout/long-press\n   affordance was considered and rejected — grouped, directly visible\n   layouts are preferred in this repo. */\n\n.root {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  height: var(--wzl-tb-height, 28px);\n  padding: 0 8px;\n  background: var(--wzl-panel-bg);\n  border-bottom: 1px solid var(--wzl-panel-border);\n  color: var(--wzl-text);\n  overflow: hidden;\n}\n\n.label {\n  flex: 0 0 auto;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--wzl-text-muted);\n  white-space: nowrap;\n}\n\n.controls {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  flex: 1 1 auto;\n  min-width: 0;\n  height: 100%;\n  overflow-x: auto;\n  overflow-y: hidden;\n  scrollbar-width: thin;\n}\n\n/* Firefox gets a thin scrollbar for free via `scrollbar-width` above.\n * Chromium/WebKit need it spelled out — on a classic (non-overlay)\n * scrollbar theme (default on Windows Chrome/Edge), an unstyled\n * horizontal scrollbar is ~15-17px tall and renders *inside* this box,\n * clipping/off-centering the row's controls. That would reintroduce the\n * exact height instability the scroll-over-wrap overflow choice above\n * exists to avoid — just at the row's inner edge instead of its outer\n * one. Pin it thin and out of the way instead. */\n.controls::-webkit-scrollbar {\n  height: 4px;\n}\n.controls::-webkit-scrollbar-track {\n  background: transparent;\n}\n.controls::-webkit-scrollbar-thumb {\n  background: var(--wzl-panel-border);\n  border-radius: 2px;\n}\n","import type { ReactNode } from 'react';\nimport s from './ToolOptionsBar.module.css';\n\nexport interface ToolOptionsBarProps {\n  /**\n   * Context label for the row — e.g. the active tool's name. Rendered\n   * before the children and doubles as the toolbar's `aria-label`. Omit\n   * it and the row still renders (it's a permanently reserved slot), just\n   * without an accessible name.\n   *\n   * Using `label` for both the visible text and `aria-label` means a\n   * screen reader announces it twice when landing on the toolbar (\"Text,\n   * toolbar\", then \"Text\" again when browsing into the visible span).\n   * `aria-labelledby` would avoid the echo at the cost of id plumbing and\n   * an awkward no-`id`-to-point-at case when `label` is omitted. The\n   * double-announcement is common enough for labelled landmark regions\n   * that it's left as-is — considered, not missed.\n   */\n  label?: string;\n  children?: ReactNode;\n  className?: string;\n}\n\n/**\n * Horizontal strip reserved above the workspace for contextual tool\n * options — its first tenant is the character controls a text tool\n * exposes while a caret range is active. Pure chrome: it renders an\n * optional label and a children slot, nothing else. It knows nothing\n * about text, or about any specific tool — any tool can fill it.\n *\n * The row always renders, even with no `label` and no `children`,\n * because the app reserves its height permanently rather than mounting\n * it on demand — mounting mid-edit would resize the workspace under a\n * canvas that's sized to the page.\n *\n * `role=\"toolbar\"` without roving tabindex: the ARIA authoring practices\n * expect arrow-key roving focus across a toolbar's items, but this\n * component doesn't own or know the shape of its children — they're\n * arbitrary, possibly compound controls (`NumberField`, `Select`,\n * `ColorField`) that already use arrow keys for their own value editing.\n * Imposing roving focus here would fight those controls' own key\n * handling. Tab order falls back to normal DOM order for now; revisit\n * once the first tenant's control set is concrete and a roving-focus\n * contract can be designed in coordination with those controls.\n */\nexport function ToolOptionsBar(props: ToolOptionsBarProps) {\n  const { label, children, className } = props;\n  const cls = [s.root, className].filter(Boolean).join(' ');\n  return (\n    <div className={cls} role=\"toolbar\" aria-label={label}>\n      {label !== undefined && <span className={s.label}>{label}</span>}\n      <div className={s.controls}>{children}</div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AC6CA,SAAgB,EAAe,GAA4B;CACzD,IAAM,EAAE,UAAO,aAAU,iBAAc;AAEvC,QACE,kBAAC,OAAD;EAAK,WAFK,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAEnC;EAAK,MAAK;EAAU,cAAY;YAAhD,CACG,MAAU,KAAA,KAAa,kBAAC,QAAD;GAAM,WAAW,EAAE;aAAQ;GAAa,CAAA,EAChE,kBAAC,OAAD;GAAK,WAAW,EAAE;GAAW;GAAe,CAAA,CACxC"}

package/dist/chunks/{ToolPalette-xKHzPKYf.js → ToolPalette-DXVIEO0w.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./keyGlyph-BDH5fqkO.js";
-import { t } from "./ToolButton-Dk_uJf7N.js";
-import { t as n } from "./ToolGroup-D8-qdtuw.js";
+import { t } from "./ToolButton-Dv6NdZKh.js";
+import { t as n } from "./ToolGroup-BAthcF5H.js";
 import { Fragment as r, useRef as i } from "react";
 import { UnknownIcon as a } from "@weasel-js/core";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
@@ -114,4 +114,4 @@ function _(e) {
 //#endregion
 export { d as n, u as r, _ as t };
 
-//# sourceMappingURL=ToolPalette-xKHzPKYf.js.map
+//# sourceMappingURL=ToolPalette-DXVIEO0w.js.map

package/dist/chunks/{ToolPalette-xKHzPKYf.js.map → ToolPalette-DXVIEO0w.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ToolPalette-xKHzPKYf.js","names":[],"sources":["../../src/components/ToolPalette/ToolPalette.module.css","../../src/components/ToolPalette/formatShortcut.ts","../../src/components/ToolPalette/ToolPalette.tsx"],"sourcesContent":[".palette {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  background: var(--wzl-panel-bg);\n  border: 1px solid var(--wzl-panel-border);\n  border-radius: 4px;\n  padding: 4px;\n  user-select: none;\n}\n.palette.horizontal {\n  flex-direction: row;\n}\n\n/* Applied to ineligible tool buttons in the active mode. */\n.ineligibleBtn {\n  opacity: 0.35;\n  cursor: not-allowed;\n}\n\n.separator {\n  background: var(--wzl-panel-border);\n}\n.palette:not(.horizontal) .separator {\n  height: 1px;\n  margin: 2px 0;\n}\n.palette.horizontal .separator {\n  width: 1px;\n  margin: 0 2px;\n}\n","import { keyGlyph } from '../Keycaps/keyGlyph';\n\nexport interface ShortcutInput {\n  key: string | readonly string[];\n  mod?: boolean;\n  alt?: boolean;\n  shift?: boolean | 'optional';\n}\n\n/** Format a shortcut as an array of display chips, one per key — modifier\n *  icons (⌘, ↑, ⌥) followed by the key glyph. UIs that want a boxed\n *  per-key look render each chip in its own element. `shift: 'optional'` is\n *  treated as falsy. */\nexport function formatShortcutParts(b: ShortcutInput | undefined): readonly string[] | undefined {\n  if (!b) return undefined;\n  const rawKey = Array.isArray(b.key) ? b.key[0] : (b.key as string);\n  const parts: string[] = [];\n  if (b.mod) parts.push('⌘');\n  if (b.shift === true) parts.push('⇧');\n  if (b.alt) parts.push('⌥');\n  parts.push(keyGlyph(rawKey));\n  return parts;\n}\n\n/** Format a shortcut as a single display string. Order: mod, shift, alt,\n *  key. Returns `undefined` for `undefined` input so callers can `??` a\n *  fallback. When `key` is an array, the first element is used. `shift: 'optional'`\n *  is treated as falsy. */\nexport function formatShortcut(b: ShortcutInput | undefined): string | undefined {\n  const parts = formatShortcutParts(b);\n  return parts ? parts.join('') : undefined;\n}\n","import { Fragment, useRef, type ReactNode } from 'react';\nimport { UnknownIcon } from '@weasel-js/core';\nimport type { AnyTool, ToolsApi } from '@weasel-js/core';\nimport { eligibleTool, type ModeRegistry } from '@weasel-js/modes';\nimport { ToolButton } from '../ToolButton';\nimport { ToolGroup } from '../ToolGroup';\nimport s from './ToolPalette.module.css';\nimport { formatShortcut, type ShortcutInput } from './formatShortcut';\n\nconst DEFAULT_GROUP_ORDER = ['select', 'shape', 'draw', 'type', 'view'] as const;\nconst MISC = 'misc';\n\nfunction partitionByGroup(list: AnyTool[]): Map<string, AnyTool[]> {\n  const groups = new Map<string, AnyTool[]>();\n  for (const tool of list) {\n    const g = tool.presentation?.group ?? MISC;\n    const bucket = groups.get(g) ?? [];\n    bucket.push(tool);\n    groups.set(g, bucket);\n  }\n  return groups;\n}\n\nfunction orderedGroupKeys(\n  groups: Map<string, AnyTool[]>,\n  groupOrder: readonly string[],\n): string[] {\n  const seen = new Set(groups.keys());\n  const ordered: string[] = [];\n  for (const known of groupOrder) {\n    if (seen.has(known)) {\n      ordered.push(known);\n      seen.delete(known);\n    }\n  }\n  // Unknown groups in insertion order (Map preserves it), misc last.\n  for (const key of groups.keys()) {\n    if (seen.has(key) && key !== MISC) {\n      ordered.push(key);\n      seen.delete(key);\n    }\n  }\n  if (seen.has(MISC)) ordered.push(MISC);\n  return ordered;\n}\n\nfunction resolveIcon(tool: AnyTool): ReactNode {\n  const rawIcon = tool.presentation?.icon;\n  if (rawIcon == null) return <UnknownIcon />;\n  if (typeof rawIcon === 'function') return rawIcon(undefined);\n  return rawIcon;\n}\n\nexport interface ToolPaletteProps {\n  tools: ToolsApi;\n  orientation?: 'vertical' | 'horizontal';\n  className?: string;\n  /** Derive the keyboard shortcut for a tool button from the action registry.\n   *  Called with the tool's id; return `undefined` to suppress a chip. When\n   *  omitted, falls back to `tool.keybinding` (legacy path). */\n  lookupShortcut?: (toolId: string) => ShortcutInput | undefined;\n  /**\n   * Optional mode registry. When provided, tools whose `capabilities` do not\n   * match the current mode are rendered greyed-out, aria-disabled, and their\n   * onClick is suppressed. When omitted, all tools are treated as eligible\n   * (preserves existing behaviour in consumers that haven't wired a registry).\n   */\n  modeRegistry?: ModeRegistry;\n  /**\n   * Presentation-group display order. Groups not listed keep their registry\n   * insertion order after the listed ones; `misc` always renders last.\n   * Defaults to `['select', 'shape', 'draw', 'type', 'view']`.\n   */\n  groupOrder?: readonly string[];\n}\n\nexport function ToolPalette(props: ToolPaletteProps) {\n  const {\n    tools, orientation = 'vertical', className, lookupShortcut, modeRegistry,\n    groupOrder = DEFAULT_GROUP_ORDER,\n  } = props;\n  const list = Object.values(tools.registry);\n  const groups = partitionByGroup(list);\n  const groupKeys = orderedGroupKeys(groups, groupOrder);\n  const cls = [s.palette, orientation === 'horizontal' && s.horizontal, className]\n    .filter(Boolean).join(' ');\n\n  const orderedIds = groupKeys.flatMap((k) => groups.get(k)!.map((t) => t.id));\n  const tabbableId = tools.active && orderedIds.includes(tools.active)\n    ? tools.active\n    : orderedIds[0];\n  const rootRef = useRef<HTMLDivElement | null>(null);\n\n  function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n    const target = e.target as HTMLElement;\n    if (target.tagName !== 'BUTTON') return;\n    const root = rootRef.current;\n    if (!root) return;\n    const buttons = Array.from(root.querySelectorAll<HTMLButtonElement>('button'));\n    const i = buttons.indexOf(target as HTMLButtonElement);\n    if (i < 0) return;\n\n    let next = -1;\n    switch (e.key) {\n      case 'ArrowDown':\n      case 'ArrowRight':\n        next = (i + 1) % buttons.length;\n        break;\n      case 'ArrowUp':\n      case 'ArrowLeft':\n        next = (i - 1 + buttons.length) % buttons.length;\n        break;\n      case 'Home':\n        next = 0;\n        break;\n      case 'End':\n        next = buttons.length - 1;\n        break;\n    }\n    if (next >= 0) {\n      e.preventDefault();\n      buttons[next].focus();\n    }\n  }\n\n  return (\n    <div\n      ref={rootRef}\n      className={cls}\n      role=\"toolbar\"\n      aria-label=\"Tools\"\n      onKeyDown={onKeyDown}\n    >\n      {groupKeys.map((key, i) => (\n        <Fragment key={key}>\n          {i > 0 && (\n            <div\n              className={s.separator}\n              role=\"separator\"\n              aria-orientation={orientation === 'horizontal' ? 'vertical' : 'horizontal'}\n            />\n          )}\n          <ToolGroup orientation={orientation} groupKey={key}>\n            {groups.get(key)!.map((tool) => {\n              const label = tool.presentation?.label ?? tool.id;\n              const shortcut = tool.presentation?.shortcut\n                ?? formatShortcut(lookupShortcut ? lookupShortcut(tool.id) : tool.keybinding);\n              const enabled = modeRegistry ? eligibleTool(modeRegistry, tool) : true;\n              const modeName = modeRegistry ? modeRegistry.current().id : undefined;\n              const resolvedTitle = !enabled && modeName\n                ? `${label}${shortcut ? ` (${shortcut})` : ''} — disabled in ${modeName} mode`\n                : undefined;\n              return (\n                <ToolButton\n                  key={tool.id}\n                  icon={resolveIcon(tool)}\n                  label={label}\n                  shortcut={shortcut}\n                  active={tools.active === tool.id}\n                  tabbable={tool.id === tabbableId}\n                  ariaDisabled={!enabled}\n                  className={!enabled ? s.ineligibleBtn : undefined}\n                  title={resolvedTitle}\n                  onClick={enabled ? () => tools.setActive(tool.id) : () => {}}\n                />\n              );\n            })}\n          </ToolGroup>\n        </Fragment>\n      ))}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ToolPalette-DXVIEO0w.js","names":[],"sources":["../../src/components/ToolPalette/ToolPalette.module.css","../../src/components/ToolPalette/formatShortcut.ts","../../src/components/ToolPalette/ToolPalette.tsx"],"sourcesContent":[".palette {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  background: var(--wzl-panel-bg);\n  border: 1px solid var(--wzl-panel-border);\n  border-radius: 4px;\n  padding: 4px;\n  user-select: none;\n}\n.palette.horizontal {\n  flex-direction: row;\n}\n\n/* Applied to ineligible tool buttons in the active mode. */\n.ineligibleBtn {\n  opacity: 0.35;\n  cursor: not-allowed;\n}\n\n.separator {\n  background: var(--wzl-panel-border);\n}\n.palette:not(.horizontal) .separator {\n  height: 1px;\n  margin: 2px 0;\n}\n.palette.horizontal .separator {\n  width: 1px;\n  margin: 0 2px;\n}\n","import { keyGlyph } from '../Keycaps/keyGlyph';\n\nexport interface ShortcutInput {\n  key: string | readonly string[];\n  mod?: boolean;\n  alt?: boolean;\n  shift?: boolean | 'optional';\n}\n\n/** Format a shortcut as an array of display chips, one per key — modifier\n *  icons (⌘, ↑, ⌥) followed by the key glyph. UIs that want a boxed\n *  per-key look render each chip in its own element. `shift: 'optional'` is\n *  treated as falsy. */\nexport function formatShortcutParts(b: ShortcutInput | undefined): readonly string[] | undefined {\n  if (!b) return undefined;\n  const rawKey = Array.isArray(b.key) ? b.key[0] : (b.key as string);\n  const parts: string[] = [];\n  if (b.mod) parts.push('⌘');\n  if (b.shift === true) parts.push('⇧');\n  if (b.alt) parts.push('⌥');\n  parts.push(keyGlyph(rawKey));\n  return parts;\n}\n\n/** Format a shortcut as a single display string. Order: mod, shift, alt,\n *  key. Returns `undefined` for `undefined` input so callers can `??` a\n *  fallback. When `key` is an array, the first element is used. `shift: 'optional'`\n *  is treated as falsy. */\nexport function formatShortcut(b: ShortcutInput | undefined): string | undefined {\n  const parts = formatShortcutParts(b);\n  return parts ? parts.join('') : undefined;\n}\n","import { Fragment, useRef, type ReactNode } from 'react';\nimport { UnknownIcon } from '@weasel-js/core';\nimport type { AnyTool, ToolsApi } from '@weasel-js/core';\nimport { eligibleTool, type ModeRegistry } from '@weasel-js/modes';\nimport { ToolButton } from '../ToolButton';\nimport { ToolGroup } from '../ToolGroup';\nimport s from './ToolPalette.module.css';\nimport { formatShortcut, type ShortcutInput } from './formatShortcut';\n\nconst DEFAULT_GROUP_ORDER = ['select', 'shape', 'draw', 'type', 'view'] as const;\nconst MISC = 'misc';\n\nfunction partitionByGroup(list: AnyTool[]): Map<string, AnyTool[]> {\n  const groups = new Map<string, AnyTool[]>();\n  for (const tool of list) {\n    const g = tool.presentation?.group ?? MISC;\n    const bucket = groups.get(g) ?? [];\n    bucket.push(tool);\n    groups.set(g, bucket);\n  }\n  return groups;\n}\n\nfunction orderedGroupKeys(\n  groups: Map<string, AnyTool[]>,\n  groupOrder: readonly string[],\n): string[] {\n  const seen = new Set(groups.keys());\n  const ordered: string[] = [];\n  for (const known of groupOrder) {\n    if (seen.has(known)) {\n      ordered.push(known);\n      seen.delete(known);\n    }\n  }\n  // Unknown groups in insertion order (Map preserves it), misc last.\n  for (const key of groups.keys()) {\n    if (seen.has(key) && key !== MISC) {\n      ordered.push(key);\n      seen.delete(key);\n    }\n  }\n  if (seen.has(MISC)) ordered.push(MISC);\n  return ordered;\n}\n\nfunction resolveIcon(tool: AnyTool): ReactNode {\n  const rawIcon = tool.presentation?.icon;\n  if (rawIcon == null) return <UnknownIcon />;\n  if (typeof rawIcon === 'function') return rawIcon(undefined);\n  return rawIcon;\n}\n\nexport interface ToolPaletteProps {\n  tools: ToolsApi;\n  orientation?: 'vertical' | 'horizontal';\n  className?: string;\n  /** Derive the keyboard shortcut for a tool button from the action registry.\n   *  Called with the tool's id; return `undefined` to suppress a chip. When\n   *  omitted, falls back to `tool.keybinding` (legacy path). */\n  lookupShortcut?: (toolId: string) => ShortcutInput | undefined;\n  /**\n   * Optional mode registry. When provided, tools whose `capabilities` do not\n   * match the current mode are rendered greyed-out, aria-disabled, and their\n   * onClick is suppressed. When omitted, all tools are treated as eligible\n   * (preserves existing behaviour in consumers that haven't wired a registry).\n   */\n  modeRegistry?: ModeRegistry;\n  /**\n   * Presentation-group display order. Groups not listed keep their registry\n   * insertion order after the listed ones; `misc` always renders last.\n   * Defaults to `['select', 'shape', 'draw', 'type', 'view']`.\n   */\n  groupOrder?: readonly string[];\n}\n\nexport function ToolPalette(props: ToolPaletteProps) {\n  const {\n    tools, orientation = 'vertical', className, lookupShortcut, modeRegistry,\n    groupOrder = DEFAULT_GROUP_ORDER,\n  } = props;\n  const list = Object.values(tools.registry);\n  const groups = partitionByGroup(list);\n  const groupKeys = orderedGroupKeys(groups, groupOrder);\n  const cls = [s.palette, orientation === 'horizontal' && s.horizontal, className]\n    .filter(Boolean).join(' ');\n\n  const orderedIds = groupKeys.flatMap((k) => groups.get(k)!.map((t) => t.id));\n  const tabbableId = tools.active && orderedIds.includes(tools.active)\n    ? tools.active\n    : orderedIds[0];\n  const rootRef = useRef<HTMLDivElement | null>(null);\n\n  function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n    const target = e.target as HTMLElement;\n    if (target.tagName !== 'BUTTON') return;\n    const root = rootRef.current;\n    if (!root) return;\n    const buttons = Array.from(root.querySelectorAll<HTMLButtonElement>('button'));\n    const i = buttons.indexOf(target as HTMLButtonElement);\n    if (i < 0) return;\n\n    let next = -1;\n    switch (e.key) {\n      case 'ArrowDown':\n      case 'ArrowRight':\n        next = (i + 1) % buttons.length;\n        break;\n      case 'ArrowUp':\n      case 'ArrowLeft':\n        next = (i - 1 + buttons.length) % buttons.length;\n        break;\n      case 'Home':\n        next = 0;\n        break;\n      case 'End':\n        next = buttons.length - 1;\n        break;\n    }\n    if (next >= 0) {\n      e.preventDefault();\n      buttons[next].focus();\n    }\n  }\n\n  return (\n    <div\n      ref={rootRef}\n      className={cls}\n      role=\"toolbar\"\n      aria-label=\"Tools\"\n      onKeyDown={onKeyDown}\n    >\n      {groupKeys.map((key, i) => (\n        <Fragment key={key}>\n          {i > 0 && (\n            <div\n              className={s.separator}\n              role=\"separator\"\n              aria-orientation={orientation === 'horizontal' ? 'vertical' : 'horizontal'}\n            />\n          )}\n          <ToolGroup orientation={orientation} groupKey={key}>\n            {groups.get(key)!.map((tool) => {\n              const label = tool.presentation?.label ?? tool.id;\n              const shortcut = tool.presentation?.shortcut\n                ?? formatShortcut(lookupShortcut ? lookupShortcut(tool.id) : tool.keybinding);\n              const enabled = modeRegistry ? eligibleTool(modeRegistry, tool) : true;\n              const modeName = modeRegistry ? modeRegistry.current().id : undefined;\n              const resolvedTitle = !enabled && modeName\n                ? `${label}${shortcut ? ` (${shortcut})` : ''} — disabled in ${modeName} mode`\n                : undefined;\n              return (\n                <ToolButton\n                  key={tool.id}\n                  icon={resolveIcon(tool)}\n                  label={label}\n                  shortcut={shortcut}\n                  active={tools.active === tool.id}\n                  tabbable={tool.id === tabbableId}\n                  ariaDisabled={!enabled}\n                  className={!enabled ? s.ineligibleBtn : undefined}\n                  title={resolvedTitle}\n                  onClick={enabled ? () => tools.setActive(tool.id) : () => {}}\n                />\n              );\n            })}\n          </ToolGroup>\n        </Fragment>\n      ))}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/Tooltip-Clgn4trm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip-Clgn4trm.js","names":[],"sources":["../../src/components/Tooltip/Tooltip.module.css","../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":[".tooltip {\n  /* Above Dialog overlay (1000) and ToastRegion (1100) — RAC sets no z-index. */\n  z-index: 1200;\n  background: var(--wzl-surface);\n  border: 1px solid var(--wzl-border);\n  border-radius: var(--wzl-radius-sm);\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);\n  color: var(--wzl-fg);\n  font-family: var(--wzl-font-ui);\n  font-size: 12px;\n  line-height: 1.3;\n  padding: 4px 8px;\n  max-width: 260px;\n  transition: opacity var(--wzl-motion-fast);\n}\n\n.tooltip[data-entering],\n.tooltip[data-exiting] {\n  opacity: 0;\n}\n\n.arrow svg {\n  display: block;\n  fill: var(--wzl-surface);\n  stroke: var(--wzl-border);\n  stroke-width: 1;\n}\n\n.arrow[data-placement='bottom'] svg {\n  transform: rotate(180deg);\n}\n\n.arrow[data-placement='left'] svg {\n  transform: rotate(-90deg);\n}\n\n.arrow[data-placement='right'] svg {\n  transform: rotate(90deg);\n}\n","import type { ReactNode } from 'react';\nimport {\n  TooltipTrigger as RACTooltipTrigger,\n  Tooltip as RACTooltip,\n  OverlayArrow,\n  type TooltipProps as RACTooltipProps,\n  type TooltipTriggerComponentProps,\n} from 'react-aria-components';\nimport s from './Tooltip.module.css';\n\nexport type TooltipTriggerProps = TooltipTriggerComponentProps;\n\n/**\n * TooltipTrigger with kit defaults: ~600 ms open delay, instant close.\n * Wrap a focusable trigger plus a `<Tooltip>`. Non-RAC triggers (plain\n * `<button>` etc.) must be wrapped in `<Focusable>` from\n * react-aria-components so hover/focus props reach the DOM node.\n *\n * Caveat: while a tooltip is open, react-aria captures the first Escape\n * keydown (document-level, capture phase) to dismiss it — app-level\n * Escape handlers (deselect, cancel gesture) see only the second press.\n */\nexport function TooltipTrigger(props: TooltipTriggerProps) {\n  const { delay = 600, closeDelay = 0, ...rest } = props;\n  return <RACTooltipTrigger delay={delay} closeDelay={closeDelay} {...rest} />;\n}\n\nexport type TooltipProps = Omit<RACTooltipProps, 'children' | 'className'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\n/**\n * Tooltip bubble with an arrow pointing at the trigger. Non-interactive\n * content only (ARIA tooltip semantics). Use inside `<TooltipTrigger>`.\n */\nexport function Tooltip(props: TooltipProps) {\n  const { children, className, placement = 'top', offset = 8, ...rest } = props;\n  return (\n    <RACTooltip\n      {...rest}\n      placement={placement}\n      offset={offset}\n      className={[s.tooltip, className].filter(Boolean).join(' ')}\n    >\n      <OverlayArrow className={s.arrow}>\n        <svg width={8} height={8} viewBox=\"0 0 8 8\" aria-hidden=\"true\">\n          <path d=\"M0 0 L4 4 L8 0\" />\n        </svg>\n      </OverlayArrow>\n      {children}\n    </RACTooltip>\n  );\n}\n"],"mappings":";;;;;;;;ACsBA,SAAgB,EAAe,GAA4B;CACzD,IAAM,EAAE,WAAQ,KAAK,gBAAa,GAAG,GAAG,MAAS;CACjD,OAAO,kBAAC,GAAD;EAA0B;EAAmB;EAAY,GAAI;EAAQ,CAAA;;AAY9E,SAAgB,EAAQ,GAAqB;CAC3C,IAAM,EAAE,aAAU,cAAW,eAAY,OAAO,YAAS,GAAG,GAAG,MAAS;CACxE,OACE,kBAAC,GAAD;EACE,GAAI;EACO;EACH;EACR,WAAW,CAAC,EAAE,SAAS,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;YAJ7D,CAME,kBAAC,GAAD;GAAc,WAAW,EAAE;aACzB,kBAAC,OAAD;IAAK,OAAO;IAAG,QAAQ;IAAG,SAAQ;IAAU,eAAY;cACtD,kBAAC,QAAD,EAAM,GAAE,kBAAmB,CAAA;IACvB,CAAA;GACO,CAAA,EACd,EACU"}
+{"version":3,"file":"Tooltip-Clgn4trm.js","names":[],"sources":["../../src/components/Tooltip/Tooltip.module.css","../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":[".tooltip {\n  /* Above Dialog overlay (1000) and ToastRegion (1100) — RAC sets no z-index. */\n  z-index: 1200;\n  background: var(--wzl-surface);\n  border: 1px solid var(--wzl-border);\n  border-radius: var(--wzl-radius-sm);\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);\n  color: var(--wzl-fg);\n  font-family: var(--wzl-font-ui);\n  font-size: 12px;\n  line-height: 1.3;\n  padding: 4px 8px;\n  max-width: 260px;\n  transition: opacity var(--wzl-motion-fast);\n}\n\n.tooltip[data-entering],\n.tooltip[data-exiting] {\n  opacity: 0;\n}\n\n.arrow svg {\n  display: block;\n  fill: var(--wzl-surface);\n  stroke: var(--wzl-border);\n  stroke-width: 1;\n}\n\n.arrow[data-placement='bottom'] svg {\n  transform: rotate(180deg);\n}\n\n.arrow[data-placement='left'] svg {\n  transform: rotate(-90deg);\n}\n\n.arrow[data-placement='right'] svg {\n  transform: rotate(90deg);\n}\n","import type { ReactNode } from 'react';\nimport {\n  TooltipTrigger as RACTooltipTrigger,\n  Tooltip as RACTooltip,\n  OverlayArrow,\n  type TooltipProps as RACTooltipProps,\n  type TooltipTriggerComponentProps,\n} from 'react-aria-components';\nimport s from './Tooltip.module.css';\n\nexport type TooltipTriggerProps = TooltipTriggerComponentProps;\n\n/**\n * TooltipTrigger with kit defaults: ~600 ms open delay, instant close.\n * Wrap a focusable trigger plus a `<Tooltip>`. Non-RAC triggers (plain\n * `<button>` etc.) must be wrapped in `<Focusable>` from\n * react-aria-components so hover/focus props reach the DOM node.\n *\n * Caveat: while a tooltip is open, react-aria captures the first Escape\n * keydown (document-level, capture phase) to dismiss it — app-level\n * Escape handlers (deselect, cancel gesture) see only the second press.\n */\nexport function TooltipTrigger(props: TooltipTriggerProps) {\n  const { delay = 600, closeDelay = 0, ...rest } = props;\n  return <RACTooltipTrigger delay={delay} closeDelay={closeDelay} {...rest} />;\n}\n\nexport type TooltipProps = Omit<RACTooltipProps, 'children' | 'className'> & {\n  children?: ReactNode;\n  className?: string;\n};\n\n/**\n * Tooltip bubble with an arrow pointing at the trigger. Non-interactive\n * content only (ARIA tooltip semantics). Use inside `<TooltipTrigger>`.\n */\nexport function Tooltip(props: TooltipProps) {\n  const { children, className, placement = 'top', offset = 8, ...rest } = props;\n  return (\n    <RACTooltip\n      {...rest}\n      placement={placement}\n      offset={offset}\n      className={[s.tooltip, className].filter(Boolean).join(' ')}\n    >\n      <OverlayArrow className={s.arrow}>\n        <svg width={8} height={8} viewBox=\"0 0 8 8\" aria-hidden=\"true\">\n          <path d=\"M0 0 L4 4 L8 0\" />\n        </svg>\n      </OverlayArrow>\n      {children}\n    </RACTooltip>\n  );\n}\n"],"mappings":";;;;;;;;ACsBA,SAAgB,EAAe,GAA4B;CACzD,IAAM,EAAE,WAAQ,KAAK,gBAAa,GAAG,GAAG,MAAS;AACjD,QAAO,kBAAC,GAAD;EAA0B;EAAmB;EAAY,GAAI;EAAQ,CAAA;;AAY9E,SAAgB,EAAQ,GAAqB;CAC3C,IAAM,EAAE,aAAU,cAAW,eAAY,OAAO,YAAS,GAAG,GAAG,MAAS;AACxE,QACE,kBAAC,GAAD;EACE,GAAI;EACO;EACH;EACR,WAAW,CAAC,EAAE,SAAS,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;YAJ7D,CAME,kBAAC,GAAD;GAAc,WAAW,EAAE;aACzB,kBAAC,OAAD;IAAK,OAAO;IAAG,QAAQ;IAAG,SAAQ;IAAU,eAAY;cACtD,kBAAC,QAAD,EAAM,GAAE,kBAAmB,CAAA;IACvB,CAAA;GACO,CAAA,EACd,EACU"}

package/dist/chunks/keyGlyph-BDH5fqkO.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyGlyph-BDH5fqkO.js","names":[],"sources":["../../src/components/Keycaps/keyGlyph.ts"],"sourcesContent":["/** Apple-style glyph for a DOM `KeyboardEvent.key` value. Covers escape,\n *  delete/backspace, arrows, enter/return, tab, space. Unknown keys are\n *  upper-cased (so `'a'` reads as `A` on a keycap) and returned unchanged\n *  otherwise — making this safe to apply uniformly without a `has-glyph`\n *  check at the call site. */\nexport function keyGlyph(rawKey: string): string {\n  switch (rawKey) {\n    case 'Escape': return '⎋';\n    case 'Backspace': return '⌫';\n    case 'Delete': return '⌦';\n    case 'ArrowUp': return '↑';\n    case 'ArrowDown': return '↓';\n    case 'ArrowLeft': return '←';\n    case 'ArrowRight': return '→';\n    case 'Enter':\n    case 'Return': return '↵';\n    case 'Tab': return '⇥';\n    case ' ':\n    case 'Space': return '␣';\n    default: return rawKey.toUpperCase();\n  }\n}\n"],"mappings":";AAKA,SAAgB,EAAS,GAAwB;CAC/C,QAAQ,GAAR;EACE,KAAK,UAAU,OAAO;EACtB,KAAK,aAAa,OAAO;EACzB,KAAK,UAAU,OAAO;EACtB,KAAK,WAAW,OAAO;EACvB,KAAK,aAAa,OAAO;EACzB,KAAK,aAAa,OAAO;EACzB,KAAK,cAAc,OAAO;EAC1B,KAAK;EACL,KAAK,UAAU,OAAO;EACtB,KAAK,OAAO,OAAO;EACnB,KAAK;EACL,KAAK,SAAS,OAAO;EACrB,SAAS,OAAO,EAAO,aAAa"}
+{"version":3,"file":"keyGlyph-BDH5fqkO.js","names":[],"sources":["../../src/components/Keycaps/keyGlyph.ts"],"sourcesContent":["/** Apple-style glyph for a DOM `KeyboardEvent.key` value. Covers escape,\n *  delete/backspace, arrows, enter/return, tab, space. Unknown keys are\n *  upper-cased (so `'a'` reads as `A` on a keycap) and returned unchanged\n *  otherwise — making this safe to apply uniformly without a `has-glyph`\n *  check at the call site. */\nexport function keyGlyph(rawKey: string): string {\n  switch (rawKey) {\n    case 'Escape': return '⎋';\n    case 'Backspace': return '⌫';\n    case 'Delete': return '⌦';\n    case 'ArrowUp': return '↑';\n    case 'ArrowDown': return '↓';\n    case 'ArrowLeft': return '←';\n    case 'ArrowRight': return '→';\n    case 'Enter':\n    case 'Return': return '↵';\n    case 'Tab': return '⇥';\n    case ' ':\n    case 'Space': return '␣';\n    default: return rawKey.toUpperCase();\n  }\n}\n"],"mappings":";AAKA,SAAgB,EAAS,GAAwB;AAC/C,SAAQ,GAAR;EACE,KAAK,SAAU,QAAO;EACtB,KAAK,YAAa,QAAO;EACzB,KAAK,SAAU,QAAO;EACtB,KAAK,UAAW,QAAO;EACvB,KAAK,YAAa,QAAO;EACzB,KAAK,YAAa,QAAO;EACzB,KAAK,aAAc,QAAO;EAC1B,KAAK;EACL,KAAK,SAAU,QAAO;EACtB,KAAK,MAAO,QAAO;EACnB,KAAK;EACL,KAAK,QAAS,QAAO;EACrB,QAAS,QAAO,EAAO,aAAa"}

package/dist/components/Callout/index.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../../chunks/Callout-Dt0kBIls.js";
+import { n as e, t } from "../../chunks/Callout-CxxrEcSb.js";
 export { t as Callout, e as CalloutTrigger };

package/dist/components/ComboBox/index.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../../chunks/ComboBox-pH8aDEL2.js";
+import { n as e, t } from "../../chunks/ComboBox-CotoRgNi.js";
 export { t as ComboBox, e as ComboBoxItem };

package/dist/components/CurveEditor/index.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, t as a } from "../../chunks/CurveEditor-DrORWShU.js";
+import { a as e, i as t, n, o as r, r as i, t as a } from "../../chunks/CurveEditor-DAb2EMyR.js";
 export { n as CurveEditor, i as LayeredCurveEditor, t as createFunctionLayer, a as createSetCurveOp, e as functionLayerState, r as sampleByInterpolation };

package/dist/components/PointPlotter/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../chunks/PointPlotter-D528sBdT.js";
+import { t as e } from "../../chunks/PointPlotter-EkbCBK9j.js";
 export { e as PointPlotter };

package/dist/components/Prefs/index.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, r, t as i } from "../../chunks/Prefs-snBejOzK.js";
+import { a as e, i as t, n, r, t as i } from "../../chunks/Prefs-BkDJ5Cdz.js";
 export { i as PrefsDialog, n as PrefsForm, r as isPrefLeaf, t as prefValueAtPath, e as visiblePrefSubtree };

package/dist/components/ResizeHandle/ResizeHandle.d.ts

@@ -0,0 +1,52 @@
+export interface ResizeHandleProps {
+    /**
+     * Which way the handle *runs*, matching `aria-orientation` on the
+     * separator role: a `vertical` handle is a vertical bar between two
+     * side-by-side panes and drags horizontally. `horizontal` is the
+     * stacked case (a bar between rows, dragged up and down).
+     */
+    orientation?: 'vertical' | 'horizontal';
+    /** Current size of the pane being resized, in pixels. */
+    value: number;
+    min: number;
+    max: number;
+    /**
+     * Flip the sign of the drag. Panes docked to the *trailing* edge (a
+     * right sidebar, a bottom drawer) grow as the pointer moves toward the
+     * start of the axis, so they want `invert`. Leading-edge panes don't.
+     */
+    invert?: boolean;
+    /**
+     * Fires continuously while dragging and on each keyboard step, always
+     * clamped to [min, max]. Drive the live size from this.
+     */
+    onChange(next: number): void;
+    /**
+     * Fires once when a drag ends or a keyboard step settles, with the final
+     * size. Persist here rather than in `onChange` — one write per gesture
+     * instead of one per pointer sample.
+     */
+    onChangeEnd?(next: number): void;
+    /**
+     * The granularity of `value`. Arrow keys move by one step (Shift by
+     * eight), and pointer drags snap to the same grid — a pointer reports
+     * fractional coordinates on a scaled display, and nobody wants
+     * `362.9453125` in their persisted layout. Set a fractional step for a
+     * pane measured in something finer than whole pixels.
+     */
+    step?: number;
+    ariaLabel?: string;
+    className?: string;
+}
+/**
+ * Draggable divider for resizing a pane — the "window splitter" pattern.
+ * Owns no size of its own: the consumer holds `value` and applies it
+ * (typically as a CSS custom property on the pane), which keeps the handle
+ * usable for flex, grid, and absolutely-positioned layouts alike.
+ *
+ * Keyboard-operable as a matter of course: it's focusable, arrows step by
+ * `step` (Shift for a coarse step), Home/End jump to the bounds. A splitter
+ * that only responds to a pointer drag strands anyone who can't make one.
+ */
+export declare function ResizeHandle(props: ResizeHandleProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ResizeHandle.d.ts.map

package/dist/components/ResizeHandle/ResizeHandle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizeHandle.d.ts","sourceRoot":"","sources":["../../../src/components/ResizeHandle/ResizeHandle.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,iBAAiB;IAChC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC,yDAAyD;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B;;;;OAIG;IACH,WAAW,CAAC,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgBD;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CA4EpD"}

package/dist/components/ResizeHandle/index.d.ts

@@ -0,0 +1,3 @@
+export { ResizeHandle } from './ResizeHandle';
+export type { ResizeHandleProps } from './ResizeHandle';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ResizeHandle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ResizeHandle/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/ResizeHandle/index.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../chunks/ResizeHandle-C2OBMqTs.js";
+export { e as ResizeHandle };

package/dist/components/Select/Select.d.ts

@@ -4,6 +4,13 @@ export type SelectOption = {
     value: string;
     label: ReactNode;
     isDisabled?: boolean;
+    /**
+     * Plain-text form of `label`, for type-to-select and screen readers.
+     * Only needed when `label` isn't a bare string — a label built from
+     * elements has no text React Aria can read off it. A string label
+     * supplies this itself.
+     */
+    textValue?: string;
 };
 type Key = string | number;
 export type SelectProps<T extends Key = string> = Omit<RACSelectProps<object>, 'children' | 'className' | 'selectedKey' | 'defaultSelectedKey' | 'onSelectionChange'> & {
@@ -34,6 +41,6 @@ export type SelectItemProps = Omit<RACListBoxItemProps, 'className' | 'children'
     children?: ReactNode;
     className?: string;
 };
-export declare function SelectItem({ children, className, ...rest }: SelectItemProps): import("react/jsx-runtime").JSX.Element;
+export declare function SelectItem({ children, className, textValue, ...rest }: SelectItemProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=Select.d.ts.map

package/dist/components/Select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAUL,KAAK,WAAW,IAAI,cAAc,EAClC,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,gBAAgB,EACtB,MAAM,uBAAuB,CAAC;AAI/B,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,GAAG,GAAG,MAAM,GAAG,MAAM,CAAC;AAE3B,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,GAAG,GAAG,MAAM,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,oBAAoB,GAAG,mBAAmB,CAAC,GAAG;IACtK,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,CAAC,EAAE,gBAAgB,KAAK,SAAS,CAAC,CAAC;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gFAAgF;IAChF,OAAO,CAAC,EAAE,aAAa,CAAC,YAAY,GAAG;QAAE,KAAK,EAAE,CAAC,CAAA;KAAE,CAAC,CAAC;IACrD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;IACvB,kBAAkB,CAAC,EAAE,CAAC,CAAC;IACvB,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,CAAC,SAAS,GAAG,GAAG,MAAM,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,2CAqDnE;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,mBAAmB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IAClF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,2CAS3E"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAUL,KAAK,WAAW,IAAI,cAAc,EAClC,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,gBAAgB,EACtB,MAAM,uBAAuB,CAAC;AAI/B,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,KAAK,GAAG,GAAG,MAAM,GAAG,MAAM,CAAC;AAE3B,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,GAAG,GAAG,MAAM,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,oBAAoB,GAAG,mBAAmB,CAAC,GAAG;IACtK,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,CAAC,EAAE,gBAAgB,KAAK,SAAS,CAAC,CAAC;IAChE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gFAAgF;IAChF,OAAO,CAAC,EAAE,aAAa,CAAC,YAAY,GAAG;QAAE,KAAK,EAAE,CAAC,CAAA;KAAE,CAAC,CAAC;IACrD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;IACvB,kBAAkB,CAAC,EAAE,CAAC,CAAC;IACvB,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,CAAC,SAAS,GAAG,GAAG,MAAM,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,2CAgEnE;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,mBAAmB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IAClF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAgBF,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,2CAatF"}

package/dist/components/Select/index.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../../chunks/Select-l7pAkVEG.js";
+import { n as e, t } from "../../chunks/Select-CLyBisCS.js";
 export { t as Select, e as SelectItem };

package/dist/components/SelectionPanel/index.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "../../chunks/SelectionPanel-CMglTgEf.js";
+import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "../../chunks/SelectionPanel-DBdhAKIK.js";
 export { r as MIXED, s as SelectionPanel, a as aggregateValue, n as classifyKind, e as effectiveSections, i as kindBreakdown, o as nodeValueAt, t as setAtPath };

package/dist/components/Sidebar/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../chunks/Sidebar-BFcBx8QV.js";
+import { t as e } from "../../chunks/Sidebar-doLqiTZH.js";
 export { e as Sidebar };

package/dist/components/SidebarPanel/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../chunks/SidebarPanel-CRnSlvee.js";
+import { t as e } from "../../chunks/SidebarPanel-DjTfOzB9.js";
 export { e as SidebarPanel };

package/dist/components/StatusBar/StatusBar.d.ts

@@ -0,0 +1,45 @@
+import type { ReactNode } from 'react';
+export interface StatusBarProps {
+    /**
+     * Accessible label for the bar. Deliberately not a live region — a status
+     * bar's readouts change on every pointer move (zoom, cursor position,
+     * selection count), and announcing each one would make a screen reader
+     * unusable. Screen-reader users reach the same facts through the controls
+     * that own them.
+     */
+    ariaLabel?: string;
+    children?: ReactNode;
+    className?: string;
+}
+/**
+ * The thin readout strip along the bottom of an editor window: monospace,
+ * one row, items separated by a fixed gap, with an optional spacer that
+ * pushes everything after it to the trailing edge.
+ *
+ * Pure presentation — it holds whatever the app puts in it. Compose with
+ * `<StatusBarItem>` and `<StatusBarSpacer>`.
+ */
+export declare function StatusBar(props: StatusBarProps): import("react/jsx-runtime").JSX.Element;
+export interface StatusBarItemProps {
+    /**
+     * Hover text. Items that carry one also get a `help` cursor, so the
+     * affordance is discoverable rather than hidden behind a hover delay.
+     */
+    title?: string;
+    /**
+     * Dim the item and use tabular figures. For reference material that
+     * shouldn't compete with live readouts — build stamps, hints, units.
+     */
+    muted?: boolean;
+    children?: ReactNode;
+    className?: string;
+}
+/** One readout in a `<StatusBar>`. */
+export declare function StatusBarItem(props: StatusBarItemProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Splits a status bar into leading and trailing runs — everything after the
+ * spacer is pushed to the trailing edge. Decorative, so it's hidden from the
+ * accessibility tree.
+ */
+export declare function StatusBarSpacer(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StatusBar.d.ts.map

package/dist/components/StatusBar/StatusBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBar.d.ts","sourceRoot":"","sources":["../../../src/components/StatusBar/StatusBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,WAAW,cAAc;IAC7B;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CAO9C;AAED,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,sCAAsC;AACtC,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CAKtD;AAED;;;;GAIG;AACH,wBAAgB,eAAe,4CAE9B"}

package/dist/components/StatusBar/index.d.ts

@@ -0,0 +1,3 @@
+export { StatusBar, StatusBarItem, StatusBarSpacer } from './StatusBar';
+export type { StatusBarProps, StatusBarItemProps } from './StatusBar';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/StatusBar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/StatusBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACxE,YAAY,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC"}