@12-apps/ui 6.34.0 → 6.36.0

package/src/components/typography/Code/Code.tsx

@@ -8,6 +8,7 @@ import React, { useState } from 'react';
 
 import type { CodeProps } from './Code.types';
 import { modeInk, neutralTones } from '../../../tokens/ink';
+import { rem } from '../../../tokens/relative';
 
 const StyledCodeContainer = styled(Box, {
   shouldForwardProp: (prop) =>
@@ -20,17 +21,17 @@ const StyledCodeContainer = styled(Box, {
 }>(({ theme, customVariant = 'inline', customSize = 'md', copyable }) => {
   // Size mapping
   const sizeMap = {
-    xs: { fontSize: '0.75rem', padding: '2px 4px' },
-    sm: { fontSize: '0.8125rem', padding: '3px 6px' },
-    md: { fontSize: '0.875rem', padding: '4px 8px' },
-    lg: { fontSize: '1rem', padding: '6px 12px' },
+    xs: { fontSize: rem(theme, 12), padding: '2px 4px' },
+    sm: { fontSize: rem(theme, 13), padding: '3px 6px' },
+    md: { fontSize: rem(theme, 14), padding: '4px 8px' },
+    lg: { fontSize: rem(theme, 16), padding: '6px 12px' },
   };
 
   const blockSizeMap = {
-    xs: { fontSize: '0.75rem', padding: '8px 12px' },
-    sm: { fontSize: '0.8125rem', padding: '12px 16px' },
-    md: { fontSize: '0.875rem', padding: '16px 20px' },
-    lg: { fontSize: '1rem', padding: '20px 24px' },
+    xs: { fontSize: rem(theme, 12), padding: '8px 12px' },
+    sm: { fontSize: rem(theme, 13), padding: '12px 16px' },
+    md: { fontSize: rem(theme, 14), padding: '16px 20px' },
+    lg: { fontSize: rem(theme, 16), padding: '20px 24px' },
   };
 
   const baseStyles = {
@@ -121,7 +122,7 @@ const CopyButton = styled(IconButton)(({ theme }) => ({
     transform: 'scale(1.05)',
   },
   '& .MuiSvgIcon-root': {
-    fontSize: 16,
+    fontSize: rem(theme, 16),
   },
 }));
 
@@ -129,7 +130,7 @@ const LanguageLabel = styled(Box)(({ theme }) => ({
   position: 'absolute',
   top: theme.spacing(1),
   left: theme.spacing(2),
-  fontSize: '0.75rem',
+  fontSize: rem(theme, 12),
   fontWeight: 500,
   color: alpha(theme.palette.text.primary, 0.6),
   backgroundColor:

package/src/components/typography/Paragraph/Paragraph.tsx

@@ -16,7 +16,8 @@ import {
 } from './Paragraph.metrics';
 import type { ParagraphProps } from './Paragraph.types';
 import { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';
-import { px } from '../../../tokens/theme';
+import { rem } from '../../../tokens/relative';
+import type { UiTypeStep } from '../../../tokens/theme';
 
 const getColorFromTheme = (theme: Theme, color: string) => {
   if (color === 'neutral') {
@@ -37,17 +38,20 @@ const getColorFromTheme = (theme: Theme, color: string) => {
 
 // Derived from the shared metrics, not restated: the native `Paragraph` reads
 // the same table, so the two renderers cannot disagree on a size.
-const sizeMap: Record<string, { fontSize: string; lineHeight: number }> = Object.fromEntries(
-  Object.entries(PARAGRAPH_SIZES).map(([size, step]) => [
-    size,
-    { fontSize: px(step.fontSize), lineHeight: step.lineHeight },
-  ]),
-);
+// The table keeps the design px; the size is converted where it is read.
+const sizeMap: Readonly<Record<string, UiTypeStep | undefined>> = PARAGRAPH_SIZES;
+
+const sizeStyles = (theme: Theme, customSize: string): CSSObject => {
+  const step = sizeMap[customSize];
+  return step ? { fontSize: rem(theme, step.fontSize), lineHeight: step.lineHeight } : {};
+};
 
 // `lead` and `small` shrink or grow relative to the scale, but only at the
 // default size — an explicit size wins.
-const sizeOverride = (customSize: string, atDefault: number): string | undefined =>
-  customSize === 'md' ? px(atDefault) : sizeMap[customSize]?.fontSize;
+const sizeOverride = (theme: Theme, customSize: string, atDefault: number): string | undefined => {
+  const drawnAt = customSize === 'md' ? atDefault : sizeMap[customSize]?.fontSize;
+  return drawnAt === undefined ? undefined : rem(theme, drawnAt);
+};
 
 const StyledParagraph = styled(Typography, {
   shouldForwardProp: (prop) =>
@@ -63,7 +67,7 @@ const StyledParagraph = styled(Typography, {
     fontFamily: theme.typography.body1.fontFamily,
     margin: `0 0 ${PARAGRAPH_MARGIN_BOTTOM_EM}em 0`,
     transition: 'all 0.2s ease',
-    ...sizeMap[customSize],
+    ...sizeStyles(theme, customSize),
   };
 
   // Variant-specific styles
@@ -77,7 +81,7 @@ const StyledParagraph = styled(Typography, {
       ...baseStyles,
       color: textColor,
       fontWeight: PARAGRAPH_FONT_WEIGHT,
-      fontSize: sizeOverride(customSize, LEAD_FONT_SIZE),
+      fontSize: sizeOverride(theme, customSize, LEAD_FONT_SIZE),
       lineHeight: LEAD_LINE_HEIGHT,
       letterSpacing: `${LEAD_LETTER_SPACING_EM}em`,
     },
@@ -90,7 +94,7 @@ const StyledParagraph = styled(Typography, {
     small: {
       ...baseStyles,
       color: theme.palette.text.secondary,
-      fontSize: sizeOverride(customSize, SMALL_FONT_SIZE),
+      fontSize: sizeOverride(theme, customSize, SMALL_FONT_SIZE),
       fontWeight: PARAGRAPH_FONT_WEIGHT,
       lineHeight: SMALL_LINE_HEIGHT,
     },

package/src/components/typography/Text/Text.tsx

@@ -22,7 +22,8 @@ import {
 import type { TextProps } from './Text.types';
 import { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';
 import type { ColorValue } from '../../../tokens/scales';
-import { px } from '../../../tokens/theme';
+import { rem } from '../../../tokens/relative';
+import type { UiTypeStep } from '../../../tokens/theme';
 
 const getColorFromTheme = (theme: Theme, color: ColorValue): string => {
   if (color === 'neutral') {
@@ -50,12 +51,13 @@ const getColorFromTheme = (theme: Theme, color: ColorValue): string => {
 
 // Derived from the shared metrics, not restated: the native `Text` reads the
 // same table, so the two renderers cannot disagree on a size.
-const SIZE_MAP: Record<string, { fontSize: string; lineHeight: number }> = Object.fromEntries(
-  Object.entries(TEXT_SIZES).map(([size, step]) => [
-    size,
-    { fontSize: px(step.fontSize), lineHeight: step.lineHeight },
-  ]),
-);
+// The table keeps the design px; the size is converted where it is read.
+const SIZE_MAP: Readonly<Record<string, UiTypeStep | undefined>> = TEXT_SIZES;
+
+const fontSizeFor = (theme: Theme, customSize: string | undefined): string | undefined => {
+  const drawnAt = SIZE_MAP[customSize ?? 'md']?.fontSize;
+  return drawnAt === undefined ? undefined : rem(theme, drawnAt);
+};
 
 const WEIGHT_MAP: Record<string, number> = TEXT_WEIGHTS;
 
@@ -77,7 +79,7 @@ const decorationFor = (underline?: boolean, strikethrough?: boolean): string =>
 
 const baseTextStyles = (theme: Theme, a: TextStyleArgs): CSSObject => ({
   color: getColorFromTheme(theme, a.customColor ?? 'neutral'),
-  fontSize: SIZE_MAP[a.customSize ?? 'md']?.fontSize,
+  fontSize: fontSizeFor(theme, a.customSize),
   lineHeight: SIZE_MAP[a.customSize ?? 'md']?.lineHeight,
   fontWeight: WEIGHT_MAP[a.customWeight ?? 'normal'],
   fontStyle: a.italic ? 'italic' : 'normal',
@@ -87,8 +89,12 @@ const baseTextStyles = (theme: Theme, a: TextStyleArgs): CSSObject => ({
 
 // Captions and code shrink relative to the body scale, but only at the default
 // size — an explicit size wins.
-const sizeOverride = (customSize: string | undefined, atDefault: string): string | undefined =>
-  (customSize ?? 'md') === 'md' ? atDefault : SIZE_MAP[customSize ?? 'md']?.fontSize;
+const sizeOverride = (
+  theme: Theme,
+  customSize: string | undefined,
+  atDefault: number,
+): string | undefined =>
+  (customSize ?? 'md') === 'md' ? rem(theme, atDefault) : fontSizeFor(theme, customSize);
 
 const textVariantStyles = (theme: Theme, a: TextStyleArgs, base: CSSObject): CSSObject => {
   const weight = a.customWeight ?? 'normal';
@@ -104,7 +110,7 @@ const textVariantStyles = (theme: Theme, a: TextStyleArgs, base: CSSObject): CSS
     case 'caption':
       return {
         ...base,
-        fontSize: sizeOverride(a.customSize, px(CAPTION_FONT_SIZE)),
+        fontSize: sizeOverride(theme, a.customSize, CAPTION_FONT_SIZE),
         opacity: CAPTION_OPACITY,
         letterSpacing: `${CAPTION_LETTER_SPACING_EM}em`,
       };
@@ -112,7 +118,7 @@ const textVariantStyles = (theme: Theme, a: TextStyleArgs, base: CSSObject): CSS
       return {
         ...base,
         fontFamily: 'Monaco, Menlo, "Ubuntu Mono", "Courier New", monospace',
-        fontSize: sizeOverride(a.customSize, px(CODE_FONT_SIZE)),
+        fontSize: sizeOverride(theme, a.customSize, CODE_FONT_SIZE),
         backgroundColor: alpha(theme.palette.primary.main, CODE_BACKGROUND_ALPHA),
         padding: `${CODE_PADDING.vertical}px ${CODE_PADDING.horizontal}px`,
         borderRadius: theme.shape.borderRadius * CODE_RADIUS_FACTOR,

package/src/components/utility/AnimatedIcon/AnimatedIcon.styles.ts

@@ -23,13 +23,15 @@ import {
 } from './AnimatedIcon.animations';
 import type { AnimationSize, AnimationVariant } from './AnimatedIcon.types';
 import { neutralTones, shadowInk, sheen } from '../../../tokens/ink';
+import { rem } from '../../../tokens/relative';
 
-export const sizeConfigs: Record<AnimationSize, { size: number; fontSize: number }> = {
-  xs: { size: 12, fontSize: 10 },
-  sm: { size: 24, fontSize: 20 },
-  md: { size: 32, fontSize: 28 },
-  lg: { size: 48, fontSize: 44 },
-  xl: { size: 64, fontSize: 60 },
+/** Per size: the ring's edge and the glyph's edge (its font size, width and height), in design px. */
+export const sizeConfigs: Record<AnimationSize, { size: number; glyph: number }> = {
+  xs: { size: 12, glyph: 10 },
+  sm: { size: 24, glyph: 20 },
+  md: { size: 32, glyph: 28 },
+  lg: { size: 48, glyph: 44 },
+  xl: { size: 64, glyph: 60 },
 };
 
 /**
@@ -185,7 +187,7 @@ export const iconSx = (theme: Theme, flags: IconStyleFlags): CSSObject => {
 
   // Both selectors size the same glyph — MUI icons render an MuiSvgIcon-root,
   // a bare child renders an svg.
-  const glyphSize = { fontSize: $fontSize, width: $fontSize, height: $fontSize };
+  const glyphSize = { fontSize: rem(theme, $fontSize), width: $fontSize, height: $fontSize };
 
   return {
     display: 'inline-flex',

package/src/components/utility/AnimatedIcon/AnimatedIcon.tsx

@@ -43,7 +43,7 @@ export const AnimatedIcon: FC<AnimatedIconProps> = (props) => {
   return (
     <AnimationContainer
       $size={config.size}
-      $fontSize={config.fontSize}
+      $fontSize={config.glyph}
       $animationVariant={variant}
       $duration={duration}
       $delay={delay}

package/src/components/utility/WorkflowStep/WorkflowStep.parts.tsx

@@ -12,6 +12,7 @@ import type {
   WorkflowStepProps,
 } from './WorkflowStep.types';
 import { neutralTones } from '../../../tokens/ink';
+import { rem } from '../../../tokens/relative';
 
 // `outlined` shows the surface through a coloured rim; the other three fill it and
 // differ only in what border they keep.
@@ -84,7 +85,7 @@ const StepIndicator = styled(Box, {
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',
-    fontSize: theme.typography.caption.fontSize,
+    fontSize: rem(theme, 12),
     fontWeight: theme.typography.fontWeightMedium,
     cursor: interactive && !disabled ? 'pointer' : 'default',
     transition: animated
@@ -134,7 +135,7 @@ const StepContent = styled(Box, {
   flex: 1,
 
   '& .step-title': {
-    fontSize: theme.typography.body2.fontSize,
+    fontSize: rem(theme, 14),
     fontWeight: theme.typography.fontWeightMedium,
     color: theme.palette.text.primary,
     marginBottom: theme.spacing(0.5),
@@ -145,7 +146,7 @@ const StepContent = styled(Box, {
   },
 
   '& .step-description': {
-    fontSize: theme.typography.caption.fontSize,
+    fontSize: rem(theme, 12),
     color: theme.palette.text.secondary,
     overflow: 'hidden',
     textOverflow: 'ellipsis',

package/src/icons/Icon.tsx

@@ -5,6 +5,7 @@ import { iconFill } from './icon-color';
 import { iconSize, type IconBaseProps } from './Icon.types';
 import { ICON_PATHS } from './paths.generated';
 import { resolveTestId } from '../platform/test-id';
+import { sxRem } from '../tokens/relative';
 import { useUiTheme } from '../provider/use-ui-theme';
 
 export interface IconProps extends IconBaseProps {
@@ -20,7 +21,6 @@ export interface IconProps extends IconBaseProps {
 export const Icon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ name, size, color, label, className, style, ...rest }, ref) => {
     const theme = useUiTheme();
-    const px = iconSize(size);
     const fill = iconFill(theme, color, 'currentColor');
     const testId = resolveTestId(rest, `icon-${name}`);
 
@@ -30,7 +30,7 @@ export const Icon = React.forwardRef<SVGSVGElement, IconProps>(
         viewBox="0 0 24 24"
         className={className}
         style={style}
-        sx={{ fontSize: px, color: fill }}
+        sx={{ fontSize: sxRem(iconSize(size)), color: fill }}
         titleAccess={label}
         aria-hidden={label ? undefined : true}
         data-testid={testId}

package/dist/chunk-23FCBIUN.js

@@ -1,288 +0,0 @@
-import {
-  tableStyles
-} from "./chunk-P2PDDFMM.js";
-import {
-  TABLE_DEFAULTS,
-  definedProps
-} from "./chunk-MTFCPPZ5.js";
-import {
-  EmptyRow,
-  NoDataPlaceholder
-} from "./chunk-XIXR2L3L.js";
-import {
-  EnhancedTableBody,
-  EnhancedTableHeader
-} from "./chunk-ULTOQ6ZV.js";
-import {
-  useTableSelection
-} from "./chunk-DF4K5XVW.js";
-
-// src/components/data-display/Table/Table.tsx
-import MoreVertIcon from "@mui/icons-material/MoreVert";
-import Box from "@mui/material/Box/index.js";
-import FormControlLabel from "@mui/material/FormControlLabel/index.js";
-import IconButton from "@mui/material/IconButton/index.js";
-import Menu from "@mui/material/Menu/index.js";
-import MenuItem from "@mui/material/MenuItem/index.js";
-import Skeleton from "@mui/material/Skeleton/index.js";
-import Switch from "@mui/material/Switch/index.js";
-import MuiTable from "@mui/material/Table/index.js";
-import TableBody from "@mui/material/TableBody/index.js";
-import TableCell from "@mui/material/TableCell/index.js";
-import TableContainer from "@mui/material/TableContainer/index.js";
-import TableRow from "@mui/material/TableRow/index.js";
-import { styled } from "@mui/material/styles/index.js";
-import React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var StyledTableContainer = styled(TableContainer, {
-  shouldForwardProp: (prop) => !["virtualScrolling", "containerHeight"].includes(prop)
-})(({ virtualScrolling, containerHeight }) => ({
-  ...virtualScrolling && {
-    height: containerHeight || 400,
-    overflow: "auto"
-  }
-}));
-var StyledTable = styled(MuiTable, {
-  shouldForwardProp: (prop) => !["customVariant", "glow", "pulse", "hoverable", "density", "stickyHeader", "stripeColor"].includes(prop)
-})(({ theme, customVariant, glow, pulse, hoverable, density, stickyHeader, stripeColor = "neutral" }) => {
-  return tableStyles({
-    theme,
-    customVariant,
-    glow,
-    pulse,
-    hoverable,
-    density,
-    stickyHeader,
-    stripeColor
-  });
-});
-var TableShell = ({
-  innerRef,
-  variant,
-  stripeColor,
-  glow,
-  pulse,
-  hoverable,
-  density,
-  stickyHeader,
-  header,
-  rest,
-  children
-}) => /* @__PURE__ */ jsx(StyledTableContainer, { children: /* @__PURE__ */ jsxs(
-  StyledTable,
-  {
-    ref: innerRef,
-    customVariant: variant,
-    stripeColor,
-    glow,
-    pulse,
-    hoverable,
-    density,
-    stickyHeader,
-    ...rest,
-    children: [
-      header,
-      children
-    ]
-  }
-) });
-var SKELETON_ROW_COUNT = 5;
-var LoadingSkeletonRows = ({ columns }) => /* @__PURE__ */ jsx(Fragment, { children: Array.from({ length: SKELETON_ROW_COUNT }, (_, index) => /* @__PURE__ */ jsx(TableRow, { children: columns?.map((column) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { height: 20 }) }, column.key)) }, index)) });
-var ColumnToggleMenu = ({ columns, hiddenColumns, anchor, setAnchor, setHiddenColumns }) => /* @__PURE__ */ jsxs(Box, { position: "absolute", top: 8, right: 8, children: [
-  /* @__PURE__ */ jsx(IconButton, { onClick: (event) => setAnchor(event.currentTarget), size: "small", children: /* @__PURE__ */ jsx(MoreVertIcon, {}) }),
-  /* @__PURE__ */ jsx(Menu, { anchorEl: anchor, open: Boolean(anchor), onClose: () => setAnchor(null), children: columns.map((column, index) => /* @__PURE__ */ jsx(MenuItem, { children: /* @__PURE__ */ jsx(
-    FormControlLabel,
-    {
-      control: /* @__PURE__ */ jsx(
-        Switch,
-        {
-          checked: !hiddenColumns.includes(index),
-          onChange: (event) => setHiddenColumns(
-            event.target.checked ? hiddenColumns.filter((i) => i !== index) : [...hiddenColumns, index]
-          ),
-          size: "small"
-        }
-      ),
-      label: column.label
-    }
-  ) }, column.key)) })
-] });
-var columnsFor = (resolved, selection) => (resolved.responsive ? selection.visibleColumns : resolved.columns) ?? [];
-var showsColumnToggle = (resolved, selection) => Boolean(
-  resolved.responsive && selection.isMobile && resolved.showColumnToggle && selection.hiddenColumns.length > 0
-);
-var AdvancedTable = ({ resolved: p, selection, innerRef, rest }) => {
-  const finalColumns = columnsFor(p, selection);
-  const showToggle = showsColumnToggle(p, selection);
-  return /* @__PURE__ */ jsxs(Box, { position: "relative", children: [
-    /* @__PURE__ */ jsx(
-      StyledTableContainer,
-      {
-        virtualScrolling: p.virtualScrolling,
-        containerHeight: p.containerHeight,
-        children: /* @__PURE__ */ jsxs(
-          StyledTable,
-          {
-            ref: innerRef,
-            customVariant: p.variant,
-            stripeColor: p.stripeColor,
-            glow: p.glow,
-            pulse: p.pulse,
-            hoverable: p.hoverable,
-            density: p.density,
-            stickyHeader: p.stickyHeader,
-            ...rest,
-            children: [
-              /* @__PURE__ */ jsx(
-                EnhancedTableHeader,
-                {
-                  columns: finalColumns,
-                  data: p.data ?? [],
-                  sortable: p.sortable,
-                  sortConfig: p.sortConfig,
-                  onSortChange: p.onSortChange,
-                  selectable: p.selectable,
-                  selectedRows: p.selectedRows,
-                  onSelectAll: selection.handleSelectAll,
-                  density: p.density,
-                  stickyHeader: p.stickyHeader
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                EnhancedTableBody,
-                {
-                  data: p.data ?? [],
-                  columns: finalColumns,
-                  selectedRows: p.selectedRows,
-                  onRowClick: p.onRowClick,
-                  onRowFocus: p.onRowFocus,
-                  onRowBlur: p.onRowBlur,
-                  onSelectionChange: selection.handleSelectionChange,
-                  rowKeyExtractor: p.rowKeyExtractor,
-                  density: p.density,
-                  selectable: p.selectable,
-                  hoverable: p.hoverable,
-                  renderRow: p.renderRow,
-                  renderCell: p.renderCell,
-                  virtualScrolling: p.virtualScrolling,
-                  containerHeight: typeof p.containerHeight === "number" ? p.containerHeight : void 0,
-                  rowHeight: p.rowHeight,
-                  overscan: p.overscan
-                }
-              )
-            ]
-          }
-        )
-      }
-    ),
-    showToggle && /* @__PURE__ */ jsx(
-      ColumnToggleMenu,
-      {
-        columns: p.columns ?? [],
-        hiddenColumns: selection.hiddenColumns,
-        anchor: selection.columnMenuAnchor,
-        setAnchor: selection.setColumnMenuAnchor,
-        setHiddenColumns: selection.setHiddenColumns
-      }
-    )
-  ] });
-};
-var buildShell = ({
-  resolved,
-  selection,
-  innerRef,
-  rest,
-  finalColumns
-}) => ({
-  innerRef,
-  variant: resolved.variant,
-  stripeColor: resolved.stripeColor,
-  glow: resolved.glow,
-  pulse: resolved.pulse,
-  hoverable: resolved.hoverable,
-  density: resolved.density,
-  stickyHeader: resolved.stickyHeader,
-  header: resolved.columns ? /* @__PURE__ */ jsx(
-    EnhancedTableHeader,
-    {
-      columns: finalColumns ?? [],
-      data: [],
-      sortable: resolved.sortable,
-      sortConfig: resolved.sortConfig,
-      onSortChange: resolved.onSortChange,
-      selectable: resolved.selectable,
-      selectedRows: resolved.selectedRows,
-      onSelectAll: selection.handleSelectAll,
-      density: resolved.density,
-      stickyHeader: resolved.stickyHeader
-    }
-  ) : null,
-  rest
-});
-var TableLoadingState = ({ shell, loadingComponent, columns }) => /* @__PURE__ */ jsx(TableShell, { ...shell, children: /* @__PURE__ */ jsx(TableBody, { "data-testid": "table-loading", children: loadingComponent || /* @__PURE__ */ jsx(LoadingSkeletonRows, { columns }) }) });
-var TableEmptyState = ({ shell, emptyStateComponent, emptyText, colSpan }) => /* @__PURE__ */ jsx(TableShell, { ...shell, children: /* @__PURE__ */ jsx(EmptyRow, { colSpan, children: emptyStateComponent || /* @__PURE__ */ jsx(NoDataPlaceholder, { emptyText }) }) });
-var Table = React.forwardRef(
-  (tableProps, ref) => {
-    const resolved = { ...TABLE_DEFAULTS, ...definedProps(tableProps) };
-    const {
-      columns,
-      data,
-      responsive,
-      loading,
-      loadingComponent,
-      emptyStateComponent,
-      emptyText,
-      children,
-      ...props
-    } = resolved;
-    const selection = useTableSelection({
-      columns,
-      data,
-      responsive,
-      columnPriorities: resolved.columnPriorities,
-      selectedRows: resolved.selectedRows ?? [],
-      rowKeyExtractor: resolved.rowKeyExtractor,
-      onSelectionChange: resolved.onSelectionChange
-    });
-    const rest = props;
-    const renderer = { resolved, selection, innerRef: ref, rest };
-    const finalColumns = responsive ? selection.visibleColumns : columns;
-    const shell = buildShell({ ...renderer, finalColumns });
-    if (loading) {
-      return /* @__PURE__ */ jsx(TableLoadingState, { shell, loadingComponent, columns });
-    }
-    if (data && data.length === 0) {
-      return /* @__PURE__ */ jsx(
-        TableEmptyState,
-        {
-          shell,
-          emptyStateComponent,
-          emptyText,
-          colSpan: finalColumns?.length || 1
-        }
-      );
-    }
-    if (columns && data) return /* @__PURE__ */ jsx(AdvancedTable, { ...renderer });
-    return /* @__PURE__ */ jsx(
-      StyledTable,
-      {
-        ref,
-        customVariant: resolved.variant,
-        stripeColor: resolved.stripeColor,
-        glow: resolved.glow,
-        pulse: resolved.pulse,
-        hoverable: resolved.hoverable,
-        density: resolved.density,
-        stickyHeader: resolved.stickyHeader,
-        ...rest,
-        children
-      }
-    );
-  }
-);
-Table.displayName = "Table";
-
-export {
-  Table
-};
-//# sourceMappingURL=chunk-23FCBIUN.js.map

package/dist/chunk-23FCBIUN.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/Table/Table.tsx"],"sourcesContent":["import MoreVertIcon from '@mui/icons-material/MoreVert';\nimport Box from '@mui/material/Box/index.js';\nimport FormControlLabel from '@mui/material/FormControlLabel/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Menu from '@mui/material/Menu/index.js';\nimport MenuItem from '@mui/material/MenuItem/index.js';\nimport Skeleton from '@mui/material/Skeleton/index.js';\nimport Switch from '@mui/material/Switch/index.js';\nimport MuiTable from '@mui/material/Table/index.js';\nimport TableBody from '@mui/material/TableBody/index.js';\nimport TableCell from '@mui/material/TableCell/index.js';\nimport TableContainer from '@mui/material/TableContainer/index.js';\nimport TableRow from '@mui/material/TableRow/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type {\n  ColumnConfig,\n  TableDensity,\n  TableProps,\n  TableStripeColor} from './Table.types';\nimport { TABLE_DEFAULTS, definedProps } from './Table.helpers';\nimport { useTableSelection } from './Table.hooks';\nimport { EnhancedTableBody, EnhancedTableHeader } from './TableParts';\nimport { EmptyRow, NoDataPlaceholder } from './TableStates';\nimport {\n  tableStyles } from './Table.styles';\n\n// Define pulse animation\nconst StyledTableContainer = styled(TableContainer, {\n  shouldForwardProp: (prop) => !['virtualScrolling', 'containerHeight'].includes(prop as string) })<{ \n  virtualScrolling?: boolean; \n  containerHeight?: number | string;\n}>(({ virtualScrolling, containerHeight }) => ({\n  ...(virtualScrolling && {\n    height: containerHeight || 400,\n    overflow: 'auto' }) }));\n\n// Helper function to get stripe color from theme\nconst StyledTable = styled(MuiTable, {\n  shouldForwardProp: (prop) =>\n    !['customVariant', 'glow', 'pulse', 'hoverable', 'density', 'stickyHeader', 'stripeColor'].includes(prop as string) })<{\n  customVariant?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  hoverable?: boolean;\n  density?: TableDensity;\n  stickyHeader?: boolean;\n  stripeColor?: TableStripeColor;\n}>(({ theme, customVariant, glow, pulse, hoverable, density, stickyHeader, stripeColor = 'neutral' }) => {\n  return tableStyles({\n    theme,\n    customVariant,\n    glow,\n    pulse,\n    hoverable,\n    density,\n    stickyHeader,\n    stripeColor });\n});\n\n// Virtual Scrolling Hook\nconst TableShell: React.FC<{\n  innerRef: React.Ref<globalThis.HTMLTableElement>;\n  variant?: string;\n  stripeColor?: TableStripeColor;\n  glow?: boolean;\n  pulse?: boolean;\n  hoverable?: boolean;\n  density?: TableDensity;\n  stickyHeader?: boolean;\n  header: React.ReactNode;\n  rest: Record<string, unknown>;\n  children: React.ReactNode;\n}> = ({\n  innerRef,\n  variant,\n  stripeColor,\n  glow,\n  pulse,\n  hoverable,\n  density,\n  stickyHeader,\n  header,\n  rest,\n  children }) => (\n  <StyledTableContainer>\n    <StyledTable\n      ref={innerRef}\n      customVariant={variant}\n      stripeColor={stripeColor}\n      glow={glow}\n      pulse={pulse}\n      hoverable={hoverable}\n      density={density}\n      stickyHeader={stickyHeader}\n      {...rest}\n    >\n      {header}\n      {children}\n    </StyledTable>\n  </StyledTableContainer>\n);\n\nconst SKELETON_ROW_COUNT = 5;\n\nconst LoadingSkeletonRows: React.FC<{ columns?: ColumnConfig[] }> = ({ columns }) => (\n  <>\n    {Array.from({ length: SKELETON_ROW_COUNT }, (_, index) => (\n      <TableRow key={index}>\n        {columns?.map((column) => (\n          <TableCell key={column.key}>\n            <Skeleton height={20} />\n          </TableCell>\n        ))}\n      </TableRow>\n    ))}\n  </>\n);\n\nexport type TableShellProps = Omit<React.ComponentProps<typeof TableShell>, 'children'>;\n\ntype Selection = ReturnType<typeof useTableSelection>;\n\ninterface RendererProps {\n  resolved: TableProps;\n  selection: Selection;\n  innerRef: React.Ref<globalThis.HTMLTableElement>;\n  rest: Record<string, unknown>;\n}\n\n// The column-visibility control, shown only when responsive mode has actually\n// hidden something on a narrow viewport.\nconst ColumnToggleMenu: React.FC<{\n  columns: ColumnConfig[];\n  hiddenColumns: number[];\n  anchor: HTMLElement | null;\n  setAnchor: (element: HTMLElement | null) => void;\n  setHiddenColumns: (next: number[]) => void;\n}> = ({ columns, hiddenColumns, anchor, setAnchor, setHiddenColumns }) => (\n  <Box position=\"absolute\" top={8} right={8}>\n    <IconButton onClick={(event) => setAnchor(event.currentTarget)} size=\"small\">\n      <MoreVertIcon />\n    </IconButton>\n    <Menu anchorEl={anchor} open={Boolean(anchor)} onClose={() => setAnchor(null)}>\n      {columns.map((column, index) => (\n        <MenuItem key={column.key}>\n          <FormControlLabel\n            control={\n              <Switch\n                checked={!hiddenColumns.includes(index)}\n                onChange={(event) =>\n                  setHiddenColumns(\n                    event.target.checked\n                      ? hiddenColumns.filter((i: number) => i !== index)\n                      : [...hiddenColumns, index],\n                  )\n                }\n                size=\"small\"\n              />\n            }\n            label={column.label}\n          />\n        </MenuItem>\n      ))}\n    </Menu>\n  </Box>\n);\n\n// The populated table. Local because StyledTableContainer and StyledTable\n// cannot cross a module boundary (TS2742).\nconst columnsFor = (resolved: TableProps, selection: Selection): ColumnConfig[] =>\n  (resolved.responsive ? selection.visibleColumns : resolved.columns) ?? [];\n\n// The toggle only earns its place when responsive mode has actually hidden\n// something on a narrow viewport.\nconst showsColumnToggle = (resolved: TableProps, selection: Selection): boolean =>\n  Boolean(\n    resolved.responsive &&\n      selection.isMobile &&\n      resolved.showColumnToggle &&\n      selection.hiddenColumns.length > 0,\n  );\n\nconst AdvancedTable: React.FC<RendererProps> = ({ resolved: p, selection, innerRef, rest }) => {\n  const finalColumns = columnsFor(p, selection);\n  const showToggle = showsColumnToggle(p, selection);\n\n  return (\n    <Box position=\"relative\">\n      <StyledTableContainer\n        virtualScrolling={p.virtualScrolling}\n        containerHeight={p.containerHeight}\n      >\n        <StyledTable\n          ref={innerRef}\n          customVariant={p.variant}\n          stripeColor={p.stripeColor}\n          glow={p.glow}\n          pulse={p.pulse}\n          hoverable={p.hoverable}\n          density={p.density}\n          stickyHeader={p.stickyHeader}\n          {...rest}\n        >\n          <EnhancedTableHeader\n            columns={finalColumns}\n            data={p.data ?? []}\n            sortable={p.sortable}\n            sortConfig={p.sortConfig}\n            onSortChange={p.onSortChange}\n            selectable={p.selectable}\n            selectedRows={p.selectedRows}\n            onSelectAll={selection.handleSelectAll}\n            density={p.density}\n            stickyHeader={p.stickyHeader}\n          />\n          <EnhancedTableBody\n            data={p.data ?? []}\n            columns={finalColumns}\n            selectedRows={p.selectedRows}\n            onRowClick={p.onRowClick}\n            onRowFocus={p.onRowFocus}\n            onRowBlur={p.onRowBlur}\n            onSelectionChange={selection.handleSelectionChange}\n            rowKeyExtractor={p.rowKeyExtractor}\n            density={p.density}\n            selectable={p.selectable}\n            hoverable={p.hoverable}\n            renderRow={p.renderRow}\n            renderCell={p.renderCell}\n            virtualScrolling={p.virtualScrolling}\n            containerHeight={typeof p.containerHeight === 'number' ? p.containerHeight : undefined}\n            rowHeight={p.rowHeight}\n            overscan={p.overscan}\n          />\n        </StyledTable>\n      </StyledTableContainer>\n\n      {showToggle && (\n        <ColumnToggleMenu\n          columns={p.columns ?? []}\n          hiddenColumns={selection.hiddenColumns}\n          anchor={selection.columnMenuAnchor}\n          setAnchor={selection.setColumnMenuAnchor}\n          setHiddenColumns={selection.setHiddenColumns}\n        />\n      )}\n    </Box>\n  );\n};\n\n// The loading and empty states render the same shell as the populated table, so\n// they share TableShell rather than repeating it three times.\nconst buildShell = ({\n  resolved,\n  selection,\n  innerRef,\n  rest,\n  finalColumns }: RendererProps & { finalColumns?: ColumnConfig[] }) => ({\n  innerRef,\n  variant: resolved.variant,\n  stripeColor: resolved.stripeColor,\n  glow: resolved.glow,\n  pulse: resolved.pulse,\n  hoverable: resolved.hoverable,\n  density: resolved.density,\n  stickyHeader: resolved.stickyHeader,\n  header: resolved.columns ? (\n    <EnhancedTableHeader\n      columns={finalColumns ?? []}\n      data={[]}\n      sortable={resolved.sortable}\n      sortConfig={resolved.sortConfig}\n      onSortChange={resolved.onSortChange}\n      selectable={resolved.selectable}\n      selectedRows={resolved.selectedRows}\n      onSelectAll={selection.handleSelectAll}\n      density={resolved.density}\n      stickyHeader={resolved.stickyHeader}\n    />\n  ) : null,\n  rest: rest as Record<string, unknown> });\n\nconst TableLoadingState: React.FC<{\n  shell: TableShellProps;\n  loadingComponent?: React.ReactNode;\n  columns?: ColumnConfig[];\n}> = ({ shell, loadingComponent, columns }) => (\n  <TableShell {...shell}>\n    <TableBody data-testid=\"table-loading\">\n      {loadingComponent || <LoadingSkeletonRows columns={columns} />}\n    </TableBody>\n  </TableShell>\n);\n\nconst TableEmptyState: React.FC<{\n  shell: TableShellProps;\n  emptyStateComponent?: React.ReactNode;\n  emptyText: string;\n  colSpan: number;\n}> = ({ shell, emptyStateComponent, emptyText, colSpan }) => (\n  <TableShell {...shell}>\n    <EmptyRow colSpan={colSpan}>\n      {emptyStateComponent || <NoDataPlaceholder emptyText={emptyText} />}\n    </EmptyRow>\n  </TableShell>\n);\n\nexport const Table = React.forwardRef<globalThis.HTMLTableElement, TableProps>(\n  (tableProps, ref) => {\n    const resolved = { ...TABLE_DEFAULTS, ...definedProps(tableProps) } as TableProps;\n    const {\n      columns,\n      data,\n      responsive,\n      loading,\n      loadingComponent,\n      emptyStateComponent,\n      emptyText,\n      children,\n      ...props\n    } = resolved;\n\n    const selection = useTableSelection({\n      columns,\n      data,\n      responsive,\n      columnPriorities: resolved.columnPriorities,\n      selectedRows: resolved.selectedRows ?? [],\n      rowKeyExtractor: resolved.rowKeyExtractor,\n      onSelectionChange: resolved.onSelectionChange });\n\n    const rest = props as unknown as Record<string, unknown>;\n    const renderer: RendererProps = { resolved, selection, innerRef: ref, rest };\n    const finalColumns = responsive ? selection.visibleColumns : columns;\n    const shell = buildShell({ ...renderer, finalColumns });\n\n    if (loading) {\n      return (\n        <TableLoadingState shell={shell} loadingComponent={loadingComponent} columns={columns} />\n      );\n    }\n\n    if (data && data.length === 0) {\n      return (\n        <TableEmptyState\n          shell={shell}\n          emptyStateComponent={emptyStateComponent}\n          emptyText={emptyText}\n          colSpan={finalColumns?.length || 1}\n        />\n      );\n    }\n\n    if (columns && data) return <AdvancedTable {...renderer} />;\n\n    // Basic table (backward compatibility)\n    return (\n      <StyledTable\n        ref={ref}\n        customVariant={resolved.variant}\n        stripeColor={resolved.stripeColor}\n        glow={resolved.glow}\n        pulse={resolved.pulse}\n        hoverable={resolved.hoverable}\n        density={resolved.density}\n        stickyHeader={resolved.stickyHeader}\n        {...rest}\n      >\n        {children}\n      </StyledTable>\n    );\n  },\n);\n\nTable.displayName = 'Table';"],"mappings":"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","names":[]}

package/dist/chunk-27DLUKDF.js

@@ -1,37 +0,0 @@
-import {
-  DataViewsScopeTabs
-} from "./chunk-LYKV3C7B.js";
-import {
-  useDataViewsLayout
-} from "./chunk-2XGGHYEA.js";
-
-// src/components/data-display/DataViews/data-views-scope-tabs.tsx
-import { jsx } from "react/jsx-runtime";
-function ScopeTabsSlot({
-  scopes,
-  scopeFieldId,
-  board,
-  value,
-  onChange,
-  counts,
-  testIdPrefix
-}) {
-  const { layout } = useDataViewsLayout();
-  const boardOwnsThisPartition = layout === "board" && Boolean(scopeFieldId) && scopeFieldId === board?.groupBy;
-  if (boardOwnsThisPartition) return null;
-  return /* @__PURE__ */ jsx(
-    DataViewsScopeTabs,
-    {
-      scopes,
-      value,
-      onChange,
-      counts,
-      testIdPrefix
-    }
-  );
-}
-
-export {
-  ScopeTabsSlot
-};
-//# sourceMappingURL=chunk-27DLUKDF.js.map