@epilot/zenith-react 0.1.0 → 0.2.0-next.1

package/dist/components/alert-dialog/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { useAppearanceAttributes } from \"../appearance-boundary/appearance-boundary\"\nimport { useDensity } from \"../density-provider/density-provider\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport {\n  Button,\n  type ButtonProps,\n  type ButtonSize,\n  type ButtonVariant,\n} from \"../button/button\"\n\nconst useStyles = makeZenithStyles({\n  overlay: {\n    position: \"fixed\",\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    zIndex: 50,\n    backgroundColor: \"rgba(0, 0, 0, 0.5)\",\n    \"&[data-state='open']\": {\n      animationName: {\n        from: { opacity: 0 },\n        to: { opacity: 1 },\n      },\n      animationDuration: \"150ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    },\n    \"&[data-state='closed']\": {\n      animationName: {\n        from: { opacity: 1 },\n        to: { opacity: 0 },\n      },\n      animationDuration: \"100ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 1, 1)\",\n    },\n  },\n  content: {\n    backgroundColor: tokens.body,\n    position: \"fixed\",\n    top: \"50%\",\n    left: \"50%\",\n    transform: \"translate(-50%, -50%)\",\n    zIndex: 50,\n    display: \"grid\",\n    width: \"100%\",\n    maxWidth: \"calc(100% - 2rem)\",\n    ...shorthands.gap(tokens.spacingGroup2),\n    ...shorthands.borderRadius(tokens.radiusXl),\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n    ...shorthands.padding(tokens.spacingGroup2),\n    // v1 shadow-lg\n    boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n    outlineStyle: \"none\",\n    \"&[data-state='open']\": {\n      animationName: {\n        from: {\n          opacity: 0,\n          transform: \"translate(-50%, -50%) scale(0.95)\",\n        },\n        to: {\n          opacity: 1,\n          transform: \"translate(-50%, -50%) scale(1)\",\n        },\n      },\n      animationDuration: \"150ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    },\n    \"&[data-state='closed']\": {\n      animationName: {\n        from: {\n          opacity: 1,\n          transform: \"translate(-50%, -50%) scale(1)\",\n        },\n        to: {\n          opacity: 0,\n          transform: \"translate(-50%, -50%) scale(0.95)\",\n        },\n      },\n      animationDuration: \"100ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 1, 1)\",\n    },\n  },\n  sm: {\n    maxWidth: tokens.containerSm,\n  },\n  md: {\n    maxWidth: tokens.containerMd,\n  },\n  lg: {\n    maxWidth: tokens.containerLg,\n  },\n  xl: {\n    \"@media (min-width: 640px)\": {\n      maxWidth: tokens.containerXl,\n    },\n  },\n  header: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    ...shorthands.gap(tokens.spacingElement2),\n    textAlign: \"left\",\n  },\n  footer: {\n    display: \"flex\",\n    ...shorthands.gap(tokens.spacingElement2),\n    justifyContent: \"flex-end\",\n  },\n  title: {\n    fontSize: tokens.textXl,\n    lineHeight: tokens.leadingXl,\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayA12,\n  },\n  description: {\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.grayA11,\n  },\n})\n\nexport type AlertDialogProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Root\n>\n\nexport type AlertDialogTriggerProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Trigger\n>\n\nexport type AlertDialogPortalProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Portal\n>\n\nexport type AlertDialogOverlayProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Overlay\n>\n\nexport type AlertDialogSize = \"xl\" | \"lg\" | \"md\" | \"sm\"\n\nexport type AlertDialogContentProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Content\n> & {\n  size?: AlertDialogSize\n}\n\nexport type AlertDialogHeaderProps = React.ComponentProps<\"div\">\nexport type AlertDialogFooterProps = React.ComponentProps<\"div\">\n\nexport type AlertDialogTitleProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Title\n>\n\nexport type AlertDialogDescriptionProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Description\n>\n\nexport type AlertDialogActionProps = Omit<\n  ButtonProps,\n  \"variant\" | \"size\" | \"destructive\"\n> & {\n  variant?: ButtonVariant\n  size?: ButtonSize\n  destructive?: boolean\n}\n\nexport type AlertDialogCancelProps = Omit<\n  ButtonProps,\n  \"variant\" | \"size\" | \"destructive\"\n> & {\n  variant?: ButtonVariant\n  size?: ButtonSize\n  destructive?: boolean\n}\n\nexport const AlertDialog = React.forwardRef<HTMLElement, AlertDialogProps>(\n  function AlertDialog(props, _ref) {\n    return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n  }\n)\n\nexport const AlertDialogTrigger = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Trigger>,\n  AlertDialogTriggerProps\n>(function AlertDialogTrigger({ className, ...props }, ref) {\n  return (\n    <AlertDialogPrimitive.Trigger\n      ref={ref}\n      data-slot=\"alert-dialog-trigger\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-trigger\" }}\n      className={className}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogPortal = React.forwardRef<\n  HTMLElement,\n  AlertDialogPortalProps\n>(function AlertDialogPortal(props, _ref) {\n  return (\n    <AlertDialogPrimitive.Portal\n      data-slot=\"alert-dialog-portal\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-portal\" }}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogOverlay = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Overlay>,\n  AlertDialogOverlayProps\n>(function AlertDialogOverlay({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <AlertDialogPrimitive.Overlay\n      ref={ref}\n      data-slot=\"alert-dialog-overlay\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-overlay\" }}\n      className={mergeClasses(styles.overlay, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogContent = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Content>,\n  AlertDialogContentProps\n>(function AlertDialogContent(\n  { className, size = \"xl\", children, ...props },\n  ref\n) {\n  const styles = useStyles()\n  // DENSITY-SPEC.md §4.4 — portal content boundary; see dialog.tsx's identical comment.\n  const override = useDensity()\n  // SPEC.md §2 rule 3 — the same portal asymmetry, for the appearance pair: re-stamp the\n  // nearest explicit AppearanceBoundary's mode+surface, or neither attribute when there is\n  // none, leaving live shell inheritance in place.\n  const appearance = useAppearanceAttributes()\n\n  return (\n    <>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Content\n        ref={ref}\n        data-slot=\"alert-dialog-content\"\n        {...{ [SLOT_ATTR]: \"alert-dialog-content\" }}\n        {...(override !== undefined ? { \"data-density\": override } : {})}\n        {...appearance}\n        className={mergeClasses(styles.content, styles[size], className)}\n        {...props}\n      >\n        {children}\n      </AlertDialogPrimitive.Content>\n    </>\n  )\n})\n\nexport const AlertDialogHeader = React.forwardRef<\n  HTMLDivElement,\n  AlertDialogHeaderProps\n>(function AlertDialogHeader({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"alert-dialog-header\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-header\" }}\n      className={mergeClasses(styles.header, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogFooter = React.forwardRef<\n  HTMLDivElement,\n  AlertDialogFooterProps\n>(function AlertDialogFooter({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"alert-dialog-footer\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-footer\" }}\n      className={mergeClasses(styles.footer, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogTitle = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Title>,\n  AlertDialogTitleProps\n>(function AlertDialogTitle({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <AlertDialogPrimitive.Title\n      ref={ref}\n      data-slot=\"alert-dialog-title\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-title\" }}\n      className={mergeClasses(styles.title, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogDescription = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Description>,\n  AlertDialogDescriptionProps\n>(function AlertDialogDescription({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <AlertDialogPrimitive.Description\n      ref={ref}\n      data-slot=\"alert-dialog-description\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-description\" }}\n      className={mergeClasses(styles.description, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogAction = React.forwardRef<\n  HTMLButtonElement,\n  AlertDialogActionProps\n>(function AlertDialogAction(\n  {\n    variant = \"primary\",\n    size = \"base\",\n    destructive = false,\n    className,\n    ...props\n  },\n  ref\n) {\n  return (\n    <AlertDialogPrimitive.Action asChild>\n      <Button\n        ref={ref}\n        data-slot=\"alert-dialog-action\"\n        {...{ [SLOT_ATTR]: \"alert-dialog-action\" }}\n        variant={variant}\n        size={size}\n        destructive={destructive}\n        className={className}\n        {...props}\n      />\n    </AlertDialogPrimitive.Action>\n  )\n})\n\nexport const AlertDialogCancel = React.forwardRef<\n  HTMLButtonElement,\n  AlertDialogCancelProps\n>(function AlertDialogCancel(\n  {\n    variant = \"secondary\",\n    size = \"base\",\n    destructive = false,\n    className,\n    ...props\n  },\n  ref\n) {\n  return (\n    <AlertDialogPrimitive.Cancel asChild>\n      <Button\n        ref={ref}\n        data-slot=\"alert-dialog-cancel\"\n        {...{ [SLOT_ATTR]: \"alert-dialog-cancel\" }}\n        variant={variant}\n        size={size}\n        destructive={destructive}\n        className={className}\n        {...props}\n      />\n    </AlertDialogPrimitive.Cancel>\n  )\n})\n"],"names":["useStyles","makeZenithStyles","tokens.body","shorthands","tokens.spacingGroup2","tokens.radiusXl","tokens.grayA1","tokens.containerSm","tokens.containerMd","tokens.containerLg","tokens.containerXl","tokens.spacingElement2","tokens.textXl","tokens.leadingXl","tokens.fontWeightSemibold","tokens.grayA12","tokens.textSm","tokens.leadingSm","tokens.grayA11","AlertDialog","React","props","_ref","AlertDialogPrimitive.Root","AlertDialogTrigger","className","ref","jsx","AlertDialogPrimitive.Trigger","SLOT_ATTR","AlertDialogPortal","AlertDialogPrimitive.Portal","AlertDialogOverlay","styles","AlertDialogPrimitive.Overlay","mergeClasses","AlertDialogContent","size","children","override","useDensity","appearance","useAppearanceAttributes","jsxs","Fragment","AlertDialogPrimitive.Content","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogPrimitive.Title","AlertDialogDescription","AlertDialogPrimitive.Description","AlertDialogAction","variant","destructive","AlertDialogPrimitive.Action","Button","AlertDialogCancel","AlertDialogPrimitive.Cancel"],"mappings":"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"}
+{"version":3,"file":"alert-dialog.js","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { useAppearanceAttributes } from \"../appearance-boundary/appearance-boundary\"\nimport { useDensity } from \"../density-provider/density-provider\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport { OVERLAY_Z_INDEX } from \"../../styles/overlay-layer\"\nimport * as tokens from \"../../tokens\"\nimport {\n  Button,\n  type ButtonProps,\n  type ButtonSize,\n  type ButtonVariant,\n} from \"../button/button\"\n\nconst useStyles = makeZenithStyles({\n  // For the bare native `<button>` a Trigger/Close renders. Not applied under `asChild`, where the\n  // child owns its own element and two atom sets would race for the same properties.\n  nativeTrigger: {\n    ...nativeControl,\n  },\n  overlay: {\n    position: \"fixed\",\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    zIndex: OVERLAY_Z_INDEX,\n    backgroundColor: \"rgba(0, 0, 0, 0.5)\",\n    \"&[data-state='open']\": {\n      animationName: {\n        from: { opacity: 0 },\n        to: { opacity: 1 },\n      },\n      animationDuration: \"150ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    },\n    \"&[data-state='closed']\": {\n      animationName: {\n        from: { opacity: 1 },\n        to: { opacity: 0 },\n      },\n      animationDuration: \"100ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 1, 1)\",\n    },\n  },\n  content: {\n    ...boxModel,\n    backgroundColor: tokens.body,\n    position: \"fixed\",\n    top: \"50%\",\n    left: \"50%\",\n    transform: \"translate(-50%, -50%)\",\n    zIndex: OVERLAY_Z_INDEX,\n    display: \"grid\",\n    width: \"100%\",\n    maxWidth: \"calc(100% - 2rem)\",\n    ...shorthands.gap(tokens.spacingGroup2),\n    ...shorthands.borderRadius(tokens.radiusXl),\n    ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n    ...shorthands.padding(tokens.spacingGroup2),\n    // v1 shadow-lg\n    boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n    outlineStyle: \"none\",\n    \"@media (prefers-reduced-motion: reduce)\": {\n      animationDuration: \"0.01ms\",\n      animationIterationCount: \"1\",\n      \"&[data-state='open']\": {\n        animationDuration: \"0.01ms\",\n      },\n      \"&[data-state='closed']\": {\n        animationDuration: \"0.01ms\",\n      },\n    },\n    \"&[data-state='open']\": {\n      animationName: {\n        from: {\n          opacity: 0,\n          transform: \"translate(-50%, -50%) scale(0.95)\",\n        },\n        to: {\n          opacity: 1,\n          transform: \"translate(-50%, -50%) scale(1)\",\n        },\n      },\n      animationDuration: \"150ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    },\n    \"&[data-state='closed']\": {\n      animationName: {\n        from: {\n          opacity: 1,\n          transform: \"translate(-50%, -50%) scale(1)\",\n        },\n        to: {\n          opacity: 0,\n          transform: \"translate(-50%, -50%) scale(0.95)\",\n        },\n      },\n      animationDuration: \"100ms\",\n      animationTimingFunction: \"cubic-bezier(0.4, 0, 1, 1)\",\n    },\n  },\n  sm: {\n    ...boxModel,\n    maxWidth: tokens.containerSm,\n  },\n  md: {\n    ...boxModel,\n    maxWidth: tokens.containerMd,\n  },\n  lg: {\n    ...boxModel,\n    maxWidth: tokens.containerLg,\n  },\n  xl: {\n    ...boxModel,\n    \"@media (min-width: 640px)\": {\n      maxWidth: tokens.containerXl,\n    },\n  },\n  header: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    ...shorthands.gap(tokens.spacingElement2),\n    textAlign: \"left\",\n  },\n  footer: {\n    display: \"flex\",\n    ...shorthands.gap(tokens.spacingElement2),\n    justifyContent: \"flex-end\",\n  },\n  title: {\n    ...shorthands.margin(0),\n    fontSize: tokens.textXl,\n    lineHeight: tokens.leadingXl,\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayA12,\n  },\n  description: {\n    ...shorthands.margin(0),\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.grayA11,\n  },\n})\n\nexport type AlertDialogProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Root\n>\n\nexport type AlertDialogTriggerProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Trigger\n>\n\nexport type AlertDialogPortalProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Portal\n>\n\nexport type AlertDialogOverlayProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Overlay\n>\n\nexport type AlertDialogSize = \"xl\" | \"lg\" | \"md\" | \"sm\"\n\nexport type AlertDialogContentProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Content\n> & {\n  size?: AlertDialogSize\n}\n\nexport type AlertDialogHeaderProps = React.ComponentProps<\"div\">\nexport type AlertDialogFooterProps = React.ComponentProps<\"div\">\n\nexport type AlertDialogTitleProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Title\n>\n\nexport type AlertDialogDescriptionProps = React.ComponentProps<\n  typeof AlertDialogPrimitive.Description\n>\n\nexport type AlertDialogActionProps = Omit<\n  ButtonProps,\n  \"variant\" | \"size\" | \"destructive\"\n> & {\n  variant?: ButtonVariant\n  size?: ButtonSize\n  destructive?: boolean\n}\n\nexport type AlertDialogCancelProps = Omit<\n  ButtonProps,\n  \"variant\" | \"size\" | \"destructive\"\n> & {\n  variant?: ButtonVariant\n  size?: ButtonSize\n  destructive?: boolean\n}\n\nexport const AlertDialog = React.forwardRef<HTMLElement, AlertDialogProps>(\n  function AlertDialog(props, _ref) {\n    return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />\n  }\n)\n\nexport const AlertDialogTrigger = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Trigger>,\n  AlertDialogTriggerProps\n>(function AlertDialogTrigger({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <AlertDialogPrimitive.Trigger\n      ref={ref}\n      data-slot=\"alert-dialog-trigger\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-trigger\" }}\n      className={mergeClasses(\n        !props.asChild && styles.nativeTrigger,\n        className\n      )}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogPortal = React.forwardRef<\n  HTMLElement,\n  AlertDialogPortalProps\n>(function AlertDialogPortal(props, _ref) {\n  return (\n    <AlertDialogPrimitive.Portal\n      data-slot=\"alert-dialog-portal\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-portal\" }}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogOverlay = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Overlay>,\n  AlertDialogOverlayProps\n>(function AlertDialogOverlay({ className, ...props }, ref) {\n  const styles = useStyles()\n  // The overlay is portalled too, so it re-stamps the boundary's appearance like the content (#8).\n  const appearance = useAppearanceAttributes()\n\n  return (\n    <AlertDialogPrimitive.Overlay\n      ref={ref}\n      data-slot=\"alert-dialog-overlay\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-overlay\" }}\n      {...appearance}\n      className={mergeClasses(styles.overlay, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogContent = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Content>,\n  AlertDialogContentProps\n>(function AlertDialogContent(\n  { className, size = \"xl\", children, ...props },\n  ref\n) {\n  const styles = useStyles()\n  // DENSITY-SPEC.md §4.4 — portal content boundary; see dialog.tsx's identical comment.\n  const override = useDensity()\n  // SPEC.md §2 rule 3 — the same portal asymmetry, for the appearance pair: re-stamp the\n  // nearest explicit AppearanceBoundary's mode+surface, or neither attribute when there is\n  // none, leaving live shell inheritance in place.\n  const appearance = useAppearanceAttributes()\n\n  return (\n    <>\n      <AlertDialogOverlay />\n      <AlertDialogPrimitive.Content\n        ref={ref}\n        data-slot=\"alert-dialog-content\"\n        {...{ [SLOT_ATTR]: \"alert-dialog-content\" }}\n        {...(override !== undefined ? { \"data-density\": override } : {})}\n        {...appearance}\n        className={mergeClasses(styles.content, styles[size], className)}\n        {...props}\n      >\n        {children}\n      </AlertDialogPrimitive.Content>\n    </>\n  )\n})\n\nexport const AlertDialogHeader = React.forwardRef<\n  HTMLDivElement,\n  AlertDialogHeaderProps\n>(function AlertDialogHeader({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"alert-dialog-header\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-header\" }}\n      className={mergeClasses(styles.header, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogFooter = React.forwardRef<\n  HTMLDivElement,\n  AlertDialogFooterProps\n>(function AlertDialogFooter({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"alert-dialog-footer\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-footer\" }}\n      className={mergeClasses(styles.footer, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogTitle = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Title>,\n  AlertDialogTitleProps\n>(function AlertDialogTitle({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <AlertDialogPrimitive.Title\n      ref={ref}\n      data-slot=\"alert-dialog-title\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-title\" }}\n      className={mergeClasses(styles.title, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogDescription = React.forwardRef<\n  React.ElementRef<typeof AlertDialogPrimitive.Description>,\n  AlertDialogDescriptionProps\n>(function AlertDialogDescription({ className, ...props }, ref) {\n  const styles = useStyles()\n\n  return (\n    <AlertDialogPrimitive.Description\n      ref={ref}\n      data-slot=\"alert-dialog-description\"\n      {...{ [SLOT_ATTR]: \"alert-dialog-description\" }}\n      className={mergeClasses(styles.description, className)}\n      {...props}\n    />\n  )\n})\n\nexport const AlertDialogAction = React.forwardRef<\n  HTMLButtonElement,\n  AlertDialogActionProps\n>(function AlertDialogAction(\n  {\n    variant = \"primary\",\n    size = \"base\",\n    destructive = false,\n    className,\n    ...props\n  },\n  ref\n) {\n  return (\n    <AlertDialogPrimitive.Action asChild>\n      <Button\n        ref={ref}\n        data-slot=\"alert-dialog-action\"\n        {...{ [SLOT_ATTR]: \"alert-dialog-action\" }}\n        variant={variant}\n        size={size}\n        destructive={destructive}\n        className={className}\n        {...props}\n      />\n    </AlertDialogPrimitive.Action>\n  )\n})\n\nexport const AlertDialogCancel = React.forwardRef<\n  HTMLButtonElement,\n  AlertDialogCancelProps\n>(function AlertDialogCancel(\n  {\n    variant = \"secondary\",\n    size = \"base\",\n    destructive = false,\n    className,\n    ...props\n  },\n  ref\n) {\n  return (\n    <AlertDialogPrimitive.Cancel asChild>\n      <Button\n        ref={ref}\n        data-slot=\"alert-dialog-cancel\"\n        {...{ [SLOT_ATTR]: \"alert-dialog-cancel\" }}\n        variant={variant}\n        size={size}\n        destructive={destructive}\n        className={className}\n        {...props}\n      />\n    </AlertDialogPrimitive.Cancel>\n  )\n})\n"],"names":["useStyles","makeZenithStyles","nativeControl","OVERLAY_Z_INDEX","boxModel","tokens.body","shorthands","tokens.spacingGroup2","tokens.radiusXl","tokens.grayA1","tokens.containerSm","tokens.containerMd","tokens.containerLg","tokens.containerXl","tokens.spacingElement2","tokens.textXl","tokens.leadingXl","tokens.fontWeightSemibold","tokens.grayA12","tokens.textSm","tokens.leadingSm","tokens.grayA11","AlertDialog","React","props","_ref","AlertDialogPrimitive.Root","AlertDialogTrigger","className","ref","styles","jsx","AlertDialogPrimitive.Trigger","SLOT_ATTR","mergeClasses","AlertDialogPortal","AlertDialogPrimitive.Portal","AlertDialogOverlay","appearance","useAppearanceAttributes","AlertDialogPrimitive.Overlay","AlertDialogContent","size","children","override","useDensity","jsxs","Fragment","AlertDialogPrimitive.Content","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogPrimitive.Title","AlertDialogDescription","AlertDialogPrimitive.Description","AlertDialogAction","variant","destructive","AlertDialogPrimitive.Action","Button","AlertDialogCancel","AlertDialogPrimitive.Cancel"],"mappings":"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"}

package/dist/components/avatar/avatar-group.js

@@ -1,10 +1,11 @@
-import { jsx as o, jsxs as c } from "react/jsx-runtime";
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
 import * as a from "react";
-import { mergeClasses as g, SLOT_ATTR as m, shorthands as N } from "@epilot/zenith-runtime/v1";
-import { makeZenithStyles as S } from "../../styles/make-styles.js";
-import { grayA11 as I, leadingSm as E, textSm as L, spacingElement2 as w, spacingElement1 as P, radiusMd as k, body as C } from "../../tokens/index.js";
-import { AvatarGroupContext as z, Avatar as D } from "./avatar.js";
-const R = S({
+import { mergeClasses as g, SLOT_ATTR as m, shorthands as S } from "@epilot/zenith-runtime/v1";
+import { makeZenithStyles as I } from "../../styles/make-styles.js";
+import { boxModel as w } from "../../styles/host-reset.js";
+import { grayA11 as E, leadingSm as L, textSm as P, spacingElement2 as h, spacingElement1 as k, radiusMd as C, body as z } from "../../tokens/index.js";
+import { AvatarGroupContext as D, Avatar as R } from "./avatar.js";
+const T = I({
   root: {
     display: "flex",
     alignItems: "center"
@@ -27,54 +28,56 @@ const R = S({
     zIndex: 10
   },
   overflow: {
+    ...w,
     position: "relative",
     zIndex: 0,
-    ...N.border("0", "solid", "transparent"),
+    ...S.border("0", "solid", "transparent"),
     cursor: "pointer"
   },
   overflowPanel: {
+    ...w,
     position: "absolute",
     top: "100%",
     left: "0",
     zIndex: 20,
     width: "max-content",
     maxWidth: "20rem",
-    padding: w,
-    backgroundColor: C,
-    borderRadius: k,
+    padding: h,
+    backgroundColor: z,
+    borderRadius: C,
     boxShadow: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)"
   },
   overflowList: {
     display: "flex",
     flexDirection: "column",
-    gap: P
+    gap: k
   },
   overflowItem: {
     display: "flex",
     alignItems: "center",
-    gap: w
+    gap: h
   },
   overflowName: {
     overflow: "hidden",
     textOverflow: "ellipsis",
     whiteSpace: "nowrap",
-    fontSize: L,
-    lineHeight: E,
-    color: I
+    fontSize: P,
+    lineHeight: L,
+    color: E
   }
-}), V = a.forwardRef(
-  function({ max: f, size: v, className: h, children: A, ...b }, y) {
-    const r = R(), n = a.Children.toArray(A).filter(a.isValidElement), d = typeof f == "number" ? n.slice(0, f) : n, p = n.length - d.length, [l, s] = a.useState(null), [x, u] = a.useState(!1);
-    return /* @__PURE__ */ o(z.Provider, { value: { size: v }, children: /* @__PURE__ */ c(
+}), X = a.forwardRef(
+  function({ max: f, size: v, className: b, children: A, ...x }, y) {
+    const o = T(), n = a.Children.toArray(A).filter(a.isValidElement), d = typeof f == "number" ? n.slice(0, f) : n, p = n.length - d.length, [l, s] = a.useState(null), [N, u] = a.useState(!1);
+    return /* @__PURE__ */ r(D.Provider, { value: { size: v }, children: /* @__PURE__ */ c(
       "div",
       {
         ref: y,
         "data-slot": "avatar-group",
         [m]: "avatar-group",
-        className: g(r.root, h),
-        ...b,
+        className: g(o.root, b),
+        ...x,
         children: [
-          d.map((e, t) => /* @__PURE__ */ o(
+          d.map((e, t) => /* @__PURE__ */ r(
             "div",
             {
               "data-slot": "avatar-group-item",
@@ -84,10 +87,10 @@ const R = S({
               onFocus: () => s(t),
               onBlur: () => s((i) => i === t ? null : i),
               className: g(
-                r.item,
-                l !== null && t < l && r.itemBeforeActive,
-                l !== null && t > l && r.itemAfterActive,
-                l === t && r.itemActive
+                o.item,
+                l !== null && t < l && o.itemBeforeActive,
+                l !== null && t > l && o.itemAfterActive,
+                l === t && o.itemActive
               ),
               children: e
             },
@@ -98,10 +101,10 @@ const R = S({
             {
               "data-slot": "avatar-group-overflow-wrapper",
               [m]: "avatar-group-overflow-wrapper",
-              className: r.item,
+              className: o.item,
               children: [
-                /* @__PURE__ */ o(
-                  D,
+                /* @__PURE__ */ r(
+                  R,
                   {
                     size: v,
                     color: "gray",
@@ -113,18 +116,18 @@ const R = S({
                     onKeyDown: (e) => {
                       (e.key === "Enter" || e.key === " ") && (e.preventDefault(), u((t) => !t));
                     },
-                    className: r.overflow
+                    className: o.overflow
                   }
                 ),
-                x && /* @__PURE__ */ o(
+                N && /* @__PURE__ */ r(
                   "div",
                   {
                     "data-slot": "avatar-group-overflow",
                     [m]: "avatar-group-overflow",
-                    className: r.overflowPanel,
-                    children: /* @__PURE__ */ o("ul", { className: r.overflowList, children: n.map((e, t) => /* @__PURE__ */ c("li", { className: r.overflowItem, children: [
+                    className: o.overflowPanel,
+                    children: /* @__PURE__ */ r("ul", { className: o.overflowList, children: n.map((e, t) => /* @__PURE__ */ c("li", { className: o.overflowItem, children: [
                       e,
-                      a.isValidElement(e) && e.props.alt && /* @__PURE__ */ o("span", { className: r.overflowName, children: e.props.alt })
+                      a.isValidElement(e) && e.props.alt && /* @__PURE__ */ r("span", { className: o.overflowName, children: e.props.alt })
                     ] }, t)) })
                   }
                 )
@@ -137,6 +140,6 @@ const R = S({
   }
 );
 export {
-  V as AvatarGroup
+  X as AvatarGroup
 };
 //# sourceMappingURL=avatar-group.js.map

package/dist/components/avatar/avatar-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar-group.js","sources":["../../../src/components/avatar/avatar-group.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport {\n  Avatar,\n  AvatarGroupContext,\n  type AvatarColor,\n  type AvatarSize,\n} from \"./avatar\"\n\nconst useStyles = makeZenithStyles({\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  item: {\n    position: \"relative\",\n    marginLeft: \"-0.5rem\",\n    transitionProperty: \"transform\",\n    transitionDuration: \"200ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    \":first-child\": { marginLeft: \"0\" },\n  },\n  itemBeforeActive: {\n    transform: \"translateX(-0.75rem)\",\n  },\n  itemAfterActive: {\n    transform: \"translateX(0.75rem)\",\n  },\n  itemActive: {\n    zIndex: 10,\n  },\n  overflow: {\n    position: \"relative\",\n    zIndex: 0,\n    ...shorthands.border(\"0\", \"solid\", \"transparent\"),\n    cursor: \"pointer\",\n  },\n  overflowPanel: {\n    position: \"absolute\",\n    top: \"100%\",\n    left: \"0\",\n    zIndex: 20,\n    width: \"max-content\",\n    maxWidth: \"20rem\",\n    padding: tokens.spacingElement2,\n    backgroundColor: tokens.body,\n    borderRadius: tokens.radiusMd,\n    boxShadow: \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n  },\n  overflowList: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: tokens.spacingElement1,\n  },\n  overflowItem: {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: tokens.spacingElement2,\n  },\n  overflowName: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.grayA11,\n  },\n})\n\nexport type AvatarGroupProps = Omit<React.ComponentProps<\"div\">, \"color\"> & {\n  max?: number\n  size?: AvatarSize\n}\n\nexport const AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n  function AvatarGroup({ max, size, className, children, ...props }, ref) {\n    const styles = useStyles()\n    const items = React.Children.toArray(children).filter(React.isValidElement)\n    const visible = typeof max === \"number\" ? items.slice(0, max) : items\n    const overflow = items.length - visible.length\n    const [active, setActive] = React.useState<number | null>(null)\n    const [open, setOpen] = React.useState(false)\n\n    return (\n      <AvatarGroupContext.Provider value={{ size }}>\n        <div\n          ref={ref}\n          data-slot=\"avatar-group\"\n          {...{ [SLOT_ATTR]: \"avatar-group\" }}\n          className={mergeClasses(styles.root, className)}\n          {...props}\n        >\n          {visible.map((child, index) => (\n            <div\n              key={index}\n              data-slot=\"avatar-group-item\"\n              {...{ [SLOT_ATTR]: \"avatar-group-item\" }}\n              onPointerEnter={() => setActive(index)}\n              onPointerLeave={() =>\n                setActive((current) => (current === index ? null : current))\n              }\n              onFocus={() => setActive(index)}\n              onBlur={() =>\n                setActive((current) => (current === index ? null : current))\n              }\n              className={mergeClasses(\n                styles.item,\n                active !== null && index < active && styles.itemBeforeActive,\n                active !== null && index > active && styles.itemAfterActive,\n                active === index && styles.itemActive\n              )}\n            >\n              {child}\n            </div>\n          ))}\n          {overflow > 0 && (\n            <div\n              data-slot=\"avatar-group-overflow-wrapper\"\n              {...{ [SLOT_ATTR]: \"avatar-group-overflow-wrapper\" }}\n              className={styles.item}\n            >\n              <Avatar\n                size={size}\n                color={\"gray\" as AvatarColor}\n                initials={`+${overflow}`}\n                aria-label={`${overflow} more`}\n                role=\"button\"\n                tabIndex={0}\n                onClick={() => setOpen((current) => !current)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault()\n                    setOpen((current) => !current)\n                  }\n                }}\n                className={styles.overflow}\n              />\n              {open && (\n                <div\n                  data-slot=\"avatar-group-overflow\"\n                  {...{ [SLOT_ATTR]: \"avatar-group-overflow\" }}\n                  className={styles.overflowPanel}\n                >\n                  <ul className={styles.overflowList}>\n                    {items.map((item, index) => (\n                      <li key={index} className={styles.overflowItem}>\n                        {item}\n                        {React.isValidElement<{ alt?: string }>(item) &&\n                          item.props.alt && (\n                            <span className={styles.overflowName}>\n                              {item.props.alt}\n                            </span>\n                          )}\n                      </li>\n                    ))}\n                  </ul>\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </AvatarGroupContext.Provider>\n    )\n  }\n)\n"],"names":["useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.body","tokens.radiusMd","tokens.spacingElement1","tokens.textSm","tokens.leadingSm","tokens.grayA11","AvatarGroup","React","max","size","className","children","props","ref","styles","items","visible","overflow","active","setActive","open","setOpen","AvatarGroupContext","jsxs","SLOT_ATTR","mergeClasses","child","index","jsx","current","Avatar","event","item"],"mappings":"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"}
+{"version":3,"file":"avatar-group.js","sources":["../../../src/components/avatar/avatar-group.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport {\n  Avatar,\n  AvatarGroupContext,\n  type AvatarColor,\n  type AvatarSize,\n} from \"./avatar\"\n\nconst useStyles = makeZenithStyles({\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  item: {\n    position: \"relative\",\n    marginLeft: \"-0.5rem\",\n    transitionProperty: \"transform\",\n    transitionDuration: \"200ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    \":first-child\": { marginLeft: \"0\" },\n  },\n  itemBeforeActive: {\n    transform: \"translateX(-0.75rem)\",\n  },\n  itemAfterActive: {\n    transform: \"translateX(0.75rem)\",\n  },\n  itemActive: {\n    zIndex: 10,\n  },\n  overflow: {\n    ...boxModel,\n    position: \"relative\",\n    zIndex: 0,\n    ...shorthands.border(\"0\", \"solid\", \"transparent\"),\n    cursor: \"pointer\",\n  },\n  overflowPanel: {\n    ...boxModel,\n    position: \"absolute\",\n    top: \"100%\",\n    left: \"0\",\n    zIndex: 20,\n    width: \"max-content\",\n    maxWidth: \"20rem\",\n    padding: tokens.spacingElement2,\n    backgroundColor: tokens.body,\n    borderRadius: tokens.radiusMd,\n    boxShadow: \"0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)\",\n  },\n  overflowList: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: tokens.spacingElement1,\n  },\n  overflowItem: {\n    display: \"flex\",\n    alignItems: \"center\",\n    gap: tokens.spacingElement2,\n  },\n  overflowName: {\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n    color: tokens.grayA11,\n  },\n})\n\nexport type AvatarGroupProps = Omit<React.ComponentProps<\"div\">, \"color\"> & {\n  max?: number\n  size?: AvatarSize\n}\n\nexport const AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n  function AvatarGroup({ max, size, className, children, ...props }, ref) {\n    const styles = useStyles()\n    const items = React.Children.toArray(children).filter(React.isValidElement)\n    const visible = typeof max === \"number\" ? items.slice(0, max) : items\n    const overflow = items.length - visible.length\n    const [active, setActive] = React.useState<number | null>(null)\n    const [open, setOpen] = React.useState(false)\n\n    return (\n      <AvatarGroupContext.Provider value={{ size }}>\n        <div\n          ref={ref}\n          data-slot=\"avatar-group\"\n          {...{ [SLOT_ATTR]: \"avatar-group\" }}\n          className={mergeClasses(styles.root, className)}\n          {...props}\n        >\n          {visible.map((child, index) => (\n            <div\n              key={index}\n              data-slot=\"avatar-group-item\"\n              {...{ [SLOT_ATTR]: \"avatar-group-item\" }}\n              onPointerEnter={() => setActive(index)}\n              onPointerLeave={() =>\n                setActive((current) => (current === index ? null : current))\n              }\n              onFocus={() => setActive(index)}\n              onBlur={() =>\n                setActive((current) => (current === index ? null : current))\n              }\n              className={mergeClasses(\n                styles.item,\n                active !== null && index < active && styles.itemBeforeActive,\n                active !== null && index > active && styles.itemAfterActive,\n                active === index && styles.itemActive\n              )}\n            >\n              {child}\n            </div>\n          ))}\n          {overflow > 0 && (\n            <div\n              data-slot=\"avatar-group-overflow-wrapper\"\n              {...{ [SLOT_ATTR]: \"avatar-group-overflow-wrapper\" }}\n              className={styles.item}\n            >\n              <Avatar\n                size={size}\n                color={\"gray\" as AvatarColor}\n                initials={`+${overflow}`}\n                aria-label={`${overflow} more`}\n                role=\"button\"\n                tabIndex={0}\n                onClick={() => setOpen((current) => !current)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault()\n                    setOpen((current) => !current)\n                  }\n                }}\n                className={styles.overflow}\n              />\n              {open && (\n                <div\n                  data-slot=\"avatar-group-overflow\"\n                  {...{ [SLOT_ATTR]: \"avatar-group-overflow\" }}\n                  className={styles.overflowPanel}\n                >\n                  <ul className={styles.overflowList}>\n                    {items.map((item, index) => (\n                      <li key={index} className={styles.overflowItem}>\n                        {item}\n                        {React.isValidElement<{ alt?: string }>(item) &&\n                          item.props.alt && (\n                            <span className={styles.overflowName}>\n                              {item.props.alt}\n                            </span>\n                          )}\n                      </li>\n                    ))}\n                  </ul>\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </AvatarGroupContext.Provider>\n    )\n  }\n)\n"],"names":["useStyles","makeZenithStyles","boxModel","shorthands","tokens.spacingElement2","tokens.body","tokens.radiusMd","tokens.spacingElement1","tokens.textSm","tokens.leadingSm","tokens.grayA11","AvatarGroup","React","max","size","className","children","props","ref","styles","items","visible","overflow","active","setActive","open","setOpen","AvatarGroupContext","jsxs","SLOT_ATTR","mergeClasses","child","index","jsx","current","Avatar","event","item"],"mappings":"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"}

package/dist/components/avatar/avatar.js

@@ -1,11 +1,12 @@
-import { jsxs as k, jsx as s } from "react/jsx-runtime";
-import * as i from "react";
-import { Root as p, Image as y, Fallback as A } from "../../vendor/.bun/@radix-ui_react-avatar@1.1.10_2b23df507bdda662/vendor/@radix-ui/react-avatar/dist/index.js";
-import { SLOT_ATTR as n, mergeClasses as x } from "@epilot/zenith-runtime/v1";
-import { makeZenithStyles as S } from "../../styles/make-styles.js";
-import { useZenithPaletteTokensFor as w } from "../../tokens/use-palette-tokens.js";
-import { indigoA12 as C, indigo3 as z, purpleA12 as R, purple3 as T, pinkA12 as j, pink3 as F, redA12 as O, red3 as H, bronzeA12 as I, bronze3 as N, orangeA12 as X, orange3 as B, yellowA12 as L, yellow3 as W, limeA12 as Z, lime3 as _, greenA12 as G, green3 as M, mintA12 as P, mint3 as U, tealA12 as V, teal3 as Y, cyanA12 as q, cyan3 as D, skyA12 as E, sky3 as J, blueA12 as K, blue3 as Q, grayA12 as $, gray3 as aa, leadingBase as ra, textBase as ea, leadingSm as ta, textSm as oa, leadingXs as na, textXs as ia, fontWeightMedium as la } from "../../tokens/index.js";
-const c = [
+import { jsxs as p, jsx as c } from "react/jsx-runtime";
+import * as l from "react";
+import { Root as y, Image as A, Fallback as x } from "../../vendor/.bun/@radix-ui_react-avatar@1.1.10_2b23df507bdda662/vendor/@radix-ui/react-avatar/dist/index.js";
+import { SLOT_ATTR as i, mergeClasses as S } from "@epilot/zenith-runtime/v1";
+import { makeZenithStyles as w } from "../../styles/make-styles.js";
+import { boxModel as a } from "../../styles/host-reset.js";
+import { useZenithPaletteTokensFor as C } from "../../tokens/use-palette-tokens.js";
+import { indigoA12 as z, indigo3 as R, purpleA12 as T, purple3 as j, pinkA12 as F, pink3 as O, redA12 as H, red3 as I, bronzeA12 as N, bronze3 as X, orangeA12 as B, orange3 as L, yellowA12 as M, yellow3 as W, limeA12 as Z, lime3 as _, greenA12 as G, green3 as P, mintA12 as U, mint3 as V, tealA12 as Y, teal3 as q, cyanA12 as D, cyan3 as E, skyA12 as J, sky3 as K, blueA12 as Q, blue3 as $, grayA12 as aa, gray3 as ra, leadingBase as ea, textBase as ta, leadingSm as oa, textSm as na, leadingXs as ia, textXs as la, fontWeightMedium as ga } from "../../tokens/index.js";
+const u = [
   "blue",
   "sky",
   "cyan",
@@ -18,38 +19,38 @@ const c = [
   "pink",
   "purple",
   "indigo"
-], ga = (t) => {
-  let a = 0;
-  for (let r = 0; r < t.length; r++)
-    a = a * 31 + t.charCodeAt(r) >>> 0;
-  return c[a % c.length];
-}, da = {
+], da = (o) => {
+  let r = 0;
+  for (let e = 0; e < o.length; e++)
+    r = r * 31 + o.charCodeAt(e) >>> 0;
+  return u[r % u.length];
+}, sa = {
   gray: {
-    "--avatar-background": aa,
-    "--avatar-foreground": $
+    "--avatar-background": ra,
+    "--avatar-foreground": aa
   },
   blue: {
-    "--avatar-background": Q,
-    "--avatar-foreground": K
+    "--avatar-background": $,
+    "--avatar-foreground": Q
   },
   sky: {
-    "--avatar-background": J,
-    "--avatar-foreground": E
+    "--avatar-background": K,
+    "--avatar-foreground": J
   },
   cyan: {
-    "--avatar-background": D,
-    "--avatar-foreground": q
+    "--avatar-background": E,
+    "--avatar-foreground": D
   },
   teal: {
-    "--avatar-background": Y,
-    "--avatar-foreground": V
+    "--avatar-background": q,
+    "--avatar-foreground": Y
   },
   mint: {
-    "--avatar-background": U,
-    "--avatar-foreground": P
+    "--avatar-background": V,
+    "--avatar-foreground": U
   },
   green: {
-    "--avatar-background": M,
+    "--avatar-background": P,
     "--avatar-foreground": G
   },
   lime: {
@@ -58,36 +59,37 @@ const c = [
   },
   yellow: {
     "--avatar-background": W,
-    "--avatar-foreground": L
+    "--avatar-foreground": M
   },
   orange: {
-    "--avatar-background": B,
-    "--avatar-foreground": X
+    "--avatar-background": L,
+    "--avatar-foreground": B
   },
   bronze: {
-    "--avatar-background": N,
-    "--avatar-foreground": I
+    "--avatar-background": X,
+    "--avatar-foreground": N
   },
   red: {
-    "--avatar-background": H,
-    "--avatar-foreground": O
+    "--avatar-background": I,
+    "--avatar-foreground": H
   },
   pink: {
-    "--avatar-background": F,
-    "--avatar-foreground": j
+    "--avatar-background": O,
+    "--avatar-foreground": F
   },
   purple: {
-    "--avatar-background": T,
-    "--avatar-foreground": R
+    "--avatar-background": j,
+    "--avatar-foreground": T
   },
   indigo: {
-    "--avatar-background": z,
-    "--avatar-foreground": C
+    "--avatar-background": R,
+    "--avatar-foreground": z
   }
-}, sa = i.createContext(
+}, ca = l.createContext(
   null
-), ca = S({
+), ua = w({
   root: {
+    ...a,
     position: "relative",
     display: "inline-flex",
     alignItems: "center",
@@ -98,69 +100,74 @@ const c = [
     borderRadius: "9999px",
     backgroundColor: "var(--avatar-background)",
     color: "var(--avatar-foreground)",
-    fontWeight: la,
+    fontWeight: ga,
     textTransform: "uppercase"
   },
   sm: {
+    ...a,
     width: "1.5rem",
     height: "1.5rem",
-    fontSize: ia,
-    lineHeight: na
+    fontSize: la,
+    lineHeight: ia
   },
   base: {
+    ...a,
     width: "2rem",
     height: "2rem",
-    fontSize: oa,
-    lineHeight: ta
+    fontSize: na,
+    lineHeight: oa
   },
   lg: {
+    ...a,
     width: "2.5rem",
     height: "2.5rem",
-    fontSize: ea,
-    lineHeight: ra
+    fontSize: ta,
+    lineHeight: ea
   },
   image: {
+    ...a,
     width: "100%",
     height: "100%",
     objectFit: "cover"
   },
   fallback: {
+    ...a,
     display: "inline-flex",
     alignItems: "center",
     justifyContent: "center",
     width: "100%",
     height: "100%"
   }
-}), ka = i.forwardRef(function({ className: a, src: r, alt: l, initials: g, color: u, size: v, style: m, ...f }, b) {
-  const e = ca(), o = i.useContext(sa), h = v ?? (o == null ? void 0 : o.size) ?? "base", d = u ?? ga(l ?? g ?? "");
-  return w(d), /* @__PURE__ */ k(
-    p,
+}), ya = l.forwardRef(function({ className: r, src: e, alt: g, initials: d, color: v, size: m, style: f, ...b }, h) {
+  const t = ua(), n = l.useContext(ca), k = m ?? (n == null ? void 0 : n.size) ?? "base", s = v ?? da(g ?? d ?? "");
+  return C(s), /* @__PURE__ */ p(
+    y,
     {
-      ref: b,
+      ref: h,
       "data-slot": "avatar",
-      [n]: "avatar",
-      className: x(e.root, e[h], a),
-      style: { ...da[d], ...m },
-      ...f,
+      [i]: "avatar",
+      className: S(t.root, t[k], r),
+      style: { ...sa[s], ...f },
+      ...b,
       children: [
-        /* @__PURE__ */ s(
-          y,
+        /* @__PURE__ */ c(
+          A,
           {
             "data-slot": "avatar-image",
-            [n]: "avatar-image",
-            src: r,
-            alt: l,
-            className: e.image
+            [i]: "avatar-image",
+            src: e,
+            alt: g,
+            className: t.image
           }
         ),
-        /* @__PURE__ */ s(
-          A,
+        /* @__PURE__ */ c(
+          x,
           {
             "data-slot": "avatar-fallback",
-            [n]: "avatar-fallback",
-            className: e.fallback,
+            [i]: "avatar-fallback",
+            className: t.fallback,
             "aria-hidden": "true",
-            children: g
+            children: d
           }
         )
       ]
@@ -168,7 +175,7 @@ const c = [
   );
 });
 export {
-  ka as Avatar,
-  sa as AvatarGroupContext
+  ya as Avatar,
+  ca as AvatarGroupContext
 };
 //# sourceMappingURL=avatar.js.map

package/dist/components/avatar/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","sources":["../../../src/components/avatar/avatar.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as AvatarPrimitive from \"@radix-ui/react-avatar\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { useZenithPaletteTokensFor } from \"../../tokens/use-palette-tokens\"\nimport * as tokens from \"../../tokens\"\n\nexport type AvatarColor =\n  | \"gray\"\n  | \"blue\"\n  | \"sky\"\n  | \"cyan\"\n  | \"teal\"\n  | \"mint\"\n  | \"green\"\n  | \"lime\"\n  | \"yellow\"\n  | \"orange\"\n  | \"bronze\"\n  | \"red\"\n  | \"pink\"\n  | \"purple\"\n  | \"indigo\"\nexport type AvatarSize = \"sm\" | \"base\" | \"lg\"\n\nconst AUTO_COLORS: AvatarColor[] = [\n  \"blue\",\n  \"sky\",\n  \"cyan\",\n  \"teal\",\n  \"mint\",\n  \"green\",\n  \"lime\",\n  \"orange\",\n  \"bronze\",\n  \"pink\",\n  \"purple\",\n  \"indigo\",\n]\n\nconst colorForSeed = (seed: string): AvatarColor => {\n  let hash = 0\n  for (let i = 0; i < seed.length; i++) {\n    hash = (hash * 31 + seed.charCodeAt(i)) >>> 0\n  }\n  return AUTO_COLORS[hash % AUTO_COLORS.length]\n}\n\nconst colorVars: Record<AvatarColor, React.CSSProperties> = {\n  gray: {\n    \"--avatar-background\": tokens.gray3,\n    \"--avatar-foreground\": tokens.grayA12,\n  } as React.CSSProperties,\n  blue: {\n    \"--avatar-background\": tokens.blue3,\n    \"--avatar-foreground\": tokens.blueA12,\n  } as React.CSSProperties,\n  sky: {\n    \"--avatar-background\": tokens.sky3,\n    \"--avatar-foreground\": tokens.skyA12,\n  } as React.CSSProperties,\n  cyan: {\n    \"--avatar-background\": tokens.cyan3,\n    \"--avatar-foreground\": tokens.cyanA12,\n  } as React.CSSProperties,\n  teal: {\n    \"--avatar-background\": tokens.teal3,\n    \"--avatar-foreground\": tokens.tealA12,\n  } as React.CSSProperties,\n  mint: {\n    \"--avatar-background\": tokens.mint3,\n    \"--avatar-foreground\": tokens.mintA12,\n  } as React.CSSProperties,\n  green: {\n    \"--avatar-background\": tokens.green3,\n    \"--avatar-foreground\": tokens.greenA12,\n  } as React.CSSProperties,\n  lime: {\n    \"--avatar-background\": tokens.lime3,\n    \"--avatar-foreground\": tokens.limeA12,\n  } as React.CSSProperties,\n  yellow: {\n    \"--avatar-background\": tokens.yellow3,\n    \"--avatar-foreground\": tokens.yellowA12,\n  } as React.CSSProperties,\n  orange: {\n    \"--avatar-background\": tokens.orange3,\n    \"--avatar-foreground\": tokens.orangeA12,\n  } as React.CSSProperties,\n  bronze: {\n    \"--avatar-background\": tokens.bronze3,\n    \"--avatar-foreground\": tokens.bronzeA12,\n  } as React.CSSProperties,\n  red: {\n    \"--avatar-background\": tokens.red3,\n    \"--avatar-foreground\": tokens.redA12,\n  } as React.CSSProperties,\n  pink: {\n    \"--avatar-background\": tokens.pink3,\n    \"--avatar-foreground\": tokens.pinkA12,\n  } as React.CSSProperties,\n  purple: {\n    \"--avatar-background\": tokens.purple3,\n    \"--avatar-foreground\": tokens.purpleA12,\n  } as React.CSSProperties,\n  indigo: {\n    \"--avatar-background\": tokens.indigo3,\n    \"--avatar-foreground\": tokens.indigoA12,\n  } as React.CSSProperties,\n}\n\nconst AvatarGroupContext = React.createContext<{ size?: AvatarSize } | null>(\n  null\n)\n\nconst useStyles = makeZenithStyles({\n  root: {\n    position: \"relative\",\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    flexShrink: 0,\n    overflowX: \"hidden\",\n    overflowY: \"hidden\",\n    borderRadius: \"9999px\",\n    backgroundColor: \"var(--avatar-background)\",\n    color: \"var(--avatar-foreground)\",\n    fontWeight: tokens.fontWeightMedium,\n    textTransform: \"uppercase\",\n  },\n  sm: {\n    width: \"1.5rem\",\n    height: \"1.5rem\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n  },\n  base: {\n    width: \"2rem\",\n    height: \"2rem\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n  },\n  lg: {\n    width: \"2.5rem\",\n    height: \"2.5rem\",\n    fontSize: tokens.textBase,\n    lineHeight: tokens.leadingBase,\n  },\n  image: {\n    width: \"100%\",\n    height: \"100%\",\n    objectFit: \"cover\",\n  },\n  fallback: {\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    width: \"100%\",\n    height: \"100%\",\n  },\n})\n\nexport type AvatarProps = Omit<\n  React.ComponentProps<typeof AvatarPrimitive.Root>,\n  \"className\" | \"color\" | \"children\"\n> & {\n  className?: string\n  src?: string\n  /** Accessible name for the image, and the seed for the automatic colour. */\n  alt?: string\n  /** Shown when no `src` loads. Also seeds the automatic colour when `alt` is absent. */\n  initials?: string\n  /**\n   * Leave this unset and the colour is derived by hashing `alt`, falling back to\n   * `initials` — so the same person keeps the same colour everywhere, and two\n   * people rarely collide. Set it only to override that.\n   */\n  color?: AvatarColor\n  /** @default \"base\" */\n  size?: AvatarSize\n}\n\nexport const Avatar = React.forwardRef<\n  React.ComponentRef<typeof AvatarPrimitive.Root>,\n  AvatarProps\n>(function Avatar(\n  { className, src, alt, initials, color, size, style, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const group = React.useContext(AvatarGroupContext)\n  const resolvedSize = size ?? group?.size ?? \"base\"\n  const resolvedColor = color ?? colorForSeed(alt ?? initials ?? \"\")\n\n  // Was a module-scope call, so merely IMPORTING Avatar installed 63 kB of palette CSS whether one\n  // ever rendered. Now it is per-instance and keyed on the resolved family, installed at commit\n  // time (WP2B2) via a hook called unconditionally every render. Every auto colour is decorative,\n  // so a seeded avatar still installs the sheet; an explicit `color=\"gray\"` no longer does, and\n  // neither does an import that never renders.\n  useZenithPaletteTokensFor(resolvedColor)\n\n  return (\n    <AvatarPrimitive.Root\n      ref={ref}\n      data-slot=\"avatar\"\n      {...{ [SLOT_ATTR]: \"avatar\" }}\n      className={mergeClasses(styles.root, styles[resolvedSize], className)}\n      style={{ ...colorVars[resolvedColor], ...style }}\n      {...props}\n    >\n      <AvatarPrimitive.Image\n        data-slot=\"avatar-image\"\n        {...{ [SLOT_ATTR]: \"avatar-image\" }}\n        src={src}\n        alt={alt}\n        className={styles.image}\n      />\n      <AvatarPrimitive.Fallback\n        data-slot=\"avatar-fallback\"\n        {...{ [SLOT_ATTR]: \"avatar-fallback\" }}\n        className={styles.fallback}\n        aria-hidden=\"true\"\n      >\n        {initials}\n      </AvatarPrimitive.Fallback>\n    </AvatarPrimitive.Root>\n  )\n})\n\nexport { AvatarGroupContext }\n"],"names":["AUTO_COLORS","colorForSeed","seed","hash","i","colorVars","tokens.gray3","tokens.grayA12","tokens.blue3","tokens.blueA12","tokens.sky3","tokens.skyA12","tokens.cyan3","tokens.cyanA12","tokens.teal3","tokens.tealA12","tokens.mint3","tokens.mintA12","tokens.green3","tokens.greenA12","tokens.lime3","tokens.limeA12","tokens.yellow3","tokens.yellowA12","tokens.orange3","tokens.orangeA12","tokens.bronze3","tokens.bronzeA12","tokens.red3","tokens.redA12","tokens.pink3","tokens.pinkA12","tokens.purple3","tokens.purpleA12","tokens.indigo3","tokens.indigoA12","AvatarGroupContext","React","useStyles","makeZenithStyles","tokens.fontWeightMedium","tokens.textXs","tokens.leadingXs","tokens.textSm","tokens.leadingSm","tokens.textBase","tokens.leadingBase","Avatar","className","src","alt","initials","color","size","style","props","ref","styles","group","resolvedSize","resolvedColor","useZenithPaletteTokensFor","jsxs","AvatarPrimitive.Root","SLOT_ATTR","mergeClasses","jsx","AvatarPrimitive.Image","AvatarPrimitive.Fallback"],"mappings":"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"}
+{"version":3,"file":"avatar.js","sources":["../../../src/components/avatar/avatar.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as AvatarPrimitive from \"@radix-ui/react-avatar\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport { useZenithPaletteTokensFor } from \"../../tokens/use-palette-tokens\"\nimport * as tokens from \"../../tokens\"\n\nexport type AvatarColor =\n  | \"gray\"\n  | \"blue\"\n  | \"sky\"\n  | \"cyan\"\n  | \"teal\"\n  | \"mint\"\n  | \"green\"\n  | \"lime\"\n  | \"yellow\"\n  | \"orange\"\n  | \"bronze\"\n  | \"red\"\n  | \"pink\"\n  | \"purple\"\n  | \"indigo\"\nexport type AvatarSize = \"sm\" | \"base\" | \"lg\"\n\nconst AUTO_COLORS: AvatarColor[] = [\n  \"blue\",\n  \"sky\",\n  \"cyan\",\n  \"teal\",\n  \"mint\",\n  \"green\",\n  \"lime\",\n  \"orange\",\n  \"bronze\",\n  \"pink\",\n  \"purple\",\n  \"indigo\",\n]\n\nconst colorForSeed = (seed: string): AvatarColor => {\n  let hash = 0\n  for (let i = 0; i < seed.length; i++) {\n    hash = (hash * 31 + seed.charCodeAt(i)) >>> 0\n  }\n  return AUTO_COLORS[hash % AUTO_COLORS.length]\n}\n\nconst colorVars: Record<AvatarColor, React.CSSProperties> = {\n  gray: {\n    \"--avatar-background\": tokens.gray3,\n    \"--avatar-foreground\": tokens.grayA12,\n  } as React.CSSProperties,\n  blue: {\n    \"--avatar-background\": tokens.blue3,\n    \"--avatar-foreground\": tokens.blueA12,\n  } as React.CSSProperties,\n  sky: {\n    \"--avatar-background\": tokens.sky3,\n    \"--avatar-foreground\": tokens.skyA12,\n  } as React.CSSProperties,\n  cyan: {\n    \"--avatar-background\": tokens.cyan3,\n    \"--avatar-foreground\": tokens.cyanA12,\n  } as React.CSSProperties,\n  teal: {\n    \"--avatar-background\": tokens.teal3,\n    \"--avatar-foreground\": tokens.tealA12,\n  } as React.CSSProperties,\n  mint: {\n    \"--avatar-background\": tokens.mint3,\n    \"--avatar-foreground\": tokens.mintA12,\n  } as React.CSSProperties,\n  green: {\n    \"--avatar-background\": tokens.green3,\n    \"--avatar-foreground\": tokens.greenA12,\n  } as React.CSSProperties,\n  lime: {\n    \"--avatar-background\": tokens.lime3,\n    \"--avatar-foreground\": tokens.limeA12,\n  } as React.CSSProperties,\n  yellow: {\n    \"--avatar-background\": tokens.yellow3,\n    \"--avatar-foreground\": tokens.yellowA12,\n  } as React.CSSProperties,\n  orange: {\n    \"--avatar-background\": tokens.orange3,\n    \"--avatar-foreground\": tokens.orangeA12,\n  } as React.CSSProperties,\n  bronze: {\n    \"--avatar-background\": tokens.bronze3,\n    \"--avatar-foreground\": tokens.bronzeA12,\n  } as React.CSSProperties,\n  red: {\n    \"--avatar-background\": tokens.red3,\n    \"--avatar-foreground\": tokens.redA12,\n  } as React.CSSProperties,\n  pink: {\n    \"--avatar-background\": tokens.pink3,\n    \"--avatar-foreground\": tokens.pinkA12,\n  } as React.CSSProperties,\n  purple: {\n    \"--avatar-background\": tokens.purple3,\n    \"--avatar-foreground\": tokens.purpleA12,\n  } as React.CSSProperties,\n  indigo: {\n    \"--avatar-background\": tokens.indigo3,\n    \"--avatar-foreground\": tokens.indigoA12,\n  } as React.CSSProperties,\n}\n\nconst AvatarGroupContext = React.createContext<{ size?: AvatarSize } | null>(\n  null\n)\n\nconst useStyles = makeZenithStyles({\n  root: {\n    ...boxModel,\n    position: \"relative\",\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    flexShrink: 0,\n    overflowX: \"hidden\",\n    overflowY: \"hidden\",\n    borderRadius: \"9999px\",\n    backgroundColor: \"var(--avatar-background)\",\n    color: \"var(--avatar-foreground)\",\n    fontWeight: tokens.fontWeightMedium,\n    textTransform: \"uppercase\",\n  },\n  sm: {\n    ...boxModel,\n    width: \"1.5rem\",\n    height: \"1.5rem\",\n    fontSize: tokens.textXs,\n    lineHeight: tokens.leadingXs,\n  },\n  base: {\n    ...boxModel,\n    width: \"2rem\",\n    height: \"2rem\",\n    fontSize: tokens.textSm,\n    lineHeight: tokens.leadingSm,\n  },\n  lg: {\n    ...boxModel,\n    width: \"2.5rem\",\n    height: \"2.5rem\",\n    fontSize: tokens.textBase,\n    lineHeight: tokens.leadingBase,\n  },\n  image: {\n    ...boxModel,\n    width: \"100%\",\n    height: \"100%\",\n    objectFit: \"cover\",\n  },\n  fallback: {\n    ...boxModel,\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n    width: \"100%\",\n    height: \"100%\",\n  },\n})\n\nexport type AvatarProps = Omit<\n  React.ComponentProps<typeof AvatarPrimitive.Root>,\n  \"className\" | \"color\" | \"children\"\n> & {\n  className?: string\n  src?: string\n  /** Accessible name for the image, and the seed for the automatic colour. */\n  alt?: string\n  /** Shown when no `src` loads. Also seeds the automatic colour when `alt` is absent. */\n  initials?: string\n  /**\n   * Leave this unset and the colour is derived by hashing `alt`, falling back to\n   * `initials` — so the same person keeps the same colour everywhere, and two\n   * people rarely collide. Set it only to override that.\n   */\n  color?: AvatarColor\n  /** @default \"base\" */\n  size?: AvatarSize\n}\n\nexport const Avatar = React.forwardRef<\n  React.ComponentRef<typeof AvatarPrimitive.Root>,\n  AvatarProps\n>(function Avatar(\n  { className, src, alt, initials, color, size, style, ...props },\n  ref\n) {\n  const styles = useStyles()\n  const group = React.useContext(AvatarGroupContext)\n  const resolvedSize = size ?? group?.size ?? \"base\"\n  const resolvedColor = color ?? colorForSeed(alt ?? initials ?? \"\")\n\n  // Was a module-scope call, so merely IMPORTING Avatar installed 63 kB of palette CSS whether one\n  // ever rendered. Now it is per-instance and keyed on the resolved family, installed at commit\n  // time (WP2B2) via a hook called unconditionally every render. Every auto colour is decorative,\n  // so a seeded avatar still installs the sheet; an explicit `color=\"gray\"` no longer does, and\n  // neither does an import that never renders.\n  useZenithPaletteTokensFor(resolvedColor)\n\n  return (\n    <AvatarPrimitive.Root\n      ref={ref}\n      data-slot=\"avatar\"\n      {...{ [SLOT_ATTR]: \"avatar\" }}\n      className={mergeClasses(styles.root, styles[resolvedSize], className)}\n      style={{ ...colorVars[resolvedColor], ...style }}\n      {...props}\n    >\n      <AvatarPrimitive.Image\n        data-slot=\"avatar-image\"\n        {...{ [SLOT_ATTR]: \"avatar-image\" }}\n        src={src}\n        alt={alt}\n        className={styles.image}\n      />\n      <AvatarPrimitive.Fallback\n        data-slot=\"avatar-fallback\"\n        {...{ [SLOT_ATTR]: \"avatar-fallback\" }}\n        className={styles.fallback}\n        aria-hidden=\"true\"\n      >\n        {initials}\n      </AvatarPrimitive.Fallback>\n    </AvatarPrimitive.Root>\n  )\n})\n\nexport { AvatarGroupContext }\n"],"names":["AUTO_COLORS","colorForSeed","seed","hash","i","colorVars","tokens.gray3","tokens.grayA12","tokens.blue3","tokens.blueA12","tokens.sky3","tokens.skyA12","tokens.cyan3","tokens.cyanA12","tokens.teal3","tokens.tealA12","tokens.mint3","tokens.mintA12","tokens.green3","tokens.greenA12","tokens.lime3","tokens.limeA12","tokens.yellow3","tokens.yellowA12","tokens.orange3","tokens.orangeA12","tokens.bronze3","tokens.bronzeA12","tokens.red3","tokens.redA12","tokens.pink3","tokens.pinkA12","tokens.purple3","tokens.purpleA12","tokens.indigo3","tokens.indigoA12","AvatarGroupContext","React","useStyles","makeZenithStyles","boxModel","tokens.fontWeightMedium","tokens.textXs","tokens.leadingXs","tokens.textSm","tokens.leadingSm","tokens.textBase","tokens.leadingBase","Avatar","className","src","alt","initials","color","size","style","props","ref","styles","group","resolvedSize","resolvedColor","useZenithPaletteTokensFor","jsxs","AvatarPrimitive.Root","SLOT_ATTR","mergeClasses","jsx","AvatarPrimitive.Image","AvatarPrimitive.Fallback"],"mappings":"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"}