@12-apps/ui 6.35.0 → 6.36.0

package/dist/{chunk-ZUQIOWLN.js → chunk-BSYPPO2I.js}

@@ -5,10 +5,14 @@ import {
   slideInLeft,
   slideInRight,
   slideInUp
-} from "./chunk-IT7ATXU7.js";
+} from "./chunk-ZHV7TCAC.js";
 import {
   shadowInk
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem,
+  rems
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/data-display/HoverCard/HoverCard.styles.ts
 import { alpha } from "@mui/material/styles/index.js";
@@ -18,39 +22,39 @@ var sideOf = (placement) => {
   if (placement.startsWith("right")) return "right";
   return "bottom";
 };
-var ARROW_SIZE = 8;
+var arrowSize = (theme) => rem(theme, 8);
 var ARROWS = {
-  top: (color) => ({
-    bottom: -ARROW_SIZE,
+  top: (size, color) => ({
+    bottom: `-${size}`,
     left: "50%",
     transform: "translateX(-50%)",
-    borderLeft: `${ARROW_SIZE}px solid transparent`,
-    borderRight: `${ARROW_SIZE}px solid transparent`,
-    borderTop: `${ARROW_SIZE}px solid ${color}`
+    borderLeft: `${size} solid transparent`,
+    borderRight: `${size} solid transparent`,
+    borderTop: `${size} solid ${color}`
   }),
-  bottom: (color) => ({
-    top: -ARROW_SIZE,
+  bottom: (size, color) => ({
+    top: `-${size}`,
     left: "50%",
     transform: "translateX(-50%)",
-    borderLeft: `${ARROW_SIZE}px solid transparent`,
-    borderRight: `${ARROW_SIZE}px solid transparent`,
-    borderBottom: `${ARROW_SIZE}px solid ${color}`
+    borderLeft: `${size} solid transparent`,
+    borderRight: `${size} solid transparent`,
+    borderBottom: `${size} solid ${color}`
   }),
-  left: (color) => ({
-    right: -ARROW_SIZE,
+  left: (size, color) => ({
+    right: `-${size}`,
     top: "50%",
     transform: "translateY(-50%)",
-    borderTop: `${ARROW_SIZE}px solid transparent`,
-    borderBottom: `${ARROW_SIZE}px solid transparent`,
-    borderLeft: `${ARROW_SIZE}px solid ${color}`
+    borderTop: `${size} solid transparent`,
+    borderBottom: `${size} solid transparent`,
+    borderLeft: `${size} solid ${color}`
   }),
-  right: (color) => ({
-    left: -ARROW_SIZE,
+  right: (size, color) => ({
+    left: `-${size}`,
     top: "50%",
     transform: "translateY(-50%)",
-    borderTop: `${ARROW_SIZE}px solid transparent`,
-    borderBottom: `${ARROW_SIZE}px solid transparent`,
-    borderRight: `${ARROW_SIZE}px solid ${color}`
+    borderTop: `${size} solid transparent`,
+    borderBottom: `${size} solid transparent`,
+    borderRight: `${size} solid ${color}`
   })
 };
 var arrowSx = (theme, placement) => ({
@@ -58,7 +62,7 @@ var arrowSx = (theme, placement) => ({
   width: 0,
   height: 0,
   zIndex: 1,
-  ...ARROWS[sideOf(placement)](theme.palette.background.paper)
+  ...ARROWS[sideOf(placement)](arrowSize(theme), theme.palette.background.paper)
 });
 var ANCHOR_ORIGINS = {
   top: { vertical: "top", horizontal: "center" },
@@ -74,12 +78,12 @@ var getAnchorOrigin = (placement) => ANCHOR_ORIGINS[sideOf(placement)];
 var getTransformOrigin = (placement) => flip(ANCHOR_ORIGINS[sideOf(placement)]);
 var ANIMATIONS = {
   // `fade` shares slideInUp deliberately: the keyframes fade in while rising.
-  fade: { animation: `${slideInUp} 0.2s ease-out` },
-  scale: { transformOrigin: "center", animation: `${scaleIn} 0.2s cubic-bezier(0.4, 0, 0.2, 1)` },
-  "slide-up": { animation: `${slideInUp} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` },
-  "slide-down": { animation: `${slideInDown} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` },
-  "slide-left": { animation: `${slideInLeft} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` },
-  "slide-right": { animation: `${slideInRight} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }
+  fade: (theme) => ({ animation: `${slideInUp(theme)} 0.2s ease-out` }),
+  scale: () => ({ transformOrigin: "center", animation: `${scaleIn} 0.2s cubic-bezier(0.4, 0, 0.2, 1)` }),
+  "slide-up": (theme) => ({ animation: `${slideInUp(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),
+  "slide-down": (theme) => ({ animation: `${slideInDown(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),
+  "slide-left": (theme) => ({ animation: `${slideInLeft(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),
+  "slide-right": (theme) => ({ animation: `${slideInRight(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` })
 };
 var VARIANTS = {
   default: (theme) => ({
@@ -89,10 +93,10 @@ var VARIANTS = {
   }),
   glass: (theme) => ({
     backgroundColor: alpha(theme.palette.background.paper, 0.85),
-    backdropFilter: "blur(20px)",
-    WebkitBackdropFilter: "blur(20px)",
+    backdropFilter: `blur(${rem(theme, 20)})`,
+    WebkitBackdropFilter: `blur(${rem(theme, 20)})`,
     border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,
-    boxShadow: `0 8px 32px ${shadowInk(theme, 0.12)}`
+    boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.12)}`
   }),
   detailed: (theme) => ({
     backgroundColor: theme.palette.background.paper,
@@ -106,7 +110,7 @@ var VARIANTS = {
   })
 };
 var glowStyles = (theme) => ({
-  boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,
+  boxShadow: `${rems(theme, 0, 0, 20, 5)} ${alpha(theme.palette.primary.main, 0.3)} !important`,
   filter: "brightness(1.05)"
 });
 var pulseStyles = (theme) => ({
@@ -121,7 +125,7 @@ var pulseStyles = (theme) => ({
     borderRadius: "inherit",
     backgroundColor: theme.palette.primary.main,
     opacity: 0.1,
-    animation: `${pulseAnimation} 2s infinite`,
+    animation: `${pulseAnimation(theme)} 2s infinite`,
     pointerEvents: "none",
     zIndex: -1
   }
@@ -133,9 +137,9 @@ var cardSx = (theme, flags) => {
     transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
     position: "relative",
     overflow: "visible",
-    minWidth: 200,
-    maxWidth: 400,
-    ...animation ? ANIMATIONS[animation] ?? {} : {},
+    minWidth: rem(theme, 200),
+    maxWidth: rem(theme, 400),
+    ...animation ? ANIMATIONS[animation]?.(theme) ?? {} : {},
     ...customVariant ? VARIANTS[customVariant]?.(theme) ?? {} : {},
     // The old "both" arm was exactly these two spread together.
     ...glow && glowStyles(theme),
@@ -150,4 +154,4 @@ export {
   getTransformOrigin,
   cardSx
 };
-//# sourceMappingURL=chunk-ZUQIOWLN.js.map
+//# sourceMappingURL=chunk-BSYPPO2I.js.map

package/dist/chunk-BSYPPO2I.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/HoverCard/HoverCard.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport {\n  pulseAnimation,\n  scaleIn,\n  slideInDown,\n  slideInLeft,\n  slideInRight,\n  slideInUp,\n} from './HoverCard.animations';\nimport type { HoverCardAnimation, HoverCardPlacement } from './HoverCard.types';\nimport { shadowInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\n\n/** The edge the card sits on, ignoring the `-start`/`-end` alignment suffix. */\ntype Side = 'top' | 'bottom' | 'left' | 'right';\n\nexport const sideOf = (placement: HoverCardPlacement): Side => {\n  if (placement.startsWith('top')) return 'top';\n  if (placement.startsWith('left')) return 'left';\n  if (placement.startsWith('right')) return 'right';\n  return 'bottom';\n};\n\n/** The arrow's size, 8 design px, through the theme's type scale. */\nconst arrowSize = (theme: Theme): string => rem(theme, 8);\n\n/**\n * The arrow is a CSS triangle: two transparent borders on the cross axis and one\n * filled border pointing back at the anchor. Every placement is that same shape,\n * so the table holds only which edge is filled and where the triangle sits.\n */\nconst ARROWS: Record<Side, (size: string, color: string) => CSSObject> = {\n  top: (size, color) => ({\n    bottom: `-${size}`,\n    left: '50%',\n    transform: 'translateX(-50%)',\n    borderLeft: `${size} solid transparent`,\n    borderRight: `${size} solid transparent`,\n    borderTop: `${size} solid ${color}`,\n  }),\n  bottom: (size, color) => ({\n    top: `-${size}`,\n    left: '50%',\n    transform: 'translateX(-50%)',\n    borderLeft: `${size} solid transparent`,\n    borderRight: `${size} solid transparent`,\n    borderBottom: `${size} solid ${color}`,\n  }),\n  left: (size, color) => ({\n    right: `-${size}`,\n    top: '50%',\n    transform: 'translateY(-50%)',\n    borderTop: `${size} solid transparent`,\n    borderBottom: `${size} solid transparent`,\n    borderLeft: `${size} solid ${color}`,\n  }),\n  right: (size, color) => ({\n    left: `-${size}`,\n    top: '50%',\n    transform: 'translateY(-50%)',\n    borderTop: `${size} solid transparent`,\n    borderBottom: `${size} solid transparent`,\n    borderRight: `${size} solid ${color}`,\n  }),\n};\n\nexport const arrowSx = (theme: Theme, placement: HoverCardPlacement): CSSObject => ({\n  position: 'absolute',\n  width: 0,\n  height: 0,\n  zIndex: 1,\n  ...ARROWS[sideOf(placement)](arrowSize(theme), theme.palette.background.paper),\n});\n\ntype Origin = { vertical: 'top' | 'center' | 'bottom'; horizontal: 'left' | 'center' | 'right' };\n\n/** Where the popover attaches to the anchor, per side. */\nconst ANCHOR_ORIGINS: Record<Side, Origin> = {\n  top: { vertical: 'top', horizontal: 'center' },\n  bottom: { vertical: 'bottom', horizontal: 'center' },\n  left: { vertical: 'center', horizontal: 'left' },\n  right: { vertical: 'center', horizontal: 'right' },\n};\n\n/** The card's own corner meets the anchor's, so its origin is the opposite one. */\nconst flip = (origin: Origin): Origin => ({\n  vertical: origin.vertical === 'top' ? 'bottom' : origin.vertical === 'bottom' ? 'top' : 'center',\n  horizontal:\n    origin.horizontal === 'left' ? 'right' : origin.horizontal === 'right' ? 'left' : 'center',\n});\n\nexport const getAnchorOrigin = (placement: HoverCardPlacement): Origin =>\n  ANCHOR_ORIGINS[sideOf(placement)];\n\nexport const getTransformOrigin = (placement: HoverCardPlacement): Origin =>\n  flip(ANCHOR_ORIGINS[sideOf(placement)]);\n\nconst ANIMATIONS: Record<string, (theme: Theme) => CSSObject> = {\n  // `fade` shares slideInUp deliberately: the keyframes fade in while rising.\n  fade: (theme) => ({ animation: `${slideInUp(theme)} 0.2s ease-out` }),\n  scale: () => ({ transformOrigin: 'center', animation: `${scaleIn} 0.2s cubic-bezier(0.4, 0, 0.2, 1)` }),\n  'slide-up': (theme) => ({ animation: `${slideInUp(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),\n  'slide-down': (theme) => ({ animation: `${slideInDown(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),\n  'slide-left': (theme) => ({ animation: `${slideInLeft(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),\n  'slide-right': (theme) => ({ animation: `${slideInRight(theme)} 0.3s cubic-bezier(0.4, 0, 0.2, 1)` }),\n};\n\nconst VARIANTS: Record<string, (theme: Theme) => CSSObject> = {\n  default: (theme) => ({\n    backgroundColor: theme.palette.background.paper,\n    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n    boxShadow: theme.shadows[8],\n  }),\n  glass: (theme) => ({\n    backgroundColor: alpha(theme.palette.background.paper, 0.85),\n    backdropFilter: `blur(${rem(theme, 20)})`,\n    WebkitBackdropFilter: `blur(${rem(theme, 20)})`,\n    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n    boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.12)}`,\n  }),\n  detailed: (theme) => ({\n    backgroundColor: theme.palette.background.paper,\n    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n    boxShadow: theme.shadows[12],\n  }),\n  minimal: (theme) => ({\n    backgroundColor: theme.palette.background.paper,\n    border: `1px solid ${alpha(theme.palette.divider, 0.1)}`,\n    boxShadow: theme.shadows[4],\n  }),\n};\n\nconst glowStyles = (theme: Theme): CSSObject => ({\n  boxShadow: `${rems(theme, 0, 0, 20, 5)} ${alpha(theme.palette.primary.main, 0.3)} !important`,\n  filter: 'brightness(1.05)',\n});\n\nconst pulseStyles = (theme: Theme): CSSObject => ({\n  position: 'relative',\n  '&::after': {\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    borderRadius: 'inherit',\n    backgroundColor: theme.palette.primary.main,\n    opacity: 0.1,\n    animation: `${pulseAnimation(theme)} 2s infinite`,\n    pointerEvents: 'none',\n    zIndex: -1,\n  },\n});\n\nexport interface CardStyleFlags {\n  customVariant?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  animation?: HoverCardAnimation;\n}\n\nexport const cardSx = (theme: Theme, flags: CardStyleFlags): CSSObject => {\n  const { customVariant, glow, pulse, animation } = flags;\n\n  return {\n    borderRadius: theme.spacing(1.5),\n    transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n    position: 'relative',\n    overflow: 'visible',\n    minWidth: rem(theme, 200),\n    maxWidth: rem(theme, 400),\n    ...(animation ? (ANIMATIONS[animation]?.(theme) ?? {}) : {}),\n    ...(customVariant ? (VARIANTS[customVariant]?.(theme) ?? {}) : {}),\n    // The old \"both\" arm was exactly these two spread together.\n    ...(glow && glowStyles(theme)),\n    ...(pulse && pulseStyles(theme)),\n  };\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-NXX3ZQKO.js → chunk-BYH5GPLT.js}

@@ -1,9 +1,14 @@
 import {
   fadeInScaleAnimation
-} from "./chunk-H2YBVBPW.js";
+} from "./chunk-3UIDKLML.js";
 import {
   shadowInk
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem,
+  rems,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/data-display/DataViews/card-surface.ts
 import { alpha, keyframes } from "@mui/material/styles/index.js";
@@ -12,7 +17,7 @@ var pulseRing = keyframes`
   70% { transform: scale(1.04); opacity: 0; }
   100% { transform: scale(1.04); opacity: 0; }
 `;
-var CARD_RADIUS = "3px";
+var CARD_RADIUS = sxRem(3);
 function slotTestIds(testId) {
   return (slot) => testId ? `${testId}-${slot}` : void 0;
 }
@@ -36,25 +41,25 @@ function variantSx(variant, theme) {
   if (variant === "glass") {
     return {
       backgroundColor: alpha(theme.palette.background.paper, 0.55),
-      backdropFilter: "blur(8px)",
+      backdropFilter: `blur(${rem(theme, 8)})`,
       // `divider` as-is. NOT `alpha(divider, …)`: MUI's `alpha` REPLACES the
       // channel rather than scaling it, and `divider` is already a 12% black —
       // so asking for 80% of it produced an 80% black slab of a border.
       borderColor: theme.palette.divider,
-      boxShadow: `0 1px 3px ${shadowInk(theme, 0.1)}`
+      boxShadow: `0 ${rems(theme, 1, 3)} ${shadowInk(theme, 0.1)}`
     };
   }
   return {};
 }
 var MOTION_OK = "@media (prefers-reduced-motion: no-preference)";
-function accentBar(main) {
+function accentBar(theme, main) {
   return {
     "&::before": {
       content: '""',
       position: "absolute",
       insetInlineStart: 0,
       insetBlock: 0,
-      width: 3,
+      width: rem(theme, 3),
       borderStartStartRadius: "inherit",
       borderEndStartRadius: "inherit",
       backgroundColor: main,
@@ -62,16 +67,16 @@ function accentBar(main) {
     }
   };
 }
-function liftSx(main) {
+function liftSx(theme, main) {
   return {
     boxShadow: [
-      `0 0 0 1px ${alpha(main, 0.45)}`,
-      `0 1px 2px ${alpha(main, 0.12)}`,
-      `0 8px 20px -6px ${alpha(main, 0.3)}`
+      `0 0 0 ${rem(theme, 1)} ${alpha(main, 0.45)}`,
+      `0 ${rems(theme, 1, 2)} ${alpha(main, 0.12)}`,
+      `0 ${rems(theme, 8, 20, -6)} ${alpha(main, 0.3)}`
     ].join(", ")
   };
 }
-function pulseSx(main) {
+function pulseSx(theme, main) {
   return {
     [MOTION_OK]: {
       "&::after": {
@@ -79,24 +84,24 @@ function pulseSx(main) {
         position: "absolute",
         inset: 0,
         borderRadius: "inherit",
-        border: `2px solid ${main}`,
+        border: `${rem(theme, 2)} solid ${main}`,
         animation: `${pulseRing} 1.6s ease-out 6`,
         pointerEvents: "none"
       }
     }
   };
 }
-function emphasisSx(emphasis, main, shape) {
+function emphasisSx(theme, emphasis, main, shape) {
   if (emphasis === "attention") {
     return {
-      ...accentBar(main),
-      ...shape === "tile" ? liftSx(main) : {},
-      ...pulseSx(main)
+      ...accentBar(theme, main),
+      ...shape === "tile" ? liftSx(theme, main) : {},
+      ...pulseSx(theme, main)
     };
   }
   if (emphasis === "new") {
     return {
-      ...accentBar(main),
+      ...accentBar(theme, main),
       [MOTION_OK]: { animation: `${fadeInScaleAnimation} 240ms ease-out` }
     };
   }
@@ -132,10 +137,10 @@ function cardSurfaceStyles(props, theme) {
     ...variantSx(variant, theme),
     ...showSelected ? {
       borderColor: `${color}.main`,
-      boxShadow: `inset 0 0 0 1px ${main}`,
+      boxShadow: `inset 0 0 0 ${rem(theme, 1)} ${main}`,
       backgroundColor: "action.selected"
     } : {},
-    ...emphasisSx(emphasis, main, props.shape)
+    ...emphasisSx(theme, emphasis, main, props.shape)
   };
 }
 
@@ -146,4 +151,4 @@ export {
   isActionable,
   cardSurfaceStyles
 };
-//# sourceMappingURL=chunk-NXX3ZQKO.js.map
+//# sourceMappingURL=chunk-BYH5GPLT.js.map

package/dist/chunk-BYH5GPLT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/card-surface.ts"],"sourcesContent":["import { alpha, keyframes, type CSSObject, type Theme } from \"@mui/material/styles/index.js\";\n\nimport { fadeInScaleAnimation } from \"../Badge/Badge.animations\";\nimport { shadowInk } from \"../../../tokens/ink\";\nimport { rem, rems, sxRem } from \"../../../tokens/relative\";\n\n/**\n * A plain style object, not MUI's `SxProps`.\n *\n * `SxProps` is a union including arrays and functions, so a value typed as one\n * cannot be spread — and these fragments exist precisely to be merged. Note also\n * that `Card` merges by SPREADING (`sx={{ ...defaults, ...sx }}`), so handing it\n * a function yields nothing at all: resolve the theme with `useTheme` first.\n */\ntype CardSx = CSSObject | Record<string, unknown>;\n\n/** The ring, as scale + opacity so it never leaves the compositor. */\nconst pulseRing = keyframes`\n  0% { transform: scale(1); opacity: 0.9; }\n  70% { transform: scale(1.04); opacity: 0; }\n  100% { transform: scale(1.04); opacity: 0; }\n`;\n\n/**\n * THE CONTRACT BOTH CARDS IMPLEMENT.\n *\n * `BaseCard` (a tile) and `BaseListCard` (a row) are one object seen from two\n * angles, so the surface — variant, colour, selectability, draggability,\n * emphasis and state — is declared once and spread into both.\n */\n\n/**\n * How much chrome the surface claims. Button's vocabulary, spelled Button's\n * way: a card and a button are both surfaces the operator presses, and having\n * one say `outline` while the other says `outlined` taxes everyone who writes\n * both. Chip's `filled | outlined` was the wrong model — a chip is a token in a\n * sentence and has only those two things to say.\n */\nexport type CardSurfaceVariant = \"outline\" | \"ghost\" | \"text\" | \"glass\";\n\n/** The theme colour a card's selection and emphasis are drawn in. */\nexport type CardSurfaceColor =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"warning\"\n  | \"error\"\n  | \"info\";\n\n/**\n * Why this card is asking to be noticed.\n *\n * ONE union, not six booleans. `glow`/`pulse`/`animate`/`bounce`/`shimmer`\n * combined into 32 states of which about three meant anything —\n * `pulse + shimmer + bounce` is not a thing anyone wants, and every one of\n * those combinations was a state somebody could reach by accident.\n */\nexport type CardEmphasis =\n  /** Nothing. The overwhelming default. */\n  | \"none\"\n  /** Look here now: an accent bar, and a ring that beats six times and settles. */\n  | \"attention\"\n  /** This just arrived: an accent bar and one fade-in. */\n  | \"new\";\n\n/** A row and a tile carry emphasis differently — see `emphasisSx`. */\ntype CardShape = \"row\" | \"tile\";\n\n/**\n * What this record IS, as opposed to how it looks.\n *\n * `dimmed` only greyed pixels, which left a cancelled row's buttons live and\n * clickable. This carries the meaning, so the card can also stop offering\n * actions on something that cannot be acted on.\n */\nexport type CardState = \"default\" | \"cancelled\" | \"disabled\";\n\nexport interface CardSurfaceProps {\n  /** How much chrome the surface claims. Defaults to `outline`. */\n  variant?: CardSurfaceVariant;\n  /** Theme colour for selection and emphasis. Defaults to `primary`. */\n  color?: CardSurfaceColor;\n  /**\n   * Can this card be selected — and does it show it?\n   *\n   * The capability, separate from the handler. `selectable` gets the checkbox\n   * AND the selected treatment; `selectable={false}` has neither, however\n   * `selected` is set, so a stale flag arriving with the data cannot make a\n   * read-only row render as picked. Defaults to whether `onToggleSelect` exists.\n   */\n  selectable?: boolean;\n  /** Whether this card is currently in the selection. */\n  selected?: boolean;\n  /**\n   * Opt OUT of dragging even inside a drag container.\n   *\n   * Draggability is the container's decision (see `data-views-drag`); this is\n   * the card's veto — a pinned row, a summary line, a record that may not move.\n   */\n  draggable?: boolean;\n  /**\n   * Where this card leads.\n   *\n   * PREFER THIS TO `onClick`. A clickable `<div>` cannot be cmd-clicked,\n   * middle-clicked or \"copy link address\"'d, and wrapping interactive children\n   * in a click handler is the a11y violation it looks like. With `href` the\n   * title is a real `<a>` stretched over the card by a pseudo-element: one\n   * whole-row target, correct tab order, every browser affordance intact, and\n   * the buttons inside stay ordinary buttons.\n   */\n  href?: string;\n  /** Anchor target, when `href` is set. */\n  target?: string;\n  /** Card click, for a card that does not navigate. See `href` first. */\n  onClick?: () => void;\n  /** What this record is. `cancelled`/`disabled` also suppress the actions. */\n  state?: CardState;\n  /** Why this card is asking to be noticed. Defaults to `none`. */\n  emphasis?: CardEmphasis;\n  className?: string;\n  /**\n   * One id; the parts derive from it (`${testId}-checkbox`, `-drag`, `-menu`,\n   * `-value`). A prop per slot would have been `checkboxTestId`,\n   * `menuTestId`, `valueTestId`… one for every part anybody ever tested.\n   */\n  testId?: string;\n  \"aria-label\"?: string;\n}\n\n/**\n * ONE RADIUS FOR BOTH SHAPES, off the token scale on purpose.\n *\n * `Card`'s own steps are 4px and 8px and its `lg` is 16px, all chosen for a\n * surface nearly as tall as it is wide. A 56px row is not that shape — the\n * corner runs most of the way down both ends and curves away from the square\n * checkbox and square thumbnail inside it — and a tile that rounds harder than\n * the row it sits beside in the same view reads as a different component.\n *\n * 3px takes the hard point off the corner without being seen as a curve.\n * `divider` rows override it back to 0; a bottom rule has no corners to round.\n */\nexport const CARD_RADIUS = sxRem(3);\n\n/** Every slot's test id, derived from the card's one. */\nexport function slotTestIds(testId: string | undefined): (slot: string) => string | undefined {\n  return (slot) => (testId ? `${testId}-${slot}` : undefined);\n}\n\n/** Is this card selectable? Explicit wins; otherwise a handler implies it. */\nexport function isSelectable(\n  props: Pick<CardSurfaceProps, \"selectable\"> & { onToggleSelect?: () => void },\n): boolean {\n  return props.selectable ?? props.onToggleSelect != null;\n}\n\n/** Can this record be acted on at all? */\nexport function isActionable(state: CardState | undefined): boolean {\n  return state !== \"disabled\" && state !== \"cancelled\";\n}\n\n/**\n * Variant styling. Everything but `outline` drops the border.\n *\n * `ghost` keeps a faint SURFACE where `text` has none — without that the two\n * were pixel-identical at rest and the union carried a distinction it did not\n * draw. Ghost is \"a surface, quietly\"; text is \"no surface at all\", which is\n * what a host wants when it is drawing the container itself.\n */\nfunction variantSx(variant: CardSurfaceVariant, theme: Theme): CardSx {\n  if (variant === \"ghost\") {\n    return {\n      border: 0,\n      backgroundColor: \"action.hover\",\n      \"&:hover\": { backgroundColor: \"action.selected\" },\n    };\n  }\n  if (variant === \"text\") {\n    return { border: 0, backgroundColor: \"transparent\", boxShadow: \"none\" };\n  }\n  if (variant === \"glass\") {\n    // THEME-AWARE, and it keeps its edges.\n    //\n    // This was a hardcoded `rgba(255,255,255,·)` fill with a near-white border,\n    // which had two problems. On a dark palette a 55%-white pane is not frosted\n    // glass, it is a pale rectangle. And on a light one BOTH the fill and the\n    // border land on white and vanish, so `glass` rendered as `text` — the same\n    // nothing, reached by a different name.\n    //\n    // The blur is what makes it glass, and a blur is only visible over\n    // something. So the pane keeps a real hairline and a shallow shadow: over a\n    // plain surface it still reads as a raised pane rather than as absence, and\n    // over an image or a gradient the blur does the rest.\n    return {\n      backgroundColor: alpha(theme.palette.background.paper, 0.55),\n      backdropFilter: `blur(${rem(theme, 8)})`,\n      // `divider` as-is. NOT `alpha(divider, …)`: MUI's `alpha` REPLACES the\n      // channel rather than scaling it, and `divider` is already a 12% black —\n      // so asking for 80% of it produced an 80% black slab of a border.\n      borderColor: theme.palette.divider,\n      boxShadow: `0 ${rems(theme, 1, 3)} ${shadowInk(theme, 0.1)}`,\n    };\n  }\n  return {};\n}\n\n/**\n * MOTION IS OPT-IN, ALWAYS.\n *\n * Everything animated here is wrapped in this. Fifty rows breathing in unison\n * is a vestibular trigger, and honouring the OS setting is not a polish item —\n * it is the difference between a list somebody can look at and one they cannot.\n */\nconst MOTION_OK = \"@media (prefers-reduced-motion: no-preference)\";\n\n/**\n * THE ROW'S ATTENTION SIGNAL IS A BAR, NOT A HALO.\n *\n * A glow is a weak signal in a list: full-width rows stacked tight means the\n * halo bleeds 15px into the neighbours above and below and reads as a rendering\n * artifact, and stacked with a `selected` ring and the browser's focus ring it\n * becomes three concentric halos on one row. Five rows needing attention at\n * once turns the page into a smear.\n *\n * A 3px accent on the leading edge is stronger, costs no motion at all, works\n * under reduced-motion, cannot bleed into a neighbour, and stacks cleanly\n * however many rows raise their hand. It is where operational tables land.\n */\nfunction accentBar(theme: Theme, main: string): CardSx {\n  return {\n    \"&::before\": {\n      content: '\"\"',\n      position: \"absolute\",\n      insetInlineStart: 0,\n      insetBlock: 0,\n      width: rem(theme, 3),\n      borderStartStartRadius: \"inherit\",\n      borderEndStartRadius: \"inherit\",\n      backgroundColor: main,\n      pointerEvents: \"none\",\n    },\n  };\n}\n\n/**\n * The tile's lift — a card that has been RAISED, not one that is lit from within.\n *\n * This was Button's glow: a 20px bloom at 0.6 over a 40px bloom at 0.3, plus\n * `brightness(1.05)`. On a button, which is small and pressed and gone, that\n * reads as energy. On a tile it read as a neon sign — 40px of saturated colour\n * bleeding into the gaps of a grid whose whole job is to let the eye compare\n * cards, and the brightness filter washing the image and the caption with it.\n *\n * Three shadows doing three jobs instead: a hairline ring that tints the card's\n * own edge in the accent colour, a tight contact shadow, and one soft shadow\n * offset DOWNWARD. Offset is what separates elevation from emission — a glow is\n * symmetrical because its source is the object; a shadow falls because the\n * light is somewhere else. It stays legible on a dark canvas, where the old\n * bloom was the brightest thing on the screen.\n */\nfunction liftSx(theme: Theme, main: string): CardSx {\n  return {\n    boxShadow: [\n      `0 0 0 ${rem(theme, 1)} ${alpha(main, 0.45)}`,\n      `0 ${rems(theme, 1, 2)} ${alpha(main, 0.12)}`,\n      `0 ${rems(theme, 8, 20, -6)} ${alpha(main, 0.3)}`,\n    ].join(\", \"),\n  };\n}\n\n/**\n * A breath that STOPS.\n *\n * Six iterations, not `infinite`. A restaurant admin has this open for a whole\n * shift, and something pulsing in the periphery forever is fatigue rather than\n * urgency — worse, once two or three rows are doing it the signal means\n * nothing. It settles, and the accent bar carries the state from then on.\n *\n * Animating `transform`/`opacity` on a pseudo-element, never `box-shadow`: a\n * box-shadow keyframe repaints every frame, and fifty of them drop frames on\n * exactly the tablet a restaurant floor uses. This one is compositor-only.\n */\nfunction pulseSx(theme: Theme, main: string): CardSx {\n  return {\n    [MOTION_OK]: {\n      \"&::after\": {\n        content: '\"\"',\n        position: \"absolute\",\n        inset: 0,\n        borderRadius: \"inherit\",\n        border: `${rem(theme, 2)} solid ${main}`,\n        animation: `${pulseRing} 1.6s ease-out 6`,\n        pointerEvents: \"none\",\n      },\n    },\n  };\n}\n\n/** The emphasis treatments, in the terms the shape can actually carry. */\nfunction emphasisSx(theme: Theme, emphasis: CardEmphasis, main: string, shape: CardShape): CardSx {\n  if (emphasis === \"attention\") {\n    // The bar on both; the lift only where there is room for it to spread.\n    return {\n      ...accentBar(theme, main),\n      ...(shape === \"tile\" ? liftSx(theme, main) : {}),\n      ...pulseSx(theme, main),\n    };\n  }\n  if (emphasis === \"new\") {\n    return {\n      ...accentBar(theme, main),\n      [MOTION_OK]: { animation: `${fadeInScaleAnimation} 240ms ease-out` },\n    };\n  }\n  return {};\n}\n\n/**\n * The shared half of a card's styling. Each component adds its own geometry —\n * a tile's aspect ratio, a row's rails.\n */\n/**\n * WHAT THE TWO NON-DEFAULT STATES LOOK LIKE — and why they cannot look alike.\n *\n * Both were `opacity: 0.6` and nothing else, so a record the business CANCELLED\n * and a row this user merely cannot touch were pixel-identical. The type has\n * always drawn the distinction (`CardState`); only the styling had not, which\n * made `cancelled` a comment rather than a state.\n *\n * `cancelled` is a VOIDED record: still there, still worth reading, no longer\n * counting. The figures get struck through, because a dimmed `R$ 1.250,00`\n * still reads as money owed and a struck one cannot.\n *\n * `disabled` is INERT: nothing to read into, nothing to do with. It goes\n * greyscale — which also drains the status chip's colour, the one thing on the\n * row still shouting for attention — and says so on hover.\n */\nfunction stateSx(state: CardState): CardSx {\n  if (state === \"cancelled\") {\n    return {\n      opacity: 0.65,\n      // The META CLUSTER is struck too. It was left out, so a voided row kept a\n      // crisp `05/08/2026, 13:45` and `PIX` between a struck title and a struck\n      // total — the middle of the row reading as live data on a record the two\n      // ends call void. Both lines of each pair go, as both lines of the caption\n      // already do: on a cancelled record the label is as void as the value.\n      '& [data-slot=\"value\"], & [data-slot=\"caption\"], & [data-slot=\"meta\"]': {\n        textDecoration: \"line-through\",\n      },\n    };\n  }\n  if (state === \"disabled\") {\n    return { opacity: 0.45, filter: \"grayscale(1)\", cursor: \"not-allowed\" };\n  }\n  return { opacity: 1 };\n}\n\nexport function cardSurfaceStyles(\n  props: CardSurfaceProps & { selectable: boolean; shape: CardShape },\n  theme: Theme,\n): CardSx {\n  const { variant = \"outline\", color = \"primary\", selected = false, selectable } = props;\n  const { state = \"default\", emphasis = \"none\" } = props;\n  const main = theme.palette[color].main;\n  // Selection styling is gated on the CAPABILITY: a card that cannot be\n  // selected must not render as selected because a stale flag came with its data.\n  const showSelected = selectable && selected;\n  return {\n    transition: \"border-color 120ms, box-shadow 120ms, background-color 120ms\",\n    ...stateSx(state),\n    ...variantSx(variant, theme),\n    ...(showSelected\n      ? {\n          borderColor: `${color}.main`,\n          boxShadow: `inset 0 0 0 ${rem(theme, 1)} ${main}`,\n          backgroundColor: \"action.selected\",\n        }\n      : {}),\n    ...emphasisSx(theme, emphasis, main, props.shape),\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-CS3RKXT5.js → chunk-CHFHILTM.js}

@@ -1,6 +1,6 @@
 import {
   GridToolbar
-} from "./chunk-YSKGLU2V.js";
+} from "./chunk-B7BNNSM2.js";
 
 // src/components/data-display/DataViews/data-views-shell-toolbar.tsx
 import { jsx } from "react/jsx-runtime";
@@ -64,4 +64,4 @@ function ShellToolbar({
 export {
   ShellToolbar
 };
-//# sourceMappingURL=chunk-CS3RKXT5.js.map
+//# sourceMappingURL=chunk-CHFHILTM.js.map

package/dist/{chunk-DMYBTD5Y.js → chunk-CPWWMGYR.js}

@@ -1,6 +1,6 @@
 import {
   Chart
-} from "./chunk-65YAR3OZ.js";
+} from "./chunk-Q2YNXJEL.js";
 import {
   CHART_SEMANTIC_COLORS,
   specToChartProps
@@ -46,4 +46,4 @@ var SpecChart = ({
 export {
   SpecChart
 };
-//# sourceMappingURL=chunk-DMYBTD5Y.js.map
+//# sourceMappingURL=chunk-CPWWMGYR.js.map

package/dist/{chunk-L4V2LRKH.js → chunk-CSN3F36H.js}

@@ -1,19 +1,22 @@
 import {
   HoverCardContent
-} from "./chunk-O26MKGIC.js";
+} from "./chunk-NRIV2CQ2.js";
 import {
   arrowSx,
   cardSx,
   getAnchorOrigin,
   getTransformOrigin,
   sideOf
-} from "./chunk-ZUQIOWLN.js";
+} from "./chunk-BSYPPO2I.js";
 import {
   useHoverCard
 } from "./chunk-SXYIXCUB.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/data-display/HoverCard/HoverCard.tsx
 import Box from "@mui/material/Box/index.js";
@@ -49,17 +52,19 @@ var DEFAULTS = {
   animation: "fade",
   enterDelay: 700,
   exitDelay: 0,
-  maxWidth: 400,
   loading: false,
   touchEnabled: true,
-  offset: 8,
   disabled: false
 };
 var CONTENT_PADDING = { detailed: 3, minimal: 1.5 };
-var offsetMargin = (placement, offset) => {
+var offsetMargin = (theme, placement, offset) => {
   const side = sideOf(placement);
   const key = { top: "mt", bottom: "mb", left: "ml", right: "mr" }[side];
-  return { [key]: `${offset}px` };
+  return { [key]: rem(theme, offset ?? 8) };
+};
+var capOf = (theme, maxWidth) => {
+  const cap = maxWidth ?? 400;
+  return cap <= 1 && cap !== 0 ? `${cap * 100}%` : rem(theme, cap);
 };
 var HoverCard = React.forwardRef((props, ref) => {
   const {
@@ -131,7 +136,7 @@ var HoverCard = React.forwardRef((props, ref) => {
               pulse,
               animation,
               "data-testid": dataTestId || "hover-card-content",
-              sx: { maxWidth, ...offsetMargin(placement, offset) },
+              sx: (theme) => ({ maxWidth: capOf(theme, maxWidth), ...offsetMargin(theme, placement, offset) }),
               children: /* @__PURE__ */ jsx(CardContent, { sx: { p: padding, "&:last-child": { pb: padding } }, children: /* @__PURE__ */ jsx(
                 HoverCardContent,
                 {
@@ -158,4 +163,4 @@ HoverCard.displayName = "HoverCard";
 export {
   HoverCard
 };
-//# sourceMappingURL=chunk-L4V2LRKH.js.map
+//# sourceMappingURL=chunk-CSN3F36H.js.map

package/dist/chunk-CSN3F36H.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/HoverCard/HoverCard.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Card from '@mui/material/Card/index.js';\nimport CardContent from '@mui/material/CardContent/index.js';\nimport Popover from '@mui/material/Popover/index.js';\nimport { styled, type Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { rem } from '../../../tokens/relative';\nimport { withDefaults } from '../../../utils/withDefaults';\n\nimport { HoverCardContent } from './HoverCard.content';\nimport { useHoverCard } from './HoverCard.hooks';\nimport { arrowSx, cardSx, getAnchorOrigin, getTransformOrigin, sideOf } from './HoverCard.styles';\nimport type { CardStyleFlags } from './HoverCard.styles';\nimport type { HoverCardAnimation, HoverCardPlacement, HoverCardProps } from './HoverCard.types';\n\nconst ArrowContainer = styled('div')<{ placement: HoverCardPlacement; offset?: number }>(\n  ({ theme, placement }) => ({ ...arrowSx(theme, placement) }),\n);\n\nconst StyledCard = styled(Card, {\n  shouldForwardProp: (prop) =>\n    !['customVariant', 'glow', 'pulse', 'animation'].includes(prop as string),\n})<CardStyleFlags>(({ theme, ...flags }) => ({ ...cardSx(theme, flags) }));\n\nconst StyledPopover = styled(Popover, {\n  shouldForwardProp: (prop) => prop !== 'customAnimation',\n})<{ customAnimation?: HoverCardAnimation }>(({ customAnimation }) => ({\n  // The popover only positions; StyledCard draws the surface.\n  '& .MuiPopover-paper': {\n    backgroundColor: 'transparent',\n    boxShadow: 'none',\n    overflow: 'visible',\n    ...(customAnimation === 'scale' && { transformOrigin: 'center' }),\n  },\n}));\n\nconst DEFAULTS = {\n  variant: 'default',\n  glow: false,\n  pulse: false,\n  placement: 'bottom',\n  showArrow: false,\n  animation: 'fade',\n  enterDelay: 700,\n  exitDelay: 0,\n  loading: false,\n  touchEnabled: true,\n  disabled: false,\n} satisfies Partial<HoverCardProps>;\n\ntype ResolvedProps = HoverCardProps & Required<Pick<HoverCardProps, keyof typeof DEFAULTS>>;\n\n/** Padding is the variant's own: detailed roomier, minimal tighter. */\nconst CONTENT_PADDING: Record<string, number> = { detailed: 3, minimal: 1.5 };\n\n/**\n * The card is nudged off the anchor on whichever side it sits — `offset` design\n * px (8 unless the caller says otherwise), through the theme's type scale.\n */\nconst offsetMargin = (theme: Theme, placement: HoverCardPlacement, offset: number | undefined) => {\n  const side = sideOf(placement);\n  const key = ({ top: 'mt', bottom: 'mb', left: 'ml', right: 'mr' } as const)[side];\n  return { [key]: rem(theme, offset ?? 8) };\n};\n\n/**\n * The card's cap: 400 design px unless the caller says otherwise. `sx` has always\n * read a number of 1 or less as a fraction of the parent, and that stays so.\n */\nconst capOf = (theme: Theme, maxWidth: number | undefined): string => {\n  const cap = maxWidth ?? 400;\n  return cap <= 1 && cap !== 0 ? `${cap * 100}%` : rem(theme, cap);\n};\n\nexport const HoverCard = React.forwardRef<HTMLDivElement, HoverCardProps>((props, ref) => {\n  const {\n    variant, glow, pulse, title, description, avatar, trigger, placement, showArrow,\n    animation, enterDelay, exitDelay, maxWidth, loading, loadingComponent, loadingText, touchEnabled,\n    offset, disabled, onOpen, onClose, children, dataTestId,\n    ...rest\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n\n  const { anchorEl, isOpen, handleClose, triggerHandlers, cardHandlers } = useHoverCard({\n    disabled,\n    touchEnabled,\n    enterDelay,\n    exitDelay,\n    onOpen,\n    onClose,\n  });\n\n  const triggerProps = {\n    ...triggerHandlers,\n    style: { cursor: disabled ? 'default' : 'pointer' },\n    'data-testid': dataTestId ? `${dataTestId}-trigger` : 'hover-card-trigger',\n  };\n\n  const triggerElement = trigger ? (\n    React.cloneElement(trigger, triggerProps)\n  ) : (\n    <span {...triggerProps} style={{ display: 'inline-block', ...triggerProps.style }}>\n      {children}\n    </span>\n  );\n\n  const padding = CONTENT_PADDING[variant] ?? 2;\n\n  return (\n    <>\n      {triggerElement}\n      <StyledPopover\n        ref={ref}\n        open={isOpen && !disabled}\n        anchorEl={anchorEl}\n        onClose={handleClose}\n        anchorOrigin={getAnchorOrigin(placement)}\n        transformOrigin={getTransformOrigin(placement)}\n        {...cardHandlers}\n        disableAutoFocus\n        disableEnforceFocus\n        disableRestoreFocus\n        customAnimation={animation}\n        slotProps={{ paper: { style: { pointerEvents: 'auto' } } }}\n        {...rest}\n      >\n        <Box sx={{ position: 'relative' }}>\n          {showArrow && <ArrowContainer placement={placement} offset={offset} />}\n          <StyledCard\n            customVariant={variant}\n            glow={glow}\n            pulse={pulse}\n            animation={animation}\n            data-testid={dataTestId || 'hover-card-content'}\n            sx={(theme) => ({ maxWidth: capOf(theme, maxWidth), ...offsetMargin(theme, placement, offset) })}\n          >\n            <CardContent sx={{ p: padding, '&:last-child': { pb: padding } }}>\n              <HoverCardContent\n                loadingText={loadingText} variant={variant} title={title}\n                description={description}\n                avatar={avatar}\n                loading={loading}\n                loadingComponent={loadingComponent}\n                dataTestId={dataTestId}\n              >\n                {children}\n              </HoverCardContent>\n            </CardContent>\n          </StyledCard>\n        </Box>\n      </StyledPopover>\n    </>\n  );\n});\n\nHoverCard.displayName = 'HoverCard';\n"],"mappings":"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","names":[]}

package/dist/{chunk-XSMMFCMQ.js → chunk-CWDV64TD.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-QKLSHNOH.js";
 import {
   useDateRangePicker
-} from "./chunk-APT5L7V5.js";
+} from "./chunk-2LIRGFEK.js";
 import {
   DateRangeQuickList
 } from "./chunk-NSJVQ5YJ.js";
 import {
   DateRangeFields
-} from "./chunk-IDO4EV7T.js";
+} from "./chunk-NR5TW4AH.js";
 import {
   toLocalDay
 } from "./chunk-FRAVVI4A.js";
@@ -180,4 +180,4 @@ export {
   DateRangePicker,
   DateRangePicker_default
 };
-//# sourceMappingURL=chunk-XSMMFCMQ.js.map
+//# sourceMappingURL=chunk-CWDV64TD.js.map

package/dist/{chunk-IUCTYNIR.js → chunk-CX66M55F.js}

@@ -2,6 +2,7 @@ import {
   neutralTones
 } from "./chunk-FQ6UW7IY.js";
 import {
+  rem,
   sxRem
 } from "./chunk-YKCAJ2TN.js";
 
@@ -44,9 +45,9 @@ var StepButton = styled(Button, {
   shouldForwardProp: (prop) => !["isActive", "isCompleted", "clickable", "stepSize"].includes(prop)
 })(
   ({ theme, isActive, isCompleted, clickable, stepSize }) => ({
-    minWidth: CIRCLE_SIZE[stepSize],
-    width: CIRCLE_SIZE[stepSize],
-    height: CIRCLE_SIZE[stepSize],
+    minWidth: rem(theme, CIRCLE_SIZE[stepSize]),
+    width: rem(theme, CIRCLE_SIZE[stepSize]),
+    height: rem(theme, CIRCLE_SIZE[stepSize]),
     borderRadius: "50%",
     padding: 0,
     backgroundColor: isCompleted ? theme.palette.primary.main : isActive ? theme.palette.primary.main : neutralTones(theme).track,
@@ -76,17 +77,17 @@ var StepConnector = styled(Box, {
     }),
     ...orientation === "horizontal" ? {
       flex: 1,
-      height: 2,
+      height: rem(theme, 2),
       // Vertically centered on the circle (circle/2 - 1 for the 2px line).
-      marginTop: CIRCLE_SIZE[size] / 2 - 1,
-      marginLeft: 8,
-      marginRight: 8,
-      minWidth: 24
+      marginTop: rem(theme, CIRCLE_SIZE[size] / 2 - 1),
+      marginLeft: rem(theme, 8),
+      marginRight: rem(theme, 8),
+      minWidth: rem(theme, 24)
     } : {
-      width: 2,
-      height: 32,
-      marginTop: 8,
-      marginBottom: 8,
+      width: rem(theme, 2),
+      height: rem(theme, 32),
+      marginTop: rem(theme, 8),
+      marginBottom: rem(theme, 8),
       // Use margin auto to center horizontally
       marginLeft: "auto",
       marginRight: "auto"
@@ -95,9 +96,9 @@ var StepConnector = styled(Box, {
 );
 var StepLabel = styled(Box, {
   shouldForwardProp: (prop) => prop !== "orientation"
-})(({ orientation }) => ({
+})(({ theme, orientation }) => ({
   textAlign: "center",
-  marginTop: orientation === "horizontal" ? 8 : 0
+  marginTop: orientation === "horizontal" ? rem(theme, 8) : 0
 }));
 function stepClasses(isActive, isCompleted, optional) {
   return [
@@ -107,7 +108,7 @@ function stepClasses(isActive, isCompleted, optional) {
   ].filter(Boolean).join(" ");
 }
 function contentSx(orientation, size) {
-  return orientation === "horizontal" ? { minWidth: STEP_MIN_WIDTH[size], maxWidth: 150, flex: "0 1 auto" } : { flexShrink: 0 };
+  return orientation === "horizontal" ? { minWidth: sxRem(STEP_MIN_WIDTH[size]), maxWidth: sxRem(150), flex: "0 1 auto" } : { flexShrink: 0 };
 }
 var StepCircle = ({ step, index, isActive, isCompleted, isClickable, size, labelVariant, onClick }) => {
   const state = isCompleted ? " (completed)" : isActive ? " (current)" : "";
@@ -139,7 +140,7 @@ var StepLabelBlock = ({
   {
     orientation,
     "data-testid": `stepper-step-label-${index}`,
-    sx: size === "sm" && orientation === "horizontal" ? { mt: "2px" } : void 0,
+    sx: size === "sm" && orientation === "horizontal" ? { mt: sxRem(2) } : void 0,
     children: [
       /* @__PURE__ */ jsxs(
         Typography,
@@ -284,4 +285,4 @@ var Stepper = ({
 export {
   Stepper
 };
-//# sourceMappingURL=chunk-IUCTYNIR.js.map
+//# sourceMappingURL=chunk-CX66M55F.js.map

package/dist/chunk-CX66M55F.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Stepper/Stepper.tsx"],"sourcesContent":["import CheckCircle from '@mui/icons-material/CheckCircle';\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type { Step, StepItemProps, StepperProps } from './Stepper.types';\nimport { neutralTones } from '../../../tokens/ink';\nimport { rem, sxRem } from '../../../tokens/relative';\nimport type { SizeValue } from '../../../tokens/scales';\n\n/**\n * The five house stops, drawn rather than collapsed.\n *\n * These were two-way ternaries on `sm`, which is what a two-value size prop\n * allows; with the full scale they have to be real values or the three new\n * stops would render identically to `md` and the prop would be a lie.\n */\nconst STEP_MIN_WIDTH: Record<SizeValue, number> = { xs: 44, sm: 56, md: 80, lg: 96, xl: 112 };\nconst STEP_ICON_SIZE: Record<SizeValue, number> = { xs: 14, sm: 18, md: 24, lg: 30, xl: 36 };\n\n\nconst StepperRoot = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'orientation',\n})<{ orientation: 'horizontal' | 'vertical'; component?: React.ElementType }>(({ orientation }) => ({\n  display: 'flex',\n  flexDirection: orientation === 'horizontal' ? 'row' : 'column',\n  // Use flex-start to align all step circles at the same vertical position\n  alignItems: 'flex-start',\n}));\n\nconst StepItem = styled(Box, {\n  shouldForwardProp: (prop) => !['orientation', 'isLast'].includes(prop as string),\n})<{ orientation: 'horizontal' | 'vertical'; isLast: boolean }>(({ orientation, isLast }) => ({\n  display: 'flex',\n  // For horizontal: row layout so connector appears beside step content\n  // For vertical: column layout so connector appears below step content\n  flexDirection: orientation === 'horizontal' ? 'row' : 'column',\n  // For horizontal: flex-start to keep circles aligned at top\n  // For vertical: center to align connector with centered circle\n  alignItems: orientation === 'horizontal' ? 'flex-start' : 'center',\n  flex: orientation === 'horizontal' && !isLast ? 1 : 'none',\n  position: 'relative',\n  // For vertical: ensure consistent width for proper centering\n  ...(orientation === 'vertical' && {\n    width: '100%',\n  }),\n}));\n\n/** Circle diameter per size. */\nconst CIRCLE_SIZE: Record<SizeValue, number> = { xs: 24, sm: 32, md: 48, lg: 60, xl: 72 };\n\nconst StepButton = styled(Button, {\n  shouldForwardProp: (prop) =>\n    !['isActive', 'isCompleted', 'clickable', 'stepSize'].includes(prop as string),\n})<{ isActive: boolean; isCompleted: boolean; clickable: boolean; stepSize: SizeValue }>(\n  ({ theme, isActive, isCompleted, clickable, stepSize }) => ({\n    minWidth: rem(theme, CIRCLE_SIZE[stepSize]),\n    width: rem(theme, CIRCLE_SIZE[stepSize]),\n    height: rem(theme, CIRCLE_SIZE[stepSize]),\n    borderRadius: '50%',\n    padding: 0,\n    backgroundColor: isCompleted\n      ? theme.palette.primary.main\n      : isActive\n      ? theme.palette.primary.main\n      : neutralTones(theme).track,\n    color: isCompleted || isActive ? theme.palette.primary.contrastText : theme.palette.text.primary,\n    cursor: clickable ? 'pointer' : 'default',\n    pointerEvents: clickable ? 'auto' : 'none',\n    transition: theme.transitions.create(['background-color', 'transform'], {\n      duration: theme.transitions.duration.short,\n    }),\n    '&:hover': clickable\n      ? {\n          backgroundColor: isCompleted\n            ? theme.palette.primary.dark\n            : isActive\n            ? theme.palette.primary.dark\n            : neutralTones(theme).subtle,\n          transform: 'scale(1.05)',\n        }\n      : {},\n    '&:disabled': {\n      backgroundColor: neutralTones(theme).track,\n      color: theme.palette.text.disabled,\n    },\n  }),\n);\n\nconst StepConnector = styled(Box, {\n  shouldForwardProp: (prop) =>\n    !['orientation', 'isCompleted', 'size'].includes(prop as string),\n})<{ orientation: 'horizontal' | 'vertical'; isCompleted: boolean; size: SizeValue }>(\n  ({ theme, orientation, isCompleted, size }) => ({\n    backgroundColor: isCompleted ? theme.palette.primary.main : neutralTones(theme).track,\n    transition: theme.transitions.create('background-color', {\n      duration: theme.transitions.duration.short,\n    }),\n    ...(orientation === 'horizontal'\n      ? {\n          flex: 1,\n          height: rem(theme, 2),\n          // Vertically centered on the circle (circle/2 - 1 for the 2px line).\n          marginTop: rem(theme, CIRCLE_SIZE[size] / 2 - 1),\n          marginLeft: rem(theme, 8),\n          marginRight: rem(theme, 8),\n          minWidth: rem(theme, 24),\n        }\n      : {\n          width: rem(theme, 2),\n          height: rem(theme, 32),\n          marginTop: rem(theme, 8),\n          marginBottom: rem(theme, 8),\n          // Use margin auto to center horizontally\n          marginLeft: 'auto',\n          marginRight: 'auto',\n        }),\n  }),\n);\n\nconst StepLabel = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'orientation',\n})<{ orientation: 'horizontal' | 'vertical' }>(({ theme, orientation }) => ({\n  textAlign: 'center',\n  marginTop: orientation === 'horizontal' ? rem(theme, 8) : 0,\n}));\n\ntype StepSize = SizeValue;\ntype LabelVariant = 'caption' | 'body2';\n\n/** Space-joined state classes for a step (active / completed / optional). */\nfunction stepClasses(isActive: boolean, isCompleted: boolean, optional?: boolean): string {\n  return [\n    isActive && 'stepper-step-active',\n    isCompleted && 'stepper-step-completed',\n    optional && 'stepper-step-optional',\n  ]\n    .filter(Boolean)\n    .join(' ');\n}\n\n/** The circle content-column width per orientation/size. */\nfunction contentSx(orientation: 'horizontal' | 'vertical', size: StepSize) {\n  return orientation === 'horizontal'\n    ? { minWidth: sxRem(STEP_MIN_WIDTH[size]), maxWidth: sxRem(150), flex: '0 1 auto' }\n    : { flexShrink: 0 };\n}\n\ninterface StepPartProps {\n  step: Step;\n  index: number;\n  isActive: boolean;\n  size: StepSize;\n  labelVariant: LabelVariant;\n}\n\n/** The step circle: a check when completed, otherwise the 1-based index. */\nconst StepCircle: React.FC<\n  StepPartProps & { isCompleted: boolean; isClickable: boolean; onClick: () => void }\n> = ({ step, index, isActive, isCompleted, isClickable, size, labelVariant, onClick }) => {\n  const state = isCompleted ? ' (completed)' : isActive ? ' (current)' : '';\n  return (\n    <StepButton\n      isActive={isActive}\n      isCompleted={isCompleted}\n      clickable={isClickable}\n      stepSize={size}\n      onClick={onClick}\n      disabled={step.disabled}\n      aria-current={isActive ? 'step' : undefined}\n      aria-label={`Step ${index + 1}: ${step.label}${step.optional ? ' (optional)' : ''}${state}`}\n      data-testid={`stepper-step-icon-${index}`}\n    >\n      {isCompleted ? (\n        <CheckCircle sx={{ fontSize: sxRem(STEP_ICON_SIZE[size]) }} />\n      ) : (\n        <Typography variant={labelVariant} fontWeight=\"bold\">\n          {index + 1}\n        </Typography>\n      )}\n    </StepButton>\n  );\n};\n\n/** The step label block: title, optional marker, and description. */\nconst StepLabelBlock: React.FC<StepPartProps & { orientation: 'horizontal' | 'vertical' }> = ({\n  step,\n  index,\n  isActive,\n  orientation,\n  size,\n  labelVariant,\n}) => (\n  <StepLabel\n    orientation={orientation}\n    data-testid={`stepper-step-label-${index}`}\n    sx={size === 'sm' && orientation === 'horizontal' ? { mt: sxRem(2) } : undefined}\n  >\n    <Typography\n      variant={labelVariant}\n      fontWeight={isActive ? 'bold' : 'normal'}\n      color={isActive ? 'primary' : 'textPrimary'}\n    >\n      {step.label}\n      {step.optional && (\n        <Typography component=\"span\" variant=\"caption\" color=\"textSecondary\" sx={{ ml: 1 }}>\n          (optional)\n        </Typography>\n      )}\n    </Typography>\n    {step.description && (\n      <Typography variant=\"caption\" color=\"textSecondary\" display=\"block\">\n        {step.description}\n      </Typography>\n    )}\n  </StepLabel>\n);\n\nconst StepperItem: React.FC<StepItemProps> = ({\n  step,\n  index,\n  isActive,\n  isCompleted,\n  isLast,\n  orientation,\n  size,\n  variant,\n  clickable,\n  onStepClick,\n  renderConnector,\n  nextStep,\n}) => {\n  const labelVariant: LabelVariant = size === 'sm' ? 'caption' : 'body2';\n  const isClickable = Boolean(clickable) && !step.disabled && (variant === 'non-linear' || !isActive);\n  const handleStepClick = () => {\n    if (isClickable && onStepClick) onStepClick(step.id);\n  };\n  const connector =\n    renderConnector && nextStep ? (\n      renderConnector(step, nextStep, { completed: isCompleted, active: isActive })\n    ) : (\n      <StepConnector orientation={orientation} isCompleted={isCompleted} size={size} data-testid={`stepper-connector-${index}`} />\n    );\n\n  return (\n    <StepItem\n      orientation={orientation}\n      isLast={isLast}\n      role=\"listitem\"\n      data-testid={`stepper-step-${index}`}\n      className={stepClasses(isActive, isCompleted, step.optional)}\n    >\n      <Box\n        display=\"flex\"\n        flexDirection=\"column\"\n        alignItems=\"center\"\n        data-testid={`stepper-step-content-${index}`}\n        sx={contentSx(orientation, size)}\n      >\n        <StepCircle\n          step={step}\n          index={index}\n          isActive={isActive}\n          isCompleted={isCompleted}\n          isClickable={isClickable}\n          size={size}\n          labelVariant={labelVariant}\n          onClick={handleStepClick}\n        />\n        <StepLabelBlock\n          step={step}\n          index={index}\n          isActive={isActive}\n          orientation={orientation}\n          size={size}\n          labelVariant={labelVariant}\n        />\n      </Box>\n      {!isLast && connector}\n    </StepItem>\n  );\n};\n\nexport const Stepper: React.FC<StepperProps> = ({\n  steps,\n  activeId,\n  completed = new Set(),\n  orientation = 'horizontal',\n  size = 'md',\n  variant = 'linear',\n  onStepChange,\n  clickable,\n  renderConnector,\n  className,\n  'data-testid': dataTestId,\n}) => {\n  // Determine clickable behavior\n  const isClickable = clickable ?? variant === 'non-linear';\n\n  return (\n    <StepperRoot\n      component=\"ol\"\n      orientation={orientation}\n      className={className}\n      data-testid={dataTestId || 'stepper-container'}\n      sx={{\n        listStyle: 'none',\n        padding: 0,\n        margin: 0,\n      }}\n    >\n      {steps.map((step, index) => {\n        const isActive = step.id === activeId;\n        const isCompleted = completed.has(step.id);\n        const isLast = index === steps.length - 1;\n        const nextStep = !isLast ? steps[index + 1] : undefined;\n\n        return (\n          <StepperItem\n            key={step.id}\n            step={step}\n            index={index}\n            isActive={isActive}\n            isCompleted={isCompleted}\n            isLast={isLast}\n            orientation={orientation}\n            size={size}\n            variant={variant}\n            clickable={isClickable}\n            onStepClick={onStepChange}\n            renderConnector={renderConnector}\n            nextStep={nextStep}\n          />\n        );\n      })}\n    </StepperRoot>\n  );\n};"],"mappings":"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","names":[]}