@weasel-js/ui 0.6.0 → 0.7.1

package/dist/chunks/{ToggleBar-BfcvLaOr.js → ToggleBar-Defj6Asn.js}

@@ -1,11 +1,12 @@
 import { useRef as e } from "react";
 import { jsx as t } from "react/jsx-runtime";
 var n = {
-	root: "_root_173aq_6",
-	segment: "_segment_173aq_28",
-	segmentSelected: "_segmentSelected_173aq_75",
-	size_sm: "_size_sm_173aq_133",
-	variant_minimal: "_variant_minimal_173aq_146"
+	root: "_root_1pyfg_6",
+	segment: "_segment_1pyfg_28",
+	segmentSelected: "_segmentSelected_1pyfg_75",
+	segmentMixed: "_segmentMixed_1pyfg_134",
+	variant_minimal: "_variant_minimal_1pyfg_144",
+	size_sm: "_size_sm_1pyfg_153"
 };
 //#endregion
 //#region src/components/ToggleBar/ToggleBar.tsx
@@ -34,12 +35,16 @@ function o(e, t) {
 	return t;
 }
 function s(s) {
-	let { items: c, ariaLabel: l, className: u, height: d, size: f, variant: p } = s, m = s.mode ?? "single", h = e(null), g = (e) => m === "multiple" ? s.value.includes(e) : s.value === e, _ = -1;
+	let { items: c, ariaLabel: l, className: u, height: d, size: f, variant: p } = s, m = s.mode ?? "single", h = e(null), g = (e) => m === "multiple" ? s.value.includes(e) : s.value === e, _ = (e) => {
+		if (m !== "multiple") return !1;
+		let t = s.mixedValues;
+		return t !== void 0 && t.includes(e) && !g(e);
+	}, v = -1;
 	if (m === "single") {
 		let e = c.findIndex((e) => e.value === s.value);
-		_ = e >= 0 && !c[e].disabled ? e : r(c);
-	} else _ = r(c);
-	let v = (e) => () => {
+		v = e >= 0 && !c[e].disabled ? e : r(c);
+	} else v = r(c);
+	let y = (e) => () => {
 		let t = c[e];
 		if (!t.disabled) if (m === "multiple") {
 			let e = s.value, n = e.includes(t.value) ? e.filter((e) => e !== t.value) : [...e, t.value];
@@ -51,10 +56,10 @@ function s(s) {
 			}
 			s.onChange(t.value);
 		}
-	}, y = (e) => {
+	}, b = (e) => {
 		let t = h.current;
 		t && t.querySelectorAll(`.${n.segment}`)[e]?.focus();
-	}, b = (e) => (t) => {
+	}, x = (e) => (t) => {
 		let n = -1;
 		switch (t.key) {
 			case "ArrowLeft":
@@ -73,7 +78,7 @@ function s(s) {
 				break;
 			case " ":
 			case "Enter":
-				m === "multiple" && (t.preventDefault(), v(e)());
+				m === "multiple" && (t.preventDefault(), y(e)());
 				return;
 			default: return;
 		}
@@ -82,9 +87,9 @@ function s(s) {
 				let e = c[n];
 				s.onChange(e.value);
 			}
-			y(n);
+			b(n);
 		}
-	}, x = d === void 0 ? void 0 : { "--wzl-tb-height": `${d}px` };
+	}, S = d === void 0 ? void 0 : { "--wzl-tb-height": `${d}px` };
 	return /* @__PURE__ */ t("div", {
 		ref: h,
 		className: [
@@ -95,20 +100,24 @@ function s(s) {
 		].filter(Boolean).join(" "),
 		role: m === "multiple" ? "group" : "radiogroup",
 		"aria-label": l,
-		style: x,
+		style: S,
 		children: c.map((e, r) => {
-			let i = g(e.value), a = `${n.segment}${i ? ` ${n.segmentSelected}` : ""}`;
+			let i = g(e.value), a = _(e.value), o = [
+				n.segment,
+				i && n.segmentSelected,
+				a && n.segmentMixed
+			].filter(Boolean).join(" ");
 			return /* @__PURE__ */ t("button", {
 				type: "button",
 				role: m === "multiple" ? void 0 : "radio",
 				"aria-checked": m === "multiple" ? void 0 : i,
-				"aria-pressed": m === "multiple" ? i : void 0,
+				"aria-pressed": m === "multiple" ? a ? "mixed" : i : void 0,
 				"aria-label": e.ariaLabel,
 				disabled: e.disabled,
-				tabIndex: r === _ ? 0 : -1,
-				className: a,
-				onClick: v(r),
-				onKeyDown: b(r),
+				tabIndex: r === v ? 0 : -1,
+				className: o,
+				onClick: y(r),
+				onKeyDown: x(r),
 				children: e.label
 			}, e.value);
 		})
@@ -117,4 +126,4 @@ function s(s) {
 //#endregion
 export { s as t };
 
-//# sourceMappingURL=ToggleBar-BfcvLaOr.js.map
+//# sourceMappingURL=ToggleBar-Defj6Asn.js.map

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

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

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

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

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

@@ -1 +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"}
+{"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;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 → ToolGroup-BAthcF5H.js}

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

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

@@ -1 +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"}
+{"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;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/ToolOptionsBar-ChiL-HVA.js

@@ -0,0 +1,27 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+var n = {
+	root: "_root_zcxef_13",
+	label: "_label_zcxef_25",
+	controls: "_controls_zcxef_6"
+};
+//#endregion
+//#region src/components/ToolOptionsBar/ToolOptionsBar.tsx
+function r(r) {
+	let { label: i, children: a, className: o } = r;
+	return /* @__PURE__ */ t("div", {
+		className: [n.root, o].filter(Boolean).join(" "),
+		role: "toolbar",
+		"aria-label": i,
+		children: [i !== void 0 && /* @__PURE__ */ e("span", {
+			className: n.label,
+			children: i
+		}), /* @__PURE__ */ e("div", {
+			className: n.controls,
+			children: a
+		})]
+	});
+}
+//#endregion
+export { r as t };
+
+//# sourceMappingURL=ToolOptionsBar-ChiL-HVA.js.map

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

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

package/dist/chunks/{ToolPalette-C8V-I-uX.js → ToolPalette-DXVIEO0w.js}

@@ -1,6 +1,6 @@
 import { t as e } from "./keyGlyph-BDH5fqkO.js";
-import { t } from "./ToolButton-GAzBOvcR.js";
-import { t as n } from "./ToolGroup-Btg47vJF.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-C8V-I-uX.js.map
+//# sourceMappingURL=ToolPalette-DXVIEO0w.js.map

package/dist/chunks/{ToolPalette-C8V-I-uX.js.map → ToolPalette-DXVIEO0w.js.map}

@@ -1 +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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"}
+{"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/components/Callout/index.js

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

package/dist/components/Checkbox/index.js

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

package/dist/components/ColorField/index.js

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

package/dist/components/ComboBox/index.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../../chunks/ComboBox-yfrxG0_I.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-BEQtef4P.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/Dialog/index.js

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

package/dist/components/Field/index.js

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

package/dist/components/Input/index.js

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

package/dist/components/NumberField/index.js

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

package/dist/components/PointPlotter/index.js

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

package/dist/components/Powerline/index.js

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

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-NOoGuUHy.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/RadioGroup/index.js

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

package/dist/components/RangeSlider/index.js

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

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-BV70VU5O.js";
+import { n as e, t } from "../../chunks/Select-CLyBisCS.js";
 export { t as Select, e as SelectItem };

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

@@ -1 +1 @@
-{"version":3,"file":"SelectionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionPanel/SelectionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjF,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,KAAK,EACV,KAAK,YAAY,EAGjB,KAAK,YAAY,EAElB,MAAM,iBAAiB,CAAC;AAkBzB,MAAM,WAAW,qBAAqB;IACpC,4DAA4D;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,wEAAwE;IACxE,IAAI,EAAE,YAAY,CAAC;IACnB,qEAAqE;IACrE,KAAK,EAAE,OAAO,CAAC;IACf,sDAAsD;IACtD,KAAK,EAAE,OAAO,CAAC;IACf,yEAAyE;IACzE,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,MAAM,gBAAgB,GAAG,CAAC,GAAG,EAAE,qBAAqB,KAAK,SAAS,CAAC;AAEzE,MAAM,WAAW,mBAAmB,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,EAAE,KAAK;IACtE;sEACkE;IAClE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;IACnC,iEAAiE;IACjE,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IACzC;0EACsE;IACtE,UAAU,EAAE,SAAS,mBAAmB,EAAE,CAAC;IAC3C;2DACuD;IACvD,OAAO,EAAE,SAAS,gBAAgB,EAAE,CAAC;IACrC;;;uCAGmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC7C,2DAA2D;IAC3D,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IACrC,4CAA4C;IAC5C,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,EAAE,KAAK,EAChE,KAAK,EAAE,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,2CAoGjD"}
+{"version":3,"file":"SelectionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionPanel/SelectionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjF,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,KAAK,EACV,KAAK,YAAY,EAGjB,KAAK,YAAY,EAGlB,MAAM,iBAAiB,CAAC;AAkBzB,MAAM,WAAW,qBAAqB;IACpC,4DAA4D;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,wEAAwE;IACxE,IAAI,EAAE,YAAY,CAAC;IACnB,qEAAqE;IACrE,KAAK,EAAE,OAAO,CAAC;IACf,sDAAsD;IACtD,KAAK,EAAE,OAAO,CAAC;IACf,yEAAyE;IACzE,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,MAAM,gBAAgB,GAAG,CAAC,GAAG,EAAE,qBAAqB,KAAK,SAAS,CAAC;AAEzE,MAAM,WAAW,mBAAmB,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,EAAE,KAAK;IACtE;sEACkE;IAClE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;IACnC,iEAAiE;IACjE,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;IACzC;0EACsE;IACtE,UAAU,EAAE,SAAS,mBAAmB,EAAE,CAAC;IAC3C;2DACuD;IACvD,OAAO,EAAE,SAAS,gBAAgB,EAAE,CAAC;IACrC;;;uCAGmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC7C,2DAA2D;IAC3D,SAAS,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IACrC,4CAA4C;IAC5C,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,SAAS,MAAM,EAAE,KAAK,EAChE,KAAK,EAAE,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,2CAuGjD"}

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

@@ -1,3 +1,3 @@
 export { SelectionPanel, type SelectionPanelProps, type PropertyRenderer, type PropertyRenderContext, } from './SelectionPanel';
-export { MIXED, aggregateValue, classifyKind, effectiveSections, kindBreakdown, splitNodePath, type Mixed, type PanelLeaf, type PanelRow, type PanelSection, } from './model';
+export { MIXED, aggregateValue, classifyKind, effectiveSections, kindBreakdown, nodeValueAt, setAtPath, type Mixed, type PanelLeaf, type PanelRow, type PanelSection, } from './model';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionPanel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,GAC3B,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,KAAK,EACL,cAAc,EACd,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,aAAa,EACb,KAAK,KAAK,EACV,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,YAAY,GAClB,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionPanel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,GAC3B,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,KAAK,EACL,cAAc,EACd,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,SAAS,EACT,KAAK,KAAK,EACV,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,YAAY,GAClB,MAAM,SAAS,CAAC"}

package/dist/components/SelectionPanel/index.js

@@ -1,2 +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 };
+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/SelectionPanel/model.d.ts

@@ -1,7 +1,6 @@
-import type { NodePropertiesEntry, NodeRoutingEntry, SceneNode, ToolPrefLeaf } from '@weasel-js/core';
-/** Sentinel for "selected nodes disagree at this path". */
-export declare const MIXED: unique symbol;
-export type Mixed = typeof MIXED;
+import { MIXED, type Mixed, type NodePropertiesEntry, type NodeRoutingEntry, type SceneNode, type ToolPrefLeaf } from '@weasel-js/core';
+export { MIXED };
+export type { Mixed };
 export type AnyNode = SceneNode<unknown, string, unknown>;
 export interface PanelLeaf {
     /** Dotted node path — the leaf's key in the schema. */
@@ -28,14 +27,17 @@ export declare function classifyKind(node: AnyNode, routing: readonly NodeRoutin
  * contribute nothing, so their presence collapses the intersection.
  */
 export declare function effectiveSections(kinds: readonly string[], entries: readonly NodePropertiesEntry[]): PanelSection[];
-/** Split a two-segment node path (`pose.x` / `data.fill`) into its root
- *  and key. Returns `null` for a dotless path. */
-export declare function splitNodePath(path: string): {
-    head: string;
-    key: string;
-} | null;
-/** Read a node value at a two-segment path (`pose.x` / `data.fill`). */
+/** Read a node value at a dotted path of any depth (`pose.x`,
+ *  `data.style.fontSize`, `data.style.fill.color`). Returns `undefined` if
+ *  the path is dotless (mirrors `commit`'s no-op on a malformed schema
+ *  key) or if any intermediate segment is missing or not an object. */
 export declare function nodeValueAt(node: AnyNode, path: string): unknown;
+/** Immutably set `value` at a dotted path within `root`, cloning each level
+ *  on the way down so React sees new object identities. Arrays stay arrays
+ *  (an array intermediate is shallow-copied, not flattened into `{0: ...}`)
+ *  — this is the write-side twin of `nodeValueAt`, so a schema author who
+ *  gets a working read gets a working write. */
+export declare function setAtPath(root: object, segments: readonly string[], value: unknown): object;
 /** Aggregate a path across nodes: the shared value, or `MIXED`. */
 export declare function aggregateValue(nodes: readonly AnyNode[], path: string): unknown | Mixed;
 /** `'rect ×2 · text'` — kinds in first-seen order with counts. */

package/dist/components/SelectionPanel/model.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"model.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionPanel/model.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EACV,mBAAmB,EACnB,gBAAgB,EAChB,SAAS,EAET,YAAY,EACb,MAAM,iBAAiB,CAAC;AAEzB,2DAA2D;AAC3D,eAAO,MAAM,KAAK,EAAE,OAAO,MAAkC,CAAC;AAC9D,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC;AAEjC,MAAM,MAAM,OAAO,GAAG,SAAS,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;AAE1D,MAAM,WAAW,SAAS;IACxB,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,YAAY,CAAC;CACpB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,SAAS,EAAE,CAAC;CACrB;AAED,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,QAAQ,EAAE,CAAC;CAClB;AAED;;oEAEoE;AACpE,wBAAgB,YAAY,CAC1B,IAAI,EAAE,OAAO,EACb,OAAO,EAAE,SAAS,gBAAgB,EAAE,GACnC,MAAM,CAMR;AAiDD;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,SAAS,MAAM,EAAE,EACxB,OAAO,EAAE,SAAS,mBAAmB,EAAE,GACtC,YAAY,EAAE,CAkChB;AAED;kDACkD;AAClD,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAIhF;AAED,wEAAwE;AACxE,wBAAgB,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAOhE;AAED,mEAAmE;AACnE,wBAAgB,cAAc,CAC5B,KAAK,EAAE,SAAS,OAAO,EAAE,EACzB,IAAI,EAAE,MAAM,GACX,OAAO,GAAG,KAAK,CAajB;AAED,kEAAkE;AAClE,wBAAgB,aAAa,CAAC,KAAK,EAAE,SAAS,MAAM,EAAE,GAAG,MAAM,CAM9D"}
+{"version":3,"file":"model.d.ts","sourceRoot":"","sources":["../../../src/components/SelectionPanel/model.ts"],"names":[],"mappings":"AAQA,OAAO,EACL,KAAK,EACL,KAAK,KAAK,EACV,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,SAAS,EAEd,KAAK,YAAY,EAClB,MAAM,iBAAiB,CAAC;AAKzB,OAAO,EAAE,KAAK,EAAE,CAAC;AACjB,YAAY,EAAE,KAAK,EAAE,CAAC;AAEtB,MAAM,MAAM,OAAO,GAAG,SAAS,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;AAE1D,MAAM,WAAW,SAAS;IACxB,uDAAuD;IACvD,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,YAAY,CAAC;CACpB;AAED,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,SAAS,EAAE,CAAC;CACrB;AAED,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,QAAQ,EAAE,CAAC;CAClB;AAED;;oEAEoE;AACpE,wBAAgB,YAAY,CAC1B,IAAI,EAAE,OAAO,EACb,OAAO,EAAE,SAAS,gBAAgB,EAAE,GACnC,MAAM,CAMR;AAiDD;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,SAAS,MAAM,EAAE,EACxB,OAAO,EAAE,SAAS,mBAAmB,EAAE,GACtC,YAAY,EAAE,CAkChB;AAED;;;uEAGuE;AACvE,wBAAgB,WAAW,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAUhE;AAED;;;;gDAIgD;AAChD,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,MAAM,EAAE,EAAE,KAAK,EAAE,OAAO,GAAG,MAAM,CAiB3F;AAED,mEAAmE;AACnE,wBAAgB,cAAc,CAC5B,KAAK,EAAE,SAAS,OAAO,EAAE,EACzB,IAAI,EAAE,MAAM,GACX,OAAO,GAAG,KAAK,CAajB;AAED,kEAAkE;AAClE,wBAAgB,aAAa,CAAC,KAAK,EAAE,SAAS,MAAM,EAAE,GAAG,MAAM,CAM9D"}

package/dist/components/Sidebar/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../chunks/Sidebar-Bk9_TPhX.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-Nd9Od5WD.js";
+import { t as e } from "../../chunks/SidebarPanel-DjTfOzB9.js";
 export { e as SidebarPanel };