@12-apps/ui 6.36.0 → 6.38.0

package/dist/{chunk-2NLYGZP3.js → chunk-77JL5XVD.js}

@@ -4,6 +4,9 @@ import {
 import {
   scrim
 } from "./chunk-FQ6UW7IY.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/feedback/StackedModal/StackedModal.styles.ts
 import { alpha } from "@mui/material/styles/index.js";
@@ -34,16 +37,17 @@ var KEYFRAMES = {
   }
 };
 var cap = (customMaxWidth) => customMaxWidth ? MAX_WIDTH_PX[customMaxWidth] : null;
-var panelWidth = (share, capPx) => capPx ? { width: `min(${share}, ${capPx}px)`, maxWidth: `${capPx}px` } : { width: share, maxWidth: share };
+var panelWidth = (theme, share, capPx) => capPx ? { width: `min(${share}, ${rem(theme, capPx)})`, maxWidth: rem(theme, capPx) } : { width: share, maxWidth: share };
 var backdropStyles = (theme, modalRole) => ({
   backgroundColor: scrim(theme, (modalRole && BACKDROP_ALPHA_BY_ROLE[modalRole]) ?? 0.5),
-  backdropFilter: modalRole === "primary" ? "blur(4px)" : "none"
+  backdropFilter: modalRole === "primary" ? `blur(${rem(theme, 4)})` : "none"
 });
 var primaryPanelStyles = (theme, capPx) => ({
-  [theme.breakpoints.down("sm")]: panelWidth("100%", capPx),
-  [theme.breakpoints.between("sm", "lg")]: panelWidth("80vw", capPx),
-  [theme.breakpoints.up("lg")]: panelWidth("60vw", capPx),
-  "@media (min-width:2200px)": panelWidth("40vw", capPx)
+  [theme.breakpoints.down("sm")]: panelWidth(theme, "100%", capPx),
+  [theme.breakpoints.between("sm", "lg")]: panelWidth(theme, "80vw", capPx),
+  [theme.breakpoints.up("lg")]: panelWidth(theme, "60vw", capPx),
+  // A viewport width, in the theme's breakpoint unit like the three above.
+  [theme.breakpoints.up(2200)]: panelWidth(theme, "40vw", capPx)
 });
 var secondaryPanelStyles = () => ({
   width: "100vw !important",
@@ -63,8 +67,8 @@ var rolePanelStyles = (theme, role, capPx) => {
 };
 var glassStyles = (theme, glass, role) => glass && role === "primary" ? {
   backgroundColor: alpha(theme.palette.background.paper, 0.85),
-  backdropFilter: "blur(10px)",
-  WebkitBackdropFilter: "blur(10px)",
+  backdropFilter: `blur(${rem(theme, 10)})`,
+  WebkitBackdropFilter: `blur(${rem(theme, 10)})`,
   border: `1px solid ${alpha(theme.palette.divider, 0.18)}`
 } : {};
 var animationStyles = (isAnimating, role) => isAnimating ? { animation: (role && ANIMATION_BY_ROLE[role]) ?? "none" } : {};
@@ -153,4 +157,4 @@ export {
   loadingOverlayStyles,
   modalContentStyles
 };
-//# sourceMappingURL=chunk-2NLYGZP3.js.map
+//# sourceMappingURL=chunk-77JL5XVD.js.map

package/dist/chunk-77JL5XVD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/StackedModal/StackedModal.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\nimport { scrim } from '../../../tokens/ink';\nimport { rem } from '../../../tokens/relative';\nimport { dynamicViewportHeight } from '../../../utils/viewport';\nimport type { ModalPanelRole, PanelMaxWidth } from './StackedModal.types';\n\n/** Props that drive the panel's look but must not reach the DOM. */\nexport interface PanelStyleProps {\n  modalRole?: ModalPanelRole;\n  isAnimating?: boolean;\n  glass?: boolean;\n  rtl?: boolean;\n  customMaxWidth?: PanelMaxWidth;\n}\n\n/** Style-only props, filtered out before they can land on a DOM node. */\nexport const STYLE_ONLY_PROPS = ['modalRole', 'isAnimating', 'glass', 'rtl', 'customMaxWidth'];\n\n/** MUI breakpoint names mapped to the pixel width they cap the panel at. */\nconst MAX_WIDTH_PX: Record<Exclude<PanelMaxWidth, false>, number> = {\n  xs: 444,\n  sm: 600,\n  md: 960,\n  lg: 1280,\n  xl: 1920,\n};\n\n/** The scrim's opacity behind each receding panel role. */\nconst BACKDROP_ALPHA_BY_ROLE: Partial<Record<ModalPanelRole, number>> = {\n  secondary: 0.3,\n  background: 0.1,\n};\n\nconst ANIMATION_BY_ROLE: Partial<Record<ModalPanelRole, string>> = {\n  secondary: 'expandModal 300ms ease-in-out forwards',\n  primary: 'contractModal 300ms ease-in-out forwards',\n};\n\n// Animation endpoints use the common lg width (60vw); the role styles set the\n// exact per-breakpoint width once the animation settles.\nconst KEYFRAMES: CSSObject = {\n  '@keyframes expandModal': {\n    from: { width: '60vw', transform: 'translateX(0)' },\n    to: { width: '100vw', transform: 'translateX(0)' },\n  },\n  '@keyframes contractModal': {\n    from: { width: '100vw', transform: 'translateX(0)' },\n    to: { width: '60vw', transform: 'translateX(0)' },\n  },\n};\n\nconst cap = (customMaxWidth?: PanelMaxWidth): number | null =>\n  customMaxWidth ? MAX_WIDTH_PX[customMaxWidth] : null;\n\n/** One breakpoint's width: the viewport share, held under the optional px cap. */\nconst panelWidth = (theme: Theme, share: string, capPx: number | null): CSSObject =>\n  capPx\n    ? { width: `min(${share}, ${rem(theme, capPx)})`, maxWidth: rem(theme, capPx) }\n    : { width: share, maxWidth: share };\n\nconst backdropStyles = (theme: Theme, modalRole?: ModalPanelRole): CSSObject => ({\n  backgroundColor: scrim(theme, (modalRole && BACKDROP_ALPHA_BY_ROLE[modalRole]) ?? 0.5),\n  backdropFilter: modalRole === 'primary' ? `blur(${rem(theme, 4)})` : 'none',\n});\n\n/**\n * The top panel is viewport-aware and narrows as the screen grows: full width on\n * mobile, 80vw on tablet/small desktop, 60vw on regular desktops (lg up —\n * including ~1080p/1440p/1080-wide), and 40vw only on ultra-wide screens\n * (≥2200px) so the receding panel stays visible on huge monitors. A `maxWidth`\n * prop, when given, caps it further.\n */\nconst primaryPanelStyles = (theme: Theme, capPx: number | null): CSSObject => ({\n  [theme.breakpoints.down('sm')]: panelWidth(theme, '100%', capPx),\n  [theme.breakpoints.between('sm', 'lg')]: panelWidth(theme, '80vw', capPx),\n  [theme.breakpoints.up('lg')]: panelWidth(theme, '60vw', capPx),\n  // A viewport width, in the theme's breakpoint unit like the three above.\n  [theme.breakpoints.up(2200)]: panelWidth(theme, '40vw', capPx),\n});\n\n/** Panels below the top one expand to full width, producing the GTM stacking effect. */\nconst secondaryPanelStyles = (): CSSObject => ({\n  width: '100vw !important',\n  maxWidth: '100vw !important',\n  right: '0 !important',\n  top: '0 !important',\n  ...dynamicViewportHeight('height', 'maxHeight'),\n  borderRadius: '0 !important',\n  opacity: 0.95,\n  transform: 'scale(1)',\n});\n\nconst rolePanelStyles = (theme: Theme, role: ModalPanelRole | undefined, capPx: number | null): CSSObject => {\n  if (role === 'primary') return primaryPanelStyles(theme, capPx);\n  if (role === 'secondary') return secondaryPanelStyles();\n  // Background modals stay mounted but hidden, for performance.\n  if (role === 'background') return { display: 'none' };\n  return {};\n};\n\nconst glassStyles = (theme: Theme, glass?: boolean, role?: ModalPanelRole): CSSObject =>\n  glass && role === 'primary'\n    ? {\n        backgroundColor: alpha(theme.palette.background.paper, 0.85),\n        backdropFilter: `blur(${rem(theme, 10)})`,\n        WebkitBackdropFilter: `blur(${rem(theme, 10)})`,\n        border: `1px solid ${alpha(theme.palette.divider, 0.18)}`,\n      }\n    : {};\n\nconst animationStyles = (isAnimating?: boolean, role?: ModalPanelRole): CSSObject =>\n  isAnimating ? { animation: (role && ANIMATION_BY_ROLE[role]) ?? 'none' } : {};\n\nconst panelBaseStyles = (theme: Theme): CSSObject => ({\n  margin: 0,\n  position: 'fixed',\n  right: 0,\n  top: 0,\n  // Pinned to the DYNAMIC viewport: on iOS a `100vh` panel runs underneath the\n  // browser toolbar, which parks the tail of the scroll area (the submit row)\n  // out of reach. See `dynamicViewportHeight`.\n  ...dynamicViewportHeight('height', 'maxHeight'),\n  borderRadius: 0,\n  willChange: 'transform, width, border-radius',\n  transition: theme.transitions.create(\n    ['width', 'max-width', 'border-radius', 'transform', 'opacity'],\n    { duration: 300, easing: theme.transitions.easing.easeInOut },\n  ),\n});\n\nconst panelStyles = (theme: Theme, props: PanelStyleProps): CSSObject => {\n  const capPx = cap(props.customMaxWidth);\n  return {\n    ...panelBaseStyles(theme),\n    ...rolePanelStyles(theme, props.modalRole, capPx),\n    ...glassStyles(theme, props.glass, props.modalRole),\n    ...animationStyles(props.isAnimating, props.modalRole),\n  };\n};\n\n/** The full rule set for the sliding panel's Dialog root. */\nexport const dialogRootStyles = (theme: Theme, props: PanelStyleProps): CSSObject => ({\n  direction: props.rtl ? 'rtl' : 'ltr',\n  '& .MuiBackdrop-root': backdropStyles(theme, props.modalRole),\n  '& .MuiDialog-container': { alignItems: 'flex-start', justifyContent: 'flex-end' },\n  '& .MuiDialog-paper': panelStyles(theme, props),\n  ...KEYFRAMES,\n});\n\nexport const titleStyles = (theme: Theme, rtl?: boolean): CSSObject => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  padding: theme.spacing(2, 2.5),\n  borderBottom: `1px solid ${theme.palette.divider}`,\n  direction: rtl ? 'rtl' : 'ltr',\n});\n\nexport const titleLeftStyles = (theme: Theme): CSSObject => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1.5),\n  flex: 1,\n});\n\nexport const titleRightStyles = (theme: Theme): CSSObject => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1),\n});\n\nexport const loadingOverlayStyles = (theme: Theme): CSSObject => ({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  right: 0,\n  bottom: 0,\n  display: 'flex',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  backgroundColor: alpha(theme.palette.background.paper, 0.8),\n  zIndex: 9999,\n});\n\nexport const modalContentStyles = (theme: Theme): CSSObject => ({\n  padding: theme.spacing(3),\n  // MUI's DialogContent defaults to `overflow-y: auto`, but inside a panel it is\n  // NOT the element that scrolls — ModalBody above it is, and this box always\n  // ends up exactly as tall as its own content. A scroll container that never\n  // scrolls is still the containing block for every `position: sticky`\n  // descendant, so a sticky header anchored here gets zero travel and rides the\n  // content out of view: sticky, and pinned to nothing. Handing the overflow\n  // back to ModalBody makes the panel's own scroller the anchor.\n  overflowY: 'visible',\n});\n"],"mappings":"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","names":[]}

package/dist/{chunk-A6AKFPIQ.js → chunk-7EH4D6FU.js}

@@ -4,7 +4,7 @@ import {
   radioCardSx,
   segmentButtonSx,
   segmentContainerSx
-} from "./chunk-5SJWDABY.js";
+} from "./chunk-G3XLFQ2Z.js";
 
 // src/components/form/RadioGroup/RadioGroup.variants.tsx
 import Box from "@mui/material/Box/index.js";
@@ -244,4 +244,4 @@ export {
   SegmentRadios,
   GroupLabel
 };
-//# sourceMappingURL=chunk-A6AKFPIQ.js.map
+//# sourceMappingURL=chunk-7EH4D6FU.js.map

package/dist/{chunk-6SKXV236.js → chunk-7EM4THID.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-774B27QA.js";
 import {
   RichTextEditorToolbar
-} from "./chunk-SE6ERQY5.js";
+} from "./chunk-WVZBYTIK.js";
 import {
   fieldRadiusPx
 } from "./chunk-GDN2LUTZ.js";
@@ -38,14 +38,15 @@ var RICH_TEXT_DEFAULTS = {
   placeholder: "Start typing...",
   disabled: false,
   readOnly: false,
-  toolbar: {},
-  height: 300
+  toolbar: {}
 };
 var definedProps = (props) => Object.fromEntries(
   Object.entries(props).filter(([, v]) => v !== void 0)
 );
 var editorContentSx = (theme, disabled, placeholder, height) => ({
-  minHeight: typeof height === "number" ? `${height}px` : height,
+  // A number is design px, converted here where it is read (300 when the
+  // caller gives none); a string is any CSS length, used as-is.
+  minHeight: typeof height === "string" ? height : rem(theme, height ?? 300),
   p: 2,
   outline: "none",
   cursor: disabled ? "not-allowed" : "text",
@@ -55,13 +56,13 @@ var editorContentSx = (theme, disabled, placeholder, height) => ({
     pointerEvents: "none"
   },
   "& p": {
-    margin: "8px 0",
+    margin: `${rem(theme, 8)} 0`,
     "&:first-of-type": { marginTop: 0 },
     "&:last-of-type": { marginBottom: 0 }
   },
   "& ul, & ol": { marginLeft: theme.spacing(2) },
   "& blockquote": {
-    borderLeft: `4px solid ${theme.palette.primary.main}`,
+    borderLeft: `${rem(theme, 4)} solid ${theme.palette.primary.main}`,
     paddingLeft: theme.spacing(2),
     margin: `${theme.spacing(1)} 0`,
     fontStyle: "italic",
@@ -84,7 +85,7 @@ var shellSx = (theme, isFocused, disabled) => ({
   transition: "border-color 0.2s ease-in-out",
   ...isFocused && {
     borderColor: theme.palette.primary.main,
-    boxShadow: `0 0 0 2px ${alpha(theme.palette.primary.main, 0.2)}`
+    boxShadow: `0 0 0 ${rem(theme, 2)} ${alpha(theme.palette.primary.main, 0.2)}`
   },
   ...disabled && {
     backgroundColor: theme.palette.action.disabledBackground,
@@ -173,4 +174,4 @@ export {
   RichTextEditor,
   RichTextEditor_default
 };
-//# sourceMappingURL=chunk-6SKXV236.js.map
+//# sourceMappingURL=chunk-7EM4THID.js.map

package/dist/chunk-7EM4THID.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport Paper from '@mui/material/Paper/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport React, { forwardRef } from 'react';\n\nimport type { Theme } from '@mui/material/styles/index.js';\nimport { useRichTextEditor } from './RichTextEditor.hooks';\nimport type { RichTextEditorProps, ToolbarConfig } from './RichTextEditor.types';\nimport { RichTextEditorToolbar } from './RichTextEditorToolbar';\n\nimport { fieldEdge } from '../../../tokens/field-edge';\nimport { fieldRadiusPx } from '../../../tokens/field-radius';\nimport { rem } from '../../../tokens/relative';\n\nconst DEFAULT_TOOLBAR: Required<Omit<ToolbarConfig, 'customItems'>> & Pick<ToolbarConfig, 'customItems'> = {\n  bold: true,\n  italic: true,\n  underline: true,\n  strikethrough: false,\n  orderedList: true,\n  unorderedList: true,\n  link: true,\n  image: false,\n  codeBlock: false,\n  quote: false,\n  customItems: [] };\n\nconst RICH_TEXT_DEFAULTS: Partial<RichTextEditorProps> = {\n  value: '',\n  placeholder: 'Start typing...',\n  disabled: false,\n  readOnly: false,\n  toolbar: {} };\n\n// Strips explicitly-undefined props before the merge, so `prop={undefined}`\n// still falls back to the default as a destructuring default would.\nconst definedProps = (props: RichTextEditorProps): Partial<RichTextEditorProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, v]) => v !== undefined),\n  ) as Partial<RichTextEditorProps>;\n\n// Simple inline formats are a tag swap; lists and the value-carrying formats\n// need their own handling. This was one nine-case switch.\nconst editorContentSx = (theme: Theme, disabled: boolean, placeholder?: string, height?: string | number) => ({\n  // A number is design px, converted here where it is read (300 when the\n  // caller gives none); a string is any CSS length, used as-is.\n  minHeight: typeof height === 'string' ? height : rem(theme, height ?? 300),\n  p: 2,\n  outline: 'none',\n  cursor: disabled ? 'not-allowed' : 'text',\n  '&:empty::before': {\n    content: `\"${placeholder}\"`,\n    color: theme.palette.text.disabled,\n    pointerEvents: 'none' },\n  '& p': {\n    margin: `${rem(theme, 8)} 0`,\n    '&:first-of-type': { marginTop: 0 },\n    '&:last-of-type': { marginBottom: 0 } },\n  '& ul, & ol': { marginLeft: theme.spacing(2) },\n  '& blockquote': {\n    borderLeft: `${rem(theme, 4)} solid ${theme.palette.primary.main}`,\n    paddingLeft: theme.spacing(2),\n    margin: `${theme.spacing(1)} 0`,\n    fontStyle: 'italic',\n    backgroundColor: alpha(theme.palette.primary.main, 0.05) },\n  '& pre': {\n    backgroundColor: alpha(theme.palette.text.primary, 0.08),\n    padding: theme.spacing(1),\n    borderRadius: 1,\n    fontFamily: 'Monaco, Menlo, \"Ubuntu Mono\", monospace',\n    fontSize: rem(theme, 14),\n    overflow: 'auto' },\n  '& a': { color: theme.palette.primary.main, textDecoration: 'underline' } });\n\nconst shellSx = (theme: Theme, isFocused: boolean, disabled: boolean) => ({\n  border: `1px solid ${fieldEdge(theme)}`,\n  borderRadius: fieldRadiusPx(theme),\n  overflow: 'hidden',\n  transition: 'border-color 0.2s ease-in-out',\n  ...(isFocused && {\n    borderColor: theme.palette.primary.main,\n    boxShadow: `0 0 0 ${rem(theme, 2)} ${alpha(theme.palette.primary.main, 0.2)}` }),\n  ...(disabled && {\n    backgroundColor: theme.palette.action.disabledBackground,\n    color: theme.palette.text.disabled }) });\n\nexport const RichTextEditor = forwardRef<HTMLDivElement, RichTextEditorProps>(\n  (editorProps, ref) => {\n    const {\n      value,\n      onChange,\n      placeholder,\n      disabled,\n      readOnly,\n      toolbar,\n      height,\n      maxLength,\n      onFocus,\n      onBlur,\n      className,\n      'data-testid': testId,\n      'aria-label': ariaLabel,\n      'aria-describedby': ariaDescribedBy,\n      ...props\n    } = { ...RICH_TEXT_DEFAULTS, ...definedProps(editorProps) } as RichTextEditorProps;\n\n    const theme = useTheme();\n    const toolbarConfig = { ...DEFAULT_TOOLBAR, ...toolbar };\n    const editor = useRichTextEditor({\n      value,\n      onChange,\n      onFocus,\n      onBlur,\n      disabled,\n      readOnly,\n      maxLength });\n\n    return (\n      <Paper\n        ref={ref}\n        className={className}\n        data-testid={testId || 'rich-text-editor'}\n        elevation={1}\n        sx={shellSx(theme, editor.isFocused, Boolean(disabled))}\n        {...props}\n      >\n        <RichTextEditorToolbar\n          config={toolbarConfig}\n          disabled={Boolean(disabled)}\n          readOnly={Boolean(readOnly)}\n          maxLength={maxLength}\n          characterCount={editor.characterCount}\n          editorRef={editor.editorRef}\n          onFormat={editor.applyFormat}\n        />\n\n        <Box\n          ref={editor.editorRef}\n          contentEditable={!disabled && !readOnly}\n          onInput={editor.handleContentChange}\n          onFocus={editor.handleFocus}\n          onBlur={editor.handleBlur}\n          role=\"textbox\"\n          aria-label={ariaLabel || 'Rich text editor'}\n          aria-describedby={ariaDescribedBy}\n          aria-multiline=\"true\"\n          tabIndex={disabled ? -1 : 0}\n          data-testid=\"editor-content\"\n          suppressContentEditableWarning\n          sx={editorContentSx(theme, Boolean(disabled), placeholder, height)}\n        />\n      </Paper>\n    );\n  },\n);\n\nRichTextEditor.displayName = 'RichTextEditor';\n\nexport default RichTextEditor;"],"mappings":";;;;;;;;;;;;;;;;;AAAA,OAAO,SAAS;AAChB,OAAO,WAAW;AAClB,SAAS,OAAO,gBAAgB;AAChC,SAAgB,kBAAkB;AAmH5B,SAQE,KARF;AAxGN,IAAM,kBAAqG;AAAA,EACzG,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,eAAe;AAAA,EACf,aAAa;AAAA,EACb,eAAe;AAAA,EACf,MAAM;AAAA,EACN,OAAO;AAAA,EACP,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa,CAAC;AAAE;AAElB,IAAM,qBAAmD;AAAA,EACvD,OAAO;AAAA,EACP,aAAa;AAAA,EACb,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS,CAAC;AAAE;AAId,IAAM,eAAe,CAAC,UACpB,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC,MAAM,MAAM,MAAS;AACzD;AAIF,IAAM,kBAAkB,CAAC,OAAc,UAAmB,aAAsB,YAA8B;AAAA;AAAA;AAAA,EAG5G,WAAW,OAAO,WAAW,WAAW,SAAS,IAAI,OAAO,UAAU,GAAG;AAAA,EACzE,GAAG;AAAA,EACH,SAAS;AAAA,EACT,QAAQ,WAAW,gBAAgB;AAAA,EACnC,mBAAmB;AAAA,IACjB,SAAS,IAAI,WAAW;AAAA,IACxB,OAAO,MAAM,QAAQ,KAAK;AAAA,IAC1B,eAAe;AAAA,EAAO;AAAA,EACxB,OAAO;AAAA,IACL,QAAQ,GAAG,IAAI,OAAO,CAAC,CAAC;AAAA,IACxB,mBAAmB,EAAE,WAAW,EAAE;AAAA,IAClC,kBAAkB,EAAE,cAAc,EAAE;AAAA,EAAE;AAAA,EACxC,cAAc,EAAE,YAAY,MAAM,QAAQ,CAAC,EAAE;AAAA,EAC7C,gBAAgB;AAAA,IACd,YAAY,GAAG,IAAI,OAAO,CAAC,CAAC,UAAU,MAAM,QAAQ,QAAQ,IAAI;AAAA,IAChE,aAAa,MAAM,QAAQ,CAAC;AAAA,IAC5B,QAAQ,GAAG,MAAM,QAAQ,CAAC,CAAC;AAAA,IAC3B,WAAW;AAAA,IACX,iBAAiB,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI;AAAA,EAAE;AAAA,EAC3D,SAAS;AAAA,IACP,iBAAiB,MAAM,MAAM,QAAQ,KAAK,SAAS,IAAI;AAAA,IACvD,SAAS,MAAM,QAAQ,CAAC;AAAA,IACxB,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,UAAU,IAAI,OAAO,EAAE;AAAA,IACvB,UAAU;AAAA,EAAO;AAAA,EACnB,OAAO,EAAE,OAAO,MAAM,QAAQ,QAAQ,MAAM,gBAAgB,YAAY;AAAE;AAE5E,IAAM,UAAU,CAAC,OAAc,WAAoB,cAAuB;AAAA,EACxE,QAAQ,aAAa,UAAU,KAAK,CAAC;AAAA,EACrC,cAAc,cAAc,KAAK;AAAA,EACjC,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,GAAI,aAAa;AAAA,IACf,aAAa,MAAM,QAAQ,QAAQ;AAAA,IACnC,WAAW,SAAS,IAAI,OAAO,CAAC,CAAC,IAAI,MAAM,MAAM,QAAQ,QAAQ,MAAM,GAAG,CAAC;AAAA,EAAG;AAAA,EAChF,GAAI,YAAY;AAAA,IACd,iBAAiB,MAAM,QAAQ,OAAO;AAAA,IACtC,OAAO,MAAM,QAAQ,KAAK;AAAA,EAAS;AAAG;AAEnC,IAAM,iBAAiB;AAAA,EAC5B,CAAC,aAAa,QAAQ;AACpB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf,cAAc;AAAA,MACd,oBAAoB;AAAA,MACpB,GAAG;AAAA,IACL,IAAI,EAAE,GAAG,oBAAoB,GAAG,aAAa,WAAW,EAAE;AAE1D,UAAM,QAAQ,SAAS;AACvB,UAAM,gBAAgB,EAAE,GAAG,iBAAiB,GAAG,QAAQ;AACvD,UAAM,SAAS,kBAAkB;AAAA,MAC/B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAU,CAAC;AAEb,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,eAAa,UAAU;AAAA,QACvB,WAAW;AAAA,QACX,IAAI,QAAQ,OAAO,OAAO,WAAW,QAAQ,QAAQ,CAAC;AAAA,QACrD,GAAG;AAAA,QAEJ;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,QAAQ;AAAA,cACR,UAAU,QAAQ,QAAQ;AAAA,cAC1B,UAAU,QAAQ,QAAQ;AAAA,cAC1B;AAAA,cACA,gBAAgB,OAAO;AAAA,cACvB,WAAW,OAAO;AAAA,cAClB,UAAU,OAAO;AAAA;AAAA,UACnB;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK,OAAO;AAAA,cACZ,iBAAiB,CAAC,YAAY,CAAC;AAAA,cAC/B,SAAS,OAAO;AAAA,cAChB,SAAS,OAAO;AAAA,cAChB,QAAQ,OAAO;AAAA,cACf,MAAK;AAAA,cACL,cAAY,aAAa;AAAA,cACzB,oBAAkB;AAAA,cAClB,kBAAe;AAAA,cACf,UAAU,WAAW,KAAK;AAAA,cAC1B,eAAY;AAAA,cACZ,gCAA8B;AAAA,cAC9B,IAAI,gBAAgB,OAAO,QAAQ,QAAQ,GAAG,aAAa,MAAM;AAAA;AAAA,UACnE;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,eAAe,cAAc;AAE7B,IAAO,yBAAQ;","names":[]}

package/dist/{chunk-7ZG7T2YN.js → chunk-7GHYCQCJ.js}

@@ -5,13 +5,13 @@ import {
 } from "./chunk-MTGEJRE4.js";
 import {
   AddressSuggestionsPaper
-} from "./chunk-ST4YYVUK.js";
+} from "./chunk-C5RQBTRZ.js";
 import {
   AddressOption
 } from "./chunk-P5JCOFK3.js";
 import {
   AddressInputField
-} from "./chunk-6M33XQLZ.js";
+} from "./chunk-4T6UIYJB.js";
 
 // src/components/form/AddressAutocomplete/AddressAutocompleteField.tsx
 import Alert from "@mui/material/Alert/index.js";
@@ -89,4 +89,4 @@ var AddressAutocompleteField = ({
 export {
   AddressAutocompleteField
 };
-//# sourceMappingURL=chunk-7ZG7T2YN.js.map
+//# sourceMappingURL=chunk-7GHYCQCJ.js.map

package/dist/{chunk-U4H6MGVE.js → chunk-A5UYPUS2.js}

@@ -1,4 +1,5 @@
 import {
+  rem,
   sxRem
 } from "./chunk-YKCAJ2TN.js";
 
@@ -34,7 +35,7 @@ function UploadDropzone({
       ...drag,
       onClick: onOpen,
       sx: {
-        border: `2px dashed ${isDragOver ? theme.palette.primary.main : theme.palette.divider}`,
+        border: `${rem(theme, 2)} dashed ${isDragOver ? theme.palette.primary.main : theme.palette.divider}`,
         borderRadius: 2,
         padding: 3,
         textAlign: "center",
@@ -108,6 +109,7 @@ function UploadAnnouncer({
   progress,
   error
 }) {
+  const theme = useTheme();
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -116,9 +118,9 @@ function UploadAnnouncer({
       className: "sr-only",
       style: {
         position: "absolute",
-        left: "-10000px",
-        width: "1px",
-        height: "1px",
+        left: rem(theme, -1e4),
+        width: rem(theme, 1),
+        height: rem(theme, 1),
         overflow: "hidden"
       },
       children: [
@@ -183,4 +185,4 @@ export {
   UploadTrigger,
   UploadFeedback
 };
-//# sourceMappingURL=chunk-U4H6MGVE.js.map
+//# sourceMappingURL=chunk-A5UYPUS2.js.map

package/dist/chunk-A5UYPUS2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/UploadButton/UploadButton.parts.tsx"],"sourcesContent":["import AttachFileOutlined from '@mui/icons-material/AttachFileOutlined';\nimport CloudUploadOutlined from '@mui/icons-material/CloudUploadOutlined';\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport LinearProgress from '@mui/material/LinearProgress/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport type React from 'react';\n\nimport type { DragHandlers } from './UploadButton.hooks';\n\n/*\n * The tints the dropzone and the ghost button have always drawn — 0x0A, 0x05\n * and 0x08 out of 0xFF — as `alpha()` opacities. They were hex-alpha suffixes\n * glued onto `palette.primary.main`, which only works while the palette colour\n * is a six-digit hex: an `rgb(…)` primary produced an invalid colour and no\n * tint at all.\n */\nconst DRAG_OVER_TINT = 0x0a / 0xff;\nconst HOVER_TINT = 0x05 / 0xff;\nconst GHOST_HOVER_TINT = 0x08 / 0xff;\nimport type { UploadButtonCopy } from '../../../copy';\nimport type { UploadButtonProps } from './UploadButton.types';\nimport { rem, sxRem } from '../../../tokens/relative';\n\n/** Shared shape for the two trigger variants. */\nexport interface TriggerProps {\n  copy: UploadButtonCopy;\n  label: string;\n  icon?: React.ReactNode;\n  disabled: boolean;\n  className?: string;\n  dataTestId?: string;\n  describedBy?: string;\n  onOpen: () => void;\n}\n\n/** The drag-and-drop surface. */\nexport function UploadDropzone({\n  copy,\n  label,\n  icon,\n  disabled,\n  className,\n  dataTestId,\n  describedBy,\n  onOpen,\n  isDragOver,\n  drag,\n}: TriggerProps & { isDragOver: boolean; drag: DragHandlers }): React.ReactElement {\n  const theme = useTheme();\n  return (\n    <Box\n      component=\"div\"\n      {...drag}\n      onClick={onOpen}\n      sx={{\n        border: `${rem(theme, 2)} dashed ${isDragOver ? theme.palette.primary.main : theme.palette.divider}`,\n        borderRadius: 2,\n        padding: 3,\n        textAlign: 'center',\n        cursor: disabled ? 'not-allowed' : 'pointer',\n        backgroundColor: isDragOver ? alpha(theme.palette.primary.main, DRAG_OVER_TINT) : 'transparent',\n        transition: 'all 0.2s ease-in-out',\n        ...(!disabled && {\n          '&:hover': {\n            borderColor: theme.palette.primary.main,\n            backgroundColor: alpha(theme.palette.primary.main, HOVER_TINT),\n          },\n        }),\n        opacity: disabled ? 0.6 : 1,\n      }}\n      className={className}\n      data-testid={dataTestId}\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      onKeyDown={(event) => {\n        if (event.key !== 'Enter' && event.key !== ' ') return;\n        event.preventDefault();\n        onOpen();\n      }}\n      aria-describedby={describedBy}\n      aria-label={copy.dropzoneRole(label)}\n    >\n      <Box sx={{ mb: 2 }}>\n        {icon || <CloudUploadOutlined sx={{ fontSize: sxRem(48), color: 'text.secondary' }} />}\n      </Box>\n      <Typography variant=\"body1\" sx={{ mb: 1 }}>\n        {label}\n      </Typography>\n      <Typography variant=\"body2\" color=\"text.secondary\">\n        {copy.dropzoneHint}\n      </Typography>\n    </Box>\n  );\n}\n\n/** MUI variant for each non-dropzone appearance. */\nconst MUI_VARIANT = { outline: 'outlined', ghost: 'text' } as const;\n\n/** The plain-button trigger. */\nexport function UploadTrigger({\n  copy,\n  label,\n  icon,\n  disabled,\n  className,\n  dataTestId,\n  describedBy,\n  onOpen,\n  variant,\n  isUploading,\n}: TriggerProps & {\n  variant: NonNullable<UploadButtonProps['variant']>;\n  isUploading: boolean;\n}): React.ReactElement {\n  const theme = useTheme();\n  return (\n    <Button\n      variant={MUI_VARIANT[variant as keyof typeof MUI_VARIANT] ?? 'contained'}\n      disabled={disabled || isUploading}\n      onClick={onOpen}\n      startIcon={icon || <AttachFileOutlined />}\n      className={className}\n      data-testid={dataTestId}\n      aria-describedby={describedBy}\n      sx={{\n        ...(variant === 'ghost' && {\n          '&:hover': { backgroundColor: alpha(theme.palette.primary.main, GHOST_HOVER_TINT) },\n        }),\n      }}\n    >\n      {isUploading ? copy.uploading : label}\n    </Button>\n  );\n}\n\n/** The screen-reader live region — drag, progress and error announcements. */\nfunction UploadAnnouncer({\n  copy,\n  announceDragOver,\n  isUploading,\n  progress,\n  error,\n}: {\n  copy: UploadButtonCopy;\n  announceDragOver: boolean;\n  isUploading: boolean;\n  progress: number;\n  error: string | null;\n}): React.ReactElement {\n  const theme = useTheme();\n  return (\n    <div\n      aria-live=\"polite\"\n      aria-atomic=\"true\"\n      className=\"sr-only\"\n      style={{\n        position: 'absolute',\n        left: rem(theme, -10000),\n        width: rem(theme, 1),\n        height: rem(theme, 1),\n        overflow: 'hidden',\n      }}\n    >\n      {announceDragOver && copy.dropReady}\n      {isUploading && copy.uploadInProgress(Math.round(progress))}\n      {error && copy.errorAnnouncement(error)}\n    </div>\n  );\n}\n\n/** Progress bar, helper text, error text and the live region. */\nexport function UploadFeedback({\n  copy,\n  isUploading,\n  progress,\n  helperText,\n  helperId,\n  error,\n  errorId,\n  announceDragOver,\n}: {\n  copy: UploadButtonCopy;\n  isUploading: boolean;\n  progress: number;\n  helperText?: string;\n  helperId?: string;\n  error: string | null;\n  errorId?: string;\n  announceDragOver: boolean;\n}): React.ReactElement {\n  return (\n    <>\n      {isUploading && progress > 0 && (\n        <Box sx={{ mt: 1 }}>\n          <LinearProgress variant=\"determinate\" value={progress} sx={{ borderRadius: 1 }} />\n          <Typography variant=\"caption\" sx={{ mt: 0.5, display: 'block' }}>\n            {copy.percentUploaded(Math.round(progress))}\n          </Typography>\n        </Box>\n      )}\n\n      {helperText && !error && (\n        <Typography\n          id={helperId}\n          variant=\"caption\"\n          color=\"text.secondary\"\n          sx={{ display: 'block', mt: 0.5 }}\n        >\n          {helperText}\n        </Typography>\n      )}\n\n      {error && (\n        <Typography\n          id={errorId}\n          variant=\"caption\"\n          color=\"error\"\n          sx={{ display: 'block', mt: 0.5 }}\n          role=\"alert\"\n        >\n          {error}\n        </Typography>\n      )}\n\n      <UploadAnnouncer\n        copy={copy}\n        announceDragOver={announceDragOver}\n        isUploading={isUploading}\n        progress={progress}\n        error={error}\n      />\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-2PBT2HQH.js → chunk-AUSUCZYR.js}

@@ -5,7 +5,7 @@ import {
   rippleAnimation,
   shimmerAnimation,
   spinAnimation
-} from "./chunk-35ETD7ML.js";
+} from "./chunk-RIEV4VXF.js";
 import {
   DISABLED,
   IOS_BASE_OFFSET,
@@ -69,6 +69,7 @@ var getColorFromTheme = (theme, color) => {
     contrastText: palette.contrastText || NEUTRAL_CONTRAST
   };
 };
+var lengthOrPercent = (theme, value) => typeof value === "number" ? rem(theme, value) : value;
 var thumbShadow = (theme, look) => look === "ios" ? IOS_THUMB_SHADOW : theme.shadows[THUMB_ELEVATION[look]] ?? "none";
 var rippleOverlay = (palette) => ({
   content: '""',
@@ -87,15 +88,15 @@ var checkedInk = (flags, palette) => {
   const fills = flags.gradient ? [palette.light || palette.main, palette.main, palette.dark || palette.main] : [palette.main];
   return inkOver(fills, palette.contrastText || NEUTRAL_CONTRAST);
 };
-var checkedTrack = (flags, palette) => ({
+var checkedTrack = (theme, flags, palette) => ({
   backgroundColor: palette.main,
   opacity: 1,
   border: 0,
   position: "relative",
   overflow: "hidden",
   ...flags.glow && {
-    animation: `${glowAnimation} ${seconds(SWITCH_GLOW.ms)} ease-in-out infinite`,
-    boxShadow: `0 0 ${SWITCH_GLOW.blur}px ${alpha(palette.main, SWITCH_GLOW.alpha)}, inset 0 0 ${SWITCH_GLOW.insetBlur}px ${alpha(palette.main, SWITCH_GLOW.insetAlpha)}`
+    animation: `${glowAnimation(theme)} ${seconds(SWITCH_GLOW.ms)} ease-in-out infinite`,
+    boxShadow: `0 0 ${rem(theme, SWITCH_GLOW.blur)} ${alpha(palette.main, SWITCH_GLOW.alpha)}, inset 0 0 ${rem(theme, SWITCH_GLOW.insetBlur)} ${alpha(palette.main, SWITCH_GLOW.insetAlpha)}`
   },
   ...flags.gradient && {
     background: `linear-gradient(${SWITCH_GRADIENT.checked.angleDeg}deg, ${palette.light || palette.main} ${SWITCH_GRADIENT.checked.stops[0]}%, ${palette.main} ${SWITCH_GRADIENT.checked.stops[1]}%, ${palette.dark || palette.main} ${SWITCH_GRADIENT.checked.stops[2]}%)`,
@@ -107,22 +108,22 @@ var switchBaseSx = (theme, flags, palette, geometry, look) => {
   const { width, thumbSize, padding } = geometry;
   const isIos = look === "ios";
   return {
-    padding,
+    padding: rem(theme, padding),
     margin: 0,
     transitionDuration: `${SWITCH_TRANSITION.ms}ms`,
     transitionTimingFunction: SWITCH_TRANSITION.easing,
-    ...isIos && { transform: `translateX(${IOS_BASE_OFFSET}px)` },
+    ...isIos && { transform: `translateX(${rem(theme, IOS_BASE_OFFSET)})` },
     "&:hover": {
       "& .MuiSwitch-thumb": {
         transform: flags.loading ? "none" : `scale(${SWITCH_HOVER.thumbScale})`,
-        boxShadow: `${theme.shadows[SWITCH_HOVER.elevation]}, 0 0 ${SWITCH_HOVER.blur}px ${alpha(palette.main, SWITCH_HOVER.alpha)}`
+        boxShadow: `${theme.shadows[SWITCH_HOVER.elevation]}, 0 0 ${rem(theme, SWITCH_HOVER.blur)} ${alpha(palette.main, SWITCH_HOVER.alpha)}`
       },
       ...flags.ripple && { "&::after": rippleOverlay(palette) }
     },
     "&.Mui-checked": {
       // The thumb travels the track minus its own width and both paddings; the
       // iOS look insets differently, so it gets its own distance.
-      transform: `translateX(${width - thumbSize - padding * 2}px)`,
+      transform: `translateX(${rem(theme, width - thumbSize - padding * 2)})`,
       color: checkedInk(flags, palette),
       "& .MuiSwitch-thumb": {
         animation: flags.loading ? "none" : `${bounceAnimation} ${seconds(SWITCH_TRANSITION.ms)} ease-out`,
@@ -154,22 +155,22 @@ var switchBaseSx = (theme, flags, palette, geometry, look) => {
                 */
         ...flags.glass ? { borderColor: checkedInk(flags, palette) } : { backgroundColor: checkedInk(flags, palette) }
       },
-      "& + .MuiSwitch-track": checkedTrack(flags, palette),
+      "& + .MuiSwitch-track": checkedTrack(theme, flags, palette),
       "&.Mui-disabled + .MuiSwitch-track": { opacity: DISABLED.checkedTrackOpacity },
-      ...isIos && { transform: `translateX(${width - thumbSize - IOS_TRAVEL_INSET}px)` }
+      ...isIos && { transform: `translateX(${rem(theme, width - thumbSize - IOS_TRAVEL_INSET)})` }
     },
     "&.Mui-focusVisible .MuiSwitch-thumb": {
       color: palette.main,
-      border: `${SWITCH_FOCUS_RING.width}px solid ${alpha(palette.main, SWITCH_FOCUS_RING.alpha)}`
+      border: `${rem(theme, SWITCH_FOCUS_RING.width)} solid ${alpha(palette.main, SWITCH_FOCUS_RING.alpha)}`
     },
     "&.Mui-disabled .MuiSwitch-thumb": { color: neutralTones(theme).surface },
     "&.Mui-disabled + .MuiSwitch-track": { opacity: DISABLED.trackOpacity }
   };
 };
 var thumbSx = (theme, flags, palette, thumbSize, look) => ({
-  width: thumbSize,
-  height: thumbSize,
-  borderRadius: THUMB_RADIUS[look](thumbSize),
+  width: rem(theme, thumbSize),
+  height: rem(theme, thumbSize),
+  borderRadius: lengthOrPercent(theme, THUMB_RADIUS[look](thumbSize)),
   // `.Mui-checked` above replaces this for the brand-filled track; see
   // {@link RESTING_THUMB} for why the resting one stays white.
   backgroundColor: RESTING_THUMB,
@@ -181,7 +182,7 @@ var thumbSx = (theme, flags, palette, thumbSize, look) => ({
   justifyContent: "center",
   ...flags.glass && {
     backgroundColor: alpha(theme.palette.background.paper, SWITCH_GLASS.thumbAlpha),
-    backdropFilter: `blur(${SWITCH_GLASS.thumbBlur}px)`,
+    backdropFilter: `blur(${rem(theme, SWITCH_GLASS.thumbBlur)})`,
     border: `1px solid ${alpha(theme.palette.divider, SWITCH_GLASS.borderAlpha)}`
   },
   ...flags.pulse && { animation: `${pulseAnimation} ${seconds(SWITCH_PULSE.ms)} ease-in-out infinite` },
@@ -190,10 +191,10 @@ var thumbSx = (theme, flags, palette, thumbSize, look) => ({
     "&::after": {
       content: '""',
       position: "absolute",
-      width: thumbSize * SWITCH_SPINNER.sizeRatio,
-      height: thumbSize * SWITCH_SPINNER.sizeRatio,
-      border: `${SWITCH_SPINNER.borderWidth}px solid ${palette.main}`,
-      borderTop: `${SWITCH_SPINNER.borderWidth}px solid transparent`,
+      width: rem(theme, thumbSize * SWITCH_SPINNER.sizeRatio),
+      height: rem(theme, thumbSize * SWITCH_SPINNER.sizeRatio),
+      border: `${rem(theme, SWITCH_SPINNER.borderWidth)} solid ${palette.main}`,
+      borderTop: `${rem(theme, SWITCH_SPINNER.borderWidth)} solid transparent`,
       borderRadius: "50%",
       animation: `${spinAnimation} ${seconds(SWITCH_SPINNER.ms)} linear infinite`
     }
@@ -250,7 +251,7 @@ var trackLabels = (theme, flags, palette, onText, offText) => ({
 var trackSx = (theme, flags, palette, height, look) => {
   const { glass, gradient, onText, offText, customVariant } = flags;
   return {
-    borderRadius: TRACK_RADIUS[look](height),
+    borderRadius: rem(theme, TRACK_RADIUS[look](height)),
     backgroundColor: trackColor(
       { black: absoluteInk(theme).black, disabled: theme.palette.action.disabled },
       look
@@ -261,7 +262,7 @@ var trackSx = (theme, flags, palette, height, look) => {
     boxShadow: look === "ios" ? iosTrackShadow() : "none",
     ...glass && {
       backgroundColor: alpha(theme.palette.background.paper, SWITCH_GLASS.trackAlpha),
-      backdropFilter: `blur(${SWITCH_GLASS.trackBlur}px)`,
+      backdropFilter: `blur(${rem(theme, SWITCH_GLASS.trackBlur)})`,
       border: `1px solid ${alpha(theme.palette.divider, SWITCH_GLASS.borderAlpha)}`
     },
     ...gradient && !glass && {
@@ -276,8 +277,8 @@ var switchSx = (theme, flags) => {
   const geometry = geometryOf(flags.customSize, flags.trackWidth, flags.trackHeight);
   const look = lookOf(flags.customVariant);
   return {
-    width: geometry.width,
-    height: geometry.height,
+    width: rem(theme, geometry.width),
+    height: rem(theme, geometry.height),
     padding: 0,
     overflow: "visible",
     "& .MuiSwitch-switchBase": switchBaseSx(theme, flags, palette, geometry, look),
@@ -290,4 +291,4 @@ export {
   onTrackInk,
   switchSx
 };
-//# sourceMappingURL=chunk-2PBT2HQH.js.map
+//# sourceMappingURL=chunk-AUSUCZYR.js.map

package/dist/chunk-AUSUCZYR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/Switch/Switch.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport {\n  bounceAnimation,\n  glowAnimation,\n  pulseAnimation,\n  rippleAnimation,\n  shimmerAnimation,\n  spinAnimation,\n} from './Switch.animations';\nimport {\n  DISABLED,\n  IOS_BASE_OFFSET,\n  IOS_THUMB_SHADOW,\n  IOS_TRAVEL_INSET,\n  SWITCH_GLASS,\n  SWITCH_GLOW,\n  NEUTRAL_CONTRAST,\n  SWITCH_FOCUS_RING,\n  SWITCH_GRADIENT,\n  SWITCH_HOVER,\n  SWITCH_PULSE,\n  SWITCH_RIPPLE,\n  SWITCH_SPINNER,\n  SWITCH_TRANSITION,\n  RESTING_THUMB,\n  THUMB_ELEVATION,\n  THUMB_RADIUS,\n  TRACK_LABEL,\n  TRACK_RADIUS,\n  geometryOf,\n  iosTrackShadow,\n  lookOf,\n  seconds,\n  showsTrackLabels,\n  trackColor,\n  type SwitchGeometry,\n  type SwitchLook,\n} from './Switch.metrics';\nimport type { SwitchVariant } from './Switch.base';\n\nimport { absoluteInk, controlNeutral, neutralTones } from '../../../tokens/ink';\nimport { rem } from '../../../tokens/relative';\nimport { inkOver } from '../../../tokens/theme';\nimport type { ColorValue, SizeValue } from '../../../tokens/vocabulary';\n\n// Every number below comes from `./Switch.metrics`, which the native renderer\n// reads too — see its header. The palette and the shadows stay on the MUI\n// theme so a host that re-themes either keeps moving the web.\ninterface ColorPalette {\n  main: string;\n  dark?: string;\n  light?: string;\n  contrastText?: string;\n}\n\n/** `neutral` is not a MUI palette entry, so it is the controls' neutral tone. */\nconst neutralPalette = (theme: Theme): ColorPalette => controlNeutral(theme);\n\n/**\n * Resolves a colour name to a full palette, filling any step the theme leaves\n * out from `main` and then from the primary palette. `danger` is this\n * component's name for the error palette; the rest map straight through.\n */\nconst getColorFromTheme = (theme: Theme, color: string): ColorPalette => {\n  if (color === 'neutral') {\n    return neutralPalette(theme);\n  }\n\n  const colorMap: Record<string, ColorPalette | undefined> = {\n    primary: theme.palette.primary,\n    secondary: theme.palette.secondary,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    info: theme.palette.info,\n    danger: theme.palette.error,\n  };\n  const palette = colorMap[color] ?? theme.palette.primary;\n  const { primary } = theme.palette;\n\n  return {\n    main: palette.main || primary.main,\n    dark: palette.dark || palette.main || primary.dark,\n    light: palette.light || palette.main || primary.light,\n    contrastText: palette.contrastText || NEUTRAL_CONTRAST,\n  };\n};\n\nexport interface SwitchFlags {\n  customVariant?: SwitchVariant;\n  customColor?: ColorValue;\n  customSize?: SizeValue;\n  glow?: boolean;\n  glass?: boolean;\n  gradient?: boolean;\n  trackWidth?: number;\n  trackHeight?: number;\n  onText?: string;\n  offText?: string;\n  loading?: boolean;\n  ripple?: boolean;\n  pulse?: boolean;\n}\n\n/** A metrics radius on the web: its px through the type scale, a percentage as-is. */\nconst lengthOrPercent = (theme: Theme, value: number | string): string =>\n  typeof value === 'number' ? rem(theme, value) : value;\n\nconst thumbShadow = (theme: Theme, look: SwitchLook): string =>\n  look === 'ios' ? IOS_THUMB_SHADOW : (theme.shadows[THUMB_ELEVATION[look]] ?? 'none');\n\n/** The ripple that expands from the thumb on hover. */\nconst rippleOverlay = (palette: ColorPalette): CSSObject => ({\n  content: '\"\"',\n  position: 'absolute',\n  top: '50%',\n  left: '50%',\n  width: '100%',\n  height: '100%',\n  borderRadius: '50%',\n  background: alpha(palette.main, SWITCH_RIPPLE.alpha),\n  animation: `${rippleAnimation} ${seconds(SWITCH_RIPPLE.ms)} ease-out`,\n  transform: 'translate(-50%, -50%)',\n  pointerEvents: 'none',\n});\n\n/**\n * The ink on the CHECKED track — the thumb, the `on` wording and any on-icon\n * (FUT-1924).\n *\n * All three stated `#fff`, and the checked track is `palette.main`: the one\n * surface in this component the TENANT picks. A store with a pale brand got a\n * white thumb on a pale green bar, which does not read as a knob at all — the\n * switch looks OFF while it is on, so this is a state a user misreads rather\n * than a colour they dislike.\n *\n * The `gradient` flag paints the track `light → main → dark`, so the fills the\n * thumb travels over are handed over together and {@link inkOver} takes the\n * worst of them.\n *\n * The RESTING track is not here on purpose: it is `theme.palette.action.disabled`\n * washed over the page, which no tenant chooses, and a white thumb on it is the\n * conventional look in both modes.\n */\nconst checkedInk = (flags: SwitchFlags, palette: ColorPalette): string => {\n  const fills = flags.gradient\n    ? [palette.light || palette.main, palette.main, palette.dark || palette.main]\n    : [palette.main];\n\n  return inkOver(fills, palette.contrastText || NEUTRAL_CONTRAST);\n};\n\n/** The checked track: the filled bar behind the thumb once the switch is on. */\nconst checkedTrack = (theme: Theme, flags: SwitchFlags, palette: ColorPalette): CSSObject => ({\n  backgroundColor: palette.main,\n  opacity: 1,\n  border: 0,\n  position: 'relative',\n  overflow: 'hidden',\n  ...(flags.glow && {\n    animation: `${glowAnimation(theme)} ${seconds(SWITCH_GLOW.ms)} ease-in-out infinite`,\n    boxShadow: `0 0 ${rem(theme, SWITCH_GLOW.blur)} ${alpha(palette.main, SWITCH_GLOW.alpha)}, inset 0 0 ${rem(theme, SWITCH_GLOW.insetBlur)} ${alpha(palette.main, SWITCH_GLOW.insetAlpha)}`,\n  }),\n  ...(flags.gradient && {\n    background: `linear-gradient(${SWITCH_GRADIENT.checked.angleDeg}deg, ${palette.light || palette.main} ${SWITCH_GRADIENT.checked.stops[0]}%, ${palette.main} ${SWITCH_GRADIENT.checked.stops[1]}%, ${palette.dark || palette.main} ${SWITCH_GRADIENT.checked.stops[2]}%)`,\n    backgroundSize: '200% 100%',\n    animation: `${shimmerAnimation} ${seconds(SWITCH_GRADIENT.shimmerMs)} ease infinite`,\n  }),\n});\n\nconst switchBaseSx = (\n  theme: Theme,\n  flags: SwitchFlags,\n  palette: ColorPalette,\n  geometry: SwitchGeometry,\n  look: SwitchLook,\n): CSSObject => {\n  const { width, thumbSize, padding } = geometry;\n  const isIos = look === 'ios';\n\n  return {\n    padding: rem(theme, padding),\n    margin: 0,\n    transitionDuration: `${SWITCH_TRANSITION.ms}ms`,\n    transitionTimingFunction: SWITCH_TRANSITION.easing,\n    ...(isIos && { transform: `translateX(${rem(theme, IOS_BASE_OFFSET)})` }),\n    '&:hover': {\n      '& .MuiSwitch-thumb': {\n        transform: flags.loading ? 'none' : `scale(${SWITCH_HOVER.thumbScale})`,\n        boxShadow: `${theme.shadows[SWITCH_HOVER.elevation]}, 0 0 ${rem(theme, SWITCH_HOVER.blur)} ${alpha(palette.main, SWITCH_HOVER.alpha)}`,\n      },\n      ...(flags.ripple && { '&::after': rippleOverlay(palette) }),\n    },\n    '&.Mui-checked': {\n      // The thumb travels the track minus its own width and both paddings; the\n      // iOS look insets differently, so it gets its own distance.\n      transform: `translateX(${rem(theme, width - thumbSize - padding * 2)})`,\n      color: checkedInk(flags, palette),\n      '& .MuiSwitch-thumb': {\n        animation: flags.loading ? 'none' : `${bounceAnimation} ${seconds(SWITCH_TRANSITION.ms)} ease-out`,\n        /*\n          GLASS KEEPS ITS WASH AND GAINS AN OUTLINE (FUT-2067).\n\n          It used to keep the wash and nothing else, on the argument that a\n          translucent thumb MEANS to show the track through itself, so painting\n          it opaque would be repainting the variant rather than fixing it. The\n          first half of that is still true and this still does not touch the\n          fill. The second half was doing more work than the number supports:\n          `SWITCH_GLASS.thumbAlpha` is **0.9**, so nine parts in ten of the knob\n          are `background.paper` and one part is the track. On a pale brand that\n          composites to within about 1.1:1 of the bar it is sitting on — the\n          same \"reads as OFF while it is on\" state FUT-1924 exists for, in the\n          one variant whose own argument points AT the tenant-controlled\n          surface.\n\n          So the separation moves to the EDGE, which is the thing a glass\n          surface is allowed to have. The colour is {@link checkedInk} — the\n          same derivation the opaque thumb gets, so there is one rule for \"what\n          reads on this track\" rather than two — at full strength rather than\n          the `divider` hairline at `borderAlpha` 0.2 the resting thumb wears,\n          which on a pale track is not an outline at all.\n\n          Checked only. The resting track is `action.disabled` washed over the\n          page, which no tenant chooses, so the quiet hairline stays right\n          there — the same split {@link checkedInk}'s own docblock makes.\n        */\n        ...(flags.glass\n          ? { borderColor: checkedInk(flags, palette) }\n          : { backgroundColor: checkedInk(flags, palette) }),\n      },\n      '& + .MuiSwitch-track': checkedTrack(theme, flags, palette),\n      '&.Mui-disabled + .MuiSwitch-track': { opacity: DISABLED.checkedTrackOpacity },\n      ...(isIos && { transform: `translateX(${rem(theme, width - thumbSize - IOS_TRAVEL_INSET)})` }),\n    },\n    '&.Mui-focusVisible .MuiSwitch-thumb': {\n      color: palette.main,\n      border: `${rem(theme, SWITCH_FOCUS_RING.width)} solid ${alpha(palette.main, SWITCH_FOCUS_RING.alpha)}`,\n    },\n    '&.Mui-disabled .MuiSwitch-thumb': { color: neutralTones(theme).surface },\n    '&.Mui-disabled + .MuiSwitch-track': { opacity: DISABLED.trackOpacity },\n  };\n};\n\nconst thumbSx = (\n  theme: Theme,\n  flags: SwitchFlags,\n  palette: ColorPalette,\n  thumbSize: number,\n  look: SwitchLook,\n): CSSObject => ({\n  width: rem(theme, thumbSize),\n  height: rem(theme, thumbSize),\n  borderRadius: lengthOrPercent(theme, THUMB_RADIUS[look](thumbSize)),\n  // `.Mui-checked` above replaces this for the brand-filled track; see\n  // {@link RESTING_THUMB} for why the resting one stays white.\n  backgroundColor: RESTING_THUMB,\n  boxShadow: thumbShadow(theme, look),\n  transition: `all ${seconds(SWITCH_TRANSITION.ms)} ${SWITCH_TRANSITION.easing}`,\n  position: 'relative',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...(flags.glass && {\n    backgroundColor: alpha(theme.palette.background.paper, SWITCH_GLASS.thumbAlpha),\n    backdropFilter: `blur(${rem(theme, SWITCH_GLASS.thumbBlur)})`,\n    border: `1px solid ${alpha(theme.palette.divider, SWITCH_GLASS.borderAlpha)}`,\n  }),\n  ...(flags.pulse && { animation: `${pulseAnimation} ${seconds(SWITCH_PULSE.ms)} ease-in-out infinite` }),\n  ...(flags.loading && {\n    // A spinner drawn inside the thumb rather than over the whole control.\n    '&::after': {\n      content: '\"\"',\n      position: 'absolute',\n      width: rem(theme, thumbSize * SWITCH_SPINNER.sizeRatio),\n      height: rem(theme, thumbSize * SWITCH_SPINNER.sizeRatio),\n      border: `${rem(theme, SWITCH_SPINNER.borderWidth)} solid ${palette.main}`,\n      borderTop: `${rem(theme, SWITCH_SPINNER.borderWidth)} solid transparent`,\n      borderRadius: '50%',\n      animation: `${spinAnimation} ${seconds(SWITCH_SPINNER.ms)} linear infinite`,\n    },\n  }),\n  ...(look === 'material' && {\n    '&::before': {\n      content: '\"\"',\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n      borderRadius: 'inherit',\n      backgroundColor: palette.main,\n      opacity: 0,\n      transform: 'scale(0)',\n      transition: 'all 0.3s ease',\n    },\n  }),\n});\n\n/** The on/off wording the `label` variant prints inside the track. */\nconst trackLabels = (\n  theme: Theme,\n  flags: SwitchFlags,\n  palette: ColorPalette,\n  onText?: string,\n  offText?: string,\n): CSSObject => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  paddingLeft: theme.spacing(TRACK_LABEL.insetUnits),\n  paddingRight: theme.spacing(TRACK_LABEL.insetUnits),\n  fontSize: rem(theme, TRACK_LABEL.fontSize),\n  fontWeight: TRACK_LABEL.fontWeight,\n  color: theme.palette.text.secondary,\n  '&::before, &::after': {\n    content: '\"\"',\n    position: 'absolute',\n    fontSize: rem(theme, TRACK_LABEL.fontSize),\n    fontWeight: TRACK_LABEL.fontWeight,\n    top: '50%',\n    transform: 'translateY(-50%)',\n    zIndex: 1,\n  },\n  ...(onText && {\n    '&::before': {\n      content: `\"${onText}\"`,\n      left: theme.spacing(TRACK_LABEL.insetUnits),\n      // The `on` word sits at the end the thumb travels TO, which is the\n      // filled half of the track once checked.\n      color: checkedInk(flags, palette),\n    },\n  }),\n  ...(offText && {\n    '&::after': {\n      content: `\"${offText}\"`,\n      right: theme.spacing(TRACK_LABEL.insetUnits),\n      color: theme.palette.text.secondary,\n    },\n  }),\n});\n\nconst trackSx = (\n  theme: Theme,\n  flags: SwitchFlags,\n  palette: ColorPalette,\n  height: number,\n  look: SwitchLook,\n): CSSObject => {\n  const { glass, gradient, onText, offText, customVariant } = flags;\n\n  return {\n    borderRadius: rem(theme, TRACK_RADIUS[look](height)),\n    backgroundColor: trackColor(\n      { black: absoluteInk(theme).black, disabled: theme.palette.action.disabled },\n      look,\n    ),\n    opacity: 1,\n    transition: `all ${seconds(SWITCH_TRANSITION.ms)} ${SWITCH_TRANSITION.easing}`,\n    position: 'relative',\n    boxShadow: look === 'ios' ? iosTrackShadow() : 'none',\n    ...(glass && {\n      backgroundColor: alpha(theme.palette.background.paper, SWITCH_GLASS.trackAlpha),\n      backdropFilter: `blur(${rem(theme, SWITCH_GLASS.trackBlur)})`,\n      border: `1px solid ${alpha(theme.palette.divider, SWITCH_GLASS.borderAlpha)}`,\n    }),\n    ...(gradient &&\n      !glass && {\n        background: `linear-gradient(${SWITCH_GRADIENT.resting.angleDeg}deg, ${alpha(palette.light || palette.main, SWITCH_GRADIENT.resting.lightAlpha)}, ${alpha(palette.main, SWITCH_GRADIENT.resting.mainAlpha)})`,\n      }),\n    ...(showsTrackLabels(customVariant, onText, offText) &&\n      trackLabels(theme, flags, palette, onText, offText)),\n  };\n};\n\n/**\n * The same checked-track ink, for the two ICONS the control overlays on the\n * track — which are drawn as components rather than styles, so they cannot\n * reach {@link checkedInk} directly.\n */\nexport const onTrackInk = (theme: Theme, flags: SwitchFlags): string =>\n  checkedInk(flags, getColorFromTheme(theme, flags.customColor ?? 'primary'));\n\nexport const switchSx = (theme: Theme, flags: SwitchFlags): CSSObject => {\n  const palette = getColorFromTheme(theme, flags.customColor ?? 'primary');\n  const geometry = geometryOf(flags.customSize, flags.trackWidth, flags.trackHeight);\n  const look = lookOf(flags.customVariant);\n\n  return {\n    width: rem(theme, geometry.width),\n    height: rem(theme, geometry.height),\n    padding: 0,\n    overflow: 'visible',\n    '& .MuiSwitch-switchBase': switchBaseSx(theme, flags, palette, geometry, look),\n    '& .MuiSwitch-thumb': thumbSx(theme, flags, palette, geometry.thumbSize, look),\n    '& .MuiSwitch-track': trackSx(theme, flags, palette, geometry.height, look),\n  };\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-T3WHW7ZC.js → chunk-BAZXVFLR.js}

@@ -1,7 +1,11 @@
 import {
   getOverflowStyle,
-  getVariantStyles
-} from "./chunk-L7SFH3ED.js";
+  getVariantStyles,
+  sizeCss
+} from "./chunk-I7GSRTGQ.js";
+import {
+  rem
+} from "./chunk-YKCAJ2TN.js";
 
 // src/components/layout/ScrollArea/ScrollViewport.tsx
 import Box from "@mui/material/Box/index.js";
@@ -39,7 +43,7 @@ var ScrollViewport = ({
         width: "100%",
         height: "100%",
         // Use an explicit maxHeight when height is 'auto', else inherit.
-        maxHeight: height === "auto" && maxHeight ? maxHeight : "100%",
+        maxHeight: height === "auto" && maxHeight ? sizeCss(theme, maxHeight) : "100%",
         padding: contentPadding,
         opacity: loading ? 0.5 : 1,
         pointerEvents: disabled || loading ? "none" : "auto",
@@ -47,8 +51,8 @@ var ScrollViewport = ({
         "&:focus": {
           outline: "none",
           "&:focus-visible": {
-            outline: `2px solid ${theme.palette.primary.main}`,
-            outlineOffset: -2
+            outline: `${rem(theme, 2)} solid ${theme.palette.primary.main}`,
+            outlineOffset: rem(theme, -2)
           }
         },
         ...getOverflowStyle({ disabled, orientation }),
@@ -71,4 +75,4 @@ var ScrollViewport = ({
 export {
   ScrollViewport
 };
-//# sourceMappingURL=chunk-T3WHW7ZC.js.map
+//# sourceMappingURL=chunk-BAZXVFLR.js.map

package/dist/chunk-BAZXVFLR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/ScrollArea/ScrollViewport.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport { useTheme } from '@mui/material/styles/index.js';\nimport type { FC, ReactNode, UIEvent } from 'react';\nimport React from 'react';\n\nimport { rem } from '../../../tokens/relative';\n\nimport { getOverflowStyle, getVariantStyles, sizeCss } from './ScrollArea.styles';\nimport type { ResolvedScrollAreaProps } from './ScrollArea.helpers';\n\nexport interface ScrollViewportProps\n  extends Pick<\n    ResolvedScrollAreaProps,\n    | 'height'\n    | 'maxHeight'\n    | 'orientation'\n    | 'scrollbarSize'\n    | 'scrollbarColor'\n    | 'scrollbarTrackColor'\n    | 'contentPadding'\n    | 'variant'\n    | 'disabled'\n    | 'loading'\n    | 'smoothScroll'\n  > {\n  /** The scroll region's accessible name. REQUIRED. */\n  regionLabel: string;\n  children: ReactNode;\n  shouldShowScrollbar: boolean;\n  setScrollRef: (node: HTMLDivElement | null) => void;\n  onScroll: (event: UIEvent<HTMLDivElement>) => void;\n}\n\n// The element that actually scrolls: its own overflow and scrollbar styling,\n// plus the disabled and loading treatments.\nexport const ScrollViewport: FC<ScrollViewportProps> = ({\n  regionLabel,\n  children,\n  height,\n  maxHeight,\n  orientation,\n  scrollbarSize,\n  scrollbarColor,\n  scrollbarTrackColor,\n  contentPadding,\n  variant,\n  disabled,\n  loading,\n  smoothScroll,\n  shouldShowScrollbar,\n  setScrollRef,\n  onScroll,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      ref={setScrollRef}\n      onScroll={onScroll}\n      role=\"region\"\n      aria-label={regionLabel}\n      aria-busy={loading}\n      tabIndex={disabled ? -1 : 0}\n      sx={{\n        width: '100%',\n        height: '100%',\n        // Use an explicit maxHeight when height is 'auto', else inherit.\n        maxHeight: height === 'auto' && maxHeight ? sizeCss(theme, maxHeight) : '100%',\n        padding: contentPadding,\n        opacity: loading ? 0.5 : 1,\n        pointerEvents: disabled || loading ? 'none' : 'auto',\n        transition: 'opacity 0.3s ease',\n        '&:focus': {\n          outline: 'none',\n          '&:focus-visible': {\n            outline: `${rem(theme, 2)} solid ${theme.palette.primary.main}`,\n            outlineOffset: rem(theme, -2),\n          },\n        },\n        ...getOverflowStyle({ disabled, orientation }),\n        ...getVariantStyles({\n          theme,\n          variant,\n          orientation,\n          scrollbarSize,\n          scrollbarColor,\n          scrollbarTrackColor,\n          shouldShowScrollbar,\n        }),\n      }}\n      style={{ scrollBehavior: smoothScroll ? 'smooth' : 'auto' }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA,OAAO,SAAS;AAChB,SAAS,gBAAgB;AAuDrB;AArBG,IAAM,iBAA0C,CAAC;AAAA,EACtD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,aAAW;AAAA,MACX,UAAU,WAAW,KAAK;AAAA,MAC1B,IAAI;AAAA,QACF,OAAO;AAAA,QACP,QAAQ;AAAA;AAAA,QAER,WAAW,WAAW,UAAU,YAAY,QAAQ,OAAO,SAAS,IAAI;AAAA,QACxE,SAAS;AAAA,QACT,SAAS,UAAU,MAAM;AAAA,QACzB,eAAe,YAAY,UAAU,SAAS;AAAA,QAC9C,YAAY;AAAA,QACZ,WAAW;AAAA,UACT,SAAS;AAAA,UACT,mBAAmB;AAAA,YACjB,SAAS,GAAG,IAAI,OAAO,CAAC,CAAC,UAAU,MAAM,QAAQ,QAAQ,IAAI;AAAA,YAC7D,eAAe,IAAI,OAAO,EAAE;AAAA,UAC9B;AAAA,QACF;AAAA,QACA,GAAG,iBAAiB,EAAE,UAAU,YAAY,CAAC;AAAA,QAC7C,GAAG,iBAAiB;AAAA,UAClB;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA,MACA,OAAO,EAAE,gBAAgB,eAAe,WAAW,OAAO;AAAA,MAEzD;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/{chunk-7F7TTOYN.js → chunk-BEGTLELZ.js}

@@ -2,8 +2,9 @@ import {
   defaultDimensions,
   muiAnimationFor,
   muiVariantFor,
-  skeletonStyles
-} from "./chunk-Q4BQYYPU.js";
+  skeletonLength,
+  skeletonSx
+} from "./chunk-E2QIKJX2.js";
 import {
   resolveSkeletonProps,
   skeletonInstanceTestId
@@ -50,9 +51,9 @@ var Skeleton = React.memo((rawProps) => {
     {
       variant: muiVariantFor(variant),
       animation: muiAnimationFor(variant, animation),
-      width: finalWidth,
-      height: finalHeight,
-      sx: skeletonStyles(theme, {
+      width: finalWidth === 0 ? 0 : skeletonLength(theme, finalWidth),
+      height: finalHeight === 0 ? 0 : skeletonLength(theme, finalHeight),
+      sx: skeletonSx(theme, {
         intensity,
         borderRadius,
         glassmorphism,
@@ -77,4 +78,4 @@ Skeleton.displayName = "Skeleton";
 export {
   Skeleton
 };
-//# sourceMappingURL=chunk-7F7TTOYN.js.map
+//# sourceMappingURL=chunk-BEGTLELZ.js.map

package/dist/chunk-BEGTLELZ.js.map

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

package/dist/{chunk-4WQ3YXQL.js → chunk-BFMDA6UO.js}

@@ -4,16 +4,16 @@ import {
 import {
   Dialog,
   DialogContent
-} from "./chunk-L4UP5VYS.js";
+} from "./chunk-GVH7C2PT.js";
 import {
   default as default2
 } from "./chunk-WEBEOBN5.js";
 import {
   Button
-} from "./chunk-KH25WUSX.js";
+} from "./chunk-2EAAWOZ2.js";
 import {
   Text
-} from "./chunk-WTOYEWW6.js";
+} from "./chunk-YBH4SPMM.js";
 
 // src/components/data-display/DataViews/DeleteViewDialog.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -69,4 +69,4 @@ function DeleteViewDialog({
 export {
   DeleteViewDialog
 };
-//# sourceMappingURL=chunk-4WQ3YXQL.js.map
+//# sourceMappingURL=chunk-BFMDA6UO.js.map