basalt-ui 1.27.0 → 1.29.0

package/dist/surfaces.d.ts.map

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

package/dist/surfaces.js

@@ -10,18 +10,25 @@ const PLUGIN_RULE_ID_LIST = [
   "raw-scroll-container",
   "hand-rolled-filter",
   "control-outside-home",
+  "bound-control-outside-home",
   "control-size-literal",
   "page-bar-budget",
   "in-body-page-title",
   "responsive-twin",
   "search-literal-link",
   "use-search-from-literal",
+  "provider-above-router",
+  "query-dual-import",
+  "query-fn-unwrap",
+  "deprecated-export",
+  "forms-field-key",
   "visx-boundary",
   "visx-tooltip",
   "token-layer-boundary",
   "agent-resume-guard",
   "agent-no-raw-usechat",
-  "ai-sdk-major"
+  "ai-sdk-major",
+  "no-import-meta-env"
 ];
 const v = (spec, message, extra) => ({
   spec,
@@ -72,16 +79,33 @@ const SURFACES = {
       "in-body-page-title",
       "raw-scroll-container",
       "page-bar-budget",
-      "shadow-basalt-export"
+      "shadow-basalt-export",
+      // The mount-order law, guarded as of 1.28.0 (F5) — same-file static ancestry, so `warn`.
+      // `deprecated-export` sits here too: the ledger it reads spans subpaths.
+      "provider-above-router",
+      "deprecated-export",
+      // `import.meta.env` is a Vite-ism that fails outside a Vite build (SSR/server code, Node
+      // scripts, tests) — process.env.NODE_ENV works everywhere basalt code runs. Repo-local,
+      // scoped to all of src/**, one surface required by coverage (C2 consolidation).
+      "no-import-meta-env"
     ],
-    description: "BasaltProvider, createBasaltTheme, BasaltShell + sidebar/mobile-nav/breadcrumbs, PageBar, NavCountBadge, ThemeToggle, ThreadWorkspace + thread-chat components, WidgetHeader, dashboard composites (DeltaBadge, StatCard with threshold tone, EmptyState, QueryState/LoadingState/ErrorState, SettingsSection/SettingsRow/DangerZone)",
+    // agent/rules/basalt-mantine.md — stated, not guarded. The other law that stood here gained
+    // `provider-above-router` at 1.28.0; this one has no AST form left to catch, because
+    // `cssVariablesResolver` is now `Omit`ted from the accepted prop type and a hand-built
+    // `createTheme` is a consumer's own call to make. (`duplicate-notifications-mount`, the
+    // other 1.28.0 mount-order rule, retired — `BasaltNotifications` no longer exists.)
+    advisoryLaws: [
+      "no second cssVariablesResolver \u2014 don't hand-build createTheme or re-add the resolver basalt already installs"
+    ],
+    description: "BasaltProvider, createBasaltTheme, BasaltShell + sidebar/mobile-nav/breadcrumbs, PageBar, PageAside, useBreakpoint, NavCountBadge, ThemeToggle, ThreadWorkspace + thread-chat components, WidgetHeader, dashboard composites (DeltaBadge, StatCard with threshold tone, EmptyState, QueryState/LoadingState/ErrorState, SettingsSection/SettingsRow/DangerZone), ConnectivityProvider/useConnectivity/ConnectivityIndicator (auto-mounted, C1: absorbed from the dropped ./connectivity), createBasaltQueryClient/unwrap/BasaltQueryDevtools (C1: absorbed from the dropped ./query), BasaltDevDock (C5: lazy Router/Query devtools + theme lab in one dock)",
     optionalPeers: [
       "react-markdown",
       "remark-gfm",
       "rehype-sanitize",
       "remend",
       "shiki",
-      "beautiful-mermaid"
+      "beautiful-mermaid",
+      "@tanstack/react-router-devtools"
     ],
     forbiddenImports: []
     // the no-charts/tokens-reexport invariant is comment-only today; Phase-4 plugin
@@ -91,13 +115,7 @@ const SURFACES = {
     layer: "headless",
     rule: "charts",
     skill: ["basalt-charts"],
-    guardKinds: [
-      "raw-hex",
-      "raw-color-fn",
-      "raw-visx-axis",
-      "unframed-chart",
-      "chart-missing-aria-label"
-    ],
+    guardKinds: ["raw-hex", "raw-color-fn", "raw-visx-axis", "chart-missing-aria-label"],
     pluginRules: [
       "hand-rolled-plot",
       "chart-legend-literal",
@@ -161,7 +179,7 @@ const SURFACES = {
   },
   "./vite": {
     kind: "tooling",
-    layer: "mantine-coupled",
+    layer: "build-tooling",
     description: "basaltViteConfig(opts) \u2014 Vite preset for basalt-ui consumer apps; basaltAppPlugin(opts) \u2014 PWA head, manifest, and icon metadata derived from the token palette",
     optionalPeers: ["vite-plugin-pwa"],
     forbiddenImports: []
@@ -178,20 +196,14 @@ const SURFACES = {
     forbiddenImports: [...MANTINE_BANS]
   },
   // 6th JS subpath
-  "./query": {
-    kind: "doctrine",
+  "./format": {
+    kind: "tooling",
     layer: "headless",
-    rule: "batteries",
-    skill: ["basalt-app"],
-    guardKinds: [],
-    pluginRules: [],
-    description: "createBasaltQueryClient, transport-agnostic unwrap, lazy BasaltQueryDevtools",
-    optionalPeers: ["@tanstack/react-query-devtools"],
+    description: "money/percent/integer/compact/deltaPct/duration/durationClock/clock/relativeTime/weekday/km/kcal \u2014 Intl-backed, Mantine-free, React-free formatting; charts/utils/format.ts re-exports fmtCompact/fmtPercent/fmtCurrency/fmtInt/fmtAxisDate/fmtTooltipDate from here (C5 consolidation, one implementation)",
     globs: {
       shipped: [],
-      repo: ["packages/basalt-ui/src/query/**"]
+      repo: ["packages/basalt-ui/src/format/**"]
     },
-    // @visx/* ban dropped — `basalt/visx-boundary` now bans it universally outside charts.
     forbiddenImports: [...MANTINE_BANS]
   },
   "./router-tanstack": {
@@ -202,7 +214,7 @@ const SURFACES = {
     guardKinds: [],
     // Law C10 — a nav link's `search` and a reader's `from` are both this bridge's contract.
     pluginRules: ["search-literal-link", "use-search-from-literal"],
-    description: "TanStack Router bridge: defineNav/navGroup/navTarget (one typed nav definition) + useNav (sections + mobileNav, spread onto BasaltShell) + useBasaltNav (active route) + useRouterBreadcrumbs + createSearchStore (typed URL > localStorage > fallback store over field.enum/multi/range/number/boolean/string; deprecated createSearchParamStore/createMultiSearchParamStore wrappers until 1.29.0)",
+    description: "TanStack Router bridge: defineNav/navGroup/navTarget (one typed nav definition) + useNav (sections + mobileNav, spread onto BasaltShell) + useBasaltNav (active route) + useRouterBreadcrumbs + createSearchStore (typed URL > localStorage > fallback store over field.enum/multi/range/number/boolean/string; the deprecated createSearchParamStore/createMultiSearchParamStore wrappers were removed in 1.29.0, C1 consolidation)",
     optionalPeers: ["@tanstack/react-router"],
     globs: {
       shipped: [],
@@ -217,8 +229,12 @@ const SURFACES = {
     rule: "batteries",
     skill: ["basalt-design"],
     guardKinds: [],
-    pluginRules: [],
-    description: "Mantine form adapter: useBasaltForm, field, FormErrorSummary, useFormDraft (Standard Schema)",
+    // The one change in the 1.28.0 forms minor a compiler cannot see: `inputProps` stopped
+    // returning `key`, and the pre-1.28.0 spread still type-checks, renders and validates — it
+    // only stops resetting. `warn` through the 1.30.0 grace because it fires on what every
+    // consumer ships today (`PLUGIN_RULE_GRACE`).
+    pluginRules: ["forms-field-key"],
+    description: "Mantine form layer: useBasaltForm + inputProps/fieldKey (two calls \u2014 a spread `key` is a React 19 warning; the deprecated `field` alias for `inputProps` was removed in 1.29.0, C1 consolidation), the FormSection/FormRow/FormGroup/FormActions layout (FormRow is law C1\u2019s form row), useFormSubmit (submit state, decoded errors, server fieldErrors, focus-first-error, validateAsync), FormStateProvider disable propagation, useFieldArray, FormErrorSummary, useFormDraft with autosave (Standard Schema)",
     optionalPeers: ["@mantine/form"],
     forbiddenImports: []
   },
@@ -244,17 +260,6 @@ const SURFACES = {
     optionalPeers: ["@mantine/spotlight", "@mantine/modals", "@tanstack/react-hotkeys"],
     forbiddenImports: []
   },
-  "./data": {
-    kind: "doctrine",
-    layer: "mantine-coupled",
-    rule: "batteries",
-    skill: ["basalt-design"],
-    guardKinds: [],
-    pluginRules: [],
-    description: "Convenience barrel pulling both TanStack Table + Virtual peer groups: BasaltDataTable, BasaltVirtualList (Mantine-rendered) \u2014 prefer ./data/table or ./data/virtual for per-feature opt-in",
-    optionalPeers: ["@tanstack/react-table", "@tanstack/react-virtual"],
-    forbiddenImports: []
-  },
   "./data/table": {
     kind: "doctrine",
     layer: "mantine-coupled",
@@ -347,12 +352,15 @@ const SURFACES = {
     // window, since a regex scan has no ancestry. Same law, same wave, same promotion.
     guardKinds: ["raw-selection-control"],
     // The control tier itself (laws C1/C3/C5/C9). `hand-rolled-filter`, `control-size-literal` and
-    // `responsive-twin` all ship `error`; `control-outside-home` is the one grace entry left in
-    // `PLUGIN_RULE_GRACE`, re-dated to 1.28.0 against the wave-7 measurement (see its `why`).
-    // The budget rules live on `.` with `PageBar` itself.
+    // `responsive-twin` all ship `error`; the two C1 placement rules are the grace entries in
+    // `PLUGIN_RULE_GRACE`, both promoting at 1.30.0 — `control-outside-home` re-dated against the
+    // wave-7 measurement, `bound-control-outside-home` new since 1.28.0 (ASIDE-SPEC G5: the basalt
+    // half of C1, where a bound control in a section body rendered as a stray pill). The budget
+    // rules live on `.` with `PageBar` itself.
     pluginRules: [
       "hand-rolled-filter",
       "control-outside-home",
+      "bound-control-outside-home",
       "control-size-literal",
       "responsive-twin"
     ],
@@ -364,9 +372,26 @@ const SURFACES = {
       "C11 \u2014 a table/list stating its count when it is not a BasaltDataTable",
       "C12 \u2014 one shape for refresh/sync (SyncButton); only the alias table sees a renamed copy"
     ],
-    description: 'The control tier (docs/CONTROLS-SPEC.md \xA73): FilterSet (nowrap row + measured +N fold + the mobile Filters (n) sheet), RangeFilter/CompareFilter/SelectFilter/MultiSelectFilter/NumberFilter/SearchFilter/ToggleFilter (each bound to a FieldHandle \u2014 no value/onChange/size, law C2/C5; NumberFilter is the field.number lane, a radio list over `options` or a stepper without), ViewTabs, and the action/sync family (ActionGroup, OverflowMenu, SyncButton, BarAction/GlobalAction). Every control owns its own desktop/mobile swap in CSS (C9) and renders size="ctl" internally. Resolves and renders with NO @mantine/dates installed \u2014 the custom date picker is injected through RangeFilter.customPicker from ./controls-dates.',
+    description: 'The control tier (docs/CONTROLS-SPEC.md \xA73): FilterSet (nowrap row + measured +N fold + the mobile Filters (n) sheet), RangeFilter/CompareFilter/SelectFilter/MultiSelectFilter/NumberFilter/SearchFilter/ToggleFilter (each bound to a FieldHandle \u2014 no value/onChange/size, law C2/C5; NumberFilter is the field.number lane, a radio list over `options` or a stepper without), ViewTabs, and the action/sync family (ActionGroup, OverflowMenu, SyncButton, BarAction/GlobalAction). THREE surfaces, picked by the home and never by a prop (useFilterSurface): pill in a PageBar row, sheet in the mobile Filters (n) drawer, panel in a PageAside body \u2014 where every control renders an inspector/facet ROW instead of a chip (docs/ASIDE-SPEC.md \xA73). PanelRow is that row primitive (label above, hint, mono readout, an `end` control on the label line) and SliderControl is the one bound control with no pill form at all; the counts/max props on MultiSelectFilter render the Foundry facet list there. Every control owns its own desktop/mobile swap in CSS (C9) and renders size="ctl" internally. Resolves and renders with NO @mantine/dates installed \u2014 the custom date picker is injected through RangeFilter.customPicker from ./controls-dates.',
     optionalPeers: [],
-    forbiddenImports: []
+    // `@mantine/dates` is an optional peer basaltViteConfig pre-bundles the whole @mantine scope
+    // for — a consumer without the peer (linewatch) must never resolve it through this surface.
+    // Nothing under src/controls may import it, statically or lazily — repo-local only, same
+    // pattern as MANTINE_BANS above (a shipped ban would be redundant with peerDependenciesMeta).
+    globs: {
+      shipped: [],
+      repo: ["packages/basalt-ui/src/controls/**"]
+    },
+    forbiddenImports: [
+      v(
+        "@mantine/dates",
+        "@mantine/dates is an OPTIONAL peer (docs/CONTROLS-SPEC.md \xA73) \u2014 ./controls must resolve with no @mantine/dates installed. The one reach lives in src/controls-dates/, injected into range-filter.tsx\u2019s customPicker seam."
+      ),
+      vg(
+        "@mantine/dates/*",
+        "@mantine/dates is an OPTIONAL peer (docs/CONTROLS-SPEC.md \xA73) \u2014 ./controls must resolve with no @mantine/dates installed. The one reach lives in src/controls-dates/, injected into range-filter.tsx\u2019s customPicker seam."
+      )
+    ]
   },
   "./controls-dates": {
     kind: "doctrine",
@@ -390,25 +415,14 @@ const SURFACES = {
     optionalPeers: [],
     // Consumers import basalt-ui/state from node_modules (lint-ignored), so there is nothing to
     // enforce consumer-side, and a shipped **/state* glob would wrongly hit consumers' own
-    // Mantine-using state files. Enforce only basalt's own src/state.ts.
+    // Mantine-using state files. Enforce basalt's own barrel AND its implementation files.
     globs: {
       shipped: [],
-      repo: ["packages/basalt-ui/src/state.ts"]
+      repo: ["packages/basalt-ui/src/state.ts", "packages/basalt-ui/src/state/**"]
     },
     // @visx/* ban dropped — `basalt/visx-boundary` now bans it universally outside charts.
     forbiddenImports: [...MANTINE_BANS]
   },
-  "./connectivity": {
-    kind: "doctrine",
-    layer: "mantine-coupled",
-    rule: "mantine",
-    skill: ["basalt-app"],
-    guardKinds: [],
-    pluginRules: [],
-    description: "ConnectivityProvider (aggregates browser online/offline, React Query onlineManager, SSE, and health-check pings into one status), useConnectivity, and ConnectivityIndicator \u2014 auto-mounted by BasaltProvider",
-    optionalPeers: [],
-    forbiddenImports: []
-  },
   // ── Non-JS published assets (ToolingSpec; not JS subpaths — check-coverage exempts these) ─────
   "./styles.css": {
     kind: "tooling",
@@ -442,7 +456,10 @@ const SURFACES = {
     rule: "batteries",
     skill: ["basalt-app"],
     guardKinds: [],
-    pluginRules: [],
+    // query-dual-import / query-fn-unwrap: reassigned here from the now-dropped `./query` surface
+    // (C1 consolidation — createBasaltQueryClient/unwrap/BasaltQueryDevtools are root barrel
+    // exports now, but their doctrine stays `batteries` — "use the shipped thing" — not `mantine`).
+    pluginRules: ["query-dual-import", "query-fn-unwrap"],
     globs: {
       // Shipped is a catch-all (not just src/**+app/**) so consumer code under components/, lib/,
       // features/, etc. is also covered. The @visx/*-only-in-charts and Mantine-free charts/tokens

package/dist/theme/ctl-theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ctl-theme.d.ts","sourceRoot":"","sources":["../../src/theme/ctl-theme.tsx"],"names":[],"mappings":"AA+CA,OAAO,KAAK,EAAe,oBAAoB,EAAE,MAAM,eAAe,CAAA;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC;;iGAEiG;AACjG,eAAO,MAAM,SAAS,EAAE,oBAyBvB,CAAA;AA0BD,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,SAAS,CAAA;IACnB;;;;;;;;;;;;OAYG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;CACxB,CAAA;AAED;;;;;;GAMG;AACH,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,IAAY,EAAE,EAAE,YAAY,GAAG,SAAS,CAQ3E"}
+{"version":3,"file":"ctl-theme.d.ts","sourceRoot":"","sources":["../../src/theme/ctl-theme.tsx"],"names":[],"mappings":"AA+CA,OAAO,KAAK,EAAe,oBAAoB,EAAE,MAAM,eAAe,CAAA;AACtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC;;iGAEiG;AACjG,eAAO,MAAM,SAAS,EAAE,oBAyBvB,CAAA;AAoCD,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,SAAS,CAAA;IACnB;;;;;;;;;;;;OAYG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAA;CACxB,CAAA;AAED;;;;;;GAMG;AACH,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,IAAY,EAAE,EAAE,YAAY,GAAG,SAAS,CAQ3E"}

package/dist/theme/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AA+DA,OAAO,KAAK,EACV,oBAAoB,EAGpB,oBAAoB,EAErB,MAAM,eAAe,CAAA;AAStB,OAAO,KAAK,EAAe,YAAY,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAEpD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAOlD;;;;;GAKG;AACH,YAAY,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAIlD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAIvD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAA;AASnE,OAAO,QAAQ,eAAe,CAAC;IAC7B,UAAU,iBAAiB;QACzB,YAAY,CAAC,EAAE,YAAY,CAAA;QAC3B,WAAW,CAAC,EAAE,iBAAiB,CAAA;QAC/B,YAAY,CAAC,EAAE,YAAY,CAAA;QAC3B,aAAa,CAAC,EAAE,WAAW,CAAA;KAC5B;CACF;AA26BD;+EAC+E;AAC/E,eAAO,MAAM,SAAS,EAAE,oBAAuD,CAAA;AAyR/E;;8FAE8F;AAC9F,eAAO,MAAM,oBAAoB,EAAE,oBACc,CAAA;AAEjD,kEAAkE;AAClE,MAAM,MAAM,wBAAwB,GAAG;IACrC;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAE9B;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAA;IAEzB;;;;;;;;;;;;;;;;OAgBG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAYD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,iBAAiB,CAC/B,SAAS,CAAC,EAAE,oBAAoB,EAChC,OAAO,CAAC,EAAE,wBAAwB,GACjC,oBAAoB,CA+BtB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AAgEA,OAAO,KAAK,EACV,oBAAoB,EAGpB,oBAAoB,EAErB,MAAM,eAAe,CAAA;AAStB,OAAO,KAAK,EAAe,YAAY,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAEpD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAOlD;;;;;GAKG;AACH,YAAY,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAIlD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAIvD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAA;AAgBnE,OAAO,QAAQ,eAAe,CAAC;IAC7B,UAAU,iBAAiB;QACzB,YAAY,CAAC,EAAE,YAAY,CAAA;QAC3B,WAAW,CAAC,EAAE,iBAAiB,CAAA;QAC/B,YAAY,CAAC,EAAE,YAAY,CAAA;QAC3B,aAAa,CAAC,EAAE,WAAW,CAAA;KAC5B;CACF;AA2/BD;+EAC+E;AAC/E,eAAO,MAAM,SAAS,EAAE,oBAAuD,CAAA;AAyT/E;;8FAE8F;AAC9F,eAAO,MAAM,oBAAoB,EAAE,oBACc,CAAA;AAEjD,kEAAkE;AAClE,MAAM,MAAM,wBAAwB,GAAG;IACrC;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAE9B;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAA;IAEzB;;;;;;;;;;;;;;;;OAgBG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAYD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,iBAAiB,CAC/B,SAAS,CAAC,EAAE,oBAAoB,EAChC,OAAO,CAAC,EAAE,wBAAwB,GACjC,oBAAoB,CA+BtB"}

package/dist/theme/index.js

@@ -2,6 +2,7 @@ import {
   Accordion,
   ActionIcon,
   Alert,
+  AppShell,
   Badge,
   Breadcrumbs,
   Button,
@@ -299,6 +300,18 @@ function buildTheme(data, options = {}) {
           }
         }
       }),
+      // Region seams (docs/DESIGN-SPEC.md §5, §8 #12): the ONE lever for every AppShell edge —
+      // Mantine declares `--app-shell-border-color` on the shell element per scheme, which beats
+      // an inherited `:root` value, so a theme-level `vars` override (merged into the root's
+      // inline style) wins. Sections keep their default `withBorder: true`; the color is this.
+      // `styles` would also land on the same root style attribute, just through Mantine's own
+      // `[key: string]: any` index rather than a typed field.
+      // Cast: `AppShellCssVariables` declares only `--app-shell-transition-duration` /
+      // `-timing-function`, yet Mantine's OWN AppShell.css sets `--app-shell-border-color` on the
+      // same root.
+      AppShell: AppShell.extend({
+        vars: () => ({ root: { "--app-shell-border-color": "var(--vx-divider)" } })
+      }),
       // "Ink earns its color" — a nav selection is UI state, not the identity accent on the LABEL.
       // The active item is a SELECTED ROW, not a raised control: the same ink-tint idiom as the
       // hover state (one step stronger, ink-9%), no panel fill and no `shadow-card` — a raised,
@@ -475,13 +488,32 @@ function buildTheme(data, options = {}) {
       Chip: Chip.extend({
         classNames: (_theme, props) => (props.variant ?? "filled") === "filled" ? { label: controlsClasses.chipLabel } : {}
       }),
-      // Track = ink-6% tint, radius 7, 2px padding; active segment = panel bg + `shadow-ctrl`,
-      // radius 5. `--sc-radius`/`--sc-color` don't reach the root track background (Mantine
-      // hardcodes that to a raw gray step), so it's forced via `styles.root` same as Card/Paper.
-      // The active-only ink label color + weight can't live in the flat `styles.label` object
-      // (applies to every option regardless of state), so it's in segmented-control.module.css
+      // Track = ink-6% tint, radius 7, 2px padding; active segment = an ink-mixed panel fill +
+      // `shadow-ctrl`, radius 5. `--sc-radius`/`--sc-color` don't reach the root track background
+      // (Mantine hardcodes that to a raw gray step), so it's forced via `styles.root` same as
+      // Card/Paper. The active-only ink label color + weight can't live in the flat `styles.label`
+      // object (applies to every option regardless of state), so it's in segmented-control.module.css
       // instead — same pattern as NavLink's active-icon accent.
       //
+      // The indicator's fill is `color-mix(in srgb, var(--vx-ink) 12%, var(--vx-surface-panel))`,
+      // not a flat `--vx-surface-panel` — a flat panel fill is indistinguishable from the track's
+      // OWN parent on the one surface that IS `--vx-surface-panel` (the aside's `panel` filter
+      // surface, `docs/CONTROLS-SPEC.md` §3): the track (ink-6% over panel) and the indicator (panel,
+      // flat) then differ by 6% ink with no other cue, and `shadow-ctrl` alone (a bare
+      // `0 1px 2px` drop, no ring) reads as "barely there". This is NOT the `raised`-token doctrine
+      // in `tokens/palette.ts` (`SHADOW.raised`'s "a default control nested in a Card has no boundary
+      // but the drop — raise the drop, do not reintroduce an edge") — that doctrine is scoped to the
+      // shared Button/ActionIcon/Input depth token, whose fill is a real surface color a border would
+      // outline. The indicator's own fill has no such constraint, so a second ink-mix step (12%, double
+      // the track's) is the fix: it holds up on every surface the control mounts on, not only the
+      // panel-nested one.
+      //
+      // `.control`'s `min-width: 0` (`segmented-control.module.css`) is the other half of an even
+      // `fullWidth` split — Mantine's own `.control` ships `flex: 1` with no `min-width` override, so
+      // the initial `auto` floors every option at its min-content width and a `fullWidth` track splits
+      // UNEVENLY. The label already carries `overflow: hidden` + `text-overflow: ellipsis`, so a
+      // label that no longer fits its equal share truncates instead of forcing the column wide.
+      //
       // The track's padding is `SPACE_FIXED.segmentedTrackInset`, a plain literal — NOT a
       // `--vx-space-*` var — because it is density-EXEMPT: it is load-bearing for the nested-corner
       // law (`RADIUS.card === RADIUS_STEP.tight + segmentedTrackInset`, see that constant's doc in
@@ -490,7 +522,10 @@ function buildTheme(data, options = {}) {
       // density.
       SegmentedControl: SegmentedControl.extend({
         defaultProps: { radius: radius.card },
-        classNames: { label: segmentedControlClasses.label },
+        classNames: {
+          label: segmentedControlClasses.label,
+          control: segmentedControlClasses.control
+        },
         // `label` gets a `ctl`-only min-height (function-form `styles`, same `props.size === …` gate
         // as Button/ActionIcon/Input's `vars` overrides above) so a `size="ctl"` SegmentedControl
         // matches the ctl Button/Input box exactly instead of following its own fixed padding — see
@@ -499,21 +534,57 @@ function buildTheme(data, options = {}) {
         styles: (_theme, props) => ({
           root: {
             backgroundColor: "color-mix(in srgb, var(--vx-ink) 6%, transparent)",
-            padding: `${SPACE_FIXED.segmentedTrackInset}px`
+            padding: `${SPACE_FIXED.segmentedTrackInset}px`,
+            // The OUTER safety net a `.control`'s own `min-width: 0` (`segmented-control.module.css`)
+            // cannot provide by itself: that rule only lets each SEGMENT shrink below its own label's
+            // content width so `fullWidth` can split evenly — it does nothing to stop the WHOLE TRACK
+            // from being squeezed by an ANCESTOR flex row with room to spare (a `Section`/`StatCard`
+            // header's `actions` slot), which silently clipped "Absolute" to "Absolut" with no
+            // ellipsis at all. `min-width: max-content` pins the root to the sum of its labels'
+            // natural widths — it now OVERFLOWS a too-narrow ancestor instead of shrinking into it,
+            // which is also what makes the overflow MEASURABLE (`panel-row.tsx`'s `useTrackFits`
+            // compares the root's rendered width against its parent's available space). Inside that
+            // floor, `fullWidth` with room to spare still splits its segments evenly exactly as
+            // before — the floor only ever raises the STARTING point flex-grow distributes surplus
+            // from, never removes the segments' own equal-share arithmetic.
+            minWidth: "max-content"
           },
           indicator: {
-            backgroundColor: "var(--vx-surface-panel)",
+            backgroundColor: "color-mix(in srgb, var(--vx-ink) 12%, var(--vx-surface-panel))",
             boxShadow: "var(--vx-shadow-ctrl)",
             borderRadius: "var(--vx-radius-tight)"
           },
           // Conditionally spread the WHOLE key (never a present `label: undefined`) — the package
           // builds under `exactOptionalPropertyTypes`, which treats a key present-but-`undefined` as
           // a type error distinct from the key being absent.
+          //
+          // `width: '100%'` + `minWidth: 0` are load-bearing, not cosmetic: `inline-flex` is a
+          // shrink-to-fit box by default (like `inline-block`), so switching `.label` to it for
+          // vertical centering ALSO switched its width from "fills `.control`'s box" (a plain
+          // `display: block`'s default) to "sized to its own content" — which is invisible until
+          // `fullWidth` forces every `.control` to an EQUAL share (`segmented-control.module.css`'s
+          // `min-width: 0`): a label wider than that equal share then rendered at its own full
+          // content width, overflowing its column and getting hard-clipped by the track's own
+          // `overflow: hidden` instead of ellipsizing inside it ("Same period last year" cut off
+          // mid-word). `width: 100%` makes the inline-flex box fill `.control` again, and `minWidth:
+          // 0` is the same flex-item footgun `.control` itself needed — `.label` is ALSO a flex
+          // container's item once `fullWidth`'s `.root { display: flex }` applies, so it inherits an
+          // `auto` (content-based) minimum unless told otherwise.
           ...props.size === "ctl" ? {
             label: {
               display: "inline-flex",
               alignItems: "center",
-              minHeight: `calc(var(--vx-space-control-height-ctl) * var(--mantine-scale) - ${2 * SPACE_FIXED.segmentedTrackInset}px)`
+              minHeight: `calc(var(--vx-space-control-height-ctl) * var(--mantine-scale) - ${2 * SPACE_FIXED.segmentedTrackInset}px)`,
+              // `width: '100%'` only when `fullWidth` — it is what makes an EQUAL-SPLIT
+              // segment's label fill its column instead of shrink-to-fit around its own text
+              // (the "Same period last year" clipped-with-no-ellipsis case). A NON-`fullWidth`
+              // track (a header's `actions` slot, two or three options) wants the opposite: its
+              // label sized to its OWN content, so the root's `min-width: max-content` (below)
+              // measures the label's true natural width rather than an equal 1/2 or 1/3 share
+              // computed through `.control`'s `flex-basis: 0%` — forcing `width: 100%` there
+              // too under-computed the shrink-to-fit root by a few px ("Absolute" clipped to
+              // "Absolut" even with the floor in place).
+              ...props.fullWidth === true ? { width: "100%", minWidth: 0 } : {}
             }
           } : {}
         })
@@ -635,9 +706,13 @@ function buildTheme(data, options = {}) {
           }
         }
       }),
-      // Modal/Drawer: overlay surface + overlay shadow on the content. The header goes transparent —
-      // Mantine paints it `--mantine-color-body`, which read as a grey band over the overlay
-      // surface. Title = head font; close button = the ghost idiom (floating.module.css).
+      // Modal/Drawer: overlay surface + overlay shadow on the content, the SAME surface on the
+      // header. Mantine's header is `position: sticky` by default, painted `--mantine-color-body` —
+      // basalt used to drop that to `transparent`, which reads fine over a body that never scrolls
+      // under it but shows every scrolled row straight through the title once one does (the mobile
+      // filter sheet, the shell's "More" nav sheet). The header stays sticky; only its own
+      // background moves back to opaque, matching the content box it sits above rather than the page
+      // behind it. Title = head font; close button = the ghost idiom (floating.module.css).
       Modal: Modal.extend({
         defaultProps: { radius: radius.floating },
         classNames: { close: floatingClasses.closeButton },
@@ -646,7 +721,7 @@ function buildTheme(data, options = {}) {
             backgroundColor: "var(--vx-surface-overlay)",
             boxShadow: "var(--vx-shadow-overlay)"
           },
-          header: { backgroundColor: "transparent" },
+          header: { backgroundColor: "var(--vx-surface-overlay)" },
           title: {
             fontFamily: "var(--basalt-font-head)",
             fontWeight: 550,
@@ -661,7 +736,7 @@ function buildTheme(data, options = {}) {
             backgroundColor: "var(--vx-surface-overlay)",
             boxShadow: "var(--vx-shadow-overlay)"
           },
-          header: { backgroundColor: "transparent" },
+          header: { backgroundColor: "var(--vx-surface-overlay)" },
           title: {
             fontFamily: "var(--basalt-font-head)",
             fontWeight: 550,
@@ -812,6 +887,8 @@ const CTL_PADDING_X = 10;
 const CTL_INPUT_PADDING_Y = 4;
 const CTL_SEGMENT_PADDING_Y = 2.5;
 const CTL_CHEVRON_SIZE = 14;
+const CTL_NUMBER_CHEVRON_SIZE = 10;
+const CTL_NUMBER_RIGHT_SECTION_WIDTH = 17;
 const CTL_TOGGLE_SIZE = 16;
 const CTL_RADIO_DOT_SIZE = CTL_TOGGLE_SIZE * 0.4;
 const CTL_SWITCH_HEIGHT = 18;
@@ -819,6 +896,7 @@ const CTL_SWITCH_WIDTH = 30;
 const CTL_SWITCH_THUMB_SIZE = 12;
 const CTL_SWITCH_TRACK_LABEL_SIZE = 5;
 const CTL_SWITCH_TRACK_LABEL_PADDING = 2;
+const CTL_SLIDER_TRACK_SIZE = 6;
 function ctlSizeVars() {
   const ctlHeight = "calc(var(--vx-space-control-height-ctl) * var(--mantine-scale))";
   return {
@@ -835,6 +913,8 @@ function ctlSizeVars() {
     "--sc-padding-ctl": `${pxRem(CTL_SEGMENT_PADDING_Y)} calc(${pxRem(CTL_PADDING_X)} * var(--mantine-scale))`,
     "--combobox-option-padding-ctl": `${pxRem(CTL_SEGMENT_PADDING_Y)} ${pxRem(CTL_PADDING_X)}`,
     "--combobox-chevron-size-ctl": pxRem(CTL_CHEVRON_SIZE),
+    "--ni-chevron-size-ctl": pxRem(CTL_NUMBER_CHEVRON_SIZE),
+    "--ni-right-section-width-ctl": `calc(${pxRem(CTL_NUMBER_RIGHT_SECTION_WIDTH)} * var(--mantine-scale))`,
     "--badge-height-ctl": ctlHeight,
     "--badge-padding-x-ctl": `calc(${pxRem(CTL_PADDING_X)} * var(--mantine-scale))`,
     "--badge-fz-ctl": `calc(${pxRem(VX.text.xs)} * var(--mantine-scale))`,
@@ -855,7 +935,11 @@ function ctlSizeVars() {
     "--switch-width-ctl": `calc(${pxRem(CTL_SWITCH_WIDTH)} * var(--mantine-scale))`,
     "--switch-thumb-size-ctl": `calc(${pxRem(CTL_SWITCH_THUMB_SIZE)} * var(--mantine-scale))`,
     "--switch-label-font-size-ctl": pxRem(CTL_SWITCH_TRACK_LABEL_SIZE),
-    "--switch-track-label-padding-ctl": pxRem(CTL_SWITCH_TRACK_LABEL_PADDING)
+    "--switch-track-label-padding-ctl": pxRem(CTL_SWITCH_TRACK_LABEL_PADDING),
+    // Slider — the inspector row's control (`SliderControl`, `docs/ASIDE-SPEC.md` §1). One prefix
+    // only: `slider-size` is the track, and every other dimension (the thumb, the root's inline
+    // padding, the vertical hit box) is derived from it in `Slider.css`.
+    "--slider-size-ctl": `calc(${pxRem(CTL_SLIDER_TRACK_SIZE)} * var(--mantine-scale))`
   };
 }
 function buildCssVariablesResolver(data) {
@@ -885,7 +969,8 @@ function buildCssVariablesResolver(data) {
       // secondary / muted text
       "--mantine-color-text": `var(--vx-ink, ${INK.ink.light})`,
       // primary body/heading text
-      "--app-shell-border-color": `var(--vx-surface-border, ${SURFACE.border.light})`,
+      // `--app-shell-border-color` is set by `components.AppShell.extend({ vars })` above — this
+      // entry was dead (an element-level declaration always beats an inherited `:root` value).
       // THE strict-surface lever. Mantine components do NOT chain border/surface colors through
       // `--mantine-color-default-*`; each hardcodes a RAW ramp step (`--mantine-color-gray-{2,3,4}`
       // on light) directly — which is why AppShell/Table/Input/Divider/Tabs/Popover/Accordion borders
@@ -912,7 +997,7 @@ function buildCssVariablesResolver(data) {
       "--mantine-color-default-border": "transparent",
       "--mantine-color-dimmed": `var(--vx-neutral, ${NEUTRAL.neutral.dark})`,
       "--mantine-color-text": `var(--vx-ink, ${INK.ink.dark})`,
-      "--app-shell-border-color": `var(--vx-surface-border, ${SURFACE.border.dark})`,
+      // See the light block above — `--app-shell-border-color` is set by `AppShell.extend` now.
       // Dark components read `--mantine-color-dark-4` (border) raw. `buildDarkTuple` already sets
       // dark-4, but to a slightly lighter step than the hairline token, so layout borders read
       // marginally heavier than card borders. Pin dark-4 to the SAME "line" token for parity.

package/dist/theme/nav-link.module.css

@@ -1,60 +1,71 @@
 /*
- * Active nav row = heavier weight over the ink tint `--nl-bg` carries (set in theme/index.ts,
- * applied unconditionally by Mantine's own `[data-active]` CSS). NO depth: an active row is a
- * SELECTED ROW, not a raised control — it deliberately reads as a stronger version of the hover
- * tint rather than as a button, so the row never competes with the real filled controls around it.
+ * Active nav row = an ACCENT-tinted fill plus heavier weight, so the row reads unambiguously as
+ * SELECTED rather than merely hovered (docs/DESIGN-SPEC.md §5). The fill was previously the ink
+ * tint `--nl-bg` carries (theme/index.ts) at 9% — visually indistinguishable from the 6% ink hover
+ * tint on a dark surface, which is what let a hovered row read as a second active item. NO depth:
+ * an active row is a SELECTED ROW, not a raised control.
+ *
+ * `[data-active]` is the ONLY style hook here — `use-nav.ts` already resolves exactly one winner
+ * per route and stamps `data-active` on it, so keying these selectors on `aria-current="page"` too
+ * only risked a second, looser router-native match repainting a row basalt's own model disagreed
+ * with. `aria-current` stays on the DOM (React Router/TanStack Router set it) for a11y; it is just
+ * not a CSS hook.
  *
  * Applied at the THEME level via `classNames` so it reaches EVERY NavLink render path — including a
- * consumer's router `<Link>` mounted through `SidebarItem.Anchor`, which a shell-scoped CSS
- * module never
- * sees. Mantine's `styles` prop only takes flat inline properties (a nested `&[data-active]` there
- * throws a React warning), so the state selectors live here. React Router's NavLink marks the
- * active item via `aria-current` rather than the `active` prop's `data-active`, so both states are
- * matched.
+ * consumer's router `<Link>` mounted through `SidebarItem.Anchor`, which a shell-scoped CSS module
+ * never sees. Mantine's `styles` prop only takes flat inline properties (a nested `&[data-active]`
+ * there throws a React warning), so the state selectors live here.
  */
-.root[data-active],
-.root[aria-current='page'] {
+.root[data-active] {
+  background-color: color-mix(in srgb, var(--vx-accent) 12%, transparent);
   font-weight: 600;
 }
 
+/* Active + hover — one step stronger than the resting active fill, so a pointer over the active row
+ * still reads as feedback rather than as a flat, unresponsive selection. */
+@media (hover: hover) {
+  .root[data-active]:hover {
+    background-color: color-mix(in srgb, var(--vx-accent) 16%, transparent);
+  }
+}
+
 /*
  * Active-icon accent: only the leftSection (the icon, `data-position="left"`) turns accent-colored
  * — the label stays ink (via `--nl-color`). Targets Mantine's own `data-position` attribute rather
  * than a custom class, so the rightSection (child-expand chevron) is untouched.
  */
-.root[data-active] [data-position='left'],
-.root[aria-current='page'] [data-position='left'] {
+.root[data-active] [data-position='left'] {
   color: var(--vx-accent);
 }
 
 /*
  * Inactive rows: muted text, faint icon (docs/DESIGN-SPEC.md §5 Sidebar — "inactive = muted text,
  * faint icon"). Mantine's own NavLink.css never sets a color on the base rule — it only colors the
- * label under `[data-active]`/`[aria-current='page']` — so an inactive row otherwise falls through
- * to the ambient `--mantine-color-text` (ink), same reasoning as the active-icon rule above.
+ * label under `[data-active]` — so an inactive row otherwise falls through to the ambient
+ * `--mantine-color-text` (ink), same reasoning as the active-icon rule above.
  */
-.root:not([data-active]):not([aria-current='page']) {
+.root:not([data-active]) {
   color: var(--vx-muted);
 }
 
-.root:not([data-active]):not([aria-current='page']) [data-position='left'] {
+.root:not([data-active]) [data-position='left'] {
   color: var(--vx-faint);
 }
 
 /*
- * Inactive hover — the ink-6% ghost tint + ink text/icon (docs/DESIGN-SPEC.md §5). Lives here (not
- * only in the shell module) so a consumer's `SidebarItem.Anchor` path gets the same hover;
- * Mantine's own
- * hover fill uses `:where(scheme) .m_*:hover` (gray-0/dark-6), which this outranks on specificity.
- * Active rows keep their panel fill + `--nl-hover` untouched.
+ * Inactive hover — the ink-5% ghost tint + ink text/icon (docs/DESIGN-SPEC.md §5; dropped from 6%
+ * so it reads clearly below the active row's 12% accent fill instead of nearly matching its old 9%
+ * ink fill). Lives here (not only in the shell module) so a consumer's `SidebarItem.Anchor` path
+ * gets the same hover; Mantine's own hover fill uses `:where(scheme) .m_*:hover` (gray-0/dark-6),
+ * which this outranks on specificity. Active rows keep their accent fill above, untouched here.
  */
 @media (hover: hover) {
-  .root:not([data-active]):not([aria-current='page']):hover {
-    background-color: color-mix(in srgb, var(--vx-ink) 6%, transparent);
+  .root:not([data-active]):hover {
+    background-color: color-mix(in srgb, var(--vx-ink) 5%, transparent);
     color: var(--vx-ink);
   }
 
-  .root:not([data-active]):not([aria-current='page']):hover [data-position='left'] {
+  .root:not([data-active]):hover [data-position='left'] {
     color: var(--vx-ink);
   }
 }