@12-apps/ui 6.63.1 → 6.64.1

package/dist/{chunk-QWW7D2PA.js → chunk-VLH3IMJG.js}

@@ -3,7 +3,7 @@ import {
   effectStyles,
   getColorFromTheme,
   variantStyles
-} from "./chunk-T37BUWGV.js";
+} from "./chunk-UAFSEZ2E.js";
 import {
   rem
 } from "./chunk-YKCAJ2TN.js";
@@ -83,4 +83,4 @@ Toggle.displayName = "Toggle";
 export {
   Toggle
 };
-//# sourceMappingURL=chunk-QWW7D2PA.js.map
+//# sourceMappingURL=chunk-VLH3IMJG.js.map

package/dist/{chunk-NM65DY2A.js → chunk-VNVV6Y2X.js}

@@ -3,7 +3,7 @@ import {
   StepContentComponent,
   StepIndicatorComponent,
   StepItemRow
-} from "./chunk-7PK5IENM.js";
+} from "./chunk-SV6IQ2YO.js";
 
 // src/components/utility/WorkflowStep/WorkflowStepRow.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -79,4 +79,4 @@ var StepRow = ({
 export {
   StepRow
 };
-//# sourceMappingURL=chunk-NM65DY2A.js.map
+//# sourceMappingURL=chunk-VNVV6Y2X.js.map

package/dist/{chunk-RCQYCDV6.js → chunk-VPGDYI63.js}

@@ -10,7 +10,7 @@ import {
 import {
   absoluteInk,
   uiInk
-} from "./chunk-SSX5ITPM.js";
+} from "./chunk-XJAD6E3V.js";
 import {
   rem,
   rems
@@ -345,4 +345,4 @@ export {
   emptySx,
   skeletonSx
 };
-//# sourceMappingURL=chunk-RCQYCDV6.js.map
+//# sourceMappingURL=chunk-VPGDYI63.js.map

package/dist/{chunk-NAQ2PIV5.js → chunk-VQU3CBAL.js}

@@ -2,7 +2,7 @@ import {
   onMedia,
   scrim,
   sheen
-} from "./chunk-SSX5ITPM.js";
+} from "./chunk-XJAD6E3V.js";
 import {
   remPx,
   sxRem
@@ -62,4 +62,4 @@ export {
   thumbnailStripSx,
   makeTestId
 };
-//# sourceMappingURL=chunk-NAQ2PIV5.js.map
+//# sourceMappingURL=chunk-VQU3CBAL.js.map

package/dist/{chunk-YLYQ7TIC.js → chunk-VUVPEKDE.js}

@@ -2,7 +2,7 @@ import {
   SheetContent,
   SheetFooter,
   SheetHeader
-} from "./chunk-4P5Y5TEM.js";
+} from "./chunk-H5OVOWHY.js";
 import {
   muiColor
 } from "./chunk-7ZPUN7TV.js";
@@ -94,4 +94,4 @@ var SheetBody = (props) => {
 export {
   SheetBody
 };
-//# sourceMappingURL=chunk-YLYQ7TIC.js.map
+//# sourceMappingURL=chunk-VUVPEKDE.js.map

package/dist/{chunk-J2QIICWP.js → chunk-W2RXXF7K.js}

@@ -1,6 +1,6 @@
 import {
   cardStyles
-} from "./chunk-W2TCSYLI.js";
+} from "./chunk-PLB6WWXW.js";
 import {
   resolveCardProps
 } from "./chunk-FKUYRQSP.js";
@@ -191,4 +191,4 @@ export {
   CardActions,
   CardMedia
 };
-//# sourceMappingURL=chunk-J2QIICWP.js.map
+//# sourceMappingURL=chunk-W2RXXF7K.js.map

package/dist/{chunk-6LUUCSFV.js → chunk-W676GY42.js}

@@ -2,7 +2,7 @@ import {
   OVERLAY_Z_INDEX,
   navButtonSx,
   overlayButtonSx
-} from "./chunk-NAQ2PIV5.js";
+} from "./chunk-VQU3CBAL.js";
 import {
   useLightboxCopy
 } from "./chunk-TEQYTEM2.js";
@@ -156,4 +156,4 @@ export {
   LightboxZoomControls,
   LightboxAutoplayButton
 };
-//# sourceMappingURL=chunk-6LUUCSFV.js.map
+//# sourceMappingURL=chunk-W676GY42.js.map

package/dist/{chunk-WRNLEWHH.js → chunk-WDSJ6SVY.js}

@@ -1,7 +1,7 @@
 import {
   METRICS,
   footerSx
-} from "./chunk-RCQYCDV6.js";
+} from "./chunk-VPGDYI63.js";
 import {
   fieldRadiusPx
 } from "./chunk-GDN2LUTZ.js";
@@ -84,4 +84,4 @@ export {
   CategoryMultiFoot,
   CategorySingleFoot
 };
-//# sourceMappingURL=chunk-WRNLEWHH.js.map
+//# sourceMappingURL=chunk-WDSJ6SVY.js.map

package/dist/{chunk-265RW6VX.js → chunk-WJEJ65TF.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Button
-} from "./chunk-W4O3BTD5.js";
+} from "./chunk-364NH2NY.js";
 import {
   Text
 } from "./chunk-AJBRO76D.js";
@@ -85,4 +85,4 @@ function SelectAllStrip({
 export {
   SelectAllStrip
 };
-//# sourceMappingURL=chunk-265RW6VX.js.map
+//# sourceMappingURL=chunk-WJEJ65TF.js.map

package/dist/{chunk-N6GBJGKW.js → chunk-WLLUARTC.js}

@@ -3,7 +3,7 @@ import {
   LightboxCloseButton,
   LightboxNavButtons,
   LightboxZoomControls
-} from "./chunk-6LUUCSFV.js";
+} from "./chunk-W676GY42.js";
 
 // src/components/data-display/Lightbox/LightboxOverlay.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -60,4 +60,4 @@ var LightboxOverlay = ({
 export {
   LightboxOverlay
 };
-//# sourceMappingURL=chunk-N6GBJGKW.js.map
+//# sourceMappingURL=chunk-WLLUARTC.js.map

package/dist/{chunk-6K2A4PY5.js → chunk-WOXWLJYR.js}

@@ -1,7 +1,7 @@
 import {
   iconSx,
   sizeConfigs
-} from "./chunk-FJKHDKCV.js";
+} from "./chunk-B5CUV4ZK.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -94,4 +94,4 @@ export {
   AnimatedIcon,
   AnimatedIcon_default
 };
-//# sourceMappingURL=chunk-6K2A4PY5.js.map
+//# sourceMappingURL=chunk-WOXWLJYR.js.map

package/dist/chunk-WSMUOFWF.js

@@ -0,0 +1,71 @@
+import {
+  pickerSheetView,
+  stepActiveIndex
+} from "./chunk-QZOXMH7X.js";
+
+// src/components/form/PickerSheet/usePickerSheet.ts
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+function useCursorScroll(activeIndex, listRef) {
+  useEffect(() => {
+    if (activeIndex < 0) return;
+    const rows = listRef.current?.querySelectorAll('[role="option"]');
+    rows?.[activeIndex]?.scrollIntoView?.({ block: "nearest" });
+  }, [activeIndex, listRef]);
+}
+function usePickerSheet({ open, items, onPick, onCreate, createLabel }) {
+  const [query, setRawQuery] = useState("");
+  const [rawActiveIndex, setActiveIndex] = useState(-1);
+  const [cursorShown, setCursorShown] = useState(false);
+  const searchInputRef = useRef(null);
+  const listRef = useRef(null);
+  const [wasOpen, setWasOpen] = useState(open);
+  if (open !== wasOpen) {
+    setWasOpen(open);
+    if (open) {
+      setRawQuery("");
+      setActiveIndex(-1);
+      setCursorShown(false);
+    }
+  }
+  const creatable = Boolean(onCreate && createLabel);
+  const view = useMemo(() => pickerSheetView(items, query, creatable), [items, query, creatable]);
+  const activeIndex = rawActiveIndex < view.rowCount ? rawActiveIndex : -1;
+  useCursorScroll(activeIndex, listRef);
+  const setQuery = useCallback((next) => {
+    setRawQuery(next);
+    setActiveIndex(next.trim() ? 0 : -1);
+  }, []);
+  const choose = useCallback(
+    (index) => {
+      const item = view.items[index];
+      if (item) {
+        onPick(item.id);
+        return;
+      }
+      if (view.canCreate && index === view.items.length) onCreate?.(view.query);
+    },
+    [view, onPick, onCreate]
+  );
+  const onSearchKeyDown = useCallback(
+    (event) => {
+      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+        event.preventDefault();
+        const delta = event.key === "ArrowDown" ? 1 : -1;
+        setActiveIndex(stepActiveIndex(activeIndex, delta, view.rowCount));
+        setCursorShown(true);
+        return;
+      }
+      if (event.key === "Enter" && activeIndex >= 0) {
+        event.preventDefault();
+        choose(activeIndex);
+      }
+    },
+    [view.rowCount, activeIndex, choose]
+  );
+  return { query, view, activeIndex, cursorShown, searchInputRef, listRef, setQuery, choose, onSearchKeyDown };
+}
+
+export {
+  usePickerSheet
+};
+//# sourceMappingURL=chunk-WSMUOFWF.js.map

package/dist/chunk-WSMUOFWF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/PickerSheet/usePickerSheet.ts"],"sourcesContent":["'use client';\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { pickerSheetView, stepActiveIndex, type PickerSheetView } from './picker-sheet-model';\nimport type { PickerSheetProps } from './PickerSheet.types';\n\n/** Everything the sheet's parts read: the query, the derived list, the cursor and the handlers. */\ninterface PickerSheetState {\n  query: string;\n  view: PickerSheetView;\n  /** The keyboard cursor, an index into `view` (items, then the create row); -1 for none. Always a row that exists. */\n  activeIndex: number;\n  /** Draw the cursor: only once an arrow key has moved it, never from typing alone. */\n  cursorShown: boolean;\n  searchInputRef: React.RefObject<HTMLInputElement | null>;\n  listRef: React.RefObject<HTMLUListElement | null>;\n  setQuery: (next: string) => void;\n  /** Pick the row at `index` — an item, or the create row when it is the last one. */\n  choose: (index: number) => void;\n  onSearchKeyDown: (event: React.KeyboardEvent) => void;\n}\n\ntype HookProps = Pick<PickerSheetProps, 'open' | 'items' | 'onPick' | 'onCreate' | 'createLabel'>;\n\n/**\n * Keep the keyboard cursor in view.\n *\n * Nothing inside is focused on open — the modal focuses its own paper. Focusing\n * the search box raised a phone's keyboard over the list it was opened to show.\n * The list opens at its top, the selected row wherever it falls (the design's\n * picker does not jump to it).\n */\nfunction useCursorScroll(activeIndex: number, listRef: React.RefObject<HTMLUListElement | null>): void {\n  useEffect(() => {\n    if (activeIndex < 0) return;\n    const rows = listRef.current?.querySelectorAll('[role=\"option\"]');\n    rows?.[activeIndex]?.scrollIntoView?.({ block: 'nearest' });\n  }, [activeIndex, listRef]);\n}\n\n/**\n * The sheet's state. The query resets every time the sheet opens; typing puts\n * the cursor on the first match, so \"type, then Enter\" picks it (or creates,\n * when the create row is all there is).\n */\nexport function usePickerSheet({ open, items, onPick, onCreate, createLabel }: HookProps): PickerSheetState {\n  const [query, setRawQuery] = useState('');\n  const [rawActiveIndex, setActiveIndex] = useState(-1);\n  const [cursorShown, setCursorShown] = useState(false);\n  const searchInputRef = useRef<HTMLInputElement | null>(null);\n  const listRef = useRef<HTMLUListElement | null>(null);\n\n  // Reset while rendering the frame that opens the sheet, not in an effect\n  // after it — an effect would paint the last session's query for one frame.\n  const [wasOpen, setWasOpen] = useState(open);\n  if (open !== wasOpen) {\n    setWasOpen(open);\n    if (open) {\n      setRawQuery('');\n      setActiveIndex(-1);\n      setCursorShown(false);\n    }\n  }\n\n  const creatable = Boolean(onCreate && createLabel);\n  const view = useMemo(() => pickerSheetView(items, query, creatable), [items, query, creatable]);\n  // Clamped on read: the rows can shrink under the cursor (a query, new items),\n  // and `aria-activedescendant` must never name a row that is not there.\n  const activeIndex = rawActiveIndex < view.rowCount ? rawActiveIndex : -1;\n\n  useCursorScroll(activeIndex, listRef);\n\n  const setQuery = useCallback((next: string) => {\n    setRawQuery(next);\n    setActiveIndex(next.trim() ? 0 : -1);\n  }, []);\n\n  const choose = useCallback(\n    (index: number) => {\n      const item = view.items[index];\n      if (item) {\n        onPick(item.id);\n        return;\n      }\n      if (view.canCreate && index === view.items.length) onCreate?.(view.query);\n    },\n    [view, onPick, onCreate],\n  );\n\n  const onSearchKeyDown = useCallback(\n    (event: React.KeyboardEvent) => {\n      if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n        event.preventDefault();\n        const delta = event.key === 'ArrowDown' ? 1 : -1;\n        setActiveIndex(stepActiveIndex(activeIndex, delta, view.rowCount));\n        setCursorShown(true);\n        return;\n      }\n      if (event.key === 'Enter' && activeIndex >= 0) {\n        event.preventDefault();\n        choose(activeIndex);\n      }\n      // Escape is the modal's: it closes through `onClose`, once.\n    },\n    [view.rowCount, activeIndex, choose],\n  );\n\n  return { query, view, activeIndex, cursorShown, searchInputRef, listRef, setQuery, choose, onSearchKeyDown };\n}\n"],"mappings":";;;;;;AAEA,SAAS,aAAa,WAAW,SAAS,QAAQ,gBAAgB;AA+BlE,SAAS,gBAAgB,aAAqB,SAAyD;AACrG,YAAU,MAAM;AACd,QAAI,cAAc,EAAG;AACrB,UAAM,OAAO,QAAQ,SAAS,iBAAiB,iBAAiB;AAChE,WAAO,WAAW,GAAG,iBAAiB,EAAE,OAAO,UAAU,CAAC;AAAA,EAC5D,GAAG,CAAC,aAAa,OAAO,CAAC;AAC3B;AAOO,SAAS,eAAe,EAAE,MAAM,OAAO,QAAQ,UAAU,YAAY,GAAgC;AAC1G,QAAM,CAAC,OAAO,WAAW,IAAI,SAAS,EAAE;AACxC,QAAM,CAAC,gBAAgB,cAAc,IAAI,SAAS,EAAE;AACpD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AACpD,QAAM,iBAAiB,OAAgC,IAAI;AAC3D,QAAM,UAAU,OAAgC,IAAI;AAIpD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAC3C,MAAI,SAAS,SAAS;AACpB,eAAW,IAAI;AACf,QAAI,MAAM;AACR,kBAAY,EAAE;AACd,qBAAe,EAAE;AACjB,qBAAe,KAAK;AAAA,IACtB;AAAA,EACF;AAEA,QAAM,YAAY,QAAQ,YAAY,WAAW;AACjD,QAAM,OAAO,QAAQ,MAAM,gBAAgB,OAAO,OAAO,SAAS,GAAG,CAAC,OAAO,OAAO,SAAS,CAAC;AAG9F,QAAM,cAAc,iBAAiB,KAAK,WAAW,iBAAiB;AAEtE,kBAAgB,aAAa,OAAO;AAEpC,QAAM,WAAW,YAAY,CAAC,SAAiB;AAC7C,gBAAY,IAAI;AAChB,mBAAe,KAAK,KAAK,IAAI,IAAI,EAAE;AAAA,EACrC,GAAG,CAAC,CAAC;AAEL,QAAM,SAAS;AAAA,IACb,CAAC,UAAkB;AACjB,YAAM,OAAO,KAAK,MAAM,KAAK;AAC7B,UAAI,MAAM;AACR,eAAO,KAAK,EAAE;AACd;AAAA,MACF;AACA,UAAI,KAAK,aAAa,UAAU,KAAK,MAAM,OAAQ,YAAW,KAAK,KAAK;AAAA,IAC1E;AAAA,IACA,CAAC,MAAM,QAAQ,QAAQ;AAAA,EACzB;AAEA,QAAM,kBAAkB;AAAA,IACtB,CAAC,UAA+B;AAC9B,UAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,WAAW;AACxD,cAAM,eAAe;AACrB,cAAM,QAAQ,MAAM,QAAQ,cAAc,IAAI;AAC9C,uBAAe,gBAAgB,aAAa,OAAO,KAAK,QAAQ,CAAC;AACjE,uBAAe,IAAI;AACnB;AAAA,MACF;AACA,UAAI,MAAM,QAAQ,WAAW,eAAe,GAAG;AAC7C,cAAM,eAAe;AACrB,eAAO,WAAW;AAAA,MACpB;AAAA,IAEF;AAAA,IACA,CAAC,KAAK,UAAU,aAAa,MAAM;AAAA,EACrC;AAEA,SAAO,EAAE,OAAO,MAAM,aAAa,aAAa,gBAAgB,SAAS,UAAU,QAAQ,gBAAgB;AAC7G;","names":[]}

package/dist/chunk-WYRDR4T5.js

@@ -0,0 +1,246 @@
+import {
+  surfaces
+} from "./chunk-TZ23DNKY.js";
+import {
+  fieldBorder,
+  fieldHeight
+} from "./chunk-RGVNXES5.js";
+import {
+  fieldRadiusPx
+} from "./chunk-GDN2LUTZ.js";
+import {
+  fieldWell,
+  uiInk
+} from "./chunk-XJAD6E3V.js";
+import {
+  rem,
+  rems
+} from "./chunk-YKCAJ2TN.js";
+
+// src/components/form/PickerSheet/PickerSheet.styles.ts
+import { alpha } from "@mui/material/styles/index.js";
+var METRICS = {
+  dialogWidthPx: 520,
+  dialogMaxHeightPx: 780,
+  dialogRadiusPx: 14,
+  /** The gap a centred dialog keeps from the viewport edge. */
+  dialogMarginPx: 32,
+  sheetRadiusPx: 16,
+  headGapPx: 10,
+  closeButtonPx: 36,
+  controlRadiusPx: 8,
+  bodyPaddingPx: 16,
+  bodyGapPx: 12,
+  listMaxHeightPx: 380,
+  listGapPx: 2,
+  rowPaddingPx: 10,
+  rowMinHeightPx: 44,
+  /** Left padding per level of `indent` (`.pitem.ind{padding-left:28px}` at depth 1). */
+  rowIndentStepPx: 28,
+  checkGlyphPx: 16,
+  closeGlyphPx: 18,
+  searchGlyphPx: 16,
+  /** The magnifier's inset from the field's inner edge, and the gap before the text. */
+  searchGlyphInsetPx: 10,
+  searchGlyphGapPx: 6,
+  /** The prototype's body line-height; the sheet sets it rather than inheriting a host's. */
+  lineHeight: 1.4
+};
+var panelShadow = (theme) => `${rems(theme, 0, 16, 48)} ${alpha(uiInk(theme).panelShadowInk, 0.28)}`;
+var dialogPaperSx = (theme) => ({
+  width: rem(theme, METRICS.dialogWidthPx),
+  maxWidth: `calc(100% - ${rem(theme, METRICS.dialogMarginPx)})`,
+  maxHeight: `min(${rem(theme, METRICS.dialogMaxHeightPx)}, calc(100% - ${rem(theme, METRICS.dialogMarginPx * 2)}))`,
+  margin: 0,
+  borderRadius: rem(theme, METRICS.dialogRadiusPx),
+  boxShadow: panelShadow(theme),
+  // The raised step (`uiSurfaces.raised`): a sheet is nearer than the page.
+  background: surfaces(theme).raised,
+  backgroundImage: "none",
+  display: "flex",
+  flexDirection: "column",
+  overflow: "hidden"
+});
+var sheetPaperSx = (theme) => ({
+  width: "100%",
+  maxHeight: "88%",
+  borderRadius: rems(theme, METRICS.sheetRadiusPx, METRICS.sheetRadiusPx, 0, 0),
+  boxShadow: panelShadow(theme),
+  // The raised step (`uiSurfaces.raised`): a sheet is nearer than the page.
+  background: surfaces(theme).raised,
+  backgroundImage: "none",
+  display: "flex",
+  flexDirection: "column",
+  overflow: "hidden"
+});
+var headSx = (theme) => ({
+  display: "flex",
+  alignItems: "center",
+  gap: rem(theme, METRICS.headGapPx),
+  padding: rems(theme, 14, 16),
+  // A shade under the controls' own border: the rule separates, it does not frame.
+  borderBottom: `1px solid ${alpha(theme.palette.divider, 0.6)}`,
+  flex: "0 0 auto"
+});
+var kickerSx = (theme) => ({
+  fontSize: rem(theme, 11.5),
+  color: theme.palette.text.secondary,
+  lineHeight: METRICS.lineHeight
+});
+var titleSx = (theme) => ({
+  margin: 0,
+  fontSize: rem(theme, 14),
+  fontWeight: 700,
+  lineHeight: METRICS.lineHeight,
+  color: theme.palette.text.primary
+});
+var closeButtonSx = (theme) => ({
+  flex: "0 0 auto",
+  width: rem(theme, METRICS.closeButtonPx),
+  height: rem(theme, METRICS.closeButtonPx),
+  display: "grid",
+  placeItems: "center",
+  padding: 0,
+  border: `1px solid ${theme.palette.divider}`,
+  borderRadius: rem(theme, METRICS.controlRadiusPx),
+  background: "transparent",
+  color: theme.palette.text.primary,
+  cursor: "pointer",
+  "& svg": { width: rem(theme, METRICS.closeGlyphPx), height: rem(theme, METRICS.closeGlyphPx) },
+  "&:hover": { background: theme.palette.action.hover },
+  "&:focus-visible": { outline: `${rem(theme, 2)} solid ${theme.palette.primary.main}`, outlineOffset: rem(theme, 1) }
+});
+var bodySx = (theme) => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: rem(theme, METRICS.bodyGapPx),
+  padding: rem(theme, METRICS.bodyPaddingPx),
+  overflow: "auto",
+  minHeight: 0,
+  flex: "1 1 auto"
+});
+var searchFieldSx = (theme) => ({
+  position: "relative",
+  display: "flex",
+  alignItems: "center",
+  flex: "0 0 auto",
+  "& > svg": {
+    position: "absolute",
+    // + 1 for the input's own border, which the glyph sits inside of.
+    left: rem(theme, METRICS.searchGlyphInsetPx + 1),
+    width: rem(theme, METRICS.searchGlyphPx),
+    height: rem(theme, METRICS.searchGlyphPx),
+    color: theme.palette.text.secondary,
+    pointerEvents: "none",
+    zIndex: 1
+  },
+  "& input": {
+    width: "100%",
+    height: fieldHeight(theme),
+    boxSizing: "border-box",
+    padding: rems(theme, 0, 10, 0, METRICS.searchGlyphInsetPx + METRICS.searchGlyphPx + METRICS.searchGlyphGapPx),
+    fontSize: rem(theme, 14),
+    border: fieldBorder(theme),
+    borderRadius: fieldRadiusPx(theme),
+    background: fieldWell(theme),
+    color: theme.palette.text.primary,
+    "&:focus": {
+      outline: "none",
+      borderColor: theme.palette.primary.main,
+      boxShadow: `0 0 0 ${rem(theme, 3)} ${alpha(theme.palette.primary.main, 0.15)}`
+    }
+  }
+});
+var listSx = (theme) => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: rem(theme, METRICS.listGapPx),
+  maxHeight: rem(theme, METRICS.listMaxHeightPx),
+  overflow: "auto",
+  overscrollBehavior: "contain",
+  margin: 0,
+  padding: 0,
+  listStyle: "none",
+  flex: "0 1 auto"
+});
+var rowPaddingLeft = (theme, depth) => rem(theme, depth > 0 ? METRICS.rowIndentStepPx * depth : METRICS.rowPaddingPx);
+function rowBackground(theme, selected, active) {
+  if (selected) return alpha(theme.palette.primary.main, 0.1);
+  return active ? theme.palette.action.hover : "transparent";
+}
+var rowSx = (theme, selected, active) => ({
+  display: "flex",
+  alignItems: "center",
+  gap: rem(theme, 10),
+  padding: rem(theme, METRICS.rowPaddingPx),
+  minHeight: rem(theme, METRICS.rowMinHeightPx),
+  // The list is a capped flex column: without this a row with a meta line
+  // shrinks to the 44px floor and the two lines overprint.
+  flexShrink: 0,
+  boxSizing: "border-box",
+  borderRadius: rem(theme, METRICS.controlRadiusPx),
+  textAlign: "left",
+  cursor: "pointer",
+  userSelect: "none",
+  color: theme.palette.text.primary,
+  background: rowBackground(theme, selected, active),
+  boxShadow: active ? `inset 0 0 0 ${rem(theme, 1)} ${alpha(theme.palette.primary.main, 0.3)}` : "none",
+  "&:hover": { background: selected ? alpha(theme.palette.primary.main, 0.1) : theme.palette.action.hover }
+});
+var rowTextSx = { flex: "1 1 auto", minWidth: 0 };
+var rowLabelSx = (theme) => ({
+  display: "block",
+  fontSize: rem(theme, 14),
+  lineHeight: METRICS.lineHeight
+});
+var rowMetaSx = (theme) => ({
+  display: "block",
+  fontSize: rem(theme, 12),
+  lineHeight: METRICS.lineHeight,
+  color: theme.palette.text.secondary
+});
+var checkSx = (theme) => ({
+  flex: "0 0 auto",
+  display: "grid",
+  color: theme.palette.primary.main,
+  "& svg": { width: rem(theme, METRICS.checkGlyphPx), height: rem(theme, METRICS.checkGlyphPx) }
+});
+var createLabelSx = (theme) => ({
+  ...rowLabelSx(theme),
+  color: theme.palette.primary.main,
+  fontWeight: 600
+});
+var emptySx = (theme) => ({
+  fontSize: rem(theme, 12),
+  lineHeight: METRICS.lineHeight,
+  color: theme.palette.text.secondary,
+  padding: rem(theme, 10)
+});
+var footSx = (theme) => ({
+  margin: 0,
+  fontSize: rem(theme, 12),
+  lineHeight: METRICS.lineHeight,
+  color: theme.palette.text.secondary
+});
+
+export {
+  dialogPaperSx,
+  sheetPaperSx,
+  headSx,
+  kickerSx,
+  titleSx,
+  closeButtonSx,
+  bodySx,
+  searchFieldSx,
+  listSx,
+  rowPaddingLeft,
+  rowSx,
+  rowTextSx,
+  rowLabelSx,
+  rowMetaSx,
+  checkSx,
+  createLabelSx,
+  emptySx,
+  footSx
+};
+//# sourceMappingURL=chunk-WYRDR4T5.js.map

package/dist/chunk-WYRDR4T5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/PickerSheet/PickerSheet.styles.ts"],"sourcesContent":["import { alpha, type CSSObject, type Theme } from '@mui/material/styles/index.js';\n\nimport { fieldBorder, fieldHeight } from '../../../tokens/field-height';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { fieldWell, uiInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\nimport { surfaces } from '../../../tokens/surfaces';\n\n/**\n * The prototype's measurements, verbatim, in the design's px.\n *\n * Each is drawn through `rem()` where it is read, so the sheet follows a\n * density mode the way every other surface in the package does. Colours come\n * from the palette (a white-labelled tenant and dark mode carry through).\n */\nconst METRICS = {\n  dialogWidthPx: 520,\n  dialogMaxHeightPx: 780,\n  dialogRadiusPx: 14,\n  /** The gap a centred dialog keeps from the viewport edge. */\n  dialogMarginPx: 32,\n  sheetRadiusPx: 16,\n  headGapPx: 10,\n  closeButtonPx: 36,\n  controlRadiusPx: 8,\n  bodyPaddingPx: 16,\n  bodyGapPx: 12,\n  listMaxHeightPx: 380,\n  listGapPx: 2,\n  rowPaddingPx: 10,\n  rowMinHeightPx: 44,\n  /** Left padding per level of `indent` (`.pitem.ind{padding-left:28px}` at depth 1). */\n  rowIndentStepPx: 28,\n  checkGlyphPx: 16,\n  closeGlyphPx: 18,\n  searchGlyphPx: 16,\n  /** The magnifier's inset from the field's inner edge, and the gap before the text. */\n  searchGlyphInsetPx: 10,\n  searchGlyphGapPx: 6,\n  /** The prototype's body line-height; the sheet sets it rather than inheriting a host's. */\n  lineHeight: 1.4,\n} as const;\n\n/** The panel's shadow: `0 16px 48px` of ink at 0.28. */\nconst panelShadow = (theme: Theme): string =>\n  `${rems(theme, 0, 16, 48)} ${alpha(uiInk(theme).panelShadowInk, 0.28)}`;\n\n/** The centred dialog's paper, on a pointer. */\nexport const dialogPaperSx = (theme: Theme): CSSObject => ({\n  width: rem(theme, METRICS.dialogWidthPx),\n  maxWidth: `calc(100% - ${rem(theme, METRICS.dialogMarginPx)})`,\n  maxHeight: `min(${rem(theme, METRICS.dialogMaxHeightPx)}, calc(100% - ${rem(theme, METRICS.dialogMarginPx * 2)}))`,\n  margin: 0,\n  borderRadius: rem(theme, METRICS.dialogRadiusPx),\n  boxShadow: panelShadow(theme),\n  // The raised step (`uiSurfaces.raised`): a sheet is nearer than the page.\n  background: surfaces(theme).raised,\n  backgroundImage: 'none',\n  display: 'flex',\n  flexDirection: 'column',\n  overflow: 'hidden',\n});\n\n/** The bottom sheet's paper, on a phone: full width, no grab handle. */\nexport const sheetPaperSx = (theme: Theme): CSSObject => ({\n  width: '100%',\n  maxHeight: '88%',\n  borderRadius: rems(theme, METRICS.sheetRadiusPx, METRICS.sheetRadiusPx, 0, 0),\n  boxShadow: panelShadow(theme),\n  // The raised step (`uiSurfaces.raised`): a sheet is nearer than the page.\n  background: surfaces(theme).raised,\n  backgroundImage: 'none',\n  display: 'flex',\n  flexDirection: 'column',\n  overflow: 'hidden',\n});\n\n/** `.sh` — kicker and title on the left, the close button on the right. */\nexport const headSx = (theme: Theme): CSSObject => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: rem(theme, METRICS.headGapPx),\n  padding: rems(theme, 14, 16),\n  // A shade under the controls' own border: the rule separates, it does not frame.\n  borderBottom: `1px solid ${alpha(theme.palette.divider, 0.6)}`,\n  flex: '0 0 auto',\n});\n\nexport const kickerSx = (theme: Theme): CSSObject => ({\n  fontSize: rem(theme, 11.5),\n  color: theme.palette.text.secondary,\n  lineHeight: METRICS.lineHeight,\n});\n\nexport const titleSx = (theme: Theme): CSSObject => ({\n  margin: 0,\n  fontSize: rem(theme, 14),\n  fontWeight: 700,\n  lineHeight: METRICS.lineHeight,\n  color: theme.palette.text.primary,\n});\n\nexport const closeButtonSx = (theme: Theme): CSSObject => ({\n  flex: '0 0 auto',\n  width: rem(theme, METRICS.closeButtonPx),\n  height: rem(theme, METRICS.closeButtonPx),\n  display: 'grid',\n  placeItems: 'center',\n  padding: 0,\n  border: `1px solid ${theme.palette.divider}`,\n  borderRadius: rem(theme, METRICS.controlRadiusPx),\n  background: 'transparent',\n  color: theme.palette.text.primary,\n  cursor: 'pointer',\n  '& svg': { width: rem(theme, METRICS.closeGlyphPx), height: rem(theme, METRICS.closeGlyphPx) },\n  '&:hover': { background: theme.palette.action.hover },\n  '&:focus-visible': { outline: `${rem(theme, 2)} solid ${theme.palette.primary.main}`, outlineOffset: rem(theme, 1) },\n});\n\n/** `.sb` — the scrolling body: search, list, foot. */\nexport const bodySx = (theme: Theme): CSSObject => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: rem(theme, METRICS.bodyGapPx),\n  padding: rem(theme, METRICS.bodyPaddingPx),\n  overflow: 'auto',\n  minHeight: 0,\n  flex: '1 1 auto',\n});\n\n/**\n * The search field: the library's field height, border and corner, with a\n * leading magnifier. White on the light sheet, so the field reads as a field\n * against the paper behind it.\n */\nexport const searchFieldSx = (theme: Theme): CSSObject => ({\n  position: 'relative',\n  display: 'flex',\n  alignItems: 'center',\n  flex: '0 0 auto',\n  '& > svg': {\n    position: 'absolute',\n    // + 1 for the input's own border, which the glyph sits inside of.\n    left: rem(theme, METRICS.searchGlyphInsetPx + 1),\n    width: rem(theme, METRICS.searchGlyphPx),\n    height: rem(theme, METRICS.searchGlyphPx),\n    color: theme.palette.text.secondary,\n    pointerEvents: 'none',\n    zIndex: 1,\n  },\n  '& input': {\n    width: '100%',\n    height: fieldHeight(theme),\n    boxSizing: 'border-box',\n    padding: rems(theme, 0, 10, 0, METRICS.searchGlyphInsetPx + METRICS.searchGlyphPx + METRICS.searchGlyphGapPx),\n    fontSize: rem(theme, 14),\n    border: fieldBorder(theme),\n    borderRadius: fieldRadiusPx(theme),\n    background: fieldWell(theme),\n    color: theme.palette.text.primary,\n    '&:focus': {\n      outline: 'none',\n      borderColor: theme.palette.primary.main,\n      boxShadow: `0 0 0 ${rem(theme, 3)} ${alpha(theme.palette.primary.main, 0.15)}`,\n    },\n  },\n});\n\n/** The list: a column, scrolling on its own past 380px. */\nexport const listSx = (theme: Theme): CSSObject => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: rem(theme, METRICS.listGapPx),\n  maxHeight: rem(theme, METRICS.listMaxHeightPx),\n  overflow: 'auto',\n  overscrollBehavior: 'contain',\n  margin: 0,\n  padding: 0,\n  listStyle: 'none',\n  flex: '0 1 auto',\n});\n\n/** Left padding for a row at `depth` — the row's own 10px at depth 0, 28px per level below it. */\nexport const rowPaddingLeft = (theme: Theme, depth: number): string =>\n  rem(theme, depth > 0 ? METRICS.rowIndentStepPx * depth : METRICS.rowPaddingPx);\n\n/** Background of a row: selected wins over the keyboard cursor, which wins over rest. */\nfunction rowBackground(theme: Theme, selected: boolean, active: boolean): string {\n  if (selected) return alpha(theme.palette.primary.main, 0.1);\n  return active ? theme.palette.action.hover : 'transparent';\n}\n\n/** `.pitem` — a row. `active` is the keyboard cursor, drawn as a ring so it reads apart from `selected`. */\nexport const rowSx = (theme: Theme, selected: boolean, active: boolean): CSSObject => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: rem(theme, 10),\n  padding: rem(theme, METRICS.rowPaddingPx),\n  minHeight: rem(theme, METRICS.rowMinHeightPx),\n  // The list is a capped flex column: without this a row with a meta line\n  // shrinks to the 44px floor and the two lines overprint.\n  flexShrink: 0,\n  boxSizing: 'border-box',\n  borderRadius: rem(theme, METRICS.controlRadiusPx),\n  textAlign: 'left',\n  cursor: 'pointer',\n  userSelect: 'none',\n  color: theme.palette.text.primary,\n  background: rowBackground(theme, selected, active),\n  boxShadow: active ? `inset 0 0 0 ${rem(theme, 1)} ${alpha(theme.palette.primary.main, 0.3)}` : 'none',\n  '&:hover': { background: selected ? alpha(theme.palette.primary.main, 0.1) : theme.palette.action.hover },\n});\n\nexport const rowTextSx: CSSObject = { flex: '1 1 auto', minWidth: 0 };\n\nexport const rowLabelSx = (theme: Theme): CSSObject => ({\n  display: 'block',\n  fontSize: rem(theme, 14),\n  lineHeight: METRICS.lineHeight,\n});\n\nexport const rowMetaSx = (theme: Theme): CSSObject => ({\n  display: 'block',\n  fontSize: rem(theme, 12),\n  lineHeight: METRICS.lineHeight,\n  color: theme.palette.text.secondary,\n});\n\nexport const checkSx = (theme: Theme): CSSObject => ({\n  flex: '0 0 auto',\n  display: 'grid',\n  color: theme.palette.primary.main,\n  '& svg': { width: rem(theme, METRICS.checkGlyphPx), height: rem(theme, METRICS.checkGlyphPx) },\n});\n\n/** The create row's text: the accent, at 600. */\nexport const createLabelSx = (theme: Theme): CSSObject => ({\n  ...rowLabelSx(theme),\n  color: theme.palette.primary.main,\n  fontWeight: 600,\n});\n\nexport const emptySx = (theme: Theme): CSSObject => ({\n  fontSize: rem(theme, 12),\n  lineHeight: METRICS.lineHeight,\n  color: theme.palette.text.secondary,\n  padding: rem(theme, 10),\n});\n\nexport const footSx = (theme: Theme): CSSObject => ({\n  margin: 0,\n  fontSize: rem(theme, 12),\n  lineHeight: METRICS.lineHeight,\n  color: theme.palette.text.secondary,\n});\n"],"mappings":"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","names":[]}

package/dist/{chunk-ZH5RFT23.js → chunk-WZERH7E3.js}

@@ -5,7 +5,7 @@ import {
   WHEEL_ZOOM_FACTOR,
   ZOOM_STEP,
   minSwipeDistance
-} from "./chunk-NAQ2PIV5.js";
+} from "./chunk-VQU3CBAL.js";
 
 // src/components/data-display/Lightbox/Lightbox.hooks.ts
 import { useTheme } from "@mui/material/styles/index.js";
@@ -176,4 +176,4 @@ export {
   useLightboxKeyboard,
   useSwipe
 };
-//# sourceMappingURL=chunk-ZH5RFT23.js.map
+//# sourceMappingURL=chunk-WZERH7E3.js.map

package/dist/{chunk-KZOK6HWW.js → chunk-X47MWURD.js}

@@ -1,7 +1,7 @@
 import {
   getColorFromTheme,
   textareaEmphasisStyles
-} from "./chunk-D3BJRCXR.js";
+} from "./chunk-IPC426NS.js";
 import {
   fieldBorder
 } from "./chunk-RGVNXES5.js";
@@ -225,4 +225,4 @@ Textarea.displayName = "Textarea";
 export {
   Textarea
 };
-//# sourceMappingURL=chunk-KZOK6HWW.js.map
+//# sourceMappingURL=chunk-X47MWURD.js.map

package/dist/{chunk-SSX5ITPM.js → chunk-XJAD6E3V.js}

@@ -42,6 +42,7 @@ var absoluteInk = (theme) => ({
   white: theme.palette.common.white
 });
 var modeInk = (theme) => theme.palette.mode === "dark" ? theme.palette.common.white : theme.palette.common.black;
+var fieldWell = (theme) => theme.palette.mode === "dark" ? theme.palette.background.paper : theme.palette.common.white;
 var step = (theme, n) => theme.palette.grey[n] ?? NEUTRAL_RAMP[n];
 function neutralTones(theme) {
   return {
@@ -84,8 +85,9 @@ export {
   onMedia,
   absoluteInk,
   modeInk,
+  fieldWell,
   neutralTones,
   controlNeutral,
   softNeutral
 };
-//# sourceMappingURL=chunk-SSX5ITPM.js.map
+//# sourceMappingURL=chunk-XJAD6E3V.js.map

package/dist/{chunk-SSX5ITPM.js.map → chunk-XJAD6E3V.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/tokens/ink.ts"],"sourcesContent":["import type { Theme } from '@mui/material/styles/index.js';\n\nimport { alpha } from './color';\nimport {\n  ATTENTION_INK,\n  CELEBRATION_GRADIENTS,\n  CODE_EDITOR_CHROME,\n  DATA_VIZ_NEON,\n  EFFECT_GLOW,\n  GLASS_SLATE,\n  HIGHLIGHT_MARK,\n  MAP_SURFACE,\n  NEUTRAL_RAMP,\n  PANEL_SHADOW_INK,\n  SOCIAL_BRAND,\n  TIMING_PHASES,\n} from './ink.core';\n\n/**\n * EVERY COLOUR A COMPONENT DRAWS, BY ROLE (FUT-2593, under FUT-2585).\n *\n * A component never writes a hex, an `rgba()`, a named colour or a step on the\n * grey ramp; it asks for a ROLE, and the role reads the theme:\n *\n * - the palette's own roles, straight — `text.secondary`, `divider`,\n *   `action.hover`, a semantic `main` and its `contrastText`;\n * - the INK roles below, over the palette's two absolutes — a scrim behind a\n *   modal, a shadow's ink, a glass sheen, the ink on a photo;\n * - the NEUTRAL tones, over the grey ramp, named by what they do rather than by\n *   their step, so a host that re-greys the ramp re-greys every one;\n * - `uiInk(theme)`, the colours with no palette role at all (`./ink.core.ts`),\n *   which a host can replace through `theme.uiInk`;\n * - `surfaces(theme)` and `softSignal(theme, signal)` (`./surfaces.ts`), the\n *   grounds a board and its cards sit on and a signal's soft background,\n *   which a host can replace through `theme.uiSurfaces` / `theme.uiSoftSignal`.\n *\n * Every default is the value the component drew before, so moving a component\n * onto these changed nothing on screen. `scripts/ui-tokens-gate.mjs` refuses a\n * raw colour or a ramp step in a component from here on.\n */\n\nexport interface UiInk {\n  dataVizNeon: { series: readonly string[]; ground: string; accent: string };\n  timingPhases: Record<keyof typeof TIMING_PHASES, string>;\n  mapSurface: Record<keyof typeof MAP_SURFACE, string>;\n  codeEditor: { light: Record<keyof typeof CODE_EDITOR_CHROME.light, string>; dark: Record<keyof typeof CODE_EDITOR_CHROME.dark, string> };\n  socialBrand: typeof SOCIAL_BRAND;\n  celebration: { mint: readonly [string, string]; violet: readonly [string, string] };\n  attention: { from: string; to: string; glow: string };\n  highlightMark: string;\n  glassSlate: string;\n  panelShadowInk: string;\n  effectGlow: { muiBlue: string; brandIndigo: string };\n}\n\nexport const DEFAULT_UI_INK: UiInk = {\n  dataVizNeon: DATA_VIZ_NEON,\n  timingPhases: TIMING_PHASES,\n  mapSurface: MAP_SURFACE,\n  codeEditor: CODE_EDITOR_CHROME,\n  socialBrand: SOCIAL_BRAND,\n  celebration: CELEBRATION_GRADIENTS,\n  attention: ATTENTION_INK,\n  highlightMark: HIGHLIGHT_MARK,\n  glassSlate: GLASS_SLATE,\n  panelShadowInk: PANEL_SHADOW_INK,\n  effectGlow: EFFECT_GLOW,\n};\n\ndeclare module '@mui/material/styles' {\n  interface Theme {\n    /** Colours with no palette role, by name. See `@12-apps/ui/tokens`' `uiInk`. */\n    uiInk?: Partial<UiInk>;\n  }\n  interface ThemeOptions {\n    /**\n     * Replace any of the named colour sets `@12-apps/ui` draws with. Each set is\n     * replaced WHOLE (the merge is one level deep): to change `codeEditor.dark`,\n     * pass `codeEditor` with both `light` and `dark`.\n     */\n    uiInk?: Partial<UiInk>;\n  }\n}\n\n/** The named colour sets, with the host's `theme.uiInk` layered over the defaults. */\nexport function uiInk(theme: Theme): UiInk {\n  return { ...DEFAULT_UI_INK, ...theme.uiInk };\n}\n\n/* ── Ink roles over the palette's two absolutes ───────────────────────────── */\n\n/** The dim laid behind a modal, a lightbox, a spotlight. */\nexport const scrim = (theme: Theme, opacity: number): string => alpha(theme.palette.common.black, opacity);\n\n/** The colour of a drop shadow or a glow's dark half. */\nexport const shadowInk = (theme: Theme, opacity = 1): string => alpha(theme.palette.common.black, opacity);\n\n/** A highlight: a glass edge, a shimmer, a pressed-in light. */\nexport const sheen = (theme: Theme, opacity = 1): string => alpha(theme.palette.common.white, opacity);\n\n/** Ink that sits ON a photo, a gradient or a scrim — never on the page. */\nexport const onMedia = (theme: Theme): string => theme.palette.common.white;\n\n/**\n * The palette's two absolutes, for the places the hue must be exactly black or\n * white: a CSS mask's opaque stop, the black `dark` tooltip.\n */\nexport const absoluteInk = (theme: Theme): { black: string; white: string } => ({\n  black: theme.palette.common.black,\n  white: theme.palette.common.white,\n});\n\n/** The absolute that CONTRASTS with the mode's page: black in light mode, white in dark. */\nexport const modeInk = (theme: Theme): string =>\n  theme.palette.mode === 'dark' ? theme.palette.common.white : theme.palette.common.black;\n\n/* ── Neutral tones over the grey ramp ─────────────────────────────────────── */\n\nconst step = (theme: Theme, n: keyof typeof NEUTRAL_RAMP): string => theme.palette.grey[n] ?? NEUTRAL_RAMP[n];\n\n/**\n * The neutral scale by ROLE. The names say what a tone is for, so a component\n * reads `neutralTones(theme).track` rather than \"grey 300\", and a host that\n * re-greys the ramp moves every one of them together.\n */\nexport function neutralTones(theme: Theme) {\n  return {\n    /** A dark chip on a light UI: a tooltip, a context menu, a code block's dark ground. */\n    inverseSurface: step(theme, 900),\n    /** A raised dark panel. */\n    raised: step(theme, 800),\n    /** A neutral control's fill. */\n    strong: step(theme, 700),\n    /** A neutral accent: a badge, a strong scrollbar thumb. */\n    emphasis: step(theme, 600),\n    /** A quiet mark: an offline dot, a secondary icon. */\n    muted: step(theme, 500),\n    /** An idle connector, a light scrollbar thumb. */\n    subtle: step(theme, 400),\n    /** An idle track, a placeholder fill. */\n    track: step(theme, 300),\n    /** A faint track, a light scrollbar channel. */\n    faint: step(theme, 200),\n    /** A light code block, a light card. */\n    surface: step(theme, 100),\n    /** The lightest ground. */\n    canvas: step(theme, 50),\n  };\n}\n\n/** The four-stop accent a component's `neutral` colour resolves to. */\nexport interface NeutralAccent {\n  main: string;\n  light: string;\n  dark: string;\n  contrastText: string;\n}\n\n/**\n * The neutral the CONTROLS draw with — grey 700, pressed 800, soft 500, white\n * ink — for `Button`, `Toggle`, `RadioGroup`, `Switch`, `Slider`, `Textarea`,\n * `InputOTP`. Not `accentFor(theme, 'neutral')` (600/400/800, a badge's): the\n * controls have always been one step darker.\n */\nexport function controlNeutral(theme: Theme): NeutralAccent {\n  return { main: step(theme, 700), dark: step(theme, 800), light: step(theme, 500), contrastText: theme.palette.common.white };\n}\n\n/** The softer neutral a notice or a progress track draws with — 500 on a 300 ground, 700 pressed. */\nexport function softNeutral(theme: Theme): NeutralAccent {\n  const main = step(theme, 500);\n  return { main, light: step(theme, 300), dark: step(theme, 700), contrastText: theme.palette.getContrastText(main) };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAuDO,IAAM,iBAAwB;AAAA,EACnC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,WAAW;AAAA,EACX,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,YAAY;AACd;AAkBO,SAAS,MAAM,OAAqB;AACzC,SAAO,EAAE,GAAG,gBAAgB,GAAG,MAAM,MAAM;AAC7C;AAKO,IAAM,QAAQ,CAAC,OAAc,YAA4B,MAAM,MAAM,QAAQ,OAAO,OAAO,OAAO;AAGlG,IAAM,YAAY,CAAC,OAAc,UAAU,MAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,OAAO;AAGlG,IAAM,QAAQ,CAAC,OAAc,UAAU,MAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,OAAO;AAG9F,IAAM,UAAU,CAAC,UAAyB,MAAM,QAAQ,OAAO;AAM/D,IAAM,cAAc,CAAC,WAAoD;AAAA,EAC9E,OAAO,MAAM,QAAQ,OAAO;AAAA,EAC5B,OAAO,MAAM,QAAQ,OAAO;AAC9B;AAGO,IAAM,UAAU,CAAC,UACtB,MAAM,QAAQ,SAAS,SAAS,MAAM,QAAQ,OAAO,QAAQ,MAAM,QAAQ,OAAO;AAIpF,IAAM,OAAO,CAAC,OAAc,MAAyC,MAAM,QAAQ,KAAK,CAAC,KAAK,aAAa,CAAC;AAOrG,SAAS,aAAa,OAAc;AACzC,SAAO;AAAA;AAAA,IAEL,gBAAgB,KAAK,OAAO,GAAG;AAAA;AAAA,IAE/B,QAAQ,KAAK,OAAO,GAAG;AAAA;AAAA,IAEvB,QAAQ,KAAK,OAAO,GAAG;AAAA;AAAA,IAEvB,UAAU,KAAK,OAAO,GAAG;AAAA;AAAA,IAEzB,OAAO,KAAK,OAAO,GAAG;AAAA;AAAA,IAEtB,QAAQ,KAAK,OAAO,GAAG;AAAA;AAAA,IAEvB,OAAO,KAAK,OAAO,GAAG;AAAA;AAAA,IAEtB,OAAO,KAAK,OAAO,GAAG;AAAA;AAAA,IAEtB,SAAS,KAAK,OAAO,GAAG;AAAA;AAAA,IAExB,QAAQ,KAAK,OAAO,EAAE;AAAA,EACxB;AACF;AAgBO,SAAS,eAAe,OAA6B;AAC1D,SAAO,EAAE,MAAM,KAAK,OAAO,GAAG,GAAG,MAAM,KAAK,OAAO,GAAG,GAAG,OAAO,KAAK,OAAO,GAAG,GAAG,cAAc,MAAM,QAAQ,OAAO,MAAM;AAC7H;AAGO,SAAS,YAAY,OAA6B;AACvD,QAAM,OAAO,KAAK,OAAO,GAAG;AAC5B,SAAO,EAAE,MAAM,OAAO,KAAK,OAAO,GAAG,GAAG,MAAM,KAAK,OAAO,GAAG,GAAG,cAAc,MAAM,QAAQ,gBAAgB,IAAI,EAAE;AACpH;","names":[]}
+{"version":3,"sources":["../src/tokens/ink.ts"],"sourcesContent":["import type { Theme } from '@mui/material/styles/index.js';\n\nimport { alpha } from './color';\nimport {\n  ATTENTION_INK,\n  CELEBRATION_GRADIENTS,\n  CODE_EDITOR_CHROME,\n  DATA_VIZ_NEON,\n  EFFECT_GLOW,\n  GLASS_SLATE,\n  HIGHLIGHT_MARK,\n  MAP_SURFACE,\n  NEUTRAL_RAMP,\n  PANEL_SHADOW_INK,\n  SOCIAL_BRAND,\n  TIMING_PHASES,\n} from './ink.core';\n\n/**\n * EVERY COLOUR A COMPONENT DRAWS, BY ROLE (FUT-2593, under FUT-2585).\n *\n * A component never writes a hex, an `rgba()`, a named colour or a step on the\n * grey ramp; it asks for a ROLE, and the role reads the theme:\n *\n * - the palette's own roles, straight — `text.secondary`, `divider`,\n *   `action.hover`, a semantic `main` and its `contrastText`;\n * - the INK roles below, over the palette's two absolutes — a scrim behind a\n *   modal, a shadow's ink, a glass sheen, the ink on a photo;\n * - the NEUTRAL tones, over the grey ramp, named by what they do rather than by\n *   their step, so a host that re-greys the ramp re-greys every one;\n * - `uiInk(theme)`, the colours with no palette role at all (`./ink.core.ts`),\n *   which a host can replace through `theme.uiInk`;\n * - `surfaces(theme)` and `softSignal(theme, signal)` (`./surfaces.ts`), the\n *   grounds a board and its cards sit on and a signal's soft background,\n *   which a host can replace through `theme.uiSurfaces` / `theme.uiSoftSignal`.\n *\n * Every default is the value the component drew before, so moving a component\n * onto these changed nothing on screen. `scripts/ui-tokens-gate.mjs` refuses a\n * raw colour or a ramp step in a component from here on.\n */\n\nexport interface UiInk {\n  dataVizNeon: { series: readonly string[]; ground: string; accent: string };\n  timingPhases: Record<keyof typeof TIMING_PHASES, string>;\n  mapSurface: Record<keyof typeof MAP_SURFACE, string>;\n  codeEditor: { light: Record<keyof typeof CODE_EDITOR_CHROME.light, string>; dark: Record<keyof typeof CODE_EDITOR_CHROME.dark, string> };\n  socialBrand: typeof SOCIAL_BRAND;\n  celebration: { mint: readonly [string, string]; violet: readonly [string, string] };\n  attention: { from: string; to: string; glow: string };\n  highlightMark: string;\n  glassSlate: string;\n  panelShadowInk: string;\n  effectGlow: { muiBlue: string; brandIndigo: string };\n}\n\nexport const DEFAULT_UI_INK: UiInk = {\n  dataVizNeon: DATA_VIZ_NEON,\n  timingPhases: TIMING_PHASES,\n  mapSurface: MAP_SURFACE,\n  codeEditor: CODE_EDITOR_CHROME,\n  socialBrand: SOCIAL_BRAND,\n  celebration: CELEBRATION_GRADIENTS,\n  attention: ATTENTION_INK,\n  highlightMark: HIGHLIGHT_MARK,\n  glassSlate: GLASS_SLATE,\n  panelShadowInk: PANEL_SHADOW_INK,\n  effectGlow: EFFECT_GLOW,\n};\n\ndeclare module '@mui/material/styles' {\n  interface Theme {\n    /** Colours with no palette role, by name. See `@12-apps/ui/tokens`' `uiInk`. */\n    uiInk?: Partial<UiInk>;\n  }\n  interface ThemeOptions {\n    /**\n     * Replace any of the named colour sets `@12-apps/ui` draws with. Each set is\n     * replaced WHOLE (the merge is one level deep): to change `codeEditor.dark`,\n     * pass `codeEditor` with both `light` and `dark`.\n     */\n    uiInk?: Partial<UiInk>;\n  }\n}\n\n/** The named colour sets, with the host's `theme.uiInk` layered over the defaults. */\nexport function uiInk(theme: Theme): UiInk {\n  return { ...DEFAULT_UI_INK, ...theme.uiInk };\n}\n\n/* ── Ink roles over the palette's two absolutes ───────────────────────────── */\n\n/** The dim laid behind a modal, a lightbox, a spotlight. */\nexport const scrim = (theme: Theme, opacity: number): string => alpha(theme.palette.common.black, opacity);\n\n/** The colour of a drop shadow or a glow's dark half. */\nexport const shadowInk = (theme: Theme, opacity = 1): string => alpha(theme.palette.common.black, opacity);\n\n/** A highlight: a glass edge, a shimmer, a pressed-in light. */\nexport const sheen = (theme: Theme, opacity = 1): string => alpha(theme.palette.common.white, opacity);\n\n/** Ink that sits ON a photo, a gradient or a scrim — never on the page. */\nexport const onMedia = (theme: Theme): string => theme.palette.common.white;\n\n/**\n * The palette's two absolutes, for the places the hue must be exactly black or\n * white: a CSS mask's opaque stop, the black `dark` tooltip.\n */\nexport const absoluteInk = (theme: Theme): { black: string; white: string } => ({\n  black: theme.palette.common.black,\n  white: theme.palette.common.white,\n});\n\n/** The absolute that CONTRASTS with the mode's page: black in light mode, white in dark. */\nexport const modeInk = (theme: Theme): string =>\n  theme.palette.mode === 'dark' ? theme.palette.common.white : theme.palette.common.black;\n\n/**\n * The well of a field that sits on a tinted panel: white in light mode, so the\n * field reads as a field against the paper around it; the paper itself in dark\n * mode, where white would glare.\n */\nexport const fieldWell = (theme: Theme): string =>\n  theme.palette.mode === 'dark' ? theme.palette.background.paper : theme.palette.common.white;\n\n/* ── Neutral tones over the grey ramp ─────────────────────────────────────── */\n\nconst step = (theme: Theme, n: keyof typeof NEUTRAL_RAMP): string => theme.palette.grey[n] ?? NEUTRAL_RAMP[n];\n\n/**\n * The neutral scale by ROLE. The names say what a tone is for, so a component\n * reads `neutralTones(theme).track` rather than \"grey 300\", and a host that\n * re-greys the ramp moves every one of them together.\n */\nexport function neutralTones(theme: Theme) {\n  return {\n    /** A dark chip on a light UI: a tooltip, a context menu, a code block's dark ground. */\n    inverseSurface: step(theme, 900),\n    /** A raised dark panel. */\n    raised: step(theme, 800),\n    /** A neutral control's fill. */\n    strong: step(theme, 700),\n    /** A neutral accent: a badge, a strong scrollbar thumb. */\n    emphasis: step(theme, 600),\n    /** A quiet mark: an offline dot, a secondary icon. */\n    muted: step(theme, 500),\n    /** An idle connector, a light scrollbar thumb. */\n    subtle: step(theme, 400),\n    /** An idle track, a placeholder fill. */\n    track: step(theme, 300),\n    /** A faint track, a light scrollbar channel. */\n    faint: step(theme, 200),\n    /** A light code block, a light card. */\n    surface: step(theme, 100),\n    /** The lightest ground. */\n    canvas: step(theme, 50),\n  };\n}\n\n/** The four-stop accent a component's `neutral` colour resolves to. */\nexport interface NeutralAccent {\n  main: string;\n  light: string;\n  dark: string;\n  contrastText: string;\n}\n\n/**\n * The neutral the CONTROLS draw with — grey 700, pressed 800, soft 500, white\n * ink — for `Button`, `Toggle`, `RadioGroup`, `Switch`, `Slider`, `Textarea`,\n * `InputOTP`. Not `accentFor(theme, 'neutral')` (600/400/800, a badge's): the\n * controls have always been one step darker.\n */\nexport function controlNeutral(theme: Theme): NeutralAccent {\n  return { main: step(theme, 700), dark: step(theme, 800), light: step(theme, 500), contrastText: theme.palette.common.white };\n}\n\n/** The softer neutral a notice or a progress track draws with — 500 on a 300 ground, 700 pressed. */\nexport function softNeutral(theme: Theme): NeutralAccent {\n  const main = step(theme, 500);\n  return { main, light: step(theme, 300), dark: step(theme, 700), contrastText: theme.palette.getContrastText(main) };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAuDO,IAAM,iBAAwB;AAAA,EACnC,aAAa;AAAA,EACb,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,aAAa;AAAA,EACb,WAAW;AAAA,EACX,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,YAAY;AACd;AAkBO,SAAS,MAAM,OAAqB;AACzC,SAAO,EAAE,GAAG,gBAAgB,GAAG,MAAM,MAAM;AAC7C;AAKO,IAAM,QAAQ,CAAC,OAAc,YAA4B,MAAM,MAAM,QAAQ,OAAO,OAAO,OAAO;AAGlG,IAAM,YAAY,CAAC,OAAc,UAAU,MAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,OAAO;AAGlG,IAAM,QAAQ,CAAC,OAAc,UAAU,MAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,OAAO;AAG9F,IAAM,UAAU,CAAC,UAAyB,MAAM,QAAQ,OAAO;AAM/D,IAAM,cAAc,CAAC,WAAoD;AAAA,EAC9E,OAAO,MAAM,QAAQ,OAAO;AAAA,EAC5B,OAAO,MAAM,QAAQ,OAAO;AAC9B;AAGO,IAAM,UAAU,CAAC,UACtB,MAAM,QAAQ,SAAS,SAAS,MAAM,QAAQ,OAAO,QAAQ,MAAM,QAAQ,OAAO;AAO7E,IAAM,YAAY,CAAC,UACxB,MAAM,QAAQ,SAAS,SAAS,MAAM,QAAQ,WAAW,QAAQ,MAAM,QAAQ,OAAO;AAIxF,IAAM,OAAO,CAAC,OAAc,MAAyC,MAAM,QAAQ,KAAK,CAAC,KAAK,aAAa,CAAC;AAOrG,SAAS,aAAa,OAAc;AACzC,SAAO;AAAA;AAAA,IAEL,gBAAgB,KAAK,OAAO,GAAG;AAAA;AAAA,IAE/B,QAAQ,KAAK,OAAO,GAAG;AAAA;AAAA,IAEvB,QAAQ,KAAK,OAAO,GAAG;AAAA;AAAA,IAEvB,UAAU,KAAK,OAAO,GAAG;AAAA;AAAA,IAEzB,OAAO,KAAK,OAAO,GAAG;AAAA;AAAA,IAEtB,QAAQ,KAAK,OAAO,GAAG;AAAA;AAAA,IAEvB,OAAO,KAAK,OAAO,GAAG;AAAA;AAAA,IAEtB,OAAO,KAAK,OAAO,GAAG;AAAA;AAAA,IAEtB,SAAS,KAAK,OAAO,GAAG;AAAA;AAAA,IAExB,QAAQ,KAAK,OAAO,EAAE;AAAA,EACxB;AACF;AAgBO,SAAS,eAAe,OAA6B;AAC1D,SAAO,EAAE,MAAM,KAAK,OAAO,GAAG,GAAG,MAAM,KAAK,OAAO,GAAG,GAAG,OAAO,KAAK,OAAO,GAAG,GAAG,cAAc,MAAM,QAAQ,OAAO,MAAM;AAC7H;AAGO,SAAS,YAAY,OAA6B;AACvD,QAAM,OAAO,KAAK,OAAO,GAAG;AAC5B,SAAO,EAAE,MAAM,OAAO,KAAK,OAAO,GAAG,GAAG,MAAM,KAAK,OAAO,GAAG,GAAG,cAAc,MAAM,QAAQ,gBAAgB,IAAI,EAAE;AACpH;","names":[]}

package/dist/{chunk-ZJGDD54X.js → chunk-XKSA4L2X.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-7ZPUN7TV.js";
 import {
   neutralTones
-} from "./chunk-SSX5ITPM.js";
+} from "./chunk-XJAD6E3V.js";
 
 // src/components/utility/WorkflowStep/WorkflowStep.helpers.ts
 var INDICATOR_SIZE = {
@@ -98,4 +98,4 @@ export {
   progressValueText,
   progressValueRange
 };
-//# sourceMappingURL=chunk-ZJGDD54X.js.map
+//# sourceMappingURL=chunk-XKSA4L2X.js.map