@weasel-js/ui 1.5.2 → 1.6.1

package/dist/chunks/DataGrid-C8KrYtw7.js

@@ -1,104 +0,0 @@
-import { t as e } from "./useReorderDragList-CSQGd7zQ.js";
-import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
-import { useMemo as i, useState as a } from "react";
-var o = {
-	grid: "_grid_rn983_1",
-	table: "_table_rn983_6",
-	sortButton: "_sortButton_rn983_32",
-	sortActive: "_sortActive_rn983_44",
-	empty: "_empty_rn983_46",
-	handleCol: "_handleCol_rn983_54",
-	handleCell: "_handleCell_rn983_55",
-	dragging: "_dragging_rn983_64",
-	dropBefore: "_dropBefore_rn983_66",
-	dropAfter: "_dropAfter_rn983_67"
-};
-//#endregion
-//#region src/components/DataGrid/DataGrid.tsx
-function s(s) {
-	let { rows: c, columns: l, defaultSort: u, onReorder: d, empty: f = "—", className: p } = s, [m, h] = a(u ?? null), g = i(() => {
-		if (!m) return [...c];
-		let e = l.find((e) => e.id === m.columnId);
-		if (!e) return [...c];
-		let t = e.accessor ?? ((t) => t[e.id]), n = m.direction === "asc" ? 1 : -1;
-		return [...c].sort((e, r) => {
-			let i = t(e), a = t(r);
-			return i == null && a == null ? 0 : i == null ? 1 : a == null ? -1 : i < a ? -1 * n : i > a ? 1 * n : 0;
-		});
-	}, [
-		c,
-		l,
-		m
-	]), _ = (e) => {
-		h((t) => !t || t.columnId !== e ? {
-			columnId: e,
-			direction: "asc"
-		} : t.direction === "asc" ? {
-			columnId: e,
-			direction: "desc"
-		} : null);
-	}, v = e({
-		items: g.map((e) => ({
-			id: e.id,
-			label: ""
-		})),
-		selectedIds: [],
-		onReorder: d ?? (() => {})
-	}), y = !!d;
-	return /* @__PURE__ */ n("div", {
-		className: [o.grid, p].filter(Boolean).join(" "),
-		children: /* @__PURE__ */ r("table", {
-			className: o.table,
-			children: [/* @__PURE__ */ n("thead", { children: /* @__PURE__ */ r("tr", { children: [y && /* @__PURE__ */ n("th", {
-				className: o.handleCol,
-				"aria-label": "drag"
-			}), l.map((e) => {
-				let i = e.sortable !== !1, a = m?.columnId === e.id, s = a ? m.direction === "asc" ? " ↑" : " ↓" : "";
-				return /* @__PURE__ */ n("th", {
-					className: [e.className, a ? o.sortActive : ""].filter(Boolean).join(" "),
-					"aria-sort": i ? a ? m.direction === "asc" ? "ascending" : "descending" : "none" : void 0,
-					children: i ? /* @__PURE__ */ r("button", {
-						type: "button",
-						className: o.sortButton,
-						onClick: () => _(e.id),
-						children: [e.header, s]
-					}) : /* @__PURE__ */ r(t, { children: [e.header, s] })
-				}, e.id);
-			})] }) }), /* @__PURE__ */ r("tbody", {
-				ref: y ? v.containerProps.ref : void 0,
-				children: [g.length === 0 && /* @__PURE__ */ n("tr", { children: /* @__PURE__ */ n("td", {
-					colSpan: l.length + +!!y,
-					className: o.empty,
-					children: f
-				}) }), g.map((e, t) => {
-					let i = v.state.draggedIds?.includes(e.id) ?? !1, a = v.state.targetIndex;
-					return /* @__PURE__ */ r("tr", {
-						className: [
-							i && o.dragging,
-							a === t && o.dropBefore,
-							a === g.length && t === g.length - 1 && o.dropAfter
-						].filter(Boolean).join(" ") || void 0,
-						children: [y && /* @__PURE__ */ n("td", {
-							className: o.handleCell,
-							onPointerDown: (n) => v.rowProps(e.id, t).onPointerDown(n),
-							children: /* @__PURE__ */ n("span", {
-								"aria-hidden": "true",
-								children: "⋮⋮"
-							})
-						}), l.map((t) => {
-							let r = t.accessor ?? ((e) => e[t.id]), i = t.render ? t.render(e) : String(r(e) ?? "");
-							return /* @__PURE__ */ n("td", {
-								className: t.className,
-								children: i
-							}, t.id);
-						})]
-					}, e.id);
-				})]
-			})]
-		})
-	});
-}
-//#endregion
-export { s as t };
-
-//# sourceMappingURL=DataGrid-C8KrYtw7.js.map

package/dist/chunks/DataGrid-C8KrYtw7.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataGrid-C8KrYtw7.js","names":[],"sources":["../../src/components/DataGrid/DataGrid.module.css","../../src/components/DataGrid/DataGrid.tsx"],"sourcesContent":[".grid {\n  position: relative;\n  width: 100%;\n}\n\n.table {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: var(--wzl-font-size-sm);\n}\n\n.table th,\n.table td {\n  text-align: left;\n  padding: 3px var(--wzl-space-3);\n  vertical-align: middle;\n}\n.table tbody tr {\n  border-bottom: 1px solid var(--wzl-line-subtle);\n}\n\n.table th {\n  font-weight: var(--wzl-font-weight-bold);\n  color: var(--wzl-fg-muted);\n  position: sticky;\n  top: 0;\n  background: var(--wzl-surface, #2a2018);\n  z-index: 1;\n  border-bottom: 1px solid var(--wzl-border);\n}\n\n.sortButton {\n  all: unset;\n  cursor: pointer;\n  user-select: none;\n  display: block;\n  width: 100%;\n}\n.sortButton:hover { color: var(--wzl-fg, #e6e7e9); }\n.sortButton:focus-visible {\n  outline: 2px solid var(--wzl-focus-ring, var(--wzl-accent, #7fb069));\n  outline-offset: -2px;\n}\n.sortActive { color: var(--wzl-fg, #e6e7e9); }\n\n.empty {\n  color: var(--wzl-fg-muted);\n  font-style: italic;\n  padding: var(--wzl-space-4) 0;\n  text-align: center;\n}\n\n/* Drag-handle column. */\n.handleCol { width: 14px; }\n.handleCell {\n  width: 14px;\n  cursor: grab;\n  color: var(--wzl-fg-muted);\n  user-select: none;\n  text-align: center;\n}\n.handleCell:active { cursor: grabbing; }\n\n.dragging { opacity: 0.4; }\n\n.dropBefore > td { box-shadow: inset 0 2px 0 0 var(--wzl-accent, #7fb069); }\n.dropAfter > td { box-shadow: inset 0 -2px 0 0 var(--wzl-accent, #7fb069); }\n","/**\n * Lightweight sortable data grid. Use for inspector tables — action\n * registries, route maps, telemetry rows. Intentionally narrow:\n *\n * - Sortable columns (click header to cycle asc → desc → none)\n * - Custom cell render via per-column `render`\n * - Optional drag handles for row reordering (when `onReorder` is set)\n *\n * Not: virtual scrolling, column resizing, multi-column sort, filtering,\n * inline editing. Reach for a real grid library when you need those.\n */\nimport { useMemo, useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { useReorderDragList } from '../../useReorderDragList';\nimport s from './DataGrid.module.css';\n\n/**\n * One column of a {@link DataGrid}. `id` doubles as the default property name\n * read off each row when no `accessor` is given.\n */\nexport interface DataGridColumn<Row> {\n  id: string;\n  header: ReactNode;\n  /** Pull a sortable value from the row. Defaults to `(row as any)[column.id]`. */\n  accessor?: (row: Row) => string | number | null | undefined;\n  /** Render the cell. Defaults to `String(accessor(row) ?? '')`. */\n  render?: (row: Row) => ReactNode;\n  /** Default true. Set false to suppress the sort affordance on this column. */\n  sortable?: boolean;\n  /** Optional CSS class on every <td> in this column. */\n  className?: string;\n}\n\n/** Props for {@link DataGrid}. */\nexport interface DataGridProps<Row extends { id: string }> {\n  rows: readonly Row[];\n  columns: readonly DataGridColumn<Row>[];\n  /** Initial sort. Omit for unsorted (rows render in input order). */\n  defaultSort?: { columnId: string; direction: 'asc' | 'desc' };\n  /** Enable drag handles in a leading column. Receives the reorder spec\n   *  (the existing `useReorderDragList` semantics — see weasel-ui). */\n  onReorder?: (ids: string[], targetIndex: number) => void;\n  /** Empty-state row text. Default `'—'`. */\n  empty?: ReactNode;\n  className?: string;\n}\n\ntype SortState = { columnId: string; direction: 'asc' | 'desc' } | null;\n\n/**\n * Sortable table for inspector-style data. Rows are keyed by `id`. Clicking a\n * sortable header cycles ascending, descending, unsorted; nullish values sort\n * last regardless of direction. Passing `onReorder` adds a leading drag-handle\n * column — note that the drag indices it reports are into the *sorted* row\n * order, not the input order.\n */\nexport function DataGrid<Row extends { id: string }>(props: DataGridProps<Row>) {\n  const { rows, columns, defaultSort, onReorder, empty = '—', className } = props;\n  const [sort, setSort] = useState<SortState>(defaultSort ?? null);\n\n  const sortedRows = useMemo(() => {\n    if (!sort) return [...rows];\n    const col = columns.find((c) => c.id === sort.columnId);\n    if (!col) return [...rows];\n    const get = col.accessor ?? ((row: Row) => (row as unknown as Record<string, unknown>)[col.id] as string | number | null | undefined);\n    const dir = sort.direction === 'asc' ? 1 : -1;\n    return [...rows].sort((a, b) => {\n      const av = get(a);\n      const bv = get(b);\n      if (av == null && bv == null) return 0;\n      if (av == null) return 1;\n      if (bv == null) return -1;\n      if (av < bv) return -1 * dir;\n      if (av > bv) return 1 * dir;\n      return 0;\n    });\n  }, [rows, columns, sort]);\n\n  const cycleSort = (columnId: string) => {\n    setSort((cur) => {\n      if (!cur || cur.columnId !== columnId) return { columnId, direction: 'asc' };\n      if (cur.direction === 'asc') return { columnId, direction: 'desc' };\n      return null;\n    });\n  };\n\n  // Drag handles via useReorderDragList. Adapter: the hook expects\n  // `{ id, label }`-shaped items; we map our rows to that shape (label\n  // unused — the hook only uses id and locked).\n  const drag = useReorderDragList({\n    items: sortedRows.map((r) => ({ id: r.id, label: '' })),\n    selectedIds: [],\n    onReorder: onReorder ?? (() => {}),\n  });\n  const dragEnabled = !!onReorder;\n\n  const cls = [s.grid, className].filter(Boolean).join(' ');\n\n  return (\n    <div\n      className={cls}\n    >\n      <table className={s.table}>\n        <thead>\n          <tr>\n            {dragEnabled && <th className={s.handleCol} aria-label=\"drag\" />}\n            {columns.map((col) => {\n              const sortable = col.sortable !== false;\n              const active = sort?.columnId === col.id;\n              const indicator = active ? (sort.direction === 'asc' ? ' ↑' : ' ↓') : '';\n              return (\n                <th\n                  key={col.id}\n                  className={[col.className, active ? s.sortActive : ''].filter(Boolean).join(' ')}\n                  aria-sort={sortable ? (active ? (sort.direction === 'asc' ? 'ascending' : 'descending') : 'none') : undefined}\n                >\n                  {sortable ? (\n                    <button type=\"button\" className={s.sortButton} onClick={() => cycleSort(col.id)}>\n                      {col.header}{indicator}\n                    </button>\n                  ) : (\n                    <>{col.header}{indicator}</>\n                  )}\n                </th>\n              );\n            })}\n          </tr>\n        </thead>\n        <tbody ref={dragEnabled ? (drag.containerProps.ref as React.RefCallback<HTMLTableSectionElement>) : undefined}>\n          {sortedRows.length === 0 && (\n            <tr>\n              <td colSpan={columns.length + (dragEnabled ? 1 : 0)} className={s.empty}>\n                {empty}\n              </td>\n            </tr>\n          )}\n          {sortedRows.map((row, i) => {\n            const isDragging = drag.state.draggedIds?.includes(row.id) ?? false;\n            const target = drag.state.targetIndex;\n            const rowCls = [\n              isDragging && s.dragging,\n              target === i && s.dropBefore,\n              target === sortedRows.length && i === sortedRows.length - 1 && s.dropAfter,\n            ].filter(Boolean).join(' ');\n            return (\n              <tr key={row.id} className={rowCls || undefined}>\n                {dragEnabled && (\n                  <td\n                    className={s.handleCell}\n                    onPointerDown={(e) => drag.rowProps(row.id, i).onPointerDown(e)}\n                  >\n                    <span aria-hidden=\"true\">⋮⋮</span>\n                  </td>\n                )}\n                {columns.map((col) => {\n                  const get = col.accessor ?? ((r: Row) => (r as unknown as Record<string, unknown>)[col.id] as string | number | null | undefined);\n                  const content = col.render ? col.render(row) : String(get(row) ?? '');\n                  return (\n                    <td key={col.id} className={col.className}>\n                      {content}\n                    </td>\n                  );\n                })}\n              </tr>\n            );\n          })}\n        </tbody>\n      </table>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;ACwDA,SAAgB,EAAqC,GAA2B;CAC9E,IAAM,EAAE,SAAM,YAAS,gBAAa,cAAW,WAAQ,KAAK,iBAAc,GACpE,CAAC,GAAM,KAAW,EAAoB,KAAe,KAAK,EAE1D,IAAa,QAAc;AAC/B,MAAI,CAAC,EAAM,QAAO,CAAC,GAAG,EAAK;EAC3B,IAAM,IAAM,EAAQ,MAAM,MAAM,EAAE,OAAO,EAAK,SAAS;AACvD,MAAI,CAAC,EAAK,QAAO,CAAC,GAAG,EAAK;EAC1B,IAAM,IAAM,EAAI,cAAc,MAAc,EAA2C,EAAI,MACrF,IAAM,EAAK,cAAc,QAAQ,IAAI;AAC3C,SAAO,CAAC,GAAG,EAAK,CAAC,MAAM,GAAG,MAAM;GAC9B,IAAM,IAAK,EAAI,EAAE,EACX,IAAK,EAAI,EAAE;AAMjB,UALI,KAAM,QAAQ,KAAM,OAAa,IACjC,KAAM,OAAa,IACnB,KAAM,OAAa,KACnB,IAAK,IAAW,KAAK,IACrB,IAAK,IAAW,IAAI,IACjB;IACP;IACD;EAAC;EAAM;EAAS;EAAK,CAAC,EAEnB,KAAa,MAAqB;AACtC,KAAS,MACH,CAAC,KAAO,EAAI,aAAa,IAAiB;GAAE;GAAU,WAAW;GAAO,GACxE,EAAI,cAAc,QAAc;GAAE;GAAU,WAAW;GAAQ,GAC5D,KACP;IAME,IAAO,EAAmB;EAC9B,OAAO,EAAW,KAAK,OAAO;GAAE,IAAI,EAAE;GAAI,OAAO;GAAI,EAAE;EACvD,aAAa,EAAE;EACf,WAAW,YAAoB;EAChC,CAAC,EACI,IAAc,CAAC,CAAC;AAItB,QACE,kBAAC,OAAD;EACE,WAJQ,CAAC,EAAE,MAAM,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAItC;YAEX,kBAAC,SAAD;GAAO,WAAW,EAAE;aAApB,CACE,kBAAC,SAAD,EAAA,UACE,kBAAC,MAAD,EAAA,UAAA,CACG,KAAe,kBAAC,MAAD;IAAI,WAAW,EAAE;IAAW,cAAW;IAAS,CAAA,EAC/D,EAAQ,KAAK,MAAQ;IACpB,IAAM,IAAW,EAAI,aAAa,IAC5B,IAAS,GAAM,aAAa,EAAI,IAChC,IAAY,IAAU,EAAK,cAAc,QAAQ,OAAO,OAAQ;AACtE,WACE,kBAAC,MAAD;KAEE,WAAW,CAAC,EAAI,WAAW,IAAS,EAAE,aAAa,GAAG,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;KAChF,aAAW,IAAY,IAAU,EAAK,cAAc,QAAQ,cAAc,eAAgB,SAAU,KAAA;eAEnG,IACC,kBAAC,UAAD;MAAQ,MAAK;MAAS,WAAW,EAAE;MAAY,eAAe,EAAU,EAAI,GAAG;gBAA/E,CACG,EAAI,QAAQ,EACN;UAET,kBAAA,GAAA,EAAA,UAAA,CAAG,EAAI,QAAQ,EAAa,EAAA,CAAA;KAE3B,EAXE,EAAI,GAWN;KAEP,CACC,EAAA,CAAA,EACC,CAAA,EACR,kBAAC,SAAD;IAAO,KAAK,IAAe,EAAK,eAAe,MAAqD,KAAA;cAApG,CACG,EAAW,WAAW,KACrB,kBAAC,MAAD,EAAA,UACE,kBAAC,MAAD;KAAI,SAAS,EAAQ,SAAU;KAAsB,WAAW,EAAE;eAC/D;KACE,CAAA,EACF,CAAA,EAEN,EAAW,KAAK,GAAK,MAAM;KAC1B,IAAM,IAAa,EAAK,MAAM,YAAY,SAAS,EAAI,GAAG,IAAI,IACxD,IAAS,EAAK,MAAM;AAM1B,YACE,kBAAC,MAAD;MAAiB,WANJ;OACb,KAAc,EAAE;OAChB,MAAW,KAAK,EAAE;OAClB,MAAW,EAAW,UAAU,MAAM,EAAW,SAAS,KAAK,EAAE;OAClE,CAAC,OAAO,QAAQ,CAAC,KAAK,IAEO,IAAU,KAAA;gBAAtC,CACG,KACC,kBAAC,MAAD;OACE,WAAW,EAAE;OACb,gBAAgB,MAAM,EAAK,SAAS,EAAI,IAAI,EAAE,CAAC,cAAc,EAAE;iBAE/D,kBAAC,QAAD;QAAM,eAAY;kBAAO;QAAS,CAAA;OAC/B,CAAA,EAEN,EAAQ,KAAK,MAAQ;OACpB,IAAM,IAAM,EAAI,cAAc,MAAY,EAAyC,EAAI,MACjF,IAAU,EAAI,SAAS,EAAI,OAAO,EAAI,GAAG,OAAO,EAAI,EAAI,IAAI,GAAG;AACrE,cACE,kBAAC,MAAD;QAAiB,WAAW,EAAI;kBAC7B;QACE,EAFI,EAAI,GAER;QAEP,CACC;QAlBI,EAAI,GAkBR;MAEP,CACI;MACF;;EACJ,CAAA"}

package/dist/chunks/DetentSlider-CAubVX0J.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DetentSlider-CAubVX0J.js","names":[],"sources":["../../src/components/DetentSlider/DetentSlider.module.css","../../src/components/DetentSlider/DetentSlider.tsx"],"sourcesContent":[".root {\n  position: relative;\n  /* Read by Slider's track and stop marks. Detents run the full height of the\n   * track so they read as notches rather than as tally marks beside it. */\n  --rp-tick-inset: 0;\n  --rp-tick-width: 1px;\n  --rp-tick-color: var(--wzl-border-strong);\n  --rp-track-cursor: pointer;\n  font-family: var(--wzl-font-ui);\n}\n\n.slider {\n  width: 100%;\n}\n\n","import { useEffect, useRef, type ReactElement, type ReactNode } from 'react';\nimport { Slider, type SliderStop, type Thumb } from '../Slider/Slider';\nimport s from './DetentSlider.module.css';\n\n/** What a detent can carry. Narrowed so identity comparison and React keys\n *  both work without a keying callback. */\nexport type DetentValue = string | number;\n\n/** One detent on a {@link DetentSlider}. */\nexport type DetentItem<V extends DetentValue = number> = {\n  value: V;\n  /** Drawn under the detent. Defaults to `formatLabel(value)`, then `value`. */\n  label?: ReactNode;\n  /** Spoken form, when the drawn label is not the right thing to say. */\n  ariaLabel?: string;\n};\n\n/**\n * Props for {@link DetentSlider}.\n *\n * `items` takes bare values or `DetentItem`s interchangeably — a bare value is\n * a detent with no label of its own.\n *\n * `onChange` fires on every detent the control passes through, including\n * mid-drag: each one is a complete, legal choice, so there is no in-flight\n * value to withhold. `onCommit` fires once the gesture that changed things\n * ends, and is the one to write to history.\n */\nexport type DetentSliderProps<V extends DetentValue = number> = {\n  items: readonly (V | DetentItem<V>)[];\n  value: V;\n  onChange: (value: V, index: number) => void;\n  onCommit?: (value: V, index: number) => void;\n  formatLabel?: (value: V, index: number) => ReactNode;\n  labels?: 'all' | 'ends' | 'none';\n  trackHeight?: number;\n  ariaLabel?: string;\n  className?: string;\n};\n\nfunction normalize<V extends DetentValue>(items: readonly (V | DetentItem<V>)[]): DetentItem<V>[] {\n  return items.map(it => (typeof it === 'object' && it !== null ? it : ({ value: it } as DetentItem<V>)));\n}\n\n/**\n * The detent `value` selects. An exact match wins; a number that matches none\n * lands on the nearest one, so a value arriving from a numeric field or an\n * older save renders where it belongs rather than silently reading as the\n * first detent.\n */\nfunction resolveIndex<V extends DetentValue>(items: readonly DetentItem<V>[], value: V): number {\n  const exact = items.findIndex(it => it.value === value);\n  if (exact !== -1) return exact;\n  if (typeof value !== 'number') return 0;\n  let best = 0;\n  let bestGap = Infinity;\n  for (let i = 0; i < items.length; i++) {\n    const v = items[i].value;\n    if (typeof v !== 'number') continue;\n    const gap = Math.abs(v - value);\n    if (gap < bestGap) {\n      bestGap = gap;\n      best = i;\n    }\n  }\n  return best;\n}\n\nfunction plainText(label: ReactNode, fallback: DetentValue): string {\n  return typeof label === 'string' || typeof label === 'number' ? String(label) : String(fallback);\n}\n\n/**\n * Slider over a fixed list of values: one detent per value, evenly spaced, the\n * thumb resting on one of them.\n *\n * This is the shape to reach for when an option has a small set of allowed\n * values along a line — playback rate, zoom step, quality — in place of a\n * dropdown, which hides the ordering and the extent of the range behind a\n * click. The values need only be ordered, not numeric.\n *\n * It is a strict {@link Slider} over the *index* of `items`, which keeps the\n * detents evenly spaced however the values are distributed. Since the index is\n * meaningless to a screen reader, the value is published as `aria-valuetext`.\n * For numbers that may also rest between the detents, use `Slider` directly\n * with `spacing=\"even\"` and magnetic stops.\n */\nexport function DetentSlider<V extends DetentValue = number>(props: DetentSliderProps<V>): ReactElement {\n  const { value, onChange, onCommit, formatLabel, ariaLabel, className } = props;\n  const items = normalize(props.items);\n  const index = resolveIndex(items, value);\n  const lastIndex = Math.max(0, items.length - 1);\n\n  const labelOf = (item: DetentItem<V>, i: number): ReactNode =>\n    item.label ?? formatLabel?.(item.value, i) ?? String(item.value);\n\n  // Deduped separately: `live` suppresses the repeat reports a drag produces\n  // while the pointer crosses one detent, `changed` keeps a press that chose\n  // nothing from landing a no-op entry in the consumer's history.\n  const liveRef = useRef(index);\n  const changedRef = useRef(false);\n  useEffect(() => {\n    liveRef.current = index;\n  }, [index]);\n\n  const handleInput = (next: Thumb[]) => {\n    const i = next[0].value;\n    if (i === liveRef.current) return;\n    liveRef.current = i;\n    changedRef.current = true;\n    onChange(items[i].value, i);\n  };\n\n  const handleCommit = (next: Thumb[]) => {\n    if (!changedRef.current) return;\n    changedRef.current = false;\n    const i = next[0].value;\n    onCommit?.(items[i].value, i);\n  };\n\n  const current = items[index];\n  if (!current) return <div className={className ? `${s.root} ${className}` : s.root} />;\n\n  const thumbs: Thumb[] = [\n    { value: index, valueText: current.ariaLabel ?? plainText(labelOf(current, index), current.value) },\n  ];\n\n  const stops: SliderStop[] = items.map((item, i) => ({ value: i, label: labelOf(item, i) }));\n\n  return (\n    <div className={className ? `${s.root} ${className}` : s.root}>\n      <Slider\n        className={s.slider}\n        min={0}\n        max={lastIndex}\n        stops={stops}\n        snap=\"strict\"\n        stopLabels={props.labels ?? 'all'}\n        trackClick=\"move-nearest\"\n        trackHeight={props.trackHeight ?? 8}\n        ariaLabel={ariaLabel}\n        thumbs={thumbs}\n        onInput={handleInput}\n        onChange={handleCommit}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;ACwCA,SAAS,EAAiC,GAAwD;AAChG,QAAO,EAAM,KAAI,MAAO,OAAO,KAAO,YAAY,IAAc,IAAM,EAAE,OAAO,GAAI,CAAoB;;AASzG,SAAS,EAAoC,GAAiC,GAAkB;CAC9F,IAAM,IAAQ,EAAM,WAAU,MAAM,EAAG,UAAU,EAAM;AACvD,KAAI,MAAU,GAAI,QAAO;AACzB,KAAI,OAAO,KAAU,SAAU,QAAO;CACtC,IAAI,IAAO,GACP,IAAU;AACd,MAAK,IAAI,IAAI,GAAG,IAAI,EAAM,QAAQ,KAAK;EACrC,IAAM,IAAI,EAAM,GAAG;AACnB,MAAI,OAAO,KAAM,SAAU;EAC3B,IAAM,IAAM,KAAK,IAAI,IAAI,EAAM;AAC/B,EAAI,IAAM,MACR,IAAU,GACV,IAAO;;AAGX,QAAO;;AAGT,SAAS,EAAU,GAAkB,GAA+B;AAClE,QAAgE,OAAzD,OAAO,KAAU,YAAY,OAAO,KAAU,WAAkB,IAAgB,EAAS;;AAkBlG,SAAgB,EAA6C,GAA2C;CACtG,IAAM,EAAE,UAAO,aAAU,aAAU,gBAAa,cAAW,iBAAc,GACnE,IAAQ,EAAU,EAAM,MAAM,EAC9B,IAAQ,EAAa,GAAO,EAAM,EAClC,IAAY,KAAK,IAAI,GAAG,EAAM,SAAS,EAAE,EAEzC,KAAW,GAAqB,MACpC,EAAK,SAAS,IAAc,EAAK,OAAO,EAAE,IAAI,OAAO,EAAK,MAAM,EAK5D,IAAU,EAAO,EAAM,EACvB,IAAa,EAAO,GAAM;AAChC,SAAgB;AACd,IAAQ,UAAU;IACjB,CAAC,EAAM,CAAC;CAEX,IAAM,KAAe,MAAkB;EACrC,IAAM,IAAI,EAAK,GAAG;AACd,QAAM,EAAQ,YAClB,EAAQ,UAAU,GAClB,EAAW,UAAU,IACrB,EAAS,EAAM,GAAG,OAAO,EAAE;IAGvB,KAAgB,MAAkB;AACtC,MAAI,CAAC,EAAW,QAAS;AACzB,IAAW,UAAU;EACrB,IAAM,IAAI,EAAK,GAAG;AAClB,MAAW,EAAM,GAAG,OAAO,EAAE;IAGzB,IAAU,EAAM;AACtB,KAAI,CAAC,EAAS,QAAO,kBAAC,OAAD,EAAK,WAAW,IAAY,GAAG,EAAE,KAAK,GAAG,MAAc,EAAE,MAAQ,CAAA;CAEtF,IAAM,IAAkB,CACtB;EAAE,OAAO;EAAO,WAAW,EAAQ,aAAa,EAAU,EAAQ,GAAS,EAAM,EAAE,EAAQ,MAAM;EAAE,CACpG,EAEK,IAAsB,EAAM,KAAK,GAAM,OAAO;EAAE,OAAO;EAAG,OAAO,EAAQ,GAAM,EAAE;EAAE,EAAE;AAE3F,QACE,kBAAC,OAAD;EAAK,WAAW,IAAY,GAAG,EAAE,KAAK,GAAG,MAAc,EAAE;YACvD,kBAAC,GAAD;GACE,WAAW,EAAE;GACb,KAAK;GACL,KAAK;GACE;GACP,MAAK;GACL,YAAY,EAAM,UAAU;GAC5B,YAAW;GACX,aAAa,EAAM,eAAe;GACvB;GACH;GACR,SAAS;GACT,UAAU;GACV,CAAA;EACE,CAAA"}

package/dist/chunks/Dialog-fGqqQ6o_.js

@@ -1,61 +0,0 @@
-import { r as e } from "./portalHost-CjpCnuGU.js";
-import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
-import { Dialog as i, Heading as a, Modal as o, ModalOverlay as s } from "react-aria-components";
-var c = {
-	overlay: "_overlay_18n10_1",
-	modal: "_modal_18n10_29",
-	dialog: "_dialog_18n10_43",
-	header: "_header_18n10_51",
-	title: "_title_18n10_60",
-	close: "_close_18n10_68",
-	body: "_body_18n10_90",
-	footer: "_footer_18n10_97"
-};
-//#endregion
-//#region src/components/Dialog/Dialog.tsx
-function l(l) {
-	let { title: u, showCloseButton: d, children: f, footer: p, role: m = "dialog", className: h, isOpen: g, onOpenChange: _, portalContainer: v, ...y } = l, b = d ?? !!_, { anchor: x, portalProps: S } = e(v);
-	return /* @__PURE__ */ r(t, { children: [x, /* @__PURE__ */ n(s, {
-		...y,
-		isOpen: g,
-		onOpenChange: _,
-		className: c.overlay,
-		"data-weasel-overlay": "",
-		...S,
-		children: /* @__PURE__ */ n(o, {
-			className: [c.modal, h].filter(Boolean).join(" "),
-			children: /* @__PURE__ */ n(i, {
-				role: m,
-				className: c.dialog,
-				children: ({ close: e }) => /* @__PURE__ */ r(t, { children: [
-					(u !== void 0 || b) && /* @__PURE__ */ r("header", {
-						className: c.header,
-						children: [u !== void 0 && /* @__PURE__ */ n(a, {
-							slot: "title",
-							className: c.title,
-							children: u
-						}), b && /* @__PURE__ */ n("button", {
-							type: "button",
-							className: c.close,
-							onClick: e,
-							"aria-label": "Close dialog",
-							children: "×"
-						})]
-					}),
-					/* @__PURE__ */ n("div", {
-						className: c.body,
-						children: f
-					}),
-					p !== void 0 && /* @__PURE__ */ n("footer", {
-						className: c.footer,
-						children: p
-					})
-				] })
-			})
-		})
-	})] });
-}
-//#endregion
-export { l as t };
-
-//# sourceMappingURL=Dialog-fGqqQ6o_.js.map

package/dist/chunks/Dialog-fGqqQ6o_.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Dialog-fGqqQ6o_.js","names":[],"sources":["../../src/components/Dialog/Dialog.module.css","../../src/components/Dialog/Dialog.tsx"],"sourcesContent":[".overlay {\n  position: fixed;\n  inset: 0;\n  background: rgba(0, 0, 0, 0.4);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  opacity: 0;\n  transition: opacity var(--wzl-motion-fast);\n}\n\n.overlay[data-entering] {\n  opacity: 0;\n}\n\n.overlay[data-entering][data-rac] {\n  opacity: 1;\n}\n\n.overlay[data-exiting] {\n  opacity: 0;\n}\n\n.overlay[data-rac]:not([data-entering]):not([data-exiting]) {\n  opacity: 1;\n}\n\n.modal {\n  background: var(--wzl-surface);\n  border: 1px solid var(--wzl-border);\n  border-radius: var(--wzl-radius-md);\n  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);\n  color: var(--wzl-fg);\n  font-family: var(--wzl-font-ui);\n  max-width: min(900px, calc(100vw - 32px));\n  max-height: calc(100vh - 32px);\n  display: flex;\n  flex-direction: column;\n  outline: none;\n}\n\n.dialog {\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  flex: 1;\n  outline: none;\n}\n\n.header {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-space-6);\n  padding: var(--wzl-space-7) var(--wzl-space-8);\n  border-bottom: 1px solid var(--wzl-border);\n  flex: 0 0 auto;\n}\n\n.title {\n  flex: 1;\n  margin: 0;\n  font-size: var(--wzl-font-size);\n  font-weight: var(--wzl-font-weight-bold);\n  color: var(--wzl-fg);\n}\n\n.close {\n  flex: 0 0 auto;\n  width: var(--wzl-icon-button-size);\n  height: var(--wzl-icon-button-size);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: var(--wzl-radius-sm);\n  color: var(--wzl-fg-muted);\n  cursor: pointer;\n  padding: 0;\n  font-size: var(--wzl-font-size-lg);\n  line-height: 1;\n}\n\n.close:hover {\n  background: var(--wzl-surface-hover);\n  color: var(--wzl-fg);\n}\n\n.body {\n  flex: 1;\n  min-height: 0;\n  overflow: auto;\n  padding: var(--wzl-space-8);\n}\n\n.footer {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--wzl-space-4);\n  padding: var(--wzl-space-6) var(--wzl-space-8);\n  border-top: 1px solid var(--wzl-border);\n  flex: 0 0 auto;\n}\n","import type { ReactNode } from 'react';\nimport {\n  Modal as RACModal,\n  ModalOverlay,\n  Dialog as RACDialog,\n  Heading,\n  type ModalOverlayProps,\n  type DialogProps as RACDialogProps,\n} from 'react-aria-components';\nimport { useOverlayPortal, type OverlayPortalProps, type WithoutPortalTarget } from '../../overlays/portalHost';\nimport s from './Dialog.module.css';\n\n/** Props for {@link Dialog}, on top of React Aria's `ModalOverlay` props. */\nexport type DialogProps = Omit<\n  WithoutPortalTarget<ModalOverlayProps>,\n  'children' | 'className'\n> &\n  OverlayPortalProps & {\n    /** Heading rendered in the dialog's default header. Omit when supplying\n     *  a custom `header` slot via children. */\n    title?: ReactNode;\n    /** Show the built-in close button. Defaults to true when `onOpenChange`\n     *  is wired so the user has an escape hatch. */\n    showCloseButton?: boolean;\n    /** Body content. */\n    children?: ReactNode;\n    /** Footer slot — typically action buttons. */\n    footer?: ReactNode;\n    /** ARIA role. Defaults to `dialog`. Use `alertdialog` for confirms. */\n    role?: RACDialogProps['role'];\n    /** Class applied to the modal box (inside the overlay). */\n    className?: string;\n  };\n\n/**\n * Modal dialog wrapping React Aria. Supplies a default header (title +\n * close), scrollable body, and footer slot. Pass `isOpen` + `onOpenChange`\n * for controlled visibility, or omit both and use a `<DialogTrigger>` from\n * `react-aria-components` upstream of this component.\n *\n * Escape, click-outside, focus trap, and scroll lock all come from the\n * underlying primitives.\n */\nexport function Dialog(props: DialogProps) {\n  const {\n    title,\n    showCloseButton,\n    children,\n    footer,\n    role = 'dialog',\n    className,\n    isOpen,\n    onOpenChange,\n    portalContainer,\n    ...rest\n  } = props;\n\n  const showClose = showCloseButton ?? Boolean(onOpenChange);\n  const { anchor, portalProps } = useOverlayPortal(portalContainer);\n\n  return (\n    <>\n      {anchor}\n      <ModalOverlay\n        {...rest}\n        isOpen={isOpen}\n        onOpenChange={onOpenChange}\n        className={s.overlay}\n        data-weasel-overlay=\"\"\n        {...portalProps}\n      >\n        <RACModal className={[s.modal, className].filter(Boolean).join(' ')}>\n          <RACDialog role={role} className={s.dialog}>\n            {({ close }) => (\n              <>\n                {(title !== undefined || showClose) && (\n                  <header className={s.header}>\n                    {title !== undefined && (\n                      <Heading slot=\"title\" className={s.title}>{title}</Heading>\n                    )}\n                    {showClose && (\n                      <button\n                        type=\"button\"\n                        className={s.close}\n                        onClick={close}\n                        aria-label=\"Close dialog\"\n                      >\n                        ×\n                      </button>\n                    )}\n                  </header>\n                )}\n                <div className={s.body}>{children}</div>\n                {footer !== undefined && <footer className={s.footer}>{footer}</footer>}\n              </>\n            )}\n          </RACDialog>\n        </RACModal>\n      </ModalOverlay>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AC2CA,SAAgB,EAAO,GAAoB;CACzC,IAAM,EACJ,UACA,oBACA,aACA,WACA,UAAO,UACP,cACA,WACA,iBACA,oBACA,GAAG,MACD,GAEE,IAAY,KAAmB,EAAQ,GACvC,EAAE,WAAQ,mBAAgB,EAAiB,EAAgB;AAEjE,QACE,kBAAA,GAAA,EAAA,UAAA,CACG,GACD,kBAAC,GAAD;EACE,GAAI;EACI;EACM;EACd,WAAW,EAAE;EACb,uBAAoB;EACpB,GAAI;YAEJ,kBAAC,GAAD;GAAU,WAAW,CAAC,EAAE,OAAO,EAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;aACjE,kBAAC,GAAD;IAAiB;IAAM,WAAW,EAAE;eAChC,EAAE,eACF,kBAAA,GAAA,EAAA,UAAA;MACI,MAAU,KAAA,KAAa,MACvB,kBAAC,UAAD;MAAQ,WAAW,EAAE;gBAArB,CACG,MAAU,KAAA,KACT,kBAAC,GAAD;OAAS,MAAK;OAAQ,WAAW,EAAE;iBAAQ;OAAgB,CAAA,EAE5D,KACC,kBAAC,UAAD;OACE,MAAK;OACL,WAAW,EAAE;OACb,SAAS;OACT,cAAW;iBACZ;OAEQ,CAAA,CAEJ;;KAEX,kBAAC,OAAD;MAAK,WAAW,EAAE;MAAO;MAAe,CAAA;KACvC,MAAW,KAAA,KAAa,kBAAC,UAAD;MAAQ,WAAW,EAAE;gBAAS;MAAgB,CAAA;KACtE,EAAA,CAAA;IAEK,CAAA;GACH,CAAA;EACE,CAAA,CACd,EAAA,CAAA"}

package/dist/chunks/Disclosure-CILDfWsU.js

@@ -1,47 +0,0 @@
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-var n = {
-	twisty: "_twisty_1yb0k_5",
-	mark: "_mark_1yb0k_45",
-	down: "_down_1yb0k_57",
-	row: "_row_1yb0k_71",
-	rowBody: "_rowBody_1yb0k_79"
-};
-//#endregion
-//#region src/components/Disclosure/Disclosure.tsx
-function r({ open: t, onToggle: r, label: i, controls: a, direction: o = "right", size: s = 12, disabled: c, className: l }) {
-	return /* @__PURE__ */ e("button", {
-		type: "button",
-		className: [
-			n.twisty,
-			o === "down" && n.down,
-			l
-		].filter(Boolean).join(" "),
-		"aria-expanded": t,
-		"aria-controls": a,
-		"aria-label": i,
-		disabled: c,
-		onClick: r,
-		children: /* @__PURE__ */ e("svg", {
-			className: n.mark,
-			viewBox: "0 0 12 12",
-			width: s,
-			height: s,
-			"aria-hidden": "true",
-			focusable: "false",
-			children: /* @__PURE__ */ e("path", { d: "M4 2.5 L8.5 6 L4 9.5 Z" })
-		})
-	});
-}
-function i({ children: i, className: a, ...o }) {
-	return /* @__PURE__ */ t("div", {
-		className: a ? `${n.row} ${a}` : n.row,
-		children: [/* @__PURE__ */ e(r, { ...o }), /* @__PURE__ */ e("div", {
-			className: n.rowBody,
-			children: i
-		})]
-	});
-}
-//#endregion
-export { i as n, r as t };
-
-//# sourceMappingURL=Disclosure-CILDfWsU.js.map

package/dist/chunks/Disclosure-CILDfWsU.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Disclosure-CILDfWsU.js","names":[],"sources":["../../src/components/Disclosure/Disclosure.module.css","../../src/components/Disclosure/Disclosure.tsx"],"sourcesContent":["/* Every dimension is stated because a host app's bare-element defaults can be\n   authored at zero specificity — labkit's `:where(.lk-root) :where(button)`\n   sets `height: var(--wzl-control-h)` and horizontal padding, which would\n   otherwise stretch a 12px mark into a full-height control. */\n.twisty {\n  flex: 0 0 auto;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* A floor, not a size: a control sized to a 12px glyph is a 12px target,\n     which is under every pointer-size guideline there is. Stated as a minimum\n     so a larger mark grows the target with it rather than being shrunk to fit\n     — a flex item's default `flex-shrink: 1` would otherwise crush it. */\n  min-width: var(--wzl-disclosure-target, var(--wzl-control-h-sm));\n  min-height: var(--wzl-disclosure-target, var(--wzl-control-h-sm));\n  padding: 0;\n  border: 0;\n  border-radius: var(--wzl-radius-sm);\n  background: none;\n  backdrop-filter: none;\n  -webkit-backdrop-filter: none;\n  color: var(--wzl-fg-muted);\n  line-height: 1;\n  cursor: pointer;\n}\n\n.twisty:hover:not(:disabled) {\n  color: var(--wzl-fg);\n  background: var(--wzl-surface-raised);\n}\n\n.twisty:focus-visible {\n  outline: 2px solid var(--wzl-focus-ring);\n  outline-offset: -2px;\n  color: var(--wzl-fg);\n}\n\n.twisty:disabled {\n  color: var(--wzl-fg-subtle);\n  cursor: not-allowed;\n}\n\n/* `currentColor` so the mark follows the button's own hover and disabled\n   colors, and so a consumer can recolor the pair with one declaration. */\n.mark {\n  display: block;\n  flex: none;\n  fill: currentColor;\n  transition: transform var(--wzl-motion-fast, 90ms) var(--wzl-ease-out-cubic);\n}\n\n.twisty[aria-expanded='true'] .mark {\n  transform: rotate(90deg);\n}\n\n/* `direction=\"down\"` starts pointing down and lifts to point up. */\n.down .mark {\n  transform: rotate(90deg);\n}\n\n.down[aria-expanded='true'] .mark {\n  transform: rotate(-90deg);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .mark {\n    transition: none;\n  }\n}\n\n.row {\n  display: flex;\n  align-items: center;\n  gap: var(--wzl-disclosure-gap, 4px);\n}\n\n/* The row's content takes the rest and is allowed to shrink; the twisty is\n   not, so a long label truncates rather than crushing the control. */\n.rowBody {\n  flex: 1 1 auto;\n  min-width: 0;\n}\n","import type { ReactNode } from 'react';\nimport s from './Disclosure.module.css';\n\n/** Which way the mark points when the section is closed. */\nexport type DisclosureDirection = 'right' | 'down';\n\n/** Props for `<Disclosure>`. */\nexport interface DisclosureProps {\n  /** Whether the section it controls is open. The consumer owns this. */\n  open: boolean;\n  onToggle: () => void;\n  /**\n   * Names the section, for a screen reader. The control has no text of its\n   * own, so without this it announces as an unlabeled button.\n   */\n  label: string;\n  /**\n   * `id` of the element this expands. Sets `aria-controls`, which lets a\n   * screen reader move to the revealed content.\n   */\n  controls?: string;\n  /** Which way the closed mark points. `'right'` (default) rotates down when\n   *  open; `'down'` rotates up. */\n  direction?: DisclosureDirection;\n  /** Mark size in px. The hit target is at least 20px and grows with it.\n   *  Default 12. */\n  size?: number;\n  disabled?: boolean;\n  className?: string;\n}\n\n/**\n * The twisty on a collapsible section: a triangle that turns as it opens.\n *\n * Presentational — it holds no open/closed state and renders no children.\n * The consumer owns the state and the panel; this is the control that toggles\n * it, and `aria-expanded` is what ties the two together.\n *\n * Three things it settles that a hand-rolled twisty keeps getting wrong. The\n * mark is drawn rather than typed, because `--wzl-font-ui` carries no ▸/▾ and\n * a text glyph falls back to whatever the system offers at whatever size that\n * font renders it — around 6px against 13px body text, which reads as dirt on\n * the screen. The hit target is larger than the mark. And it is a sibling of\n * the row's label rather than a child, so clicking to expand does not actuate\n * the label's own control.\n *\n * Deliberately not part of the icon register, on the same grounds as\n * `DragHandleGlyph`: that register is outline strokes at a fixed weight, and\n * `base.mjs` rejects a solid triangle in it by name. A disclosure mark is\n * filled.\n */\nexport function Disclosure({\n  open,\n  onToggle,\n  label,\n  controls,\n  direction = 'right',\n  size = 12,\n  disabled,\n  className,\n}: DisclosureProps) {\n  const cls = [s.twisty, direction === 'down' && s.down, className].filter(Boolean).join(' ');\n  return (\n    <button\n      type=\"button\"\n      className={cls}\n      aria-expanded={open}\n      aria-controls={controls}\n      aria-label={label}\n      disabled={disabled}\n      onClick={onToggle}\n    >\n      <svg\n        className={s.mark}\n        viewBox=\"0 0 12 12\"\n        width={size}\n        height={size}\n        aria-hidden=\"true\"\n        focusable=\"false\"\n      >\n        {/* Vertex on the right edge at the vertical center, so the rotation\n            about the box center keeps the point on the same circle. */}\n        <path d=\"M4 2.5 L8.5 6 L4 9.5 Z\" />\n      </svg>\n    </button>\n  );\n}\n\n/** Props for `<DisclosureRow>`. */\nexport interface DisclosureRowProps extends Omit<DisclosureProps, 'className'> {\n  /** The row's own content — a label, a checkbox, a count. */\n  children: ReactNode;\n  className?: string;\n}\n\n/**\n * A `<Disclosure>` and a row of content beside it, laid out so the twisty\n * leads and the content takes the rest.\n *\n * The layout is the point: the twisty sits *outside* whatever the row puts in\n * it, so a row whose content is a `<label>` wrapping a checkbox stays\n * clickable as a label without the twisty actuating it.\n */\nexport function DisclosureRow({ children, className, ...twisty }: DisclosureRowProps) {\n  return (\n    <div className={className ? `${s.row} ${className}` : s.row}>\n      <Disclosure {...twisty} />\n      <div className={s.rowBody}>{children}</div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;ACmDA,SAAgB,EAAW,EACzB,SACA,aACA,UACA,aACA,eAAY,SACZ,UAAO,IACP,aACA,gBACkB;AAElB,QACE,kBAAC,UAAD;EACE,MAAK;EACL,WAJQ;GAAC,EAAE;GAAQ,MAAc,UAAU,EAAE;GAAM;GAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAIxE;EACX,iBAAe;EACf,iBAAe;EACf,cAAY;EACF;EACV,SAAS;YAET,kBAAC,OAAD;GACE,WAAW,EAAE;GACb,SAAQ;GACR,OAAO;GACP,QAAQ;GACR,eAAY;GACZ,WAAU;aAIV,kBAAC,QAAD,EAAM,GAAE,0BAA2B,CAAA;GAC/B,CAAA;EACC,CAAA;;AAmBb,SAAgB,EAAc,EAAE,aAAU,cAAW,GAAG,KAA8B;AACpF,QACE,kBAAC,OAAD;EAAK,WAAW,IAAY,GAAG,EAAE,IAAI,GAAG,MAAc,EAAE;YAAxD,CACE,kBAAC,GAAD,EAAY,GAAI,GAAU,CAAA,EAC1B,kBAAC,OAAD;GAAK,WAAW,EAAE;GAAU;GAAe,CAAA,CACvC"}

package/dist/chunks/DragHandleGlyph-CppAz4_8.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DragHandleGlyph-CppAz4_8.js","names":[],"sources":["../../src/components/DragHandleGlyph/DragHandleGlyph.tsx"],"sourcesContent":["/** Props for `<DragHandleGlyph>`. */\nexport interface DragHandleGlyphProps {\n  /** Height in px; width scales with it. Default 16. */\n  size?: number;\n}\n\n/** The two-column dot grip used on anything draggable by a handle.\n *\n *  Deliberately not part of the icon register: that register is outline strokes\n *  at a fixed weight, and a grip is filled dots. Forcing it in would either\n *  break the register's rule or produce a worse glyph. */\nexport function DragHandleGlyph({ size = 16 }: DragHandleGlyphProps) {\n  return (\n    <svg\n      width={(size * 8) / 16}\n      height={size}\n      viewBox=\"0 0 8 16\"\n      fill=\"currentColor\"\n      aria-hidden=\"true\"\n    >\n      <circle cx=\"2\" cy=\"3\" r=\"1.1\" />\n      <circle cx=\"6\" cy=\"3\" r=\"1.1\" />\n      <circle cx=\"2\" cy=\"8\" r=\"1.1\" />\n      <circle cx=\"6\" cy=\"8\" r=\"1.1\" />\n      <circle cx=\"2\" cy=\"13\" r=\"1.1\" />\n      <circle cx=\"6\" cy=\"13\" r=\"1.1\" />\n    </svg>\n  );\n}\n"],"mappings":";;AAWA,SAAgB,EAAgB,EAAE,UAAO,MAA4B;AACnE,QACE,kBAAC,OAAD;EACE,OAAQ,IAAO,IAAK;EACpB,QAAQ;EACR,SAAQ;EACR,MAAK;EACL,eAAY;YALd;GAOE,kBAAC,UAAD;IAAQ,IAAG;IAAI,IAAG;IAAI,GAAE;IAAQ,CAAA;GAChC,kBAAC,UAAD;IAAQ,IAAG;IAAI,IAAG;IAAI,GAAE;IAAQ,CAAA;GAChC,kBAAC,UAAD;IAAQ,IAAG;IAAI,IAAG;IAAI,GAAE;IAAQ,CAAA;GAChC,kBAAC,UAAD;IAAQ,IAAG;IAAI,IAAG;IAAI,GAAE;IAAQ,CAAA;GAChC,kBAAC,UAAD;IAAQ,IAAG;IAAI,IAAG;IAAK,GAAE;IAAQ,CAAA;GACjC,kBAAC,UAAD;IAAQ,IAAG;IAAI,IAAG;IAAK,GAAE;IAAQ,CAAA;GAC7B"}

package/dist/chunks/Field-DWnV8WZY.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Field-DWnV8WZY.js","names":[],"sources":["../../src/components/Field/Field.module.css","../../src/components/Field/Field.tsx"],"sourcesContent":[".field {\n  display: flex;\n  flex-direction: column;\n  gap: var(--wzl-space-2);\n  font-family: var(--wzl-font-ui);\n  color: var(--wzl-fg);\n}\n\n.label {\n  font-size: var(--wzl-font-size-sm);\n  font-weight: var(--wzl-font-weight-medium);\n  color: var(--wzl-fg);\n  cursor: default;\n}\n\n.hint {\n  font-size: var(--wzl-font-size-sm);\n  color: var(--wzl-fg-subtle);\n  line-height: 1.4;\n}\n\n.error {\n  font-size: var(--wzl-font-size-sm);\n  color: var(--wzl-danger);\n  line-height: 1.4;\n}\n\n.row {\n  flex-direction: row;\n  align-items: center;\n  gap: var(--wzl-space-4);\n}\n\n.row .label {\n  flex: 1;\n  min-width: 0;\n}\n","import type { ReactNode } from 'react';\nimport s from './Field.module.css';\n\n/**\n * Whether a {@link Field} stacks its label above the control or sits them\n * side by side.\n */\nexport type FieldOrientation = 'stacked' | 'row';\n\n/** Props for {@link Field}. */\nexport type FieldProps = {\n  orientation?: FieldOrientation;\n  className?: string;\n  children?: ReactNode;\n};\n\n/**\n * Layout primitive that arranges a label, control, hint, and error in the\n * canonical weasel-ui form-row shape. The control itself owns its semantics\n * (RAC `TextField`, `Checkbox`, etc.); this just paints the layout.\n *\n * Most users will instead reach for `Input` / `Checkbox` / `Switch`, which\n * compose Field internally. Use Field directly when you need a custom\n * control to sit in the same visual rhythm.\n */\nexport function Field({ orientation = 'stacked', className, children }: FieldProps) {\n  const cls = [s.field, orientation === 'row' && s.row, className].filter(Boolean).join(' ');\n  return <div className={cls}>{children}</div>;\n}\n\n/**\n * The class names {@link Field} paints its slots with, so a control composing\n * its own layout can match the same form-row rhythm.\n */\nexport const fieldClasses = {\n  root: s.field,\n  row: s.row,\n  label: s.label,\n  hint: s.hint,\n  error: s.error,\n};\n"],"mappings":";;;;;;;;;;ACyBA,SAAgB,EAAM,EAAE,iBAAc,WAAW,cAAW,eAAwB;AAElF,QAAO,kBAAC,OAAD;EAAK,WADA;GAAC,EAAE;GAAO,MAAgB,SAAS,EAAE;GAAK;GAAU,CAAC,OAAO,QAAQ,CAAC,KAAK,IAC/D;EAAM;EAAe,CAAA;;AAO9C,IAAa,IAAe;CAC1B,MAAM,EAAE;CACR,KAAK,EAAE;CACP,OAAO,EAAE;CACT,MAAM,EAAE;CACR,OAAO,EAAE;CACV"}

package/dist/chunks/FontFamilySelect-DxfgTC3G.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FontFamilySelect-DxfgTC3G.js","names":[],"sources":["../../src/components/FontFamilySelect/FontFamilySelect.tsx"],"sourcesContent":["/**\n * Font-family picker driven by the live font registry.\n *\n * **What it offers.** Both tiers that can actually paint: `listFonts()` for\n * families with a baked atlas, and `listCanvasFonts()` for families the\n * dynamic canvas-SDF tier will serve. Offer what will render, invent\n * nothing — and `listCanvasFonts` reports service rather than membership,\n * so a family auto-enrolled under a policy that is no longer in force\n * doesn't appear.\n *\n * **What it does with a value it can't offer.** Nothing about the model\n * stops a node from naming a family that was never registered — a pasted\n * node, an imported SVG, a document from a session that loaded more fonts.\n * The control keeps that value visible as its own entry and names what is\n * actually painting instead, read structurally off\n * `resolveFontVariant().substituted`. Dropping the value would silently\n * rewrite the document on the next edit; showing it bare would claim a font\n * is in use that isn't.\n */\nimport { listCanvasFonts, listFonts, resolveFontVariant } from '@weasel-js/font';\nimport { Select } from '../Select';\n\nexport interface FontFamilySelectProps {\n  /** Current family, or `undefined` when the sources disagree (`mixed`). */\n  value?: string;\n  /** Indeterminate presentation — the aggregated sources name different families. */\n  mixed?: boolean;\n  onChange: (family: string) => void;\n  /** The weight / style the text actually renders at, so the substitution\n   *  probe reports the variant that paints rather than a nominal 400/normal. */\n  weight?: number;\n  fontStyle?: 'normal' | 'italic';\n  'aria-label'?: string;\n  className?: string;\n}\n\n/** Label for a value that isn't in the registry: name the substitute when the\n *  fallback chain found one, otherwise say only what is known. */\nfunction unregisteredLabel(family: string, weight: number, style: 'normal' | 'italic'): string {\n  const { substituted } = resolveFontVariant(family, weight, style);\n  return substituted\n    ? `${family} — not loaded, showing ${substituted.resolved}`\n    : `${family} — not loaded`;\n}\n\nexport function FontFamilySelect(props: FontFamilySelectProps) {\n  const { value, mixed = false, onChange, weight = 400, fontStyle = 'normal', className } = props;\n  // Both tiers that actually render: families with a baked atlas, and\n  // families the dynamic canvas-SDF tier will serve. Neither list is a guess\n  // — `listCanvasFonts` reports what the registry will really route, so a\n  // family reaches this menu only if it can paint.\n  const baked = listFonts();\n  const canvas = listCanvasFonts().filter((c) => !baked.some((f) => f.family === c.family));\n  const available = [...baked.map((f) => f.family), ...canvas.map((c) => c.family)];\n  const options = available.map((family) => ({ value: family, label: family }));\n  if (value !== undefined && !available.includes(value)) {\n    options.push({ value, label: unregisteredLabel(value, weight, fontStyle) });\n  }\n  return (\n    <Select<string>\n      className={className}\n      options={options}\n      selectedKey={mixed ? null : (value ?? null)}\n      placeholder={mixed ? 'Mixed' : undefined}\n      onSelectionChange={onChange}\n      aria-label={props['aria-label'] ?? 'Font'}\n    />\n  );\n}\n"],"mappings":";;;;AAsCA,SAAS,EAAkB,GAAgB,GAAgB,GAAoC;CAC7F,IAAM,EAAE,mBAAgB,EAAmB,GAAQ,GAAQ,EAAM;AACjE,QAAO,IACH,GAAG,EAAO,yBAAyB,EAAY,aAC/C,GAAG,EAAO;;AAGhB,SAAgB,EAAiB,GAA8B;CAC7D,IAAM,EAAE,UAAO,WAAQ,IAAO,aAAU,YAAS,KAAK,eAAY,UAAU,iBAAc,GAKpF,IAAQ,GAAW,EACnB,IAAS,GAAiB,CAAC,QAAQ,MAAM,CAAC,EAAM,MAAM,MAAM,EAAE,WAAW,EAAE,OAAO,CAAC,EACnF,IAAY,CAAC,GAAG,EAAM,KAAK,MAAM,EAAE,OAAO,EAAE,GAAG,EAAO,KAAK,MAAM,EAAE,OAAO,CAAC,EAC3E,IAAU,EAAU,KAAK,OAAY;EAAE,OAAO;EAAQ,OAAO;EAAQ,EAAE;AAI7E,QAHI,MAAU,KAAA,KAAa,CAAC,EAAU,SAAS,EAAM,IACnD,EAAQ,KAAK;EAAE;EAAO,OAAO,EAAkB,GAAO,GAAQ,EAAU;EAAE,CAAC,EAG3E,kBAAC,GAAD;EACa;EACF;EACT,aAAa,IAAQ,OAAQ,KAAS;EACtC,aAAa,IAAQ,UAAU,KAAA;EAC/B,mBAAmB;EACnB,cAAY,EAAM,iBAAiB;EACnC,CAAA"}

package/dist/chunks/GradientEditor-rRBmf3G0.js

@@ -1,333 +0,0 @@
-import { t as e } from "./Slider-CIIrqiFS.js";
-import { t } from "./ToggleBar-CClus5Cd.js";
-import { t as n } from "./ColorField-BYzgZM9o.js";
-import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
-import { fillInPoseFrame as o, fillToBoundsFrame as s, gradientGeometry as c, isGradientFill as l, sampleGradientStops as u, useActionsRegistry as d, useHandleDrag as f, useNodeOverlayFrame as p, withGradientKind as m } from "@weasel-js/core";
-import { useCallback as h, useRef as g } from "react";
-//#region src/paintGradientTrack.tsx
-var _ = {
-	angleDeg: 135,
-	stripe: 2,
-	gap: 4,
-	dim: 75
-};
-function v(e) {
-	let { gradient: t, samples: n = 16, activeRange: r, hatch: a } = e;
-	return (e) => {
-		let o = [];
-		for (let e = 0; e <= n; e++) {
-			let r = e / n;
-			o.push(`${t(r)} ${(r * 100).toFixed(1)}%`);
-		}
-		let s = `linear-gradient(to right, ${o.join(", ")})`, c = [];
-		if (r) {
-			let t = e.valueToFraction(r[0]) * 100, n = e.valueToFraction(r[1]) * 100, i = {
-				..._,
-				...a
-			}, o = `repeating-linear-gradient(${i.angleDeg}deg, transparent 0 ${i.stripe}px, var(--wzl-surface) ${i.stripe}px ${i.stripe + i.gap}px)`, s = `color-mix(in srgb, var(--wzl-surface) ${i.dim}%, transparent)`, l = `linear-gradient(${s}, ${s})`;
-			if (t > 0 && (c.push(`${l} left 0 / ${t.toFixed(2)}% 100% no-repeat`), c.push(`${o} left 0 / ${t.toFixed(2)}% 100% no-repeat`)), n < 100) {
-				let e = (100 - n).toFixed(2);
-				c.push(`${l} right 0 / ${e}% 100% no-repeat`), c.push(`${o} right 0 / ${e}% 100% no-repeat`);
-			}
-		}
-		return c.push(s), /* @__PURE__ */ i("div", { style: {
-			position: "absolute",
-			inset: 0,
-			background: c.join(", ")
-		} });
-	};
-}
-var y = {
-	root: "_root_c0ev4_1",
-	swatches: "_swatches_c0ev4_8",
-	swatch: "_swatch_c0ev4_8"
-}, b = [
-	{
-		value: "linear-gradient",
-		label: "Linear"
-	},
-	{
-		value: "radial-gradient",
-		label: "Radial"
-	},
-	{
-		value: "conic-gradient",
-		label: "Conic"
-	}
-], x = [
-	{
-		value: "rgb",
-		label: "sRGB"
-	},
-	{
-		value: "oklab",
-		label: "OKLab"
-	},
-	{
-		value: "oklch",
-		label: "OKLCh"
-	}
-], S = 2;
-function C(r) {
-	let { value: o, onInput: s, onChange: c, kindSwitch: l = !0, spaceSwitch: d = !0, className: f } = r, p = o.stops, g = o.interpolate ?? "rgb", _ = h((e) => ({
-		...o,
-		stops: e
-	}), [o]), C = p.map((e) => ({
-		value: e.offset,
-		color: e.color
-	})), w = (e) => e.map((e) => ({
-		offset: e.value,
-		color: e.color
-	})), T = (e, t) => p.map((n, r) => r === e ? {
-		...n,
-		color: t
-	} : n), E = p.map((e, t) => ({
-		stop: e,
-		index: t
-	})).sort((e, t) => e.stop.offset - t.stop.offset);
-	return /* @__PURE__ */ a("div", {
-		className: [y.root, f].filter(Boolean).join(" "),
-		children: [
-			l && /* @__PURE__ */ i(t, {
-				items: b,
-				value: o.fill,
-				size: "sm",
-				ariaLabel: "Gradient kind",
-				onChange: (e) => e && c(m(o, e))
-			}),
-			/* @__PURE__ */ i(e, {
-				min: 0,
-				max: 1,
-				step: .005,
-				constraint: "free",
-				thumbs: C,
-				ariaLabel: "Gradient stops",
-				readoutPlacement: "none",
-				onInput: (e) => s?.(_(w(e))),
-				onChange: (e) => c(_(w(e))),
-				onAddThumb: (e) => ({
-					value: e,
-					color: u(p, e, g)
-				}),
-				onRemoveThumb: () => p.length > S,
-				renderTrack: v({
-					gradient: (e) => u(p, e, g),
-					samples: g === "rgb" ? 32 : 64
-				})
-			}),
-			d && /* @__PURE__ */ i(t, {
-				items: x,
-				value: g,
-				size: "sm",
-				ariaLabel: "Blend space",
-				onChange: (e) => e && c({
-					...o,
-					interpolate: e
-				})
-			}),
-			/* @__PURE__ */ i("div", {
-				className: y.swatches,
-				children: E.map(({ stop: e, index: t }) => /* @__PURE__ */ i(n, {
-					value: e.color,
-					alpha: !0,
-					"aria-label": `Stop ${t + 1} at ${Math.round(e.offset * 100)}%`,
-					className: y.swatch,
-					onInput: (e) => s?.(_(T(t, e))),
-					onChange: (e) => c(_(T(t, e)))
-				}, t))
-			})
-		]
-	});
-}
-var w = {
-	overlay: "_overlay_6yu3h_3",
-	guide: "_guide_6yu3h_13",
-	handle: "_handle_6yu3h_21"
-};
-//#endregion
-//#region src/components/GradientEditor/GradientHandles.tsx
-function T(e) {
-	let { value: t, toScreen: n, toLocal: r, onInput: a, onChange: o, width: s, height: c, className: l } = e;
-	return /* @__PURE__ */ i("svg", {
-		className: [w.overlay, l].filter(Boolean).join(" "),
-		width: s,
-		height: c,
-		children: E(t, n, r, a, o)
-	});
-}
-function E(e, t, n, o, s) {
-	let l = (e, t) => {
-		t === "input" ? o?.(e) : s(e);
-	};
-	if (e.fill === "linear-gradient") {
-		let o = t(e.from), s = t(e.to);
-		return /* @__PURE__ */ a(r, { children: [
-			/* @__PURE__ */ i(O, {
-				x1: o.x,
-				y1: o.y,
-				x2: s.x,
-				y2: s.y
-			}),
-			/* @__PURE__ */ i(k, {
-				at: o,
-				label: "Gradient start",
-				onDrag: (t, r) => l({
-					...e,
-					from: n(t)
-				}, r)
-			}),
-			/* @__PURE__ */ i(k, {
-				at: s,
-				label: "Gradient end",
-				onDrag: (t, r) => l({
-					...e,
-					to: n(t)
-				}, r)
-			})
-		] });
-	}
-	if (e.fill === "radial-gradient") {
-		let o = t(e.center), s = t({
-			x: e.center.x + e.radius,
-			y: e.center.y
-		}), c = Math.hypot(s.x - o.x, s.y - o.y);
-		return /* @__PURE__ */ a(r, { children: [
-			/* @__PURE__ */ i("circle", {
-				className: w.guide,
-				cx: o.x,
-				cy: o.y,
-				r: c
-			}),
-			/* @__PURE__ */ i(k, {
-				at: o,
-				label: "Gradient center",
-				onDrag: (t, r) => l({
-					...e,
-					center: n(t)
-				}, r)
-			}),
-			/* @__PURE__ */ i(k, {
-				at: s,
-				label: "Gradient radius",
-				onDrag: (t, r) => {
-					let i = n(t), a = Math.hypot(i.x - e.center.x, i.y - e.center.y);
-					l({
-						...e,
-						radius: Math.max(D, a)
-					}, r);
-				}
-			})
-		] });
-	}
-	let u = t(e.center), { radius: d } = c(e), f = t({
-		x: e.center.x + Math.cos(e.angle) * d,
-		y: e.center.y + Math.sin(e.angle) * d
-	});
-	return /* @__PURE__ */ a(r, { children: [
-		/* @__PURE__ */ i(O, {
-			x1: u.x,
-			y1: u.y,
-			x2: f.x,
-			y2: f.y
-		}),
-		/* @__PURE__ */ i(k, {
-			at: u,
-			label: "Gradient center",
-			onDrag: (t, r) => l({
-				...e,
-				center: n(t)
-			}, r)
-		}),
-		/* @__PURE__ */ i(k, {
-			at: f,
-			label: "Gradient angle",
-			onDrag: (t, r) => {
-				let i = n(t), a = Math.atan2(i.y - e.center.y, i.x - e.center.x);
-				l({
-					...e,
-					angle: a
-				}, r);
-			}
-		})
-	] });
-}
-var D = 1;
-function O(e) {
-	return /* @__PURE__ */ i("line", {
-		className: w.guide,
-		...e
-	});
-}
-function k({ at: e, label: t, onDrag: n }) {
-	let r = g(e), a = f({
-		onStart: () => {
-			r.current = e;
-		},
-		onMove: (e) => {
-			n(e, "input");
-		},
-		onEnd: ({ point: e, moved: t }) => {
-			t && n(e, "commit");
-		},
-		onCancel: () => {
-			n(r.current, "input");
-		}
-	});
-	return /* @__PURE__ */ i("circle", {
-		className: w.handle,
-		cx: e.x,
-		cy: e.y,
-		r: A,
-		role: "button",
-		"aria-label": t,
-		tabIndex: 0,
-		onKeyDown: (t) => {
-			let r = t.shiftKey ? j * 10 : j, i = 0, a = 0;
-			if (t.key === "ArrowLeft") i = -r;
-			else if (t.key === "ArrowRight") i = r;
-			else if (t.key === "ArrowUp") a = -r;
-			else if (t.key === "ArrowDown") a = r;
-			else return;
-			t.preventDefault();
-			let o = {
-				x: e.x + i,
-				y: e.y + a
-			};
-			n(o, "input"), n(o, "commit");
-		},
-		...a
-	});
-}
-var A = 7, j = 1;
-//#endregion
-//#region src/components/GradientEditor/SceneGradientHandles.tsx
-function M(e) {
-	let { scene: t, containerRef: n, nodeId: r, slot: a, view: c, className: l } = e, u = d(), f = p(t, n, r, { view: c }), m = g(null), h = f ? P(N(t, r, a)) : null;
-	if (!f || !h) return null;
-	let _ = (e, t) => {
-		let n = s(e, f.box), r = a === "fill" ? "setFill" : "setStroke";
-		m.current ? m.current.update({ paint: n }) : m.current = u?.begin(r, { paint: n }) ?? null, t === "commit" && m.current && (m.current.end("commit"), m.current = null);
-	};
-	return /* @__PURE__ */ i(T, {
-		value: o(h, f.box),
-		toScreen: f.toScreen,
-		toLocal: f.toLocal,
-		width: f.width,
-		height: f.height,
-		className: l,
-		onInput: (e) => _(e, "input"),
-		onChange: (e) => _(e, "commit")
-	});
-}
-function N(e, t, n) {
-	if (t == null) return;
-	let r = e.nodes.get(t)?.data;
-	if (r) return n === "fill" ? r.fill : r.stroke?.paint;
-}
-function P(e) {
-	return l(e) ? e : null;
-}
-//#endregion
-export { v as i, T as n, C as r, M as t };
-
-//# sourceMappingURL=GradientEditor-rRBmf3G0.js.map