@weasel-js/ui 0.5.1 → 0.6.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleBar-BfcvLaOr.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/* 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      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  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 cls = `${s.segment}${selected ? ` ${s.segmentSelected}` : ''}`;\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' ? 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-GAzBOvcR.js

@@ -0,0 +1,53 @@
+import { n as e, t } from "./Tooltip-Clgn4trm.js";
+import { Focusable as n } from "react-aria-components";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+var a = {
+	button: "_button_rsrcm_1",
+	active: "_active_rsrcm_26",
+	icon: "_icon_rsrcm_35",
+	label: "_label_rsrcm_37",
+	shortcut: "_shortcut_rsrcm_38"
+};
+//#endregion
+//#region src/components/ToolButton/ToolButton.tsx
+function o(o) {
+	let { icon: s, label: c, shortcut: l, active: u, disabled: d, ariaDisabled: f, tabbable: p, onClick: m, title: h, className: g } = o, _ = h ?? (l ? `${c} (${l})` : c), v = [
+		a.button,
+		u && a.active,
+		g
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ i(e, {
+		isDisabled: d,
+		children: [/* @__PURE__ */ r(n, {
+			isDisabled: d,
+			children: /* @__PURE__ */ i("button", {
+				type: "button",
+				tabIndex: p ? 0 : -1,
+				className: v,
+				"aria-current": u ? "true" : void 0,
+				"aria-disabled": f ? "true" : void 0,
+				disabled: d,
+				onClick: m,
+				children: [
+					/* @__PURE__ */ r("span", {
+						className: a.icon,
+						"aria-hidden": "true",
+						children: s
+					}),
+					/* @__PURE__ */ r("span", {
+						className: a.label,
+						children: c
+					}),
+					l && /* @__PURE__ */ r("span", {
+						className: a.shortcut,
+						children: l
+					})
+				]
+			})
+		}), /* @__PURE__ */ r(t, { children: _ })]
+	});
+}
+//#endregion
+export { o as t };
+
+//# sourceMappingURL=ToolButton-GAzBOvcR.js.map

package/dist/chunks/ToolButton-GAzBOvcR.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolButton-GAzBOvcR.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"}

package/dist/chunks/ToolGroup-Btg47vJF.js

@@ -0,0 +1,25 @@
+import { jsx as e } from "react/jsx-runtime";
+var t = {
+	group: "_group_o2pho_1",
+	horizontal: "_horizontal_o2pho_6"
+};
+//#endregion
+//#region src/components/ToolGroup/ToolGroup.tsx
+function n(n) {
+	let { children: r, orientation: i = "vertical", groupKey: a, ariaLabel: o, className: s } = n;
+	return /* @__PURE__ */ e("div", {
+		className: [
+			t.group,
+			i === "horizontal" && t.horizontal,
+			s
+		].filter(Boolean).join(" "),
+		role: "group",
+		"data-group": a,
+		"aria-label": o,
+		children: r
+	});
+}
+//#endregion
+export { n as t };
+
+//# sourceMappingURL=ToolGroup-Btg47vJF.js.map

package/dist/chunks/ToolGroup-Btg47vJF.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolGroup-Btg47vJF.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"}

package/dist/chunks/ToolPalette-C8V-I-uX.js

@@ -0,0 +1,117 @@
+import { t as e } from "./keyGlyph-BDH5fqkO.js";
+import { t } from "./ToolButton-GAzBOvcR.js";
+import { t as n } from "./ToolGroup-Btg47vJF.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";
+import { eligibleTool as c } from "@weasel-js/modes";
+var l = {
+	palette: "_palette_1ygdo_1",
+	horizontal: "_horizontal_1ygdo_11",
+	ineligibleBtn: "_ineligibleBtn_1ygdo_16",
+	separator: "_separator_1ygdo_21"
+};
+//#endregion
+//#region src/components/ToolPalette/formatShortcut.ts
+function u(t) {
+	if (!t) return;
+	let n = Array.isArray(t.key) ? t.key[0] : t.key, r = [];
+	return t.mod && r.push("⌘"), t.shift === !0 && r.push("⇧"), t.alt && r.push("⌥"), r.push(e(n)), r;
+}
+function d(e) {
+	let t = u(e);
+	return t ? t.join("") : void 0;
+}
+//#endregion
+//#region src/components/ToolPalette/ToolPalette.tsx
+var f = [
+	"select",
+	"shape",
+	"draw",
+	"type",
+	"view"
+], p = "misc";
+function m(e) {
+	let t = /* @__PURE__ */ new Map();
+	for (let n of e) {
+		let e = n.presentation?.group ?? p, r = t.get(e) ?? [];
+		r.push(n), t.set(e, r);
+	}
+	return t;
+}
+function h(e, t) {
+	let n = new Set(e.keys()), r = [];
+	for (let e of t) n.has(e) && (r.push(e), n.delete(e));
+	for (let t of e.keys()) n.has(t) && t !== p && (r.push(t), n.delete(t));
+	return n.has(p) && r.push(p), r;
+}
+function g(e) {
+	let t = e.presentation?.icon;
+	return t == null ? /* @__PURE__ */ o(a, {}) : typeof t == "function" ? t(void 0) : t;
+}
+function _(e) {
+	let { tools: a, orientation: u = "vertical", className: p, lookupShortcut: _, modeRegistry: v, groupOrder: y = f } = e, b = m(Object.values(a.registry)), x = h(b, y), S = [
+		l.palette,
+		u === "horizontal" && l.horizontal,
+		p
+	].filter(Boolean).join(" "), C = x.flatMap((e) => b.get(e).map((e) => e.id)), w = a.active && C.includes(a.active) ? a.active : C[0], T = i(null);
+	function E(e) {
+		let t = e.target;
+		if (t.tagName !== "BUTTON") return;
+		let n = T.current;
+		if (!n) return;
+		let r = Array.from(n.querySelectorAll("button")), i = r.indexOf(t);
+		if (i < 0) return;
+		let a = -1;
+		switch (e.key) {
+			case "ArrowDown":
+			case "ArrowRight":
+				a = (i + 1) % r.length;
+				break;
+			case "ArrowUp":
+			case "ArrowLeft":
+				a = (i - 1 + r.length) % r.length;
+				break;
+			case "Home":
+				a = 0;
+				break;
+			case "End":
+				a = r.length - 1;
+				break;
+		}
+		a >= 0 && (e.preventDefault(), r[a].focus());
+	}
+	return /* @__PURE__ */ o("div", {
+		ref: T,
+		className: S,
+		role: "toolbar",
+		"aria-label": "Tools",
+		onKeyDown: E,
+		children: x.map((e, i) => /* @__PURE__ */ s(r, { children: [i > 0 && /* @__PURE__ */ o("div", {
+			className: l.separator,
+			role: "separator",
+			"aria-orientation": u === "horizontal" ? "vertical" : "horizontal"
+		}), /* @__PURE__ */ o(n, {
+			orientation: u,
+			groupKey: e,
+			children: b.get(e).map((e) => {
+				let n = e.presentation?.label ?? e.id, r = e.presentation?.shortcut ?? d(_ ? _(e.id) : e.keybinding), i = v ? c(v, e) : !0, s = v ? v.current().id : void 0, u = !i && s ? `${n}${r ? ` (${r})` : ""} — disabled in ${s} mode` : void 0;
+				return /* @__PURE__ */ o(t, {
+					icon: g(e),
+					label: n,
+					shortcut: r,
+					active: a.active === e.id,
+					tabbable: e.id === w,
+					ariaDisabled: !i,
+					className: i ? void 0 : l.ineligibleBtn,
+					title: u,
+					onClick: i ? () => a.setActive(e.id) : () => {}
+				}, e.id);
+			})
+		})] }, e))
+	});
+}
+//#endregion
+export { d as n, u as r, _ as t };
+
+//# sourceMappingURL=ToolPalette-C8V-I-uX.js.map

package/dist/chunks/ToolPalette-C8V-I-uX.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToolPalette-C8V-I-uX.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

@@ -0,0 +1,39 @@
+import { OverlayArrow as e, Tooltip as t, TooltipTrigger as n } from "react-aria-components";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+var a = {
+	tooltip: "_tooltip_1km1f_1",
+	arrow: "_arrow_1km1f_22"
+};
+//#endregion
+//#region src/components/Tooltip/Tooltip.tsx
+function o(e) {
+	let { delay: t = 600, closeDelay: i = 0, ...a } = e;
+	return /* @__PURE__ */ r(n, {
+		delay: t,
+		closeDelay: i,
+		...a
+	});
+}
+function s(n) {
+	let { children: o, className: s, placement: c = "top", offset: l = 8, ...u } = n;
+	return /* @__PURE__ */ i(t, {
+		...u,
+		placement: c,
+		offset: l,
+		className: [a.tooltip, s].filter(Boolean).join(" "),
+		children: [/* @__PURE__ */ r(e, {
+			className: a.arrow,
+			children: /* @__PURE__ */ r("svg", {
+				width: 8,
+				height: 8,
+				viewBox: "0 0 8 8",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ r("path", { d: "M0 0 L4 4 L8 0" })
+			})
+		}), o]
+	});
+}
+//#endregion
+export { o as n, s as t };
+
+//# sourceMappingURL=Tooltip-Clgn4trm.js.map

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

@@ -0,0 +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"}

package/dist/chunks/keyGlyph-BDH5fqkO.js

@@ -0,0 +1,22 @@
+//#region src/components/Keycaps/keyGlyph.ts
+function e(e) {
+	switch (e) {
+		case "Escape": return "⎋";
+		case "Backspace": return "⌫";
+		case "Delete": return "⌦";
+		case "ArrowUp": return "↑";
+		case "ArrowDown": return "↓";
+		case "ArrowLeft": return "←";
+		case "ArrowRight": return "→";
+		case "Enter":
+		case "Return": return "↵";
+		case "Tab": return "⇥";
+		case " ":
+		case "Space": return "␣";
+		default: return e.toUpperCase();
+	}
+}
+//#endregion
+export { e as t };
+
+//# sourceMappingURL=keyGlyph-BDH5fqkO.js.map

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

@@ -0,0 +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"}

package/dist/components/ActionBar/index.js

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

package/dist/components/ActionsBar/index.js

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

package/dist/components/Badge/index.js

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

package/dist/components/Button/index.js

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

package/dist/components/Callout/index.js

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

package/dist/components/Checkbox/index.js

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

package/dist/components/ColorField/index.js

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

package/dist/components/ComboBox/index.js

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

package/dist/components/CurveEditor/index.js

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

package/dist/components/DataGrid/index.js

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

package/dist/components/Dialog/index.js

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

package/dist/components/Field/index.js

@@ -0,0 +1,2 @@
+import { n as e, t } from "../../chunks/Field-4cagmYlT.js";
+export { t as Field, e as fieldClasses };

package/dist/components/Input/index.js

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

package/dist/components/Keycaps/index.js

@@ -0,0 +1,3 @@
+import { a as e, i as t, n, o as r, r as i, t as a } from "../../chunks/Keycaps-B9dJMYx_.js";
+import { t as o } from "../../chunks/keyGlyph-BDH5fqkO.js";
+export { e as KeyCap, t as KeySequence, a as detectPlatform, r as inferKeycapKind, o as keyGlyph, n as keySpecFromKey, i as keySpecsFromMods };

package/dist/components/NumberField/index.js

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

package/dist/components/OptionsBar/index.js

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

package/dist/components/Plot2D/index.js

@@ -0,0 +1,2 @@
+import { n as e, r as t, t as n } from "../../chunks/Plot2D-CEnhzodm.js";
+export { n as Plot2D, e as modelToPlot, t as plotToModel };

package/dist/components/PointPlotter/index.js

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

package/dist/components/Powerline/index.js

@@ -0,0 +1,3 @@
+import { n as e } from "../../chunks/Badge-DU8ihE7Z.js";
+import { t } from "../../chunks/Powerline-W_yqAVMc.js";
+export { e as EDGE_PROFILES, t as Powerline };

package/dist/components/Prefs/index.js

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

package/dist/components/RadioGroup/index.js

@@ -0,0 +1,2 @@
+import { n as e, t } from "../../chunks/RadioGroup-DUlTy95a.js";
+export { t as Radio, e as RadioGroup };

package/dist/components/RangeSlider/index.js

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

package/dist/components/Select/index.js

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

package/dist/components/SelectionPanel/index.js

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

package/dist/components/Sidebar/index.js

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

package/dist/components/SidebarPanel/index.js

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

package/dist/components/Slider/index.js

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

package/dist/components/Switch/index.js

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

package/dist/components/Tabs/index.js

@@ -0,0 +1,2 @@
+import { i as e, n as t, r as n, t as r } from "../../chunks/Tabs-DCs-Ww2f.js";
+export { r as Tab, t as TabList, n as TabPanel, e as Tabs };

package/dist/components/Toast/index.js

@@ -0,0 +1,2 @@
+import { a as e, i as t, n, r, t as i } from "../../chunks/Toast-NdSJo2vj.js";
+export { n as ToastQueue, i as ToastRegion, r as createToastQueue, t as defaultToastQueue, e as toast };

package/dist/components/ToggleBar/index.js

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

package/dist/components/ToolButton/index.js

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

package/dist/components/ToolGroup/index.js

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

package/dist/components/ToolPalette/index.js

@@ -0,0 +1,2 @@
+import { n as e, r as t, t as n } from "../../chunks/ToolPalette-C8V-I-uX.js";
+export { n as ToolPalette, e as formatShortcut, t as formatShortcutParts };

package/dist/components/Tooltip/index.js

@@ -0,0 +1,2 @@
+import { n as e, t } from "../../chunks/Tooltip-Clgn4trm.js";
+export { t as Tooltip, e as TooltipTrigger };