basalt-ui 1.31.0 → 1.32.0

package/dist/charts/primitives/HoverOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HoverOverlay.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/HoverOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAGzF;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,MAAM,EACN,MAAM,EACN,MAAM,EACN,IAAI,EACJ,OAAO,EACP,SAAS,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,SAAS,GACV,EAAE;IACD,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC3C;2FACuF;IACvF,MAAM,CAAC,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC5C,wEAAwE;IACxE,IAAI,CAAC,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC1C,OAAO,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC5C,4DAA4D;IAC5D,SAAS,CAAC,EAAE,oBAAoB,CAAC,cAAc,CAAC,CAAA;IAChD,MAAM,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAA;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,+BAiCA"}
+{"version":3,"file":"HoverOverlay.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/HoverOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AACzF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAG1D,qCAAqC;AACrC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC3C;2FACuF;IACvF,MAAM,CAAC,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC5C,wEAAwE;IACxE,IAAI,CAAC,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC1C,OAAO,EAAE,mBAAmB,CAAC,cAAc,CAAC,CAAA;IAC5C,4DAA4D;IAC5D,SAAS,CAAC,EAAE,oBAAoB,CAAC,cAAc,CAAC,CAAA;IAChD,MAAM,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAA;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,qEAAqE;IACrE,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,MAAM,EACN,MAAM,EACN,MAAM,EACN,IAAI,EACJ,OAAO,EACP,SAAS,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,SAAS,GACV,EAAE,iBAAiB,+BAiCnB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,KAAK,EAAE;IAC1C,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,CAAA;IACtB,IAAI,EAAE,SAAS,CAAC,EAAE,CAAA;IAClB,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,CAAA;IACtB,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAA;IAChC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;CAC9B,GAAG,IAAI,CAAC,iBAAiB,EAAE,OAAO,GAAG,QAAQ,CAAC,CAc9C"}

package/dist/charts/primitives/HoverOverlay.js

@@ -50,6 +50,22 @@ function HoverOverlay({
     )
   );
 }
+function cursorSliderProps(input) {
+  const { cursor, data, getX, formatX, ariaLabel } = input;
+  const { point } = cursor;
+  return {
+    onMove: cursor.onPointerMove,
+    onDown: cursor.onPointerDown,
+    onUp: cursor.onPointerUp,
+    onLeave: cursor.onPointerLeave,
+    onKeyDown: cursor.onKeyDown,
+    onBlur: cursor.onBlur,
+    valueMax: Math.max(data.length - 1, 0),
+    ...point !== null && { valueNow: data.indexOf(point), valueText: formatX(getX(point)) },
+    ...ariaLabel !== void 0 && { ariaLabel }
+  };
+}
 export {
-  HoverOverlay
+  HoverOverlay,
+  cursorSliderProps
 };

package/dist/charts/primitives/chart-card-context.d.ts

@@ -1,3 +1,16 @@
+import type { Dispatch } from 'react';
+/** One frame claiming or releasing the card's header legend slot. */
+export type LegendSlotAction = {
+    type: 'claim' | 'release';
+    id: string;
+};
+/**
+ * The ONE owner of the legend-slot protocol (`docs/waves/PLAN.md` wave 3, P2-9): claimants in claim
+ * order, and the head owns the slot. A later claimant is denied simply by not being the head, and
+ * it takes over the moment everything ahead of it releases — no retry signal, no ownership mirrored
+ * in a ref. Returns the same array on a no-op so a repeated claim/release never re-renders the card.
+ */
+export declare function legendSlotReducer(claimants: readonly string[], { type, id }: LegendSlotAction): readonly string[];
 /**
  * `ChartCard`'s internal context: `inCard` (a frame inside a card treats its computed height as a
  * MINIMUM and grows into the card body), the legend slot — the empty header-row box a chart will portal its legend into
@@ -7,23 +20,14 @@
  * 'dots' before it eats the plot floor (`docs/CHARTS-SPEC.md` §5, wave 11). `null`/`false` until the slot
  * mounts, and outside any card. Deliberately not exported from any barrel.
  *
- * `claimLegendSlot`/`releaseLegendSlot` arbitrate the slot when a card hosts more than one
- * `ChartFrame` (`docs/waves/PLAN.md` wave 3, P2-9): the first frame to claim an id keeps it for as
- * long as it holds it, every later claimant is told no and falls back to its own band legend
- * instead of a second frame silently portalling into the same node. Outside any card there is no
- * slot to contend for, so the default always grants the claim.
- *
- * `legendSlotVersion` bumps every time the owner releases the slot (round 3's carried gap): a
- * denied frame's claim attempt runs once, in its own mount effect, so with no signal that the slot
- * freed up it would sit denied forever even after the owning frame unmounts. Frames read it only to
- * put it in a dependency array — the effect re-running is the entire point, not the number itself.
+ * `legendClaimants` is {@link legendSlotReducer}'s queue (its head owns the slot) and
+ * `dispatchLegendSlot` feeds it. Outside any card there is no slot, so nothing ever claims.
  */
 export declare const ChartCardContext: import("react").Context<{
     legendSlot: HTMLDivElement | null;
     inCard: boolean;
     short: boolean;
-    claimLegendSlot: (id: string) => boolean;
-    releaseLegendSlot: (id: string) => void;
-    legendSlotVersion: number;
+    legendClaimants: readonly string[];
+    dispatchLegendSlot: Dispatch<LegendSlotAction>;
 }>;
 //# sourceMappingURL=chart-card-context.d.ts.map

package/dist/charts/primitives/chart-card-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-card-context.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/chart-card-context.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,gBAAgB;gBACf,cAAc,GAAG,IAAI;YACzB,OAAO;WACR,OAAO;qBACG,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO;uBACrB,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI;uBACpB,MAAM;EAQzB,CAAA"}
+{"version":3,"file":"chart-card-context.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/chart-card-context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAErC,qEAAqE;AACrE,MAAM,MAAM,gBAAgB,GAAG;IAAE,IAAI,EAAE,OAAO,GAAG,SAAS,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAA;AAExE;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,SAAS,MAAM,EAAE,EAC5B,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,gBAAgB,GAC7B,SAAS,MAAM,EAAE,CAInB;AAED;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,gBAAgB;gBACf,cAAc,GAAG,IAAI;YACzB,OAAO;WACR,OAAO;qBACG,SAAS,MAAM,EAAE;wBACd,QAAQ,CAAC,gBAAgB,CAAC;EAO9C,CAAA"}

package/dist/charts/primitives/chart-card-context.js

@@ -1,13 +1,18 @@
 import { createContext } from "react";
+function legendSlotReducer(claimants, { type, id }) {
+  const held = claimants.includes(id);
+  if (type === "claim") return held ? claimants : [...claimants, id];
+  return held ? claimants.filter((c) => c !== id) : claimants;
+}
 const ChartCardContext = createContext({
   legendSlot: null,
   inCard: false,
   short: false,
-  claimLegendSlot: () => true,
-  releaseLegendSlot: () => {
-  },
-  legendSlotVersion: 0
+  legendClaimants: [],
+  dispatchLegendSlot: () => {
+  }
 });
 export {
-  ChartCardContext
+  ChartCardContext,
+  legendSlotReducer
 };

package/dist/charts/primitives/chart-frame-layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-frame-layout.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/chart-frame-layout.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"chart-frame-layout.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/chart-frame-layout.ts"],"names":[],"mappings":"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"}

package/dist/charts/primitives/chart-frame-layout.js

@@ -97,60 +97,54 @@ const legendEntryWidth = (item) => LEGEND_SWATCH_W + measureText(
   item.note === void 0 ? item.label : `${item.label} ${item.note}`,
   VX.legendFontSize
 );
-function fitChipRows(items, width, rows, allowZero = false) {
+function fitGreedyRows(items, fit) {
   let row = 1;
   let x = 0;
   let fitted = 0;
-  for (const item of items) {
-    const w = legendEntryWidth(item);
-    const next = x === 0 ? w : x + VX.legendGap + w;
-    if (x === 0 && allowZero && next > width) return 0;
-    if (next > width && x > 0) {
+  for (const [i, item] of items.entries()) {
+    const w = fit.widthOf(item);
+    const next = x === 0 ? w : x + fit.gap + w;
+    if (x === 0 && fit.allowZero === true && next > fit.width) return 0;
+    if (next > fit.width && x > 0) {
       row += 1;
-      if (row > rows) return fitted;
+      if (row > fit.rows) return fitted;
       x = w;
     } else {
       x = next;
     }
     fitted += 1;
+    x += fit.extraAfter?.(i) ?? 0;
   }
   return fitted;
 }
+const chipFit = { widthOf: legendEntryWidth, gap: VX.legendGap };
 function entriesWithinRows(items, width, rows) {
-  return fitChipRows(items, width, rows);
+  return fitGreedyRows(items, { ...chipFit, width, rows });
 }
 function entriesWithinChipRows(items, width, rows) {
   const total = items.length;
-  const fittedNoReserve = fitChipRows(items, width, rows);
+  const fittedNoReserve = entriesWithinRows(items, width, rows);
   if (fittedNoReserve >= total) return fittedNoReserve;
   const reserve = measureText(`All ${total}`, VX.legendFontSize) + VX.legendGap;
-  return fitChipRows(items, Math.max(width - reserve, 0), rows, true);
-}
-function fitDotRows(items, width, rows, dividerAfter, allowZero = false) {
-  let row = 1;
-  let x = 0;
-  let fitted = 0;
-  for (let i = 0; i < items.length; i += 1) {
-    const next = x === 0 ? LEGEND_DOT_SIZE : x + DOT_PITCH;
-    if (x === 0 && allowZero && next > width) return 0;
-    if (next > width && x > 0) {
-      row += 1;
-      if (row > rows) return fitted;
-      x = LEGEND_DOT_SIZE;
-    } else {
-      x = next;
-    }
-    fitted += 1;
-    if (dividerAfter.has(i)) x += DOT_PITCH;
-  }
-  return fitted;
+  return fitGreedyRows(items, {
+    ...chipFit,
+    width: Math.max(width - reserve, 0),
+    rows,
+    allowZero: true
+  });
 }
 function entriesWithinDotRows(items, width, rows, dividerAfter = /* @__PURE__ */ new Set()) {
+  const dotFit = {
+    widthOf: () => LEGEND_DOT_SIZE,
+    gap: DOT_PITCH - LEGEND_DOT_SIZE,
+    rows,
+    extraAfter: (i) => dividerAfter.has(i) ? DOT_PITCH : 0
+  };
   const total = items.length;
-  const fittedNoReserve = fitDotRows(items, width, rows, dividerAfter);
+  const fittedNoReserve = fitGreedyRows(items, { ...dotFit, width });
   if (fittedNoReserve >= total) return fittedNoReserve;
   const reserve = measureText(`All ${total}`, VX.legendFontSize) + DOT_PITCH;
-  return fitDotRows(items, Math.max(width - reserve, 0), rows, dividerAfter, true);
+  return fitGreedyRows(items, { ...dotFit, width: Math.max(width - reserve, 0), allowZero: true });
 }
 function legendEntryCap(input) {
   const { items, containerW, available, defaultMaxRows } = input;

package/dist/charts/primitives/legend-disclosure.d.ts

@@ -0,0 +1,27 @@
+import type { CSSProperties, ReactNode } from 'react';
+/**
+ * `ChartLegend`'s `All N` disclosure state: which button opened it (the chip, or a dots-mode entry)
+ * and where the fixed panel sits. Focus moves into the panel on open and back to that trigger on
+ * EVERY close path; a scroll outside the panel or a resize closes it, since it is fixed to where the
+ * trigger WAS.
+ */
+export declare function useLegendDisclosure(coarse: boolean): {
+    open: boolean;
+    panelId: string;
+    openFrom: (trigger: HTMLButtonElement) => void;
+    close: () => void;
+    panel: {
+        panelRef: import("react").RefObject<HTMLDialogElement | null>;
+        panelId: string;
+        coarse: boolean;
+        placement: CSSProperties | null;
+        close: () => void;
+    };
+};
+/** The portalled panel itself — a popover under the chip on a fine pointer, a docked sheet (over a
+ * scrim) on a coarse one. Fixed-position, so opening it never grows the legend band. */
+export declare function LegendDisclosure({ panelRef, panelId, coarse, placement, close, fontSize, children, }: ReturnType<typeof useLegendDisclosure>['panel'] & {
+    fontSize: number;
+    children: ReactNode;
+}): import("react").ReactPortal | null;
+//# sourceMappingURL=legend-disclosure.d.ts.map

package/dist/charts/primitives/legend-disclosure.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"legend-disclosure.d.ts","sourceRoot":"","sources":["../../../src/charts/primitives/legend-disclosure.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAwDrD;;;;;GAKG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,OAAO;;;wBAQtB,iBAAiB;;;;;;;;;EAuD7C;AAED;wFACwF;AACxF,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC,OAAO,CAAC,GAAG;IACnD,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,SAAS,CAAA;CACpB,sCAoCA"}

package/dist/charts/primitives/legend-disclosure.js

@@ -0,0 +1,153 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { alpha, VX } from "../../tokens/index.js";
+import { useDismissOnOutside } from "../cursor/touch-pin.js";
+import { LEGEND_ROW_GAP } from "./chart-frame-layout.js";
+const DISCLOSURE_PANEL = {
+  position: "fixed",
+  zIndex: VX.zIndexFloating,
+  display: "flex",
+  flexDirection: "column",
+  gap: LEGEND_ROW_GAP,
+  // theme-allow raw-scroll-container — a fixed floating panel of one legend, not app chrome
+  overflowY: "auto",
+  // `<dialog open>` brings UA chrome (centring margin, border, fit-content box) this resets.
+  margin: 0,
+  border: "none",
+  width: "auto",
+  height: "auto",
+  padding: 10,
+  boxSizing: "border-box",
+  backgroundColor: VX.surface.overlay,
+  boxShadow: VX.shadowOverlay,
+  color: VX.muted,
+  borderRadius: VX.radiusCard
+};
+const DISCLOSURE_MIN_HEIGHT = 96;
+function disclosurePlacement(chip, coarse) {
+  if (coarse) {
+    return {
+      left: 0,
+      right: 0,
+      bottom: 0,
+      maxHeight: "60dvh",
+      borderBottomLeftRadius: 0,
+      borderBottomRightRadius: 0,
+      padding: "12px 16px calc(12px + env(safe-area-inset-bottom, 0px))"
+    };
+  }
+  const below = window.innerHeight - chip.bottom;
+  const left = Math.max(8, Math.min(chip.left, window.innerWidth - 248));
+  const base = { left, right: "auto", minWidth: 200, maxWidth: "calc(100vw - 16px)" };
+  return below >= 200 || below >= chip.top ? { ...base, top: chip.bottom + 4, maxHeight: Math.max(below - 12, DISCLOSURE_MIN_HEIGHT) } : {
+    ...base,
+    bottom: window.innerHeight - chip.top + 4,
+    maxHeight: Math.max(chip.top - 12, DISCLOSURE_MIN_HEIGHT)
+  };
+}
+function useLegendDisclosure(coarse) {
+  const [placement, setPlacement] = useState(null);
+  const triggerRef = useRef(null);
+  const panelRef = useRef(null);
+  const panelId = useId();
+  const wasOpen = useRef(false);
+  const open = placement !== null;
+  const close = useCallback(() => setPlacement(null), []);
+  const openFrom = (trigger) => {
+    triggerRef.current = trigger;
+    setPlacement(disclosurePlacement(trigger.getBoundingClientRect(), coarse));
+  };
+  useEffect(() => {
+    if (open) panelRef.current?.focus();
+    else if (wasOpen.current) triggerRef.current?.focus();
+    wasOpen.current = open;
+  }, [open]);
+  const isInsidePanel = useCallback(
+    (target) => panelRef.current?.contains(target) === true || triggerRef.current?.contains(target) === true,
+    []
+  );
+  useDismissOnOutside({
+    enabled: open,
+    isInside: isInsidePanel,
+    onDismiss: close,
+    dismissOnResize: true,
+    scrollExemptInside: true
+  });
+  useEffect(() => {
+    if (!open || !coarse) return;
+    const panel = panelRef.current;
+    if (panel === null) return;
+    const onKeyDown = (e) => {
+      if (e.key !== "Tab") return;
+      const focusable = panel.querySelectorAll(
+        'button, [tabindex]:not([tabindex="-1"])'
+      );
+      const first = focusable[0];
+      const last = focusable[focusable.length - 1];
+      if (first === void 0 || last === void 0) return;
+      if (e.shiftKey && document.activeElement === first) {
+        e.preventDefault();
+        last.focus();
+      } else if (!e.shiftKey && document.activeElement === last) {
+        e.preventDefault();
+        first.focus();
+      }
+    };
+    panel.addEventListener("keydown", onKeyDown);
+    return () => panel.removeEventListener("keydown", onKeyDown);
+  }, [open, coarse]);
+  return { open, panelId, openFrom, close, panel: { panelRef, panelId, coarse, placement, close } };
+}
+function LegendDisclosure({
+  panelRef,
+  panelId,
+  coarse,
+  placement,
+  close,
+  fontSize,
+  children
+}) {
+  if (placement === null) return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs(Fragment, { children: [
+      coarse && /* @__PURE__ */ jsx(
+        "div",
+        {
+          "aria-hidden": true,
+          onPointerDown: (e) => {
+            e.stopPropagation();
+            close();
+          },
+          style: {
+            position: "fixed",
+            inset: 0,
+            // One below the panel it sits behind — still `VX.zIndexFloating`-derived, never a
+            // second unrelated literal (B14).
+            zIndex: VX.zIndexFloating - 1,
+            backgroundColor: alpha(VX.neutral, 0.35)
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "dialog",
+        {
+          ref: panelRef,
+          id: panelId,
+          open: true,
+          tabIndex: -1,
+          "aria-label": "Legend",
+          ...coarse && { "aria-modal": true },
+          "data-basalt-legend-disclosure": coarse ? "sheet" : "popover",
+          style: { ...DISCLOSURE_PANEL, fontSize, ...placement },
+          children
+        }
+      )
+    ] }),
+    document.body
+  );
+}
+export {
+  LegendDisclosure,
+  useLegendDisclosure
+};

package/dist/controls/controls.module.css

@@ -49,6 +49,11 @@
   flex-shrink: 0;
 }
 
+/* theme-allow-file raw-media-query — the ControlRow's own C9 swap (pills inline, the rest in a
+   sheet) keys on the SIZE CLASS by design: the sheet is compact-class chrome, the same axis the
+   shell's bottom bar reads. Every width query here is `SIZE_CLASSES.medium`, pinned by
+   `breakpoint-literals.test.ts`. */
+
 /* Below `sm` only the first `inline` slots are pills; the rest live in the sheet. */
 @media (max-width: 52.49375em) {
   .pillSlot:not([data-inline]) {

package/dist/controls/sync-button.module.css

@@ -45,6 +45,7 @@
  * width itself, pinned to the `ctl` height so the box is square. This module is unlayered, so it
  * outranks `@layer mantine` regardless of specificity.
  */
+/* theme-allow raw-media-query — the control's own C9 icon-only swap at the compact size class */
 @media (max-width: 52.49375em) {
   .label,
   .age {

package/dist/dashboard/stat-group.module.css

@@ -15,24 +15,24 @@
  * one: a query with no container resolves to false, so a shell-only context would have silently
  * pinned every non-shell consumer to the base count.
  *
- * The `@supports not` block below it is the pre-2023 fallback and the ONLY place the old viewport
- * law survives. It is written as an exclusive alternative rather than as a base the container
- * queries override, because the rail's `:nth-child` suppressors are MORE specific than the rule
- * that draws the border: two overlapping laws would each suppress a different set of leading cells
- * and the rail would lose hairlines in the middle of a row. One law at a time, chosen by support.
+ * The literals are the container-class law (`CONTAINER_CLASSES`, `tokens/size-classes.ts`): the
+ * `sm` count opens at `wide` (800px), not at the viewport-era 768. Two are StatGroup's own and say
+ * so: 260px (one column, below) and 1200px, where the full `cols` count opens. The class table
+ * stops at 800, and 800 is too early for a full KPI row — four cells of ~190px clamp a value a real
+ * dashboard prints (`tests/layout/page-aside.layout.test.ts` measures ~195px against the 844px row
+ * a claimed aside leaves). Conditions are px, never `em`: `em` inside a `@container` condition
+ * resolves against the CONTAINER's font-size, so a consumer panel with smaller text would silently
+ * move the boundary. A condition cannot read a custom property, so the numbers are written; the
+ * COUNTS are custom properties the component sets per instance.
  *
- * The literals: `@container` conditions are stated in px, `@media` ones in Mantine's own `em`
- * (`--mantine-breakpoint-sm` 48em, `--mantine-breakpoint-lg` 75em). Both spellings name the same
- * boundary at the 16px initial font size — 768px and 1200px — but `em` inside a `@container`
- * condition resolves against the CONTAINER's font-size rather than the root's, so a consumer panel
- * with smaller text would silently move the breakpoint. px is the only spelling that cannot drift.
- * (`47.99375em` → `767.9px`, `74.99375em` → `1199.9px`.) A condition still cannot read a custom property either way, so the numbers are written;
- * the COUNTS are custom properties the component sets per instance.
+ * No viewport fallback: basalt's own CSS already requires `color-mix()` (Safari 16.2, Chrome 111,
+ * Firefox 113), and every one of those parses `@container` — a `@supports not (container-type)`
+ * block is unreachable in any browser that renders basalt at all.
  */
 
 .container {
   container-type: inline-size;
-  container-name: basalt-stat-group;
+  container-name: basalt-grid;
 }
 
 .root {
@@ -45,7 +45,7 @@
 
 /* 260px is StatGroup's own literal (docs/DESIGN-CORE.md § Layout, elevation, shapes), not a container class: one column below it,
  * so every cell leads a row and the rail draws no leading hairline at all. */
-@container basalt-stat-group (max-width: 259.9px) {
+@container basalt-grid (max-width: 259.9px) {
   .root {
     grid-template-columns: minmax(0, 1fr);
   }
@@ -56,13 +56,13 @@
   }
 }
 
-@container basalt-stat-group (min-width: 768px) {
+@container basalt-grid (min-width: 800px) {
   .root {
     grid-template-columns: repeat(var(--basalt-stat-group-cols-sm), minmax(0, 1fr));
   }
 }
 
-@container basalt-stat-group (min-width: 1200px) {
+@container basalt-grid (min-width: 1200px) {
   .root {
     grid-template-columns: repeat(var(--basalt-stat-group-cols-lg), minmax(0, 1fr));
   }
@@ -83,14 +83,14 @@
   padding-inline-start: var(--vx-space-stack-md);
 }
 
-@container basalt-stat-group (max-width: 767.9px) {
+@container basalt-grid (max-width: 799.9px) {
   .root[data-divided] > *:nth-child(2n + 1) {
     border-inline-start: 0;
     padding-inline-start: 0;
   }
 }
 
-@container basalt-stat-group (min-width: 768px) and (max-width: 1199.9px) {
+@container basalt-grid (min-width: 800px) and (max-width: 1199.9px) {
   .root[data-divided][data-sm-cols='2'] > *:nth-child(2n + 1),
   .root[data-divided][data-sm-cols='3'] > *:nth-child(3n + 1) {
     border-inline-start: 0;
@@ -98,7 +98,7 @@
   }
 }
 
-@container basalt-stat-group (min-width: 1200px) {
+@container basalt-grid (min-width: 1200px) {
   .root[data-divided][data-cols='2'] > *:nth-child(2n + 1),
   .root[data-divided][data-cols='3'] > *:nth-child(3n + 1),
   .root[data-divided][data-cols='4'] > *:nth-child(4n + 1),
@@ -107,48 +107,3 @@
     padding-inline-start: 0;
   }
 }
-
-/*
- * The pre-container-query fallback — Safari < 16, Chrome < 106, Firefox < 110. Verbatim the law
- * this file shipped before, keyed on the viewport, and reachable ONLY where `@container` is not.
- * A browser that cannot parse `container-type` also cannot parse the `@container` blocks above, so
- * the two sets are never live at once.
- */
-@supports not (container-type: inline-size) {
-  @media (min-width: 48em) {
-    .root {
-      grid-template-columns: repeat(var(--basalt-stat-group-cols-sm), minmax(0, 1fr));
-    }
-  }
-
-  @media (min-width: 75em) {
-    .root {
-      grid-template-columns: repeat(var(--basalt-stat-group-cols-lg), minmax(0, 1fr));
-    }
-  }
-
-  @media (max-width: 47.99375em) {
-    .root[data-divided] > *:nth-child(2n + 1) {
-      border-inline-start: 0;
-      padding-inline-start: 0;
-    }
-  }
-
-  @media (min-width: 48em) and (max-width: 74.99375em) {
-    .root[data-divided][data-sm-cols='2'] > *:nth-child(2n + 1),
-    .root[data-divided][data-sm-cols='3'] > *:nth-child(3n + 1) {
-      border-inline-start: 0;
-      padding-inline-start: 0;
-    }
-  }
-
-  @media (min-width: 75em) {
-    .root[data-divided][data-cols='2'] > *:nth-child(2n + 1),
-    .root[data-divided][data-cols='3'] > *:nth-child(3n + 1),
-    .root[data-divided][data-cols='4'] > *:nth-child(4n + 1),
-    .root[data-divided][data-cols='5'] > *:nth-child(5n + 1) {
-      border-inline-start: 0;
-      padding-inline-start: 0;
-    }
-  }
-}

package/dist/dashboard/widget-grid.module.css

@@ -15,18 +15,19 @@
  * container. A span resolved against the viewport while the tracks follow the container is exactly
  * the phantom-track defect `WidgetGrid.Item`'s context clamp exists to prevent.
  *
- * The literals: px in `@container`, Mantine's own `em` in the `@supports not` fallback — same
- * boundary (768px / 1200px at the 16px initial font size), but `em` inside a `@container`
- * condition resolves against the CONTAINER's font-size, so px is the only spelling that cannot
- * drift. A condition cannot read a custom property either way, so the numbers are written; the
- * COUNTS are custom properties, set once per instance by the component — three hand-written
- * `repeat()` blocks would have to enumerate every `cols` value, and the whole point of this
- * primitive is that a consumer states one desktop number and basalt owns the rest.
+ * The literals are the container-class law, as in `stat-group.module.css`: the `sm` count opens
+ * at `wide` (800px); 1200px, where the full `cols` count opens, is the grid's own boundary above
+ * the class table's top step. px, never `em` (an `em` condition resolves against the container's
+ * font-size). A condition cannot read a custom property, so the numbers are written; the COUNTS
+ * are custom properties, set once per instance by the component — three hand-written `repeat()`
+ * blocks would have to enumerate every `cols` value, and the whole point of this primitive is that
+ * a consumer states one desktop number and basalt owns the rest. No viewport fallback, for the
+ * reason `stat-group.module.css` states: nothing that renders basalt lacks `@container`.
  */
 
 .container {
   container-type: inline-size;
-  container-name: basalt-widget-grid;
+  container-name: basalt-grid;
 }
 
 .root {
@@ -47,7 +48,7 @@
   min-width: 0;
 }
 
-@container basalt-widget-grid (min-width: 768px) {
+@container basalt-grid (min-width: 800px) {
   .root {
     grid-template-columns: repeat(var(--basalt-widget-grid-cols-sm), minmax(0, 1fr));
   }
@@ -57,7 +58,7 @@
   }
 }
 
-@container basalt-widget-grid (min-width: 1200px) {
+@container basalt-grid (min-width: 1200px) {
   .root {
     grid-template-columns: repeat(var(--basalt-widget-grid-cols-lg), minmax(0, 1fr));
   }
@@ -66,31 +67,3 @@
     grid-column: span var(--basalt-widget-grid-span-lg);
   }
 }
-
-/*
- * The pre-container-query fallback — Safari < 16, Chrome < 106, Firefox < 110. Verbatim the law
- * this file shipped before, keyed on the viewport, and reachable ONLY where `@container` is not: a
- * browser that cannot parse `container-type` cannot parse the blocks above either, so the two sets
- * are never live at once.
- */
-@supports not (container-type: inline-size) {
-  @media (min-width: 48em) {
-    .root {
-      grid-template-columns: repeat(var(--basalt-widget-grid-cols-sm), minmax(0, 1fr));
-    }
-
-    .item {
-      grid-column: span var(--basalt-widget-grid-span-sm);
-    }
-  }
-
-  @media (min-width: 75em) {
-    .root {
-      grid-template-columns: repeat(var(--basalt-widget-grid-cols-lg), minmax(0, 1fr));
-    }
-
-    .item {
-      grid-column: span var(--basalt-widget-grid-span-lg);
-    }
-  }
-}