@12-apps/ui 6.19.0 → 6.20.0

package/dist/{chunk-OAXAF4VY.js → chunk-LMJBINWN.js}

@@ -1,27 +1,27 @@
-import {
-  CategoryPanel
-} from "./chunk-MHFJBNDP.js";
 import {
   CategoryPanelSurface
 } from "./chunk-LMXWI3DD.js";
 import {
-  useCategorySelect
-} from "./chunk-2GB5CIN6.js";
-import {
-  useCategoryKeyHandler
-} from "./chunk-ISH42UC7.js";
+  CategoryPanel
+} from "./chunk-WO52KYSU.js";
 import {
   useCategoryCommit
 } from "./chunk-ZAB65STX.js";
-import {
-  summarizeSelection
-} from "./chunk-LR6MSKTT.js";
 import {
   CategoryTrigger
 } from "./chunk-ZBNTFWTG.js";
 import {
   METRICS
 } from "./chunk-FCOEJCUP.js";
+import {
+  useCategorySelect
+} from "./chunk-2GB5CIN6.js";
+import {
+  useCategoryKeyHandler
+} from "./chunk-ISH42UC7.js";
+import {
+  summarizeSelection
+} from "./chunk-LR6MSKTT.js";
 import {
   FormControl,
   FormLabel,
@@ -158,4 +158,4 @@ function CategorySelect(props) {
 export {
   CategorySelect
 };
-//# sourceMappingURL=chunk-OAXAF4VY.js.map
+//# sourceMappingURL=chunk-LMJBINWN.js.map

package/dist/{chunk-SFAP5EH5.js → chunk-LUMF63BM.js}

@@ -1,9 +1,9 @@
-import {
-  TutorialStepBody
-} from "./chunk-7WP2HRTW.js";
 import {
   useTutorialOverlay
 } from "./chunk-RSQMPCCR.js";
+import {
+  TutorialStepBody
+} from "./chunk-7WP2HRTW.js";
 
 // src/components/feedback/TutorialOverlay/TutorialOverlay.tsx
 import Box from "@mui/material/Box/index.js";
@@ -271,4 +271,4 @@ export {
   TutorialOverlay,
   TutorialOverlay_default
 };
-//# sourceMappingURL=chunk-SFAP5EH5.js.map
+//# sourceMappingURL=chunk-LUMF63BM.js.map

package/dist/{chunk-KADJNWTQ.js → chunk-LZRURORY.js}

@@ -1,12 +1,12 @@
 import {
   Sheet
-} from "./chunk-MCRIT46W.js";
+} from "./chunk-MY5VNNSP.js";
 import {
   Dialog
 } from "./chunk-S5LE2ARG.js";
 import {
   Button
-} from "./chunk-SL4NFGOL.js";
+} from "./chunk-24BUCMQA.js";
 import {
   accentFor
 } from "./chunk-V5IOLAIS.js";
@@ -162,4 +162,4 @@ AppHeaderDetails.displayName = "AppHeaderDetails";
 export {
   AppHeaderDetails
 };
-//# sourceMappingURL=chunk-KADJNWTQ.js.map
+//# sourceMappingURL=chunk-LZRURORY.js.map

package/dist/{chunk-CLNTJM3F.js → chunk-M7OHXNLF.js}

@@ -1,6 +1,6 @@
 import {
   PillControl
-} from "./chunk-ES2RN7YV.js";
+} from "./chunk-NRUYYGDZ.js";
 import {
   PanelRangeField
 } from "./chunk-QZBUGUOY.js";
@@ -154,4 +154,4 @@ export {
   GridFilterPanel,
   FilterDialog
 };
-//# sourceMappingURL=chunk-CLNTJM3F.js.map
+//# sourceMappingURL=chunk-M7OHXNLF.js.map

package/dist/{chunk-UXQW6ZIN.js → chunk-MBYO2F4Y.js}

@@ -1,3 +1,7 @@
+import {
+  actionsOf,
+  makeTestId
+} from "./chunk-MWFSIB6K.js";
 import {
   ACTIONS_GAP_UNITS,
   ACTIONS_MARGIN_TOP_UNITS,
@@ -14,10 +18,6 @@ import {
   illustrationMaxWidth,
   illustrationOpacity
 } from "./chunk-RKCS6K36.js";
-import {
-  actionsOf,
-  makeTestId
-} from "./chunk-MWFSIB6K.js";
 import {
   resolveTestId
 } from "./chunk-QLWBQQW7.js";
@@ -200,4 +200,4 @@ export {
   EmptyState,
   EmptyState_default
 };
-//# sourceMappingURL=chunk-UXQW6ZIN.js.map
+//# sourceMappingURL=chunk-MBYO2F4Y.js.map

package/dist/{chunk-ZHEJLUCX.js → chunk-MHV5Y5MR.js}

@@ -1,3 +1,17 @@
+import {
+  BAR_GLOW,
+  CIRCULAR_GLOW,
+  GLASS_BAR_ALPHA,
+  GLASS_BAR_BORDER_ALPHA,
+  GLASS_BLUR_PX,
+  GLOW_BRIGHTNESS,
+  PROGRESS_SIZES,
+  PULSE
+} from "./chunk-ZEG2LNBY.js";
+import {
+  px
+} from "./chunk-NQN5Z36J.js";
+
 // src/components/data-display/Progress/Progress.styles.ts
 import { alpha, keyframes } from "@mui/material/styles/index.js";
 var pulseAnimation = keyframes`
@@ -5,7 +19,7 @@ var pulseAnimation = keyframes`
     opacity: 1;
   }
   50% {
-    opacity: 0.7;
+    opacity: ${PULSE.dip};
   }
   100% {
     opacity: 1;
@@ -32,13 +46,12 @@ var getColorFromTheme = (theme, color) => {
   };
   return colorMap[color] || theme.palette.primary;
 };
-var SIZE_MAP = {
-  xs: { height: 2, circularSize: 24, fontSize: "0.625rem" },
-  sm: { height: 4, circularSize: 32, fontSize: "0.75rem" },
-  md: { height: 6, circularSize: 40, fontSize: "0.875rem" },
-  lg: { height: 8, circularSize: 48, fontSize: "1rem" },
-  xl: { height: 10, circularSize: 56, fontSize: "1.125rem" }
-};
+var SIZE_MAP = Object.fromEntries(
+  Object.entries(PROGRESS_SIZES).map(([size, step]) => [
+    size,
+    { height: step.height, circularSize: step.circularSize, fontSize: px(step.fontSize) }
+  ])
+);
 var getSizeStyles = (size) => SIZE_MAP[size] || SIZE_MAP.md;
 var barVariantStyles = (variant, colorPalette) => {
   switch (variant) {
@@ -50,9 +63,9 @@ var barVariantStyles = (variant, colorPalette) => {
       };
     case "glass":
       return {
-        backgroundColor: alpha(colorPalette.main, 0.8),
-        backdropFilter: "blur(10px)",
-        border: `1px solid ${alpha(colorPalette.main, 0.3)}`
+        backgroundColor: alpha(colorPalette.main, GLASS_BAR_ALPHA),
+        backdropFilter: `blur(${GLASS_BLUR_PX}px)`,
+        border: `1px solid ${alpha(colorPalette.main, GLASS_BAR_BORDER_ALPHA)}`
       };
     default:
       return {};
@@ -60,19 +73,19 @@ var barVariantStyles = (variant, colorPalette) => {
 };
 var barEmphasisStyles = (colorPalette, glow, pulse) => ({
   ...glow && {
-    boxShadow: `0 0 10px 2px ${alpha(colorPalette.main, 0.4)}`,
-    filter: "brightness(1.1)"
+    boxShadow: `0 0 ${BAR_GLOW.blur}px ${BAR_GLOW.spread}px ${alpha(colorPalette.main, BAR_GLOW.alpha)}`,
+    filter: `brightness(${GLOW_BRIGHTNESS})`
   },
   ...pulse && {
-    animation: `${pulseAnimation} 2s infinite`
+    animation: `${pulseAnimation} ${PULSE.durationMs / 1e3}s infinite`
   }
 });
 var circularEmphasisStyles = (colorPalette, glow, pulse) => ({
   ...glow && {
-    filter: `drop-shadow(0 0 8px ${alpha(colorPalette.main, 0.6)})`
+    filter: `drop-shadow(0 0 ${CIRCULAR_GLOW.blur}px ${alpha(colorPalette.main, CIRCULAR_GLOW.alpha)})`
   },
   ...pulse && {
-    animation: `${pulseAnimation} 2s infinite`
+    animation: `${pulseAnimation} ${PULSE.durationMs / 1e3}s infinite`
   }
 });
 
@@ -84,4 +97,4 @@ export {
   barEmphasisStyles,
   circularEmphasisStyles
 };
-//# sourceMappingURL=chunk-ZHEJLUCX.js.map
+//# sourceMappingURL=chunk-MHV5Y5MR.js.map

package/dist/chunk-MHV5Y5MR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Progress/Progress.styles.ts"],"sourcesContent":["import type { PaletteColor, CSSObject, Theme } from '@mui/material/styles/index.js';\nimport { alpha, keyframes } from '@mui/material/styles/index.js';\n\nimport {\n  BAR_GLOW,\n  CIRCULAR_GLOW,\n  GLASS_BAR_ALPHA,\n  GLASS_BAR_BORDER_ALPHA,\n  GLASS_BLUR_PX,\n  GLOW_BRIGHTNESS,\n  PROGRESS_SIZES,\n  PULSE,\n} from './Progress.metrics';\nimport type { ProgressSize, ProgressVariant } from './Progress.types';\nimport { px } from '../../../tokens/theme';\n\n// Define pulse animation. The stops and the two seconds are the shared metrics'\n// (`PULSE`), so the native `Progress` breathes on the same cadence.\nexport const pulseAnimation = keyframes`\n  0% {\n    opacity: 1;\n  }\n  50% {\n    opacity: ${PULSE.dip};\n  }\n  100% {\n    opacity: 1;\n  }\n`;\n\nexport const getColorFromTheme = (theme: Theme, color: string): PaletteColor => {\n  // Handle special case for neutral (grey) which is a Color, not PaletteColor\n  if (color === 'neutral') {\n    return {\n      light: theme.palette.grey[300],\n      main: theme.palette.grey[500],\n      dark: theme.palette.grey[700],\n      contrastText: theme.palette.getContrastText(theme.palette.grey[500]),\n    };\n  }\n\n  const colorMap: Record<string, PaletteColor> = {\n    primary: theme.palette.primary,\n    secondary: theme.palette.secondary,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    error: theme.palette.error,\n    info: theme.palette.info,\n    danger: theme.palette.error, // Add danger alias\n  };\n\n  // Ensure we always return a valid color object with main and dark properties\n  return colorMap[color] || theme.palette.primary;\n};\n\n// Derived from the shared metrics, not restated: the native `Progress` reads\n// the same table, so the two renderers cannot disagree on a size.\nconst SIZE_MAP: Record<ProgressSize, { height: number; circularSize: number; fontSize: string }> =\n  Object.fromEntries(\n    Object.entries(PROGRESS_SIZES).map(([size, step]) => [\n      size,\n      { height: step.height, circularSize: step.circularSize, fontSize: px(step.fontSize) },\n    ]),\n  ) as Record<ProgressSize, { height: number; circularSize: number; fontSize: string }>;\n\nexport const getSizeStyles = (size?: ProgressSize) => SIZE_MAP[size as ProgressSize] || SIZE_MAP.md;\n\nexport const barVariantStyles = (\n  variant: ProgressVariant | undefined,\n  colorPalette: PaletteColor,\n): CSSObject => {\n  switch (variant) {\n    case 'linear':\n      return { backgroundColor: colorPalette.main };\n    case 'gradient':\n      return {\n        background: `linear-gradient(90deg, ${colorPalette.main} 0%, ${colorPalette.dark || colorPalette.main} 100%)`,\n      };\n    case 'glass':\n      return {\n        backgroundColor: alpha(colorPalette.main, GLASS_BAR_ALPHA),\n        backdropFilter: `blur(${GLASS_BLUR_PX}px)`,\n        border: `1px solid ${alpha(colorPalette.main, GLASS_BAR_BORDER_ALPHA)}`,\n      };\n    default:\n      return {};\n  }\n};\n\n// glow and pulse are independent flags. The three combinations used to be spelled\n// out one by one, but each is just the union of whichever flags are set.\nexport const barEmphasisStyles = (\n  colorPalette: PaletteColor,\n  glow?: boolean,\n  pulse?: boolean,\n): CSSObject => ({\n  ...(glow && {\n    boxShadow: `0 0 ${BAR_GLOW.blur}px ${BAR_GLOW.spread}px ${alpha(colorPalette.main, BAR_GLOW.alpha)}`,\n    filter: `brightness(${GLOW_BRIGHTNESS})`,\n  }),\n  ...(pulse && {\n    animation: `${pulseAnimation} ${PULSE.durationMs / 1000}s infinite`,\n  }),\n});\n\nexport const circularEmphasisStyles = (\n  colorPalette: PaletteColor,\n  glow?: boolean,\n  pulse?: boolean,\n): CSSObject => ({\n  ...(glow && {\n    filter: `drop-shadow(0 0 ${CIRCULAR_GLOW.blur}px ${alpha(colorPalette.main, CIRCULAR_GLOW.alpha)})`,\n  }),\n  ...(pulse && {\n    animation: `${pulseAnimation} ${PULSE.durationMs / 1000}s infinite`,\n  }),\n});\n"],"mappings":";;;;;;;;;;;;;;;AACA,SAAS,OAAO,iBAAiB;AAiB1B,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,eAKf,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAOjB,IAAM,oBAAoB,CAAC,OAAc,UAAgC;AAE9E,MAAI,UAAU,WAAW;AACvB,WAAO;AAAA,MACL,OAAO,MAAM,QAAQ,KAAK,GAAG;AAAA,MAC7B,MAAM,MAAM,QAAQ,KAAK,GAAG;AAAA,MAC5B,MAAM,MAAM,QAAQ,KAAK,GAAG;AAAA,MAC5B,cAAc,MAAM,QAAQ,gBAAgB,MAAM,QAAQ,KAAK,GAAG,CAAC;AAAA,IACrE;AAAA,EACF;AAEA,QAAM,WAAyC;AAAA,IAC7C,SAAS,MAAM,QAAQ;AAAA,IACvB,WAAW,MAAM,QAAQ;AAAA,IACzB,SAAS,MAAM,QAAQ;AAAA,IACvB,SAAS,MAAM,QAAQ;AAAA,IACvB,OAAO,MAAM,QAAQ;AAAA,IACrB,MAAM,MAAM,QAAQ;AAAA,IACpB,QAAQ,MAAM,QAAQ;AAAA;AAAA,EACxB;AAGA,SAAO,SAAS,KAAK,KAAK,MAAM,QAAQ;AAC1C;AAIA,IAAM,WACJ,OAAO;AAAA,EACL,OAAO,QAAQ,cAAc,EAAE,IAAI,CAAC,CAAC,MAAM,IAAI,MAAM;AAAA,IACnD;AAAA,IACA,EAAE,QAAQ,KAAK,QAAQ,cAAc,KAAK,cAAc,UAAU,GAAG,KAAK,QAAQ,EAAE;AAAA,EACtF,CAAC;AACH;AAEK,IAAM,gBAAgB,CAAC,SAAwB,SAAS,IAAoB,KAAK,SAAS;AAE1F,IAAM,mBAAmB,CAC9B,SACA,iBACc;AACd,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,EAAE,iBAAiB,aAAa,KAAK;AAAA,IAC9C,KAAK;AACH,aAAO;AAAA,QACL,YAAY,0BAA0B,aAAa,IAAI,QAAQ,aAAa,QAAQ,aAAa,IAAI;AAAA,MACvG;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB,MAAM,aAAa,MAAM,eAAe;AAAA,QACzD,gBAAgB,QAAQ,aAAa;AAAA,QACrC,QAAQ,aAAa,MAAM,aAAa,MAAM,sBAAsB,CAAC;AAAA,MACvE;AAAA,IACF;AACE,aAAO,CAAC;AAAA,EACZ;AACF;AAIO,IAAM,oBAAoB,CAC/B,cACA,MACA,WACe;AAAA,EACf,GAAI,QAAQ;AAAA,IACV,WAAW,OAAO,SAAS,IAAI,MAAM,SAAS,MAAM,MAAM,MAAM,aAAa,MAAM,SAAS,KAAK,CAAC;AAAA,IAClG,QAAQ,cAAc,eAAe;AAAA,EACvC;AAAA,EACA,GAAI,SAAS;AAAA,IACX,WAAW,GAAG,cAAc,IAAI,MAAM,aAAa,GAAI;AAAA,EACzD;AACF;AAEO,IAAM,yBAAyB,CACpC,cACA,MACA,WACe;AAAA,EACf,GAAI,QAAQ;AAAA,IACV,QAAQ,mBAAmB,cAAc,IAAI,MAAM,MAAM,aAAa,MAAM,cAAc,KAAK,CAAC;AAAA,EAClG;AAAA,EACA,GAAI,SAAS;AAAA,IACX,WAAW,GAAG,cAAc,IAAI,MAAM,aAAa,GAAI;AAAA,EACzD;AACF;","names":[]}

package/dist/{chunk-MCRIT46W.js → chunk-MY5VNNSP.js}

@@ -1,3 +1,6 @@
+import {
+  panelSx
+} from "./chunk-6JZE4IIN.js";
 import {
   useSheetDrag,
   useSheetOpen
@@ -5,9 +8,6 @@ import {
 import {
   SheetBody
 } from "./chunk-M2K7BPHX.js";
-import {
-  panelSx
-} from "./chunk-6JZE4IIN.js";
 import {
   SheetOverlay
 } from "./chunk-POUWN4PX.js";
@@ -124,4 +124,4 @@ var Sheet = (props) => {
 export {
   Sheet
 };
-//# sourceMappingURL=chunk-MCRIT46W.js.map
+//# sourceMappingURL=chunk-MY5VNNSP.js.map

package/dist/{chunk-XELVDPKL.js → chunk-NFAKRI4S.js}

@@ -1,12 +1,12 @@
+import {
+  useMenubarMenus
+} from "./chunk-42VH7N5L.js";
 import {
   MenubarToolbar
 } from "./chunk-SX3V2DLV.js";
 import {
   barStyles
 } from "./chunk-ZU3SWR4I.js";
-import {
-  useMenubarMenus
-} from "./chunk-42VH7N5L.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -190,4 +190,4 @@ export {
   Menubar,
   MenubarGroup
 };
-//# sourceMappingURL=chunk-XELVDPKL.js.map
+//# sourceMappingURL=chunk-NFAKRI4S.js.map

package/dist/{chunk-KSF7TLXH.js → chunk-NHSMLVNC.js}

@@ -2,16 +2,16 @@ import {
   CategoryHeadRow,
   CategorySectionHeading,
   SubcategoryRow
-} from "./chunk-N4WANJI3.js";
-import {
-  categoryCheckState,
-  isLeafCategory
-} from "./chunk-LR6MSKTT.js";
+} from "./chunk-WBVHRLIS.js";
 import {
   emptySx,
   listSx,
   skeletonSx
 } from "./chunk-FCOEJCUP.js";
+import {
+  categoryCheckState,
+  isLeafCategory
+} from "./chunk-LR6MSKTT.js";
 
 // src/components/form/CategorySelect/CategoryPanelList.tsx
 import Box from "@mui/material/Box/index.js";
@@ -152,4 +152,4 @@ function CategoryPanelList(props) {
 export {
   CategoryPanelList
 };
-//# sourceMappingURL=chunk-KSF7TLXH.js.map
+//# sourceMappingURL=chunk-NHSMLVNC.js.map

package/dist/{chunk-ES2RN7YV.js → chunk-NRUYYGDZ.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-4T6W43TO.js";
 import {
   CategorySelect
-} from "./chunk-OAXAF4VY.js";
+} from "./chunk-LMJBINWN.js";
 
 // src/components/data-display/DataViews/data-views-category-pill.tsx
 import { jsx } from "react/jsx-runtime";
@@ -79,4 +79,4 @@ export {
   emitPillDiff,
   PillControl
 };
-//# sourceMappingURL=chunk-ES2RN7YV.js.map
+//# sourceMappingURL=chunk-NRUYYGDZ.js.map

package/dist/{chunk-ZGEBIC5X.js → chunk-OLVZ6TOV.js}

@@ -1,17 +1,21 @@
 import {
   getSizeStyles
-} from "./chunk-4Q7HWRR2.js";
+} from "./chunk-EZSEAYYT.js";
+import {
+  BADGE_CONTENT_GAP,
+  BADGE_SIZES
+} from "./chunk-KVEHH4SA.js";
+import {
+  px
+} from "./chunk-NQN5Z36J.js";
 
 // src/components/data-display/Badge/BadgeContent.tsx
 import CloseIcon from "@mui/icons-material/Close";
 import IconButton from "@mui/material/IconButton/index.js";
 import { jsx } from "react/jsx-runtime";
-var CLOSE_ICON_SIZES = {
-  xs: "0.5rem",
-  sm: "0.625rem",
-  md: "0.75rem",
-  lg: "0.875rem"
-};
+var CLOSE_ICON_SIZES = Object.fromEntries(
+  Object.entries(BADGE_SIZES).map(([size, metrics]) => [size, px(metrics.closeIconSize)])
+);
 var makeTestId = (dataTestId) => (suffix) => dataTestId ? `${dataTestId}-${suffix}` : `badge-${suffix}`;
 var BadgeIcon = ({
   icon,
@@ -75,10 +79,10 @@ var buildBadgeContent = ({
     );
   }
   if (parts.length === 0) return null;
-  return /* @__PURE__ */ jsx("span", { style: { display: "inline-flex", alignItems: "center", gap: "2px" }, children: parts });
+  return /* @__PURE__ */ jsx("span", { style: { display: "inline-flex", alignItems: "center", gap: `${BADGE_CONTENT_GAP}px` }, children: parts });
 };
 
 export {
   buildBadgeContent
 };
-//# sourceMappingURL=chunk-ZGEBIC5X.js.map
+//# sourceMappingURL=chunk-OLVZ6TOV.js.map

package/dist/chunk-OLVZ6TOV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Badge/BadgeContent.tsx"],"sourcesContent":["import CloseIcon from '@mui/icons-material/Close';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport type { FC, ReactNode } from 'react';\nimport React from 'react';\n\nimport { BADGE_CONTENT_GAP, BADGE_SIZES } from './Badge.metrics';\nimport { getSizeStyles } from './Badge.styles';\nimport type { BadgeSize } from './Badge.types';\nimport { px } from '../../../tokens/theme';\n\n// Derived from the shared metrics: `xl` takes `lg`'s glyph, which is what the\n// hand-written map did through its `?? CLOSE_ICON_SIZES.lg` fallback.\nconst CLOSE_ICON_SIZES: Record<string, string> = Object.fromEntries(\n  Object.entries(BADGE_SIZES).map(([size, metrics]) => [size, px(metrics.closeIconSize)]),\n);\n\nconst makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string): string =>\n    dataTestId ? `${dataTestId}-${suffix}` : `badge-${suffix}`;\n\nconst BadgeIcon: FC<{ icon: ReactNode; size: BadgeSize; testId: string }> = ({\n  icon,\n  size,\n  testId,\n}) => (\n  <span\n    key=\"icon\"\n    data-testid={testId}\n    style={{\n      fontSize: getSizeStyles(size).iconSize,\n      display: 'inline-flex',\n      alignItems: 'center',\n    }}\n  >\n    {icon}\n  </span>\n);\n\nconst BadgeCloseButton: FC<{ size: BadgeSize; testId: string; onClose: (e: React.MouseEvent) => void }> = ({\n  size,\n  testId,\n  onClose,\n}) => (\n  <IconButton\n    key=\"close\"\n    size=\"small\"\n    onClick={onClose}\n    data-testid={testId}\n    sx={{\n      p: 0,\n      ml: 0.5,\n      color: 'inherit',\n      '& svg': { fontSize: CLOSE_ICON_SIZES[size] ?? CLOSE_ICON_SIZES.lg },\n      '&:hover': { opacity: 0.8 },\n    }}\n  >\n    <CloseIcon />\n  </IconButton>\n);\n\n// The badge's inner run: optional icon, the content itself, optional close\n// button. A dot badge shows none of it.\nexport const buildBadgeContent = ({\n  variant,\n  size,\n  icon,\n  closable,\n  dataTestId,\n  baseContent,\n  onClose,\n}: {\n  variant: string;\n  size: BadgeSize;\n  icon?: ReactNode;\n  closable?: boolean;\n  dataTestId?: string;\n  baseContent: ReactNode;\n  onClose: (e: React.MouseEvent) => void;\n}): ReactNode => {\n  if (variant === 'dot') return '';\n\n  const testId = makeTestId(dataTestId);\n  const parts: ReactNode[] = [];\n\n  if (icon) parts.push(<BadgeIcon key=\"icon\" icon={icon} size={size} testId={testId('icon')} />);\n\n  if (baseContent !== null && baseContent !== undefined) {\n    parts.push(\n      <span key=\"content\" data-testid={testId('content')}>\n        {baseContent}\n      </span>,\n    );\n  }\n\n  if (closable && !variant.includes('dot')) {\n    parts.push(\n      <BadgeCloseButton key=\"close\" size={size} testId={testId('close')} onClose={onClose} />,\n    );\n  }\n\n  if (parts.length === 0) return null;\n\n  return (\n    <span style={{ display: 'inline-flex', alignItems: 'center', gap: `${BADGE_CONTENT_GAP}px` }}>{parts}</span>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA,OAAO,eAAe;AACtB,OAAO,gBAAgB;AAyBrB;AAdF,IAAM,mBAA2C,OAAO;AAAA,EACtD,OAAO,QAAQ,WAAW,EAAE,IAAI,CAAC,CAAC,MAAM,OAAO,MAAM,CAAC,MAAM,GAAG,QAAQ,aAAa,CAAC,CAAC;AACxF;AAEA,IAAM,aACJ,CAAC,eACD,CAAC,WACC,aAAa,GAAG,UAAU,IAAI,MAAM,KAAK,SAAS,MAAM;AAE5D,IAAM,YAAsE,CAAC;AAAA,EAC3E;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IAEC,eAAa;AAAA,IACb,OAAO;AAAA,MACL,UAAU,cAAc,IAAI,EAAE;AAAA,MAC9B,SAAS;AAAA,MACT,YAAY;AAAA,IACd;AAAA,IAEC;AAAA;AAAA,EARG;AASN;AAGF,IAAM,mBAAoG,CAAC;AAAA,EACzG;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IAEC,MAAK;AAAA,IACL,SAAS;AAAA,IACT,eAAa;AAAA,IACb,IAAI;AAAA,MACF,GAAG;AAAA,MACH,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,SAAS,EAAE,UAAU,iBAAiB,IAAI,KAAK,iBAAiB,GAAG;AAAA,MACnE,WAAW,EAAE,SAAS,IAAI;AAAA,IAC5B;AAAA,IAEA,8BAAC,aAAU;AAAA;AAAA,EAZP;AAaN;AAKK,IAAM,oBAAoB,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAQiB;AACf,MAAI,YAAY,MAAO,QAAO;AAE9B,QAAM,SAAS,WAAW,UAAU;AACpC,QAAM,QAAqB,CAAC;AAE5B,MAAI,KAAM,OAAM,KAAK,oBAAC,aAAqB,MAAY,MAAY,QAAQ,OAAO,MAAM,KAApD,MAAuD,CAAE;AAE7F,MAAI,gBAAgB,QAAQ,gBAAgB,QAAW;AACrD,UAAM;AAAA,MACJ,oBAAC,UAAmB,eAAa,OAAO,SAAS,GAC9C,yBADO,SAEV;AAAA,IACF;AAAA,EACF;AAEA,MAAI,YAAY,CAAC,QAAQ,SAAS,KAAK,GAAG;AACxC,UAAM;AAAA,MACJ,oBAAC,oBAA6B,MAAY,QAAQ,OAAO,OAAO,GAAG,WAA7C,OAA+D;AAAA,IACvF;AAAA,EACF;AAEA,MAAI,MAAM,WAAW,EAAG,QAAO;AAE/B,SACE,oBAAC,UAAK,OAAO,EAAE,SAAS,eAAe,YAAY,UAAU,KAAK,GAAG,iBAAiB,KAAK,GAAI,iBAAM;AAEzG;","names":[]}

package/dist/{chunk-MQUU2XZB.js → chunk-OQFSYMHJ.js}

@@ -1,6 +1,6 @@
 import {
   fadeInScaleAnimation
-} from "./chunk-HKFMPEXJ.js";
+} from "./chunk-HI2OFZSZ.js";
 
 // src/components/data-display/DataViews/card-surface.ts
 import { alpha, keyframes } from "@mui/material/styles/index.js";
@@ -143,4 +143,4 @@ export {
   isActionable,
   cardSurfaceStyles
 };
-//# sourceMappingURL=chunk-MQUU2XZB.js.map
+//# sourceMappingURL=chunk-OQFSYMHJ.js.map

package/dist/{chunk-M3RIC6JI.js → chunk-OQXOYHIV.js}

@@ -1,3 +1,6 @@
+import {
+  TextFieldSlim
+} from "./chunk-SL6454K7.js";
 import {
   SIZE_MAP,
   filledStyles,
@@ -8,9 +11,6 @@ import {
   outlinedStyles,
   pulseStyles
 } from "./chunk-RMSH2I3O.js";
-import {
-  TextFieldSlim
-} from "./chunk-SL6454K7.js";
 
 // src/components/form/Input/Input.tsx
 import CircularProgress from "@mui/material/CircularProgress/index.js";
@@ -102,4 +102,4 @@ Input.displayName = "Input";
 export {
   Input
 };
-//# sourceMappingURL=chunk-M3RIC6JI.js.map
+//# sourceMappingURL=chunk-OQXOYHIV.js.map

package/dist/{chunk-PC3ZFERM.js → chunk-PC5FFEIY.js}

@@ -10,7 +10,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Button
-} from "./chunk-SL4NFGOL.js";
+} from "./chunk-24BUCMQA.js";
 import {
   Text
 } from "./chunk-2PCOC3PT.js";
@@ -180,4 +180,4 @@ function MoreFilters({
 export {
   MoreFilters
 };
-//# sourceMappingURL=chunk-PC3ZFERM.js.map
+//# sourceMappingURL=chunk-PC5FFEIY.js.map

package/dist/{chunk-SOHDPFOB.js → chunk-PHCSPHDH.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-6DPAWXZ3.js";
 import {
   Button
-} from "./chunk-SL4NFGOL.js";
+} from "./chunk-24BUCMQA.js";
 import {
   Text
 } from "./chunk-2PCOC3PT.js";
@@ -170,4 +170,4 @@ function DataViewsExportMenu({
 export {
   DataViewsExportMenu
 };
-//# sourceMappingURL=chunk-SOHDPFOB.js.map
+//# sourceMappingURL=chunk-PHCSPHDH.js.map

package/dist/{chunk-OZWQNFG6.js → chunk-PODGTNXS.js}

@@ -1,12 +1,12 @@
 import {
   LoadingState
-} from "./chunk-IIOEQRXX.js";
+} from "./chunk-LAHDFBDE.js";
 import {
   ErrorState
 } from "./chunk-NQC6H7GY.js";
 import {
   EmptyState
-} from "./chunk-UXQW6ZIN.js";
+} from "./chunk-MBYO2F4Y.js";
 
 // src/components/data-display/AsyncStateContainer/AsyncStateContainer.tsx
 import Box from "@mui/material/Box/index.js";
@@ -65,4 +65,4 @@ export {
   AsyncStateContainer,
   AsyncStateContainer_default
 };
-//# sourceMappingURL=chunk-OZWQNFG6.js.map
+//# sourceMappingURL=chunk-PODGTNXS.js.map

package/dist/{chunk-IPE5FFFD.js → chunk-PUBPZOQJ.js}

@@ -1,6 +1,6 @@
 import {
   CalendarDayCell
-} from "./chunk-SHQWIDD5.js";
+} from "./chunk-GJQYM3PM.js";
 import {
   getMonthName
 } from "./chunk-TERT6TIS.js";
@@ -101,4 +101,4 @@ var CalendarMonth = ({
 export {
   CalendarMonth
 };
-//# sourceMappingURL=chunk-IPE5FFFD.js.map
+//# sourceMappingURL=chunk-PUBPZOQJ.js.map

package/dist/{chunk-GBFGZJB5.js → chunk-Q4NOI2CR.js}

@@ -1,13 +1,13 @@
-import {
-  STACK_BREAK
-} from "./chunk-DQHC5P64.js";
 import {
   CARD_RADIUS,
   cardSurfaceStyles,
   isActionable,
   isSelectable,
   slotTestIds
-} from "./chunk-MQUU2XZB.js";
+} from "./chunk-OQFSYMHJ.js";
+import {
+  STACK_BREAK
+} from "./chunk-DQHC5P64.js";
 import {
   useDragItem
 } from "./chunk-JCJGJX7V.js";
@@ -181,4 +181,4 @@ export {
   actionProps,
   rowStyles
 };
-//# sourceMappingURL=chunk-GBFGZJB5.js.map
+//# sourceMappingURL=chunk-Q4NOI2CR.js.map

package/dist/{chunk-IRDGC7FK.js → chunk-QZWKC3AP.js}

@@ -3,10 +3,15 @@ import {
   muiAnimationFor,
   muiVariantFor,
   skeletonStyles
-} from "./chunk-JZKOJZ6V.js";
+} from "./chunk-ZOW2CCMO.js";
 import {
-  resolveSkeletonProps
-} from "./chunk-HXYXDQ7U.js";
+  resolveSkeletonProps,
+  skeletonInstanceTestId
+} from "./chunk-7WDPC46N.js";
+import {
+  resolveTestId,
+  withoutTestIdProps
+} from "./chunk-QLWBQQW7.js";
 
 // src/components/layout/Skeleton/Skeleton.tsx
 import Box from "@mui/material/Box/index.js";
@@ -28,10 +33,11 @@ var Skeleton = React.memo((rawProps) => {
     intensity,
     glassmorphism,
     shimmer,
-    "data-testid": dataTestId,
     style,
-    ...props
+    ...others
   } = resolveSkeletonProps(rawProps);
+  const dataTestId = resolveTestId(others);
+  const props = withoutTestIdProps(others);
   const theme = useTheme();
   const defaults = defaultDimensions(variant);
   const finalWidth = width ?? defaults.width;
@@ -63,7 +69,7 @@ var Skeleton = React.memo((rawProps) => {
     return singleSkeleton;
   }
   return /* @__PURE__ */ jsx(Stack, { spacing, children: Array.from({ length: count }).map((_, index) => /* @__PURE__ */ jsx(Box, { children: React.cloneElement(singleSkeleton, {
-    "data-testid": dataTestId ? `${dataTestId}-${index}` : void 0
+    "data-testid": skeletonInstanceTestId(dataTestId, index)
   }) }, `skeleton-${index}`)) });
 });
 Skeleton.displayName = "Skeleton";
@@ -71,4 +77,4 @@ Skeleton.displayName = "Skeleton";
 export {
   Skeleton
 };
-//# sourceMappingURL=chunk-IRDGC7FK.js.map
+//# sourceMappingURL=chunk-QZWKC3AP.js.map

package/dist/chunk-QZWKC3AP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Skeleton/Skeleton.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport MuiSkeleton from '@mui/material/Skeleton/index.js';\nimport Stack from '@mui/material/Stack/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { resolveSkeletonProps, skeletonInstanceTestId } from './Skeleton.helpers';\nimport {\n  defaultDimensions,\n  muiAnimationFor,\n  muiVariantFor,\n  skeletonStyles,\n} from './Skeleton.styles';\nimport type { SkeletonProps } from './Skeleton.types';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\n\nexport const Skeleton: React.FC<SkeletonProps> = React.memo((rawProps) => {\n  const {\n    variant,\n    animation,\n    width,\n    height,\n    count,\n    spacing,\n    borderRadius,\n    className,\n    intensity,\n    glassmorphism,\n    shimmer,\n    style,\n    ...others\n  } = resolveSkeletonProps(rawProps);\n  // `testID` and `dataTestId` are the shared contract's spellings; the DOM\n  // wants `data-testid`, and must not see the other two as attributes.\n  const dataTestId = resolveTestId(others);\n  const props = withoutTestIdProps(others);\n  const theme = useTheme();\n\n  const defaults = defaultDimensions(variant);\n  const finalWidth = width ?? defaults.width;\n  const finalHeight = height ?? defaults.height;\n\n  // Handle edge case: count of 0 should render nothing\n  if (count === 0) {\n    return null;\n  }\n\n  const singleSkeleton = (\n    <MuiSkeleton\n      variant={muiVariantFor(variant)}\n      animation={muiAnimationFor(variant, animation)}\n      width={finalWidth}\n      height={finalHeight}\n      sx={skeletonStyles(theme, {\n        intensity,\n        borderRadius,\n        glassmorphism,\n        shimmer,\n        style,\n      })}\n      className={className}\n      data-testid={dataTestId}\n      aria-hidden=\"true\"\n      {...props}\n    />\n  );\n\n  if (count === 1) {\n    return singleSkeleton;\n  }\n\n  return (\n    <Stack spacing={spacing}>\n      {Array.from({ length: count }).map((_, index) => (\n        <Box key={`skeleton-${index}`}>\n          {React.cloneElement(singleSkeleton, {\n            'data-testid': skeletonInstanceTestId(dataTestId, index),\n          })}\n        </Box>\n      ))}\n    </Stack>\n  );\n});\n\nSkeleton.displayName = 'Skeleton';\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,iBAAiB;AACxB,OAAO,WAAW;AAClB,SAAS,gBAAgB;AACzB,OAAO,WAAW;AA4Cd;AAhCG,IAAM,WAAoC,MAAM,KAAK,CAAC,aAAa;AACxE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,qBAAqB,QAAQ;AAGjC,QAAM,aAAa,cAAc,MAAM;AACvC,QAAM,QAAQ,mBAAmB,MAAM;AACvC,QAAM,QAAQ,SAAS;AAEvB,QAAM,WAAW,kBAAkB,OAAO;AAC1C,QAAM,aAAa,SAAS,SAAS;AACrC,QAAM,cAAc,UAAU,SAAS;AAGvC,MAAI,UAAU,GAAG;AACf,WAAO;AAAA,EACT;AAEA,QAAM,iBACJ;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,cAAc,OAAO;AAAA,MAC9B,WAAW,gBAAgB,SAAS,SAAS;AAAA,MAC7C,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,IAAI,eAAe,OAAO;AAAA,QACxB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,MACD;AAAA,MACA,eAAa;AAAA,MACb,eAAY;AAAA,MACX,GAAG;AAAA;AAAA,EACN;AAGF,MAAI,UAAU,GAAG;AACf,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,SAAM,SACJ,gBAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,UACrC,oBAAC,OACE,gBAAM,aAAa,gBAAgB;AAAA,IAClC,eAAe,uBAAuB,YAAY,KAAK;AAAA,EACzD,CAAC,KAHO,YAAY,KAAK,EAI3B,CACD,GACH;AAEJ,CAAC;AAED,SAAS,cAAc;","names":[]}

package/dist/{chunk-GOWBYHYW.js → chunk-R6SBP5M5.js}

@@ -1,10 +1,10 @@
-import {
-  chartValueFormatter
-} from "./chunk-QVWNK4JO.js";
 import {
   getChartSpecRenderer,
   getRegisteredChartSpecTypes
 } from "./chunk-WKUA6P3W.js";
+import {
+  chartValueFormatter
+} from "./chunk-QVWNK4JO.js";
 
 // src/components/data-display/Chart/chart-spec.ts
 var CHART_SEMANTIC_COLORS = [
@@ -149,4 +149,4 @@ export {
   parseChartSpec,
   specToChartProps
 };
-//# sourceMappingURL=chunk-GOWBYHYW.js.map
+//# sourceMappingURL=chunk-R6SBP5M5.js.map

package/dist/{chunk-DTKMBI7B.js → chunk-R7MX5KPJ.js}

@@ -1,12 +1,12 @@
+import {
+  ScrollAreaContent
+} from "./chunk-4OEKIFBC.js";
 import {
   resolveScrollAreaProps
 } from "./chunk-RHIDWUK7.js";
 import {
   ScrollViewport
 } from "./chunk-C53C7C2X.js";
-import {
-  ScrollAreaContent
-} from "./chunk-4OEKIFBC.js";
 
 // src/components/layout/ScrollArea/ScrollArea.tsx
 import KeyboardArrowUp from "@mui/icons-material/KeyboardArrowUp";
@@ -237,4 +237,4 @@ var ScrollArea = (componentProps) => {
 export {
   ScrollArea
 };
-//# sourceMappingURL=chunk-DTKMBI7B.js.map
+//# sourceMappingURL=chunk-R7MX5KPJ.js.map

package/dist/{chunk-NECUCG2S.js → chunk-RQDN4BN5.js}

@@ -1,38 +1,38 @@
-import {
-  FilterDialog,
-  GridFilterPanel
-} from "./chunk-CLNTJM3F.js";
 import {
   DataViewsEmpty
-} from "./chunk-ISSJNFJV.js";
+} from "./chunk-C52BELLW.js";
 import {
   InlineFilterControls
-} from "./chunk-C6XESZ3R.js";
+} from "./chunk-B2A4DG77.js";
 import {
   GridHeaderRow
 } from "./chunk-ENNW5SKT.js";
 import {
   GridMain
-} from "./chunk-AP4FLCLA.js";
+} from "./chunk-J54WH74M.js";
+import {
+  FilterDialog,
+  GridFilterPanel
+} from "./chunk-M7OHXNLF.js";
 import {
   DataViewsPagination
-} from "./chunk-HP2ODXNA.js";
+} from "./chunk-VR5HDUBK.js";
 import {
   toOverflowFields,
   useFilterOverflow
 } from "./chunk-TQ6FPOPD.js";
-import {
-  resolveSelectionExtra
-} from "./chunk-KX75HM5U.js";
 import {
   ScopeTabsSlot
 } from "./chunk-Y5UCOBQN.js";
 import {
   ShellToolbar
-} from "./chunk-LIOVN5IM.js";
+} from "./chunk-F2DOTCF3.js";
+import {
+  resolveSelectionExtra
+} from "./chunk-KX75HM5U.js";
 import {
   togglePillValues
-} from "./chunk-YLDS5FOQ.js";
+} from "./chunk-KZSKI2R3.js";
 import {
   DataViewsLayoutProvider,
   useDataViewsLayout
@@ -237,4 +237,4 @@ function GridShell(props) {
 export {
   GridShell
 };
-//# sourceMappingURL=chunk-NECUCG2S.js.map
+//# sourceMappingURL=chunk-RQDN4BN5.js.map