@12-apps/ui 6.36.0 → 6.38.0

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-X2AKLDPW.js → chunk-KE473LK6.js}

@@ -1,9 +1,9 @@
 import {
   DropdownMenu
-} from "./chunk-VFHGILXI.js";
+} from "./chunk-U3DBQXPI.js";
 import {
   Button
-} from "./chunk-KH25WUSX.js";
+} from "./chunk-2EAAWOZ2.js";
 
 // src/components/data-display/CardKit/CardKebab.tsx
 import { jsx } from "react/jsx-runtime";
@@ -25,4 +25,4 @@ function CardKebab({
 export {
   CardKebab
 };
-//# sourceMappingURL=chunk-X2AKLDPW.js.map
+//# sourceMappingURL=chunk-KE473LK6.js.map

package/dist/{chunk-TBF2CPJW.js → chunk-KIHGTL2D.js}

@@ -1,6 +1,10 @@
 import {
   shadowInk
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem,
+  rems
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/layout/Drawer/Drawer.tsx
 import Close from "@mui/icons-material/Close";
@@ -10,6 +14,10 @@ import IconButton from "@mui/material/IconButton/index.js";
 import Typography from "@mui/material/Typography/index.js";
 import { alpha, useTheme } from "@mui/material/styles/index.js";
 import { jsx, jsxs } from "react/jsx-runtime";
+var drawerLength = (theme, value) => {
+  if (typeof value !== "number") return value;
+  return value <= 1 && value !== 0 ? `${value * 100}%` : rem(theme, value);
+};
 var resolveAnchor = (anchor, variant) => {
   if (anchor) return anchor;
   switch (variant) {
@@ -27,21 +35,23 @@ var resolveAnchor = (anchor, variant) => {
   }
 };
 var buildDrawerStyles = (theme, anchor, variant, width, height, paperSx) => {
+  const widthCss = drawerLength(theme, width);
+  const heightCss = drawerLength(theme, height);
   const baseStyles = {
-    width: ["left", "right"].includes(anchor) ? width : "100%",
-    height: ["top", "bottom"].includes(anchor) ? height : "100%",
+    width: ["left", "right"].includes(anchor) ? widthCss : "100%",
+    height: ["top", "bottom"].includes(anchor) ? heightCss : "100%",
     flexShrink: 0
   };
   if (variant === "glass") {
     return {
       ...baseStyles,
       "& .MuiDrawer-paper": {
-        width,
+        width: widthCss,
         height: "100%",
         backgroundColor: alpha(theme.palette.background.paper, 0.1),
-        backdropFilter: "blur(20px)",
+        backdropFilter: `blur(${rem(theme, 20)})`,
         border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,
-        boxShadow: `0 8px 32px ${shadowInk(theme, 0.1)}`,
+        boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.1)}`,
         ...paperSx
       }
     };
@@ -49,8 +59,8 @@ var buildDrawerStyles = (theme, anchor, variant, width, height, paperSx) => {
   return {
     ...baseStyles,
     "& .MuiDrawer-paper": {
-      width: ["left", "right"].includes(anchor) ? width : "100%",
-      height: ["top", "bottom"].includes(anchor) ? height : "100%",
+      width: ["left", "right"].includes(anchor) ? widthCss : "100%",
+      height: ["top", "bottom"].includes(anchor) ? heightCss : "100%",
       boxSizing: "border-box",
       ...paperSx
     }
@@ -62,7 +72,7 @@ var Drawer = ({
   onClose,
   variant = "left",
   anchor,
-  width = 280,
+  width,
   height = "100%",
   persistent = false,
   backdrop = true,
@@ -89,7 +99,7 @@ var Drawer = ({
           invisible: !backdrop
         }
       },
-      sx: buildDrawerStyles(theme, drawerAnchor, variant, width, height, paperSx),
+      sx: buildDrawerStyles(theme, drawerAnchor, variant, width ?? 280, height, paperSx),
       className,
       "data-testid": dataTestId || "drawer",
       ...rest,
@@ -114,7 +124,7 @@ var DrawerHeader = ({
         alignItems: "center",
         padding: theme.spacing(2),
         borderBottom: `1px solid ${theme.palette.divider}`,
-        minHeight: 64,
+        minHeight: rem(theme, 64),
         justifyContent: "space-between"
       },
       children: [
@@ -154,4 +164,4 @@ export {
   DrawerHeader,
   DrawerContent
 };
-//# sourceMappingURL=chunk-TBF2CPJW.js.map
+//# sourceMappingURL=chunk-KIHGTL2D.js.map

package/dist/chunk-KIHGTL2D.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Drawer/Drawer.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport MuiDrawer from '@mui/material/Drawer/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type { DrawerContentProps,DrawerHeaderProps, DrawerProps } from './Drawer.types';\nimport { shadowInk } from '../../../tokens/ink';\nimport { rem, rems } from '../../../tokens/relative';\n\ntype DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';\n\n/**\n * A `width`/`height` prop as CSS. `sx` reads a number of 1 or less as a\n * fraction of the parent, and that stays so; any other number is design px,\n * through the type scale; a string is as given.\n */\nconst drawerLength = (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\n// `variant` doubles as a position preset, but an explicit `anchor` always wins.\nconst resolveAnchor = (\n  anchor: DrawerProps['anchor'],\n  variant: DrawerProps['variant'],\n): DrawerAnchor => {\n  if (anchor) return anchor;\n\n  // Map variant to anchor position\n  switch (variant) {\n    case 'right':\n      return 'right';\n    case 'top':\n      return 'top';\n    case 'bottom':\n      return 'bottom';\n    case 'glass':\n      return 'right';\n    case 'left':\n    default:\n      return 'left';\n  }\n};\n\nconst buildDrawerStyles = (\n  theme: Theme,\n  anchor: DrawerAnchor,\n  variant: DrawerProps['variant'],\n  width: DrawerProps['width'],\n  height: DrawerProps['height'],\n  // Merged LAST into the surface's own rules, so a caller can shape the sliding\n  // surface itself (rounded corners on a bottom sheet, a docked panel's offset)\n  // without reaching for the MUI paper class from outside. Undefined by default:\n  // omit it and the drawer styles exactly as it always has.\n  paperSx?: DrawerProps['paperSx'],\n) => {\n  const widthCss = drawerLength(theme, width);\n  const heightCss = drawerLength(theme, height);\n  const baseStyles = {\n    width: ['left', 'right'].includes(anchor) ? widthCss : '100%',\n    height: ['top', 'bottom'].includes(anchor) ? heightCss : '100%',\n    flexShrink: 0,\n  };\n\n  if (variant === 'glass') {\n    return {\n      ...baseStyles,\n      '& .MuiDrawer-paper': {\n        width: widthCss,\n        height: '100%',\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: `blur(${rem(theme, 20)})`,\n        border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n        boxShadow: `${rems(theme, 0, 8, 32)} ${shadowInk(theme, 0.1)}`,\n        ...paperSx,\n      },\n    };\n  }\n\n  return {\n    ...baseStyles,\n    '& .MuiDrawer-paper': {\n      width: ['left', 'right'].includes(anchor) ? widthCss : '100%',\n      height: ['top', 'bottom'].includes(anchor) ? heightCss : '100%',\n      boxSizing: 'border-box',\n      ...paperSx,\n    },\n  };\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n  children,\n  open,\n  onClose,\n  variant = 'left',\n  anchor,\n  width,\n  height = '100%',\n  persistent = false,\n  backdrop = true,\n  hideBackdrop = false,\n  keepMounted = false,\n  paperSx,\n  className,\n  dataTestId,\n  ...rest\n}) => {\n  const theme = useTheme();\n  const drawerAnchor = resolveAnchor(anchor, variant);\n\n  return (\n    <MuiDrawer\n      anchor={drawerAnchor}\n      open={open}\n      onClose={onClose}\n      variant={persistent ? 'persistent' : 'temporary'}\n      ModalProps={{\n        keepMounted,\n        hideBackdrop,\n        BackdropProps: {\n          invisible: !backdrop,\n        },\n      }}\n      sx={buildDrawerStyles(theme, drawerAnchor, variant, width ?? 280, height, paperSx)}\n      className={className}\n      data-testid={dataTestId || 'drawer'}\n      {...rest}\n    >\n      {children}\n    </MuiDrawer>\n  );\n};\n\nexport const DrawerHeader: React.FC<DrawerHeaderProps> = ({\n  children,\n  onClose,\n  showCloseButton = true,\n  closeLabel,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-header'}\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        padding: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        minHeight: rem(theme, 64),\n        justifyContent: 'space-between',\n      }}\n    >\n      <Box sx={{ flex: 1 }} data-testid={dataTestId ? `${dataTestId}-title` : 'drawer-title'}>\n        {typeof children === 'string' ? <Typography variant=\"h6\">{children}</Typography> : children}\n      </Box>\n      {showCloseButton && onClose && (\n        <IconButton\n          onClick={onClose}\n          edge=\"end\"\n          aria-label={closeLabel ?? 'Close drawer'}\n          data-testid={dataTestId ? `${dataTestId}-close` : 'drawer-close'}\n        >\n          <Close />\n        </IconButton>\n      )}\n    </Box>\n  );\n};\n\nexport const DrawerContent: React.FC<DrawerContentProps> = ({ children, padding = true, dataTestId }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-content'}\n      sx={{\n        flex: 1,\n        overflow: 'auto',\n        padding: padding ? theme.spacing(2) : 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-3T5Z5HXF.js → chunk-KM3Y5TCG.js}

@@ -1,3 +1,7 @@
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
+
 // src/components/utility/AnimatedIcon/AnimatedIcon.animations.ts
 import { keyframes } from "@mui/material/styles/index.js";
 var rotateAnimation = keyframes`
@@ -22,56 +26,56 @@ var pulseAnimation = keyframes`
     opacity: 1;
   }
 `;
-var translateAnimation = keyframes`
+var translateAnimation = (theme) => keyframes`
   0% {
     transform: translateY(0px);
   }
   50% {
-    transform: translateY(-8px);
+    transform: translateY(${rem(theme, -8)});
   }
   100% {
     transform: translateY(0px);
   }
 `;
-var glowPulseAnimation = keyframes`
+var glowPulseAnimation = (theme) => keyframes`
   0% {
-    box-shadow: 0 0 5px currentColor, 0 0 10px currentColor, 0 0 15px currentColor;
+    box-shadow: 0 0 ${rem(theme, 5)} currentColor, 0 0 ${rem(theme, 10)} currentColor, 0 0 ${rem(theme, 15)} currentColor;
   }
   50% {
-    box-shadow: 0 0 10px currentColor, 0 0 20px currentColor, 0 0 30px currentColor;
+    box-shadow: 0 0 ${rem(theme, 10)} currentColor, 0 0 ${rem(theme, 20)} currentColor, 0 0 ${rem(theme, 30)} currentColor;
   }
   100% {
-    box-shadow: 0 0 5px currentColor, 0 0 10px currentColor, 0 0 15px currentColor;
+    box-shadow: 0 0 ${rem(theme, 5)} currentColor, 0 0 ${rem(theme, 10)} currentColor, 0 0 ${rem(theme, 15)} currentColor;
   }
 `;
-var bounceAnimation = keyframes`
+var bounceAnimation = (theme) => keyframes`
   0%, 20%, 50%, 80%, 100% {
     transform: translateY(0);
   }
   40% {
-    transform: translateY(-20px);
+    transform: translateY(${rem(theme, -20)});
   }
   60% {
-    transform: translateY(-10px);
+    transform: translateY(${rem(theme, -10)});
   }
 `;
-var shakeAnimation = keyframes`
+var shakeAnimation = (theme) => keyframes`
   0%, 100% {
     transform: translateX(0);
   }
   10%, 30%, 50%, 70%, 90% {
-    transform: translateX(-4px);
+    transform: translateX(${rem(theme, -4)});
   }
   20%, 40%, 60%, 80% {
-    transform: translateX(4px);
+    transform: translateX(${rem(theme, 4)});
   }
 `;
-var flipAnimation = keyframes`
+var flipAnimation = (theme) => keyframes`
   0% {
-    transform: perspective(400px) rotateY(0);
+    transform: perspective(${rem(theme, 400)}) rotateY(0);
   }
   100% {
-    transform: perspective(400px) rotateY(360deg);
+    transform: perspective(${rem(theme, 400)}) rotateY(360deg);
   }
 `;
 var spinAnimation = keyframes`
@@ -110,24 +114,24 @@ var heartbeatAnimation = keyframes`
     transform: scale(1);
   }
 `;
-var wobbleAnimation = keyframes`
+var wobbleAnimation = (theme) => keyframes`
   0%, 100% {
     transform: translateX(0) rotate(0deg);
   }
   15% {
-    transform: translateX(-10px) rotate(-5deg);
+    transform: translateX(${rem(theme, -10)}) rotate(-5deg);
   }
   30% {
-    transform: translateX(8px) rotate(3deg);
+    transform: translateX(${rem(theme, 8)}) rotate(3deg);
   }
   45% {
-    transform: translateX(-6px) rotate(-3deg);
+    transform: translateX(${rem(theme, -6)}) rotate(-3deg);
   }
   60% {
-    transform: translateX(4px) rotate(2deg);
+    transform: translateX(${rem(theme, 4)}) rotate(2deg);
   }
   75% {
-    transform: translateX(-2px) rotate(-1deg);
+    transform: translateX(${rem(theme, -2)}) rotate(-1deg);
   }
 `;
 var morphAnimation = keyframes`
@@ -165,15 +169,15 @@ var swingAnimation = keyframes`
     transform: rotate(0deg);
   }
 `;
-var floatAnimation = keyframes`
+var floatAnimation = (theme) => keyframes`
   0%, 100% {
     transform: translateY(0) translateX(0);
   }
   33% {
-    transform: translateY(-10px) translateX(-5px);
+    transform: translateY(${rem(theme, -10)}) translateX(${rem(theme, -5)});
   }
   66% {
-    transform: translateY(5px) translateX(5px);
+    transform: translateY(${rem(theme, 5)}) translateX(${rem(theme, 5)});
   }
 `;
 var jelloAnimation = keyframes`
@@ -200,46 +204,46 @@ var rippleAnimation = keyframes`
     opacity: 0;
   }
 `;
-var neonFlickerAnimation = keyframes`
+var neonFlickerAnimation = (theme) => keyframes`
   0%, 100% {
     opacity: 1;
-    filter: brightness(1) drop-shadow(0 0 10px currentColor);
+    filter: brightness(1) drop-shadow(0 0 ${rem(theme, 10)} currentColor);
   }
   10% {
     opacity: 0.8;
-    filter: brightness(0.8) drop-shadow(0 0 5px currentColor);
+    filter: brightness(0.8) drop-shadow(0 0 ${rem(theme, 5)} currentColor);
   }
   20% {
     opacity: 1;
-    filter: brightness(1.2) drop-shadow(0 0 15px currentColor);
+    filter: brightness(1.2) drop-shadow(0 0 ${rem(theme, 15)} currentColor);
   }
   30% {
     opacity: 0.9;
-    filter: brightness(0.9) drop-shadow(0 0 8px currentColor);
+    filter: brightness(0.9) drop-shadow(0 0 ${rem(theme, 8)} currentColor);
   }
   40% {
     opacity: 1;
-    filter: brightness(1.1) drop-shadow(0 0 12px currentColor);
+    filter: brightness(1.1) drop-shadow(0 0 ${rem(theme, 12)} currentColor);
   }
   50% {
     opacity: 0.95;
-    filter: brightness(1) drop-shadow(0 0 10px currentColor);
+    filter: brightness(1) drop-shadow(0 0 ${rem(theme, 10)} currentColor);
   }
   60% {
     opacity: 0.85;
-    filter: brightness(0.85) drop-shadow(0 0 6px currentColor);
+    filter: brightness(0.85) drop-shadow(0 0 ${rem(theme, 6)} currentColor);
   }
   70% {
     opacity: 1;
-    filter: brightness(1.15) drop-shadow(0 0 14px currentColor);
+    filter: brightness(1.15) drop-shadow(0 0 ${rem(theme, 14)} currentColor);
   }
   80% {
     opacity: 0.9;
-    filter: brightness(0.95) drop-shadow(0 0 9px currentColor);
+    filter: brightness(0.95) drop-shadow(0 0 ${rem(theme, 9)} currentColor);
   }
   90% {
     opacity: 1;
-    filter: brightness(1.05) drop-shadow(0 0 11px currentColor);
+    filter: brightness(1.05) drop-shadow(0 0 ${rem(theme, 11)} currentColor);
   }
 `;
 var breatheAnimation = keyframes`
@@ -273,4 +277,4 @@ export {
   neonFlickerAnimation,
   breatheAnimation
 };
-//# sourceMappingURL=chunk-3T5Z5HXF.js.map
+//# sourceMappingURL=chunk-KM3Y5TCG.js.map

package/dist/chunk-KM3Y5TCG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/utility/AnimatedIcon/AnimatedIcon.animations.ts"],"sourcesContent":["import { keyframes } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\n\nimport { rem } from '../../../tokens/relative';\n\nexport const rotateAnimation = keyframes`\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n`;\n\nexport const pulseAnimation = keyframes`\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  50% {\n    transform: scale(1.1);\n    opacity: 0.8;\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\nexport const translateAnimation = (theme: Theme) => keyframes`\n  0% {\n    transform: translateY(0px);\n  }\n  50% {\n    transform: translateY(${rem(theme, -8)});\n  }\n  100% {\n    transform: translateY(0px);\n  }\n`;\n\nexport const glowPulseAnimation = (theme: Theme) => keyframes`\n  0% {\n    box-shadow: 0 0 ${rem(theme, 5)} currentColor, 0 0 ${rem(theme, 10)} currentColor, 0 0 ${rem(theme, 15)} currentColor;\n  }\n  50% {\n    box-shadow: 0 0 ${rem(theme, 10)} currentColor, 0 0 ${rem(theme, 20)} currentColor, 0 0 ${rem(theme, 30)} currentColor;\n  }\n  100% {\n    box-shadow: 0 0 ${rem(theme, 5)} currentColor, 0 0 ${rem(theme, 10)} currentColor, 0 0 ${rem(theme, 15)} currentColor;\n  }\n`;\n\n// New animation keyframes\nexport const bounceAnimation = (theme: Theme) => keyframes`\n  0%, 20%, 50%, 80%, 100% {\n    transform: translateY(0);\n  }\n  40% {\n    transform: translateY(${rem(theme, -20)});\n  }\n  60% {\n    transform: translateY(${rem(theme, -10)});\n  }\n`;\n\nexport const shakeAnimation = (theme: Theme) => keyframes`\n  0%, 100% {\n    transform: translateX(0);\n  }\n  10%, 30%, 50%, 70%, 90% {\n    transform: translateX(${rem(theme, -4)});\n  }\n  20%, 40%, 60%, 80% {\n    transform: translateX(${rem(theme, 4)});\n  }\n`;\n\nexport const flipAnimation = (theme: Theme) => keyframes`\n  0% {\n    transform: perspective(${rem(theme, 400)}) rotateY(0);\n  }\n  100% {\n    transform: perspective(${rem(theme, 400)}) rotateY(360deg);\n  }\n`;\n\nexport const spinAnimation = keyframes`\n  0% {\n    transform: rotate(0deg) scale(1);\n  }\n  50% {\n    transform: rotate(180deg) scale(1.2);\n  }\n  100% {\n    transform: rotate(360deg) scale(1);\n  }\n`;\n\nexport const fadeInOutAnimation = keyframes`\n  0%, 100% {\n    opacity: 0.3;\n  }\n  50% {\n    opacity: 1;\n  }\n`;\n\nexport const heartbeatAnimation = keyframes`\n  0%, 100% {\n    transform: scale(1);\n  }\n  5% {\n    transform: scale(1.25);\n  }\n  10% {\n    transform: scale(1);\n  }\n  15% {\n    transform: scale(1.25);\n  }\n  20% {\n    transform: scale(1);\n  }\n`;\n\nexport const wobbleAnimation = (theme: Theme) => keyframes`\n  0%, 100% {\n    transform: translateX(0) rotate(0deg);\n  }\n  15% {\n    transform: translateX(${rem(theme, -10)}) rotate(-5deg);\n  }\n  30% {\n    transform: translateX(${rem(theme, 8)}) rotate(3deg);\n  }\n  45% {\n    transform: translateX(${rem(theme, -6)}) rotate(-3deg);\n  }\n  60% {\n    transform: translateX(${rem(theme, 4)}) rotate(2deg);\n  }\n  75% {\n    transform: translateX(${rem(theme, -2)}) rotate(-1deg);\n  }\n`;\n\nexport const morphAnimation = keyframes`\n  0%, 100% {\n    border-radius: 50%;\n    transform: scale(1);\n  }\n  25% {\n    border-radius: 30%;\n    transform: scale(1.1);\n  }\n  50% {\n    border-radius: 20%;\n    transform: scale(0.95);\n  }\n  75% {\n    border-radius: 40%;\n    transform: scale(1.05);\n  }\n`;\n\nexport const swingAnimation = keyframes`\n  20% {\n    transform: rotate(15deg);\n  }\n  40% {\n    transform: rotate(-10deg);\n  }\n  60% {\n    transform: rotate(5deg);\n  }\n  80% {\n    transform: rotate(-5deg);\n  }\n  100% {\n    transform: rotate(0deg);\n  }\n`;\n\nexport const floatAnimation = (theme: Theme) => keyframes`\n  0%, 100% {\n    transform: translateY(0) translateX(0);\n  }\n  33% {\n    transform: translateY(${rem(theme, -10)}) translateX(${rem(theme, -5)});\n  }\n  66% {\n    transform: translateY(${rem(theme, 5)}) translateX(${rem(theme, 5)});\n  }\n`;\n\nexport const jelloAnimation = keyframes`\n  0%, 100% {\n    transform: scale(1, 1);\n  }\n  25% {\n    transform: scale(0.9, 1.1);\n  }\n  50% {\n    transform: scale(1.1, 0.9);\n  }\n  75% {\n    transform: scale(0.95, 1.05);\n  }\n`;\n\nexport const rippleAnimation = keyframes`\n  0% {\n    transform: scale(0.8);\n    opacity: 1;\n  }\n  100% {\n    transform: scale(2);\n    opacity: 0;\n  }\n`;\n\nexport const neonFlickerAnimation = (theme: Theme) => keyframes`\n  0%, 100% {\n    opacity: 1;\n    filter: brightness(1) drop-shadow(0 0 ${rem(theme, 10)} currentColor);\n  }\n  10% {\n    opacity: 0.8;\n    filter: brightness(0.8) drop-shadow(0 0 ${rem(theme, 5)} currentColor);\n  }\n  20% {\n    opacity: 1;\n    filter: brightness(1.2) drop-shadow(0 0 ${rem(theme, 15)} currentColor);\n  }\n  30% {\n    opacity: 0.9;\n    filter: brightness(0.9) drop-shadow(0 0 ${rem(theme, 8)} currentColor);\n  }\n  40% {\n    opacity: 1;\n    filter: brightness(1.1) drop-shadow(0 0 ${rem(theme, 12)} currentColor);\n  }\n  50% {\n    opacity: 0.95;\n    filter: brightness(1) drop-shadow(0 0 ${rem(theme, 10)} currentColor);\n  }\n  60% {\n    opacity: 0.85;\n    filter: brightness(0.85) drop-shadow(0 0 ${rem(theme, 6)} currentColor);\n  }\n  70% {\n    opacity: 1;\n    filter: brightness(1.15) drop-shadow(0 0 ${rem(theme, 14)} currentColor);\n  }\n  80% {\n    opacity: 0.9;\n    filter: brightness(0.95) drop-shadow(0 0 ${rem(theme, 9)} currentColor);\n  }\n  90% {\n    opacity: 1;\n    filter: brightness(1.05) drop-shadow(0 0 ${rem(theme, 11)} currentColor);\n  }\n`;\n\nexport const breatheAnimation = keyframes`\n  0%, 100% {\n    transform: scale(1);\n    filter: brightness(1);\n  }\n  50% {\n    transform: scale(1.05);\n    filter: brightness(1.2);\n  }\n`;\n\n// Size configurations\n"],"mappings":"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","names":[]}

package/dist/{chunk-OWA7GPWR.js → chunk-KN5J3NEZ.js}

@@ -1,11 +1,12 @@
 import {
   METRICS,
   footerSx
-} from "./chunk-BXAL7OIS.js";
+} from "./chunk-JC22FNFA.js";
 import {
   fieldRadiusPx
 } from "./chunk-GDN2LUTZ.js";
 import {
+  rems,
   sxRem
 } from "./chunk-YKCAJ2TN.js";
 
@@ -14,8 +15,8 @@ import Box from "@mui/material/Box/index.js";
 import Button from "@mui/material/Button/index.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 var buttonSx = (sheet) => ({
-  height: sheet ? METRICS.sheetFooterButton : METRICS.footerButton,
-  padding: "0 13px",
+  height: sxRem(sheet ? METRICS.sheetFooterButtonPx : METRICS.footerButtonPx),
+  padding: (theme) => rems(theme, 0, 13),
   borderRadius: fieldRadiusPx,
   fontSize: sxRem(12.5),
   fontWeight: 600,
@@ -33,7 +34,7 @@ function CategoryMultiFoot({
 }) {
   return /* @__PURE__ */ jsxs(Box, { sx: footerSx, "data-testid": `${dataTestId}-footer`, children: [
     /* @__PURE__ */ jsx(Box, { component: "span", sx: { fontSize: sxRem(12), color: "text.secondary" }, children: copy.footer.selectedCount(count) }),
-    /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", gap: "6px" }, children: [
+    /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", gap: sxRem(6) }, children: [
       /* @__PURE__ */ jsx(
         Button,
         {
@@ -83,4 +84,4 @@ export {
   CategoryMultiFoot,
   CategorySingleFoot
 };
-//# sourceMappingURL=chunk-OWA7GPWR.js.map
+//# sourceMappingURL=chunk-KN5J3NEZ.js.map

package/dist/chunk-KN5J3NEZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CategorySelect/CategoryPanelFoot.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\n\nimport type { CategorySelectCopy } from '../../../copy';\nimport { footerSx, METRICS } from './CategorySelect.styles';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { rems, sxRem } from '../../../tokens/relative';\n\nconst buttonSx = (sheet: boolean) =>\n  ({\n    height: sxRem(sheet ? METRICS.sheetFooterButtonPx : METRICS.footerButtonPx),\n    padding: (theme: Theme) => rems(theme, 0, 13),\n    borderRadius: fieldRadiusPx,\n    fontSize: sxRem(12.5),\n    fontWeight: 600,\n    textTransform: 'none',\n    minWidth: 0,\n  }) as const;\n\ninterface MultiFootProps {\n  count: number;\n  /** False once the draft matches what is already applied — Apply becomes Close. */\n  changed: boolean;\n  sheet: boolean;\n  onClear: () => void;\n  onApply: () => void;\n  dataTestId: string;\n  copy: CategorySelectCopy;\n}\n\n/**\n * Multi-select footer: the running count, Clear, and the Apply that publishes\n * the draft. The primary button reads \"Fechar\" when nothing changed, so it never\n * promises an update it would not make.\n */\nexport function CategoryMultiFoot({\n  count,\n  changed,\n  sheet,\n  onClear,\n  onApply,\n  dataTestId,\n  copy,\n}: MultiFootProps): React.JSX.Element {\n  return (\n    <Box sx={footerSx} data-testid={`${dataTestId}-footer`}>\n      <Box component=\"span\" sx={{ fontSize: sxRem(12), color: 'text.secondary' }}>\n        {copy.footer.selectedCount(count)}\n      </Box>\n      <Box sx={{ display: 'flex', gap: sxRem(6) }}>\n        <Button\n          variant=\"outlined\"\n          disabled={count === 0}\n          sx={buttonSx(sheet)}\n          onClick={onClear}\n          data-testid={`${dataTestId}-clear`}\n        >\n          {copy.footer.clear}\n        </Button>\n        <Button\n          variant=\"contained\"\n          sx={buttonSx(sheet)}\n          onClick={onApply}\n          data-testid={`${dataTestId}-apply`}\n        >\n          {changed ? copy.footer.apply : copy.footer.close}\n        </Button>\n      </Box>\n    </Box>\n  );\n}\n\n/** Single-select footer: a hint and a way out. Picking a row commits directly. */\nexport function CategorySingleFoot({\n  sheet,\n  onCancel,\n  dataTestId,\n  copy,\n}: {\n  sheet: boolean;\n  onCancel: () => void;\n  dataTestId: string;\n  copy: CategorySelectCopy;\n}): React.JSX.Element {\n  return (\n    <Box sx={footerSx} data-testid={`${dataTestId}-footer`}>\n      <Box component=\"span\" sx={{ fontSize: sxRem(12), color: 'text.secondary' }}>\n        {copy.footer.singleHint}\n      </Box>\n      <Button\n        variant=\"outlined\"\n        sx={buttonSx(sheet)}\n        onClick={onCancel}\n        data-testid={`${dataTestId}-cancel`}\n      >\n        {copy.footer.cancel}\n      </Button>\n    </Box>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAEA,OAAO,SAAS;AAChB,OAAO,YAAY;AA8Cb,cAGA,YAHA;AAtCN,IAAM,WAAW,CAAC,WACf;AAAA,EACC,QAAQ,MAAM,QAAQ,QAAQ,sBAAsB,QAAQ,cAAc;AAAA,EAC1E,SAAS,CAAC,UAAiB,KAAK,OAAO,GAAG,EAAE;AAAA,EAC5C,cAAc;AAAA,EACd,UAAU,MAAM,IAAI;AAAA,EACpB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,UAAU;AACZ;AAkBK,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAsC;AACpC,SACE,qBAAC,OAAI,IAAI,UAAU,eAAa,GAAG,UAAU,WAC3C;AAAA,wBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,UAAU,MAAM,EAAE,GAAG,OAAO,iBAAiB,GACtE,eAAK,OAAO,cAAc,KAAK,GAClC;AAAA,IACA,qBAAC,OAAI,IAAI,EAAE,SAAS,QAAQ,KAAK,MAAM,CAAC,EAAE,GACxC;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,UAAU,UAAU;AAAA,UACpB,IAAI,SAAS,KAAK;AAAA,UAClB,SAAS;AAAA,UACT,eAAa,GAAG,UAAU;AAAA,UAEzB,eAAK,OAAO;AAAA;AAAA,MACf;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,IAAI,SAAS,KAAK;AAAA,UAClB,SAAS;AAAA,UACT,eAAa,GAAG,UAAU;AAAA,UAEzB,oBAAU,KAAK,OAAO,QAAQ,KAAK,OAAO;AAAA;AAAA,MAC7C;AAAA,OACF;AAAA,KACF;AAEJ;AAGO,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKsB;AACpB,SACE,qBAAC,OAAI,IAAI,UAAU,eAAa,GAAG,UAAU,WAC3C;AAAA,wBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,UAAU,MAAM,EAAE,GAAG,OAAO,iBAAiB,GACtE,eAAK,OAAO,YACf;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,IAAI,SAAS,KAAK;AAAA,QAClB,SAAS;AAAA,QACT,eAAa,GAAG,UAAU;AAAA,QAEzB,eAAK,OAAO;AAAA;AAAA,IACf;AAAA,KACF;AAEJ;","names":[]}

package/dist/{chunk-RWTFZ7J5.js → chunk-L4G5BZFF.js}

@@ -4,10 +4,13 @@ import {
   titleLeftStyles,
   titleRightStyles,
   titleStyles
-} from "./chunk-2NLYGZP3.js";
+} from "./chunk-77JL5XVD.js";
 import {
   safeAreaBottom
 } from "./chunk-AKZWDZCZ.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/feedback/StackedModal/StackedModal.parts.tsx
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
@@ -20,7 +23,7 @@ import DialogTitle from "@mui/material/DialogTitle/index.js";
 import IconButton from "@mui/material/IconButton/index.js";
 import Skeleton from "@mui/material/Skeleton/index.js";
 import Typography from "@mui/material/Typography/index.js";
-import { styled } from "@mui/material/styles/index.js";
+import { styled, useTheme } from "@mui/material/styles/index.js";
 import React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var StyledDialogTitle = styled(DialogTitle, {
@@ -63,10 +66,13 @@ var modalAriaIds = (modalId, ariaLabelledBy, ariaDescribedBy) => ({
 var ModalLoadingOverlay = ({
   loadingText,
   dataTestId
-}) => /* @__PURE__ */ jsxs(LoadingOverlay, { "data-testid": testId(dataTestId, "loading-overlay"), children: [
-  /* @__PURE__ */ jsx(CircularProgress, { size: 40, "data-testid": testId(dataTestId, "loading-spinner") }),
-  loadingText && /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { mt: 2 }, "data-testid": testId(dataTestId, "loading-text"), children: loadingText })
-] });
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(LoadingOverlay, { "data-testid": testId(dataTestId, "loading-overlay"), children: [
+    /* @__PURE__ */ jsx(CircularProgress, { size: rem(theme, 40), "data-testid": testId(dataTestId, "loading-spinner") }),
+    loadingText && /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { mt: 2 }, "data-testid": testId(dataTestId, "loading-text"), children: loadingText })
+  ] });
+};
 var HeaderLeadingButton = ({ canGoBack, onBack, backLabel, onClose, hideClose, rtl, dataTestId }) => {
   if (canGoBack) {
     return /* @__PURE__ */ jsx(
@@ -136,12 +142,15 @@ var ModalHeader = ({
   ] }),
   /* @__PURE__ */ jsx(DialogTitleRight, { "data-testid": testId(dataTestId, "header-actions"), children: headerActions })
 ] });
-var ContentSkeleton = () => /* @__PURE__ */ jsxs(Box, { sx: { p: 3 }, children: [
-  /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "60%", height: 32 }),
-  /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "100%" }),
-  /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "100%" }),
-  /* @__PURE__ */ jsx(Skeleton, { variant: "rectangular", height: 200, sx: { mt: 2 } })
-] });
+var ContentSkeleton = () => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(Box, { sx: { p: 3 }, children: [
+    /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "60%", height: rem(theme, 32) }),
+    /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "100%" }),
+    /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: "100%" }),
+    /* @__PURE__ */ jsx(Skeleton, { variant: "rectangular", height: rem(theme, 200), sx: { mt: 2 } })
+  ] });
+};
 var ModalBody = ({
   descId,
   showSkeleton,
@@ -222,4 +231,4 @@ export {
   ModalFooter,
   ModalPanelContents
 };
-//# sourceMappingURL=chunk-RWTFZ7J5.js.map
+//# sourceMappingURL=chunk-L4G5BZFF.js.map

package/dist/chunk-L4G5BZFF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/StackedModal/StackedModal.parts.tsx"],"sourcesContent":["import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';\nimport CloseIcon from '@mui/icons-material/Close';\nimport Box from '@mui/material/Box/index.js';\nimport CircularProgress from '@mui/material/CircularProgress/index.js';\nimport DialogActions from '@mui/material/DialogActions/index.js';\nimport DialogContent from '@mui/material/DialogContent/index.js';\nimport DialogTitle from '@mui/material/DialogTitle/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Skeleton from '@mui/material/Skeleton/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { styled, useTheme } from '@mui/material/styles/index.js';\nimport type { FC, ReactNode } from 'react';\nimport React from 'react';\nimport { rem } from '../../../tokens/relative';\nimport { safeAreaBottom } from '../../../utils/viewport';\nimport {\n  loadingOverlayStyles,\n  modalContentStyles,\n  titleLeftStyles,\n  titleRightStyles,\n  titleStyles,\n} from './StackedModal.styles';\n\nconst StyledDialogTitle = styled(DialogTitle, {\n  shouldForwardProp: (prop) => prop !== 'rtl',\n})<{ rtl?: boolean }>(({ theme, rtl }) => titleStyles(theme, rtl));\n\nconst DialogTitleLeft = styled(Box)(({ theme }) => titleLeftStyles(theme));\nconst DialogTitleRight = styled(Box)(({ theme }) => titleRightStyles(theme));\nconst LoadingOverlay = styled(Box)(({ theme }) => loadingOverlayStyles(theme));\n\n/**\n * The padded content wrapper callers put inside a StackedModal. The explicit\n * `typeof DialogContent` annotation keeps its type nameable across package\n * boundaries (TS2742) now that it is re-exported from the barrel.\n */\nexport const StackedModalContent: typeof DialogContent = styled(DialogContent)(({ theme }) =>\n  modalContentStyles(theme),\n) as typeof DialogContent;\n\n/** Sub-element test IDs derive from the modal's own, or stay off when it has none. */\nexport const testId = (base: string | undefined, suffix: string): string | undefined =>\n  base ? `${base}-${suffix}` : undefined;\n\n/**\n * A wrapper marking the subtree that should render as modal actions — the\n * StackedModal pulls it out of `children` and places it by device.\n */\nexport const StackedModalActions: FC<{ children?: ReactNode }> = ({ children }) => <>{children}</>;\n\n/** Separates the `StackedModalActions` subtree from the rest of the content. */\nconst splitModalChildren = (children: ReactNode): { content: ReactNode; actions: ReactNode } => {\n  let actions: ReactNode = null;\n\n  React.Children.forEach(children, (child) => {\n    if (React.isValidElement<{ children?: ReactNode }>(child) && child.type === StackedModalActions) {\n      actions = child.props.children;\n    }\n  });\n\n  const content = React.Children.toArray(children).filter(\n    (child) => !(React.isValidElement(child) && child.type === StackedModalActions),\n  );\n\n  return { content, actions };\n};\n\n/**\n * Works out what renders where: a `StackedModalActions` child wins over the\n * `actions` prop, and on phones those actions move out of the header into a\n * pinned bottom bar.\n */\nexport const resolveModalContent = (\n  children: ReactNode,\n  actions: ReactNode,\n  isMobile: boolean,\n): {\n  content: ReactNode;\n  modalActions: ReactNode;\n  headerActions: ReactNode;\n  hasMobileActions: boolean;\n} => {\n  const { content, actions: childActions } = splitModalChildren(children);\n  const modalActions = childActions ?? actions;\n  return {\n    content,\n    modalActions,\n    headerActions: isMobile ? null : modalActions,\n    hasMobileActions: Boolean(isMobile && modalActions),\n  };\n};\n\n/** The panel's own ARIA ids, unless the caller wired it to its own labels. */\nexport const modalAriaIds = (\n  modalId: string,\n  ariaLabelledBy?: string,\n  ariaDescribedBy?: string,\n): { titleId: string; descId: string } => ({\n  titleId: ariaLabelledBy || `modal-title-${modalId}`,\n  descId: ariaDescribedBy || `modal-desc-${modalId}`,\n});\n\nexport const ModalLoadingOverlay: FC<{ loadingText?: string; dataTestId?: string }> = ({\n  loadingText,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n  return (\n    <LoadingOverlay data-testid={testId(dataTestId, 'loading-overlay')}>\n      <CircularProgress size={rem(theme, 40)} data-testid={testId(dataTestId, 'loading-spinner')} />\n      {loadingText && (\n        <Typography variant=\"body2\" sx={{ mt: 2 }} data-testid={testId(dataTestId, 'loading-text')}>\n          {loadingText}\n        </Typography>\n      )}\n    </LoadingOverlay>\n  );\n};\n\ninterface ModalHeaderProps {\n  titleId: string;\n  navigationTitle?: ReactNode;\n  /** Deeper than the first panel, so the leading button goes back instead of closing. */\n  canGoBack: boolean;\n  onBack: () => void;\n  /** The back arrow's accessible name — it carries a glyph only. REQUIRED. */\n  backLabel: string;\n  onClose: () => void;\n  /** Renders the bar without its ✕ — the panel's content owns the dismiss. */\n  hideClose?: boolean;\n  /** Header actions — desktop only; on phones they move to the footer. */\n  headerActions?: ReactNode;\n  rtl?: boolean;\n  dataTestId?: string;\n}\n\n/**\n * The bar's leading control: back at depth ≥2, otherwise close — and nothing at\n * all when the panel's content carries its own ✕ (`hideClose`).\n */\nconst HeaderLeadingButton: FC<\n  Pick<\n    ModalHeaderProps,\n    'canGoBack' | 'onBack' | 'backLabel' | 'onClose' | 'hideClose' | 'rtl' | 'dataTestId'\n  >\n> = ({ canGoBack, onBack, backLabel, onClose, hideClose, rtl, dataTestId }) => {\n  if (canGoBack) {\n    return (\n      <IconButton\n        edge=\"start\"\n        color=\"inherit\"\n        onClick={onBack}\n        aria-label={backLabel}\n        size=\"small\"\n        sx={{ transform: rtl ? 'rotate(180deg)' : 'none' }}\n        data-testid={testId(dataTestId, 'back-button')}\n      >\n        <ChevronLeftIcon />\n      </IconButton>\n    );\n  }\n  if (hideClose) return null;\n  return (\n    <IconButton\n      edge=\"start\"\n      color=\"inherit\"\n      onClick={onClose}\n      aria-label=\"close\"\n      size=\"small\"\n      data-testid={testId(dataTestId, 'close-button')}\n    >\n      <CloseIcon />\n    </IconButton>\n  );\n};\n\nexport const ModalHeader: FC<ModalHeaderProps> = ({\n  titleId,\n  navigationTitle,\n  canGoBack,\n  onBack,\n  onClose,\n  hideClose,\n  backLabel,\n  headerActions,\n  rtl,\n  dataTestId,\n}) => (\n  <StyledDialogTitle id={titleId} rtl={rtl} data-testid={testId(dataTestId, 'header')}>\n    <DialogTitleLeft>\n      <HeaderLeadingButton\n        canGoBack={canGoBack}\n        onBack={onBack}\n        backLabel={backLabel}\n        onClose={onClose}\n        hideClose={hideClose}\n        rtl={rtl}\n        dataTestId={dataTestId}\n      />\n      {navigationTitle && (\n        <Typography\n          variant=\"h6\"\n          component=\"h2\"\n          noWrap\n          sx={{ ml: canGoBack || !hideClose ? 1 : 0 }}\n          data-testid={testId(dataTestId, 'title')}\n        >\n          {navigationTitle}\n        </Typography>\n      )}\n    </DialogTitleLeft>\n    <DialogTitleRight data-testid={testId(dataTestId, 'header-actions')}>\n      {headerActions}\n    </DialogTitleRight>\n  </StyledDialogTitle>\n);\n\nconst ContentSkeleton: FC = () => {\n  const theme = useTheme();\n  return (\n    <Box sx={{ p: 3 }}>\n      <Skeleton variant=\"text\" width=\"60%\" height={rem(theme, 32)} />\n      <Skeleton variant=\"text\" width=\"100%\" />\n      <Skeleton variant=\"text\" width=\"100%\" />\n      <Skeleton variant=\"rectangular\" height={rem(theme, 200)} sx={{ mt: 2 }} />\n    </Box>\n  );\n};\n\ninterface ModalBodyProps {\n  descId: string;\n  showSkeleton: boolean;\n  /** When there is no action bar, the body is what reaches the bottom of the panel. */\n  endsPanel: boolean;\n  dataTestId?: string;\n  children?: ReactNode;\n}\n\nexport const ModalBody: FC<ModalBodyProps> = ({\n  descId,\n  showSkeleton,\n  endsPanel,\n  dataTestId,\n  children,\n}) => (\n  <Box\n    id={descId}\n    sx={{\n      position: 'relative',\n      flex: 1,\n      overflow: 'auto',\n      // iOS momentum scrolling, and no scroll-chaining to the page behind —\n      // without `contain`, an overscroll at the end of the list rubber-bands the\n      // whole panel and springs back before the last row can be tapped.\n      WebkitOverflowScrolling: 'touch',\n      overscrollBehavior: 'contain',\n      // The content itself ends the panel when there is no action bar, so it has\n      // to clear the home indicator on its own.\n      ...(endsPanel ? safeAreaBottom(0) : {}),\n    }}\n    data-testid={testId(dataTestId, 'content')}\n  >\n    {showSkeleton ? <ContentSkeleton /> : children}\n  </Box>\n);\n\n/** The phone-only pinned action bar; on desktop the actions live in the header. */\nexport const ModalFooter: FC<{ dataTestId?: string; children?: ReactNode }> = ({\n  dataTestId,\n  children,\n}) => (\n  <DialogActions\n    sx={{\n      borderTop: (theme) => `1px solid ${theme.palette.divider}`,\n      padding: 2,\n      // Never let the action row sit under the iOS home indicator.\n      flexShrink: 0,\n      ...safeAreaBottom(16),\n    }}\n    data-testid={testId(dataTestId, 'footer')}\n  >\n    {children}\n  </DialogActions>\n);\n\ninterface PanelContentsProps extends ModalHeaderProps {\n  showSkeleton: boolean;\n  loadingText?: string;\n  descId: string;\n  content: ReactNode;\n  /** The resolved actions, already placed in the header or destined for the footer. */\n  modalActions: ReactNode;\n  hasMobileActions: boolean;\n}\n\n/** Everything inside the sliding panel: the loading veil, header, body and action bar. */\nexport const ModalPanelContents: FC<PanelContentsProps> = ({\n  showSkeleton,\n  loadingText,\n  descId,\n  content,\n  modalActions,\n  hasMobileActions,\n  ...header\n}) => (\n  <>\n    {showSkeleton && (\n      <ModalLoadingOverlay loadingText={loadingText} dataTestId={header.dataTestId} />\n    )}\n    <ModalHeader {...header} />\n    <ModalBody\n      descId={descId}\n      showSkeleton={showSkeleton}\n      endsPanel={!hasMobileActions}\n      dataTestId={header.dataTestId}\n    >\n      {content}\n    </ModalBody>\n    {hasMobileActions && (\n      <ModalFooter dataTestId={header.dataTestId}>{modalActions}</ModalFooter>\n    )}\n  </>\n);\n"],"mappings":"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","names":[]}