@12-apps/ui 6.19.0 → 6.20.0

package/dist/{chunk-L6KEVPXN.js → chunk-E4FGKZID.js}

@@ -3,14 +3,21 @@ import {
   definedAria,
   formatCount,
   resolveBadgeProps
-} from "./chunk-MMZAGB64.js";
+} from "./chunk-6C5D6O3D.js";
 import {
   buildBadgeContent
-} from "./chunk-ZGEBIC5X.js";
+} from "./chunk-OLVZ6TOV.js";
 import {
   badgeStyles,
   getAnchorOrigin
-} from "./chunk-4Q7HWRR2.js";
+} from "./chunk-EZSEAYYT.js";
+import {
+  CLOSE_DELAY_MS,
+  MOUNT_ANIMATION_MS
+} from "./chunk-KVEHH4SA.js";
+import {
+  resolveTestId
+} from "./chunk-QLWBQQW7.js";
 
 // src/components/data-display/Badge/Badge.tsx
 import MuiBadge from "@mui/material/Badge/index.js";
@@ -55,14 +62,12 @@ var StyledBadge = styled(MuiBadge, {
     hasIcon
   });
 });
-var CLOSE_DELAY_MS = 300;
-var ANIMATION_MS = 1e3;
 var useMountAnimation = (enabled) => {
   const [isAnimating, setIsAnimating] = useState(false);
   useEffect(() => {
     if (!enabled) return;
     setIsAnimating(true);
-    const timer = window.setTimeout(() => setIsAnimating(false), ANIMATION_MS);
+    const timer = window.setTimeout(() => setIsAnimating(false), MOUNT_ANIMATION_MS);
     return () => window.clearTimeout(timer);
   }, [enabled]);
   return isAnimating;
@@ -122,7 +127,11 @@ var Badge = React.forwardRef((componentProps, ref) => {
     "aria-label": ariaLabel,
     "aria-live": ariaLive = "polite",
     "aria-atomic": ariaAtomic = true,
-    "data-testid": dataTestId,
+    "data-testid": _domTestId,
+    // The house and React Native spellings of the same id; they name the
+    // component on both sides and must not reach the DOM as attributes.
+    testID: _testID,
+    dataTestId: _dataTestId,
     className: _className,
     content: _content,
     badgeContent: _badgeContent,
@@ -135,13 +144,14 @@ var Badge = React.forwardRef((componentProps, ref) => {
     setIsVisible(false);
     window.setTimeout(() => onClose?.(), CLOSE_DELAY_MS);
   };
+  const badgeId = resolveTestId(resolved);
   const rawContent = badgeContentOf(resolved);
   const finalBadgeContent = buildBadgeContent({
     variant,
     size,
     icon,
     closable,
-    dataTestId,
+    dataTestId: badgeId,
     baseContent: variant === "count" ? formatCount(rawContent, { max, showZero }) : rawContent,
     onClose: handleClose
   });
@@ -150,6 +160,7 @@ var Badge = React.forwardRef((componentProps, ref) => {
     BadgeSurface,
     {
       ...resolved,
+      "data-testid": badgeId,
       innerRef: ref,
       isVisible,
       isAnimating,
@@ -169,4 +180,4 @@ Badge.displayName = "Badge";
 export {
   Badge
 };
-//# sourceMappingURL=chunk-L6KEVPXN.js.map
+//# sourceMappingURL=chunk-E4FGKZID.js.map

package/dist/chunk-E4FGKZID.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Badge/Badge.tsx"],"sourcesContent":["import MuiBadge from '@mui/material/Badge/index.js';\nimport Zoom from '@mui/material/Zoom/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React, { useEffect,useState } from 'react';\n\nimport {\n  badgeStyles,\n  getAnchorOrigin } from './Badge.styles';\nimport {\n  badgeContentOf,\n  definedAria,\n  formatCount,\n  resolveBadgeProps } from './Badge.helpers';\nimport type { ResolvedBadgeProps } from './Badge.helpers';\nimport { buildBadgeContent } from './BadgeContent';\nimport { CLOSE_DELAY_MS, MOUNT_ANIMATION_MS } from './Badge.metrics';\nimport type { BadgeProps, BadgeSize, BadgeVariant } from './Badge.types';\nimport { resolveTestId } from '../../../platform/test-id';\nexport type { BadgeProps } from './Badge.types';\n\n// Define pulse animation\nconst StyledBadge = styled(MuiBadge, {\n  shouldForwardProp: (prop) =>\n    ![\n      'customVariant',\n      'customSize',\n      'customColor',\n      'glow',\n      'pulse',\n      'animate',\n      'shimmer',\n      'bounce',\n      'hasIcon',\n    ].includes(prop as string) })<{\n  customVariant?: BadgeVariant;\n  customSize?: BadgeSize;\n  customColor?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  animate?: boolean;\n  shimmer?: boolean;\n  bounce?: boolean;\n  hasIcon?: boolean;\n}>(({\n  theme,\n  customVariant,\n  customSize = 'md',\n  customColor = 'primary',\n  glow,\n  pulse,\n  animate,\n  shimmer,\n  bounce,\n  hasIcon }) => {\n  return badgeStyles({\n    theme,\n    customVariant,\n    customSize,\n    customColor,\n    glow,\n    pulse,\n    animate,\n    shimmer,\n    bounce,\n    hasIcon });\n});\n\n\n// A one-shot flag so bounce/animate run on mount and then stop.\nconst useMountAnimation = (enabled: boolean) => {\n  const [isAnimating, setIsAnimating] = useState(false);\n\n  useEffect(() => {\n    if (!enabled) return;\n\n    setIsAnimating(true);\n    const timer = window.setTimeout(() => setIsAnimating(false), MOUNT_ANIMATION_MS);\n    return () => window.clearTimeout(timer);\n  }, [enabled]);\n\n  return isAnimating;\n};\n\n// The chip itself. Local because StyledBadge cannot cross a module boundary\n// (TS2742).\nconst BadgeSurface: React.FC<\n  ResolvedBadgeProps<BadgeProps> & {\n    innerRef: React.Ref<HTMLSpanElement>;\n    isVisible: boolean;\n    isAnimating: boolean;\n    shouldBeInvisible: boolean;\n    finalBadgeContent: React.ReactNode;\n    aria: Record<string, string | boolean>;\n    rest: Record<string, unknown>;\n  }\n> = ({ innerRef, isVisible, isAnimating, shouldBeInvisible, finalBadgeContent, aria, rest, ...p }) => {\n  const testId = p['data-testid'];\n\n  return (\n    <Zoom in={isVisible} timeout={CLOSE_DELAY_MS}>\n      <StyledBadge\n        ref={innerRef}\n        className={p.className}\n        customVariant={p.variant}\n        customSize={p.size}\n        customColor={p.color}\n        glow={p.glow}\n        pulse={p.pulse}\n        animate={p.animate}\n        shimmer={p.shimmer}\n        bounce={p.bounce && isAnimating}\n        hasIcon={Boolean(p.icon)}\n        badgeContent={finalBadgeContent}\n        variant={p.variant === 'dot' ? 'dot' : 'standard'}\n        anchorOrigin={getAnchorOrigin(p.position)}\n        invisible={shouldBeInvisible}\n        data-testid={testId || 'badge'}\n        slotProps={{\n          badge: {\n            ...aria,\n            // @ts-expect-error - MUI Badge slotProps doesn't include data-testid in types, but it works at runtime\n            'data-testid': testId ? `${testId}-content-wrapper` : 'badge-content-wrapper' } }}\n        {...rest}\n      >\n        {p.children}\n      </StyledBadge>\n    </Zoom>\n  );\n};\n\nexport const Badge = React.forwardRef<HTMLSpanElement, BadgeProps>((componentProps, ref) => {\n  const resolved = resolveBadgeProps(componentProps);\n  const {\n    variant,\n    size,\n    color: _color,\n    glow: _glow,\n    pulse: _pulse,\n    animate,\n    shimmer: _shimmer,\n    bounce,\n    max,\n    showZero,\n    position: _position,\n    children: _children,\n    invisible,\n    closable,\n    onClose,\n    icon,\n    'aria-label': ariaLabel,\n    'aria-live': ariaLive = 'polite',\n    'aria-atomic': ariaAtomic = true,\n    'data-testid': _domTestId,\n    // The house and React Native spellings of the same id; they name the\n    // component on both sides and must not reach the DOM as attributes.\n    testID: _testID,\n    dataTestId: _dataTestId,\n    className: _className,\n    content: _content,\n    badgeContent: _badgeContent,\n    ...props\n  } = resolved;\n\n  const [isVisible, setIsVisible] = useState(true);\n  const isAnimating = useMountAnimation(animate || bounce);\n\n  const handleClose = (event: React.MouseEvent) => {\n    event.stopPropagation();\n    setIsVisible(false);\n    // Let the Zoom finish before telling the caller.\n    window.setTimeout(() => onClose?.(), CLOSE_DELAY_MS);\n  };\n\n  const badgeId = resolveTestId(resolved);\n  const rawContent = badgeContentOf(resolved);\n  const finalBadgeContent = buildBadgeContent({\n    variant,\n    size,\n    icon,\n    closable,\n    dataTestId: badgeId,\n    baseContent: variant === 'count' ? formatCount(rawContent, { max, showZero }) : rawContent,\n    onClose: handleClose });\n\n  // A count that formatted away leaves nothing worth showing.\n  const shouldBeInvisible =\n    invisible || (variant === 'count' && finalBadgeContent === null && !showZero) || !isVisible;\n\n  return (\n    <BadgeSurface\n      {...resolved}\n      data-testid={badgeId}\n      innerRef={ref}\n      isVisible={isVisible}\n      isAnimating={isAnimating}\n      shouldBeInvisible={shouldBeInvisible}\n      finalBadgeContent={finalBadgeContent}\n      aria={definedAria({\n        'aria-label': ariaLabel,\n        'aria-live': ariaLive,\n        'aria-atomic': ariaAtomic })}\n      rest={props as unknown as Record<string, unknown>}\n    />\n  );\n});\n\nBadge.displayName = 'Badge';\n"],"mappings":"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","names":[]}

package/dist/{chunk-EXJBPKGW.js → chunk-EGRFMPGD.js}

@@ -1,9 +1,6 @@
 import {
   MapControlBar
 } from "./chunk-5ZT4ZIZB.js";
-import {
-  MapSearchBar
-} from "./chunk-J3D34ZBL.js";
 import {
   HeatmapOverlay,
   RouteOverlay
@@ -11,6 +8,9 @@ import {
 import {
   HEATMAP_VIEWBOX
 } from "./chunk-H2J2MTRE.js";
+import {
+  MapSearchBar
+} from "./chunk-J3D34ZBL.js";
 
 // src/components/data-display/MapPreview/MapLayers.tsx
 import { useTheme } from "@mui/material/styles/index.js";
@@ -57,4 +57,4 @@ var MapLayers = ({ settings, zoom, mapType, search, controls }) => {
 export {
   MapLayers
 };
-//# sourceMappingURL=chunk-EXJBPKGW.js.map
+//# sourceMappingURL=chunk-EGRFMPGD.js.map

package/dist/{chunk-XFUNJYFT.js → chunk-EPNUVSNK.js}

@@ -1,9 +1,3 @@
-import {
-  useHoverCard
-} from "./chunk-SXYIXCUB.js";
-import {
-  HoverCardContent
-} from "./chunk-O26MKGIC.js";
 import {
   arrowSx,
   cardSx,
@@ -11,6 +5,12 @@ import {
   getTransformOrigin,
   sideOf
 } from "./chunk-KSLNO5NG.js";
+import {
+  useHoverCard
+} from "./chunk-SXYIXCUB.js";
+import {
+  HoverCardContent
+} from "./chunk-O26MKGIC.js";
 import {
   withDefaults
 } from "./chunk-HPK33ACY.js";
@@ -158,4 +158,4 @@ HoverCard.displayName = "HoverCard";
 export {
   HoverCard
 };
-//# sourceMappingURL=chunk-XFUNJYFT.js.map
+//# sourceMappingURL=chunk-EPNUVSNK.js.map

package/dist/{chunk-H2EQVMU3.js → chunk-EX3PSZLV.js}

@@ -1,6 +1,6 @@
 import {
   ICON_PATHS
-} from "./chunk-RLC46NIW.js";
+} from "./chunk-VMNSGE2G.js";
 import {
   iconFill
 } from "./chunk-QWBQVQRG.js";
@@ -46,4 +46,4 @@ Icon.displayName = "Icon";
 export {
   Icon
 };
-//# sourceMappingURL=chunk-H2EQVMU3.js.map
+//# sourceMappingURL=chunk-EX3PSZLV.js.map

package/dist/{chunk-4Q7HWRR2.js → chunk-EZSEAYYT.js}

@@ -1,13 +1,32 @@
 import {
   badgeVariantStyles
-} from "./chunk-3HWL4AW4.js";
+} from "./chunk-ZTF5C2GA.js";
 import {
   bounceAnimation,
   fadeInScaleAnimation,
   glowPulseAnimation,
   pulseAnimation,
   shimmerAnimation
-} from "./chunk-HKFMPEXJ.js";
+} from "./chunk-HI2OFZSZ.js";
+import {
+  BADGE_BORDER_WIDTH,
+  BADGE_CONTENT_GAP,
+  BADGE_FONT_WEIGHT,
+  BADGE_LETTER_SPACING_EM,
+  BADGE_SIZES,
+  BADGE_TRANSITION_EASING,
+  BADGE_TRANSITION_MS,
+  BOUNCE,
+  FADE_IN_SCALE,
+  GLOW,
+  HOVER_SCALE,
+  PULSE,
+  SHIMMER,
+  badgeAnchor
+} from "./chunk-KVEHH4SA.js";
+import {
+  px
+} from "./chunk-NQN5Z36J.js";
 
 // src/components/data-display/Badge/Badge.styles.ts
 import { alpha } from "@mui/material/styles/index.js";
@@ -30,60 +49,21 @@ var getColorFromTheme = (theme, color) => {
   };
   return colorMap[color] || theme.palette.primary;
 };
-var getSizeStyles = (size) => {
-  const sizeMap = {
-    xs: {
-      minWidth: 14,
-      height: 14,
-      fontSize: "0.5rem",
-      padding: "0 3px",
-      dotSize: 6,
-      iconSize: "0.625rem"
-    },
-    sm: {
-      minWidth: 16,
-      height: 16,
-      fontSize: "0.625rem",
-      padding: "0 4px",
-      dotSize: 8,
-      iconSize: "0.75rem"
-    },
-    md: {
-      minWidth: 20,
-      height: 20,
-      fontSize: "0.75rem",
-      padding: "0 6px",
-      dotSize: 10,
-      iconSize: "0.875rem"
-    },
-    lg: {
-      minWidth: 24,
-      height: 24,
-      fontSize: "0.875rem",
-      padding: "0 8px",
-      dotSize: 12,
-      iconSize: "1rem"
-    },
-    xl: {
-      minWidth: 28,
-      height: 28,
-      fontSize: "1rem",
-      padding: "0 10px",
-      dotSize: 14,
-      iconSize: "1.125rem"
+var sizeMap = Object.fromEntries(
+  Object.entries(BADGE_SIZES).map(([size, metrics]) => [
+    size,
+    {
+      minWidth: metrics.minWidth,
+      height: metrics.height,
+      fontSize: px(metrics.fontSize),
+      padding: `0 ${metrics.paddingHorizontal}px`,
+      dotSize: metrics.dotSize,
+      iconSize: px(metrics.iconSize)
     }
-  };
-  return sizeMap[size] || sizeMap.md;
-};
-var getAnchorOrigin = (position) => {
-  const positionMap = {
-    "top-right": { vertical: "top", horizontal: "right" },
-    "top-left": { vertical: "top", horizontal: "left" },
-    "bottom-right": { vertical: "bottom", horizontal: "right" },
-    "bottom-left": { vertical: "bottom", horizontal: "left" }
-  };
-  return positionMap[position] || positionMap["top-right"];
-};
+  ])
+);
+var getSizeStyles = (size) => sizeMap[size] || sizeMap.md;
+var getAnchorOrigin = (position) => badgeAnchor(position || "top-right");
 var rgbValuesOf = (color) => {
   if (color.startsWith("#")) {
     const hex = color.slice(1);
@@ -101,20 +81,20 @@ var badgeLightingStyles = ({
 }) => ({
   // Glow effect
   ...glow && !pulse && {
-    boxShadow: `0 0 15px 3px ${alpha(colorPalette.main, 0.5)}`,
-    filter: "brightness(1.1)",
+    boxShadow: `0 0 ${GLOW.blur}px ${GLOW.spread}px ${alpha(colorPalette.main, GLOW.alpha)}`,
+    filter: `brightness(${GLOW.brightness})`,
     "&:hover": {
-      boxShadow: `0 0 20px 4px ${alpha(colorPalette.main, 0.6)}`
+      boxShadow: `0 0 ${GLOW.hoverBlur}px ${GLOW.hoverSpread}px ${alpha(colorPalette.main, GLOW.hoverAlpha)}`
     }
   },
   // Pulse animation
   ...pulse && !glow && {
-    animation: `${pulseAnimation} 2s ease-in-out infinite`
+    animation: `${pulseAnimation} ${PULSE.durationMs / 1e3}s ease-in-out infinite`
   },
   // Both glow and pulse
   ...glow && pulse && {
-    animation: `${glowPulseAnimation} 2s ease-in-out infinite, ${pulseAnimation} 2s ease-in-out infinite`,
-    filter: "brightness(1.1)"
+    animation: `${glowPulseAnimation} ${PULSE.durationMs / 1e3}s ease-in-out infinite, ${pulseAnimation} ${PULSE.durationMs / 1e3}s ease-in-out infinite`,
+    filter: `brightness(${GLOW.brightness})`
   }
 });
 var badgeAnimationStyles = ({
@@ -128,11 +108,11 @@ var badgeAnimationStyles = ({
   theme
 }) => ({
   ...animate && !bounce && {
-    animation: `${fadeInScaleAnimation} 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55)`
+    animation: `${fadeInScaleAnimation} ${FADE_IN_SCALE.durationMs / 1e3}s cubic-bezier(0.68, -0.55, 0.265, 1.55)`
   },
   // Bounce animation
   ...bounce && {
-    animation: `${bounceAnimation} 1s ease-in-out`
+    animation: `${bounceAnimation} ${BOUNCE.durationMs / 1e3}s ease-in-out`
   },
   // Shimmer effect
   ...shimmer && {
@@ -150,10 +130,10 @@ var badgeAnimationStyles = ({
       background: `linear-gradient(
             90deg,
             transparent,
-            ${alpha(theme.palette.common.white, 0.4)},
+            ${alpha(theme.palette.common.white, SHIMMER.alpha)},
             transparent
           )`,
-      animation: `${shimmerAnimation} 3s infinite`
+      animation: `${shimmerAnimation} ${SHIMMER.durationMs / 1e3}s infinite`
     }
   }
 });
@@ -174,10 +154,10 @@ var badgeStyles = ({
   return {
     "--glow-color": rgbValuesOf(colorPalette.main),
     "& .MuiBadge-badge": {
-      transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
-      fontWeight: 600,
-      border: `2px solid ${theme.palette.background.paper}`,
-      letterSpacing: "0.025em",
+      transition: `all ${BADGE_TRANSITION_MS / 1e3}s ${BADGE_TRANSITION_EASING}`,
+      fontWeight: BADGE_FONT_WEIGHT,
+      border: `${BADGE_BORDER_WIDTH}px solid ${theme.palette.background.paper}`,
+      letterSpacing: `${BADGE_LETTER_SPACING_EM}em`,
       textTransform: customVariant === "gradient" || customVariant === "glass" ? "uppercase" : "none",
       willChange: "transform, opacity",
       backfaceVisibility: "hidden",
@@ -190,7 +170,7 @@ var badgeStyles = ({
         paddingLeft: sizeStyles.padding.split(" ")[1],
         display: "inline-flex",
         alignItems: "center",
-        gap: "2px"
+        gap: `${BADGE_CONTENT_GAP}px`
       },
       // Animation on mount
       ...badgeAnimationStyles({
@@ -205,7 +185,7 @@ var badgeStyles = ({
       }),
       ...badgeLightingStyles({ glow, pulse, colorPalette }),
       "&:not(.MuiBadge-dot):hover": {
-        transform: "scale(1.1)",
+        transform: `scale(${HOVER_SCALE})`,
         zIndex: 1
       }
     }
@@ -217,4 +197,4 @@ export {
   getAnchorOrigin,
   badgeStyles
 };
-//# sourceMappingURL=chunk-4Q7HWRR2.js.map
+//# sourceMappingURL=chunk-EZSEAYYT.js.map

package/dist/chunk-EZSEAYYT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Badge/Badge.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  fadeInScaleAnimation,\n  glowPulseAnimation,\n  pulseAnimation,\n  shimmerAnimation } from './Badge.animations';\nimport {\n  BADGE_BORDER_WIDTH,\n  BADGE_CONTENT_GAP,\n  BADGE_FONT_WEIGHT,\n  BADGE_LETTER_SPACING_EM,\n  BADGE_SIZES,\n  BADGE_TRANSITION_EASING,\n  BADGE_TRANSITION_MS,\n  BOUNCE,\n  FADE_IN_SCALE,\n  GLOW,\n  HOVER_SCALE,\n  PULSE,\n  SHIMMER,\n  badgeAnchor,\n} from './Badge.metrics';\nimport { badgeVariantStyles } from './Badge.variants';\nimport type { BadgeSize, BadgeVariant } from './Badge.types';\nimport { px } from '../../../tokens/theme';\n\nexport type BadgePalette = {\n  main: string;\n  light?: string;\n  dark?: string;\n  contrastText?: string;\n};\nexport type BadgeSizeStyles = ReturnType<typeof getSizeStyles>;\n\nconst getColorFromTheme = (theme: Theme, color: string) => {\n  const colorMap: Record<string, ReturnType<typeof theme.palette.augmentColor>> = {\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`, the house word the prop actually takes. Keyed on MUI's `error`\n    // it matched nothing and fell through to the default.\n    danger: theme.palette.error,\n    neutral: {\n      main: theme.palette.grey[600],\n      light: theme.palette.grey[400],\n      dark: theme.palette.grey[800],\n      contrastText: theme.palette.getContrastText(theme.palette.grey[600]) } };\n\n  return colorMap[color] || theme.palette.primary;\n};\n\n// Derived from the shared metrics, not restated: the native `Badge` reads the\n// same table, so the two renderers cannot disagree on a chip.\nconst sizeMap: Record<\n  BadgeSize,\n  {\n    minWidth: number;\n    height: number;\n    fontSize: string;\n    padding: string;\n    dotSize: number;\n    iconSize: string;\n  }\n> = Object.fromEntries(\n  Object.entries(BADGE_SIZES).map(([size, metrics]) => [\n    size,\n    {\n      minWidth: metrics.minWidth,\n      height: metrics.height,\n      fontSize: px(metrics.fontSize),\n      padding: `0 ${metrics.paddingHorizontal}px`,\n      dotSize: metrics.dotSize,\n      iconSize: px(metrics.iconSize),\n    },\n  ]),\n) as Record<\n  BadgeSize,\n  { minWidth: number; height: number; fontSize: string; padding: string; dotSize: number; iconSize: string }\n>;\n\nexport const getSizeStyles = (size: BadgeSize) => sizeMap[size] || sizeMap.md;\n\nexport const getAnchorOrigin = (position: string) =>\n  badgeAnchor((position || 'top-right') as Parameters<typeof badgeAnchor>[0]);\n\n// Exactly one variant applies, so a lookup replaces ten mutually exclusive\n// spreads inside the style object.\n// The glow effect needs the badge colour as bare RGB components for a CSS\n// variable, and the palette hands them over as hex or rgb().\nconst rgbValuesOf = (color: string): string => {\n  if (color.startsWith('#')) {\n    const hex = color.slice(1);\n    const [r, g, b] = [0, 2, 4].map((offset) => parseInt(hex.slice(offset, offset + 2), 16));\n    return `${r}, ${g}, ${b}`;\n  }\n\n  const match = color.match(/\\d+/g);\n  if (match) return `${match[0]}, ${match[1]}, ${match[2]}`;\n  return '255, 255, 255';\n};\n\n// Glow and pulse combine into a third, distinct treatment rather than stacking.\nconst badgeLightingStyles = ({\n  glow,\n  pulse,\n  colorPalette }: {\n  glow?: boolean;\n  pulse?: boolean;\n  colorPalette: BadgePalette;\n}): CSSObject => ({\n      // Glow effect\n      ...(glow &&\n        !pulse && {\n          boxShadow: `0 0 ${GLOW.blur}px ${GLOW.spread}px ${alpha(colorPalette.main, GLOW.alpha)}`,\n          filter: `brightness(${GLOW.brightness})`,\n          '&:hover': {\n            boxShadow: `0 0 ${GLOW.hoverBlur}px ${GLOW.hoverSpread}px ${alpha(colorPalette.main, GLOW.hoverAlpha)}` } }),\n\n      // Pulse animation\n      ...(pulse &&\n        !glow && {\n          animation: `${pulseAnimation} ${PULSE.durationMs / 1000}s ease-in-out infinite` }),\n\n      // Both glow and pulse\n      ...(glow &&\n        pulse && {\n          animation: `${glowPulseAnimation} ${PULSE.durationMs / 1000}s ease-in-out infinite, ${pulseAnimation} ${PULSE.durationMs / 1000}s ease-in-out infinite`,\n          filter: `brightness(${GLOW.brightness})`,\n        }),\n\n});\n\nconst badgeAnimationStyles = ({\n  animate,\n  bounce,\n  shimmer,\n  glow: _glow,\n  pulse: _pulse,\n  customVariant,\n  colorPalette,\n  theme }: {\n  animate?: boolean;\n  bounce?: boolean;\n  shimmer?: boolean;\n  glow?: boolean;\n  pulse?: boolean;\n  customVariant?: BadgeVariant;\n  colorPalette: BadgePalette;\n  theme: Theme;\n}): CSSObject => ({\n      ...(animate &&\n        !bounce && {\n          animation: `${fadeInScaleAnimation} ${FADE_IN_SCALE.durationMs / 1000}s cubic-bezier(0.68, -0.55, 0.265, 1.55)` }),\n\n      // Bounce animation\n      ...(bounce && {\n        animation: `${bounceAnimation} ${BOUNCE.durationMs / 1000}s ease-in-out` }),\n\n      // Shimmer effect\n      ...(shimmer && {\n        background:\n          customVariant === 'gradient'\n            ? `linear-gradient(135deg, ${colorPalette.main} 0%, ${colorPalette.dark || colorPalette.main} 100%)`\n            : colorPalette.main,\n        backgroundSize: shimmer ? '1000px 100%' : 'auto',\n        position: 'relative',\n        overflow: 'hidden',\n        '&::after': {\n          content: '\"\"',\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          width: '100%',\n          height: '100%',\n          background: `linear-gradient(\n            90deg,\n            transparent,\n            ${alpha(theme.palette.common.white, SHIMMER.alpha)},\n            transparent\n          )`,\n          animation: `${shimmerAnimation} ${SHIMMER.durationMs / 1000}s infinite` } }) });\n\n// The badge chip's own styling, lifted out so the styled() callback just\n// forwards its props.\ninterface BadgeStyleArgs {\n  theme: Theme;\n  customVariant?: BadgeVariant;\n  customSize?: BadgeSize;\n  customColor?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  animate?: boolean;\n  shimmer?: boolean;\n  bounce?: boolean;\n  hasIcon?: boolean;\n}\n\nexport const badgeStyles = ({\n  theme,\n  customVariant,\n  customSize = 'md',\n  customColor = 'primary',\n  glow,\n  pulse,\n  animate,\n  shimmer,\n  bounce,\n  hasIcon }: BadgeStyleArgs): CSSObject => {\n  const colorPalette = getColorFromTheme(theme, customColor);\n  const sizeStyles = getSizeStyles(customSize);\n\n  return {\n    '--glow-color': rgbValuesOf(colorPalette.main),\n    '& .MuiBadge-badge': {\n      transition: `all ${BADGE_TRANSITION_MS / 1000}s ${BADGE_TRANSITION_EASING}`,\n      fontWeight: BADGE_FONT_WEIGHT,\n      border: `${BADGE_BORDER_WIDTH}px solid ${theme.palette.background.paper}`,\n      letterSpacing: `${BADGE_LETTER_SPACING_EM}em`,\n      textTransform:\n        customVariant === 'gradient' || customVariant === 'glass' ? 'uppercase' : 'none',\n      willChange: 'transform, opacity',\n      backfaceVisibility: 'hidden',\n\n      // Outline variant\n\n      // Destructive variant\n\n      // Warning variant\n\n      // Adjust padding when icon is present\n      ...badgeVariantStyles(theme, colorPalette, sizeStyles, customVariant),\n      ...(hasIcon && {\n        paddingLeft: sizeStyles.padding.split(' ')[1],\n        display: 'inline-flex',\n        alignItems: 'center',\n        gap: `${BADGE_CONTENT_GAP}px`,\n      }),\n\n      // Animation on mount\n      ...badgeAnimationStyles({\n        animate,\n        bounce,\n        shimmer,\n        glow,\n        pulse,\n        customVariant,\n        colorPalette,\n        theme }),\n      ...badgeLightingStyles({ glow, pulse, colorPalette }),\n\n      '&:not(.MuiBadge-dot):hover': {\n        transform: `scale(${HOVER_SCALE})`,\n        zIndex: 1 } } };\n}\n"],"mappings":"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","names":[]}

package/dist/{chunk-LIOVN5IM.js → chunk-F2DOTCF3.js}

@@ -1,6 +1,6 @@
 import {
   GridToolbar
-} from "./chunk-CRNQVWIT.js";
+} from "./chunk-Z4GWXTZV.js";
 
 // src/components/data-display/DataViews/data-views-shell-toolbar.tsx
 import { jsx } from "react/jsx-runtime";
@@ -64,4 +64,4 @@ function ShellToolbar({
 export {
   ShellToolbar
 };
-//# sourceMappingURL=chunk-LIOVN5IM.js.map
+//# sourceMappingURL=chunk-F2DOTCF3.js.map

package/dist/chunk-FAITHWIO.js

@@ -0,0 +1,73 @@
+// src/components/data-display/Avatar/Avatar.metrics.ts
+var AVATAR_SIZES = {
+  xs: { box: 24, fontSize: 12 },
+  sm: { box: 32, fontSize: 14 },
+  md: { box: 40, fontSize: 16 },
+  lg: { box: 48, fontSize: 18 },
+  xl: { box: 64, fontSize: 24 },
+  xxl: { box: 80, fontSize: 32 }
+};
+var ROUNDED_RADIUS_UNITS = 1;
+var BORDER_WIDTH = 2;
+var BORDER_HALO_ALPHA = 0.2;
+var GLOW = { blur: 20, spread: 5, alpha: 0.4, brightness: 1.05 };
+var PULSE = { durationMs: 2e3, alpha: 0.3, spread: 10 };
+var SHIMMER = { durationMs: 1500, fromAlpha: 0.6, toAlpha: 0.8 };
+var LOADING_OVERLAY = { paperAlpha: 0.7, blur: 2 };
+var SPINNER = {
+  /** A share of the avatar's box. */
+  scale: 0.4,
+  ringWidth: 2,
+  trackAlpha: 0.3,
+  durationMs: 800
+};
+var STATUS_DOT = { scale: 0.2, min: 8, borderWidth: 2, anchor: 0.14 };
+var GLYPH_SIZE = 24;
+var FADE_MS = 300;
+var SCALE_IN_MS = 300;
+var AVATAR_TRANSITION_MS = 300;
+var AVATAR_TRANSITION_EASING = "cubic-bezier(0.4, 0, 0.2, 1)";
+var HOVER = { scale: 1.1, lift: 2, shadowY: 8, shadowBlur: 20, shadowAlpha: 0.3, brightness: 1.1 };
+var ACTIVE_SCALE = 1.05;
+var FOCUS_RING = { width: 3, offset: 2, alpha: 0.5 };
+var GROUP_OVERLAP = 8;
+var GROUP_MAX = 4;
+var GROUP_HOVER = { scale: 1.1, lift: 4 };
+function statusColor(theme, status) {
+  if (status === "online") return theme.palette.success.main;
+  if (status === "away") return theme.palette.warning.main;
+  if (status === "busy") return theme.palette.danger.main;
+  return theme.palette.grey[500];
+}
+function avatarAccent(theme, color) {
+  if (color === "neutral") return { main: theme.palette.grey[700], contrastText: "#fff" };
+  const accent = theme.palette[color];
+  return { main: accent.main, contrastText: accent.contrastText || "#fff" };
+}
+
+export {
+  AVATAR_SIZES,
+  ROUNDED_RADIUS_UNITS,
+  BORDER_WIDTH,
+  BORDER_HALO_ALPHA,
+  GLOW,
+  PULSE,
+  SHIMMER,
+  LOADING_OVERLAY,
+  SPINNER,
+  STATUS_DOT,
+  GLYPH_SIZE,
+  FADE_MS,
+  SCALE_IN_MS,
+  AVATAR_TRANSITION_MS,
+  AVATAR_TRANSITION_EASING,
+  HOVER,
+  ACTIVE_SCALE,
+  FOCUS_RING,
+  GROUP_OVERLAP,
+  GROUP_MAX,
+  GROUP_HOVER,
+  statusColor,
+  avatarAccent
+};
+//# sourceMappingURL=chunk-FAITHWIO.js.map

package/dist/chunk-FAITHWIO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Avatar/Avatar.metrics.ts"],"sourcesContent":["import type { AvatarSize, AvatarStatus } from './Avatar.base';\nimport type { UiTheme } from '../../../tokens/theme';\nimport type { ColorValue } from '../../../tokens/vocabulary';\n\n/**\n * THE NUMBERS BOTH `Avatar` RENDERERS DRAW WITH.\n *\n * `Avatar.view.tsx` (web, emotion over MUI's `Avatar` and `Badge`) and\n * `Avatar.native.tsx` (React Native) read this one table: the six boxes and\n * their type, the status dot, the glow, the shimmer and the spinner. The web\n * turns the px into rem; native uses the numbers.\n */\nexport interface AvatarSizeMetrics {\n  /** The square the portrait fills, in px. */\n  box: number;\n  /** The initials' type size, in px. */\n  fontSize: number;\n}\n\nexport const AVATAR_SIZES: Record<AvatarSize, AvatarSizeMetrics> = {\n  xs: { box: 24, fontSize: 12 },\n  sm: { box: 32, fontSize: 14 },\n  md: { box: 40, fontSize: 16 },\n  lg: { box: 48, fontSize: 18 },\n  xl: { box: 64, fontSize: 24 },\n  xxl: { box: 80, fontSize: 32 },\n};\n\n/** `rounded` takes one spacing unit; `circle` and `status` are round. */\nexport const ROUNDED_RADIUS_UNITS = 1;\n\n/** The paper ring an avatar takes inside a group, and the hairline outside it. */\nexport const BORDER_WIDTH = 2;\nexport const BORDER_HALO_ALPHA = 0.2;\n\n/** `glow`: a 20px halo at five pixels of spread, and a brightness lift. */\nexport const GLOW = { blur: 20, spread: 5, alpha: 0.4, brightness: 1.05 } as const;\n\n/** `pulse`: the `::after` ring, from nothing to 10px while it fades out. */\nexport const PULSE = { durationMs: 2000, alpha: 0.3, spread: 10 } as const;\n\n/** The shimmer that runs across a loading avatar. */\nexport const SHIMMER = { durationMs: 1500, fromAlpha: 0.6, toAlpha: 0.8 } as const;\n\n/** The overlay over a loading avatar, and the ring spinning in it. */\nexport const LOADING_OVERLAY = { paperAlpha: 0.7, blur: 2 } as const;\nexport const SPINNER = {\n  /** A share of the avatar's box. */\n  scale: 0.4,\n  ringWidth: 2,\n  trackAlpha: 0.3,\n  durationMs: 800,\n} as const;\n\n/**\n * The status dot: a fifth of the box, never below 8px, inside a paper ring.\n * `anchor` is MUI's `overlap=\"circular\"` inset — the dot's CENTRE sits 14% of\n * the box in from the bottom-right corner.\n */\nexport const STATUS_DOT = { scale: 0.2, min: 8, borderWidth: 2, anchor: 0.14 } as const;\n\n/**\n * The default and broken-image glyphs are ordinary `SvgIcon`s here, not MUI's\n * own `.MuiAvatar-fallback` (which is 75% of the box): this component passes\n * them as CHILDREN, so they render at the icon default whatever the box is.\n */\nexport const GLYPH_SIZE = 24;\n\n/** MUI's `Fade` timeout on mount, and the scale-in behind it. */\nexport const FADE_MS = 300;\nexport const SCALE_IN_MS = 300;\n\n/** `transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1)`. */\nexport const AVATAR_TRANSITION_MS = 300;\nexport const AVATAR_TRANSITION_EASING = 'cubic-bezier(0.4, 0, 0.2, 1)';\n\n/** The interactive lift, which is a `:hover` on the web. */\nexport const HOVER = { scale: 1.1, lift: 2, shadowY: 8, shadowBlur: 20, shadowAlpha: 0.3, brightness: 1.1 } as const;\nexport const ACTIVE_SCALE = 1.05;\n\n/** The focus ring `:focus-visible` draws. */\nexport const FOCUS_RING = { width: 3, offset: 2, alpha: 0.5 } as const;\n\n/** An avatar group's default overlap, in px, and its hover lift. */\nexport const GROUP_OVERLAP = 8;\nexport const GROUP_MAX = 4;\nexport const GROUP_HOVER = { scale: 1.1, lift: 4 } as const;\n\n/** The dot's colour per status. `offline` is the ramp, the rest are semantic. */\nexport function statusColor(theme: UiTheme, status: AvatarStatus): string {\n  if (status === 'online') return theme.palette.success.main;\n  if (status === 'away') return theme.palette.warning.main;\n  if (status === 'busy') return theme.palette.danger.main;\n  return theme.palette.grey[500];\n}\n\nexport interface AvatarAccent {\n  main: string;\n  contrastText: string;\n}\n\n/**\n * The accent behind the initials. `danger`, NOT `error` — the web map was keyed\n * on MUI's word while the prop took the house one, so `danger` matched nothing\n * and fell through to primary: a red avatar rendering blue, silently.\n */\nexport function avatarAccent(theme: UiTheme, color: ColorValue): AvatarAccent {\n  if (color === 'neutral') return { main: theme.palette.grey[700], contrastText: '#fff' };\n  const accent = theme.palette[color];\n  return { main: accent.main, contrastText: accent.contrastText || '#fff' };\n}\n"],"mappings":";AAmBO,IAAM,eAAsD;AAAA,EACjE,IAAI,EAAE,KAAK,IAAI,UAAU,GAAG;AAAA,EAC5B,IAAI,EAAE,KAAK,IAAI,UAAU,GAAG;AAAA,EAC5B,IAAI,EAAE,KAAK,IAAI,UAAU,GAAG;AAAA,EAC5B,IAAI,EAAE,KAAK,IAAI,UAAU,GAAG;AAAA,EAC5B,IAAI,EAAE,KAAK,IAAI,UAAU,GAAG;AAAA,EAC5B,KAAK,EAAE,KAAK,IAAI,UAAU,GAAG;AAC/B;AAGO,IAAM,uBAAuB;AAG7B,IAAM,eAAe;AACrB,IAAM,oBAAoB;AAG1B,IAAM,OAAO,EAAE,MAAM,IAAI,QAAQ,GAAG,OAAO,KAAK,YAAY,KAAK;AAGjE,IAAM,QAAQ,EAAE,YAAY,KAAM,OAAO,KAAK,QAAQ,GAAG;AAGzD,IAAM,UAAU,EAAE,YAAY,MAAM,WAAW,KAAK,SAAS,IAAI;AAGjE,IAAM,kBAAkB,EAAE,YAAY,KAAK,MAAM,EAAE;AACnD,IAAM,UAAU;AAAA;AAAA,EAErB,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,YAAY;AACd;AAOO,IAAM,aAAa,EAAE,OAAO,KAAK,KAAK,GAAG,aAAa,GAAG,QAAQ,KAAK;AAOtE,IAAM,aAAa;AAGnB,IAAM,UAAU;AAChB,IAAM,cAAc;AAGpB,IAAM,uBAAuB;AAC7B,IAAM,2BAA2B;AAGjC,IAAM,QAAQ,EAAE,OAAO,KAAK,MAAM,GAAG,SAAS,GAAG,YAAY,IAAI,aAAa,KAAK,YAAY,IAAI;AACnG,IAAM,eAAe;AAGrB,IAAM,aAAa,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,IAAI;AAGrD,IAAM,gBAAgB;AACtB,IAAM,YAAY;AAClB,IAAM,cAAc,EAAE,OAAO,KAAK,MAAM,EAAE;AAG1C,SAAS,YAAY,OAAgB,QAA8B;AACxE,MAAI,WAAW,SAAU,QAAO,MAAM,QAAQ,QAAQ;AACtD,MAAI,WAAW,OAAQ,QAAO,MAAM,QAAQ,QAAQ;AACpD,MAAI,WAAW,OAAQ,QAAO,MAAM,QAAQ,OAAO;AACnD,SAAO,MAAM,QAAQ,KAAK,GAAG;AAC/B;AAYO,SAAS,aAAa,OAAgB,OAAiC;AAC5E,MAAI,UAAU,UAAW,QAAO,EAAE,MAAM,MAAM,QAAQ,KAAK,GAAG,GAAG,cAAc,OAAO;AACtF,QAAM,SAAS,MAAM,QAAQ,KAAK;AAClC,SAAO,EAAE,MAAM,OAAO,MAAM,cAAc,OAAO,gBAAgB,OAAO;AAC1E;","names":[]}

package/dist/{chunk-64IEKEMQ.js → chunk-FGLV6BXQ.js}

@@ -1,6 +1,3 @@
-import {
-  useCodeEditor
-} from "./chunk-ZSXV3ERD.js";
 import {
   makeTestId,
   resolveCodeEditorProps
@@ -8,6 +5,9 @@ import {
 import {
   EditorToolbar
 } from "./chunk-4V7DBU4H.js";
+import {
+  useCodeEditor
+} from "./chunk-ZSXV3ERD.js";
 import {
   fieldEdge
 } from "./chunk-MLOWPVVW.js";
@@ -167,4 +167,4 @@ var CodeEditor = (componentProps) => {
 export {
   CodeEditor
 };
-//# sourceMappingURL=chunk-64IEKEMQ.js.map
+//# sourceMappingURL=chunk-FGLV6BXQ.js.map

package/dist/{chunk-L65LF6LN.js → chunk-FP4R47TM.js}

@@ -2,7 +2,7 @@ import {
   buildGridColumns,
   buildRowActionsColumn,
   isActionsColumn
-} from "./chunk-YLDS5FOQ.js";
+} from "./chunk-KZSKI2R3.js";
 
 // src/components/data-display/DataViews/data-views-columns.ts
 import { useMemo } from "react";
@@ -52,4 +52,4 @@ export {
   useColumnsWithActions,
   useRenderedColumns
 };
-//# sourceMappingURL=chunk-L65LF6LN.js.map
+//# sourceMappingURL=chunk-FP4R47TM.js.map

package/dist/{chunk-NQHOHQCY.js → chunk-FPWB5ILF.js}

@@ -1,19 +1,23 @@
 import {
   avatarFor,
-  chipRole,
   chipStyles,
   iconWithTestId,
+  makeKeyDownHandler
+} from "./chunk-E46PG577.js";
+import {
+  chipMuiSize
+} from "./chunk-KU6VHNRV.js";
+import {
+  chipRole,
   isClickable,
-  makeKeyDownHandler,
   makeTestId
-} from "./chunk-FS4X3VDA.js";
+} from "./chunk-BF4FYOAR.js";
 
 // src/components/data-display/Chip/Chip.tsx
 import CancelIcon from "@mui/icons-material/Cancel";
 import MuiChip from "@mui/material/Chip/index.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
-var muiSizeFor = (size) => size === "xs" || size === "sm" ? "small" : "medium";
 var muiColorFor = (color) => {
   if (color === "danger") return "error";
   return color === "neutral" ? "default" : color;
@@ -34,9 +38,13 @@ var Chip = forwardRef(({
   onDelete,
   className,
   dataTestId,
+  // React Native's spelling of the same id; it names the component on both
+  // sides and must not reach the DOM as an attribute.
+  testID,
   ...props
 }, ref) => {
-  const testId = makeTestId(dataTestId);
+  const chipId = testID ?? dataTestId;
+  const testId = makeTestId(chipId);
   const clickable = isClickable(disabled, onClick, selectable);
   return /* @__PURE__ */ jsx(
     MuiChip,
@@ -44,7 +52,7 @@ var Chip = forwardRef(({
       ref,
       label: /* @__PURE__ */ jsx("span", { "data-testid": testId("label"), children: label }),
       variant,
-      size: muiSizeFor(size),
+      size: chipMuiSize(size),
       color: muiColorFor(color),
       avatar: avatarFor(avatar, avatarSrc),
       icon: iconWithTestId(icon, testId("icon")),
@@ -57,7 +65,7 @@ var Chip = forwardRef(({
       className,
       role: chipRole(selectable, onClick),
       "aria-selected": selectable ? selected : void 0,
-      "data-testid": dataTestId || "chip",
+      "data-testid": chipId || "chip",
       sx: chipStyles({ variant, selected, clickable, disabled }),
       ...props
     }
@@ -68,4 +76,4 @@ Chip.displayName = "Chip";
 export {
   Chip
 };
-//# sourceMappingURL=chunk-NQHOHQCY.js.map
+//# sourceMappingURL=chunk-FPWB5ILF.js.map

package/dist/chunk-FPWB5ILF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Chip/Chip.tsx"],"sourcesContent":["import CancelIcon from '@mui/icons-material/Cancel';\nimport MuiChip from '@mui/material/Chip/index.js';\nimport { forwardRef } from 'react';\n\nimport { chipRole, isClickable, makeTestId } from './Chip.helpers';\nimport { chipMuiSize } from './Chip.metrics';\nimport {\n  avatarFor,\n  chipStyles,\n  iconWithTestId,\n  makeKeyDownHandler,\n} from './Chip.styles';\nimport type { ChipProps } from './Chip.types';\n\ntype MuiChipColor =\n  | 'primary'\n  | 'secondary'\n  | 'error'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'default';\n\n/**\n * `danger` and `neutral` are ours; the rest are MUI's own names already.\n *\n * The same boundary translation `Button` performs, and it must stay a\n * translation rather than a cast: a cast is what let `danger` through untouched\n * and had MUI silently fall back to grey.\n *\n * `neutral` maps to `default`, not to `inherit` as it does on a button. A chip's\n * unaccented state is a real palette entry with its own fill; `inherit` would\n * take the surrounding text colour and paint a chip that reads as disabled.\n */\nconst muiColorFor = (color: NonNullable<ChipProps['color']>): MuiChipColor => {\n  if (color === 'danger') return 'error';\n  return color === 'neutral' ? 'default' : color;\n};\n\nexport const Chip = forwardRef<HTMLDivElement, ChipProps>(({\n  label,\n  variant = 'filled',\n  size = 'md',\n  color = 'primary',\n  avatarSrc,\n  avatar,\n  icon,\n  selected,\n  selectable,\n  deletable,\n  disabled,\n  onClick,\n  onDelete,\n  className,\n  dataTestId,\n  // React Native's spelling of the same id; it names the component on both\n  // sides and must not reach the DOM as an attribute.\n  testID,\n  ...props\n}, ref) => {\n  const chipId = testID ?? dataTestId;\n  const testId = makeTestId(chipId);\n  const clickable = isClickable(disabled, onClick, selectable);\n\n  return (\n    <MuiChip\n      ref={ref}\n      label={<span data-testid={testId('label')}>{label}</span>}\n      variant={variant}\n      size={chipMuiSize(size)}\n      color={muiColorFor(color)}\n      avatar={avatarFor(avatar, avatarSrc)}\n      icon={iconWithTestId(icon, testId('icon'))}\n      onDelete={deletable ? onDelete : undefined}\n      deleteIcon={deletable ? <CancelIcon data-testid={testId('delete')} /> : undefined}\n      disabled={disabled}\n      clickable={clickable}\n      onClick={clickable ? onClick : undefined}\n      onKeyDown={makeKeyDownHandler({ disabled, deletable, selectable, onClick, onDelete })}\n      className={className}\n      role={chipRole(selectable, onClick)}\n      aria-selected={selectable ? selected : undefined}\n      data-testid={chipId || 'chip'}\n      sx={chipStyles({ variant, selected, clickable, disabled })}\n      {...props}\n    />\n  );\n});\n\nChip.displayName = 'Chip';\n"],"mappings":";;;;;;;;;;;;;;;;AAAA,OAAO,gBAAgB;AACvB,OAAO,aAAa;AACpB,SAAS,kBAAkB;AAiEd;AAjCb,IAAM,cAAc,CAAC,UAAyD;AAC5E,MAAI,UAAU,SAAU,QAAO;AAC/B,SAAO,UAAU,YAAY,YAAY;AAC3C;AAEO,IAAM,OAAO,WAAsC,CAAC;AAAA,EACzD;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA;AAAA,EAGA;AAAA,EACA,GAAG;AACL,GAAG,QAAQ;AACT,QAAM,SAAS,UAAU;AACzB,QAAM,SAAS,WAAW,MAAM;AAChC,QAAM,YAAY,YAAY,UAAU,SAAS,UAAU;AAE3D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,oBAAC,UAAK,eAAa,OAAO,OAAO,GAAI,iBAAM;AAAA,MAClD;AAAA,MACA,MAAM,YAAY,IAAI;AAAA,MACtB,OAAO,YAAY,KAAK;AAAA,MACxB,QAAQ,UAAU,QAAQ,SAAS;AAAA,MACnC,MAAM,eAAe,MAAM,OAAO,MAAM,CAAC;AAAA,MACzC,UAAU,YAAY,WAAW;AAAA,MACjC,YAAY,YAAY,oBAAC,cAAW,eAAa,OAAO,QAAQ,GAAG,IAAK;AAAA,MACxE;AAAA,MACA;AAAA,MACA,SAAS,YAAY,UAAU;AAAA,MAC/B,WAAW,mBAAmB,EAAE,UAAU,WAAW,YAAY,SAAS,SAAS,CAAC;AAAA,MACpF;AAAA,MACA,MAAM,SAAS,YAAY,OAAO;AAAA,MAClC,iBAAe,aAAa,WAAW;AAAA,MACvC,eAAa,UAAU;AAAA,MACvB,IAAI,WAAW,EAAE,SAAS,UAAU,WAAW,SAAS,CAAC;AAAA,MACxD,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,KAAK,cAAc;","names":[]}

package/dist/{chunk-7AR2R7TV.js → chunk-G5ZVD5IJ.js}

@@ -1,11 +1,11 @@
-import {
-  renderMenuItem
-} from "./chunk-RXSGHPCR.js";
 import {
   CollapseToggle,
   LogoBar,
   MenuList
 } from "./chunk-Q444G5X7.js";
+import {
+  renderMenuItem
+} from "./chunk-RXSGHPCR.js";
 import {
   slideIn
 } from "./chunk-FYLCSCMR.js";
@@ -113,4 +113,4 @@ var NavigationStandardBody = ({
 export {
   NavigationStandardBody
 };
-//# sourceMappingURL=chunk-7AR2R7TV.js.map
+//# sourceMappingURL=chunk-G5ZVD5IJ.js.map

package/dist/{chunk-SHQWIDD5.js → chunk-GJQYM3PM.js}

@@ -1,9 +1,9 @@
-import {
-  buildDayArgs
-} from "./chunk-E2Y7G4MP.js";
 import {
   CalendarDay
 } from "./chunk-YU26GBNX.js";
+import {
+  buildDayArgs
+} from "./chunk-E2Y7G4MP.js";
 import {
   isSameDay
 } from "./chunk-TERT6TIS.js";
@@ -40,4 +40,4 @@ var CalendarDayCell = ({
 export {
   CalendarDayCell
 };
-//# sourceMappingURL=chunk-SHQWIDD5.js.map
+//# sourceMappingURL=chunk-GJQYM3PM.js.map