@12-apps/ui 6.37.0 → 6.39.0

package/dist/chunk-I7GSRTGQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/ScrollArea/ScrollArea.styles.ts"],"sourcesContent":["import type { CSSObject, Theme } from '@mui/material/styles/index.js';\nimport { alpha } from '@mui/material/styles/index.js';\n\nimport type { ScrollAreaProps } from './ScrollArea.types';\nimport { neutralTones, sheen } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\n\n/** The scrollbar's thickness in design px, per `scrollbarSize`; `default` is the fallback. */\nconst SCROLLBAR_SIZES: Record<string, number> = {\n  thin: 8,\n  thick: 16,\n  default: 12,\n};\n\n// thin/thick are the named ends of the scale; anything else takes the default.\nconst getScrollbarSize = (scrollbarSize?: string): number =>\n  (scrollbarSize ? SCROLLBAR_SIZES[scrollbarSize] : undefined) ?? SCROLLBAR_SIZES.default!;\n\n/**\n * A size prop as CSS. `sx` reads a number of 1 or less as a fraction of the\n * parent, and that stays so; any other number is design px, through the type\n * scale; a string is as given.\n */\nexport const sizeCss = (theme: Theme, value: number | string | undefined): string | undefined => {\n  if (typeof value !== 'number') return value;\n  return value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);\n};\n\nconst getScrollbarColors = ({\n  theme,\n  variant,\n  scrollbarColor,\n  scrollbarTrackColor,\n}: {\n  theme: Theme;\n  variant?: string;\n  scrollbarColor?: string;\n  scrollbarTrackColor?: string;\n}) => {\n  const defaultScrollbarColor =\n    variant === 'glass'\n      ? alpha(theme.palette.primary.main, 0.5)\n      : theme.palette.mode === 'dark'\n        ? neutralTones(theme).emphasis\n        : neutralTones(theme).subtle;\n\n  const defaultTrackColor =\n    variant === 'glass'\n      ? alpha(theme.palette.background.paper, 0.1)\n      : theme.palette.mode === 'dark'\n        ? neutralTones(theme).inverseSurface\n        : neutralTones(theme).faint;\n\n  return {\n    scrollbar: scrollbarColor || defaultScrollbarColor,\n    track: scrollbarTrackColor || defaultTrackColor,\n  };\n};\n\nexport const getOverflowStyle = ({\n  disabled,\n  orientation,\n}: {\n  disabled?: boolean;\n  orientation?: ScrollAreaProps['orientation'];\n}) => {\n  if (disabled) return { overflow: 'hidden' as const };\n\n  switch (orientation) {\n    case 'horizontal':\n      return {\n        overflow: 'hidden' as const,\n        overflowX: 'auto' as const,\n        overflowY: 'hidden' as const,\n      };\n    case 'both':\n      return { overflow: 'auto' as const };\n    default:\n      return {\n        overflow: 'hidden' as const,\n        overflowY: 'auto' as const,\n        overflowX: 'hidden' as const,\n      };\n  }\n};\n\n// Scrollbar chrome shared by every variant. autoHide fades the thumb out when\n// the area is idle, which is why the colours are parameters rather than read\n// from the variant directly. An `sx` object (it is spread into the viewport's\n// `sx`), so a number on `borderRadius` is a multiple of `shape.borderRadius`.\nconst autoHideScrollbarSx = ({\n  thumbColor,\n  trackColor,\n  thickness,\n  orientation,\n  shouldShowScrollbar,\n  theme,\n  scrollbarSize,\n}: {\n  thumbColor: string;\n  trackColor: string;\n  thickness: number;\n  orientation?: ScrollAreaProps['orientation'];\n  shouldShowScrollbar: boolean;\n  theme: Theme;\n  scrollbarSize?: string;\n}) => ({\n    '&::-webkit-scrollbar': {\n      width: orientation !== 'horizontal' ? rem(theme, thickness) : '100%',\n      height: orientation !== 'vertical' ? rem(theme, thickness) : '100%',\n    },\n    '&::-webkit-scrollbar-track': {\n      background: shouldShowScrollbar ? trackColor : 'transparent',\n      borderRadius: thickness / 2,\n      transition: 'background 0.3s ease',\n    },\n    '&::-webkit-scrollbar-thumb': {\n      background: shouldShowScrollbar ? thumbColor : 'transparent',\n      borderRadius: thickness / 2,\n      transition: 'background 0.3s ease',\n      '&:hover': {\n        background: shouldShowScrollbar ? theme.palette.primary.main : 'transparent',\n      },\n    },\n    '&::-webkit-scrollbar-corner': {\n      background: shouldShowScrollbar ? trackColor : 'transparent',\n    },\n    // Firefox scrollbar styling\n    scrollbarWidth: shouldShowScrollbar\n      ? scrollbarSize === 'thin'\n        ? ('thin' as const)\n        : ('auto' as const)\n      : ('none' as const),\n    scrollbarColor: shouldShowScrollbar\n      ? `${thumbColor} ${trackColor}`\n      : 'transparent transparent',\n  });\n\ntype VariantArgs = {\n  theme: Theme;\n  colors: { scrollbar: string; track: string };\n  thickness: number;\n  orientation?: ScrollAreaProps['orientation'];\n  shouldShowScrollbar: boolean;\n  scrollbarSize?: string;\n};\n\n// One entry per scrollbar look. overlay floats above the content, glass tints\n// it, and the default delegates to the shared auto-hide chrome. Each is an `sx`\n// object, like the chrome.\nconst VARIANT_SCROLLBAR_SX: Record<string, (args: VariantArgs) => CSSObject> = {\n  overlay: ({ theme, colors, thickness, orientation, shouldShowScrollbar, scrollbarSize }) => ({\n          '&::-webkit-scrollbar': {\n            width: orientation !== 'horizontal' ? rem(theme, thickness) : '100%',\n            height: orientation !== 'vertical' ? rem(theme, thickness) : '100%',\n            position: 'absolute',\n            right: 0,\n            top: 0,\n          },\n          '&::-webkit-scrollbar-track': {\n            background: 'transparent',\n            borderRadius: thickness / 2,\n          },\n          '&::-webkit-scrollbar-thumb': {\n            background: shouldShowScrollbar\n              ? alpha(colors.scrollbar, 0.5)\n              : 'transparent',\n            borderRadius: thickness / 2,\n            transition: 'background 0.3s ease',\n            border: `${rem(theme, 2)} solid transparent`,\n            backgroundClip: 'padding-box',\n            '&:hover': {\n              background: shouldShowScrollbar ? theme.palette.primary.main : 'transparent',\n            },\n          },\n          '&::-webkit-scrollbar-corner': {\n            background: 'transparent',\n          },\n          scrollbarWidth: shouldShowScrollbar\n            ? scrollbarSize === 'thin'\n              ? ('thin' as const)\n              : ('auto' as const)\n            : ('none' as const),\n          scrollbarColor: shouldShowScrollbar\n            ? `${alpha(colors.scrollbar, 0.5)} transparent`\n            : 'transparent transparent',\n        }),\n\n  // Starts from the shared chrome, then adds what makes it glass: a blurred\n  // track and root, and an inner highlight on the thumb. scrollbar-color (the\n  // Firefox property) keeps the solid palette colour rather than the gradient —\n  // a gradient is not a valid value there, which is why the original picked\n  // colors.scrollbar for it.\n  glass: ({ theme, colors, thickness, orientation, shouldShowScrollbar, scrollbarSize }) => {\n    const glassThumbColor = `linear-gradient(180deg, ${alpha(theme.palette.primary.main, 0.3)}, ${alpha(theme.palette.secondary.main, 0.3)})`;\n    const glassTrackColor = alpha(theme.palette.background.paper, 0.1);\n\n    const base = autoHideScrollbarSx({\n      thumbColor: glassThumbColor,\n      trackColor: glassTrackColor,\n      thickness,\n      orientation,\n      shouldShowScrollbar,\n      theme,\n      scrollbarSize,\n    });\n\n    return {\n      ...base,\n      '&::-webkit-scrollbar-track': {\n        ...(base['&::-webkit-scrollbar-track'] as object),\n        backdropFilter: shouldShowScrollbar ? `blur(${rem(theme, 5)})` : 'none',\n      },\n      '&::-webkit-scrollbar-thumb': {\n        ...(base['&::-webkit-scrollbar-thumb'] as object),\n        boxShadow: shouldShowScrollbar\n          ? `inset ${rems(theme, 0, 0, 6)} ${sheen(theme, 0.3)}`\n          : 'none',\n      },\n      scrollbarColor: shouldShowScrollbar\n        ? `${colors.scrollbar} ${glassTrackColor}`\n        : 'transparent transparent',\n      backdropFilter: `blur(${rem(theme, 10)})`,\n    };\n  },\n\n  default: ({ theme, colors, thickness, orientation, shouldShowScrollbar, scrollbarSize }) =>\n    autoHideScrollbarSx({\n      thumbColor: colors.scrollbar,\n      trackColor: colors.track,\n      thickness,\n      orientation,\n      shouldShowScrollbar,\n      theme,\n      scrollbarSize,\n    }),\n};\n\nexport const getVariantStyles = ({\n  theme,\n  variant,\n  orientation,\n  scrollbarSize,\n  scrollbarColor,\n  scrollbarTrackColor,\n  shouldShowScrollbar,\n}: {\n  theme: Theme;\n  variant?: string;\n  orientation?: ScrollAreaProps['orientation'];\n  scrollbarSize?: string;\n  scrollbarColor?: string;\n  scrollbarTrackColor?: string;\n  shouldShowScrollbar: boolean;\n}) => {\n  const colors = getScrollbarColors({ theme, variant, scrollbarColor, scrollbarTrackColor });\n  const thickness = getScrollbarSize(scrollbarSize);\n\n  const build = VARIANT_SCROLLBAR_SX[variant ?? 'default'] ?? VARIANT_SCROLLBAR_SX.default!;\n\n  return build({ theme, colors, thickness, orientation, shouldShowScrollbar, scrollbarSize });\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-Q4CAZ2TP.js → chunk-IG23YZZR.js}

@@ -1,7 +1,7 @@
 import {
   separatorBlockMargin,
   separatorStyles
-} from "./chunk-CAHWCSRE.js";
+} from "./chunk-D46SLMCX.js";
 
 // src/components/layout/Separator/Separator.tsx
 import Box from "@mui/material/Box/index.js";
@@ -20,9 +20,10 @@ var Separator = ({
   "data-testid": dataTestId
 }) => {
   const theme = useTheme();
-  const styles = separatorStyles(theme, { variant, orientation, size, color, margin, length });
+  const isHorizontal = orientation === "horizontal";
+  const blockMargin = separatorBlockMargin(theme, size, margin, isHorizontal);
+  const styles = separatorStyles(theme, { variant, orientation, size, color, blockMargin, length });
   if (children) {
-    const isHorizontal = orientation === "horizontal";
     const ruleStyles = { ...styles, margin: 0 };
     return /* @__PURE__ */ jsxs(
       Box,
@@ -32,7 +33,7 @@ var Separator = ({
         sx: {
           display: "flex",
           alignItems: "center",
-          margin: separatorBlockMargin(size, margin, isHorizontal),
+          margin: blockMargin,
           flexDirection: isHorizontal ? "row" : "column",
           gap: theme.spacing(2)
         },
@@ -67,4 +68,4 @@ var Separator = ({
 export {
   Separator
 };
-//# sourceMappingURL=chunk-Q4CAZ2TP.js.map
+//# sourceMappingURL=chunk-IG23YZZR.js.map

package/dist/chunk-IG23YZZR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Separator/Separator.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { separatorBlockMargin, separatorStyles } from './Separator.styles';\nimport type { SeparatorProps } from './Separator.types';\n\nexport const Separator: React.FC<SeparatorProps> = ({\n  variant = 'solid',\n  orientation = 'horizontal',\n  size = 'md',\n  color,\n  margin,\n  length,\n  children,\n  className,\n  'data-testid': dataTestId,\n}) => {\n  const theme = useTheme();\n  const isHorizontal = orientation === 'horizontal';\n  const blockMargin = separatorBlockMargin(theme, size, margin, isHorizontal);\n  const styles = separatorStyles(theme, { variant, orientation, size, color, blockMargin, length });\n\n  if (children) {\n    // The rules either side of the label sit INSIDE the row, which carries the\n    // margin; their own would add it a second time.\n    const ruleStyles = { ...styles, margin: 0 };\n\n    return (\n      <Box\n        className={className}\n        // The plain branch below has always carried the caller's hook; this one\n        // silently dropped it, so a LABELLED separator was the one variant no\n        // test could address except through its own words.\n        data-testid={dataTestId}\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          margin: blockMargin,\n          flexDirection: isHorizontal ? 'row' : 'column',\n          gap: theme.spacing(2),\n        }}\n      >\n        <Box sx={ruleStyles} />\n        {/*\n          No background behind the label. The two rules and the words are a FLEX\n          ROW — the rules stop where the label starts — so there is nothing for a\n          background to mask, and painting one made the label a coloured pill on\n          every surface that is not `background.default`. On a white card it read\n          as a highlight nobody had asked for.\n        */}\n        <Typography\n          variant=\"body2\"\n          color=\"text.secondary\"\n          sx={{ flexShrink: 0, padding: theme.spacing(0, 1) }}\n        >\n          {children}\n        </Typography>\n        <Box sx={ruleStyles} />\n      </Box>\n    );\n  }\n\n  return (\n    <Box\n      className={className}\n      sx={styles}\n      role=\"separator\"\n      aria-orientation={orientation}\n      data-testid={dataTestId}\n    />\n  );\n};\n"],"mappings":";;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,gBAAgB;AACvB,SAAS,gBAAgB;AA4BnB,SAcE,KAdF;AAtBC,IAAM,YAAsC,CAAC;AAAA,EAClD,UAAU;AAAA,EACV,cAAc;AAAA,EACd,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAM;AACJ,QAAM,QAAQ,SAAS;AACvB,QAAM,eAAe,gBAAgB;AACrC,QAAM,cAAc,qBAAqB,OAAO,MAAM,QAAQ,YAAY;AAC1E,QAAM,SAAS,gBAAgB,OAAO,EAAE,SAAS,aAAa,MAAM,OAAO,aAAa,OAAO,CAAC;AAEhG,MAAI,UAAU;AAGZ,UAAM,aAAa,EAAE,GAAG,QAAQ,QAAQ,EAAE;AAE1C,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QAIA,eAAa;AAAA,QACb,IAAI;AAAA,UACF,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,QAAQ;AAAA,UACR,eAAe,eAAe,QAAQ;AAAA,UACtC,KAAK,MAAM,QAAQ,CAAC;AAAA,QACtB;AAAA,QAEA;AAAA,8BAAC,OAAI,IAAI,YAAY;AAAA,UAQrB;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,OAAM;AAAA,cACN,IAAI,EAAE,YAAY,GAAG,SAAS,MAAM,QAAQ,GAAG,CAAC,EAAE;AAAA,cAEjD;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,OAAI,IAAI,YAAY;AAAA;AAAA;AAAA,IACvB;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,oBAAkB;AAAA,MAClB,eAAa;AAAA;AAAA,EACf;AAEJ;","names":[]}

package/dist/{chunk-5W4BLTDI.js → chunk-IWFENXST.js}

@@ -1,12 +1,13 @@
 import {
   breadcrumbLinkStyles
-} from "./chunk-6CTPDNNX.js";
+} from "./chunk-52G2KRL4.js";
 import {
   sheen,
   uiInk
 } from "./chunk-FQ6UW7IY.js";
 import {
-  rem
+  rem,
+  sxRem
 } from "./chunk-YKCAJ2TN.js";
 
 // src/components/navigation/Breadcrumbs/BreadcrumbEntry.tsx
@@ -41,7 +42,7 @@ var BreadcrumbText = styled(Typography, {
   position: "relative",
   ...visualStyle === "glass" && {
     background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.1)} 0%, ${alpha(theme.palette.primary.main, 0.05)} 100%)`,
-    backdropFilter: "blur(4px)",
+    backdropFilter: `blur(${rem(theme, 4)})`,
     border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`
   },
   "& .breadcrumb-icon": {
@@ -58,11 +59,11 @@ var CollapsedItemsPopover = ({ open, items, dataTestId, onSelect }) => /* @__PUR
   {
     sx: {
       background: (theme) => theme.palette.mode === "dark" ? alpha(uiInk(theme).glassSlate, 0.95) : sheen(theme, 0.95),
-      backdropFilter: "blur(10px)",
+      backdropFilter: (theme) => `blur(${rem(theme, 10)})`,
       borderRadius: 1,
       boxShadow: 3,
       p: 1,
-      minWidth: 150
+      minWidth: sxRem(150)
     },
     children: items.map((item, index) => /* @__PURE__ */ jsx(
       Box,
@@ -263,4 +264,4 @@ var BreadcrumbEntry = ({
 export {
   BreadcrumbEntry
 };
-//# sourceMappingURL=chunk-5W4BLTDI.js.map
+//# sourceMappingURL=chunk-IWFENXST.js.map

package/dist/chunk-IWFENXST.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/Breadcrumbs/BreadcrumbEntry.tsx"],"sourcesContent":["import Home from '@mui/icons-material/Home';\nimport MoreHoriz from '@mui/icons-material/MoreHoriz';\nimport Box from '@mui/material/Box/index.js';\nimport Fade from '@mui/material/Fade/index.js';\nimport Link from '@mui/material/Link/index.js';\nimport Tooltip from '@mui/material/Tooltip/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { breadcrumbLinkStyles } from './Breadcrumbs.styles';\nimport type { BreadcrumbItem } from './Breadcrumbs.types';\nimport type { BreadcrumbCopy } from '../../../copy';\nimport { sheen, uiInk } from '../../../tokens/ink';\nimport { rem, sxRem } from '../../../tokens/relative';\n\nconst BreadcrumbLink = styled(Link, {\n  shouldForwardProp: (prop) => prop !== 'size' && prop !== 'active' && prop !== 'visualStyle' })<{ size?: string; active?: boolean; visualStyle?: string }>(\n  ({ theme, size, active, visualStyle }) => ({\n    ...breadcrumbLinkStyles({ theme, size, active, visualStyle }) }),\n);\n\nconst BreadcrumbText = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'size' && prop !== 'visualStyle' })<{ size?: string; visualStyle?: string }>(({ theme, size, visualStyle }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(0.5),\n  fontSize: rem(theme, size === 'sm' ? 14 : size === 'lg' ? 18 : 16),\n  fontWeight: 600,\n  color: theme.palette.primary.main,\n  padding: theme.spacing(0.5, 0.75),\n  borderRadius: theme.spacing(0.75),\n  position: 'relative',\n\n  ...(visualStyle === 'glass' && {\n    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.1)} 0%, ${alpha(theme.palette.primary.main, 0.05)} 100%)`,\n    backdropFilter: `blur(${rem(theme, 4)})`,\n    border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}` }),\n\n  '& .breadcrumb-icon': {\n    color: theme.palette.primary.main },\n\n  // Mobile responsiveness\n  [theme.breakpoints.down('sm')]: {\n    fontSize: rem(theme, size === 'lg' ? 16 : size === 'sm' ? 12 : 14),\n    padding: theme.spacing(0.375, 0.5) } }));\n\n// Animated separator wrapper\n\n// Mobile collapsed menu component\n// The list that drops down from the \"...\" trigger.\nconst CollapsedItemsPopover: React.FC<{\n  open: boolean;\n  items: BreadcrumbItem[];\n  size: string;\n  visualStyle?: string;\n  dataTestId?: string;\n  onSelect: () => void;\n}> = ({ open, items, dataTestId, onSelect }) => (\n<Fade in={open}>\n    <Box\n      sx={{\n        background: (theme) =>\n          theme.palette.mode === 'dark'\n            ? alpha(uiInk(theme).glassSlate, 0.95)\n            : sheen(theme, 0.95),\n        backdropFilter: (theme) => `blur(${rem(theme, 10)})`,\n        borderRadius: 1,\n        boxShadow: 3,\n        p: 1,\n        minWidth: sxRem(150) }}\n    >\n      {items.map((item, index) => (\n        <Box\n          key={index}\n          component=\"a\"\n          href={item.href || '#'}\n          onClick={(e) => {\n            onSelect();\n            item.onClick?.(e);\n          }}\n          sx={{\n            display: 'block',\n            px: 2,\n            py: 1,\n            color: 'text.secondary',\n            textDecoration: 'none',\n            borderRadius: 0.5,\n            transition: 'all 0.2s',\n            '&:hover': {\n              backgroundColor: 'action.hover',\n              color: 'primary.main' } }}\n          data-testid={dataTestId ? `${dataTestId}-collapsed-item-${index}` : `breadcrumbs-collapsed-item-${index}`}\n        >\n          {item.label}\n        </Box>\n      ))}\n    </Box>\n  </Fade>\n);\n\nconst CollapsedMenu = ({\n  items,\n  size,\n  visualStyle,\n  copy,\n  dataTestId }: {\n  items: BreadcrumbItem[];\n  size: string;\n  visualStyle?: string;\n  copy: BreadcrumbCopy;\n  dataTestId?: string;\n}) => {\n  const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);\n  const open = Boolean(anchorEl);\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleClose = () => {\n    setAnchorEl(null);\n  };\n\n  return (\n    <>\n      <Tooltip title={copy.showMore} arrow>\n        <BreadcrumbLink\n          onClick={handleClick}\n          size={size}\n          visualStyle={visualStyle}\n          sx={{ cursor: 'pointer' }}\n          data-testid={dataTestId ? `${dataTestId}-collapsed-menu` : 'breadcrumbs-collapsed-menu'}\n        >\n          <MoreHoriz className=\"breadcrumb-icon\" />\n        </BreadcrumbLink>\n      </Tooltip>\n      <Box\n        sx={{\n          position: 'absolute',\n          top: '100%',\n          left: 0,\n          mt: 1,\n          display: open ? 'block' : 'none',\n          zIndex: 1000 }}\n        data-testid={dataTestId ? `${dataTestId}-collapsed-menu-items` : 'breadcrumbs-collapsed-menu-items'}\n      >\n        <CollapsedItemsPopover\n          open={open}\n          items={items}\n          size={size}\n          visualStyle={visualStyle}\n          dataTestId={dataTestId}\n          onSelect={handleClose}\n        />\n      </Box>\n    </>\n  );\n};\n\n// The leading crumb gets a house unless it brings its own icon; everything else\n// shows only what it supplies.\nconst crumbIcon = ({\n  item,\n  isFirst,\n  showHomeIcon,\n  iconSize }: {\n  item: BreadcrumbItem;\n  isFirst: boolean;\n  showHomeIcon: boolean;\n  iconSize: 'small' | 'medium';\n}) => {\n  if (isFirst && showHomeIcon && !item.icon) {\n    return <Home className=\"breadcrumb-icon\" fontSize={iconSize} />;\n  }\n\n  if (!item.icon) return null;\n\n  return (\n    <Box component=\"span\" className=\"breadcrumb-icon\" sx={{ display: 'flex', alignItems: 'center' }}>\n      {item.icon}\n    </Box>\n  );\n};\n\nconst EllipsisCrumb: React.FC<{ label: string; copy: BreadcrumbCopy; dataTestId?: string }> = ({\n  label,\n  copy,\n  dataTestId }) => (\n  <Tooltip title={copy.moreItems} arrow>\n            <Box\n              sx={{\n                px: 1,\n                color: 'text.disabled',\n                cursor: 'default',\n                userSelect: 'none' }}\n              data-testid={dataTestId ? `${dataTestId}-ellipsis` : 'breadcrumbs-ellipsis'}\n            >\n              {label}\n            </Box>\n          </Tooltip>\n);\n\n// The same conditional test id was written at each crumb variant. An item that\n// names its OWN id wins: see `BreadcrumbItem.dataTestId`.\nconst makeTestId =\n  (dataTestId?: string) =>\n  (suffix: string, own?: string): string =>\n    own ?? (dataTestId ? `${dataTestId}-${suffix}` : `breadcrumbs-${suffix}`);\n\nconst ClickableCrumb: React.FC<{\n  item: BreadcrumbItem;\n  index: number;\n  icon: React.ReactNode;\n  size: string;\n  variant: string;\n  isActive: boolean;\n  testId: (suffix: string, own?: string) => string;\n}> = ({ item, index, icon, size, variant, isActive, testId }) => (\n  <Tooltip title={item.tooltip || item.label} arrow disableHoverListener={!item.tooltip}>\n    <BreadcrumbLink\n      href={item.href || '#'}\n      onClick={item.onClick}\n      size={size}\n      visualStyle={variant}\n      active={isActive}\n      underline=\"none\"\n      aria-label={item.ariaLabel || item.label}\n      data-testid={testId(`link-${index}`, item.dataTestId)}\n    >\n      {icon}\n      <span>{item.label}</span>\n    </BreadcrumbLink>\n  </Tooltip>\n);\n\n// One crumb: the collapsed-menu stand-in, the ellipsis, the active tail item or\n// a plain link.\nexport const BreadcrumbEntry: React.FC<{\n  item: BreadcrumbItem & { isEllipsis?: boolean };\n  index: number;\n  itemCount: number;\n  collapsedItems: BreadcrumbItem[];\n  collapseBehavior: string;\n  separator: React.ReactNode;\n  showHomeIcon: boolean;\n  iconSize: 'small' | 'medium';\n  size: string;\n  variant: string;\n  copy: BreadcrumbCopy;\n  dataTestId?: string;\n}> = ({\n  item,\n  index,\n  itemCount,\n  collapsedItems,\n  collapseBehavior,\n  separator,\n  showHomeIcon,\n  iconSize,\n  size,\n  variant,\n  copy,\n  dataTestId }) => {\n  const testId = makeTestId(dataTestId);\n  const isLast = index === itemCount - 1;\n  // The tail crumb is the current page unless it is the ellipsis placeholder.\n  const isActive = item.active || (isLast && !item.isEllipsis);\n\n  const isCollapsePoint =\n    index === 1 && collapsedItems.length > 0 && collapseBehavior === 'menu';\n\n  if (isCollapsePoint) {\n    return (\n      <>\n        <CollapsedMenu\n          copy={copy}\n          items={collapsedItems}\n          size={size}\n          visualStyle={variant}\n          dataTestId={dataTestId}\n        />\n        {separator}\n      </>\n    );\n  }\n\n  if (item.isEllipsis) {\n    return <EllipsisCrumb copy={copy} label={item.label} dataTestId={dataTestId} />;\n  }\n\n  const icon = crumbIcon({ item, isFirst: index === 0, showHomeIcon, iconSize });\n\n  if (isActive) {\n    return (\n      <BreadcrumbText\n        size={size}\n        visualStyle={variant}\n        aria-current=\"page\"\n        data-testid={testId(`item-${index}`, item.dataTestId)}\n      >\n        {icon}\n        <span>{item.label}</span>\n      </BreadcrumbText>\n    );\n  }\n\n  return (\n    <ClickableCrumb\n      item={item}\n      index={index}\n      icon={icon}\n      size={size}\n      variant={variant}\n      isActive={isActive}\n      testId={testId}\n    />\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-HXEBKOSM.js → chunk-J5UZB6Y6.js}

@@ -23,7 +23,7 @@ import TextField from "@mui/material/TextField/index.js";
 import Typography from "@mui/material/Typography/index.js";
 import { useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-var PANEL_WIDTH = 280;
+var PANEL_WIDTH = sxRem(280);
 function TableFilter({
   children,
   open,
@@ -326,4 +326,4 @@ TableFilter.RangeField = TableFilterRangeField;
 export {
   TableFilter
 };
-//# sourceMappingURL=chunk-HXEBKOSM.js.map
+//# sourceMappingURL=chunk-J5UZB6Y6.js.map

package/dist/chunk-J5UZB6Y6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/TableFilter/TableFilter.tsx"],"sourcesContent":["'use client';\n\nimport CloseIcon from '@mui/icons-material/Close';\nimport SearchIcon from '@mui/icons-material/Search';\nimport Box from '@mui/material/Box/index.js';\nimport Checkbox from '@mui/material/Checkbox/index.js';\nimport Divider from '@mui/material/Divider/index.js';\nimport FormControlLabel from '@mui/material/FormControlLabel/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport InputAdornment from '@mui/material/InputAdornment/index.js';\nimport Link from '@mui/material/Link/index.js';\nimport TextField from '@mui/material/TextField/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport React, { useRef, useState } from 'react';\n\nimport { TableFilterContext, useTableFilterContext } from './TableFilterContext';\nimport type {\n  TableFilterCheckboxFieldProps,\n  TableFilterKeywordProps,\n  TableFilterLayoutProps,\n  TableFilterMainProps,\n  TableFilterPanelProps,\n  TableFilterProps,\n  TableFilterRangeFieldProps,\n  TableFilterSectionProps,\n} from './TableFilter.types';\nimport { fieldTextFieldStyles } from '../../../tokens/field-height';\nimport { sxRem } from '../../../tokens/relative';\n\n/** The open panel's width, 280 design px through the type scale. */\nconst PANEL_WIDTH = sxRem(280);\n\n/**\n * Compound filter-panel system, MUI port of the reference `TableFilter`. Provides\n * open/close state; `Panel` slides in from the right beside `Main` (no overlap).\n *\n * @example\n * ```tsx\n * <TableFilter open={open} onOpenChange={setOpen} hasActiveFilters={n > 0}>\n *   <TableFilter.Layout>\n *     <TableFilter.Main>{table}</TableFilter.Main>\n *     <TableFilter.Panel onClearAll={clearAll}>\n *       <TableFilter.Keyword value={q} onChange={setQ} />\n *       <TableFilter.Section title=\"Attributes\">\n *         <TableFilter.CheckboxField label=\"Category\" options={cats} selected={sel} onToggle={toggle} />\n *         <TableFilter.RangeField label=\"Price\" unit=\"R$\" value={price} onChange={setPrice} />\n *       </TableFilter.Section>\n *     </TableFilter.Panel>\n *   </TableFilter.Layout>\n * </TableFilter>\n * ```\n */\nexport function TableFilter({\n  children,\n  open,\n  onOpenChange,\n  hasActiveFilters = false,\n  copy,\n}: TableFilterProps): React.JSX.Element {\n  return (\n    <TableFilterContext.Provider value={{ open, onOpenChange, hasActiveFilters, copy }}>\n      {children}\n    </TableFilterContext.Provider>\n  );\n}\nTableFilter.displayName = 'TableFilter';\n\nconst TableFilterLayout = ({ children, className }: TableFilterLayoutProps): React.JSX.Element => {\n  const { open } = useTableFilterContext();\n  return (\n    <Box\n      className={className}\n      sx={{\n        display: 'flex',\n        minHeight: 0,\n        minWidth: 0,\n        flex: 1,\n        alignItems: 'stretch',\n        overflow: 'hidden',\n        gap: open ? 2 : 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\nTableFilterLayout.displayName = 'TableFilter.Layout';\n\nconst TableFilterMain = ({ children, className }: TableFilterMainProps): React.JSX.Element => (\n  <Box className={className} sx={{ minWidth: 0, flex: 1, overflowY: 'auto', overflowX: 'hidden' }}>\n    {children}\n  </Box>\n);\nTableFilterMain.displayName = 'TableFilter.Main';\n\nconst TableFilterPanel = ({\n  children,\n  onClearAll,\n  ariaLabel = 'Filters',\n  clearTestId,\n}: TableFilterPanelProps): React.JSX.Element => {\n  const { open, copy } = useTableFilterContext();\n  return (\n    <Box\n      component=\"aside\"\n      aria-label={ariaLabel}\n      aria-hidden={!open}\n      sx={{\n        display: 'flex',\n        minHeight: 0,\n        flexShrink: 0,\n        flexDirection: 'column',\n        alignSelf: 'stretch',\n        overflow: 'hidden',\n        bgcolor: 'background.paper',\n        width: open ? PANEL_WIDTH : 0,\n        borderLeft: open ? 1 : 0,\n        borderColor: 'divider',\n        transition: 'width 300ms ease-in-out',\n        '@media (prefers-reduced-motion: reduce)': { transition: 'none' },\n      }}\n    >\n      <Box\n        sx={{\n          display: 'flex',\n          minHeight: 0,\n          flex: 1,\n          flexDirection: 'column',\n          overflowY: 'auto',\n          overflowX: 'hidden',\n          visibility: open ? 'visible' : 'hidden',\n          opacity: open ? 1 : 0,\n          pointerEvents: open ? 'auto' : 'none',\n          transition: 'opacity 200ms ease-out',\n        }}\n      >\n        <Box sx={{ boxSizing: 'border-box', display: 'flex', width: '100%', minWidth: 0, flexDirection: 'column', gap: 2.5, p: 2 }}>\n          <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}>\n            <Link\n              component=\"button\"\n              type=\"button\"\n              underline=\"hover\"\n              data-testid={clearTestId}\n              onClick={onClearAll}\n              sx={{ fontSize: sxRem(12), color: 'text.secondary' }}\n            >\n              {copy.clearAllFilters}\n            </Link>\n          </Box>\n          {children}\n        </Box>\n      </Box>\n    </Box>\n  );\n};\nTableFilterPanel.displayName = 'TableFilter.Panel';\n\nconst TableFilterKeyword = ({\n  value,\n  onChange,\n  placeholder = 'Press Enter to filter',\n  label = 'Filter by keyword',\n  testId,\n}: TableFilterKeywordProps): React.JSX.Element => {\n  const { copy } = useTableFilterContext();\n  const [draft, setDraft] = useState(value);\n  const prevValue = useRef(value);\n  if (prevValue.current !== value) {\n    prevValue.current = value;\n    if (draft !== value) setDraft(value);\n  }\n\n  const commit = (): void => {\n    if (draft !== value) onChange(draft);\n  };\n  const clearKeyword = (): void => {\n    setDraft('');\n    if (value !== '') onChange('');\n  };\n\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\n      <Typography component=\"label\" sx={{ fontSize: sxRem(12), fontWeight: 500, color: 'text.secondary' }}>\n        {label}\n      </Typography>\n      <TextField\n        size=\"small\"\n        sx={fieldTextFieldStyles}\n        name=\"keyword\"\n        placeholder={placeholder}\n        value={draft}\n        onChange={(event) => setDraft(event.target.value)}\n        onBlur={commit}\n        onKeyDown={(event) => {\n          if (event.key !== 'Enter') return;\n          event.preventDefault();\n          commit();\n        }}\n        inputProps={{ 'aria-label': label, 'data-testid': testId }}\n        InputProps={{\n          startAdornment: (\n            <InputAdornment position=\"start\">\n              <SearchIcon sx={{ fontSize: sxRem(16), color: 'text.secondary' }} />\n            </InputAdornment>\n          ),\n          endAdornment:\n            draft !== '' ? (\n              <InputAdornment position=\"end\">\n                <IconButton\n                  size=\"small\"\n                  aria-label={copy.clearKeyword}\n                  data-testid={testId ? `${testId}-clear` : undefined}\n                  onMouseDown={(event) => event.preventDefault()}\n                  onClick={clearKeyword}\n                >\n                  <CloseIcon sx={{ fontSize: sxRem(16) }} />\n                </IconButton>\n              </InputAdornment>\n            ) : null,\n        }}\n      />\n    </Box>\n  );\n};\nTableFilterKeyword.displayName = 'TableFilter.Keyword';\n\nconst TableFilterSection = ({ title, children }: TableFilterSectionProps): React.JSX.Element => (\n  <Box>\n    <Divider sx={{ mb: 2.5 }} />\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n      <Typography component=\"h2\" sx={{ fontSize: sxRem(14), fontWeight: 600, color: 'text.primary' }}>\n        {title}\n      </Typography>\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>{children}</Box>\n    </Box>\n  </Box>\n);\nTableFilterSection.displayName = 'TableFilter.Section';\n\nfunction TableFilterCheckboxField<TValue extends string = string>({\n  label,\n  options,\n  selected,\n  onToggle,\n  testId,\n}: TableFilterCheckboxFieldProps<TValue>): React.JSX.Element {\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }} data-testid={testId}>\n      <Typography sx={{ fontSize: sxRem(12), fontWeight: 500, color: 'text.secondary' }}>{label}</Typography>\n      <Box sx={{ display: 'flex', flexDirection: 'column' }}>\n        {options.map((option) => {\n          const checked = selected.has(option.value);\n          return (\n            <FormControlLabel\n              key={option.value}\n              control={\n                <Checkbox\n                  size=\"small\"\n                  checked={checked}\n                  onChange={(event) => onToggle(option.value, event.target.checked)}\n                  data-testid={testId ? `${testId}-${option.value}` : undefined}\n                  sx={{ py: 0.25 }}\n                />\n              }\n              label={\n                <Box component=\"span\" sx={{ fontSize: sxRem(14) }}>\n                  {option.label}\n                  {option.count != null && (\n                    <Box component=\"span\" sx={{ color: 'text.secondary' }}>\n                      {' '}\n                      ({option.count})\n                    </Box>\n                  )}\n                </Box>\n              }\n              sx={{ ml: -0.5, mr: 0 }}\n            />\n          );\n        })}\n      </Box>\n    </Box>\n  );\n}\nTableFilterCheckboxField.displayName = 'TableFilter.CheckboxField';\n\nfunction parseBound(text: string): number | undefined {\n  if (text.trim() === '') return undefined;\n  const parsed = Number(text);\n  return Number.isNaN(parsed) ? undefined : parsed;\n}\n\n/** One numeric bound input (min or max) for {@link TableFilterRangeField}. */\nfunction RangeBound({\n  bound,\n  error,\n  placeholder,\n  step,\n  ariaLabel,\n  testId,\n  onChange,\n}: {\n  bound: number | undefined;\n  error: boolean;\n  placeholder: string;\n  step?: number;\n  ariaLabel: string;\n  testId?: string;\n  onChange: (next: number | undefined) => void;\n}): React.JSX.Element {\n  return (\n    <TextField\n      size=\"small\"\n      sx={fieldTextFieldStyles}\n      type=\"number\"\n      error={error}\n      placeholder={placeholder}\n      value={bound != null ? String(bound) : ''}\n      onChange={(event) => onChange(parseBound(event.target.value))}\n      inputProps={{ step, 'aria-label': ariaLabel, 'data-testid': testId }}\n    />\n  );\n}\n\n/** Inverted range: both ends set and max < min (surfaced to the user as an error). */\nconst isRangeInverted = (value: { min?: number; max?: number }): boolean =>\n  value.min != null && value.max != null && value.max < value.min;\n\nconst TableFilterRangeField = ({\n  label,\n  value,\n  onChange,\n  unit,\n  step,\n  minPlaceholder,\n  maxPlaceholder,\n  invalidLabel,\n  testId,\n}: TableFilterRangeFieldProps): React.JSX.Element => {\n  const { copy } = useTableFilterContext();\n  const invalid = isRangeInverted(value);\n  // A field may override any of the three; unset, they come from the root's\n  // table. Neither path reaches an English literal in this package.\n  const minText = minPlaceholder ?? copy.rangeMin;\n  const maxText = maxPlaceholder ?? copy.rangeMax;\n  const invalidText = invalidLabel ?? copy.invalidRange;\n  return (\n    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }} data-testid={testId}>\n      <Typography sx={{ fontSize: sxRem(12), fontWeight: 500, color: 'text.secondary' }}>\n        {label}\n        {unit ? ` (${unit})` : ''}\n      </Typography>\n      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n        <RangeBound\n          bound={value.min}\n          error={invalid}\n          placeholder={minText}\n          step={step}\n          ariaLabel={`${label} ${minText}`}\n          testId={testId ? `${testId}-min` : undefined}\n          onChange={(min) => onChange({ ...value, min })}\n        />\n        <Typography component=\"span\" sx={{ color: 'text.secondary' }}>\n          –\n        </Typography>\n        <RangeBound\n          bound={value.max}\n          error={invalid}\n          placeholder={maxText}\n          step={step}\n          ariaLabel={`${label} ${maxText}`}\n          testId={testId ? `${testId}-max` : undefined}\n          onChange={(max) => onChange({ ...value, max })}\n        />\n      </Box>\n      {invalid && (\n        <Typography\n          role=\"alert\"\n          data-testid={testId ? `${testId}-error` : undefined}\n          sx={{ fontSize: sxRem(11.2), color: 'error.main' }}\n        >\n          {invalidText}\n        </Typography>\n      )}\n    </Box>\n  );\n};\nTableFilterRangeField.displayName = 'TableFilter.RangeField';\n\nTableFilter.Layout = TableFilterLayout;\nTableFilter.Main = TableFilterMain;\nTableFilter.Panel = TableFilterPanel;\nTableFilter.Keyword = TableFilterKeyword;\nTableFilter.Section = TableFilterSection;\nTableFilter.CheckboxField = TableFilterCheckboxField;\nTableFilter.RangeField = TableFilterRangeField;\n"],"mappings":"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","names":[]}

package/dist/{chunk-4CXEWFKO.js → chunk-J5VWGQSR.js}

@@ -1,6 +1,6 @@
 import {
   FleetBody
-} from "./chunk-DB2ZFZVW.js";
+} from "./chunk-SBIZXZPP.js";
 import {
   FLEET_DEFAULT_LAGGING_AFTER_SECONDS,
   FLEET_DEFAULT_STALE_AFTER_SECONDS,
@@ -117,4 +117,4 @@ export {
   FleetMap,
   FleetMap_default
 };
-//# sourceMappingURL=chunk-4CXEWFKO.js.map
+//# sourceMappingURL=chunk-J5VWGQSR.js.map

package/dist/{chunk-AJ5SDHX5.js → chunk-JCL7WK4G.js}

@@ -18,7 +18,7 @@ import {
 } from "./chunk-KHG57NAE.js";
 import {
   TableFilter
-} from "./chunk-HXEBKOSM.js";
+} from "./chunk-J5UZB6Y6.js";
 import {
   DayBoundInput
 } from "./chunk-GY4NBSCN.js";
@@ -291,4 +291,4 @@ export {
   RangePill,
   PanelRangeField
 };
-//# sourceMappingURL=chunk-AJ5SDHX5.js.map
+//# sourceMappingURL=chunk-JCL7WK4G.js.map

package/dist/{chunk-MTFCPPZ5.js → chunk-JWZJSXI5.js}

@@ -1,4 +1,5 @@
 // src/components/data-display/Table/Table.helpers.ts
+var tableRowHeight = (rowHeight) => rowHeight ?? 52;
 var TABLE_DEFAULTS = {
   variant: "default",
   stripeColor: "neutral",
@@ -12,7 +13,6 @@ var TABLE_DEFAULTS = {
   selectedRows: [],
   sortable: false,
   virtualScrolling: false,
-  rowHeight: 52,
   overscan: 5,
   responsive: false,
   showColumnToggle: true
@@ -22,7 +22,8 @@ var definedProps = (props) => Object.fromEntries(
 );
 
 export {
+  tableRowHeight,
   TABLE_DEFAULTS,
   definedProps
 };
-//# sourceMappingURL=chunk-MTFCPPZ5.js.map
+//# sourceMappingURL=chunk-JWZJSXI5.js.map

package/dist/chunk-JWZJSXI5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Table/Table.helpers.ts"],"sourcesContent":["import type { TableProps } from './Table.types';\n\n/**\n * A virtualised row's height in design px: the caller's `rowHeight`, else 52.\n * Resolved here rather than in {@link TABLE_DEFAULTS} so the one number is read\n * where it is drawn (`rem`) and where the window is positioned with it (`remPx`).\n */\nexport const tableRowHeight = (rowHeight: number | undefined): number => rowHeight ?? 52;\n\nexport const TABLE_DEFAULTS: Partial<TableProps> = {\n  variant: 'default',\n  stripeColor: 'neutral',\n  glow: false,\n  pulse: false,\n  hoverable: false,\n  loading: false,\n  density: 'normal',\n  stickyHeader: false,\n  selectable: false,\n  selectedRows: [],\n  sortable: false,\n  virtualScrolling: false,\n  overscan: 5,\n  responsive: false,\n  showColumnToggle: true,\n};\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}` still\n// falls back to the default as a destructuring default would. Eighteen separate\n// destructuring defaults were most of this component's branch count.\nexport const definedProps = (props: TableProps): Partial<TableProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<TableProps>;\n\n// The container + styled table + optional header, shared by the loading, empty\n// and populated renders.\n"],"mappings":";AAOO,IAAM,iBAAiB,CAAC,cAA0C,aAAa;AAE/E,IAAM,iBAAsC;AAAA,EACjD,SAAS;AAAA,EACT,aAAa;AAAA,EACb,MAAM;AAAA,EACN,OAAO;AAAA,EACP,WAAW;AAAA,EACX,SAAS;AAAA,EACT,SAAS;AAAA,EACT,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,cAAc,CAAC;AAAA,EACf,UAAU;AAAA,EACV,kBAAkB;AAAA,EAClB,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,kBAAkB;AACpB;AAKO,IAAM,eAAe,CAAC,UAC3B,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;","names":[]}

package/dist/{chunk-5CKDRLRN.js → chunk-JXECOCNA.js}

@@ -1,10 +1,11 @@
 import {
   AppHeaderBrand
-} from "./chunk-MBSYD3ZU.js";
+} from "./chunk-GWFAINQ7.js";
 import {
   accentFor
 } from "./chunk-TCAQOUIB.js";
 import {
+  rem,
   sxRem
 } from "./chunk-YKCAJ2TN.js";
 
@@ -46,8 +47,8 @@ var AppHeaderStatus = ({
             "aria-hidden": true,
             "data-testid": `${dataTestId}-dot`,
             sx: {
-              width: 8,
-              height: 8,
+              width: rem(theme, 8),
+              height: rem(theme, 8),
               flex: "0 0 auto",
               borderRadius: "50%",
               backgroundColor: accentFor(theme, tone).main
@@ -117,7 +118,11 @@ var discloseSx = {
   // Guarded: on a touch screen an unguarded `:hover` sticks after the tap that
   // opened the panel, so the row stays highlighted behind it.
   "@media (hover: hover)": { "&:hover": { backgroundColor: "action.hover" } },
-  "&:focus-visible": { outline: "2px solid", outlineColor: "primary.main", outlineOffset: 2 }
+  "&:focus-visible": {
+    outline: (theme) => `${rem(theme, 2)} solid`,
+    outlineColor: "primary.main",
+    outlineOffset: sxRem(2)
+  }
 };
 var IdentityText = ({
   title,
@@ -163,20 +168,31 @@ var IdentityText = ({
 var IdentitySkeleton = ({
   size,
   dataTestId
-}) => /* @__PURE__ */ jsxs(
-  Box,
-  {
-    "data-testid": `${dataTestId}-loading`,
-    sx: { display: "flex", alignItems: "center", gap: 1.25, minWidth: 0 },
-    children: [
-      /* @__PURE__ */ jsx(Skeleton, { variant: "rounded", width: 40, height: 40, sx: { flex: "0 0 auto" } }),
-      /* @__PURE__ */ jsxs(Box, { sx: { minWidth: 0, flex: 1 }, children: [
-        /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 140, height: TITLE_PX[size] * 1.4 }),
-        /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: 180, height: 16 })
-      ] })
-    ]
-  }
-);
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": `${dataTestId}-loading`,
+      sx: { display: "flex", alignItems: "center", gap: 1.25, minWidth: 0 },
+      children: [
+        /* @__PURE__ */ jsx(
+          Skeleton,
+          {
+            variant: "rounded",
+            width: rem(theme, 40),
+            height: rem(theme, 40),
+            sx: { flex: "0 0 auto" }
+          }
+        ),
+        /* @__PURE__ */ jsxs(Box, { sx: { minWidth: 0, flex: 1 }, children: [
+          /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: rem(theme, 140), height: rem(theme, TITLE_PX[size] * 1.4) }),
+          /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: rem(theme, 180), height: rem(theme, 16) })
+        ] })
+      ]
+    }
+  );
+};
 var rowSx = {
   display: "flex",
   alignItems: "center",
@@ -242,4 +258,4 @@ export {
   AppHeaderStatus,
   AppHeaderIdentity
 };
-//# sourceMappingURL=chunk-5CKDRLRN.js.map
+//# sourceMappingURL=chunk-JXECOCNA.js.map

package/dist/chunk-JXECOCNA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/AppHeader/AppHeader.identity.tsx"],"sourcesContent":["'use client';\n\nimport KeyboardArrowDown from '@mui/icons-material/KeyboardArrowDown';\nimport Box from '@mui/material/Box/index.js';\nimport Skeleton from '@mui/material/Skeleton/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { rem, sxRem } from '../../../tokens/relative';\nimport { accentFor, type SizeValue } from '../../../tokens/scales';\n\nimport { AppHeaderBrand } from './AppHeader.brand';\nimport type { AppHeaderIdentityProps, AppHeaderStatusProps } from './AppHeader.types';\n\n/** Title type scale, per house size step. */\nconst TITLE_PX: Record<SizeValue, number> = { xs: 14, sm: 15, md: 17, lg: 20, xl: 24 };\n\n/** One line, ellipsised — a long store name must not push the actions off-screen. */\nconst ONE_LINE = {\n  minWidth: 0,\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n} as const;\n\n/**\n * The dotted state line: \"● Aberto agora · Retirada no balcão\".\n *\n * Segments are joined here rather than by the caller because the separator is a\n * presentational choice — a caller that pre-joins its own string can never be\n * restyled, and each segment loses the chance to carry its own markup.\n */\nexport const AppHeaderStatus: React.FC<AppHeaderStatusProps> = ({\n  tone,\n  items,\n  separator = '·',\n  className,\n  dataTestId = 'app-header-status',\n}) => {\n  const theme = useTheme();\n  const visible = items.filter((item) => item !== null && item !== undefined && item !== '');\n  if (visible.length === 0) return null;\n\n  return (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      sx={{ display: 'flex', alignItems: 'center', gap: 0.75, ...ONE_LINE }}\n    >\n      {tone && (\n        <Box\n          aria-hidden\n          data-testid={`${dataTestId}-dot`}\n          sx={{\n            width: rem(theme, 8),\n            height: rem(theme, 8),\n            flex: '0 0 auto',\n            borderRadius: '50%',\n            backgroundColor: accentFor(theme, tone).main,\n          }}\n        />\n      )}\n      <Typography variant=\"body2\" color=\"text.secondary\" component=\"span\" sx={ONE_LINE}>\n        {visible.map((item, index) => (\n          // Index keys: the segments are positional presentation, and nothing\n          // here reorders or is keyed on identity elsewhere.\n          <React.Fragment key={index}>\n            {index > 0 && (\n              <>\n                {/* Real spaces, not margin. A screen reader reads `textContent`,\n                    and a CSS-only gap runs \"Aberto agora\" straight into\n                    \"Retirada no balcão\" as one word. The glyph itself is\n                    hidden — it is punctuation, not something to announce. */}\n                {' '}\n                <Box component=\"span\" aria-hidden>\n                  {separator}\n                </Box>{' '}\n              </>\n            )}\n            {item}\n          </React.Fragment>\n        ))}\n      </Typography>\n    </Box>\n  );\n};\n\nAppHeaderStatus.displayName = 'AppHeaderStatus';\n\n/** The name and, when the block opens onto something, the chevron beside it. */\nconst IdentityTitle: React.FC<\n  Pick<AppHeaderIdentityProps, 'title' | 'size'> & {\n    interactive: boolean;\n    disclosed: boolean;\n    dataTestId: string;\n  }\n> = ({ title, size = 'md', interactive, disclosed, dataTestId }) => (\n  <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.25, minWidth: 0, width: '100%' }}>\n    <Typography\n      component=\"span\"\n      data-testid={`${dataTestId}-title`}\n      sx={{ fontSize: sxRem(TITLE_PX[size]), fontWeight: 700, lineHeight: 1.2, ...ONE_LINE }}\n    >\n      {title}\n    </Typography>\n    {interactive && (\n      <KeyboardArrowDown\n        aria-hidden\n        data-testid={`${dataTestId}-chevron`}\n        sx={{\n          flex: '0 0 auto',\n          fontSize: sxRem(20),\n          opacity: 0.7,\n          transition: 'transform 150ms ease',\n          transform: disclosed ? 'rotate(180deg)' : 'none',\n        }}\n      />\n    )}\n  </Box>\n);\n\n/**\n * The disclosure, wrapping the NAME ROW and nothing else (12-63).\n *\n * The padding is cancelled by an equal negative margin, so the hover and the\n * focus ring bleed outward while the title still starts on the same pixel as\n * the lines under it. A padded button with no offset moves one of the two.\n */\nconst discloseSx = {\n  display: 'flex',\n  alignItems: 'center',\n  gap: 0.25,\n  width: '100%',\n  minWidth: 0,\n  appearance: 'none',\n  px: 0.5,\n  mx: -0.5,\n  py: 0.25,\n  my: -0.25,\n  border: 'none',\n  borderRadius: 1.5,\n  background: 'none',\n  color: 'inherit',\n  font: 'inherit',\n  textAlign: 'left',\n  cursor: 'pointer',\n  // Guarded: on a touch screen an unguarded `:hover` sticks after the tap that\n  // opened the panel, so the row stays highlighted behind it.\n  '@media (hover: hover)': { '&:hover': { backgroundColor: 'action.hover' } },\n  '&:focus-visible': {\n    outline: (theme: Theme) => `${rem(theme, 2)} solid`,\n    outlineColor: 'primary.main',\n    outlineOffset: sxRem(2),\n  },\n} as const;\n\n/**\n * The text column: the name row, then the quieter lines under it.\n *\n * ## `subtitle` and `status` are OUTSIDE the disclosure, on purpose (12-63)\n *\n * Both are `ReactNode`, and `AppHeaderStatus.items` is a `ReactNode[]` — so a\n * segment of the state line is free to be a control, and consumers put controls\n * there: a mesa chip, a service-mode picker. While the whole block was one\n * `<button>` those were `<button>`s inside a `<button>`, which is invalid HTML\n * (the content model of `button` excludes interactive content) and, more\n * visibly, means one tap fires two handlers. An adopting storefront opened two\n * popups on every tap of either control because of it, and had already\n * hand-rolled this component at one tier to dodge the nesting — a consumer\n * working around the component is the report.\n *\n * The target stays large. The button is the full-width NAME ROW, which is the\n * thing a reader aims at — what it gives up is the mark beside it, and a mark\n * that opens the panel is not worth a state line that cannot hold a control.\n */\nconst IdentityText: React.FC<\n  Pick<\n    AppHeaderIdentityProps,\n    'title' | 'subtitle' | 'status' | 'size' | 'discloseLabel' | 'className'\n  > & {\n    onDisclose: (() => void) | undefined;\n    disclosed: boolean;\n    dataTestId: string;\n  }\n> = ({\n  title,\n  subtitle,\n  status,\n  size = 'md',\n  onDisclose,\n  disclosed,\n  discloseLabel,\n  className,\n  dataTestId,\n}) => {\n  const name = (\n    <IdentityTitle\n      title={title}\n      size={size}\n      interactive={Boolean(onDisclose)}\n      disclosed={disclosed}\n      dataTestId={dataTestId}\n    />\n  );\n  return (\n    <Box sx={{ minWidth: 0, flex: 1, display: 'flex', flexDirection: 'column', gap: 0.25 }}>\n      {onDisclose ? (\n        <Box\n          component=\"button\"\n          type=\"button\"\n          className={className}\n          data-testid={dataTestId}\n          onClick={onDisclose}\n          aria-haspopup=\"dialog\"\n          aria-expanded={disclosed}\n          aria-label={discloseLabel ?? `Detalhes de ${title}`}\n          sx={discloseSx}\n        >\n          {name}\n        </Box>\n      ) : (\n        name\n      )}\n      {subtitle && (\n        <Typography variant=\"body2\" color=\"text.secondary\" component=\"span\" sx={ONE_LINE}>\n          {subtitle}\n        </Typography>\n      )}\n      {status}\n    </Box>\n  );\n};\n\n/** The placeholder held while the identity is still resolving. */\nconst IdentitySkeleton: React.FC<{ size: SizeValue; dataTestId: string }> = ({\n  size,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n  return (\n    <Box\n      data-testid={`${dataTestId}-loading`}\n      sx={{ display: 'flex', alignItems: 'center', gap: 1.25, minWidth: 0 }}\n    >\n      <Skeleton\n        variant=\"rounded\"\n        width={rem(theme, 40)}\n        height={rem(theme, 40)}\n        sx={{ flex: '0 0 auto' }}\n      />\n      <Box sx={{ minWidth: 0, flex: 1 }}>\n        <Skeleton variant=\"text\" width={rem(theme, 140)} height={rem(theme, TITLE_PX[size] * 1.4)} />\n        <Skeleton variant=\"text\" width={rem(theme, 180)} height={rem(theme, 16)} />\n      </Box>\n    </Box>\n  );\n};\n\n/**\n * The BLOCK's row: the mark, then the text column beside it.\n *\n * Always a `Box` div now — since 12-63 the disclosure is the name row inside\n * the text column ({@link discloseSx}), not this element. `width: '100%'` and\n * `minWidth: 0` stay because the column below still has to ellipsise against\n * something; the argument about a `<button>` sizing to max-content moved to\n * `discloseSx`, which is where the button now is.\n */\nconst rowSx = {\n  display: 'flex',\n  alignItems: 'center',\n  gap: 1.25,\n  width: '100%',\n  minWidth: 0,\n  textAlign: 'left',\n} as const;\n\n/**\n * Mark + title + state line, and — when it can be opened — a name row that is\n * the button.\n *\n * The disclosure used to wrap EVERYTHING, on the argument that the chevron\n * alone is a 20px target next to a 40px mark that does nothing. The target is\n * still not the chevron: the button is the full-width NAME ROW, which is what a\n * reader aims at. What it no longer swallows is the mark beside it and the\n * quieter lines below — because those lines take `ReactNode`s, consumers put\n * CONTROLS in them, and a control inside a button is invalid HTML whose every\n * tap fires two handlers. See {@link IdentityText} (12-63).\n *\n * `className` and `dataTestId` stay on the same elements they always named: the\n * block when it is static, the disclosure when there is one.\n */\nexport const AppHeaderIdentity: React.FC<AppHeaderIdentityProps> = ({\n  title,\n  subtitle,\n  status,\n  mark,\n  logoUrl,\n  seedColor,\n  onDisclose,\n  disclosed = false,\n  discloseLabel,\n  loading = false,\n  size = 'md',\n  className,\n  dataTestId = 'app-header-identity',\n}) => {\n  if (loading) return <IdentitySkeleton size={size} dataTestId={dataTestId} />;\n\n  return (\n    <Box\n      className={onDisclose ? undefined : className}\n      data-testid={onDisclose ? undefined : dataTestId}\n      sx={rowSx}\n    >\n      {mark ?? (\n        <AppHeaderBrand\n          name={title}\n          logoUrl={logoUrl}\n          seedColor={seedColor}\n          size={size}\n          dataTestId={`${dataTestId}-brand`}\n        />\n      )}\n      <IdentityText\n        title={title}\n        subtitle={subtitle}\n        status={status}\n        size={size}\n        onDisclose={onDisclose}\n        disclosed={disclosed}\n        discloseLabel={discloseLabel}\n        className={className}\n        dataTestId={dataTestId}\n      />\n    </Box>\n  );\n};\n\nAppHeaderIdentity.displayName = 'AppHeaderIdentity';\n"],"mappings":"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","names":[]}

package/dist/{chunk-WUTHROII.js → chunk-JYWF76Z5.js}

@@ -3,7 +3,11 @@ import {
   regionAttrs,
   transitionSettings,
   triggerStyles
-} from "./chunk-TVL5V2JK.js";
+} from "./chunk-GGMB6LJH.js";
+import {
+  remPx,
+  sxRem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/layout/Collapsible/Collapsible.tsx
 import Box from "@mui/material/Box/index.js";
@@ -12,14 +16,15 @@ import { useTheme } from "@mui/material/styles/index.js";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 var useMeasuredHeight = (open, maxHeight, children) => {
+  const theme = useTheme();
   const contentRef = useRef(null);
   const [height, setHeight] = useState("auto");
   const measureHeight = useCallback(() => {
     if (contentRef.current) {
       const scrollHeight = contentRef.current.scrollHeight;
-      setHeight(maxHeight ? Math.min(scrollHeight, maxHeight) : scrollHeight);
+      setHeight(maxHeight ? Math.min(scrollHeight, remPx(theme, maxHeight)) : scrollHeight);
     }
-  }, [maxHeight]);
+  }, [maxHeight, theme]);
   useEffect(() => {
     if (!open) {
       setHeight(0);
@@ -49,7 +54,8 @@ var DefaultCollapsible = ({
     timeout: disabled ? 0 : duration,
     sx: {
       ...dimmedStyles(disabled),
-      ...maxHeight && { maxHeight, overflow: "hidden" },
+      // `sx` reads 1 or less as a fraction of the parent; anything else is design px.
+      ...maxHeight && { maxHeight: maxHeight <= 1 ? `${maxHeight * 100}%` : sxRem(maxHeight), overflow: "hidden" },
       ...sx
     },
     className,
@@ -172,4 +178,4 @@ export {
   CollapsibleTrigger,
   CollapsibleContent
 };
-//# sourceMappingURL=chunk-WUTHROII.js.map
+//# sourceMappingURL=chunk-JYWF76Z5.js.map

package/dist/chunk-JYWF76Z5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Collapsible/Collapsible.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Collapse from '@mui/material/Collapse/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport React, { useCallback,useEffect, useRef, useState } from 'react';\n\nimport { remPx, sxRem } from '../../../tokens/relative';\n\nimport {\n  dimmedStyles,\n  regionAttrs,\n  transitionSettings,\n  triggerStyles,\n} from './Collapsible.helpers';\nimport type { CollapsibleContentProps,CollapsibleProps, CollapsibleTriggerProps } from './Collapsible.types';\n\n/**\n * The smooth and spring variants animate an explicit pixel height, so the content\n * has to be measured after every render that could have changed it.\n */\nconst useMeasuredHeight = (\n  open: boolean,\n  maxHeight: number | undefined,\n  children: React.ReactNode,\n) => {\n  const theme = useTheme();\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [height, setHeight] = useState<number | 'auto'>('auto');\n\n  const measureHeight = useCallback(() => {\n    if (contentRef.current) {\n      const scrollHeight = contentRef.current.scrollHeight;\n      // Cap at maxHeight (design px, through the type scale) if provided\n      setHeight(maxHeight ? Math.min(scrollHeight, remPx(theme, maxHeight)) : scrollHeight);\n    }\n  }, [maxHeight, theme]);\n\n  useEffect(() => {\n    if (!open) {\n      setHeight(0);\n    } else if (contentRef.current) {\n      measureHeight();\n    }\n  }, [open, measureHeight, children]);\n\n  return { contentRef, height };\n};\n\ntype VariantProps = Omit<CollapsibleProps, 'variant' | 'onToggle'> & {\n  duration: number;\n  disabled: boolean;\n  keepMounted: boolean;\n  transition: { duration: number; easing: string };\n};\n\n// Use MUI's built-in Collapse for the default variant.\nconst DefaultCollapsible: React.FC<VariantProps> = ({\n  children,\n  open,\n  duration,\n  disabled,\n  keepMounted,\n  maxHeight,\n  sx,\n  className,\n  dataTestId,\n  transition: _transition,\n  easing: _easing,\n  ...otherProps\n}) => (\n  <Collapse\n    in={open && !disabled}\n    timeout={disabled ? 0 : duration}\n    sx={{\n      ...dimmedStyles(disabled),\n      // `sx` reads 1 or less as a fraction of the parent; anything else is design px.\n      ...(maxHeight && { maxHeight: maxHeight <= 1 ? `${maxHeight * 100}%` : sxRem(maxHeight), overflow: 'hidden' }),\n      ...sx,\n    }}\n    className={className}\n    unmountOnExit={!keepMounted}\n    {...regionAttrs({ open, disabled, dataTestId })}\n    {...otherProps}\n  >\n    <Box>{children}</Box>\n  </Collapse>\n);\n\nconst AnimatedCollapsible: React.FC<VariantProps> = ({\n  children,\n  open,\n  disabled,\n  keepMounted,\n  maxHeight,\n  transition,\n  sx,\n  className,\n  dataTestId,\n  duration: _duration,\n  easing: _easing,\n  ...otherProps\n}) => {\n  const { contentRef, height } = useMeasuredHeight(open, maxHeight, children);\n\n  return (\n    <Box\n      component=\"div\"\n      sx={{\n        overflow: 'hidden',\n        height: open && !disabled ? height : 0,\n        transition: disabled ? 'none' : `height ${transition.duration}ms ${transition.easing}`,\n        willChange: disabled ? 'auto' : 'height',\n        ...dimmedStyles(disabled),\n        ...sx,\n      }}\n      className={className}\n      {...regionAttrs({ open, disabled, dataTestId })}\n      {...otherProps}\n    >\n      <Box ref={contentRef}>{(keepMounted || (open && !disabled)) && children}</Box>\n    </Box>\n  );\n};\n\nexport const Collapsible: React.FC<CollapsibleProps> = ({\n  variant = 'default',\n  duration = 300,\n  easing,\n  onToggle,\n  disabled = false,\n  keepMounted = false,\n  ...rest\n}) => {\n  const theme = useTheme();\n  const { open } = rest;\n\n  // Trigger onToggle callback when open state changes\n  useEffect(() => {\n    if (onToggle && !disabled) {\n      onToggle(open);\n    }\n  }, [open, onToggle, disabled]);\n\n  const variantProps: VariantProps = {\n    ...rest,\n    duration,\n    easing,\n    disabled,\n    keepMounted,\n    transition: transitionSettings(theme, variant, duration, easing),\n  };\n\n  return variant === 'default' ? (\n    <DefaultCollapsible {...variantProps} />\n  ) : (\n    <AnimatedCollapsible {...variantProps} />\n  );\n};\n\nexport const CollapsibleTrigger: React.FC<CollapsibleTriggerProps> = ({\n  children,\n  onClick,\n  disabled = false,\n  expanded = false,\n  className,\n  dataTestId,\n  ...otherProps\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      component=\"button\"\n      onClick={disabled ? undefined : onClick}\n      disabled={disabled}\n      className={className}\n      data-testid={dataTestId}\n      aria-expanded={expanded}\n      aria-disabled={disabled}\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      data-state={expanded ? 'open' : 'closed'}\n      sx={triggerStyles(theme, { disabled, expanded })}\n      {...otherProps}\n    >\n      {children}\n    </Box>\n  );\n};\n\nexport const CollapsibleContent: React.FC<CollapsibleContentProps> = ({\n  children,\n  className,\n  ...otherProps\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      className={className}\n      sx={{\n        padding: theme.spacing(2),\n      }}\n      {...otherProps}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-B76QCDCE.js → chunk-K4L42FF6.js}

@@ -2,6 +2,9 @@ import {
   onMedia,
   uiInk
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/feedback/TutorialOverlay/TutorialStepBody.tsx
 import CompleteIcon from "@mui/icons-material/CheckCircle";
@@ -25,8 +28,8 @@ var StepIndicator = styled(Box)(({ theme }) => ({
 var StepDot = styled(Box, {
   shouldForwardProp: (prop) => prop !== "active" && prop !== "completed"
 })(({ theme, active, completed }) => ({
-  width: 8,
-  height: 8,
+  width: rem(theme, 8),
+  height: rem(theme, 8),
   borderRadius: "50%",
   background: completed ? theme.palette.success.main : active ? theme.palette.primary.main : alpha(theme.palette.text.primary, 0.3),
   transition: "all 0.3s ease",
@@ -223,4 +226,4 @@ var TutorialStepBody = ({
 export {
   TutorialStepBody
 };
-//# sourceMappingURL=chunk-B76QCDCE.js.map
+//# sourceMappingURL=chunk-K4L42FF6.js.map

package/dist/chunk-K4L42FF6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/TutorialOverlay/TutorialStepBody.tsx"],"sourcesContent":["import CompleteIcon from '@mui/icons-material/CheckCircle';\nimport CloseIcon from '@mui/icons-material/Close';\nimport PrevIcon from '@mui/icons-material/NavigateBefore';\nimport NextIcon from '@mui/icons-material/NavigateNext';\nimport RestartIcon from '@mui/icons-material/Refresh';\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Stack from '@mui/material/Stack/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport React, {  } from 'react';\n\nimport { onMedia, uiInk } from '../../../tokens/ink';\nimport { rem } from '../../../tokens/relative';\n\nimport type { TutorialOverlayProps } from './TutorialOverlay.types';\nimport type { TutorialCopy } from '../../../copy';\n\n// Animation keyframes\n\nconst StepIndicator = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  gap: theme.spacing(1),\n  marginTop: theme.spacing(2),\n  marginBottom: theme.spacing(2) }));\n\n\nconst StepDot = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'active' && prop !== 'completed' })<{ active?: boolean; completed?: boolean }>(({ theme, active, completed }) => ({\n  width: rem(theme, 8),\n  height: rem(theme, 8),\n  borderRadius: '50%',\n  background: completed\n    ? theme.palette.success.main\n    : active\n      ? theme.palette.primary.main\n      : alpha(theme.palette.text.primary, 0.3),\n  transition: 'all 0.3s ease',\n  ...(active && {\n    transform: 'scale(1.5)' }) }));\n\n// Title, body copy, the step dots and the navigation row.\n\n// The step's controls: skip/restart on the left, previous/next on the right.\nconst TutorialStepNav: React.FC<{\n  copy: TutorialCopy;\n  currentStep: number;\n  stepCount: number;\n  isLastStep: boolean;\n  allowSkip: boolean;\n  requiresActionBeforeNext?: boolean;\n  onNext: () => void;\n  onPrev: () => void;\n  onSkip: () => void;\n  onRestart: () => void;\n}> = ({\n  copy,\n  currentStep,\n  stepCount,\n  isLastStep,\n  allowSkip,\n  requiresActionBeforeNext,\n  onNext,\n  onPrev,\n  onSkip,\n  onRestart }) => (\n        <Stack\n          direction=\"row\"\n          spacing={1}\n          justifyContent=\"space-between\"\n          data-testid=\"tutorial-navigation\"\n        >\n          <Stack direction=\"row\" spacing={1}>\n            {allowSkip && (\n              <Button size=\"small\" onClick={onSkip} variant=\"text\">\n                {copy.skip}\n              </Button>\n            )}\n            {stepCount > 1 && (\n              <IconButton\n                size=\"small\"\n                onClick={onRestart}\n                disabled={currentStep === 0}\n                title={copy.restart}\n              >\n                <RestartIcon fontSize=\"small\" />\n              </IconButton>\n            )}\n          </Stack>\n\n          <Stack direction=\"row\" spacing={1}>\n            {stepCount > 1 && currentStep > 0 && (\n              <Button\n                size=\"small\"\n                startIcon={<PrevIcon />}\n                onClick={onPrev}\n                disabled={currentStep === 0}\n                data-testid=\"tutorial-prev-button\"\n              >\n                {copy.previous}\n              </Button>\n            )}\n\n            {!isLastStep ? (\n              <Button\n                variant=\"contained\"\n                size=\"small\"\n                endIcon={<NextIcon />}\n                onClick={onNext}\n                disabled={requiresActionBeforeNext}\n                title={requiresActionBeforeNext ? 'Complete the required action first' : ''}\n                data-testid=\"tutorial-next-button\"\n              >\n                {copy.next}\n              </Button>\n            ) : (\n              <Button\n                variant=\"contained\"\n                size=\"small\"\n                endIcon={<CompleteIcon />}\n                onClick={onNext}\n                sx={(theme) => {\n                  const [from, to] = uiInk(theme).celebration.mint;\n                  return { background: `linear-gradient(135deg, ${from} 0%, ${to} 100%)` };\n                }}\n                data-testid=\"tutorial-finish-button\"\n              >\n                {stepCount === 1 ? 'Complete' : 'Finish'}\n              </Button>\n            )}\n          </Stack>\n        </Stack>\n);\n\nconst StepDots: React.FC<{ currentStep: number; stepCount: number }> = ({\n  currentStep,\n  stepCount }) => (\n  <StepIndicator data-testid=\"tutorial-step-indicators\">\n    {Array.from({ length: stepCount }).map((_, index) => (\n      <StepDot\n        key={index}\n        active={index === currentStep}\n        completed={index < currentStep}\n        data-testid={`tutorial-indicator-${index}`}\n      />\n    ))}\n  </StepIndicator>\n);\n\n// Title, and the close button when skipping is allowed.\nconst TutorialStepHeader: React.FC<{\n  title: React.ReactNode;\n  currentStep: number;\n  allowSkip: boolean;\n  onSkip: () => void;\n}> = ({ title, currentStep, allowSkip, onSkip }) => (\n        <Box\n          sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}\n        >\n          <Typography\n            id={`tutorial-title-${currentStep}`}\n            variant=\"h6\"\n            fontWeight=\"bold\"\n            sx={{ flex: 1 }}\n            data-testid=\"tutorial-step-title\"\n          >\n            {title}\n          </Typography>\n          {allowSkip && (\n            <IconButton\n              size=\"small\"\n              onClick={onSkip}\n              sx={{ ml: 1, mt: -1, mr: -1 }}\n              data-testid=\"tutorial-close-button\"\n            >\n              <CloseIcon fontSize=\"small\" />\n            </IconButton>\n          )}\n        </Box>\n);\n\nexport const TutorialStepBody: React.FC<{\n  copy: TutorialCopy;\n  step: TutorialOverlayProps['steps'][number];\n  currentStep: number;\n  stepCount: number;\n  progress: number;\n  isLastStep: boolean;\n  allowSkip: boolean;\n  showProgress: boolean;\n  requiresActionBeforeNext?: boolean;\n  onNext: () => void;\n  onPrev: () => void;\n  onSkip: () => void;\n  onRestart: () => void;\n}> = ({\n  copy,\n  step,\n  currentStep,\n  stepCount,\n  progress: _progress,\n  isLastStep,\n  allowSkip,\n  showProgress,\n  requiresActionBeforeNext,\n  onNext,\n  onPrev,\n  onSkip,\n  onRestart }) => (\n      <Stack spacing={2}>\n        <TutorialStepHeader\n          title={step.title}\n          currentStep={currentStep}\n          allowSkip={allowSkip}\n          onSkip={onSkip}\n        />\n\n        <Typography\n          id={`tutorial-content-${currentStep}`}\n          variant=\"body2\"\n          color=\"text.secondary\"\n          data-testid=\"tutorial-step-content\"\n        >\n          {step.content}\n        </Typography>\n\n        {showProgress && (\n          <Typography variant=\"caption\" color=\"text.secondary\" align=\"center\">\n            {currentStep + 1} of {stepCount}\n          </Typography>\n        )}\n\n        {step.action && (\n          <Button\n            variant=\"contained\"\n            size=\"small\"\n            onClick={step.action.onClick}\n            sx={(theme) => {\n              const [from, to] = uiInk(theme).celebration.violet;\n              return { background: `linear-gradient(135deg, ${from} 0%, ${to} 100%)`, color: onMedia(theme) };\n            }}\n          >\n            {step.action.label}\n          </Button>\n        )}\n\n        <StepDots currentStep={currentStep} stepCount={stepCount} />\n\n        <TutorialStepNav\n          copy={copy}\n          currentStep={currentStep}\n          stepCount={stepCount}\n          isLastStep={isLastStep}\n          allowSkip={allowSkip}\n          requiresActionBeforeNext={requiresActionBeforeNext}\n          onNext={onNext}\n          onPrev={onPrev}\n          onSkip={onSkip}\n          onRestart={onRestart}\n        />\n      </Stack>\n);\n\n// Main component\n"],"mappings":"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","names":[]}

package/dist/{chunk-4JFL62K3.js → chunk-K7FSTB2K.js}

@@ -1,12 +1,12 @@
 import {
   onTrackInk,
   switchSx
-} from "./chunk-AUSUCZYR.js";
+} from "./chunk-ZBVU2YWV.js";
 import {
   LABEL_GAP_UNITS,
   SWITCH_ICON_SIZES,
   TAP_TARGET_MIN
-} from "./chunk-D5SZXH7Q.js";
+} from "./chunk-TNBJ4DK4.js";
 import {
   sxRem
 } from "./chunk-YKCAJ2TN.js";
@@ -220,4 +220,4 @@ export {
   SwitchHelper,
   SwitchRow
 };
-//# sourceMappingURL=chunk-4JFL62K3.js.map
+//# sourceMappingURL=chunk-K7FSTB2K.js.map

package/dist/{chunk-WE3LJPRN.js → chunk-KE473LK6.js}

@@ -1,6 +1,6 @@
 import {
   DropdownMenu
-} from "./chunk-VFHGILXI.js";
+} from "./chunk-U3DBQXPI.js";
 import {
   Button
 } from "./chunk-2EAAWOZ2.js";
@@ -25,4 +25,4 @@ function CardKebab({
 export {
   CardKebab
 };
-//# sourceMappingURL=chunk-WE3LJPRN.js.map
+//# sourceMappingURL=chunk-KE473LK6.js.map