@weasel-js/ui 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (97) hide show
  1. package/dist/chunks/{Callout-CvTKW1sd.js → Callout-Dt0kBIls.js} +1 -1
  2. package/dist/chunks/{Callout-CvTKW1sd.js.map → Callout-Dt0kBIls.js.map} +1 -1
  3. package/dist/chunks/{Checkbox-BeWFZr1M.js → Checkbox-CtK8H_OQ.js} +1 -1
  4. package/dist/chunks/{Checkbox-BeWFZr1M.js.map → Checkbox-CtK8H_OQ.js.map} +1 -1
  5. package/dist/chunks/{ColorField-B7vHaU5G.js → ColorField-sGLnThpB.js} +1 -1
  6. package/dist/chunks/{ColorField-B7vHaU5G.js.map → ColorField-sGLnThpB.js.map} +1 -1
  7. package/dist/chunks/{ComboBox-yfrxG0_I.js → ComboBox-pH8aDEL2.js} +2 -2
  8. package/dist/chunks/{ComboBox-yfrxG0_I.js.map → ComboBox-pH8aDEL2.js.map} +1 -1
  9. package/dist/chunks/{CurveEditor-BEQtef4P.js → CurveEditor-DrORWShU.js} +1 -1
  10. package/dist/chunks/{CurveEditor-BEQtef4P.js.map → CurveEditor-DrORWShU.js.map} +1 -1
  11. package/dist/chunks/{Dialog-tAi14bY3.js → Dialog-CQymDCAl.js} +1 -1
  12. package/dist/chunks/{Dialog-tAi14bY3.js.map → Dialog-CQymDCAl.js.map} +1 -1
  13. package/dist/chunks/{Field-4cagmYlT.js → Field-BHSu2F3E.js} +1 -1
  14. package/dist/chunks/{Field-4cagmYlT.js.map → Field-BHSu2F3E.js.map} +1 -1
  15. package/dist/chunks/{Input-DRei6KJr.js → Input-D_Xzgr2b.js} +2 -2
  16. package/dist/chunks/{Input-DRei6KJr.js.map → Input-D_Xzgr2b.js.map} +1 -1
  17. package/dist/chunks/{NumberField-BAmJwxw0.js → NumberField-BQmELz32.js} +2 -2
  18. package/dist/chunks/{NumberField-BAmJwxw0.js.map → NumberField-BQmELz32.js.map} +1 -1
  19. package/dist/chunks/{PointPlotter-Dvh5cyOC.js → PointPlotter-D528sBdT.js} +2 -2
  20. package/dist/chunks/{PointPlotter-Dvh5cyOC.js.map → PointPlotter-D528sBdT.js.map} +1 -1
  21. package/dist/chunks/{Powerline-W_yqAVMc.js → Powerline-C8rddbbK.js} +1 -1
  22. package/dist/chunks/{Powerline-W_yqAVMc.js.map → Powerline-C8rddbbK.js.map} +1 -1
  23. package/dist/chunks/{Prefs-NOoGuUHy.js → Prefs-snBejOzK.js} +10 -10
  24. package/dist/chunks/{Prefs-NOoGuUHy.js.map → Prefs-snBejOzK.js.map} +1 -1
  25. package/dist/chunks/{RadioGroup-DUlTy95a.js → RadioGroup-Ci-I9NEx.js} +2 -2
  26. package/dist/chunks/{RadioGroup-DUlTy95a.js.map → RadioGroup-Ci-I9NEx.js.map} +1 -1
  27. package/dist/chunks/{RangeSlider-Bks9GQuO.js → RangeSlider-CW-edtNx.js} +1 -1
  28. package/dist/chunks/{RangeSlider-Bks9GQuO.js.map → RangeSlider-CW-edtNx.js.map} +1 -1
  29. package/dist/chunks/{Select-BV70VU5O.js → Select-l7pAkVEG.js} +2 -2
  30. package/dist/chunks/{Select-BV70VU5O.js.map → Select-l7pAkVEG.js.map} +1 -1
  31. package/dist/chunks/{SelectionPanel-D_U7GKup.js → SelectionPanel-CMglTgEf.js} +92 -72
  32. package/dist/chunks/SelectionPanel-CMglTgEf.js.map +1 -0
  33. package/dist/chunks/{Sidebar-Bk9_TPhX.js → Sidebar-BFcBx8QV.js} +1 -1
  34. package/dist/chunks/{Sidebar-Bk9_TPhX.js.map → Sidebar-BFcBx8QV.js.map} +1 -1
  35. package/dist/chunks/{SidebarPanel-Nd9Od5WD.js → SidebarPanel-CRnSlvee.js} +1 -1
  36. package/dist/chunks/{SidebarPanel-Nd9Od5WD.js.map → SidebarPanel-CRnSlvee.js.map} +1 -1
  37. package/dist/chunks/{Switch-iUmlnP_b.js → Switch-DxJLMYki.js} +1 -1
  38. package/dist/chunks/{Switch-iUmlnP_b.js.map → Switch-DxJLMYki.js.map} +1 -1
  39. package/dist/chunks/{Tabs-DCs-Ww2f.js → Tabs-DelDecks.js} +1 -1
  40. package/dist/chunks/{Tabs-DCs-Ww2f.js.map → Tabs-DelDecks.js.map} +1 -1
  41. package/dist/chunks/{Toast-NdSJo2vj.js → Toast-Bw3XQxmV.js} +1 -1
  42. package/dist/chunks/{Toast-NdSJo2vj.js.map → Toast-Bw3XQxmV.js.map} +1 -1
  43. package/dist/chunks/{ToggleBar-BfcvLaOr.js → ToggleBar-Defj6Asn.js} +31 -22
  44. package/dist/chunks/ToggleBar-Defj6Asn.js.map +1 -0
  45. package/dist/chunks/{ToolButton-GAzBOvcR.js → ToolButton-Dk_uJf7N.js} +1 -1
  46. package/dist/chunks/{ToolButton-GAzBOvcR.js.map → ToolButton-Dk_uJf7N.js.map} +1 -1
  47. package/dist/chunks/{ToolGroup-Btg47vJF.js → ToolGroup-D8-qdtuw.js} +1 -1
  48. package/dist/chunks/{ToolGroup-Btg47vJF.js.map → ToolGroup-D8-qdtuw.js.map} +1 -1
  49. package/dist/chunks/ToolOptionsBar-ChiL-HVA.js +27 -0
  50. package/dist/chunks/ToolOptionsBar-ChiL-HVA.js.map +1 -0
  51. package/dist/chunks/{ToolPalette-C8V-I-uX.js → ToolPalette-xKHzPKYf.js} +3 -3
  52. package/dist/chunks/{ToolPalette-C8V-I-uX.js.map → ToolPalette-xKHzPKYf.js.map} +1 -1
  53. package/dist/components/Callout/index.js +1 -1
  54. package/dist/components/Checkbox/index.js +1 -1
  55. package/dist/components/ColorField/index.js +1 -1
  56. package/dist/components/ComboBox/index.js +1 -1
  57. package/dist/components/CurveEditor/index.js +1 -1
  58. package/dist/components/Dialog/index.js +1 -1
  59. package/dist/components/Field/index.js +1 -1
  60. package/dist/components/Input/index.js +1 -1
  61. package/dist/components/NumberField/index.js +1 -1
  62. package/dist/components/PointPlotter/index.js +1 -1
  63. package/dist/components/Powerline/index.js +1 -1
  64. package/dist/components/Prefs/index.js +1 -1
  65. package/dist/components/RadioGroup/index.js +1 -1
  66. package/dist/components/RangeSlider/index.js +1 -1
  67. package/dist/components/Select/index.js +1 -1
  68. package/dist/components/SelectionPanel/SelectionPanel.d.ts.map +1 -1
  69. package/dist/components/SelectionPanel/index.d.ts +1 -1
  70. package/dist/components/SelectionPanel/index.d.ts.map +1 -1
  71. package/dist/components/SelectionPanel/index.js +2 -2
  72. package/dist/components/SelectionPanel/model.d.ts +13 -11
  73. package/dist/components/SelectionPanel/model.d.ts.map +1 -1
  74. package/dist/components/Sidebar/index.js +1 -1
  75. package/dist/components/SidebarPanel/index.js +1 -1
  76. package/dist/components/Switch/index.js +1 -1
  77. package/dist/components/Tabs/index.js +1 -1
  78. package/dist/components/Toast/index.js +1 -1
  79. package/dist/components/ToggleBar/ToggleBar.d.ts +17 -0
  80. package/dist/components/ToggleBar/ToggleBar.d.ts.map +1 -1
  81. package/dist/components/ToggleBar/index.js +1 -1
  82. package/dist/components/ToolButton/index.js +1 -1
  83. package/dist/components/ToolGroup/index.js +1 -1
  84. package/dist/components/ToolOptionsBar/ToolOptionsBar.d.ts +44 -0
  85. package/dist/components/ToolOptionsBar/ToolOptionsBar.d.ts.map +1 -0
  86. package/dist/components/ToolOptionsBar/index.d.ts +3 -0
  87. package/dist/components/ToolOptionsBar/index.d.ts.map +1 -0
  88. package/dist/components/ToolOptionsBar/index.js +2 -0
  89. package/dist/components/ToolPalette/index.js +1 -1
  90. package/dist/index.d.ts +1 -0
  91. package/dist/index.d.ts.map +1 -1
  92. package/dist/index.js +37 -36
  93. package/dist/index.js.map +1 -1
  94. package/dist/style.css +1 -1
  95. package/package.json +2 -2
  96. package/dist/chunks/SelectionPanel-D_U7GKup.js.map +0 -1
  97. package/dist/chunks/ToggleBar-BfcvLaOr.js.map +0 -1
@@ -1,11 +1,12 @@
1
1
  import { useRef as e } from "react";
2
2
  import { jsx as t } from "react/jsx-runtime";
3
3
  var n = {
4
- root: "_root_173aq_6",
5
- segment: "_segment_173aq_28",
6
- segmentSelected: "_segmentSelected_173aq_75",
7
- size_sm: "_size_sm_173aq_133",
8
- variant_minimal: "_variant_minimal_173aq_146"
4
+ root: "_root_1pyfg_6",
5
+ segment: "_segment_1pyfg_28",
6
+ segmentSelected: "_segmentSelected_1pyfg_75",
7
+ segmentMixed: "_segmentMixed_1pyfg_134",
8
+ variant_minimal: "_variant_minimal_1pyfg_144",
9
+ size_sm: "_size_sm_1pyfg_153"
9
10
  };
10
11
  //#endregion
11
12
  //#region src/components/ToggleBar/ToggleBar.tsx
@@ -34,12 +35,16 @@ function o(e, t) {
34
35
  return t;
35
36
  }
36
37
  function s(s) {
37
- 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;
38
+ 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) => {
39
+ if (m !== "multiple") return !1;
40
+ let t = s.mixedValues;
41
+ return t !== void 0 && t.includes(e) && !g(e);
42
+ }, v = -1;
38
43
  if (m === "single") {
39
44
  let e = c.findIndex((e) => e.value === s.value);
40
- _ = e >= 0 && !c[e].disabled ? e : r(c);
41
- } else _ = r(c);
42
- let v = (e) => () => {
45
+ v = e >= 0 && !c[e].disabled ? e : r(c);
46
+ } else v = r(c);
47
+ let y = (e) => () => {
43
48
  let t = c[e];
44
49
  if (!t.disabled) if (m === "multiple") {
45
50
  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) {
51
56
  }
52
57
  s.onChange(t.value);
53
58
  }
54
- }, y = (e) => {
59
+ }, b = (e) => {
55
60
  let t = h.current;
56
61
  t && t.querySelectorAll(`.${n.segment}`)[e]?.focus();
57
- }, b = (e) => (t) => {
62
+ }, x = (e) => (t) => {
58
63
  let n = -1;
59
64
  switch (t.key) {
60
65
  case "ArrowLeft":
@@ -73,7 +78,7 @@ function s(s) {
73
78
  break;
74
79
  case " ":
75
80
  case "Enter":
76
- m === "multiple" && (t.preventDefault(), v(e)());
81
+ m === "multiple" && (t.preventDefault(), y(e)());
77
82
  return;
78
83
  default: return;
79
84
  }
@@ -82,9 +87,9 @@ function s(s) {
82
87
  let e = c[n];
83
88
  s.onChange(e.value);
84
89
  }
85
- y(n);
90
+ b(n);
86
91
  }
87
- }, x = d === void 0 ? void 0 : { "--wzl-tb-height": `${d}px` };
92
+ }, S = d === void 0 ? void 0 : { "--wzl-tb-height": `${d}px` };
88
93
  return /* @__PURE__ */ t("div", {
89
94
  ref: h,
90
95
  className: [
@@ -95,20 +100,24 @@ function s(s) {
95
100
  ].filter(Boolean).join(" "),
96
101
  role: m === "multiple" ? "group" : "radiogroup",
97
102
  "aria-label": l,
98
- style: x,
103
+ style: S,
99
104
  children: c.map((e, r) => {
100
- let i = g(e.value), a = `${n.segment}${i ? ` ${n.segmentSelected}` : ""}`;
105
+ let i = g(e.value), a = _(e.value), o = [
106
+ n.segment,
107
+ i && n.segmentSelected,
108
+ a && n.segmentMixed
109
+ ].filter(Boolean).join(" ");
101
110
  return /* @__PURE__ */ t("button", {
102
111
  type: "button",
103
112
  role: m === "multiple" ? void 0 : "radio",
104
113
  "aria-checked": m === "multiple" ? void 0 : i,
105
- "aria-pressed": m === "multiple" ? i : void 0,
114
+ "aria-pressed": m === "multiple" ? a ? "mixed" : i : void 0,
106
115
  "aria-label": e.ariaLabel,
107
116
  disabled: e.disabled,
108
- tabIndex: r === _ ? 0 : -1,
109
- className: a,
110
- onClick: v(r),
111
- onKeyDown: b(r),
117
+ tabIndex: r === v ? 0 : -1,
118
+ className: o,
119
+ onClick: y(r),
120
+ onKeyDown: x(r),
112
121
  children: e.label
113
122
  }, e.value);
114
123
  })
@@ -117,4 +126,4 @@ function s(s) {
117
126
  //#endregion
118
127
  export { s as t };
119
128
 
120
- //# sourceMappingURL=ToggleBar-BfcvLaOr.js.map
129
+ //# sourceMappingURL=ToggleBar-Defj6Asn.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ToggleBar-Defj6Asn.js","names":[],"sources":["../../src/components/ToggleBar/ToggleBar.module.css","../../src/components/ToggleBar/ToggleBar.tsx"],"sourcesContent":["/* Aqua-glass segmented control. The track is a pill-shaped well; the\n selected segment becomes a tinted glass cylinder that reads as the same\n \"lozenge\" family as the standalone Button. Visual params come from the\n `--btn-*` custom properties (see Button.module.css) so the Button Lab\n can tune both surfaces with one set of sliders. */\n.root {\n display: inline-flex;\n height: var(--wzl-tb-height, 28px);\n padding: 2px;\n background: linear-gradient(\n 180deg,\n rgba(0, 0, 0, 0.18) 0%,\n rgba(0, 0, 0, 0.05) 100%\n );\n border-radius: 999px;\n /* Clip segments to the track outline so interior corners read crisp and\n the selected segment's glass treatment doesn't paint over the rounded\n outer pixels. */\n overflow: hidden;\n box-shadow:\n inset 0 1px 2px rgba(0, 0, 0, 0.4),\n 0 1px 0 rgba(255, 255, 255, 0.06);\n user-select: none;\n -webkit-user-select: none;\n touch-action: none;\n}\n\n.segment {\n position: relative;\n flex: 1 1 0;\n min-width: 0;\n padding: 0 12px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: transparent;\n border: none;\n margin: 0;\n font-family: var(--wzl-font-ui);\n font-weight: 300;\n font-size: var(--btn-fontsize, 14px);\n line-height: 1;\n color: var(--wzl-fg-muted);\n cursor: pointer;\n /* Only round the outer corners of the bar — middle segments stay square\n so the seams between them don't render as facing parentheses. */\n border-radius: 0;\n isolation: isolate;\n overflow: hidden;\n transition: color var(--wzl-motion-fast);\n}\n\n.segment:first-child {\n border-radius: 999px 0 0 999px;\n}\n\n.segment:last-child {\n border-radius: 0 999px 999px 0;\n}\n\n.segment:only-child {\n border-radius: 999px;\n}\n\n.segment:focus-visible {\n outline: 2px solid var(--wzl-accent);\n outline-offset: -2px;\n}\n\n.segment:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.segment:hover:not(:disabled):not(.segmentSelected) {\n color: var(--wzl-fg);\n}\n\n/* Selected segment — full Aqua glass cylinder. Mirrors Button.variant_primary. */\n.segmentSelected {\n background: linear-gradient(\n 180deg,\n color-mix(in srgb, var(--wzl-accent) var(--btn-top-alpha, 45%), transparent) 0%,\n color-mix(in srgb, var(--wzl-accent) var(--btn-upper-alpha, 70%), transparent) calc(var(--btn-equator, 52%) - var(--btn-equator-spread, 12%)),\n color-mix(in srgb, var(--wzl-accent) var(--btn-equator-tint, 95%), white) var(--btn-equator, 52%),\n var(--wzl-accent) calc(var(--btn-equator, 52%) + var(--btn-equator-spread, 12%) * 1.6),\n color-mix(in srgb, var(--wzl-accent) var(--btn-base-tint, 70%), black) 100%\n );\n backdrop-filter: blur(var(--btn-blur, 6px)) saturate(var(--btn-saturate, 1.3));\n -webkit-backdrop-filter: blur(var(--btn-blur, 6px)) saturate(var(--btn-saturate, 1.3));\n color: var(--wzl-fg-on-accent);\n text-shadow:\n 0 1px 0 rgba(0, 0, 0, var(--btn-text-shadow, 0.35)),\n var(--btn-text-inset-x, 0px) var(--btn-text-inset-y, 1px) 0 rgba(0, 0, 0, var(--btn-text-inset, 0.55)),\n 0 0 6px rgba(0, 0, 0, calc(var(--btn-text-shadow, 0.35) * 0.5));\n box-shadow:\n inset 0 1px 0 rgba(255, 255, 255, var(--btn-inset-hi, 0.42)),\n inset 0 -1px 2px rgba(0, 0, 0, var(--btn-inset-lo, 0.3)),\n 0 0 0 1px rgba(0, 0, 0, var(--btn-rim, 0.22)),\n 0 1px 2px rgba(0, 0, 0, var(--btn-drop-near, 0.3)),\n 0 2px 4px rgba(0, 0, 0, calc(var(--btn-drop-far, 0.18) * 0.8));\n}\n\n/* Specular gloss on the selected segment. Top corners inherit the\n segment's radius so they hug the upper edge cleanly; bottom corners\n are flattened so the gloss ends in a straight line at the equator\n instead of two little curves that read as `)(` brackets. */\n.segmentSelected::before {\n content: '';\n position: absolute;\n inset: 1px 1px var(--btn-gloss-bottom, 50%) 1px;\n border-radius: inherit;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n background: linear-gradient(\n 180deg,\n rgba(255, 255, 255, var(--btn-gloss-top, 0.42)) 0%,\n rgba(255, 255, 255, var(--btn-gloss-mid, 0.12)) 60%,\n rgba(255, 255, 255, 0) 100%\n );\n pointer-events: none;\n z-index: 1;\n}\n\n.segmentSelected > * {\n position: relative;\n z-index: 2;\n}\n\n/* Mixed segment (`aria-pressed=\"mixed\"`) — the sources disagree. Reads as a\n deliberate third state rather than a dimmed \"on\": a flat accent wash with\n none of the selected segment's gloss/cylinder treatment, so it can't be\n mistaken for the glass lozenge at a glance. */\n.segmentMixed {\n background: color-mix(in srgb, var(--wzl-accent) 22%, transparent);\n color: var(--wzl-fg);\n box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--wzl-accent) 45%, transparent);\n}\n\n.segmentMixed:hover:not(:disabled) {\n background: color-mix(in srgb, var(--wzl-accent) 32%, transparent);\n}\n\n.variant_minimal .segmentMixed {\n background: color-mix(in srgb, var(--wzl-accent) 18%, transparent);\n box-shadow: none;\n color: var(--wzl-fg);\n}\n\n/* Small variant — ~60% of the default height, with proportionally reduced\n padding and font. Sized for dense surfaces (lab control panels, inline\n filters, etc.). */\n.size_sm {\n height: 17px;\n padding: 1px;\n}\n\n.size_sm .segment {\n padding: 0 8px;\n font-size: 11px;\n}\n\n/* Minimal variant — strips the pill track, glass selected state, inset\n shadows, and outer padding. Used in dense diagnostic surfaces (dispatch\n trace, lab inspectors) where the bar must read as plain text controls. */\n.variant_minimal {\n height: auto;\n padding: 0;\n background: none;\n border: 1px solid var(--wzl-border, rgba(255, 255, 255, 0.18));\n border-radius: 3px;\n box-shadow: none;\n gap: 0;\n}\n\n.variant_minimal .segment {\n padding: 0 6px;\n font-size: 11px;\n font-weight: 400;\n line-height: 1.4;\n border-radius: 0;\n color: var(--wzl-fg-muted);\n transition: none;\n}\n\n/* Dividers between segments make the mutual-exclusion grouping visible\n without a heavy track. Only the inner edges get a rule — the outer\n border on `.variant_minimal` handles the perimeter. */\n.variant_minimal .segment + .segment {\n border-left: 1px solid var(--wzl-border, rgba(255, 255, 255, 0.18));\n}\n\n.variant_minimal .segment:first-child,\n.variant_minimal .segment:last-child,\n.variant_minimal .segment:only-child {\n border-radius: 0;\n}\n\n.variant_minimal .segment:hover:not(:disabled):not(.segmentSelected) {\n color: var(--wzl-fg);\n background: rgba(255, 255, 255, 0.06);\n}\n\n.variant_minimal .segmentSelected {\n background: none;\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n color: var(--wzl-accent-fg, var(--wzl-accent));\n text-shadow: none;\n box-shadow: none;\n font-weight: 500;\n}\n\n.variant_minimal .segmentSelected::before {\n content: none;\n}\n","import { useRef, type CSSProperties, type KeyboardEvent as ReactKeyboardEvent, type ReactElement, type ReactNode } from 'react';\nimport s from './ToggleBar.module.css';\n\nexport type ToggleBarItem<V extends string | number = string> = {\n value: V;\n label?: ReactNode;\n ariaLabel?: string;\n disabled?: boolean;\n};\n\nexport type ToggleBarSize = 'sm' | 'md';\nexport type ToggleBarVariant = 'default' | 'minimal';\n\ntype CommonProps = {\n ariaLabel?: string;\n className?: string;\n height?: number;\n /** Size variant. `sm` is ~60% of the default height with reduced padding\n * and font size — sized for dense surfaces like lab control panels. */\n size?: ToggleBarSize;\n /** Visual variant. `minimal` strips the pill track and glass treatment;\n * selection becomes a flat accent. For dense diagnostic surfaces. */\n variant?: ToggleBarVariant;\n};\n\nexport type ToggleBarProps<V extends string | number = string> =\n | (CommonProps & {\n mode?: 'single';\n items: readonly ToggleBarItem<V>[];\n value: V | null;\n onChange: (next: V | null) => void;\n allowDeselect?: boolean;\n })\n | (CommonProps & {\n mode: 'multiple';\n items: readonly ToggleBarItem<V>[];\n value: readonly V[];\n /**\n * Values that are neither on nor off — the sources this bar\n * aggregates disagree (a text range that is bold in part of it, a\n * multi-selection whose nodes differ). Rendered `aria-pressed=\"mixed\"`,\n * the ARIA tri-state a toggle button actually has, rather than\n * `SelectionPanel`'s reduced-opacity-plus-`title` workaround for\n * `Switch`, which has no indeterminate state to render.\n *\n * `value` wins where the two lists overlap, so a caller that can't\n * cheaply keep them disjoint doesn't get an ambiguous segment.\n *\n * Clicking a mixed segment turns it fully **on**, matching the\n * everywhere-else convention (and `toggleFlagInRange`'s rule for a\n * partially-styled text range) that a mixed toggle resolves toward\n * the affirmative rather than clearing.\n */\n mixedValues?: readonly V[];\n onChange: (next: V[]) => void;\n });\n\nfunction firstEnabledIndex(items: readonly ToggleBarItem<string | number>[]): number {\n for (let i = 0; i < items.length; i++) if (!items[i].disabled) return i;\n return -1;\n}\n\nfunction lastEnabledIndex(items: readonly ToggleBarItem<string | number>[]): number {\n for (let i = items.length - 1; i >= 0; i--) if (!items[i].disabled) return i;\n return -1;\n}\n\nfunction nextEnabledIndex(items: readonly ToggleBarItem<string | number>[], from: number): number {\n const n = items.length;\n for (let k = 1; k <= n; k++) {\n const i = (from + k + n) % n;\n if (!items[i].disabled) return i;\n }\n return from;\n}\n\nfunction prevEnabledIndex(items: readonly ToggleBarItem<string | number>[], from: number): number {\n const n = items.length;\n for (let k = 1; k <= n; k++) {\n const i = (from - k + n) % n;\n if (!items[i].disabled) return i;\n }\n return from;\n}\n\nexport function ToggleBar<V extends string | number = string>(props: ToggleBarProps<V>): ReactElement {\n const { items, ariaLabel, className, height, size, variant } = props;\n const mode = props.mode ?? 'single';\n const rootRef = useRef<HTMLDivElement | null>(null);\n\n const isSelected = (value: V): boolean => {\n if (mode === 'multiple') return (props.value as readonly V[]).includes(value);\n return (props.value as V | null) === value;\n };\n\n /** Mixed only in multiple mode, and only where `value` doesn't already\n * claim the segment. Single mode has nothing to be mixed about — its\n * aggregate is one value or none. */\n const isMixed = (value: V): boolean => {\n if (mode !== 'multiple') return false;\n const mixed = (props as { mixedValues?: readonly V[] }).mixedValues;\n return mixed !== undefined && mixed.includes(value) && !isSelected(value);\n };\n\n let tabStopIndex = -1;\n if (mode === 'single') {\n const sel = items.findIndex(it => it.value === (props.value as V | null));\n tabStopIndex = sel >= 0 && !items[sel].disabled ? sel : firstEnabledIndex(items);\n } else {\n tabStopIndex = firstEnabledIndex(items);\n }\n\n const handleClick = (index: number) => () => {\n const item = items[index];\n if (item.disabled) return;\n if (mode === 'multiple') {\n const current = props.value as readonly V[];\n const next = current.includes(item.value)\n ? current.filter(v => v !== item.value)\n : [...current, item.value];\n (props.onChange as (n: V[]) => void)(next);\n } else {\n const current = props.value as V | null;\n if (current === item.value) {\n if ((props as { allowDeselect?: boolean }).allowDeselect) {\n (props.onChange as (n: V | null) => void)(null);\n }\n return;\n }\n (props.onChange as (n: V | null) => void)(item.value);\n }\n };\n\n const focusSegment = (index: number) => {\n const root = rootRef.current;\n if (!root) return;\n const buttons = root.querySelectorAll<HTMLButtonElement>(`.${s.segment}`);\n buttons[index]?.focus();\n };\n\n const handleKeyDown = (index: number) => (e: ReactKeyboardEvent<HTMLButtonElement>) => {\n let nextIndex = -1;\n switch (e.key) {\n case 'ArrowLeft':\n case 'ArrowUp':\n nextIndex = prevEnabledIndex(items, index);\n break;\n case 'ArrowRight':\n case 'ArrowDown':\n nextIndex = nextEnabledIndex(items, index);\n break;\n case 'Home':\n nextIndex = firstEnabledIndex(items);\n break;\n case 'End':\n nextIndex = lastEnabledIndex(items);\n break;\n case ' ':\n case 'Enter':\n if (mode === 'multiple') {\n e.preventDefault();\n handleClick(index)();\n }\n return;\n default:\n return;\n }\n if (nextIndex < 0 || nextIndex === index) return;\n e.preventDefault();\n if (mode === 'single') {\n const item = items[nextIndex];\n (props.onChange as (n: V | null) => void)(item.value);\n }\n focusSegment(nextIndex);\n };\n\n const style: CSSProperties | undefined = height !== undefined\n ? ({ ['--wzl-tb-height' as string]: `${height}px` } as CSSProperties)\n : undefined;\n\n const rootCls = [\n s.root,\n size && s[`size_${size}`],\n variant && s[`variant_${variant}`],\n className,\n ].filter(Boolean).join(' ');\n\n return (\n <div\n ref={rootRef}\n className={rootCls}\n role={mode === 'multiple' ? 'group' : 'radiogroup'}\n aria-label={ariaLabel}\n style={style}\n >\n {items.map((item, i) => {\n const selected = isSelected(item.value);\n const mixed = isMixed(item.value);\n const cls = [s.segment, selected && s.segmentSelected, mixed && s.segmentMixed]\n .filter(Boolean)\n .join(' ');\n return (\n <button\n key={item.value}\n type=\"button\"\n role={mode === 'multiple' ? undefined : 'radio'}\n aria-checked={mode === 'multiple' ? undefined : selected}\n aria-pressed={mode === 'multiple' ? (mixed ? 'mixed' : selected) : undefined}\n aria-label={item.ariaLabel}\n disabled={item.disabled}\n tabIndex={i === tabStopIndex ? 0 : -1}\n className={cls}\n onClick={handleClick(i)}\n onKeyDown={handleKeyDown(i)}\n >\n {item.label}\n </button>\n );\n })}\n </div>\n );\n}\n"],"mappings":"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"}
@@ -50,4 +50,4 @@ function o(o) {
50
50
  //#endregion
51
51
  export { o as t };
52
52
 
53
- //# sourceMappingURL=ToolButton-GAzBOvcR.js.map
53
+ //# sourceMappingURL=ToolButton-Dk_uJf7N.js.map
@@ -1 +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"}
1
+ {"version":3,"file":"ToolButton-Dk_uJf7N.js","names":[],"sources":["../../src/components/ToolButton/ToolButton.module.css","../../src/components/ToolButton/ToolButton.tsx"],"sourcesContent":[".button {\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 2px;\n min-width: 44px;\n padding: 6px 4px;\n background: transparent;\n border: 1px solid transparent;\n border-radius: 3px;\n color: var(--wzl-text);\n cursor: default;\n font-family: inherit;\n font-size: 10px;\n line-height: 1.1;\n}\n.button:hover:not([disabled]) {\n background: var(--wzl-button-fill-hover);\n color: var(--wzl-button-text);\n}\n.button:focus-visible {\n outline: 2px solid var(--wzl-accent);\n outline-offset: -2px;\n}\n.button.active {\n background: var(--wzl-button-fill-pressed);\n border-color: var(--wzl-accent);\n color: var(--wzl-button-text);\n}\n.button[disabled] {\n opacity: 0.4;\n}\n\n.icon { display: block; }\n.icon > svg { display: block; }\n.label { font-size: 10px; }\n.shortcut {\n color: var(--wzl-text-muted);\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 9px;\n}\n","import type { ReactNode } from 'react';\nimport { Focusable } from 'react-aria-components';\nimport { Tooltip, TooltipTrigger } from '../Tooltip';\nimport s from './ToolButton.module.css';\n\nexport interface ToolButtonProps {\n /** Icon node (typically an SVG component). */\n icon: ReactNode;\n /** Human-readable label shown under the icon. */\n label: string;\n /** Optional shortcut hint (e.g. \"V\" or \"⌘Z\"). */\n shortcut?: string;\n /** Selected/active state — toggles the active visual treatment. */\n active?: boolean;\n /** Disabled state — passes through to the underlying button. */\n disabled?: boolean;\n /**\n * When true, sets `aria-disabled=\"true\"` on the button without using the\n * native `disabled` attribute. This keeps the button focusable and reachable\n * by keyboard (roving-tabindex still applies) while marking it as ineligible\n * to screen readers. The caller is responsible for making `onClick` a no-op.\n */\n ariaDisabled?: boolean;\n /**\n * Whether this button is the currently tabbable member of its toolbar.\n * Toolbars use roving tabindex: exactly one button has `tabIndex=0` at\n * a time; the rest are `-1`. Caller manages which.\n */\n tabbable?: boolean;\n /** Click handler. */\n onClick(): void;\n /**\n * Tooltip content. Defaults to `label` (plus `shortcut` if provided).\n */\n title?: string;\n /** Additional class for the root button. */\n className?: string;\n}\n\n/**\n * Generic icon-+-label toolbar button — building block for `ToolPalette`\n * and similar surfaces. Headless about layout direction (parent group\n * supplies flex direction via `ToolGroup`). Theme via `--wzl-*` tokens.\n */\nexport function ToolButton(props: ToolButtonProps) {\n const { icon, label, shortcut, active, disabled, ariaDisabled, tabbable, onClick, title, className } = props;\n const resolvedTitle = title ?? (shortcut ? `${label} (${shortcut})` : label);\n const cls = [s.button, active && s.active, className].filter(Boolean).join(' ');\n return (\n <TooltipTrigger isDisabled={disabled}>\n <Focusable isDisabled={disabled}>\n <button\n type=\"button\"\n tabIndex={tabbable ? 0 : -1}\n className={cls}\n aria-current={active ? 'true' : undefined}\n aria-disabled={ariaDisabled ? 'true' : undefined}\n disabled={disabled}\n onClick={onClick}\n >\n <span className={s.icon} aria-hidden=\"true\">{icon}</span>\n <span className={s.label}>{label}</span>\n {shortcut && <span className={s.shortcut}>{shortcut}</span>}\n </button>\n </Focusable>\n <Tooltip>{resolvedTitle}</Tooltip>\n </TooltipTrigger>\n );\n}\n"],"mappings":";;;;;;;;;;;;AC4CA,SAAgB,EAAW,GAAwB;CACjD,IAAM,EAAE,SAAM,UAAO,aAAU,WAAQ,aAAU,iBAAc,aAAU,YAAS,UAAO,iBAAc,GACjG,IAAgB,MAAU,IAAW,GAAG,EAAM,IAAI,EAAS,KAAK,IAChE,IAAM;EAAC,EAAE;EAAQ,KAAU,EAAE;EAAQ;EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;CAC/E,OACE,kBAAC,GAAD;EAAgB,YAAY;YAA5B,CACE,kBAAC,GAAD;GAAW,YAAY;aACrB,kBAAC,UAAD;IACE,MAAK;IACL,UAAU,IAAW,IAAI;IACzB,WAAW;IACX,gBAAc,IAAS,SAAS,KAAA;IAChC,iBAAe,IAAe,SAAS,KAAA;IAC7B;IACD;cAPX;KASE,kBAAC,QAAD;MAAM,WAAW,EAAE;MAAM,eAAY;gBAAQ;MAAY,CAAA;KACzD,kBAAC,QAAD;MAAM,WAAW,EAAE;gBAAQ;MAAa,CAAA;KACvC,KAAY,kBAAC,QAAD;MAAM,WAAW,EAAE;gBAAW;MAAgB,CAAA;KACpD;;GACC,CAAA,EACZ,kBAAC,GAAD,EAAA,UAAU,GAAwB,CAAA,CACnB"}
@@ -22,4 +22,4 @@ function n(n) {
22
22
  //#endregion
23
23
  export { n as t };
24
24
 
25
- //# sourceMappingURL=ToolGroup-Btg47vJF.js.map
25
+ //# sourceMappingURL=ToolGroup-D8-qdtuw.js.map
@@ -1 +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"}
1
+ {"version":3,"file":"ToolGroup-D8-qdtuw.js","names":[],"sources":["../../src/components/ToolGroup/ToolGroup.module.css","../../src/components/ToolGroup/ToolGroup.tsx"],"sourcesContent":[".group {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n.group.horizontal {\n flex-direction: row;\n}\n","import type { ReactNode } from 'react';\nimport s from './ToolGroup.module.css';\n\nexport interface ToolGroupProps {\n children: ReactNode;\n /**\n * Lays children along an axis. `'vertical'` (default) stacks them in\n * a column; `'horizontal'` lays them in a row. Independent of the\n * parent toolbar's own orientation.\n */\n orientation?: 'vertical' | 'horizontal';\n /**\n * Optional `data-group` attribute — useful for parents that want to\n * select the group from CSS or tests by name.\n */\n groupKey?: string;\n /** Accessible name for the group (rendered as `aria-label`). */\n ariaLabel?: string;\n className?: string;\n}\n\n/**\n * Generic toolbar group — a `role=\"group\"` flex container that arranges\n * `<ToolButton>`s (or any children) along a chosen axis. No visual chrome\n * beyond layout; theming lives on the buttons.\n */\nexport function ToolGroup(props: ToolGroupProps) {\n const { children, orientation = 'vertical', groupKey, ariaLabel, className } = props;\n const cls = [s.group, orientation === 'horizontal' && s.horizontal, className]\n .filter(Boolean).join(' ');\n return (\n <div className={cls} role=\"group\" data-group={groupKey} aria-label={ariaLabel}>\n {children}\n </div>\n );\n}\n"],"mappings":";;;;;;;AC0BA,SAAgB,EAAU,GAAuB;CAC/C,IAAM,EAAE,aAAU,iBAAc,YAAY,aAAU,cAAW,iBAAc;CAG/E,OACE,kBAAC,OAAD;EAAK,WAHK;GAAC,EAAE;GAAO,MAAgB,gBAAgB,EAAE;GAAY;GAAU,CAC3E,OAAO,QAAQ,CAAC,KAAK,IAEN;EAAK,MAAK;EAAQ,cAAY;EAAU,cAAY;EACjE;EACG,CAAA"}
@@ -0,0 +1,27 @@
1
+ import { jsx as e, jsxs as t } from "react/jsx-runtime";
2
+ var n = {
3
+ root: "_root_zcxef_13",
4
+ label: "_label_zcxef_25",
5
+ controls: "_controls_zcxef_6"
6
+ };
7
+ //#endregion
8
+ //#region src/components/ToolOptionsBar/ToolOptionsBar.tsx
9
+ function r(r) {
10
+ let { label: i, children: a, className: o } = r;
11
+ return /* @__PURE__ */ t("div", {
12
+ className: [n.root, o].filter(Boolean).join(" "),
13
+ role: "toolbar",
14
+ "aria-label": i,
15
+ children: [i !== void 0 && /* @__PURE__ */ e("span", {
16
+ className: n.label,
17
+ children: i
18
+ }), /* @__PURE__ */ e("div", {
19
+ className: n.controls,
20
+ children: a
21
+ })]
22
+ });
23
+ }
24
+ //#endregion
25
+ export { r as t };
26
+
27
+ //# sourceMappingURL=ToolOptionsBar-ChiL-HVA.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ToolOptionsBar-ChiL-HVA.js","names":[],"sources":["../../src/components/ToolOptionsBar/ToolOptionsBar.module.css","../../src/components/ToolOptionsBar/ToolOptionsBar.tsx"],"sourcesContent":["/* Horizontal strip reserved above the workspace for contextual tool\n options. Fixed height so mounting/unmounting content never resizes\n the workspace beneath it — that's the whole reason this row exists\n as permanent chrome rather than an on-demand overlay.\n\n Overflow: when controls exceed the available width, `.controls`\n scrolls horizontally rather than wrapping (which would grow the row\n and defeat the fixed-height guarantee above) or clipping (which\n would hide controls with no way to reach them). A flyout/long-press\n affordance was considered and rejected — grouped, directly visible\n layouts are preferred in this repo. */\n\n.root {\n display: flex;\n align-items: center;\n gap: 8px;\n height: var(--wzl-tb-height, 28px);\n padding: 0 8px;\n background: var(--wzl-panel-bg);\n border-bottom: 1px solid var(--wzl-panel-border);\n color: var(--wzl-text);\n overflow: hidden;\n}\n\n.label {\n flex: 0 0 auto;\n font-size: 11px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--wzl-text-muted);\n white-space: nowrap;\n}\n\n.controls {\n display: flex;\n align-items: center;\n gap: 6px;\n flex: 1 1 auto;\n min-width: 0;\n height: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: thin;\n}\n\n/* Firefox gets a thin scrollbar for free via `scrollbar-width` above.\n * Chromium/WebKit need it spelled out — on a classic (non-overlay)\n * scrollbar theme (default on Windows Chrome/Edge), an unstyled\n * horizontal scrollbar is ~15-17px tall and renders *inside* this box,\n * clipping/off-centering the row's controls. That would reintroduce the\n * exact height instability the scroll-over-wrap overflow choice above\n * exists to avoid — just at the row's inner edge instead of its outer\n * one. Pin it thin and out of the way instead. */\n.controls::-webkit-scrollbar {\n height: 4px;\n}\n.controls::-webkit-scrollbar-track {\n background: transparent;\n}\n.controls::-webkit-scrollbar-thumb {\n background: var(--wzl-panel-border);\n border-radius: 2px;\n}\n","import type { ReactNode } from 'react';\nimport s from './ToolOptionsBar.module.css';\n\nexport interface ToolOptionsBarProps {\n /**\n * Context label for the row — e.g. the active tool's name. Rendered\n * before the children and doubles as the toolbar's `aria-label`. Omit\n * it and the row still renders (it's a permanently reserved slot), just\n * without an accessible name.\n *\n * Using `label` for both the visible text and `aria-label` means a\n * screen reader announces it twice when landing on the toolbar (\"Text,\n * toolbar\", then \"Text\" again when browsing into the visible span).\n * `aria-labelledby` would avoid the echo at the cost of id plumbing and\n * an awkward no-`id`-to-point-at case when `label` is omitted. The\n * double-announcement is common enough for labelled landmark regions\n * that it's left as-is — considered, not missed.\n */\n label?: string;\n children?: ReactNode;\n className?: string;\n}\n\n/**\n * Horizontal strip reserved above the workspace for contextual tool\n * options — its first tenant is the character controls a text tool\n * exposes while a caret range is active. Pure chrome: it renders an\n * optional label and a children slot, nothing else. It knows nothing\n * about text, or about any specific tool — any tool can fill it.\n *\n * The row always renders, even with no `label` and no `children`,\n * because the app reserves its height permanently rather than mounting\n * it on demand — mounting mid-edit would resize the workspace under a\n * canvas that's sized to the page.\n *\n * `role=\"toolbar\"` without roving tabindex: the ARIA authoring practices\n * expect arrow-key roving focus across a toolbar's items, but this\n * component doesn't own or know the shape of its children — they're\n * arbitrary, possibly compound controls (`NumberField`, `Select`,\n * `ColorField`) that already use arrow keys for their own value editing.\n * Imposing roving focus here would fight those controls' own key\n * handling. Tab order falls back to normal DOM order for now; revisit\n * once the first tenant's control set is concrete and a roving-focus\n * contract can be designed in coordination with those controls.\n */\nexport function ToolOptionsBar(props: ToolOptionsBarProps) {\n const { label, children, className } = props;\n const cls = [s.root, className].filter(Boolean).join(' ');\n return (\n <div className={cls} role=\"toolbar\" aria-label={label}>\n {label !== undefined && <span className={s.label}>{label}</span>}\n <div className={s.controls}>{children}</div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;AC6CA,SAAgB,EAAe,GAA4B;CACzD,IAAM,EAAE,UAAO,aAAU,iBAAc;CAEvC,OACE,kBAAC,OAAD;EAAK,WAFK,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAEnC;EAAK,MAAK;EAAU,cAAY;YAAhD,CACG,MAAU,KAAA,KAAa,kBAAC,QAAD;GAAM,WAAW,EAAE;aAAQ;GAAa,CAAA,EAChE,kBAAC,OAAD;GAAK,WAAW,EAAE;GAAW;GAAe,CAAA,CACxC"}
@@ -1,6 +1,6 @@
1
1
  import { t as e } from "./keyGlyph-BDH5fqkO.js";
2
- import { t } from "./ToolButton-GAzBOvcR.js";
3
- import { t as n } from "./ToolGroup-Btg47vJF.js";
2
+ import { t } from "./ToolButton-Dk_uJf7N.js";
3
+ import { t as n } from "./ToolGroup-D8-qdtuw.js";
4
4
  import { Fragment as r, useRef as i } from "react";
5
5
  import { UnknownIcon as a } from "@weasel-js/core";
6
6
  import { jsx as o, jsxs as s } from "react/jsx-runtime";
@@ -114,4 +114,4 @@ function _(e) {
114
114
  //#endregion
115
115
  export { d as n, u as r, _ as t };
116
116
 
117
- //# sourceMappingURL=ToolPalette-C8V-I-uX.js.map
117
+ //# sourceMappingURL=ToolPalette-xKHzPKYf.js.map
@@ -1 +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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"}
1
+ {"version":3,"file":"ToolPalette-xKHzPKYf.js","names":[],"sources":["../../src/components/ToolPalette/ToolPalette.module.css","../../src/components/ToolPalette/formatShortcut.ts","../../src/components/ToolPalette/ToolPalette.tsx"],"sourcesContent":[".palette {\n display: flex;\n flex-direction: column;\n gap: 4px;\n background: var(--wzl-panel-bg);\n border: 1px solid var(--wzl-panel-border);\n border-radius: 4px;\n padding: 4px;\n user-select: none;\n}\n.palette.horizontal {\n flex-direction: row;\n}\n\n/* Applied to ineligible tool buttons in the active mode. */\n.ineligibleBtn {\n opacity: 0.35;\n cursor: not-allowed;\n}\n\n.separator {\n background: var(--wzl-panel-border);\n}\n.palette:not(.horizontal) .separator {\n height: 1px;\n margin: 2px 0;\n}\n.palette.horizontal .separator {\n width: 1px;\n margin: 0 2px;\n}\n","import { keyGlyph } from '../Keycaps/keyGlyph';\n\nexport interface ShortcutInput {\n key: string | readonly string[];\n mod?: boolean;\n alt?: boolean;\n shift?: boolean | 'optional';\n}\n\n/** Format a shortcut as an array of display chips, one per key — modifier\n * icons (⌘, ↑, ⌥) followed by the key glyph. UIs that want a boxed\n * per-key look render each chip in its own element. `shift: 'optional'` is\n * treated as falsy. */\nexport function formatShortcutParts(b: ShortcutInput | undefined): readonly string[] | undefined {\n if (!b) return undefined;\n const rawKey = Array.isArray(b.key) ? b.key[0] : (b.key as string);\n const parts: string[] = [];\n if (b.mod) parts.push('⌘');\n if (b.shift === true) parts.push('⇧');\n if (b.alt) parts.push('⌥');\n parts.push(keyGlyph(rawKey));\n return parts;\n}\n\n/** Format a shortcut as a single display string. Order: mod, shift, alt,\n * key. Returns `undefined` for `undefined` input so callers can `??` a\n * fallback. When `key` is an array, the first element is used. `shift: 'optional'`\n * is treated as falsy. */\nexport function formatShortcut(b: ShortcutInput | undefined): string | undefined {\n const parts = formatShortcutParts(b);\n return parts ? parts.join('') : undefined;\n}\n","import { Fragment, useRef, type ReactNode } from 'react';\nimport { UnknownIcon } from '@weasel-js/core';\nimport type { AnyTool, ToolsApi } from '@weasel-js/core';\nimport { eligibleTool, type ModeRegistry } from '@weasel-js/modes';\nimport { ToolButton } from '../ToolButton';\nimport { ToolGroup } from '../ToolGroup';\nimport s from './ToolPalette.module.css';\nimport { formatShortcut, type ShortcutInput } from './formatShortcut';\n\nconst DEFAULT_GROUP_ORDER = ['select', 'shape', 'draw', 'type', 'view'] as const;\nconst MISC = 'misc';\n\nfunction partitionByGroup(list: AnyTool[]): Map<string, AnyTool[]> {\n const groups = new Map<string, AnyTool[]>();\n for (const tool of list) {\n const g = tool.presentation?.group ?? MISC;\n const bucket = groups.get(g) ?? [];\n bucket.push(tool);\n groups.set(g, bucket);\n }\n return groups;\n}\n\nfunction orderedGroupKeys(\n groups: Map<string, AnyTool[]>,\n groupOrder: readonly string[],\n): string[] {\n const seen = new Set(groups.keys());\n const ordered: string[] = [];\n for (const known of groupOrder) {\n if (seen.has(known)) {\n ordered.push(known);\n seen.delete(known);\n }\n }\n // Unknown groups in insertion order (Map preserves it), misc last.\n for (const key of groups.keys()) {\n if (seen.has(key) && key !== MISC) {\n ordered.push(key);\n seen.delete(key);\n }\n }\n if (seen.has(MISC)) ordered.push(MISC);\n return ordered;\n}\n\nfunction resolveIcon(tool: AnyTool): ReactNode {\n const rawIcon = tool.presentation?.icon;\n if (rawIcon == null) return <UnknownIcon />;\n if (typeof rawIcon === 'function') return rawIcon(undefined);\n return rawIcon;\n}\n\nexport interface ToolPaletteProps {\n tools: ToolsApi;\n orientation?: 'vertical' | 'horizontal';\n className?: string;\n /** Derive the keyboard shortcut for a tool button from the action registry.\n * Called with the tool's id; return `undefined` to suppress a chip. When\n * omitted, falls back to `tool.keybinding` (legacy path). */\n lookupShortcut?: (toolId: string) => ShortcutInput | undefined;\n /**\n * Optional mode registry. When provided, tools whose `capabilities` do not\n * match the current mode are rendered greyed-out, aria-disabled, and their\n * onClick is suppressed. When omitted, all tools are treated as eligible\n * (preserves existing behaviour in consumers that haven't wired a registry).\n */\n modeRegistry?: ModeRegistry;\n /**\n * Presentation-group display order. Groups not listed keep their registry\n * insertion order after the listed ones; `misc` always renders last.\n * Defaults to `['select', 'shape', 'draw', 'type', 'view']`.\n */\n groupOrder?: readonly string[];\n}\n\nexport function ToolPalette(props: ToolPaletteProps) {\n const {\n tools, orientation = 'vertical', className, lookupShortcut, modeRegistry,\n groupOrder = DEFAULT_GROUP_ORDER,\n } = props;\n const list = Object.values(tools.registry);\n const groups = partitionByGroup(list);\n const groupKeys = orderedGroupKeys(groups, groupOrder);\n const cls = [s.palette, orientation === 'horizontal' && s.horizontal, className]\n .filter(Boolean).join(' ');\n\n const orderedIds = groupKeys.flatMap((k) => groups.get(k)!.map((t) => t.id));\n const tabbableId = tools.active && orderedIds.includes(tools.active)\n ? tools.active\n : orderedIds[0];\n const rootRef = useRef<HTMLDivElement | null>(null);\n\n function onKeyDown(e: React.KeyboardEvent<HTMLDivElement>) {\n const target = e.target as HTMLElement;\n if (target.tagName !== 'BUTTON') return;\n const root = rootRef.current;\n if (!root) return;\n const buttons = Array.from(root.querySelectorAll<HTMLButtonElement>('button'));\n const i = buttons.indexOf(target as HTMLButtonElement);\n if (i < 0) return;\n\n let next = -1;\n switch (e.key) {\n case 'ArrowDown':\n case 'ArrowRight':\n next = (i + 1) % buttons.length;\n break;\n case 'ArrowUp':\n case 'ArrowLeft':\n next = (i - 1 + buttons.length) % buttons.length;\n break;\n case 'Home':\n next = 0;\n break;\n case 'End':\n next = buttons.length - 1;\n break;\n }\n if (next >= 0) {\n e.preventDefault();\n buttons[next].focus();\n }\n }\n\n return (\n <div\n ref={rootRef}\n className={cls}\n role=\"toolbar\"\n aria-label=\"Tools\"\n onKeyDown={onKeyDown}\n >\n {groupKeys.map((key, i) => (\n <Fragment key={key}>\n {i > 0 && (\n <div\n className={s.separator}\n role=\"separator\"\n aria-orientation={orientation === 'horizontal' ? 'vertical' : 'horizontal'}\n />\n )}\n <ToolGroup orientation={orientation} groupKey={key}>\n {groups.get(key)!.map((tool) => {\n const label = tool.presentation?.label ?? tool.id;\n const shortcut = tool.presentation?.shortcut\n ?? formatShortcut(lookupShortcut ? lookupShortcut(tool.id) : tool.keybinding);\n const enabled = modeRegistry ? eligibleTool(modeRegistry, tool) : true;\n const modeName = modeRegistry ? modeRegistry.current().id : undefined;\n const resolvedTitle = !enabled && modeName\n ? `${label}${shortcut ? ` (${shortcut})` : ''} — disabled in ${modeName} mode`\n : undefined;\n return (\n <ToolButton\n key={tool.id}\n icon={resolveIcon(tool)}\n label={label}\n shortcut={shortcut}\n active={tools.active === tool.id}\n tabbable={tool.id === tabbableId}\n ariaDisabled={!enabled}\n className={!enabled ? s.ineligibleBtn : undefined}\n title={resolvedTitle}\n onClick={enabled ? () => tools.setActive(tool.id) : () => {}}\n />\n );\n })}\n </ToolGroup>\n </Fragment>\n ))}\n </div>\n );\n}\n"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../chunks/Callout-CvTKW1sd.js";
1
+ import { n as e, t } from "../../chunks/Callout-Dt0kBIls.js";
2
2
  export { t as Callout, e as CalloutTrigger };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/Checkbox-BeWFZr1M.js";
1
+ import { t as e } from "../../chunks/Checkbox-CtK8H_OQ.js";
2
2
  export { e as Checkbox };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/ColorField-B7vHaU5G.js";
1
+ import { t as e } from "../../chunks/ColorField-sGLnThpB.js";
2
2
  export { e as ColorField };
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../chunks/ComboBox-yfrxG0_I.js";
1
+ import { n as e, t } from "../../chunks/ComboBox-pH8aDEL2.js";
2
2
  export { t as ComboBox, e as ComboBoxItem };
@@ -1,2 +1,2 @@
1
- import { a as e, i as t, n, o as r, r as i, t as a } from "../../chunks/CurveEditor-BEQtef4P.js";
1
+ import { a as e, i as t, n, o as r, r as i, t as a } from "../../chunks/CurveEditor-DrORWShU.js";
2
2
  export { n as CurveEditor, i as LayeredCurveEditor, t as createFunctionLayer, a as createSetCurveOp, e as functionLayerState, r as sampleByInterpolation };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/Dialog-tAi14bY3.js";
1
+ import { t as e } from "../../chunks/Dialog-CQymDCAl.js";
2
2
  export { e as Dialog };
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../chunks/Field-4cagmYlT.js";
1
+ import { n as e, t } from "../../chunks/Field-BHSu2F3E.js";
2
2
  export { t as Field, e as fieldClasses };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/Input-DRei6KJr.js";
1
+ import { t as e } from "../../chunks/Input-D_Xzgr2b.js";
2
2
  export { e as Input };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/NumberField-BAmJwxw0.js";
1
+ import { t as e } from "../../chunks/NumberField-BQmELz32.js";
2
2
  export { e as NumberField };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/PointPlotter-Dvh5cyOC.js";
1
+ import { t as e } from "../../chunks/PointPlotter-D528sBdT.js";
2
2
  export { e as PointPlotter };
@@ -1,3 +1,3 @@
1
1
  import { n as e } from "../../chunks/Badge-DU8ihE7Z.js";
2
- import { t } from "../../chunks/Powerline-W_yqAVMc.js";
2
+ import { t } from "../../chunks/Powerline-C8rddbbK.js";
3
3
  export { e as EDGE_PROFILES, t as Powerline };
@@ -1,2 +1,2 @@
1
- import { a as e, i as t, n, r, t as i } from "../../chunks/Prefs-NOoGuUHy.js";
1
+ import { a as e, i as t, n, r, t as i } from "../../chunks/Prefs-snBejOzK.js";
2
2
  export { i as PrefsDialog, n as PrefsForm, r as isPrefLeaf, t as prefValueAtPath, e as visiblePrefSubtree };
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../chunks/RadioGroup-DUlTy95a.js";
1
+ import { n as e, t } from "../../chunks/RadioGroup-Ci-I9NEx.js";
2
2
  export { t as Radio, e as RadioGroup };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/RangeSlider-Bks9GQuO.js";
1
+ import { t as e } from "../../chunks/RangeSlider-CW-edtNx.js";
2
2
  export { e as RangeSlider };
@@ -1,2 +1,2 @@
1
- import { n as e, t } from "../../chunks/Select-BV70VU5O.js";
1
+ import { n as e, t } from "../../chunks/Select-l7pAkVEG.js";
2
2
  export { t as Select, e as SelectItem };
@@ -1 +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"}
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,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"}
@@ -1,3 +1,3 @@
1
1
  export { SelectionPanel, type SelectionPanelProps, type PropertyRenderer, type PropertyRenderContext, } from './SelectionPanel';
2
- export { MIXED, aggregateValue, classifyKind, effectiveSections, kindBreakdown, splitNodePath, type Mixed, type PanelLeaf, type PanelRow, type PanelSection, } from './model';
2
+ export { MIXED, aggregateValue, classifyKind, effectiveSections, kindBreakdown, nodeValueAt, setAtPath, type Mixed, type PanelLeaf, type PanelRow, type PanelSection, } from './model';
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +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"}
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,WAAW,EACX,SAAS,EACT,KAAK,KAAK,EACV,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,YAAY,GAClB,MAAM,SAAS,CAAC"}
@@ -1,2 +1,2 @@
1
- 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";
2
- export { n as MIXED, o as SelectionPanel, i as aggregateValue, t as classifyKind, e as effectiveSections, r as kindBreakdown, a as splitNodePath };
1
+ import { a as e, c as t, i as n, n as r, o as i, r as a, s as o, t as s } from "../../chunks/SelectionPanel-CMglTgEf.js";
2
+ 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 };
@@ -1,7 +1,6 @@
1
- import type { NodePropertiesEntry, NodeRoutingEntry, SceneNode, ToolPrefLeaf } from '@weasel-js/core';
2
- /** Sentinel for "selected nodes disagree at this path". */
3
- export declare const MIXED: unique symbol;
4
- export type Mixed = typeof MIXED;
1
+ import { MIXED, type Mixed, type NodePropertiesEntry, type NodeRoutingEntry, type SceneNode, type ToolPrefLeaf } from '@weasel-js/core';
2
+ export { MIXED };
3
+ export type { Mixed };
5
4
  export type AnyNode = SceneNode<unknown, string, unknown>;
6
5
  export interface PanelLeaf {
7
6
  /** Dotted node path — the leaf's key in the schema. */
@@ -28,14 +27,17 @@ export declare function classifyKind(node: AnyNode, routing: readonly NodeRoutin
28
27
  * contribute nothing, so their presence collapses the intersection.
29
28
  */
30
29
  export declare function effectiveSections(kinds: readonly string[], entries: readonly NodePropertiesEntry[]): PanelSection[];
31
- /** Split a two-segment node path (`pose.x` / `data.fill`) into its root
32
- * and key. Returns `null` for a dotless path. */
33
- export declare function splitNodePath(path: string): {
34
- head: string;
35
- key: string;
36
- } | null;
37
- /** Read a node value at a two-segment path (`pose.x` / `data.fill`). */
30
+ /** Read a node value at a dotted path of any depth (`pose.x`,
31
+ * `data.style.fontSize`, `data.style.fill.color`). Returns `undefined` if
32
+ * the path is dotless (mirrors `commit`'s no-op on a malformed schema
33
+ * key) or if any intermediate segment is missing or not an object. */
38
34
  export declare function nodeValueAt(node: AnyNode, path: string): unknown;
35
+ /** Immutably set `value` at a dotted path within `root`, cloning each level
36
+ * on the way down so React sees new object identities. Arrays stay arrays
37
+ * (an array intermediate is shallow-copied, not flattened into `{0: ...}`)
38
+ * — this is the write-side twin of `nodeValueAt`, so a schema author who
39
+ * gets a working read gets a working write. */
40
+ export declare function setAtPath(root: object, segments: readonly string[], value: unknown): object;
39
41
  /** Aggregate a path across nodes: the shared value, or `MIXED`. */
40
42
  export declare function aggregateValue(nodes: readonly AnyNode[], path: string): unknown | Mixed;
41
43
  /** `'rect ×2 · text'` — kinds in first-seen order with counts. */
@@ -1 +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"}
1
+ {"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"}
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/Sidebar-Bk9_TPhX.js";
1
+ import { t as e } from "../../chunks/Sidebar-BFcBx8QV.js";
2
2
  export { e as Sidebar };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/SidebarPanel-Nd9Od5WD.js";
1
+ import { t as e } from "../../chunks/SidebarPanel-CRnSlvee.js";
2
2
  export { e as SidebarPanel };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/Switch-iUmlnP_b.js";
1
+ import { t as e } from "../../chunks/Switch-DxJLMYki.js";
2
2
  export { e as Switch };
@@ -1,2 +1,2 @@
1
- import { i as e, n as t, r as n, t as r } from "../../chunks/Tabs-DCs-Ww2f.js";
1
+ import { i as e, n as t, r as n, t as r } from "../../chunks/Tabs-DelDecks.js";
2
2
  export { r as Tab, t as TabList, n as TabPanel, e as Tabs };
@@ -1,2 +1,2 @@
1
- import { a as e, i as t, n, r, t as i } from "../../chunks/Toast-NdSJo2vj.js";
1
+ import { a as e, i as t, n, r, t as i } from "../../chunks/Toast-Bw3XQxmV.js";
2
2
  export { n as ToastQueue, i as ToastRegion, r as createToastQueue, t as defaultToastQueue, e as toast };
@@ -28,6 +28,23 @@ export type ToggleBarProps<V extends string | number = string> = (CommonProps &
28
28
  mode: 'multiple';
29
29
  items: readonly ToggleBarItem<V>[];
30
30
  value: readonly V[];
31
+ /**
32
+ * Values that are neither on nor off — the sources this bar
33
+ * aggregates disagree (a text range that is bold in part of it, a
34
+ * multi-selection whose nodes differ). Rendered `aria-pressed="mixed"`,
35
+ * the ARIA tri-state a toggle button actually has, rather than
36
+ * `SelectionPanel`'s reduced-opacity-plus-`title` workaround for
37
+ * `Switch`, which has no indeterminate state to render.
38
+ *
39
+ * `value` wins where the two lists overlap, so a caller that can't
40
+ * cheaply keep them disjoint doesn't get an ambiguous segment.
41
+ *
42
+ * Clicking a mixed segment turns it fully **on**, matching the
43
+ * everywhere-else convention (and `toggleFlagInRange`'s rule for a
44
+ * partially-styled text range) that a mixed toggle resolves toward
45
+ * the affirmative rather than clearing.
46
+ */
47
+ mixedValues?: readonly V[];
31
48
  onChange: (next: V[]) => void;
32
49
  });
33
50
  export declare function ToggleBar<V extends string | number = string>(props: ToggleBarProps<V>): ReactElement;
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleBar.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleBar/ToggleBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGhI,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,IAAI;IAC9D,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,CAAC;AACxC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,SAAS,CAAC;AAErD,KAAK,WAAW,GAAG;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;4EACwE;IACxE,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;0EACsE;IACtE,OAAO,CAAC,EAAE,gBAAgB,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,IACzD,CAAC,WAAW,GAAG;IACb,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,EAAE,SAAS,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC;IAChB,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC,GACF,CAAC,WAAW,GAAG;IACb,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,SAAS,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,KAAK,EAAE,SAAS,CAAC,EAAE,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;CAC/B,CAAC,CAAC;AA8BP,wBAAgB,SAAS,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,YAAY,CA4HpG"}
1
+ {"version":3,"file":"ToggleBar.d.ts","sourceRoot":"","sources":["../../../src/components/ToggleBar/ToggleBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAwE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGhI,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,IAAI;IAC9D,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,CAAC;AACxC,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,SAAS,CAAC;AAErD,KAAK,WAAW,GAAG;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;4EACwE;IACxE,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;0EACsE;IACtE,OAAO,CAAC,EAAE,gBAAgB,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,IACzD,CAAC,WAAW,GAAG;IACb,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,EAAE,SAAS,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,KAAK,EAAE,CAAC,GAAG,IAAI,CAAC;IAChB,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC,GACF,CAAC,WAAW,GAAG;IACb,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,SAAS,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,KAAK,EAAE,SAAS,CAAC,EAAE,CAAC;IACpB;;;;;;;;;;;;;;;OAeG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,EAAE,CAAC;IAC3B,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;CAC/B,CAAC,CAAC;AA8BP,wBAAgB,SAAS,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,YAAY,CAwIpG"}
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/ToggleBar-BfcvLaOr.js";
1
+ import { t as e } from "../../chunks/ToggleBar-Defj6Asn.js";
2
2
  export { e as ToggleBar };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/ToolButton-GAzBOvcR.js";
1
+ import { t as e } from "../../chunks/ToolButton-Dk_uJf7N.js";
2
2
  export { e as ToolButton };
@@ -1,2 +1,2 @@
1
- import { t as e } from "../../chunks/ToolGroup-Btg47vJF.js";
1
+ import { t as e } from "../../chunks/ToolGroup-D8-qdtuw.js";
2
2
  export { e as ToolGroup };