@weasel-js/ui 1.7.3 → 1.8.1

package/dist/chunks/ToggleBar-CfYbMK3x.js

@@ -0,0 +1,84 @@
+import { r as e, t } from "./segmentTooltip-8VBPNgEc.js";
+import { t as n } from "./useRovingTabIndex-D7u22Ia_.js";
+import { i as r, n as i } from "./FitLabel-BzZGkWfL.js";
+import { jsx as a } from "react/jsx-runtime";
+import "react";
+var o = {
+	root: "_root_1rwql_6",
+	segment: "_segment_1rwql_30",
+	segmentSelected: "_segmentSelected_1rwql_84",
+	segmentMixed: "_segmentMixed_1rwql_145",
+	variant_minimal: "_variant_minimal_1rwql_155",
+	size_sm: "_size_sm_1rwql_164",
+	variant_flat: "_variant_flat_1rwql_239"
+};
+//#endregion
+//#region src/components/ToggleBar/ToggleBar.tsx
+function s(s) {
+	let { items: c, ariaLabel: l, className: u, height: d, size: f, variant: p } = s, m = s.mode ?? "single", h = (e) => m === "multiple" ? s.value.includes(e) : s.value === e, g = (e) => {
+		if (m !== "multiple") return !1;
+		let t = s.mixedValues;
+		return t !== void 0 && t.includes(e) && !h(e);
+	}, _ = (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];
+				s.onChange(n);
+			} else {
+				if (s.value === t.value) {
+					s.allowDeselect && s.onChange(null);
+					return;
+				}
+				s.onChange(t.value);
+			}
+		}
+	}, v = m === "single" ? c.findIndex((e) => e.value === s.value) : -1, y = n({
+		itemSelector: `.${o.segment}`,
+		tabStopIndex: v >= 0 ? v : void 0,
+		onNavigate: m === "single" ? (e) => s.onChange(c[e].value) : void 0,
+		onActivate: m === "multiple" ? (e) => _(e)() : void 0
+	}), b = r(y.rootRef), x = d === void 0 ? void 0 : { "--tb-h": `${d}px` }, S = [
+		o.root,
+		f && o[`size_${f}`],
+		p && o[`variant_${p}`],
+		u
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ a("div", {
+		ref: y.rootRef,
+		onKeyDown: y.onKeyDown,
+		className: S,
+		role: m === "multiple" ? "group" : "radiogroup",
+		"aria-label": l,
+		style: x,
+		children: /* @__PURE__ */ a(i, {
+			value: b,
+			children: c.map((n, r) => {
+				let i = h(n.value), s = g(n.value), c = [
+					o.segment,
+					i && o.segmentSelected,
+					s && o.segmentMixed
+				].filter(Boolean).join(" ");
+				return /* @__PURE__ */ a(t, {
+					content: e(n),
+					disabled: n.disabled,
+					children: /* @__PURE__ */ a("button", {
+						type: "button",
+						role: m === "multiple" ? void 0 : "radio",
+						"aria-checked": m === "multiple" ? void 0 : i,
+						"aria-pressed": m === "multiple" ? s ? "mixed" : i : void 0,
+						"aria-label": n.ariaLabel,
+						disabled: n.disabled,
+						className: c,
+						onClick: _(r),
+						children: n.label
+					})
+				}, n.value);
+			})
+		})
+	});
+}
+//#endregion
+export { s as t };
+
+//# sourceMappingURL=ToggleBar-CfYbMK3x.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleBar-CfYbMK3x.js","names":["s","segmentTooltipContent","useRovingTabIndex","useFitScope","FitScope","ToggleBar_module_default","ToggleBar","props","mode","isSelected","value","isMixed","mixed","handleClick","item","items","index","current","next","v","selectedIndex","it","roving","fit","style","height","rootCls","size","variant","className","ariaLabel","selected","cls","SegmentTooltip","i"],"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(--tb-h, var(--wzl-control-h));\n  padding: var(--wzl-space-1);\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: var(--wzl-radius-pill);\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  /* The track clips, so without this a squeezing row shrinks it to nothing. */\n  min-width: max-content;\n}\n\n.segment {\n  position: relative;\n  flex: 1 1 0;\n  /* Equal widths when there is room, never narrower than the label. The\n     segment clips its gloss, which otherwise drops its flex minimum to 0. */\n  min-width: max-content;\n  padding: 0 var(--wzl-space-6);\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: var(--wzl-font-weight-normal);\n  font-size: var(--btn-fontsize, var(--wzl-font-size));\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/* 8px around a 14px glyph is most of a segment. */\n.segment:has(> svg) {\n  padding: 0 5px;\n}\n\n.segment:first-of-type {\n  border-radius: var(--wzl-radius-pill) 0 0 var(--wzl-radius-pill);\n}\n\n.segment:last-of-type {\n  border-radius: 0 var(--wzl-radius-pill) var(--wzl-radius-pill) 0;\n}\n\n.segment:only-of-type {\n  border-radius: var(--wzl-radius-pill);\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  --wzl-fg-muted: var(--wzl-fg-muted-on-accent);\n  --wzl-fg-subtle: var(--wzl-fg-subtle-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 var(--wzl-space-4);\n  font-size: var(--wzl-font-size-sm);\n}\n\n/* `.size_sm .segment` outranks the glyph rule above on specificity, so a\n   small bar's glyph segments need the tight padding restated to stay\n   near-square rather than reading as wide plates. */\n.size_sm .segment:has(> svg) {\n  padding: 0 3px;\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);\n  border-radius: var(--wzl-radius-sm);\n  box-shadow: none;\n  gap: 0;\n}\n\n.variant_minimal .segment {\n  padding: 0 var(--wzl-space-3);\n  font-size: var(--wzl-font-size-sm);\n  font-weight: var(--wzl-font-weight-medium);\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);\n}\n\n.variant_minimal .segment:first-of-type,\n.variant_minimal .segment:last-of-type,\n.variant_minimal .segment:only-of-type {\n  border-radius: 0;\n}\n\n.variant_minimal .segment:hover:not(:disabled):not(.segmentSelected) {\n  color: var(--wzl-fg);\n  background: var(--wzl-surface-hover);\n}\n\n.variant_minimal .segmentSelected {\n  background: none;\n  backdrop-filter: none;\n  -webkit-backdrop-filter: none;\n  color: var(--wzl-accent-fg);\n  text-shadow: none;\n  box-shadow: none;\n  font-weight: var(--wzl-font-weight-medium);\n}\n\n.variant_minimal .segmentSelected::before {\n  content: none;\n}\n\n/* Flat variant — no track, no glass, no pill: each segment is its own\n   outlined cell. For property panels, where a bar sits in a row beside\n   inputs and the glass cylinder makes it the loudest thing on the surface. */\n.variant_flat {\n  padding: 0;\n  background: none;\n  border-radius: var(--wzl-radius-sm);\n  box-shadow: none;\n  overflow: visible;\n}\n\n.variant_flat .segment {\n  border: 1px solid var(--wzl-border-strong);\n  border-radius: 0;\n  /* Sunken, so an unselected cell sits below the panel and the selected one\n     reads as raised without needing the glass treatment back. */\n  background: var(--wzl-surface-sunken);\n  color: var(--wzl-fg-muted);\n}\n\n/* Adjacent cells share one rule rather than stacking two. */\n.variant_flat .segment ~ .segment {\n  margin-inline-start: -1px;\n}\n\n.variant_flat .segment:first-of-type {\n  border-start-start-radius: var(--wzl-radius-sm);\n  border-end-start-radius: var(--wzl-radius-sm);\n}\n\n.variant_flat .segment:last-of-type {\n  border-start-end-radius: var(--wzl-radius-sm);\n  border-end-end-radius: var(--wzl-radius-sm);\n}\n\n.variant_flat .segment:hover:not(:disabled):not(.segmentSelected) {\n  background: var(--wzl-surface-hover);\n  color: var(--wzl-fg);\n}\n\n.variant_flat .segmentSelected {\n  /* Above its neighbors, or the next cell's left border covers its right one. */\n  z-index: 1;\n  background: var(--wzl-accent);\n  color: var(--wzl-fg-on-accent);\n  --wzl-fg-muted: var(--wzl-fg-muted-on-accent);\n  --wzl-fg-subtle: var(--wzl-fg-subtle-on-accent);\n  backdrop-filter: none;\n  -webkit-backdrop-filter: none;\n  text-shadow: none;\n  box-shadow: none;\n}\n\n.variant_flat .segmentSelected::before {\n  content: none;\n}\n","import { type CSSProperties, type ReactElement, type ReactNode } from 'react';\nimport s from './ToggleBar.module.css';\nimport { useRovingTabIndex } from '../../useRovingTabIndex';\nimport { FitScope, useFitScope } from '../FitLabel/FitLabel';\nimport { SegmentTooltip, segmentTooltipContent, type SegmentTooltipFields } from '../segmentTooltip';\n\n/** One segment of a {@link ToggleBar}, identified by its `value`. */\nexport type ToggleBarItem<V extends string | number = string> = {\n  value: V;\n  label?: ReactNode;\n  ariaLabel?: string;\n  disabled?: boolean;\n} & SegmentTooltipFields;\n\n/** Segment height and type scale for a {@link ToggleBar}. */\nexport type ToggleBarSize = 'sm' | 'md';\n/** Visual treatment of a {@link ToggleBar}. */\nexport type ToggleBarVariant = 'default' | 'minimal' | 'flat';\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\n/**\n * Props for {@link ToggleBar}, discriminated on `mode`. Single mode is\n * controlled by one value or `null`; multiple mode by an array, and only it\n * accepts `mixedValues`.\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\n/**\n * Segmented control for choosing among a fixed set of values — one of them\n * (`mode: 'single'`, the default) or any number (`mode: 'multiple'`).\n *\n * Single mode ignores a click on the already-selected segment unless\n * `allowDeselect` is set. Arrow keys move focus without changing the value;\n * Space and Enter commit.\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\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  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 selectedIndex = mode === 'single'\n    ? items.findIndex(it => it.value === (props.value as V | null))\n    : -1;\n\n  const roving = useRovingTabIndex({\n    itemSelector: `.${s.segment}`,\n    // Single mode is a radiogroup: the tab stop is the current value, and\n    // arrow keys move the selection with the focus. Multiple mode is a set of\n    // independent toggles — focus alone moves, and Space/Enter flips.\n    tabStopIndex: selectedIndex >= 0 ? selectedIndex : undefined,\n    onNavigate: mode === 'single'\n      ? (index) => (props.onChange as (n: V | null) => void)(items[index].value)\n      : undefined,\n    onActivate: mode === 'multiple' ? (index) => handleClick(index)() : undefined,\n  });\n\n  // Segment labels drawn as `FitLabel`s shorten together when the bar is\n  // squeezed or will not fit where it sits.\n  const fit = useFitScope(roving.rootRef);\n\n  const style: CSSProperties | undefined = height !== undefined\n    ? ({ ['--tb-h' 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={roving.rootRef}\n      onKeyDown={roving.onKeyDown}\n      className={rootCls}\n      role={mode === 'multiple' ? 'group' : 'radiogroup'}\n      aria-label={ariaLabel}\n      style={style}\n    >\n      <FitScope value={fit}>\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            <SegmentTooltip key={item.value} content={segmentTooltipContent(item)} disabled={item.disabled}>\n              <button\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                className={cls}\n                onClick={handleClick(i)}\n              >\n                {item.label}\n              </button>\n            </SegmentTooltip>\n          );\n        })}\n      </FitScope>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AC4EA,SAAgBM,EAA8C,GAAwC;CACpG,IAAM,EAAE,UAAO,cAAW,cAAW,WAAQ,SAAM,eAAYC,GACzDC,IAAOD,EAAM,QAAQ,UAErBE,KAAc,MACdD,MAAS,aAAoBD,EAAM,MAAuB,SAASG,CAAK,IACpEH,EAAM,UAAuBG,GAMjCC,KAAW,MAAsB;EACrC,IAAIH,MAAS,YAAY,OAAO;EAChC,IAAMI,IAASL,EAAyC;EACxD,OAAOK,MAAU,KAAA,KAAaA,EAAM,SAASF,CAAK,KAAK,CAACD,EAAWC,CAAK;CAC1E,GAEMG,KAAe,YAAwB;EAC3C,IAAMC,IAAOC,EAAMC;EACnB,IAAI,GAAK,UACT;OAAIR,MAAS,YAAY;IACvB,IAAMS,IAAUV,EAAM,OAChBW,IAAOD,EAAQ,SAASH,EAAK,KAAK,IACpCG,EAAQ,QAAO,MAAKE,MAAML,EAAK,KAAK,IACpC,CAAC,GAAGG,GAASH,EAAK,KAAK;IAC3B,EAAO,SAA8BI,CAAI;GAC3C,OAAO;IAEL,IADgBX,EAAM,UACNO,EAAK,OAAO;KAC1B,AAAKP,EAAsC,iBACzCA,EAAO,SAAmC,IAAI;KAEhD;IACF;IACA,EAAO,SAAmCO,EAAK,KAAK;GACtD;;CACF,GAEMM,IAAgBZ,MAAS,WAC3BO,EAAM,WAAU,MAAMM,EAAG,UAAWd,EAAM,KAAkB,IAC5D,IAEEe,IAASpB,EAAkB;EAC/B,cAAc,IAAIF,EAAE;EAIpB,cAAcoB,KAAiB,IAAIA,IAAgB,KAAA;EACnD,YAAYZ,MAAS,YAChB,MAAWD,EAAM,SAAmCQ,EAAMC,EAAM,CAAC,KAAK,IACvE,KAAA;EACJ,YAAYR,MAAS,cAAc,MAAUK,EAAYG,CAAK,CAAC,CAAC,IAAI,KAAA;CACtE,CAAC,GAIKO,IAAMpB,EAAYmB,EAAO,OAAO,GAEhCE,IAAmCC,MAAW,KAAA,IAEhD,KAAA,IADC,EAAG,UAAqB,GAAGA,EAAO,IAAI,GAGrCC,IAAU;EACd1B,EAAE;EACF2B,KAAQ3B,EAAE,QAAQ2B;EAClBC,KAAW5B,EAAE,WAAW4B;EACxBC;CACF,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAE1B,OACE,kBAAC,OAAD;EACE,KAAKP,EAAO;EACZ,WAAWA,EAAO;EAClB,WAAWI;EACX,MAAMlB,MAAS,aAAa,UAAU;EACtC,cAAYsB;EACL;EAEP,UAAA,kBAAC1B,GAAD;GAAU,OAAOmB;GACd,UAAAR,EAAM,KAAK,GAAM,MAAM;IACtB,IAAMgB,IAAWtB,EAAWK,EAAK,KAAK,GAChCF,IAAQD,EAAQG,EAAK,KAAK,GAC1BkB,IAAM;KAAChC,EAAE;KAAS+B,KAAY/B,EAAE;KAAiBY,KAASZ,EAAE;IAAY,CAAC,CAC5E,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;IACX,OACE,kBAACiC,GAAD;KAAiC,SAAShC,EAAsBa,CAAI;KAAG,UAAUA,EAAK;KACpF,UAAA,kBAAC,UAAD;MACE,MAAK;MACL,MAAMN,MAAS,aAAa,KAAA,IAAY;MACxC,gBAAcA,MAAS,aAAa,KAAA,IAAYuB;MAChD,gBAAcvB,MAAS,aAAcI,IAAQ,UAAUmB,IAAY,KAAA;MACnE,cAAYjB,EAAK;MACjB,UAAUA,EAAK;MACf,WAAWkB;MACX,SAASnB,EAAYqB,CAAC;MAErB,UAAApB,EAAK;KACA,CAAA;IACM,GAbKA,EAAK,KAaV;GAEpB,CAAC;EACO,CAAA;CACP,CAAA;AAET"}

package/dist/chunks/{TokenPanel-WtKGY2Db.js → TokenPanel-cL37E39j.js}

@@ -1,10 +1,10 @@
-import { n as e, r as t } from "./Tooltip-C6eFCYxw.js";
-import { t as n } from "./Button-XB-T75YL.js";
-import { r } from "./Disclosure-Ch2KxYuB.js";
-import { t as i } from "./Select-ouV8O6cp.js";
+import { n as e, r as t } from "./Tooltip-DljsPEQG.js";
+import { t as n } from "./Button-CQA-K1g9.js";
+import { r } from "./Disclosure-CpWt87nO.js";
+import { t as i } from "./Select-BhHwjNsb.js";
 import { t as a } from "./Input-D7SDKbST.js";
-import { r as o } from "./NumberField-DS0WSiin.js";
-import { t as s } from "./ToggleBar-Z2jZiguF.js";
+import { t as o } from "./ToggleBar-CfYbMK3x.js";
+import { r as s } from "./NumberField-BXFrOi5M.js";
 import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
 import { memo as d, useCallback as f, useMemo as p, useState as m } from "react";
 import { Focusable as h } from "react-aria-components";
@@ -257,10 +257,10 @@ function Z({ points: e, label: t }) {
 	});
 }
 function Q({ token: e, set: t }) {
-	let { name: n, type: r, value: s } = e, d = `${n} value`, f = p(() => r === "color" ? T(s) : null, [r, s]);
+	let { name: n, type: r, value: o } = e, d = `${n} value`, f = p(() => r === "color" ? T(o) : null, [r, o]);
 	if (r === "dimension" || r === "duration" || r === "number") {
-		let e = U(s);
-		if (e) return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(o, {
+		let e = U(o);
+		if (e) return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(s, {
 			className: E.number,
 			"aria-label": d,
 			value: e.amount,
@@ -275,26 +275,26 @@ function Q({ token: e, set: t }) {
 		}) : null] });
 	}
 	if (r === "fontWeight") {
-		let e = (G.includes(s) ? G : [...G, s]).map((e) => ({
+		let e = (G.includes(o) ? G : [...G, o]).map((e) => ({
 			value: e,
 			label: e
 		}));
 		return /* @__PURE__ */ l(i, {
 			"aria-label": n,
 			width: "fit",
-			selectedKey: s,
+			selectedKey: o,
 			options: e,
 			onSelectionChange: t
 		});
 	}
-	let m = r === "cubicBezier" ? W(s) : null;
+	let m = r === "cubicBezier" ? W(o) : null;
 	return /* @__PURE__ */ u(c, { children: [m ? /* @__PURE__ */ l(Z, {
 		points: m,
 		label: `${n} curve`
 	}) : null, /* @__PURE__ */ l(a, {
 		className: E.field,
 		"aria-label": d,
-		value: s,
+		value: o,
 		onChange: t,
 		leadingAdornment: r === "color" ? f ? /* @__PURE__ */ l("input", {
 			type: "color",
@@ -304,7 +304,7 @@ function Q({ token: e, set: t }) {
 			onChange: (e) => t(e.target.value)
 		}) : /* @__PURE__ */ l("span", {
 			className: E.chip,
-			style: { "--token-color": s },
+			style: { "--token-color": o },
 			"aria-hidden": "true"
 		}) : void 0
 	})] });
@@ -368,8 +368,8 @@ function ee({ group: n, tokens: r, onChange: i }) {
 	});
 }
 function te({ token: e, label: t, showUnit: n, factor: r, onChange: i, onFactorChange: a }) {
-	let s = U(e.value);
-	return s ? /* @__PURE__ */ u("div", {
+	let o = U(e.value);
+	return o ? /* @__PURE__ */ u("div", {
 		className: E.step,
 		title: e.description || e.name,
 		"data-overridden": e.overridden ? "" : void 0,
@@ -380,18 +380,18 @@ function te({ token: e, label: t, showUnit: n, factor: r, onChange: i, onFactorC
 			}),
 			/* @__PURE__ */ u("span", {
 				className: E.stepEdit,
-				children: [/* @__PURE__ */ l(o, {
+				children: [/* @__PURE__ */ l(s, {
 					className: E.number,
 					"aria-label": `${e.name} value`,
-					value: s.amount,
+					value: o.amount,
 					hideSteppers: !0,
 					formatOptions: K,
 					onChange: (t) => {
-						Number.isFinite(t) && i(e.name, `${t}${s.unit}`);
+						Number.isFinite(t) && i(e.name, `${t}${o.unit}`);
 					}
-				}), n && s.unit ? /* @__PURE__ */ l("span", {
+				}), n && o.unit ? /* @__PURE__ */ l("span", {
 					className: E.unit,
-					children: s.unit
+					children: o.unit
 				}) : null]
 			}),
 			r !== void 0 && a ? /* @__PURE__ */ u("span", {
@@ -399,7 +399,7 @@ function te({ token: e, label: t, showUnit: n, factor: r, onChange: i, onFactorC
 				children: [/* @__PURE__ */ l("span", {
 					className: E.unit,
 					children: "×"
-				}), /* @__PURE__ */ l(o, {
+				}), /* @__PURE__ */ l(s, {
 					className: E.number,
 					"aria-label": `${e.name} factor`,
 					value: r,
@@ -446,7 +446,7 @@ function re({ group: e, scale: t, unit: n, amounts: r, onScaleChange: i }) {
 						className: E.ruleLabel,
 						children: "base"
 					}),
-					/* @__PURE__ */ l(o, {
+					/* @__PURE__ */ l(s, {
 						className: E.number,
 						"aria-label": `${e} base`,
 						value: t.base,
@@ -465,7 +465,7 @@ function re({ group: e, scale: t, unit: n, amounts: r, onScaleChange: i }) {
 					}) : null
 				]
 			}),
-			/* @__PURE__ */ l(s, {
+			/* @__PURE__ */ l(o, {
 				ariaLabel: `${e} rule`,
 				size: "sm",
 				items: ne,
@@ -482,7 +482,7 @@ function re({ group: e, scale: t, unit: n, amounts: r, onScaleChange: i }) {
 				}) : /* @__PURE__ */ l("span", {
 					className: E.unit,
 					children: "+"
-				}), /* @__PURE__ */ l(o, {
+				}), /* @__PURE__ */ l(s, {
 					className: E.number,
 					"aria-label": `${e} ${c.key}`,
 					value: c.value,
@@ -634,4 +634,4 @@ function oe({ tokens: e, onChange: t, collapsed: n, onCollapsedChange: r, scales
 //#endregion
 export { j as a, O as i, k as n, H as r, oe as t };
 
-//# sourceMappingURL=TokenPanel-WtKGY2Db.js.map
+//# sourceMappingURL=TokenPanel-cL37E39j.js.map

package/dist/chunks/{TokenPanel-WtKGY2Db.js.map → TokenPanel-cL37E39j.js.map}

@@ -1 +1 @@
-{"version":3,"file":"TokenPanel-WtKGY2Db.js","names":["s","_Fragment","NumberField","Select","Input","Button","TooltipTrigger","Tooltip","Tooltip$1","TooltipTrigger$1","Button$1","Select$1","Input$1","NumberField$1","ToggleBar","HEX","RGB","COLOR_FUNCTION","KEYWORDS","browserSupports","value","parsesAsColor","v","supports","hexOf","digits","d","rgb","n","paint","serialized","onBlack","toHex","direct","browser","TokenPanel_module_default","round2","refitScale","first","amounts","scale","last","spans","kind","a","TOKEN_CATEGORIES","TYPE_SCALE","tokenCategory","token","AMOUNT","DIMENSION","DURATION","NUMBER","LENGTH","BEZIER","GRADIENT","LAYERS","PARTS","isShadow","parts","layer","lengths","part","rest","inferTokenType","splitUnit","match","bezierPoints","x1","y1","x2","y2","WEIGHTS","NUMBER_FORMAT","SCALAR","familyKindOf","itemsOf","counts","tokens","families","items","key","familySize","family","stepLabels","split","names","name","shared","segments","Curve","points","top","bottom","label","TokenControl","hex","useMemo","type","Fragment","amount","set","options","weight","event","TokenRow","memo","useCallback","onChange","b","Family","picked","setPicked","useState","t","group","Focusable","current","ScaleStep","showUnit","factor","onFactorChange","next","RULES","ScaleRuleControls","param","rule","base","onScaleChange","unit","Scale","labels","units","overridden","generator","at","i","j","f","Section","title","DisclosureRow","open","item","scales","TokenPanel","ownCollapsed","setOwnCollapsed","closed","collapsed","byCategory","sections","category","categorize","density","className","inSection","id","prev","onCollapsedChange"],"sources":["../../src/components/TokenPanel/color.ts","../../src/components/TokenPanel/TokenPanel.module.css","../../src/components/TokenPanel/tokenTypes.ts","../../src/components/TokenPanel/TokenPanel.tsx"],"sourcesContent":["const HEX = /^#(?:[\\da-f]{3,4}|[\\da-f]{6}|[\\da-f]{8})$/i;\nconst RGB = /^rgba?\\(\\s*(\\d{1,3})[\\s,]+(\\d{1,3})[\\s,]+(\\d{1,3})\\b/i;\nconst COLOR_FUNCTION = /^(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch|color|color-mix)\\(.+\\)$/i;\nconst KEYWORDS = new Set([\n  'transparent',\n  'currentcolor',\n  'black',\n  'white',\n  'gray',\n  'silver',\n  'red',\n  'orange',\n  'yellow',\n  'gold',\n  'lime',\n  'green',\n  'teal',\n  'cyan',\n  'blue',\n  'navy',\n  'purple',\n  'magenta',\n  'pink',\n  'brown',\n]);\n\ntype Supports = ((value: string) => boolean) | null;\n\nfunction browserSupports(): Supports {\n  return typeof CSS !== 'undefined' && typeof CSS.supports === 'function'\n    ? (value) => CSS.supports('color', value)\n    : null;\n}\n\n/** Whether `value` is a CSS color — the browser's answer where it has `CSS.supports`, a small parser's otherwise. */\nexport function parsesAsColor(value: string, supports: Supports = browserSupports()): boolean {\n  const v = value.trim();\n  // `CSS.supports` accepts any `var()` for any property.\n  if (!v || v.includes('var(')) return false;\n  if (supports) return supports(v);\n  return HEX.test(v) || COLOR_FUNCTION.test(v) || KEYWORDS.has(v.toLowerCase());\n}\n\nfunction hexOf(v: string): string | null {\n  if (HEX.test(v)) {\n    const digits = v.slice(1).toLowerCase();\n    return `#${digits.length <= 4 ? [...digits.slice(0, 3)].map((d) => d + d).join('') : digits.slice(0, 6)}`;\n  }\n  const rgb = RGB.exec(v);\n  return rgb\n    ? `#${rgb\n        .slice(1, 4)\n        .map((n) => Math.min(255, Number(n)).toString(16).padStart(2, '0'))\n        .join('')}`\n    : null;\n}\n\nlet paint: CanvasRenderingContext2D | null | undefined;\n\n/** The browser's serialization of a color, through a canvas fill style; null where it has none or rejects `value`. */\nfunction serialized(value: string): string | null {\n  if (paint === undefined) {\n    try {\n      paint = document.createElement('canvas').getContext('2d');\n    } catch {\n      paint = null;\n    }\n  }\n  if (!paint) return null;\n  // A rejected value leaves the previous fill style, so two different ones tell a rejection apart.\n  paint.fillStyle = '#000000';\n  paint.fillStyle = value;\n  const onBlack = String(paint.fillStyle);\n  paint.fillStyle = '#ffffff';\n  paint.fillStyle = value;\n  return onBlack === String(paint.fillStyle) ? onBlack : null;\n}\n\n/** `value` as the `#rrggbb` a color input takes, alpha dropped; null when it cannot be converted. */\nexport function toHex(value: string): string | null {\n  const v = value.trim();\n  const direct = hexOf(v);\n  if (direct) return direct;\n  const browser = typeof document === 'undefined' ? null : serialized(v);\n  return browser && browser !== v ? hexOf(browser) : null;\n}\n",".panel {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.section {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.section + .section {\n  border-top: var(--wzl-border-w) solid var(--wzl-line-subtle);\n}\n\n.sectionHead {\n  padding-block: var(--wzl-space-xs);\n  color: var(--wzl-fg-muted);\n  font-family: var(--wzl-font-display);\n  font-size: var(--wzl-font-size-sm);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.sectionBody {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-sm);\n  padding-block-end: var(--wzl-space-sm);\n}\n\n.row,\n.family {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-1);\n  min-width: 0;\n}\n\n.name {\n  overflow: hidden;\n  color: var(--wzl-fg-muted);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-sm);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.edit {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-xs);\n  min-width: 0;\n}\n\n.field {\n  --wzl-font-ui: var(--wzl-font-mono);\n  flex: 1;\n  min-width: 0;\n}\n\n.number {\n  flex: 1;\n  min-width: 0;\n}\n\n.unit {\n  color: var(--wzl-fg-muted);\n  font-size: var(--wzl-font-size-sm);\n}\n\n/* Padding inflates a native color input past its box in Chrome. */\n.swatchInput {\n  box-sizing: border-box;\n  flex-shrink: 0;\n  width: 18px;\n  height: 14px;\n  padding: 0;\n  background: transparent;\n  border: 0;\n  border-radius: var(--wzl-radius-sm);\n  cursor: pointer;\n}\n\n.chip {\n  flex-shrink: 0;\n  width: 18px;\n  height: 14px;\n  background: var(--token-color);\n  border-radius: var(--wzl-radius-sm);\n  box-shadow: inset 0 0 0 1px var(--wzl-line);\n}\n\n.curve {\n  flex-shrink: 0;\n  width: 24px;\n  /* Square easing-curve artwork: not-a-control */\n  height: 24px;\n  color: var(--wzl-fg);\n}\n\n.strip {\n  display: flex;\n  height: var(--wzl-control-h);\n  overflow: hidden;\n  border: var(--wzl-border-w) solid var(--wzl-line);\n  border-radius: var(--wzl-radius-sm);\n}\n\n.swatch {\n  flex: 1 1 0;\n  min-width: 0;\n  height: 100%;\n  padding: 0;\n  background: var(--token-color);\n  border: 0;\n  border-radius: 0;\n  cursor: pointer;\n}\n\n.swatch[data-overridden] {\n  box-shadow: inset 0 -3px 0 var(--wzl-accent);\n}\n\n.swatch[aria-pressed='true'],\n.swatch:focus-visible {\n  position: relative;\n  z-index: 1;\n  outline: 2px solid var(--wzl-focus-ring);\n  outline-offset: -2px;\n}\n\n/* A group of sizes: its name over a grid of steps, each labeled by what its name adds. */\n.scale {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-1);\n  min-width: 0;\n}\n\n.scaleHead {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-xs);\n  min-width: 0;\n}\n\n.steps {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(4rem, 1fr));\n  gap: var(--wzl-space-1) var(--wzl-space-xs);\n}\n\n.rule {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--wzl-space-xs) var(--wzl-space-sm);\n  min-width: 0;\n}\n\n.ruleLabel {\n  color: var(--wzl-fg-subtle);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-2xs);\n}\n\n.rule .number {\n  flex: 0 1 5ch;\n  text-align: end;\n}\n\n.step {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.stepLabel {\n  overflow: hidden;\n  text-align: end;\n  color: var(--wzl-fg-subtle);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-2xs);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.step[data-overridden] .stepLabel {\n  color: var(--wzl-accent-fg);\n}\n\n.stepEdit {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-1);\n  min-width: 0;\n}\n\n.step > .stepEdit + .stepEdit {\n  margin-block-start: var(--wzl-space-1);\n}\n\n.stepEdit .number {\n  text-align: end;\n}\n\n/* Tight: a token to a line, with the names on a fixed rail so the values read\n   down the panel as a column. A stacked row spends its height on the name and\n   lets the field take the whole width, which a set of ninety cannot afford. */\n.tight .sectionBody {\n  gap: var(--wzl-space-1);\n  padding-block-end: var(--wzl-space-xs);\n}\n\n.tight .row {\n  flex-direction: row;\n  align-items: center;\n  gap: var(--wzl-space-xs);\n}\n\n.tight .row > .name {\n  flex: 0 0 11rem;\n}\n\n.tight .edit {\n  flex: 1 1 auto;\n}\n\n.tight .field,\n.tight .number {\n  flex: 0 1 16rem;\n}\n\n.tight .scale {\n  display: grid;\n  grid-template-columns: 11rem minmax(0, 1fr);\n  align-items: start;\n  column-gap: var(--wzl-space-xs);\n}\n\n/* Grid rather than a row, so a picked swatch's editor still spans the full width. */\n.tight .family {\n  display: grid;\n  grid-template-columns: 11rem minmax(0, 1fr);\n  align-items: center;\n  column-gap: var(--wzl-space-xs);\n  row-gap: var(--wzl-space-1);\n}\n\n.tight .family > .row {\n  grid-column: 1 / -1;\n}\n\n.tight .strip {\n  height: 16px;\n}\n\n.tight .curve {\n  width: 16px;\n  height: 16px;\n}\n","import { parsesAsColor } from './color';\n\n/** A design token as `TokenPanel` edits it. */\nexport interface TokenEntry {\n  /** The custom property, e.g. `--wzl-gray-50`. */\n  name: string;\n  /** A DTCG type name. A type the panel has no control for edits as text. */\n  type: string;\n  /** Tokens sharing a group sit together; a color group large enough draws as one row of swatches. */\n  group: string;\n  value: string;\n  /** Whether `value` overrides the token's own, which offers Reset. */\n  overridden?: boolean;\n  description?: string;\n}\n\n/** How a scale's steps follow from its base: one multiplier per step, a constant ratio, or a constant step. */\nexport type TokenScaleRule =\n  | { kind: 'factors'; factors: readonly number[] }\n  | { kind: 'ratio'; ratio: number }\n  | { kind: 'step'; step: number };\n\n/** A group whose steps are generated from a base, so the panel edits the base and the rule rather than each step. */\nexport interface TokenScale {\n  /** The generated tokens, smallest first. Anything else in the group draws as an ordinary step. */\n  tokens: readonly string[];\n  base: number;\n  rule: TokenScaleRule;\n}\n\nconst round2 = (n: number) => Math.round(n * 100) / 100;\n\n/**\n * The same scale under another rule, fitted to the amounts its steps have now.\n * A ratio or step counts from the first step, so switching to one moves the\n * base there.\n */\nexport function refitScale(scale: TokenScale, kind: TokenScaleRule['kind'], amounts: readonly number[]): TokenScale {\n  const first = amounts[0] ?? scale.base;\n  const last = amounts.at(-1) ?? first;\n  const spans = Math.max(1, amounts.length - 1);\n  switch (kind) {\n    case 'factors':\n      return { ...scale, rule: { kind, factors: amounts.map((a) => (scale.base ? round2(a / scale.base) : 1)) } };\n    case 'ratio':\n      return { ...scale, base: first, rule: { kind, ratio: first > 0 ? round2((last / first) ** (1 / spans)) : 1 } };\n    case 'step':\n      return { ...scale, base: first, rule: { kind, step: round2((last - first) / spans) } };\n  }\n}\n\n/** A section of the token panel; `tokenCategory` files each token under one. */\nexport type TokenCategory ='color' | 'type' | 'size' | 'motion' | 'depth' | 'other';\n\n/** The panel's sections, in the order it draws them. */\nexport const TOKEN_CATEGORIES: readonly { id: TokenCategory; title: string }[] = [\n  { id: 'color', title: 'Color' },\n  { id: 'type', title: 'Type' },\n  { id: 'size', title: 'Size' },\n  { id: 'motion', title: 'Motion' },\n  { id: 'depth', title: 'Depth' },\n  { id: 'other', title: 'Other' },\n];\n\nconst TYPE_SCALE = /^(?:font|tracking|leading|letter|line-height)/;\n\n/** The section a token is filed under: by its type, and for a bare dimension or number by its group. */\nexport function tokenCategory(token: TokenEntry): TokenCategory {\n  switch (token.type) {\n    case 'color':\n      return 'color';\n    case 'fontFamily':\n    case 'fontWeight':\n      return 'type';\n    case 'duration':\n    case 'cubicBezier':\n      return 'motion';\n    case 'shadow':\n    case 'gradient':\n      return 'depth';\n    case 'dimension':\n    case 'number':\n      if (TYPE_SCALE.test(token.group)) return 'type';\n      if (token.type === 'number' && (token.group === 'z' || token.group === 'z-index')) return 'depth';\n      return 'size';\n    default:\n      return 'other';\n  }\n}\n\nconst AMOUNT = String.raw`-?(?:\\d+\\.?\\d*|\\.\\d+)`;\nconst DIMENSION = new RegExp(\n  `^${AMOUNT}(?:px|rem|em|%|ch|ex|lh|rlh|vh|vw|vmin|vmax|svh|lvh|dvh|cqw|cqh|pt|pc|cm|mm|in|q)$`,\n  'i',\n);\nconst DURATION = new RegExp(`^${AMOUNT}m?s$`);\nconst NUMBER = new RegExp(`^${AMOUNT}$`);\nconst LENGTH = new RegExp(`^${AMOUNT}(?:px|rem|em)?$`);\nconst BEZIER = new RegExp(`^cubic-bezier\\\\(\\\\s*(${AMOUNT})\\\\s*,\\\\s*(${AMOUNT})\\\\s*,\\\\s*(${AMOUNT})\\\\s*,\\\\s*(${AMOUNT})\\\\s*\\\\)$`, 'i');\nconst GRADIENT = /^(?:repeating-)?(?:linear|radial|conic)-gradient\\(/i;\n/** Commas outside parentheses: a shadow's layers, not a color function's arguments. */\nconst LAYERS = /,(?![^(]*\\))/;\nconst PARTS = /[a-z-]+\\([^)]*\\)|\\S+/gi;\n\nfunction isShadow(value: string): boolean {\n  return value.split(LAYERS).every((layer) => {\n    const parts = layer.trim().replace(/^inset\\s+/i, '').match(PARTS) ?? [];\n    const lengths = parts.filter((part) => LENGTH.test(part));\n    const rest = parts.filter((part) => !LENGTH.test(part));\n    return lengths.length >= 2 && lengths.length <= 4 && rest.length <= 1 && rest.every((part) => parsesAsColor(part));\n  });\n}\n\n/** A DTCG type read off the shape of a value, for a token that arrives without one. `'string'` when nothing fits. */\nexport function inferTokenType(value: string): string {\n  const v = value.trim();\n  if (!v) return 'string';\n  if (DURATION.test(v)) return 'duration';\n  if (DIMENSION.test(v)) return 'dimension';\n  if (NUMBER.test(v)) return 'number';\n  if (BEZIER.test(v)) return 'cubicBezier';\n  if (GRADIENT.test(v)) return 'gradient';\n  if (parsesAsColor(v)) return 'color';\n  if (isShadow(v)) return 'shadow';\n  return 'string';\n}\n\n/** A number and its unit, or null for a value that is not one. */\nexport function splitUnit(value: string): { amount: number; unit: string } | null {\n  const match = new RegExp(`^(${AMOUNT})([a-z%]*)$`, 'i').exec(value.trim());\n  return match ? { amount: Number(match[1]), unit: match[2] ?? '' } : null;\n}\n\n/** The four control points of a `cubic-bezier()`, or null for any other easing. */\nexport function bezierPoints(value: string): readonly [number, number, number, number] | null {\n  const match = BEZIER.exec(value.trim());\n  if (!match) return null;\n  const [x1, y1, x2, y2] = match.slice(1, 5).map(Number) as [number, number, number, number];\n  return [x1, y1, x2, y2];\n}\n","import { type CSSProperties, memo, useCallback, useMemo, useState } from 'react';\nimport { Focusable } from 'react-aria-components';\nimport { Button } from '../Button';\nimport { DisclosureRow } from '../Disclosure';\nimport { Input } from '../Input';\nimport { NumberField } from '../NumberField';\nimport { Select } from '../Select';\nimport { ToggleBar, type ToggleBarItem } from '../ToggleBar';\nimport { Tooltip, TooltipTrigger } from '../Tooltip';\nimport { toHex } from './color';\nimport s from './TokenPanel.module.css';\nimport {\n  bezierPoints,\n  refitScale,\n  splitUnit,\n  TOKEN_CATEGORIES,\n  type TokenCategory,\n  type TokenEntry,\n  type TokenScale,\n  type TokenScaleRule,\n  tokenCategory,\n} from './tokenTypes';\n\ntype OnChange = (name: string, value: string | null) => void;\n\n/** Props for `<TokenPanel>`. */\nexport interface TokenPanelProps {\n  tokens: readonly TokenEntry[];\n  /** A token's new value, or null to drop its override. Keep it stable: rows re-render only when it or their token changes. */\n  onChange: OnChange;\n  /** Sections held closed, by category. Omit to let the panel keep that state itself. */\n  collapsed?: Readonly<Partial<Record<TokenCategory, boolean>>>;\n  onCollapsedChange?: (category: TokenCategory, collapsed: boolean) => void;\n  /** Groups generated from a base, by group name. Such a group edits its base and rule above its steps. */\n  scales?: Readonly<Record<string, TokenScale>>;\n  /** A scale's new base or rule. The panel does not regenerate the steps; the consumer does, through `onChange`. */\n  onScaleChange?: (group: string, scale: TokenScale) => void;\n  /** Files a token under a section. Defaults to `tokenCategory`. */\n  categorize?: (token: TokenEntry) => TokenCategory;\n  /** The fewest colors, or sizes, sharing a group that draw as one row of swatches or one grid of steps. Default 3. */\n  familySize?: number;\n  /**\n   * Row layout. `tight` puts a token on one line — name, control, Reset — with the\n   * names on a fixed rail so the values read down the panel as a column, and caps\n   * the field rather than letting it span the panel. Default `normal` stacks the\n   * control under its name.\n   */\n  density?: 'tight' | 'normal';\n  className?: string;\n}\n\nconst WEIGHTS = ['100', '200', '300', '400', '500', '600', '700', '800', '900'];\nconst NUMBER_FORMAT = { maximumFractionDigits: 4, useGrouping: false } as const;\n\ntype FamilyKind = 'family' | 'scale';\ntype Item = { kind: 'row'; token: TokenEntry } | { kind: FamilyKind; group: string; tokens: TokenEntry[] };\n\nconst SCALAR = new Set(['dimension', 'duration', 'number']);\n\nfunction familyKindOf(token: TokenEntry): FamilyKind | null {\n  if (token.type === 'color') return 'family';\n  return SCALAR.has(token.type) && splitUnit(token.value) ? 'scale' : null;\n}\n\nfunction itemsOf(tokens: readonly TokenEntry[], familySize: number): Item[] {\n  const counts = new Map<string, number>();\n  for (const token of tokens) {\n    const kind = familyKindOf(token);\n    if (kind) counts.set(`${kind}:${token.group}`, (counts.get(`${kind}:${token.group}`) ?? 0) + 1);\n  }\n  const families = new Map<string, Extract<Item, { kind: FamilyKind }>>();\n  const items: Item[] = [];\n  for (const token of tokens) {\n    const kind = familyKindOf(token);\n    const key = `${kind}:${token.group}`;\n    if (!kind || (counts.get(key) ?? 0) < familySize) {\n      items.push({ kind: 'row', token });\n      continue;\n    }\n    let family = families.get(key);\n    if (!family) {\n      family = { kind, group: token.group, tokens: [] };\n      families.set(key, family);\n      items.push(family);\n    }\n    family.tokens.push(token);\n  }\n  return items;\n}\n\n/** Each name's segments past those every name in the set shares; a name that is all shared keeps its last. */\nfunction stepLabels(names: readonly string[]): string[] {\n  const split = names.map((name) => name.replace(/^--/, '').split('-'));\n  let shared = 0;\n  while (split.every((segments) => segments.length > shared && segments[shared] === split[0]?.[shared])) shared++;\n  return split.map((segments) => segments.slice(shared).join('-') || (segments.at(-1) ?? ''));\n}\n\nfunction Curve({ points, label }: { points: readonly [number, number, number, number]; label: string }) {\n  const [x1, y1, x2, y2] = points;\n  // y is flipped so the curve rises, and the box grows to hold an overshoot.\n  const top = Math.min(0, 1 - y1, 1 - y2);\n  const bottom = Math.max(1, 1 - y1, 1 - y2);\n  return (\n    <svg className={s.curve} viewBox={`-0.1 ${top - 0.1} 1.2 ${bottom - top + 0.2}`} role=\"img\" aria-label={label}>\n      <path d={`M0 1 C${x1} ${1 - y1} ${x2} ${1 - y2} 1 0`} fill=\"none\" stroke=\"currentColor\" strokeWidth={0.08} />\n    </svg>\n  );\n}\n\nfunction TokenControl({ token, set }: { token: TokenEntry; set: (value: string) => void }) {\n  const { name, type, value } = token;\n  const label = `${name} value`;\n  const hex = useMemo(() => (type === 'color' ? toHex(value) : null), [type, value]);\n\n  if (type === 'dimension' || type === 'duration' || type === 'number') {\n    const split = splitUnit(value);\n    if (split) {\n      return (\n        <>\n          <NumberField\n            className={s.number}\n            aria-label={label}\n            value={split.amount}\n            hideSteppers\n            formatOptions={NUMBER_FORMAT}\n            onChange={(amount) => {\n              if (Number.isFinite(amount)) set(`${amount}${split.unit}`);\n            }}\n          />\n          {split.unit ? <span className={s.unit}>{split.unit}</span> : null}\n        </>\n      );\n    }\n  }\n\n  if (type === 'fontWeight') {\n    const options = (WEIGHTS.includes(value) ? WEIGHTS : [...WEIGHTS, value]).map((weight) => ({\n      value: weight,\n      label: weight,\n    }));\n    return <Select aria-label={name} width=\"fit\" selectedKey={value} options={options} onSelectionChange={set} />;\n  }\n\n  const points = type === 'cubicBezier' ? bezierPoints(value) : null;\n  return (\n    <>\n      {points ? <Curve points={points} label={`${name} curve`} /> : null}\n      <Input\n        className={s.field}\n        aria-label={label}\n        value={value}\n        onChange={set}\n        leadingAdornment={\n          type !== 'color' ? undefined : hex ? (\n            <input\n              type=\"color\"\n              className={s.swatchInput}\n              aria-label={`${name} color`}\n              value={hex}\n              onChange={(event) => set(event.target.value)}\n            />\n          ) : (\n            <span className={s.chip} style={{ '--token-color': value } as CSSProperties} aria-hidden=\"true\" />\n          )\n        }\n      />\n    </>\n  );\n}\n\nconst TokenRow = memo(\n  function TokenRow({ token, onChange }: { token: TokenEntry; onChange: OnChange }) {\n    const set = useCallback((value: string) => onChange(token.name, value), [onChange, token.name]);\n    return (\n      <div className={s.row} role=\"group\" aria-label={token.name}>\n        <span className={s.name} title={token.description || token.name}>\n          {token.name}\n        </span>\n        <div className={s.edit}>\n          <TokenControl token={token} set={set} />\n          {token.overridden ? (\n            <Button variant=\"ghost\" size=\"sm\" ariaLabel={`Reset ${token.name}`} onClick={() => onChange(token.name, null)}>\n              Reset\n            </Button>\n          ) : null}\n        </div>\n      </div>\n    );\n  },\n  // Consumers rebuild their entries each render; a row only has to redraw when what it shows changed.\n  (a, b) =>\n    a.onChange === b.onChange &&\n    a.token.name === b.token.name &&\n    a.token.type === b.token.type &&\n    a.token.value === b.token.value &&\n    a.token.overridden === b.token.overridden &&\n    a.token.description === b.token.description,\n);\n\nfunction Family({ group, tokens, onChange }: { group: string; tokens: readonly TokenEntry[]; onChange: OnChange }) {\n  const [picked, setPicked] = useState<string | null>(null);\n  const token = tokens.find((t) => t.name === picked) ?? null;\n  return (\n    <div className={s.family} role=\"group\" aria-label={group}>\n      <span className={s.name}>{group}</span>\n      <div className={s.strip}>\n        {tokens.map((t) => (\n          <TooltipTrigger key={t.name} delay={0}>\n            <Focusable>\n              <button\n                type=\"button\"\n                className={s.swatch}\n                style={{ '--token-color': t.value } as CSSProperties}\n                aria-label={t.name}\n                aria-pressed={t.name === picked}\n                data-overridden={t.overridden ? '' : undefined}\n                onClick={() => setPicked((current) => (current === t.name ? null : t.name))}\n              />\n            </Focusable>\n            <Tooltip>{t.name}</Tooltip>\n          </TooltipTrigger>\n        ))}\n      </div>\n      {token ? <TokenRow token={token} onChange={onChange} /> : null}\n    </div>\n  );\n}\n\nfunction ScaleStep({\n  token,\n  label,\n  showUnit,\n  factor,\n  onChange,\n  onFactorChange,\n}: {\n  token: TokenEntry;\n  label: string;\n  showUnit: boolean;\n  factor?: number;\n  onChange: OnChange;\n  onFactorChange?: (factor: number) => void;\n}) {\n  const split = splitUnit(token.value);\n  if (!split) return null;\n  return (\n    <div className={s.step} title={token.description || token.name} data-overridden={token.overridden ? '' : undefined}>\n      <span className={s.stepLabel}>{label}</span>\n      <span className={s.stepEdit}>\n        <NumberField\n          className={s.number}\n          aria-label={`${token.name} value`}\n          value={split.amount}\n          hideSteppers\n          formatOptions={NUMBER_FORMAT}\n          onChange={(amount) => {\n            if (Number.isFinite(amount)) onChange(token.name, `${amount}${split.unit}`);\n          }}\n        />\n        {showUnit && split.unit ? <span className={s.unit}>{split.unit}</span> : null}\n      </span>\n      {factor !== undefined && onFactorChange ? (\n        <span className={s.stepEdit}>\n          <span className={s.unit}>×</span>\n          <NumberField\n            className={s.number}\n            aria-label={`${token.name} factor`}\n            value={factor}\n            hideSteppers\n            formatOptions={NUMBER_FORMAT}\n            onChange={(next) => {\n              if (Number.isFinite(next)) onFactorChange(next);\n            }}\n          />\n        </span>\n      ) : null}\n    </div>\n  );\n}\n\nconst RULES: readonly ToggleBarItem<TokenScaleRule['kind']>[] = [\n  { value: 'factors', label: 'each', ariaLabel: 'factors' },\n  { value: 'ratio', label: 'ratio' },\n  { value: 'step', label: 'step' },\n];\n\nfunction ScaleRuleControls({\n  group,\n  scale,\n  unit,\n  amounts,\n  onScaleChange,\n}: {\n  group: string;\n  scale: TokenScale;\n  unit: string;\n  amounts: readonly number[];\n  onScaleChange: (scale: TokenScale) => void;\n}) {\n  const { rule } = scale;\n  const param =\n    rule.kind === 'ratio'\n      ? { key: 'ratio' as const, value: rule.ratio }\n      : rule.kind === 'step'\n        ? { key: 'step' as const, value: rule.step }\n        : null;\n  return (\n    <div className={s.rule}>\n      <span className={s.stepEdit}>\n        <span className={s.ruleLabel}>base</span>\n        <NumberField\n          className={s.number}\n          aria-label={`${group} base`}\n          value={scale.base}\n          hideSteppers\n          formatOptions={NUMBER_FORMAT}\n          onChange={(base) => {\n            if (Number.isFinite(base)) onScaleChange({ ...scale, base });\n          }}\n        />\n        {unit ? <span className={s.unit}>{unit}</span> : null}\n      </span>\n      <ToggleBar\n        ariaLabel={`${group} rule`}\n        size=\"sm\"\n        items={RULES}\n        value={rule.kind}\n        onChange={(kind) => {\n          if (kind && kind !== rule.kind) onScaleChange(refitScale(scale, kind, amounts));\n        }}\n      />\n      {param ? (\n        <span className={s.stepEdit}>\n          {param.key === 'ratio' ? <span className={s.unit}>×</span> : <span className={s.unit}>+</span>}\n          <NumberField\n            className={s.number}\n            aria-label={`${group} ${param.key}`}\n            value={param.value}\n            hideSteppers\n            formatOptions={NUMBER_FORMAT}\n            onChange={(value) => {\n              if (Number.isFinite(value)) onScaleChange({ ...scale, rule: { kind: param.key, [param.key]: value } as TokenScaleRule });\n            }}\n          />\n        </span>\n      ) : null}\n    </div>\n  );\n}\n\nfunction Scale({\n  group,\n  tokens,\n  generator,\n  onChange,\n  onScaleChange,\n}: {\n  group: string;\n  tokens: readonly TokenEntry[];\n  generator?: TokenScale;\n  onChange: OnChange;\n  onScaleChange?: (group: string, scale: TokenScale) => void;\n}) {\n  const labels = useMemo(() => stepLabels(tokens.map((t) => t.name)), [tokens]);\n  const units = new Set(tokens.map((t) => splitUnit(t.value)?.unit ?? ''));\n  const unit = units.size === 1 ? [...units][0] : null;\n  const overridden = tokens.filter((t) => t.overridden);\n  return (\n    <div className={s.scale} role=\"group\" aria-label={group}>\n      <span className={s.scaleHead}>\n        <span className={s.name}>{group}</span>\n        {unit ? <span className={s.unit}>{unit}</span> : null}\n        {overridden.length > 0 ? (\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            ariaLabel={`Reset ${group}`}\n            onClick={() => {\n              for (const t of overridden) onChange(t.name, null);\n            }}\n          >\n            Reset\n          </Button>\n        ) : null}\n      </span>\n      {generator && onScaleChange ? (\n        <ScaleRuleControls\n          group={group}\n          scale={generator}\n          unit={unit ?? ''}\n          amounts={generator.tokens.map(\n            (name) => splitUnit(tokens.find((t) => t.name === name)?.value ?? '')?.amount ?? generator.base,\n          )}\n          onScaleChange={(next) => onScaleChange(group, next)}\n        />\n      ) : null}\n      <div className={s.steps}>\n        {tokens.map((t, i) => {\n          const rule = generator?.rule;\n          const at = generator ? generator.tokens.indexOf(t.name) : -1;\n          const factor = rule?.kind === 'factors' && at >= 0 ? rule.factors[at] : undefined;\n          return (\n            <ScaleStep\n              key={t.name}\n              token={t}\n              label={labels[i] ?? t.name}\n              showUnit={unit === null}\n              factor={factor}\n              onChange={onChange}\n              onFactorChange={\n                generator && onScaleChange && rule?.kind === 'factors'\n                  ? (next) =>\n                      onScaleChange(group, {\n                        ...generator,\n                        rule: { kind: 'factors', factors: rule.factors.map((f, j) => (j === at ? next : f)) },\n                      })\n                  : undefined\n              }\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nfunction Section({\n  title,\n  open,\n  onToggle,\n  tokens,\n  familySize,\n  scales,\n  onChange,\n  onScaleChange,\n}: {\n  title: string;\n  open: boolean;\n  onToggle: () => void;\n  tokens: readonly TokenEntry[];\n  familySize: number;\n  scales?: Readonly<Record<string, TokenScale>>;\n  onChange: OnChange;\n  onScaleChange?: (group: string, scale: TokenScale) => void;\n}) {\n  const items = useMemo(() => itemsOf(tokens, familySize), [tokens, familySize]);\n  return (\n    <section className={s.section} aria-label={title}>\n      <DisclosureRow className={s.sectionHead} open={open} onToggle={onToggle} label={title}>\n        <span aria-hidden=\"true\">{title}</span>\n      </DisclosureRow>\n      {open ? (\n        <div className={s.sectionBody}>\n          {items.map((item) =>\n            item.kind === 'row' ? (\n              <TokenRow key={item.token.name} token={item.token} onChange={onChange} />\n            ) : item.kind === 'scale' ? (\n              <Scale\n                key={`scale:${item.group}`}\n                group={item.group}\n                tokens={item.tokens}\n                generator={scales?.[item.group]}\n                onChange={onChange}\n                onScaleChange={onScaleChange}\n              />\n            ) : (\n              <Family key={`family:${item.group}`} group={item.group} tokens={item.tokens} onChange={onChange} />\n            ),\n          )}\n        </div>\n      ) : null}\n    </section>\n  );\n}\n\n/**\n * Edits a set of design tokens by type: collapsible sections by category, a\n * color group drawn as one row of swatches sized to fit, a group of sizes drawn\n * as one grid of numbers labeled by step — with its base and rule above it when\n * `scales` says how it is generated — and a control for each\n * type — a number with its unit for dimensions and durations, the nine weights\n * for a font weight, a curve beside a `cubic-bezier()`, a swatch beside a color,\n * and text for everything else.\n */\nexport function TokenPanel({\n  tokens,\n  onChange,\n  collapsed,\n  onCollapsedChange,\n  scales,\n  onScaleChange,\n  categorize = tokenCategory,\n  familySize = 3,\n  density = 'normal',\n  className,\n}: TokenPanelProps) {\n  const [ownCollapsed, setOwnCollapsed] = useState<Partial<Record<TokenCategory, boolean>>>({});\n  const closed = collapsed ?? ownCollapsed;\n  const byCategory = useMemo(() => {\n    const sections = new Map<TokenCategory, TokenEntry[]>();\n    for (const token of tokens) {\n      const category = categorize(token);\n      sections.set(category, [...(sections.get(category) ?? []), token]);\n    }\n    return sections;\n  }, [tokens, categorize]);\n\n  return (\n    <div className={[s.panel, density === 'tight' && s.tight, className].filter(Boolean).join(' ')}>\n      {TOKEN_CATEGORIES.map(({ id, title }) => {\n        const inSection = byCategory.get(id);\n        if (!inSection) return null;\n        const open = !closed[id];\n        return (\n          <Section\n            key={id}\n            title={title}\n            open={open}\n            onToggle={() => {\n              if (collapsed === undefined) setOwnCollapsed((prev) => ({ ...prev, [id]: open }));\n              onCollapsedChange?.(id, open);\n            }}\n            tokens={inSection}\n            familySize={familySize}\n            scales={scales}\n            onChange={onChange}\n            onScaleChange={onScaleChange}\n          />\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TokenPanel-cL37E39j.js","names":["s","_Fragment","NumberField","Select","Input","Button","TooltipTrigger","Tooltip","Tooltip$1","TooltipTrigger$1","Button$1","Select$1","Input$1","ToggleBar","NumberField$1","HEX","RGB","COLOR_FUNCTION","KEYWORDS","browserSupports","value","parsesAsColor","v","supports","hexOf","digits","d","rgb","n","paint","serialized","onBlack","toHex","direct","browser","TokenPanel_module_default","round2","refitScale","first","amounts","scale","last","spans","kind","a","TOKEN_CATEGORIES","TYPE_SCALE","tokenCategory","token","AMOUNT","DIMENSION","DURATION","NUMBER","LENGTH","BEZIER","GRADIENT","LAYERS","PARTS","isShadow","parts","layer","lengths","part","rest","inferTokenType","splitUnit","match","bezierPoints","x1","y1","x2","y2","WEIGHTS","NUMBER_FORMAT","SCALAR","familyKindOf","itemsOf","counts","tokens","families","items","key","familySize","family","stepLabels","split","names","name","shared","segments","Curve","points","top","bottom","label","TokenControl","hex","useMemo","type","Fragment","amount","set","options","weight","event","TokenRow","memo","useCallback","onChange","b","Family","picked","setPicked","useState","t","group","Focusable","current","ScaleStep","showUnit","factor","onFactorChange","next","RULES","ScaleRuleControls","param","rule","base","onScaleChange","unit","Scale","labels","units","overridden","generator","at","i","j","f","Section","title","DisclosureRow","open","item","scales","TokenPanel","ownCollapsed","setOwnCollapsed","closed","collapsed","byCategory","sections","category","categorize","density","className","inSection","id","prev","onCollapsedChange"],"sources":["../../src/components/TokenPanel/color.ts","../../src/components/TokenPanel/TokenPanel.module.css","../../src/components/TokenPanel/tokenTypes.ts","../../src/components/TokenPanel/TokenPanel.tsx"],"sourcesContent":["const HEX = /^#(?:[\\da-f]{3,4}|[\\da-f]{6}|[\\da-f]{8})$/i;\nconst RGB = /^rgba?\\(\\s*(\\d{1,3})[\\s,]+(\\d{1,3})[\\s,]+(\\d{1,3})\\b/i;\nconst COLOR_FUNCTION = /^(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch|color|color-mix)\\(.+\\)$/i;\nconst KEYWORDS = new Set([\n  'transparent',\n  'currentcolor',\n  'black',\n  'white',\n  'gray',\n  'silver',\n  'red',\n  'orange',\n  'yellow',\n  'gold',\n  'lime',\n  'green',\n  'teal',\n  'cyan',\n  'blue',\n  'navy',\n  'purple',\n  'magenta',\n  'pink',\n  'brown',\n]);\n\ntype Supports = ((value: string) => boolean) | null;\n\nfunction browserSupports(): Supports {\n  return typeof CSS !== 'undefined' && typeof CSS.supports === 'function'\n    ? (value) => CSS.supports('color', value)\n    : null;\n}\n\n/** Whether `value` is a CSS color — the browser's answer where it has `CSS.supports`, a small parser's otherwise. */\nexport function parsesAsColor(value: string, supports: Supports = browserSupports()): boolean {\n  const v = value.trim();\n  // `CSS.supports` accepts any `var()` for any property.\n  if (!v || v.includes('var(')) return false;\n  if (supports) return supports(v);\n  return HEX.test(v) || COLOR_FUNCTION.test(v) || KEYWORDS.has(v.toLowerCase());\n}\n\nfunction hexOf(v: string): string | null {\n  if (HEX.test(v)) {\n    const digits = v.slice(1).toLowerCase();\n    return `#${digits.length <= 4 ? [...digits.slice(0, 3)].map((d) => d + d).join('') : digits.slice(0, 6)}`;\n  }\n  const rgb = RGB.exec(v);\n  return rgb\n    ? `#${rgb\n        .slice(1, 4)\n        .map((n) => Math.min(255, Number(n)).toString(16).padStart(2, '0'))\n        .join('')}`\n    : null;\n}\n\nlet paint: CanvasRenderingContext2D | null | undefined;\n\n/** The browser's serialization of a color, through a canvas fill style; null where it has none or rejects `value`. */\nfunction serialized(value: string): string | null {\n  if (paint === undefined) {\n    try {\n      paint = document.createElement('canvas').getContext('2d');\n    } catch {\n      paint = null;\n    }\n  }\n  if (!paint) return null;\n  // A rejected value leaves the previous fill style, so two different ones tell a rejection apart.\n  paint.fillStyle = '#000000';\n  paint.fillStyle = value;\n  const onBlack = String(paint.fillStyle);\n  paint.fillStyle = '#ffffff';\n  paint.fillStyle = value;\n  return onBlack === String(paint.fillStyle) ? onBlack : null;\n}\n\n/** `value` as the `#rrggbb` a color input takes, alpha dropped; null when it cannot be converted. */\nexport function toHex(value: string): string | null {\n  const v = value.trim();\n  const direct = hexOf(v);\n  if (direct) return direct;\n  const browser = typeof document === 'undefined' ? null : serialized(v);\n  return browser && browser !== v ? hexOf(browser) : null;\n}\n",".panel {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.section {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.section + .section {\n  border-top: var(--wzl-border-w) solid var(--wzl-line-subtle);\n}\n\n.sectionHead {\n  padding-block: var(--wzl-space-xs);\n  color: var(--wzl-fg-muted);\n  font-family: var(--wzl-font-display);\n  font-size: var(--wzl-font-size-sm);\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\n.sectionBody {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-sm);\n  padding-block-end: var(--wzl-space-sm);\n}\n\n.row,\n.family {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-1);\n  min-width: 0;\n}\n\n.name {\n  overflow: hidden;\n  color: var(--wzl-fg-muted);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-sm);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.edit {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-xs);\n  min-width: 0;\n}\n\n.field {\n  --wzl-font-ui: var(--wzl-font-mono);\n  flex: 1;\n  min-width: 0;\n}\n\n.number {\n  flex: 1;\n  min-width: 0;\n}\n\n.unit {\n  color: var(--wzl-fg-muted);\n  font-size: var(--wzl-font-size-sm);\n}\n\n/* Padding inflates a native color input past its box in Chrome. */\n.swatchInput {\n  box-sizing: border-box;\n  flex-shrink: 0;\n  width: 18px;\n  height: 14px;\n  padding: 0;\n  background: transparent;\n  border: 0;\n  border-radius: var(--wzl-radius-sm);\n  cursor: pointer;\n}\n\n.chip {\n  flex-shrink: 0;\n  width: 18px;\n  height: 14px;\n  background: var(--token-color);\n  border-radius: var(--wzl-radius-sm);\n  box-shadow: inset 0 0 0 1px var(--wzl-line);\n}\n\n.curve {\n  flex-shrink: 0;\n  width: 24px;\n  /* Square easing-curve artwork: not-a-control */\n  height: 24px;\n  color: var(--wzl-fg);\n}\n\n.strip {\n  display: flex;\n  height: var(--wzl-control-h);\n  overflow: hidden;\n  border: var(--wzl-border-w) solid var(--wzl-line);\n  border-radius: var(--wzl-radius-sm);\n}\n\n.swatch {\n  flex: 1 1 0;\n  min-width: 0;\n  height: 100%;\n  padding: 0;\n  background: var(--token-color);\n  border: 0;\n  border-radius: 0;\n  cursor: pointer;\n}\n\n.swatch[data-overridden] {\n  box-shadow: inset 0 -3px 0 var(--wzl-accent);\n}\n\n.swatch[aria-pressed='true'],\n.swatch:focus-visible {\n  position: relative;\n  z-index: 1;\n  outline: 2px solid var(--wzl-focus-ring);\n  outline-offset: -2px;\n}\n\n/* A group of sizes: its name over a grid of steps, each labeled by what its name adds. */\n.scale {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-1);\n  min-width: 0;\n}\n\n.scaleHead {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-xs);\n  min-width: 0;\n}\n\n.steps {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(4rem, 1fr));\n  gap: var(--wzl-space-1) var(--wzl-space-xs);\n}\n\n.rule {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: var(--wzl-space-xs) var(--wzl-space-sm);\n  min-width: 0;\n}\n\n.ruleLabel {\n  color: var(--wzl-fg-subtle);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-2xs);\n}\n\n.rule .number {\n  flex: 0 1 5ch;\n  text-align: end;\n}\n\n.step {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.stepLabel {\n  overflow: hidden;\n  text-align: end;\n  color: var(--wzl-fg-subtle);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-2xs);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.step[data-overridden] .stepLabel {\n  color: var(--wzl-accent-fg);\n}\n\n.stepEdit {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-1);\n  min-width: 0;\n}\n\n.step > .stepEdit + .stepEdit {\n  margin-block-start: var(--wzl-space-1);\n}\n\n.stepEdit .number {\n  text-align: end;\n}\n\n/* Tight: a token to a line, with the names on a fixed rail so the values read\n   down the panel as a column. A stacked row spends its height on the name and\n   lets the field take the whole width, which a set of ninety cannot afford. */\n.tight .sectionBody {\n  gap: var(--wzl-space-1);\n  padding-block-end: var(--wzl-space-xs);\n}\n\n.tight .row {\n  flex-direction: row;\n  align-items: center;\n  gap: var(--wzl-space-xs);\n}\n\n.tight .row > .name {\n  flex: 0 0 11rem;\n}\n\n.tight .edit {\n  flex: 1 1 auto;\n}\n\n.tight .field,\n.tight .number {\n  flex: 0 1 16rem;\n}\n\n.tight .scale {\n  display: grid;\n  grid-template-columns: 11rem minmax(0, 1fr);\n  align-items: start;\n  column-gap: var(--wzl-space-xs);\n}\n\n/* Grid rather than a row, so a picked swatch's editor still spans the full width. */\n.tight .family {\n  display: grid;\n  grid-template-columns: 11rem minmax(0, 1fr);\n  align-items: center;\n  column-gap: var(--wzl-space-xs);\n  row-gap: var(--wzl-space-1);\n}\n\n.tight .family > .row {\n  grid-column: 1 / -1;\n}\n\n.tight .strip {\n  height: 16px;\n}\n\n.tight .curve {\n  width: 16px;\n  height: 16px;\n}\n","import { parsesAsColor } from './color';\n\n/** A design token as `TokenPanel` edits it. */\nexport interface TokenEntry {\n  /** The custom property, e.g. `--wzl-gray-50`. */\n  name: string;\n  /** A DTCG type name. A type the panel has no control for edits as text. */\n  type: string;\n  /** Tokens sharing a group sit together; a color group large enough draws as one row of swatches. */\n  group: string;\n  value: string;\n  /** Whether `value` overrides the token's own, which offers Reset. */\n  overridden?: boolean;\n  description?: string;\n}\n\n/** How a scale's steps follow from its base: one multiplier per step, a constant ratio, or a constant step. */\nexport type TokenScaleRule =\n  | { kind: 'factors'; factors: readonly number[] }\n  | { kind: 'ratio'; ratio: number }\n  | { kind: 'step'; step: number };\n\n/** A group whose steps are generated from a base, so the panel edits the base and the rule rather than each step. */\nexport interface TokenScale {\n  /** The generated tokens, smallest first. Anything else in the group draws as an ordinary step. */\n  tokens: readonly string[];\n  base: number;\n  rule: TokenScaleRule;\n}\n\nconst round2 = (n: number) => Math.round(n * 100) / 100;\n\n/**\n * The same scale under another rule, fitted to the amounts its steps have now.\n * A ratio or step counts from the first step, so switching to one moves the\n * base there.\n */\nexport function refitScale(scale: TokenScale, kind: TokenScaleRule['kind'], amounts: readonly number[]): TokenScale {\n  const first = amounts[0] ?? scale.base;\n  const last = amounts.at(-1) ?? first;\n  const spans = Math.max(1, amounts.length - 1);\n  switch (kind) {\n    case 'factors':\n      return { ...scale, rule: { kind, factors: amounts.map((a) => (scale.base ? round2(a / scale.base) : 1)) } };\n    case 'ratio':\n      return { ...scale, base: first, rule: { kind, ratio: first > 0 ? round2((last / first) ** (1 / spans)) : 1 } };\n    case 'step':\n      return { ...scale, base: first, rule: { kind, step: round2((last - first) / spans) } };\n  }\n}\n\n/** A section of the token panel; `tokenCategory` files each token under one. */\nexport type TokenCategory ='color' | 'type' | 'size' | 'motion' | 'depth' | 'other';\n\n/** The panel's sections, in the order it draws them. */\nexport const TOKEN_CATEGORIES: readonly { id: TokenCategory; title: string }[] = [\n  { id: 'color', title: 'Color' },\n  { id: 'type', title: 'Type' },\n  { id: 'size', title: 'Size' },\n  { id: 'motion', title: 'Motion' },\n  { id: 'depth', title: 'Depth' },\n  { id: 'other', title: 'Other' },\n];\n\nconst TYPE_SCALE = /^(?:font|tracking|leading|letter|line-height)/;\n\n/** The section a token is filed under: by its type, and for a bare dimension or number by its group. */\nexport function tokenCategory(token: TokenEntry): TokenCategory {\n  switch (token.type) {\n    case 'color':\n      return 'color';\n    case 'fontFamily':\n    case 'fontWeight':\n      return 'type';\n    case 'duration':\n    case 'cubicBezier':\n      return 'motion';\n    case 'shadow':\n    case 'gradient':\n      return 'depth';\n    case 'dimension':\n    case 'number':\n      if (TYPE_SCALE.test(token.group)) return 'type';\n      if (token.type === 'number' && (token.group === 'z' || token.group === 'z-index')) return 'depth';\n      return 'size';\n    default:\n      return 'other';\n  }\n}\n\nconst AMOUNT = String.raw`-?(?:\\d+\\.?\\d*|\\.\\d+)`;\nconst DIMENSION = new RegExp(\n  `^${AMOUNT}(?:px|rem|em|%|ch|ex|lh|rlh|vh|vw|vmin|vmax|svh|lvh|dvh|cqw|cqh|pt|pc|cm|mm|in|q)$`,\n  'i',\n);\nconst DURATION = new RegExp(`^${AMOUNT}m?s$`);\nconst NUMBER = new RegExp(`^${AMOUNT}$`);\nconst LENGTH = new RegExp(`^${AMOUNT}(?:px|rem|em)?$`);\nconst BEZIER = new RegExp(`^cubic-bezier\\\\(\\\\s*(${AMOUNT})\\\\s*,\\\\s*(${AMOUNT})\\\\s*,\\\\s*(${AMOUNT})\\\\s*,\\\\s*(${AMOUNT})\\\\s*\\\\)$`, 'i');\nconst GRADIENT = /^(?:repeating-)?(?:linear|radial|conic)-gradient\\(/i;\n/** Commas outside parentheses: a shadow's layers, not a color function's arguments. */\nconst LAYERS = /,(?![^(]*\\))/;\nconst PARTS = /[a-z-]+\\([^)]*\\)|\\S+/gi;\n\nfunction isShadow(value: string): boolean {\n  return value.split(LAYERS).every((layer) => {\n    const parts = layer.trim().replace(/^inset\\s+/i, '').match(PARTS) ?? [];\n    const lengths = parts.filter((part) => LENGTH.test(part));\n    const rest = parts.filter((part) => !LENGTH.test(part));\n    return lengths.length >= 2 && lengths.length <= 4 && rest.length <= 1 && rest.every((part) => parsesAsColor(part));\n  });\n}\n\n/** A DTCG type read off the shape of a value, for a token that arrives without one. `'string'` when nothing fits. */\nexport function inferTokenType(value: string): string {\n  const v = value.trim();\n  if (!v) return 'string';\n  if (DURATION.test(v)) return 'duration';\n  if (DIMENSION.test(v)) return 'dimension';\n  if (NUMBER.test(v)) return 'number';\n  if (BEZIER.test(v)) return 'cubicBezier';\n  if (GRADIENT.test(v)) return 'gradient';\n  if (parsesAsColor(v)) return 'color';\n  if (isShadow(v)) return 'shadow';\n  return 'string';\n}\n\n/** A number and its unit, or null for a value that is not one. */\nexport function splitUnit(value: string): { amount: number; unit: string } | null {\n  const match = new RegExp(`^(${AMOUNT})([a-z%]*)$`, 'i').exec(value.trim());\n  return match ? { amount: Number(match[1]), unit: match[2] ?? '' } : null;\n}\n\n/** The four control points of a `cubic-bezier()`, or null for any other easing. */\nexport function bezierPoints(value: string): readonly [number, number, number, number] | null {\n  const match = BEZIER.exec(value.trim());\n  if (!match) return null;\n  const [x1, y1, x2, y2] = match.slice(1, 5).map(Number) as [number, number, number, number];\n  return [x1, y1, x2, y2];\n}\n","import { type CSSProperties, memo, useCallback, useMemo, useState } from 'react';\nimport { Focusable } from 'react-aria-components';\nimport { Button } from '../Button';\nimport { DisclosureRow } from '../Disclosure';\nimport { Input } from '../Input';\nimport { NumberField } from '../NumberField';\nimport { Select } from '../Select';\nimport { ToggleBar, type ToggleBarItem } from '../ToggleBar';\nimport { Tooltip, TooltipTrigger } from '../Tooltip';\nimport { toHex } from './color';\nimport s from './TokenPanel.module.css';\nimport {\n  bezierPoints,\n  refitScale,\n  splitUnit,\n  TOKEN_CATEGORIES,\n  type TokenCategory,\n  type TokenEntry,\n  type TokenScale,\n  type TokenScaleRule,\n  tokenCategory,\n} from './tokenTypes';\n\ntype OnChange = (name: string, value: string | null) => void;\n\n/** Props for `<TokenPanel>`. */\nexport interface TokenPanelProps {\n  tokens: readonly TokenEntry[];\n  /** A token's new value, or null to drop its override. Keep it stable: rows re-render only when it or their token changes. */\n  onChange: OnChange;\n  /** Sections held closed, by category. Omit to let the panel keep that state itself. */\n  collapsed?: Readonly<Partial<Record<TokenCategory, boolean>>>;\n  onCollapsedChange?: (category: TokenCategory, collapsed: boolean) => void;\n  /** Groups generated from a base, by group name. Such a group edits its base and rule above its steps. */\n  scales?: Readonly<Record<string, TokenScale>>;\n  /** A scale's new base or rule. The panel does not regenerate the steps; the consumer does, through `onChange`. */\n  onScaleChange?: (group: string, scale: TokenScale) => void;\n  /** Files a token under a section. Defaults to `tokenCategory`. */\n  categorize?: (token: TokenEntry) => TokenCategory;\n  /** The fewest colors, or sizes, sharing a group that draw as one row of swatches or one grid of steps. Default 3. */\n  familySize?: number;\n  /**\n   * Row layout. `tight` puts a token on one line — name, control, Reset — with the\n   * names on a fixed rail so the values read down the panel as a column, and caps\n   * the field rather than letting it span the panel. Default `normal` stacks the\n   * control under its name.\n   */\n  density?: 'tight' | 'normal';\n  className?: string;\n}\n\nconst WEIGHTS = ['100', '200', '300', '400', '500', '600', '700', '800', '900'];\nconst NUMBER_FORMAT = { maximumFractionDigits: 4, useGrouping: false } as const;\n\ntype FamilyKind = 'family' | 'scale';\ntype Item = { kind: 'row'; token: TokenEntry } | { kind: FamilyKind; group: string; tokens: TokenEntry[] };\n\nconst SCALAR = new Set(['dimension', 'duration', 'number']);\n\nfunction familyKindOf(token: TokenEntry): FamilyKind | null {\n  if (token.type === 'color') return 'family';\n  return SCALAR.has(token.type) && splitUnit(token.value) ? 'scale' : null;\n}\n\nfunction itemsOf(tokens: readonly TokenEntry[], familySize: number): Item[] {\n  const counts = new Map<string, number>();\n  for (const token of tokens) {\n    const kind = familyKindOf(token);\n    if (kind) counts.set(`${kind}:${token.group}`, (counts.get(`${kind}:${token.group}`) ?? 0) + 1);\n  }\n  const families = new Map<string, Extract<Item, { kind: FamilyKind }>>();\n  const items: Item[] = [];\n  for (const token of tokens) {\n    const kind = familyKindOf(token);\n    const key = `${kind}:${token.group}`;\n    if (!kind || (counts.get(key) ?? 0) < familySize) {\n      items.push({ kind: 'row', token });\n      continue;\n    }\n    let family = families.get(key);\n    if (!family) {\n      family = { kind, group: token.group, tokens: [] };\n      families.set(key, family);\n      items.push(family);\n    }\n    family.tokens.push(token);\n  }\n  return items;\n}\n\n/** Each name's segments past those every name in the set shares; a name that is all shared keeps its last. */\nfunction stepLabels(names: readonly string[]): string[] {\n  const split = names.map((name) => name.replace(/^--/, '').split('-'));\n  let shared = 0;\n  while (split.every((segments) => segments.length > shared && segments[shared] === split[0]?.[shared])) shared++;\n  return split.map((segments) => segments.slice(shared).join('-') || (segments.at(-1) ?? ''));\n}\n\nfunction Curve({ points, label }: { points: readonly [number, number, number, number]; label: string }) {\n  const [x1, y1, x2, y2] = points;\n  // y is flipped so the curve rises, and the box grows to hold an overshoot.\n  const top = Math.min(0, 1 - y1, 1 - y2);\n  const bottom = Math.max(1, 1 - y1, 1 - y2);\n  return (\n    <svg className={s.curve} viewBox={`-0.1 ${top - 0.1} 1.2 ${bottom - top + 0.2}`} role=\"img\" aria-label={label}>\n      <path d={`M0 1 C${x1} ${1 - y1} ${x2} ${1 - y2} 1 0`} fill=\"none\" stroke=\"currentColor\" strokeWidth={0.08} />\n    </svg>\n  );\n}\n\nfunction TokenControl({ token, set }: { token: TokenEntry; set: (value: string) => void }) {\n  const { name, type, value } = token;\n  const label = `${name} value`;\n  const hex = useMemo(() => (type === 'color' ? toHex(value) : null), [type, value]);\n\n  if (type === 'dimension' || type === 'duration' || type === 'number') {\n    const split = splitUnit(value);\n    if (split) {\n      return (\n        <>\n          <NumberField\n            className={s.number}\n            aria-label={label}\n            value={split.amount}\n            hideSteppers\n            formatOptions={NUMBER_FORMAT}\n            onChange={(amount) => {\n              if (Number.isFinite(amount)) set(`${amount}${split.unit}`);\n            }}\n          />\n          {split.unit ? <span className={s.unit}>{split.unit}</span> : null}\n        </>\n      );\n    }\n  }\n\n  if (type === 'fontWeight') {\n    const options = (WEIGHTS.includes(value) ? WEIGHTS : [...WEIGHTS, value]).map((weight) => ({\n      value: weight,\n      label: weight,\n    }));\n    return <Select aria-label={name} width=\"fit\" selectedKey={value} options={options} onSelectionChange={set} />;\n  }\n\n  const points = type === 'cubicBezier' ? bezierPoints(value) : null;\n  return (\n    <>\n      {points ? <Curve points={points} label={`${name} curve`} /> : null}\n      <Input\n        className={s.field}\n        aria-label={label}\n        value={value}\n        onChange={set}\n        leadingAdornment={\n          type !== 'color' ? undefined : hex ? (\n            <input\n              type=\"color\"\n              className={s.swatchInput}\n              aria-label={`${name} color`}\n              value={hex}\n              onChange={(event) => set(event.target.value)}\n            />\n          ) : (\n            <span className={s.chip} style={{ '--token-color': value } as CSSProperties} aria-hidden=\"true\" />\n          )\n        }\n      />\n    </>\n  );\n}\n\nconst TokenRow = memo(\n  function TokenRow({ token, onChange }: { token: TokenEntry; onChange: OnChange }) {\n    const set = useCallback((value: string) => onChange(token.name, value), [onChange, token.name]);\n    return (\n      <div className={s.row} role=\"group\" aria-label={token.name}>\n        <span className={s.name} title={token.description || token.name}>\n          {token.name}\n        </span>\n        <div className={s.edit}>\n          <TokenControl token={token} set={set} />\n          {token.overridden ? (\n            <Button variant=\"ghost\" size=\"sm\" ariaLabel={`Reset ${token.name}`} onClick={() => onChange(token.name, null)}>\n              Reset\n            </Button>\n          ) : null}\n        </div>\n      </div>\n    );\n  },\n  // Consumers rebuild their entries each render; a row only has to redraw when what it shows changed.\n  (a, b) =>\n    a.onChange === b.onChange &&\n    a.token.name === b.token.name &&\n    a.token.type === b.token.type &&\n    a.token.value === b.token.value &&\n    a.token.overridden === b.token.overridden &&\n    a.token.description === b.token.description,\n);\n\nfunction Family({ group, tokens, onChange }: { group: string; tokens: readonly TokenEntry[]; onChange: OnChange }) {\n  const [picked, setPicked] = useState<string | null>(null);\n  const token = tokens.find((t) => t.name === picked) ?? null;\n  return (\n    <div className={s.family} role=\"group\" aria-label={group}>\n      <span className={s.name}>{group}</span>\n      <div className={s.strip}>\n        {tokens.map((t) => (\n          <TooltipTrigger key={t.name} delay={0}>\n            <Focusable>\n              <button\n                type=\"button\"\n                className={s.swatch}\n                style={{ '--token-color': t.value } as CSSProperties}\n                aria-label={t.name}\n                aria-pressed={t.name === picked}\n                data-overridden={t.overridden ? '' : undefined}\n                onClick={() => setPicked((current) => (current === t.name ? null : t.name))}\n              />\n            </Focusable>\n            <Tooltip>{t.name}</Tooltip>\n          </TooltipTrigger>\n        ))}\n      </div>\n      {token ? <TokenRow token={token} onChange={onChange} /> : null}\n    </div>\n  );\n}\n\nfunction ScaleStep({\n  token,\n  label,\n  showUnit,\n  factor,\n  onChange,\n  onFactorChange,\n}: {\n  token: TokenEntry;\n  label: string;\n  showUnit: boolean;\n  factor?: number;\n  onChange: OnChange;\n  onFactorChange?: (factor: number) => void;\n}) {\n  const split = splitUnit(token.value);\n  if (!split) return null;\n  return (\n    <div className={s.step} title={token.description || token.name} data-overridden={token.overridden ? '' : undefined}>\n      <span className={s.stepLabel}>{label}</span>\n      <span className={s.stepEdit}>\n        <NumberField\n          className={s.number}\n          aria-label={`${token.name} value`}\n          value={split.amount}\n          hideSteppers\n          formatOptions={NUMBER_FORMAT}\n          onChange={(amount) => {\n            if (Number.isFinite(amount)) onChange(token.name, `${amount}${split.unit}`);\n          }}\n        />\n        {showUnit && split.unit ? <span className={s.unit}>{split.unit}</span> : null}\n      </span>\n      {factor !== undefined && onFactorChange ? (\n        <span className={s.stepEdit}>\n          <span className={s.unit}>×</span>\n          <NumberField\n            className={s.number}\n            aria-label={`${token.name} factor`}\n            value={factor}\n            hideSteppers\n            formatOptions={NUMBER_FORMAT}\n            onChange={(next) => {\n              if (Number.isFinite(next)) onFactorChange(next);\n            }}\n          />\n        </span>\n      ) : null}\n    </div>\n  );\n}\n\nconst RULES: readonly ToggleBarItem<TokenScaleRule['kind']>[] = [\n  { value: 'factors', label: 'each', ariaLabel: 'factors' },\n  { value: 'ratio', label: 'ratio' },\n  { value: 'step', label: 'step' },\n];\n\nfunction ScaleRuleControls({\n  group,\n  scale,\n  unit,\n  amounts,\n  onScaleChange,\n}: {\n  group: string;\n  scale: TokenScale;\n  unit: string;\n  amounts: readonly number[];\n  onScaleChange: (scale: TokenScale) => void;\n}) {\n  const { rule } = scale;\n  const param =\n    rule.kind === 'ratio'\n      ? { key: 'ratio' as const, value: rule.ratio }\n      : rule.kind === 'step'\n        ? { key: 'step' as const, value: rule.step }\n        : null;\n  return (\n    <div className={s.rule}>\n      <span className={s.stepEdit}>\n        <span className={s.ruleLabel}>base</span>\n        <NumberField\n          className={s.number}\n          aria-label={`${group} base`}\n          value={scale.base}\n          hideSteppers\n          formatOptions={NUMBER_FORMAT}\n          onChange={(base) => {\n            if (Number.isFinite(base)) onScaleChange({ ...scale, base });\n          }}\n        />\n        {unit ? <span className={s.unit}>{unit}</span> : null}\n      </span>\n      <ToggleBar\n        ariaLabel={`${group} rule`}\n        size=\"sm\"\n        items={RULES}\n        value={rule.kind}\n        onChange={(kind) => {\n          if (kind && kind !== rule.kind) onScaleChange(refitScale(scale, kind, amounts));\n        }}\n      />\n      {param ? (\n        <span className={s.stepEdit}>\n          {param.key === 'ratio' ? <span className={s.unit}>×</span> : <span className={s.unit}>+</span>}\n          <NumberField\n            className={s.number}\n            aria-label={`${group} ${param.key}`}\n            value={param.value}\n            hideSteppers\n            formatOptions={NUMBER_FORMAT}\n            onChange={(value) => {\n              if (Number.isFinite(value)) onScaleChange({ ...scale, rule: { kind: param.key, [param.key]: value } as TokenScaleRule });\n            }}\n          />\n        </span>\n      ) : null}\n    </div>\n  );\n}\n\nfunction Scale({\n  group,\n  tokens,\n  generator,\n  onChange,\n  onScaleChange,\n}: {\n  group: string;\n  tokens: readonly TokenEntry[];\n  generator?: TokenScale;\n  onChange: OnChange;\n  onScaleChange?: (group: string, scale: TokenScale) => void;\n}) {\n  const labels = useMemo(() => stepLabels(tokens.map((t) => t.name)), [tokens]);\n  const units = new Set(tokens.map((t) => splitUnit(t.value)?.unit ?? ''));\n  const unit = units.size === 1 ? [...units][0] : null;\n  const overridden = tokens.filter((t) => t.overridden);\n  return (\n    <div className={s.scale} role=\"group\" aria-label={group}>\n      <span className={s.scaleHead}>\n        <span className={s.name}>{group}</span>\n        {unit ? <span className={s.unit}>{unit}</span> : null}\n        {overridden.length > 0 ? (\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            ariaLabel={`Reset ${group}`}\n            onClick={() => {\n              for (const t of overridden) onChange(t.name, null);\n            }}\n          >\n            Reset\n          </Button>\n        ) : null}\n      </span>\n      {generator && onScaleChange ? (\n        <ScaleRuleControls\n          group={group}\n          scale={generator}\n          unit={unit ?? ''}\n          amounts={generator.tokens.map(\n            (name) => splitUnit(tokens.find((t) => t.name === name)?.value ?? '')?.amount ?? generator.base,\n          )}\n          onScaleChange={(next) => onScaleChange(group, next)}\n        />\n      ) : null}\n      <div className={s.steps}>\n        {tokens.map((t, i) => {\n          const rule = generator?.rule;\n          const at = generator ? generator.tokens.indexOf(t.name) : -1;\n          const factor = rule?.kind === 'factors' && at >= 0 ? rule.factors[at] : undefined;\n          return (\n            <ScaleStep\n              key={t.name}\n              token={t}\n              label={labels[i] ?? t.name}\n              showUnit={unit === null}\n              factor={factor}\n              onChange={onChange}\n              onFactorChange={\n                generator && onScaleChange && rule?.kind === 'factors'\n                  ? (next) =>\n                      onScaleChange(group, {\n                        ...generator,\n                        rule: { kind: 'factors', factors: rule.factors.map((f, j) => (j === at ? next : f)) },\n                      })\n                  : undefined\n              }\n            />\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nfunction Section({\n  title,\n  open,\n  onToggle,\n  tokens,\n  familySize,\n  scales,\n  onChange,\n  onScaleChange,\n}: {\n  title: string;\n  open: boolean;\n  onToggle: () => void;\n  tokens: readonly TokenEntry[];\n  familySize: number;\n  scales?: Readonly<Record<string, TokenScale>>;\n  onChange: OnChange;\n  onScaleChange?: (group: string, scale: TokenScale) => void;\n}) {\n  const items = useMemo(() => itemsOf(tokens, familySize), [tokens, familySize]);\n  return (\n    <section className={s.section} aria-label={title}>\n      <DisclosureRow className={s.sectionHead} open={open} onToggle={onToggle} label={title}>\n        <span aria-hidden=\"true\">{title}</span>\n      </DisclosureRow>\n      {open ? (\n        <div className={s.sectionBody}>\n          {items.map((item) =>\n            item.kind === 'row' ? (\n              <TokenRow key={item.token.name} token={item.token} onChange={onChange} />\n            ) : item.kind === 'scale' ? (\n              <Scale\n                key={`scale:${item.group}`}\n                group={item.group}\n                tokens={item.tokens}\n                generator={scales?.[item.group]}\n                onChange={onChange}\n                onScaleChange={onScaleChange}\n              />\n            ) : (\n              <Family key={`family:${item.group}`} group={item.group} tokens={item.tokens} onChange={onChange} />\n            ),\n          )}\n        </div>\n      ) : null}\n    </section>\n  );\n}\n\n/**\n * Edits a set of design tokens by type: collapsible sections by category, a\n * color group drawn as one row of swatches sized to fit, a group of sizes drawn\n * as one grid of numbers labeled by step — with its base and rule above it when\n * `scales` says how it is generated — and a control for each\n * type — a number with its unit for dimensions and durations, the nine weights\n * for a font weight, a curve beside a `cubic-bezier()`, a swatch beside a color,\n * and text for everything else.\n */\nexport function TokenPanel({\n  tokens,\n  onChange,\n  collapsed,\n  onCollapsedChange,\n  scales,\n  onScaleChange,\n  categorize = tokenCategory,\n  familySize = 3,\n  density = 'normal',\n  className,\n}: TokenPanelProps) {\n  const [ownCollapsed, setOwnCollapsed] = useState<Partial<Record<TokenCategory, boolean>>>({});\n  const closed = collapsed ?? ownCollapsed;\n  const byCategory = useMemo(() => {\n    const sections = new Map<TokenCategory, TokenEntry[]>();\n    for (const token of tokens) {\n      const category = categorize(token);\n      sections.set(category, [...(sections.get(category) ?? []), token]);\n    }\n    return sections;\n  }, [tokens, categorize]);\n\n  return (\n    <div className={[s.panel, density === 'tight' && s.tight, className].filter(Boolean).join(' ')}>\n      {TOKEN_CATEGORIES.map(({ id, title }) => {\n        const inSection = byCategory.get(id);\n        if (!inSection) return null;\n        const open = !closed[id];\n        return (\n          <Section\n            key={id}\n            title={title}\n            open={open}\n            onToggle={() => {\n              if (collapsed === undefined) setOwnCollapsed((prev) => ({ ...prev, [id]: open }));\n              onCollapsedChange?.(id, open);\n            }}\n            tokens={inSection}\n            familySize={familySize}\n            scales={scales}\n            onChange={onChange}\n            onScaleChange={onScaleChange}\n          />\n        );\n      })}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/chunks/{ToolButton-BURp4YIO.js → ToolButton-Bo7WH1wt.js}

@@ -1,4 +1,4 @@
-import { n as e, r as t } from "./Tooltip-C6eFCYxw.js";
+import { n as e, r as t } from "./Tooltip-DljsPEQG.js";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
 import { Focusable as i } from "react-aria-components";
 var a = {
@@ -49,4 +49,4 @@ function o(o) {
 //#endregion
 export { o as t };
 
-//# sourceMappingURL=ToolButton-BURp4YIO.js.map
+//# sourceMappingURL=ToolButton-Bo7WH1wt.js.map

package/dist/chunks/{ToolButton-BURp4YIO.js.map → ToolButton-Bo7WH1wt.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ToolButton-BURp4YIO.js","names":["s","TooltipTrigger","Tooltip","Tooltip$1","TooltipTrigger$1","ToolButton_module_default","ToolButton","props","resolvedTitle","title","shortcut","label","cls","active","className","disabled","Focusable","ariaDisabled","icon"],"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: var(--wzl-space-1);\n  min-width: 44px;\n  padding: var(--wzl-space-3) var(--wzl-space-2);\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: var(--wzl-radius-sm);\n  color: var(--wzl-fg);\n  cursor: default;\n  font-family: inherit;\n  font-size: var(--wzl-font-size-xs);\n  line-height: 1.1;\n}\n.button:hover:not([disabled]) {\n  background: var(--wzl-surface-hover);\n  color: var(--wzl-fg);\n}\n.button:focus-visible {\n  outline: 2px solid var(--wzl-accent);\n  outline-offset: -2px;\n}\n.button.active {\n  background: var(--wzl-surface-pressed);\n  border-color: var(--wzl-accent);\n  color: var(--wzl-fg);\n}\n.button[disabled] {\n  opacity: 0.4;\n}\n\n.icon { display: block; }\n.icon > svg { display: block; }\n.label { font-size: var(--wzl-font-size-xs); }\n.shortcut {\n  color: var(--wzl-fg-muted);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-2xs);\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\n/** Props for {@link ToolButton}. */\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  /** 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 {\n    icon, label, shortcut, active, disabled, ariaDisabled,\n    onClick, title, className,\n  } = 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          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":";;;;;;;;;;;;ACuCA,SAAgBM,EAAW,GAAwB;CACjD,IAAM,EACJ,SAAM,UAAO,aAAU,WAAQ,aAAU,iBACzC,YAAS,UAAO,iBACdC,GACEC,IAAgBC,MAAUC,IAAW,GAAGC,EAAM,IAAID,EAAS,KAAKC,IAChEC,IAAM;EAACZ,EAAE;EAAQa,KAAUb,EAAE;EAAQc;CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAC9E,OACE,kBAACb,GAAD;EAAgB,YAAYc;EAA5B,UAAA,CACE,kBAACC,GAAD;GAAW,YAAYD;GACrB,UAAA,kBAAC,UAAD;IACE,MAAK;IACL,WAAWH;IACX,gBAAcC,IAAS,SAAS,KAAA;IAChC,iBAAeI,IAAe,SAAS,KAAA;IAC7B;IACD;IANX,UAAA;KAQE,kBAAC,QAAD;MAAM,WAAWjB,EAAE;MAAM,eAAY;MAAQ,UAAAkB;KAAW,CAAA;KACxD,kBAAC,QAAD;MAAM,WAAWlB,EAAE;MAAQ,UAAAW;KAAY,CAAA;KACtCD,KAAY,kBAAC,QAAD;MAAM,WAAWV,EAAE;MAAW,UAAAU;KAAe,CAAA;IACpD;;EACC,CAAA,GACX,kBAACR,GAAD,EAAA,UAAUM,EAAuB,CAAA,CACnB;;AAEpB"}
+{"version":3,"file":"ToolButton-Bo7WH1wt.js","names":["s","TooltipTrigger","Tooltip","Tooltip$1","TooltipTrigger$1","ToolButton_module_default","ToolButton","props","resolvedTitle","title","shortcut","label","cls","active","className","disabled","Focusable","ariaDisabled","icon"],"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: var(--wzl-space-1);\n  min-width: 44px;\n  padding: var(--wzl-space-3) var(--wzl-space-2);\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: var(--wzl-radius-sm);\n  color: var(--wzl-fg);\n  cursor: default;\n  font-family: inherit;\n  font-size: var(--wzl-font-size-xs);\n  line-height: 1.1;\n}\n.button:hover:not([disabled]) {\n  background: var(--wzl-surface-hover);\n  color: var(--wzl-fg);\n}\n.button:focus-visible {\n  outline: 2px solid var(--wzl-accent);\n  outline-offset: -2px;\n}\n.button.active {\n  background: var(--wzl-surface-pressed);\n  border-color: var(--wzl-accent);\n  color: var(--wzl-fg);\n}\n.button[disabled] {\n  opacity: 0.4;\n}\n\n.icon { display: block; }\n.icon > svg { display: block; }\n.label { font-size: var(--wzl-font-size-xs); }\n.shortcut {\n  color: var(--wzl-fg-muted);\n  font-family: var(--wzl-font-mono);\n  font-size: var(--wzl-font-size-2xs);\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\n/** Props for {@link ToolButton}. */\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  /** 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 {\n    icon, label, shortcut, active, disabled, ariaDisabled,\n    onClick, title, className,\n  } = 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          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":";;;;;;;;;;;;ACuCA,SAAgBM,EAAW,GAAwB;CACjD,IAAM,EACJ,SAAM,UAAO,aAAU,WAAQ,aAAU,iBACzC,YAAS,UAAO,iBACdC,GACEC,IAAgBC,MAAUC,IAAW,GAAGC,EAAM,IAAID,EAAS,KAAKC,IAChEC,IAAM;EAACZ,EAAE;EAAQa,KAAUb,EAAE;EAAQc;CAAS,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;CAC9E,OACE,kBAACb,GAAD;EAAgB,YAAYc;EAA5B,UAAA,CACE,kBAACC,GAAD;GAAW,YAAYD;GACrB,UAAA,kBAAC,UAAD;IACE,MAAK;IACL,WAAWH;IACX,gBAAcC,IAAS,SAAS,KAAA;IAChC,iBAAeI,IAAe,SAAS,KAAA;IAC7B;IACD;IANX,UAAA;KAQE,kBAAC,QAAD;MAAM,WAAWjB,EAAE;MAAM,eAAY;MAAQ,UAAAkB;KAAW,CAAA;KACxD,kBAAC,QAAD;MAAM,WAAWlB,EAAE;MAAQ,UAAAW;KAAY,CAAA;KACtCD,KAAY,kBAAC,QAAD;MAAM,WAAWV,EAAE;MAAW,UAAAU;KAAe,CAAA;IACpD;;EACC,CAAA,GACX,kBAACR,GAAD,EAAA,UAAUM,EAAuB,CAAA,CACnB;;AAEpB"}