@12-apps/ui 6.19.1 → 6.21.0

package/dist/chunk-4HYXEMBP.js

@@ -0,0 +1,147 @@
+import {
+  ERROR_ICON_BOX,
+  ERROR_ICON_BOX_OPACITY,
+  ERROR_ICON_SIZE,
+  ERROR_MESSAGE_LINE_HEIGHT,
+  ERROR_MESSAGE_MAX_WIDTH,
+  ERROR_STATE_GAP_UNITS,
+  ERROR_STATE_MIN_HEIGHT,
+  ERROR_STATE_PADDING_UNITS,
+  ERROR_TEXT_GAP_UNITS,
+  RETRY_MARGIN_TOP_UNITS,
+  RETRY_MIN_WIDTH
+} from "./chunk-TLGGVE56.js";
+import {
+  resolveTestId
+} from "./chunk-6F5IKY32.js";
+
+// src/components/data-display/ErrorState/ErrorState.tsx
+import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline";
+import RefreshIcon from "@mui/icons-material/Refresh";
+import WarningAmberIcon from "@mui/icons-material/WarningAmber";
+import Box from "@mui/material/Box/index.js";
+import Button from "@mui/material/Button/index.js";
+import Stack from "@mui/material/Stack/index.js";
+import Typography from "@mui/material/Typography/index.js";
+import { useTheme } from "@mui/material/styles/index.js";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var makeTestId = (dataTestId) => (suffix) => dataTestId ? `${dataTestId}-${suffix}` : `error-state-${suffix}`;
+var paletteFor = (theme, severity) => severity === "error" ? theme.palette.error : theme.palette.warning;
+var ErrorIcon = ({ severity, icon, testId }) => {
+  const theme = useTheme();
+  const color = paletteFor(theme, severity);
+  const Fallback = severity === "error" ? ErrorOutlineIcon : WarningAmberIcon;
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      "data-testid": testId,
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: ERROR_ICON_BOX,
+        height: ERROR_ICON_BOX,
+        borderRadius: "50%",
+        backgroundColor: color.light,
+        opacity: ERROR_ICON_BOX_OPACITY
+      },
+      children: icon || /* @__PURE__ */ jsx(Fallback, { sx: { fontSize: ERROR_ICON_SIZE, color: color.main } })
+    }
+  );
+};
+var ErrorText = ({ title, message, titleId, testId }) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(Stack, { spacing: ERROR_TEXT_GAP_UNITS, alignItems: "center", children: [
+    title && /* @__PURE__ */ jsx(
+      Typography,
+      {
+        id: titleId,
+        variant: "h6",
+        component: "h3",
+        "data-testid": testId("title"),
+        sx: {
+          fontWeight: theme.typography.fontWeightMedium,
+          color: theme.palette.text.primary
+        },
+        children: title
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Typography,
+      {
+        id: `${titleId}-message`,
+        variant: "body2",
+        color: "text.secondary",
+        "data-testid": testId("message"),
+        sx: {
+          maxWidth: ERROR_MESSAGE_MAX_WIDTH,
+          lineHeight: ERROR_MESSAGE_LINE_HEIGHT
+        },
+        children: message
+      }
+    )
+  ] });
+};
+var ErrorState = React.memo((props) => {
+  const {
+    message,
+    title,
+    onRetry,
+    retryLabel = "Retry",
+    severity = "error",
+    icon,
+    className
+  } = props;
+  const theme = useTheme();
+  const titleId = React.useId();
+  const dataTestId = resolveTestId(props);
+  const testId = makeTestId(dataTestId);
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      role: "alert",
+      "aria-labelledby": title ? titleId : void 0,
+      "aria-describedby": `${titleId}-message`,
+      className,
+      "data-testid": dataTestId || "error-state",
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        justifyContent: "center",
+        textAlign: "center",
+        padding: theme.spacing(ERROR_STATE_PADDING_UNITS),
+        minHeight: ERROR_STATE_MIN_HEIGHT,
+        gap: theme.spacing(ERROR_STATE_GAP_UNITS)
+      },
+      children: [
+        /* @__PURE__ */ jsx(ErrorIcon, { severity, icon, testId: testId("icon") }),
+        /* @__PURE__ */ jsx(ErrorText, { title, message, titleId, testId }),
+        onRetry && /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "outlined",
+            color: severity,
+            onClick: onRetry,
+            startIcon: /* @__PURE__ */ jsx(RefreshIcon, {}),
+            "data-testid": testId("retry-button"),
+            sx: {
+              mt: theme.spacing(RETRY_MARGIN_TOP_UNITS),
+              minWidth: RETRY_MIN_WIDTH
+            },
+            children: retryLabel
+          }
+        )
+      ]
+    }
+  );
+});
+ErrorState.displayName = "ErrorState";
+var ErrorState_default = ErrorState;
+
+export {
+  ErrorState,
+  ErrorState_default
+};
+//# sourceMappingURL=chunk-4HYXEMBP.js.map

package/dist/chunk-4K7FDVAB.js

@@ -0,0 +1,57 @@
+import {
+  Alert
+} from "./chunk-FB36IHCE.js";
+
+// src/components/data-display/CardKit/card-actions-context.tsx
+import { createContext, useCallback, useContext, useState } from "react";
+import Snackbar from "@mui/material/Snackbar/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var CardActionsContext = createContext(null);
+function CardActionsProvider({
+  tenantSlug,
+  onRefresh,
+  errorTitle,
+  errorDismissLabel,
+  autoHideMs = 6e3,
+  children
+}) {
+  const [error, setError] = useState(null);
+  const notifyError = useCallback((message) => setError(message), []);
+  return /* @__PURE__ */ jsxs(CardActionsContext.Provider, { value: { tenantSlug, onRefresh, notifyError }, children: [
+    children,
+    /* @__PURE__ */ jsx(
+      Snackbar,
+      {
+        open: error !== null,
+        autoHideDuration: autoHideMs,
+        onClose: () => setError(null),
+        anchorOrigin: { vertical: "bottom", horizontal: "center" },
+        children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(
+          Alert,
+          {
+            variant: "danger",
+            title: errorTitle,
+            description: error ?? "",
+            closable: true,
+            closeLabel: errorDismissLabel,
+            onClose: () => setError(null),
+            "data-testid": "card-action-error"
+          }
+        ) })
+      }
+    )
+  ] });
+}
+function useCardActions() {
+  const value = useContext(CardActionsContext);
+  if (!value) {
+    throw new Error("useCardActions must be used within a CardActionsProvider");
+  }
+  return value;
+}
+
+export {
+  CardActionsProvider,
+  useCardActions
+};
+//# sourceMappingURL=chunk-4K7FDVAB.js.map

package/dist/chunk-4MLDWACO.js

@@ -0,0 +1,161 @@
+import {
+  CategoryPanel
+} from "./chunk-G2IPK2XE.js";
+import {
+  CategoryPanelSurface
+} from "./chunk-LMXWI3DD.js";
+import {
+  useCategorySelect
+} from "./chunk-2GB5CIN6.js";
+import {
+  useCategoryKeyHandler
+} from "./chunk-ISH42UC7.js";
+import {
+  useCategoryCommit
+} from "./chunk-ZAB65STX.js";
+import {
+  summarizeSelection
+} from "./chunk-LR6MSKTT.js";
+import {
+  CategoryTrigger
+} from "./chunk-KIHQE5YA.js";
+import {
+  METRICS
+} from "./chunk-TFO6GBW7.js";
+import {
+  FormControl,
+  FormLabel,
+  FormMessage
+} from "./chunk-IPPTOL53.js";
+
+// src/components/form/CategorySelect/CategorySelect.tsx
+import { useEffect, useMemo, useRef } from "react";
+import { useTheme } from "@mui/material/styles/index.js";
+import useMediaQuery from "@mui/material/useMediaQuery/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+function appliedIds(props) {
+  if (props.mode === "single") return props.value ? [props.value] : [];
+  return props.value;
+}
+function draftChanged(draft, applied) {
+  return draft.size !== applied.length || applied.some((id) => !draft.has(id));
+}
+function singleLabel(groups, value) {
+  if (!value) return void 0;
+  const asCategory = groups.find((group) => group.category.id === value);
+  if (asCategory) return asCategory.category.name;
+  const owner = groups.find((group) => group.subcategories.some((sub2) => sub2.id === value));
+  const sub = owner?.subcategories.find((candidate) => candidate.id === value);
+  return sub && owner ? `${owner.category.name} \u203A ${sub.name}` : void 0;
+}
+function resolveConfig(props) {
+  const single = props.mode === "single";
+  return {
+    single,
+    placeholder: props.placeholder ?? (single ? props.copy.placeholderSingle : props.copy.placeholderMulti),
+    disabled: props.disabled ?? false,
+    loading: props.loading ?? false,
+    fullWidth: props.fullWidth ?? false,
+    showCounts: props.showCounts ?? false,
+    allowParentSelection: props.allowParentSelection ?? false,
+    dataTestId: props.dataTestId ?? "category-select"
+  };
+}
+function usePanelFocus(open, activeIndex, searchInputRef, listRef) {
+  useEffect(() => {
+    if (!open) return void 0;
+    const frame = requestAnimationFrame(() => searchInputRef.current?.focus());
+    return () => cancelAnimationFrame(frame);
+  }, [open, searchInputRef]);
+  useEffect(() => {
+    if (activeIndex < 0) return;
+    const rows = listRef.current?.querySelectorAll('[role="option"], [role="button"]');
+    rows?.[activeIndex]?.scrollIntoView({ block: "nearest" });
+  }, [activeIndex, listRef]);
+}
+function CategorySelect(props) {
+  const { options, label, error, onCreateCategory, copy } = props;
+  const {
+    single,
+    placeholder,
+    disabled,
+    loading,
+    fullWidth,
+    showCounts,
+    allowParentSelection,
+    dataTestId
+  } = resolveConfig(props);
+  const theme = useTheme();
+  const sheet = useMediaQuery(theme.breakpoints.down(METRICS.sheetBreakpoint));
+  const applied = appliedIds(props);
+  const state = useCategorySelect({ options, selected: applied });
+  const searchInputRef = useRef(null);
+  const listRef = useRef(null);
+  usePanelFocus(state.open, state.activeIndex, searchInputRef, listRef);
+  const chips = useMemo(
+    () => summarizeSelection(state.allGroups, state.draft),
+    [state.allGroups, state.draft]
+  );
+  const rowIds = useMemo(() => state.rows.map((row) => row.id), [state.rows]);
+  const actions = useCategoryCommit({ props, state, single, allowParentSelection });
+  const onKeyDown = useCategoryKeyHandler({ state, single, allowParentSelection, actions });
+  return /* @__PURE__ */ jsxs(FormControl, { fullWidth, error: Boolean(error), children: [
+    label && /* @__PURE__ */ jsx(FormLabel, { error: Boolean(error), children: label }),
+    /* @__PURE__ */ jsx(
+      CategoryTrigger,
+      {
+        copy,
+        placeholder,
+        selectionLabel: props.mode === "single" ? singleLabel(state.allGroups, props.value) : void 0,
+        count: single ? void 0 : applied.length,
+        open: state.open,
+        disabled,
+        fullWidth,
+        onOpen: state.openPanel,
+        onClear: applied.length > 0 ? actions.clearSelection : void 0,
+        triggerRef: state.triggerRef,
+        dataTestId
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      CategoryPanelSurface,
+      {
+        open: state.open,
+        sheet,
+        anchorEl: state.triggerRef.current,
+        onClose: actions.cancel,
+        children: /* @__PURE__ */ jsx(
+          CategoryPanel,
+          {
+            copy,
+            state,
+            chips,
+            rowIds,
+            changed: draftChanged(state.draft, applied),
+            single,
+            sheet,
+            loading,
+            showCounts,
+            allowParentSelection,
+            ariaLabel: label ?? placeholder,
+            onKeyDown,
+            onActivateCategory: actions.activateCategory,
+            onActivateSubcategory: actions.activateSubcategory,
+            onApply: actions.commit,
+            onCancel: actions.cancel,
+            onCreateCategory,
+            searchInputRef,
+            listRef,
+            dataTestId
+          }
+        )
+      }
+    ),
+    error && /* @__PURE__ */ jsx(FormMessage, { error: true, dataTestId: `${dataTestId}-message`, children: error })
+  ] });
+}
+
+export {
+  CategorySelect
+};
+//# sourceMappingURL=chunk-4MLDWACO.js.map

package/dist/chunk-4SQFO4GW.js

@@ -0,0 +1,275 @@
+import {
+  ACTIVE_SCALE,
+  AVATAR_SIZES,
+  AVATAR_TRANSITION_EASING,
+  AVATAR_TRANSITION_MS,
+  BORDER_HALO_ALPHA,
+  BORDER_WIDTH,
+  FADE_MS,
+  FOCUS_RING,
+  GLOW,
+  HOVER,
+  LOADING_OVERLAY,
+  PULSE,
+  ROUNDED_RADIUS_UNITS,
+  SCALE_IN_MS,
+  SHIMMER,
+  SPINNER,
+  STATUS_DOT
+} from "./chunk-FAITHWIO.js";
+import {
+  pulseAnimation,
+  rotateAnimation,
+  scaleInAnimation,
+  shimmerAnimation
+} from "./chunk-XRMZMBE3.js";
+import {
+  px
+} from "./chunk-NQN5Z36J.js";
+
+// src/components/data-display/Avatar/Avatar.view.tsx
+import MuiAvatar from "@mui/material/Avatar/index.js";
+import Badge from "@mui/material/Badge/index.js";
+import Fade from "@mui/material/Fade/index.js";
+import { alpha, useTheme, styled } from "@mui/material/styles/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var getColorFromTheme = (theme, color) => {
+  const colorMap = {
+    primary: theme.palette.primary,
+    secondary: theme.palette.secondary,
+    success: theme.palette.success,
+    warning: theme.palette.warning,
+    info: theme.palette.info,
+    // `danger`, not `error`. This map was keyed on MUI's word while the prop
+    // took the house one, so `danger` matched nothing and fell through to
+    // primary — a red avatar rendering blue, silently.
+    danger: theme.palette.error,
+    neutral: { main: theme.palette.grey[700], contrastText: "#fff" }
+  };
+  return colorMap[color] || theme.palette.primary;
+};
+var sizeMap = Object.fromEntries(
+  Object.entries(AVATAR_SIZES).map(([size, step]) => [
+    size,
+    { width: step.box, height: step.box, fontSize: px(step.fontSize) }
+  ])
+);
+var getSizeStyles = (size) => sizeMap[size] || sizeMap.md;
+var getStatusColor = (status, theme) => {
+  const statusColorMap = {
+    online: theme.palette.success.main,
+    offline: theme.palette.grey[500],
+    away: theme.palette.warning.main,
+    busy: theme.palette.error.main
+  };
+  return statusColorMap[status] || statusColorMap.offline;
+};
+var interactiveStyles = (interactive, main) => interactive ? {
+  "&:hover": {
+    transform: `scale(${HOVER.scale}) translateY(-${HOVER.lift}px)`,
+    boxShadow: `0 ${HOVER.shadowY}px ${HOVER.shadowBlur}px ${alpha(main, HOVER.shadowAlpha)}`,
+    filter: `brightness(${HOVER.brightness})`,
+    zIndex: 10
+  },
+  "&:active": { transform: `scale(${ACTIVE_SCALE})` }
+} : {};
+var loadingStyles = (isLoading, main) => isLoading ? {
+  background: `linear-gradient(
+        90deg,
+        ${alpha(main, SHIMMER.fromAlpha)},
+        ${alpha(main, SHIMMER.toAlpha)},
+        ${alpha(main, SHIMMER.fromAlpha)}
+      )`,
+  backgroundSize: "200% 100%",
+  animation: `${shimmerAnimation} ${SHIMMER.durationMs / 1e3}s ease-in-out infinite`
+} : {};
+var variantRadius = (variant, theme) => {
+  if (variant === "square") return { borderRadius: 0 };
+  if (variant === "rounded") return { borderRadius: theme.spacing(ROUNDED_RADIUS_UNITS) };
+  return { borderRadius: "50%" };
+};
+var borderedStyles = (bordered, theme) => bordered ? {
+  border: `${BORDER_WIDTH}px solid ${theme.palette.background.paper}`,
+  boxShadow: `0 0 0 1px ${alpha(theme.palette.divider, BORDER_HALO_ALPHA)}`
+} : {};
+var glowPulseStyles = (glow, pulse, main) => {
+  const styles = {};
+  if (glow) {
+    styles.boxShadow = `0 0 ${GLOW.blur}px ${GLOW.spread}px ${alpha(main, GLOW.alpha)} !important`;
+    styles.filter = `brightness(${GLOW.brightness})`;
+  }
+  if (pulse) {
+    styles.position = "relative";
+    styles["&::after"] = {
+      content: '""',
+      position: "absolute",
+      top: "50%",
+      left: "50%",
+      width: "100%",
+      height: "100%",
+      borderRadius: "inherit",
+      transform: "translate(-50%, -50%)",
+      backgroundColor: main,
+      opacity: PULSE.alpha,
+      animation: `${pulseAnimation} ${PULSE.durationMs / 1e3}s infinite`,
+      pointerEvents: "none",
+      zIndex: -1
+    };
+  }
+  return styles;
+};
+var STYLED_AVATAR_PROPS = [
+  "customVariant",
+  "customSize",
+  "customColor",
+  "glow",
+  "pulse",
+  "bordered",
+  "isLoading",
+  "hasError",
+  "interactive"
+];
+var StyledAvatar = styled(MuiAvatar, {
+  shouldForwardProp: (prop) => !STYLED_AVATAR_PROPS.includes(prop)
+})(
+  ({
+    theme,
+    customVariant,
+    customSize = "md",
+    customColor = "primary",
+    glow,
+    pulse,
+    bordered,
+    isLoading,
+    hasError,
+    interactive
+  }) => {
+    const palette = getColorFromTheme(theme, customColor);
+    return {
+      ...getSizeStyles(customSize),
+      transition: `all ${AVATAR_TRANSITION_MS / 1e3}s ${AVATAR_TRANSITION_EASING}`,
+      position: "relative",
+      overflow: "visible",
+      animation: `${scaleInAnimation} ${SCALE_IN_MS / 1e3}s ease-out`,
+      cursor: interactive ? "pointer" : "default",
+      backgroundColor: hasError ? theme.palette.error.main : palette.main,
+      color: hasError ? theme.palette.error.contrastText : palette.contrastText ?? "#fff",
+      ...interactiveStyles(interactive, palette.main),
+      ...loadingStyles(isLoading, palette.main),
+      ...variantRadius(customVariant, theme),
+      ...borderedStyles(bordered, theme),
+      ...glowPulseStyles(glow, pulse, palette.main),
+      "&:focus-visible": {
+        outline: `${FOCUS_RING.width}px solid ${alpha(palette.main, FOCUS_RING.alpha)}`,
+        outlineOffset: FOCUS_RING.offset
+      }
+    };
+  }
+);
+var LoadingOverlay = styled("div")(({ theme, size }) => {
+  const sizeStyles = getSizeStyles(size);
+  return {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    width: sizeStyles.width,
+    height: sizeStyles.height,
+    borderRadius: "inherit",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    backgroundColor: alpha(theme.palette.background.paper, LOADING_OVERLAY.paperAlpha),
+    backdropFilter: `blur(${LOADING_OVERLAY.blur}px)`,
+    "& .loading-spinner": {
+      width: sizeStyles.width * SPINNER.scale,
+      height: sizeStyles.height * SPINNER.scale,
+      border: `${SPINNER.ringWidth}px solid ${alpha(theme.palette.primary.main, SPINNER.trackAlpha)}`,
+      borderTopColor: theme.palette.primary.main,
+      borderRadius: "50%",
+      animation: `${rotateAnimation} ${SPINNER.durationMs / 1e3}s linear infinite`
+    }
+  };
+});
+var StatusBadge = styled(Badge, {
+  shouldForwardProp: (prop) => !["statusColor", "avatarSize"].includes(prop)
+})(({ theme, statusColor, avatarSize = "md" }) => {
+  const sizeStyles = getSizeStyles(avatarSize);
+  const badgeSize = Math.max(STATUS_DOT.min, sizeStyles.width * STATUS_DOT.scale);
+  return {
+    "& .MuiBadge-badge": {
+      backgroundColor: statusColor || theme.palette.success.main,
+      color: statusColor || theme.palette.success.main,
+      width: badgeSize,
+      height: badgeSize,
+      borderRadius: "50%",
+      border: `${STATUS_DOT.borderWidth}px solid ${theme.palette.background.paper}`,
+      "&::after": {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        borderRadius: "50%",
+        backgroundColor: "currentColor",
+        content: '""'
+      }
+    }
+  };
+});
+function AvatarSurface(props) {
+  const { showSpinner, dataTestId, clickable } = props;
+  const testId = (suffix) => dataTestId ? `${dataTestId}-${suffix}` : void 0;
+  return /* @__PURE__ */ jsx(Fade, { in: props.mounted, timeout: FADE_MS, children: /* @__PURE__ */ jsxs("div", { style: { position: "relative", display: "inline-block" }, children: [
+    /* @__PURE__ */ jsx(
+      StyledAvatar,
+      {
+        ref: props.forwardedRef,
+        className: props.className,
+        customVariant: props.variant,
+        customSize: props.size,
+        customColor: props.color,
+        glow: props.glow,
+        pulse: props.pulse,
+        bordered: props.bordered,
+        isLoading: showSpinner,
+        hasError: props.imageError,
+        interactive: clickable,
+        src: props.imgSrc,
+        alt: props.alt,
+        onClick: props.onClick,
+        tabIndex: clickable ? 0 : void 0,
+        role: clickable ? "button" : void 0,
+        "aria-label": props.ariaLabel,
+        "data-testid": dataTestId,
+        ...props.rest,
+        slotProps: { img: { onError: props.handleImageError, onLoad: props.handleImageLoad } },
+        children: showSpinner ? null : /* @__PURE__ */ jsx("span", { "data-testid": testId(props.contentType), children: props.content })
+      }
+    ),
+    showSpinner && /* @__PURE__ */ jsx(LoadingOverlay, { size: props.size, "data-testid": testId("loading"), children: /* @__PURE__ */ jsx("div", { className: "loading-spinner", "data-testid": testId("loading-spinner") }) })
+  ] }) });
+}
+function AvatarView(props) {
+  const theme = useTheme();
+  const surface = /* @__PURE__ */ jsx(AvatarSurface, { ...props });
+  if (props.variant === "status" && props.status) {
+    return /* @__PURE__ */ jsx(
+      StatusBadge,
+      {
+        overlap: "circular",
+        anchorOrigin: { vertical: "bottom", horizontal: "right" },
+        variant: "dot",
+        statusColor: getStatusColor(props.status, theme),
+        avatarSize: props.size,
+        "data-testid": props.dataTestId ? `${props.dataTestId}-badge` : void 0,
+        children: surface
+      }
+    );
+  }
+  return surface;
+}
+
+export {
+  AvatarView
+};
+//# sourceMappingURL=chunk-4SQFO4GW.js.map

package/dist/chunk-4SQFO4GW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Avatar/Avatar.view.tsx"],"sourcesContent":["import MuiAvatar from '@mui/material/Avatar/index.js';\nimport Badge from '@mui/material/Badge/index.js';\nimport Fade from '@mui/material/Fade/index.js';\nimport { alpha, useTheme, styled } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { pulseAnimation, rotateAnimation, scaleInAnimation, shimmerAnimation } from './Avatar.animations';\nimport {\n  AVATAR_SIZES,\n  AVATAR_TRANSITION_EASING,\n  AVATAR_TRANSITION_MS,\n  ACTIVE_SCALE,\n  BORDER_HALO_ALPHA,\n  BORDER_WIDTH,\n  FADE_MS,\n  FOCUS_RING,\n  GLOW,\n  HOVER,\n  LOADING_OVERLAY,\n  PULSE,\n  ROUNDED_RADIUS_UNITS,\n  SCALE_IN_MS,\n  SHIMMER,\n  SPINNER,\n  STATUS_DOT,\n} from './Avatar.metrics';\nimport type { AvatarSize, AvatarStatus, ContentType } from './Avatar.types';\nimport { px } from '../../../tokens/theme';\n\nexport type { ContentType };\n\n\ninterface PaletteLike {\n  main: string;\n  contrastText?: string;\n  light?: string;\n  dark?: string;\n}\n\nconst getColorFromTheme = (theme: Theme, color: string): PaletteLike => {\n  const colorMap: Record<string, PaletteLike> = {\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`, not `error`. This map was keyed on MUI's word while the prop\n    // took the house one, so `danger` matched nothing and fell through to\n    // primary — a red avatar rendering blue, silently.\n    danger: theme.palette.error,\n    neutral: { main: theme.palette.grey[700], contrastText: '#fff' },\n  };\n\n  return colorMap[color] || theme.palette.primary;\n};\n\ninterface SizeStyle {\n  width: number;\n  height: number;\n  fontSize: string;\n}\n\n// Derived from the shared metrics, not restated: the native `Avatar` reads the\n// same table, so the two renderers cannot disagree on a box.\nconst sizeMap: Record<AvatarSize, SizeStyle> = Object.fromEntries(\n  Object.entries(AVATAR_SIZES).map(([size, step]) => [\n    size,\n    { width: step.box, height: step.box, fontSize: px(step.fontSize) },\n  ]),\n) as Record<AvatarSize, SizeStyle>;\n\nconst getSizeStyles = (size: AvatarSize): SizeStyle => sizeMap[size] || sizeMap.md;\n\nconst getStatusColor = (status: AvatarStatus, theme: Theme): string => {\n  // The same four decisions the native half reads out of `Avatar.metrics`,\n  // against MUI's `Theme` rather than the shared one.\n  const statusColorMap: Record<AvatarStatus, string> = {\n    online: theme.palette.success.main,\n    offline: theme.palette.grey[500],\n    away: theme.palette.warning.main,\n    busy: theme.palette.error.main,\n  };\n\n  return statusColorMap[status] || statusColorMap.offline;\n};\n\n/** Hover/active lift, only when the avatar is interactive. */\nconst interactiveStyles = (interactive: boolean | undefined, main: string): CSSObject =>\n  interactive\n    ? {\n        '&:hover': {\n          transform: `scale(${HOVER.scale}) translateY(-${HOVER.lift}px)`,\n          boxShadow: `0 ${HOVER.shadowY}px ${HOVER.shadowBlur}px ${alpha(main, HOVER.shadowAlpha)}`,\n          filter: `brightness(${HOVER.brightness})`,\n          zIndex: 10,\n        },\n        '&:active': { transform: `scale(${ACTIVE_SCALE})` },\n      }\n    : {};\n\n/** Shimmer gradient while the image loads. */\nconst loadingStyles = (isLoading: boolean | undefined, main: string): CSSObject =>\n  isLoading\n    ? {\n        background: `linear-gradient(\n        90deg,\n        ${alpha(main, SHIMMER.fromAlpha)},\n        ${alpha(main, SHIMMER.toAlpha)},\n        ${alpha(main, SHIMMER.fromAlpha)}\n      )`,\n        backgroundSize: '200% 100%',\n        animation: `${shimmerAnimation} ${SHIMMER.durationMs / 1000}s ease-in-out infinite`,\n      }\n    : {};\n\n/** Corner radius per shape variant (circle/status are round). */\nconst variantRadius = (variant: string | undefined, theme: Theme): CSSObject => {\n  if (variant === 'square') return { borderRadius: 0 };\n  if (variant === 'rounded') return { borderRadius: theme.spacing(ROUNDED_RADIUS_UNITS) };\n  return { borderRadius: '50%' };\n};\n\n/** Paper ring when bordered (e.g. inside an AvatarGroup). */\nconst borderedStyles = (bordered: boolean | undefined, theme: Theme): CSSObject =>\n  bordered\n    ? {\n        border: `${BORDER_WIDTH}px solid ${theme.palette.background.paper}`,\n        boxShadow: `0 0 0 1px ${alpha(theme.palette.divider, BORDER_HALO_ALPHA)}`,\n      }\n    : {};\n\n/** Glow adds the halo; pulse adds the expanding ring — either or both. */\nconst glowPulseStyles = (\n  glow: boolean | undefined,\n  pulse: boolean | undefined,\n  main: string,\n): CSSObject => {\n  const styles: CSSObject = {};\n  if (glow) {\n    styles.boxShadow = `0 0 ${GLOW.blur}px ${GLOW.spread}px ${alpha(main, GLOW.alpha)} !important`;\n    styles.filter = `brightness(${GLOW.brightness})`;\n  }\n  if (pulse) {\n    styles.position = 'relative';\n    styles['&::after'] = {\n      content: '\"\"',\n      position: 'absolute',\n      top: '50%',\n      left: '50%',\n      width: '100%',\n      height: '100%',\n      borderRadius: 'inherit',\n      transform: 'translate(-50%, -50%)',\n      backgroundColor: main,\n      opacity: PULSE.alpha,\n      animation: `${pulseAnimation} ${PULSE.durationMs / 1000}s infinite`,\n      pointerEvents: 'none',\n      zIndex: -1,\n    };\n  }\n  return styles;\n};\n\ninterface StyledAvatarProps {\n  customVariant?: string;\n  customSize?: AvatarSize;\n  customColor?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  bordered?: boolean;\n  isLoading?: boolean;\n  hasError?: boolean;\n  interactive?: boolean;\n}\n\nconst STYLED_AVATAR_PROPS = [\n  'customVariant',\n  'customSize',\n  'customColor',\n  'glow',\n  'pulse',\n  'bordered',\n  'isLoading',\n  'hasError',\n  'interactive',\n];\n\nconst StyledAvatar = styled(MuiAvatar, {\n  shouldForwardProp: (prop) => !STYLED_AVATAR_PROPS.includes(prop as string),\n})<StyledAvatarProps>(\n  ({\n    theme,\n    customVariant,\n    customSize = 'md',\n    customColor = 'primary',\n    glow,\n    pulse,\n    bordered,\n    isLoading,\n    hasError,\n    interactive,\n  }) => {\n    const palette = getColorFromTheme(theme, customColor);\n    return {\n      ...getSizeStyles(customSize),\n      transition: `all ${AVATAR_TRANSITION_MS / 1000}s ${AVATAR_TRANSITION_EASING}`,\n      position: 'relative',\n      overflow: 'visible',\n      animation: `${scaleInAnimation} ${SCALE_IN_MS / 1000}s ease-out`,\n      cursor: interactive ? 'pointer' : 'default',\n      backgroundColor: hasError ? theme.palette.error.main : palette.main,\n      color: hasError ? theme.palette.error.contrastText : (palette.contrastText ?? '#fff'),\n      ...interactiveStyles(interactive, palette.main),\n      ...loadingStyles(isLoading, palette.main),\n      ...variantRadius(customVariant, theme),\n      ...borderedStyles(bordered, theme),\n      ...glowPulseStyles(glow, pulse, palette.main),\n      '&:focus-visible': {\n        outline: `${FOCUS_RING.width}px solid ${alpha(palette.main, FOCUS_RING.alpha)}`,\n        outlineOffset: FOCUS_RING.offset,\n      },\n    };\n  },\n);\n\nconst LoadingOverlay = styled('div')<{ size: AvatarSize }>(({ theme, size }) => {\n  const sizeStyles = getSizeStyles(size);\n  return {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: sizeStyles.width,\n    height: sizeStyles.height,\n    borderRadius: 'inherit',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    backgroundColor: alpha(theme.palette.background.paper, LOADING_OVERLAY.paperAlpha),\n    backdropFilter: `blur(${LOADING_OVERLAY.blur}px)`,\n    '& .loading-spinner': {\n      width: sizeStyles.width * SPINNER.scale,\n      height: sizeStyles.height * SPINNER.scale,\n      border: `${SPINNER.ringWidth}px solid ${alpha(theme.palette.primary.main, SPINNER.trackAlpha)}`,\n      borderTopColor: theme.palette.primary.main,\n      borderRadius: '50%',\n      animation: `${rotateAnimation} ${SPINNER.durationMs / 1000}s linear infinite`,\n    },\n  };\n});\n\nconst StatusBadge = styled(Badge, {\n  shouldForwardProp: (prop) => !['statusColor', 'avatarSize'].includes(prop as string),\n})<{\n  statusColor?: string;\n  avatarSize?: AvatarSize;\n}>(({ theme, statusColor, avatarSize = 'md' }) => {\n  const sizeStyles = getSizeStyles(avatarSize);\n  const badgeSize = Math.max(STATUS_DOT.min, sizeStyles.width * STATUS_DOT.scale);\n\n  return {\n    '& .MuiBadge-badge': {\n      backgroundColor: statusColor || theme.palette.success.main,\n      color: statusColor || theme.palette.success.main,\n      width: badgeSize,\n      height: badgeSize,\n      borderRadius: '50%',\n      border: `${STATUS_DOT.borderWidth}px solid ${theme.palette.background.paper}`,\n      '&::after': {\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        width: '100%',\n        height: '100%',\n        borderRadius: '50%',\n        backgroundColor: 'currentColor',\n        content: '\"\"',\n      },\n    },\n  };\n});\n\nexport interface AvatarViewProps {\n  mounted: boolean;\n  variant: string;\n  size: AvatarSize;\n  color: string;\n  glow: boolean;\n  pulse: boolean;\n  bordered: boolean;\n  showSpinner: boolean;\n  imageError: boolean;\n  clickable: boolean;\n  imgSrc?: string;\n  alt?: string;\n  ariaLabel: string;\n  content: React.ReactNode;\n  contentType: ContentType;\n  className?: string;\n  dataTestId?: string;\n  status?: AvatarStatus;\n  forwardedRef: React.Ref<HTMLDivElement>;\n  onClick: (event: React.MouseEvent<HTMLDivElement>) => void;\n  handleImageError: React.ReactEventHandler;\n  handleImageLoad: () => void;\n  rest: Record<string, unknown>;\n}\n\n/** The avatar box itself: the styled MUI avatar plus the loading overlay. */\nfunction AvatarSurface(props: AvatarViewProps): React.JSX.Element {\n  const { showSpinner, dataTestId, clickable } = props;\n  const testId = (suffix: string): string | undefined =>\n    dataTestId ? `${dataTestId}-${suffix}` : undefined;\n\n  return (\n    <Fade in={props.mounted} timeout={FADE_MS}>\n      <div style={{ position: 'relative', display: 'inline-block' }}>\n        <StyledAvatar\n          ref={props.forwardedRef}\n          className={props.className}\n          customVariant={props.variant}\n          customSize={props.size}\n          customColor={props.color}\n          glow={props.glow}\n          pulse={props.pulse}\n          bordered={props.bordered}\n          isLoading={showSpinner}\n          hasError={props.imageError}\n          interactive={clickable}\n          src={props.imgSrc}\n          alt={props.alt}\n          onClick={props.onClick}\n          tabIndex={clickable ? 0 : undefined}\n          role={clickable ? 'button' : undefined}\n          aria-label={props.ariaLabel}\n          data-testid={dataTestId}\n          {...props.rest}\n          // Load/error fire on the inner <img>, not the root — and don't bubble.\n          // Wiring them via the img slot lets `imageLoading` actually clear (else\n          // the spinner overlays the avatar forever whenever `src` is set). Keep\n          // after {...props.rest} so a consumer-supplied slotProps can't override\n          // and detach these handlers.\n          slotProps={{ img: { onError: props.handleImageError, onLoad: props.handleImageLoad } }}\n        >\n          {showSpinner ? null : (\n            <span data-testid={testId(props.contentType)}>{props.content}</span>\n          )}\n        </StyledAvatar>\n        {showSpinner && (\n          <LoadingOverlay size={props.size} data-testid={testId('loading')}>\n            <div className=\"loading-spinner\" data-testid={testId('loading-spinner')} />\n          </LoadingOverlay>\n        )}\n      </div>\n    </Fade>\n  );\n}\n\n/** Presentational avatar: the surface, wrapped in a status dot badge when requested. */\nexport function AvatarView(props: AvatarViewProps): React.JSX.Element {\n  const theme = useTheme();\n  const surface = <AvatarSurface {...props} />;\n\n  if (props.variant === 'status' && props.status) {\n    return (\n      <StatusBadge\n        overlap=\"circular\"\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}\n        variant=\"dot\"\n        statusColor={getStatusColor(props.status, theme)}\n        avatarSize={props.size}\n        data-testid={props.dataTestId ? `${props.dataTestId}-badge` : undefined}\n      >\n        {surface}\n      </StatusBadge>\n    );\n  }\n\n  return surface;\n}\n"],"mappings":"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","names":[]}