@12-apps/ui 6.51.0 → 6.52.0

package/dist/types/components/navigation/SectionNav/SectionNav.rail.d.ts

@@ -1,8 +1,9 @@
 import type { ElementType } from 'react';
 import type { SectionNavProps } from './SectionNav.types';
 /**
- * The wide-screen layout: a vertical rail — the way back, the destinations,
- * then every menu's entries.
+ * The wide-screen layout: a vertical rail — the way back, the heading, a
+ * `primary` menu as one button that opens it (FUT-3015), the destinations, a
+ * `primary` action as a row, then `more` listed in full.
  *
  * It fills the column the host gives it and scrolls on its own, like the
  * sidebar it stands in for.

package/dist/types/components/navigation/SectionNav/SectionNav.rail.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SectionNav.rail.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/SectionNav/SectionNav.rail.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAa,MAAM,OAAO,CAAC;AAgBpD,OAAO,KAAK,EAKV,eAAe,EAChB,MAAM,oBAAoB,CAAC;AA+O5B;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,YAAY,EACZ,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,aAAa,EACb,IAAI,EACJ,UAAU,GACX,EAAE,QAAQ,CAAC,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,cAAc,GAAG,MAAM,GAAG,YAAY,CAAC,CAAC,GAClF,IAAI,CAAC,eAAe,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,GAAG;IAC/D,aAAa,EAAE,WAAW,GAAG,SAAS,CAAC;CACxC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAqCtB"}
+{"version":3,"file":"SectionNav.rail.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/SectionNav/SectionNav.rail.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAa,MAAM,OAAO,CAAC;AAiBpD,OAAO,KAAK,EAKV,eAAe,EAChB,MAAM,oBAAoB,CAAC;AAgP5B;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,YAAY,EACZ,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,aAAa,EACb,IAAI,EACJ,UAAU,GACX,EAAE,QAAQ,CAAC,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,cAAc,GAAG,MAAM,GAAG,YAAY,CAAC,CAAC,GAClF,IAAI,CAAC,eAAe,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,GAAG;IAC/D,aAAa,EAAE,WAAW,GAAG,SAAS,CAAC;CACxC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAqCtB"}

package/dist/types/components/navigation/SectionNav/SectionNav.railCreate.d.ts

@@ -0,0 +1,24 @@
+import { type ElementType } from 'react';
+import type { SectionNavCopy } from '../../../copy';
+import type { SectionNavMenu } from './SectionNav.types';
+/**
+ * A rail's `primary` menu as ONE button at the top of the rail, opening an
+ * anchored menu of its groups (FUT-3015).
+ *
+ * The rail lists `more` in full, but a create menu listed that way costs a
+ * heading and a two-line row per entry above the fold, for acts a person takes
+ * once in a while. Folded behind '+ Criar' it costs one row. The button
+ * carries the menu's `label`; the open menu is named by its `title`.
+ *
+ * `MenuList` skips the group subheaders when the keyboard moves, and the
+ * popover hands focus back to the button when it closes on Escape or an
+ * outside click. Choosing an entry closes it too, and the entry's link or act
+ * takes over.
+ */
+export declare function RailCreateMenu({ menu, linkComponent, copy, testId, }: {
+    menu: SectionNavMenu;
+    linkComponent: ElementType | undefined;
+    copy: SectionNavCopy;
+    testId: string;
+}): React.JSX.Element;
+//# sourceMappingURL=SectionNav.railCreate.d.ts.map

package/dist/types/components/navigation/SectionNav/SectionNav.railCreate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionNav.railCreate.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/SectionNav/SectionNav.railCreate.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAmB,KAAK,WAAW,EAAkB,MAAM,OAAO,CAAC;AAE1E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAIpD,OAAO,KAAK,EAAmB,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAmD1E;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,aAAa,EACb,IAAI,EACJ,MAAM,GACP,EAAE;IACD,IAAI,EAAE,cAAc,CAAC;IACrB,aAAa,EAAE,WAAW,GAAG,SAAS,CAAC;IACvC,IAAI,EAAE,cAAc,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA2DpB"}

package/dist/types/components/navigation/SectionNav/SectionNav.types.d.ts

@@ -98,9 +98,9 @@ export interface SectionNavGroup {
 /**
  * A menu the nav opens: the centred primary action, or the "more" slot.
  *
- * On a phone it opens as a bottom sheet over the page. In the rail there is
- * room for everything, so its groups are listed under `title` instead of
- * hiding behind a trigger.
+ * On a phone it opens as a bottom sheet over the page. In the rail, `more`
+ * is listed under `title`, and `primary` is one button at the top that opens
+ * its groups as an anchored menu named by `title` (FUT-3015).
  */
 export interface SectionNavMenu {
     /** The trigger's accessible name, and the visible label of the "more" slot. */
@@ -147,8 +147,9 @@ export interface SectionNavProps {
      * `bar` — a bottom tab bar for a phone: the destinations, `more` as the last
      * slot, and `primary` as a raised button in the middle.
      *
-     * `rail` — a vertical list for a wide screen, with `back` and `heading` on
-     * top and every menu's entries listed rather than folded away.
+     * `rail` — a vertical list for a wide screen: `back` and `heading` on top,
+     * a `primary` menu as one button that opens it, the destinations, and
+     * `more`'s entries listed.
      */
     layout: 'bar' | 'rail';
     /** The navigation landmark's accessible name. */

package/dist/types/components/navigation/SectionNav/SectionNav.types.d.ts.map

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

package/dist/types/tokens/density.d.ts

@@ -22,9 +22,15 @@ declare module '@mui/material/styles' {
  * The theme's resolved density — a plain theme read, not a step-shifting
  * resolver (`size` stays hierarchy; see `./density.core.ts`). A `styleOverrides`
  * callback already gets `{ theme }` and can read `theme.density` directly;
- * this is for a component that needs the level in its own render logic
- * (`Table`/`DataGrid`/`DataViews` each read it once to source their own
- * `density` prop's default).
+ * this is for a component that needs the level in its own render logic.
+ *
+ * No table component sources its own discrete density from this any more
+ * (FUT-2886, reverting FUT-2769's half of it for `Table`, `DataViews` AND
+ * `DataGrid`): a theme density scales a table's row geometry exactly once,
+ * through `rem()`, rather than also re-picking a discrete `density` from the
+ * theme on top of it — see `resolveTableDensity` (`Table.helpers.ts`),
+ * `DEFAULT_DENSITY` (`data-views-layout-context.tsx`), and `DataGrid.model.ts`'s
+ * `useDataGridModel` (`props.density ?? 'comfortable'`).
  *
  * Falls back to `resolveDensityFactor()` (`'normal'`, factor `1`) for a bare
  * MUI theme built without `createUiTheme`/`muiThemeOptionsFrom`.

package/dist/types/tokens/density.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"density.d.ts","sourceRoot":"","sources":["../../../src/tokens/density.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAElE,OAAO,EAKL,KAAK,YAAY,EACjB,KAAK,eAAe,EACrB,MAAM,gBAAgB,CAAC;AAgBxB;;;;;;GAMG;AAEH,OAAO,EACL,eAAe,EACf,cAAc,EACd,kBAAkB,EAClB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,KAAK,YAAY,EACjB,KAAK,eAAe,GACrB,MAAM,gBAAgB,CAAC;AAExB,OAAO,QAAQ,sBAAsB,CAAC;IACpC,UAAU,KAAK;QACb,iFAAiF;QACjF,OAAO,CAAC,EAAE,eAAe,CAAC;KAC3B;IACD,UAAU,YAAY;QACpB,iFAAiF;QACjF,OAAO,CAAC,EAAE,eAAe,CAAC;KAC3B;CACF;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,IAAI,eAAe,CAE5C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,YAAY,GAAG,MAAM,EAC9B,OAAO,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,EAC/C,WAAW,GAAE,MAA6B,GACzC,IAAI,CAAC,YAAY,EAAE,YAAY,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,GAAG,YAAY,CAAC,CA2B7F"}
+{"version":3,"file":"density.d.ts","sourceRoot":"","sources":["../../../src/tokens/density.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAElE,OAAO,EAKL,KAAK,YAAY,EACjB,KAAK,eAAe,EACrB,MAAM,gBAAgB,CAAC;AAgBxB;;;;;;GAMG;AAEH,OAAO,EACL,eAAe,EACf,cAAc,EACd,kBAAkB,EAClB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,KAAK,YAAY,EACjB,KAAK,eAAe,GACrB,MAAM,gBAAgB,CAAC;AAExB,OAAO,QAAQ,sBAAsB,CAAC;IACpC,UAAU,KAAK;QACb,iFAAiF;QACjF,OAAO,CAAC,EAAE,eAAe,CAAC;KAC3B;IACD,UAAU,YAAY;QACpB,iFAAiF;QACjF,OAAO,CAAC,EAAE,eAAe,CAAC;KAC3B;CACF;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,UAAU,IAAI,eAAe,CAE5C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AACH,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,YAAY,GAAG,MAAM,EAC9B,OAAO,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,EAC/C,WAAW,GAAE,MAA6B,GACzC,IAAI,CAAC,YAAY,EAAE,YAAY,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,GAAG,YAAY,CAAC,CA2B7F"}

package/dist/typography/Heading.js

@@ -1,18 +1,18 @@
 import "../chunk-6GP2DOOO.js";
 import {
   Heading
-} from "../chunk-C4QKXFZN.js";
-import "../chunk-WF4XK5AS.js";
-import "../chunk-M2GVHVE4.js";
+} from "../chunk-X66E5WSX.js";
+import "../chunk-IWGW2E35.js";
+import "../chunk-CJ45OL7L.js";
 import "../chunk-TYJR4GOF.js";
 import "../chunk-PT6TCWIW.js";
-import "../chunk-6WZUZHJM.js";
+import "../chunk-YFODI4KT.js";
+import "../chunk-VBP46YP4.js";
 import "../chunk-2BYKTBDL.js";
 import "../chunk-AG66JBNH.js";
 import "../chunk-FZXKH2ZT.js";
-import "../chunk-VBP46YP4.js";
-import "../chunk-O6MJWHU5.js";
 import "../chunk-26X4CZVR.js";
+import "../chunk-O6MJWHU5.js";
 import "../chunk-FQ6UW7IY.js";
 import "../chunk-6JAIFIPW.js";
 import "../chunk-N3GAFIXG.js";

package/dist/typography/Text.js

@@ -1,16 +1,16 @@
 import "../chunk-VUHLNYAE.js";
 import {
   Text
-} from "../chunk-YZHX2HTC.js";
-import "../chunk-6IWO7CM2.js";
+} from "../chunk-MKLIMY3D.js";
+import "../chunk-PAT2BQOQ.js";
 import "../chunk-TYJR4GOF.js";
-import "../chunk-6WZUZHJM.js";
+import "../chunk-YFODI4KT.js";
+import "../chunk-VBP46YP4.js";
 import "../chunk-2BYKTBDL.js";
 import "../chunk-AG66JBNH.js";
 import "../chunk-FZXKH2ZT.js";
-import "../chunk-VBP46YP4.js";
-import "../chunk-O6MJWHU5.js";
 import "../chunk-26X4CZVR.js";
+import "../chunk-O6MJWHU5.js";
 import "../chunk-6JAIFIPW.js";
 import "../chunk-YKCAJ2TN.js";
 import "../chunk-PZ5AY32C.js";

package/dist/user-avatar.js

@@ -1,7 +1,7 @@
 import {
   UserAvatar,
   UserMenu
-} from "./chunk-MG3SRQ6N.js";
+} from "./chunk-EOTV5BLM.js";
 import "./chunk-UDQSIRAP.js";
 import "./chunk-PGPPN63I.js";
 import "./chunk-TNQDSTIA.js";
@@ -10,29 +10,29 @@ import "./chunk-3ZVUNSFF.js";
 import "./chunk-MTEQEPNY.js";
 import "./chunk-VUHLNYAE.js";
 import "./chunk-2GSIEDGN.js";
-import "./chunk-OP5JR5Q5.js";
-import "./chunk-76X6JRVI.js";
+import "./chunk-WN5PNP6F.js";
 import "./chunk-FKUYRQSP.js";
+import "./chunk-76X6JRVI.js";
 import "./chunk-JH7EEJEQ.js";
 import "./chunk-BA4RHQ3B.js";
 import "./chunk-RIZRF5XR.js";
 import "./chunk-LTE2QHBH.js";
 import "./chunk-LN46DSMF.js";
 import "./chunk-TAMIZE4Q.js";
-import "./chunk-YZHX2HTC.js";
-import "./chunk-6IWO7CM2.js";
+import "./chunk-MKLIMY3D.js";
+import "./chunk-PAT2BQOQ.js";
 import "./chunk-TYJR4GOF.js";
 import "./chunk-2TZ6X265.js";
 import "./chunk-7FDU3FIN.js";
 import "./chunk-EPEJMTCQ.js";
 import "./chunk-GDN2LUTZ.js";
-import "./chunk-6WZUZHJM.js";
+import "./chunk-YFODI4KT.js";
+import "./chunk-VBP46YP4.js";
 import "./chunk-2BYKTBDL.js";
 import "./chunk-AG66JBNH.js";
 import "./chunk-FZXKH2ZT.js";
-import "./chunk-VBP46YP4.js";
-import "./chunk-O6MJWHU5.js";
 import "./chunk-26X4CZVR.js";
+import "./chunk-O6MJWHU5.js";
 import "./chunk-FQ6UW7IY.js";
 import "./chunk-6JAIFIPW.js";
 import "./chunk-N3GAFIXG.js";

package/dist/utility/WorkflowStep.js

@@ -6,23 +6,23 @@ import "../chunk-LV4WSWQZ.js";
 import "../chunk-KNWG77FB.js";
 import "../chunk-TM5QQJTF.js";
 import "../chunk-3IPPMWUA.js";
-import "../chunk-7ZPUN7TV.js";
-import "../chunk-SJ4IAZ3V.js";
+import "../chunk-DH6J64PS.js";
 import "../chunk-25MSGLNU.js";
 import "../chunk-GAXHYRX6.js";
 import "../chunk-NP6SHLQ3.js";
+import "../chunk-7ZPUN7TV.js";
 import "../chunk-PT6TCWIW.js";
 import "../chunk-2TZ6X265.js";
 import "../chunk-7FDU3FIN.js";
 import "../chunk-EPEJMTCQ.js";
 import "../chunk-GDN2LUTZ.js";
-import "../chunk-6WZUZHJM.js";
+import "../chunk-YFODI4KT.js";
+import "../chunk-VBP46YP4.js";
 import "../chunk-2BYKTBDL.js";
 import "../chunk-AG66JBNH.js";
 import "../chunk-FZXKH2ZT.js";
-import "../chunk-VBP46YP4.js";
-import "../chunk-O6MJWHU5.js";
 import "../chunk-26X4CZVR.js";
+import "../chunk-O6MJWHU5.js";
 import "../chunk-FQ6UW7IY.js";
 import "../chunk-6JAIFIPW.js";
 import "../chunk-N3GAFIXG.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@12-apps/ui",
-  "version": "6.51.0",
+  "version": "6.52.0",
   "license": "MIT",
   "packageManager": "pnpm@10.34.5",
   "type": "module",

package/src/components/data-display/DataGrid/DataGrid.md

@@ -165,7 +165,7 @@ export interface DataGridProps<T = any> extends React.HTMLAttributes<HTMLElement
 
   /** Sizing, density, and layout */
   sizeMode?: GridSizeMode; // auto | fixed | fill
-  density?: GridDensity; // compact | comfortable | spacious
+  density?: GridDensity; // compact | comfortable | spacious; defaults to 'comfortable', never the theme (FUT-2886)
   rowHeight?: number; // default row height (px)
   headerHeight?: number; // default header height (px)
   footerHeight?: number; // optional
@@ -303,6 +303,17 @@ Use Requisio tokens only:
 - Elevation (optional for sticky header shadow): `--rs-shadow-sm`
 - Density mapping adjusts `rowHeight`, paddings, and font sizes.
 
+**A theme density scales a grid once, through `rem()`** (FUT-2886). With no
+`density` prop, the grid's own discrete density stays `'comfortable'` no
+matter what the host theme's density is set to — it is NOT re-picked from the
+theme. The theme's density factor still applies, exactly the way it scales
+every other size on the page, so a compact theme still gives smaller rows
+(≈0.9× the unthemed default) and a comfortable one still gives taller ones
+(≈1.1×); it does so by scaling the `'comfortable'` row through `rem()`, not by
+swapping in a different discrete row-height table (`'compact'`'s 0.8× or
+`'spacious'`'s 1.2×). Pass `density` explicitly for a deliberate, second,
+per-grid choice on top of that.
+
 Dark mode:
 
 - Verify AA contrast for header/body text, dividers, selected rows, and focus outlines.

package/src/components/data-display/DataGrid/DataGrid.model.ts

@@ -15,7 +15,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import type React from 'react';
 
 import { rem, remPx } from '../../../tokens/relative';
-import { useDensity, type DensityLevel } from '../../../tokens/density';
 
 import { processRows } from './DataGrid.rows';
 import type {
@@ -53,8 +52,9 @@ export interface VisibleRange {
 export interface DataGridModel<T extends Record<string, unknown>> {
   containerRef: React.RefObject<HTMLDivElement | null>;
   /**
-   * The density this render actually used: `props.density`, else the
-   * theme-driven default (FUT-2769, {@link mapThemeToGridDensity}). The same
+   * The density this render actually used: `props.density`, else
+   * `'comfortable'` — the grid's own normal density, never re-picked from the
+   * theme (FUT-2886, reverting FUT-2769's default-from-theme half). The same
    * value `rowHeight` was scaled by — read it here rather than re-deriving it,
    * so the reported default and the geometry can never disagree.
    */
@@ -91,21 +91,6 @@ function densityHeight(base: number, density: DataGridProps['density']): number
   return base;
 }
 
-/**
- * The theme's density level, aliased to `GridDensity` (FUT-2769 — umbrella
- * Decision 7, non-breaking): `GridDensity`'s three names are not the theme's
- * three names, so this is an alias table rather than a verbatim read.
- * `'normal'` (the theme's own default, and what a theme with no density at
- * all resolves to) maps to `'comfortable'` — today's literal default,
- * unchanged — so the mapping is a no-op exactly when nothing about density
- * has been said.
- */
-export function mapThemeToGridDensity(level: DensityLevel): GridDensity {
-  if (level === 'compact') return 'compact';
-  if (level === 'comfortable') return 'spacious';
-  return 'comfortable';
-}
-
 /** The rows this render should show, with every client-mode step resolved. */
 function useProcessedRows<T extends Record<string, unknown>>(
   props: DataGridProps<T>,
@@ -316,13 +301,13 @@ export function useDataGridModel<T extends Record<string, unknown>>(
 ): DataGridModel<T> {
   const { columns } = props;
   const theme = useTheme();
-  const themeDensity = useDensity();
   const containerRef = useRef<HTMLDivElement>(null);
   const [editingCell, setEditingCell] = useState<EditingCell | null>(null);
   const { sortBy, filters, setInternalSortBy } = useSortAndFilter(props);
-  // An explicit `density` prop wins; otherwise the theme's own level, aliased
-  // to this grid's three names (FUT-2769).
-  const density = props.density ?? mapThemeToGridDensity(themeDensity.level ?? 'normal');
+  // An explicit `density` prop wins; otherwise the grid's own normal density,
+  // never from the theme (FUT-2886) — the theme's factor still scales the row
+  // height below, but only once, through `rem()`.
+  const density = props.density ?? 'comfortable';
   // 52 design px unless the caller says; the density scales it, then the type scale does.
   const designRowHeight = densityHeight(props.rowHeight ?? 52, density);
   const rowPitch = remPx(theme, designRowHeight);

package/src/components/data-display/DataGrid/DataGrid.types.ts

@@ -158,7 +158,13 @@ export interface DataGridProps<T = Record<string, unknown>> extends React.HTMLAt
 
   /** Sizing, density, and layout */
   sizeMode?: GridSizeMode; // auto | fixed | fill
-  density?: GridDensity; // compact | comfortable | spacious
+  /**
+   * compact | comfortable | spacious. Defaults to `'comfortable'` — NOT the
+   * host theme's density: a theme density still scales row height, but only
+   * once, through `rem()` (FUT-2886). Pass this explicitly for a deliberate,
+   * per-grid density on top of that.
+   */
+  density?: GridDensity;
   /** Row height (default 52) — design px, scaled with the theme's type scale; `density` scales it first. */
   rowHeight?: number;
   /** Header row height (default 56) — design px, scaled with the theme's type scale. */

package/src/components/data-display/DataViews/data-views-layout-context.tsx

@@ -7,7 +7,6 @@ import GridViewOutlinedIcon from "@mui/icons-material/GridViewOutlined";
 import { Slider } from "../../form/Slider";
 import { Box } from "../../../mui/Box";
 import { sxRem } from "../../../tokens/relative";
-import { useDensity, type DensityLevel } from "../../../tokens/density";
 
 import { useDataViewsCopy } from "./data-views-copy-context";
 import { DATA_VIEWS_LAYOUTS, type DataViewsLayout } from "./data-views-types";
@@ -168,20 +167,18 @@ function isDensity(value: unknown): value is DataViewsDensity {
 }
 
 /**
- * The theme's density level, aliased to `DataViewsDensity` (FUT-2769 —
- * umbrella Decision 7, non-breaking): `DataViewsDensity`'s three names are not
- * the theme's three names, so this is an alias table rather than a verbatim
- * read. `'normal'` (the theme's own default, and what a theme with no density
- * at all resolves to) maps to `'cozy'` — today's literal default, unchanged —
- * so the mapping is a no-op exactly when nothing about density has been said.
- * The STORED per-viewer preference still wins over this default, unchanged
+ * `density`'s default with nothing stored and nothing passed (FUT-2886,
+ * reverting FUT-2769's own half of this): always `'cozy'` — today's literal,
+ * unchanged — never sourced from `useDensity()`. FUT-2769 aliased the theme's
+ * level to this density through `mapThemeToDataViewsDensity`, which — like
+ * `Table`'s own theme default — made a theme scale a DataViews table's row
+ * height twice: once by picking a DIFFERENT discrete density, and again
+ * through the `rem()` that density's own row height is drawn with. A theme
+ * density now scales a DataViews table's rows exactly ONCE, through `rem()`;
+ * the STORED per-viewer preference still wins over this default, unchanged
  * from today (below).
  */
-export function mapThemeToDataViewsDensity(level: DensityLevel): DataViewsDensity {
-  if (level === 'compact') return 'compact';
-  if (level === 'comfortable') return 'comfortable';
-  return 'cozy';
-}
+const DEFAULT_DENSITY: DataViewsDensity = 'cozy';
 
 /** The remembered density, or undefined (no window, no value, junk). */
 function readStoredDensity(): DataViewsDensity | undefined {
@@ -275,20 +272,16 @@ export function DataViewsLayoutProvider({
   children,
 }: LayoutProviderProps): React.JSX.Element {
   const availability = { canUseCards, canUseList, canUseBoard };
-  // Read once, outside the lazy initializer below: a hook cannot be called
-  // from inside one (FUT-2769 — the theme is only a fallback when nothing is
-  // stored, same precedence as before this ticket).
-  const themeDensity = useDensity();
   const [layout, setLayoutState] = useState<DataViewsLayout>(() =>
     pinLayout(
       viewLayout ?? (ignoreStoredLayout ? undefined : readStoredLayout()) ?? defaultLayout,
       availability,
     ),
   );
+  // `DEFAULT_DENSITY` ('cozy'), never the theme (FUT-2886 — see that
+  // constant's own doc comment): the stored per-viewer preference still wins.
   const [density, setDensityState] = useState<DataViewsDensity>(
-    () =>
-      (ignoreStoredLayout ? undefined : readStoredDensity()) ??
-      mapThemeToDataViewsDensity(themeDensity.level ?? "normal"),
+    () => (ignoreStoredLayout ? undefined : readStoredDensity()) ?? DEFAULT_DENSITY,
   );
   const [zoom, setZoom] = useState(DEFAULT_ZOOM);
   // A newly applied view carrying a layout switches to it (its reference-change

package/src/components/data-display/Table/Table.helpers.ts

@@ -3,7 +3,6 @@ import type { Theme } from '@mui/material/styles/index.js';
 import type React from 'react';
 
 import { rem } from '../../../tokens/relative';
-import type { DensityLevel } from '../../../tokens/density';
 
 import type { TableDensity, TableProps } from './Table.types';
 
@@ -15,16 +14,23 @@ import type { TableDensity, TableProps } from './Table.types';
 export const tableRowHeight = (rowHeight: number | undefined): number => rowHeight ?? 52;
 
 /**
- * `density`'s default (FUT-2769): the caller's own prop, else the theme's
- * level — `'normal'` for a theme with no density at all (`useDensity()`'s own
- * fallback) or an unnamed numeric one. `TableDensity` is a verbatim match for
- * the theme's `DensityLevel`, so no alias table is needed, unlike `DataGrid`'s
- * `mapThemeToGridDensity` or `DataViews`' `mapThemeToDataViewsDensity`.
+ * `density`'s default (FUT-2886, reverting FUT-2769's half of this): the
+ * caller's own `density` prop, else `'normal'` — never the theme's level.
+ *
+ * FUT-2769 defaulted this from `useDensity()`, which combined with
+ * `Table.styles.ts`'s own discrete per-density row-height table
+ * (`densityConfig.rowHeightPx`, already 36/52/68) to scale row height TWICE
+ * under a themed density: that table picked the discrete height for the
+ * theme's level, and the `rem()` it is drawn through then scaled it AGAIN by
+ * the same theme's `typography.fontSize` factor — a compact theme gave
+ * `36 * 0.9 = 32.4px` rows, not a clean `0.9×` of anything. A theme density
+ * now scales a table's rows exactly ONCE, through `rem()`: `density` alone
+ * picks the discrete row-height table, and the theme's factor is applied on
+ * top of THAT by `rem()`, giving `52 * 0.9` under a compact theme rather than
+ * a second discrete step.
  */
-export const resolveTableDensity = (
-  explicit: TableDensity | undefined,
-  themeLevel: DensityLevel | undefined,
-): TableDensity => explicit ?? themeLevel ?? 'normal';
+export const resolveTableDensity = (explicit: TableDensity | undefined): TableDensity =>
+  explicit ?? 'normal';
 
 /** The scroll box's height: a number is design px, 400 unless the caller says otherwise. */
 const scrollHeight = (theme: Theme, containerHeight: number | string | undefined): string => {
@@ -84,12 +90,13 @@ export const virtualHeight = (p: TableProps): number | undefined =>
     ? p.containerHeight
     : undefined;
 
-// `density` is NOT here (FUT-2769): `TableDensity` is a verbatim match for
-// the theme's `DensityLevel`, so `Table.tsx` resolves it itself —
-// `props.density ?? (useDensity().level ?? 'normal')` — reading the theme
-// requires a hook, which this module-level constant cannot call. At
-// `theme.density` unset, or its level `'normal'`, that reproduces this
-// object's OTHER defaults' shape exactly: today's literal `'normal'`.
+// `density` is NOT here (kept in `resolveTableDensity` instead, FUT-2886):
+// this object's OTHER defaults are read at the module level, before any
+// props exist, while `density`'s default is `explicit ?? 'normal'` — a
+// two-argument fallback that reads just as well next to `Table.tsx`'s own
+// assignment as it would spread from here. No theme read is involved any
+// more (FUT-2769's `useDensity()` default was reverted): a table's own
+// discrete density is always `'normal'` unless the caller says otherwise.
 export const TABLE_DEFAULTS: Partial<TableProps> = {
   variant: 'default',
   stripeColor: 'neutral',

package/src/components/data-display/Table/Table.md

@@ -178,6 +178,17 @@ const columns = [
 - **normal** - Standard padding (default)
 - **comfortable** - Extra padding for improved readability
 
+**A theme density scales a table once, through `rem()`.** With no `density`
+prop, the table's own discrete density stays `'normal'` no matter what the
+host theme's density is set to — it is NOT re-picked from the theme. The
+theme's density factor still applies, exactly the way it scales every other
+size on the page, so a compact theme still gives smaller rows (≈0.9× normal)
+and a comfortable one still gives taller ones (≈1.1× normal); it does so by
+scaling the `'normal'` row through `rem()`, not by swapping in a different
+discrete row-height table. Pass `density` explicitly (or let a viewer's stored
+DataViews preference apply it) for a deliberate, second, per-table choice on
+top of that.
+
 ## Accessibility
 
 - Proper `role="table"` attributes

package/src/components/data-display/Table/Table.tsx

@@ -35,7 +35,6 @@ import { EnhancedTableBody, EnhancedTableHeader } from './TableParts';
 import { EmptyRow, NoDataPlaceholder } from './TableStates';
 import { tableStyles } from './Table.styles';
 import { rem } from '../../../tokens/relative';
-import { useDensity } from '../../../tokens/density';
 
 // Helper function to get stripe color from theme
 const StyledTable = styled(MuiTable, {
@@ -330,9 +329,9 @@ const TableEmptyState: React.FC<{
 
 export const Table = React.forwardRef<globalThis.HTMLTableElement, TableProps>(
   (tableProps, ref) => {
-    const themeDensity = useDensity(); // FUT-2769 — density's default; see resolveTableDensity
     const resolved = { ...TABLE_DEFAULTS, ...definedProps(tableProps) } as TableProps;
-    resolved.density = resolveTableDensity(resolved.density, themeDensity.level);
+    // Never from the theme (FUT-2886) — see `resolveTableDensity`.
+    resolved.density = resolveTableDensity(resolved.density);
     const {
       columns,
       data,

package/src/components/data-display/Table/Table.types.ts

@@ -118,7 +118,10 @@ export interface TableProps extends Omit<MuiTableProps, 'variant'> {
   // Advanced Features
   
   /**
-   * The density of the table rows
+   * The density of the table rows. Defaults to `'normal'` — NOT the host
+   * theme's density: a theme density still scales row height, but only once,
+   * through `rem()` (`resolveTableDensity`, FUT-2886). Pass this explicitly
+   * for a deliberate, per-table density on top of that.
    */
   density?: TableDensity;
   

package/src/components/navigation/SectionNav/SectionNav.bar.tsx

@@ -3,6 +3,7 @@ import { useTheme, type SxProps, type Theme } from '@mui/material/styles/index.j
 import { useState, type ElementType, type ReactNode } from 'react';
 
 import type { SectionNavCopy } from '../../../copy';
+import { stackedOverlayZIndex } from '../../../tokens/layers';
 import { rem } from '../../../tokens/scales';
 
 import { barSlots, destinationState, isMenu, menuActive, menuCount, type BarSlot } from './SectionNav.helpers';
@@ -289,9 +290,11 @@ export function SectionNavBar({
           // Above the backdrop ONLY while one of its own sheets is open, so the
           // primary button can close what it opened. Raised all the time it
           // would sit over every dialog the page opens, and on a small phone a
-          // dialog's own footer is exactly where the bar is.
+          // dialog's own footer is exactly where the bar is. `stackedOverlayZIndex`,
+          // not `zIndex.modal + 1`: a host lifting a bottom Drawer clear of a
+          // stacked sheet catches this bar's OWN sheets too.
           position: 'relative',
-          zIndex: open === null ? 'auto' : theme.zIndex.modal + 1,
+          zIndex: open === null ? 'auto' : stackedOverlayZIndex(theme) + 1,
         }}
       >
         {barSlots(destinations, more !== undefined, primary !== undefined).map((slot) => (

package/src/components/navigation/SectionNav/SectionNav.md

@@ -20,7 +20,7 @@ action, the sheets, and the rail's sections.
 | `layout` | draws | menus |
 |---|---|---|
 | `bar` | a bottom row: the destinations, `more` last, `primary` raised in the middle | open as bottom sheets over the page, stopping above the bar |
-| `rail` | a vertical list: `back`, `heading`, the destinations, then each menu | listed under their `title`: nothing is folded on a wide screen |
+| `rail` | a vertical list: `back`, `heading`, a `primary` menu as one button, the destinations, then `more` | `primary` opens as a menu anchored to its button (named by `title`); `more` is listed under its `title` |
 
 Which layout to use is the HOST's call. A bar beside a sidebar is two
 navigations competing for one glance, and only the host knows what else is on
@@ -76,8 +76,9 @@ looks one tap apart.
   reports `aria-pressed="true"` (`false` when `active: false`). Only a link
   reports `aria-current="page"`; an action is not a page.
 - A menu entry, and a whole menu, can be `disabled` too. In the bar a disabled
-  menu's trigger is inert and opens no sheet; in the rail, where the menu is
-  listed rather than behind a trigger, every row of it is inert.
+  menu's trigger is inert and opens no sheet. In the rail a disabled `primary`
+  is a disabled button, and a disabled `more`, listed rather than behind a
+  trigger, has every row inert.
 - `dataTestId` on a destination, entry, action or menu replaces the id the nav
   would derive, for a host whose suites already drive their own.
 
@@ -124,4 +125,6 @@ icon turns 45° while open.
 
 `<prefix>-dest-<id>`, `<prefix>-primary`, `<prefix>-more`,
 `<prefix>-{primary,more}-sheet`, `<prefix>-{primary,more}-sheet-entry-<id>` (bar),
-`<prefix>-{primary,more}-entry-<id>` (rail), and `<prefix>-back`.
+`<prefix>-{primary,more}-entry-<id>` (rail; a `primary` entry exists once its
+menu is open), `<prefix>-primary-menu` (the rail's open `primary` menu), and
+`<prefix>-back`.