@12-apps/ui 6.19.1 → 6.21.0

package/dist/chunk-JZKOJZ6V.js

@@ -1,87 +0,0 @@
-// src/components/layout/Skeleton/Skeleton.styles.ts
-import { alpha } from "@mui/material/styles/index.js";
-var muiVariantFor = (variant) => {
-  switch (variant) {
-    case "circular":
-      return "circular";
-    case "rectangular":
-    case "wave":
-      return "rectangular";
-    default:
-      return "text";
-  }
-};
-var muiAnimationFor = (variant, animation) => {
-  if (variant === "wave") return "wave";
-  return animation;
-};
-var defaultDimensions = (variant) => {
-  switch (variant) {
-    case "circular":
-      return { width: 40, height: 40 };
-    case "rectangular":
-    case "wave":
-      return { width: "100%", height: 40 };
-    default:
-      return { width: "100%", height: void 0 };
-  }
-};
-var INTENSITY_OPACITY = {
-  low: 0.11,
-  medium: 0.13,
-  high: 0.15
-};
-var intensityOpacity = (intensity) => INTENSITY_OPACITY[intensity] ?? INTENSITY_OPACITY.medium;
-var glassmorphismStyles = (theme) => ({
-  background: `linear-gradient(135deg,
-        ${alpha(theme.palette.background.paper, 0.8)} 0%,
-        ${alpha(theme.palette.background.paper, 0.4)} 100%)`,
-  backdropFilter: "blur(20px)",
-  border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,
-  boxShadow: `0 8px 32px 0 ${alpha(theme.palette.common.black, 0.1)}`
-});
-var shimmerStyles = (theme) => ({
-  "&::after": {
-    content: '""',
-    position: "absolute",
-    top: 0,
-    right: 0,
-    bottom: 0,
-    left: 0,
-    background: `linear-gradient(
-          90deg,
-          transparent,
-          ${alpha(theme.palette.common.white, 0.3)},
-          transparent
-        )`,
-    transform: "translateX(-100%)",
-    animation: "shimmer 2s infinite"
-  },
-  "@keyframes shimmer": {
-    "100%": {
-      transform: "translateX(100%)"
-    }
-  }
-});
-var skeletonStyles = (theme, { intensity, borderRadius, glassmorphism, shimmer, style }) => ({
-  borderRadius,
-  backgroundColor: alpha(
-    theme.palette.mode === "dark" ? theme.palette.common.white : theme.palette.text.primary,
-    intensityOpacity(intensity)
-  ),
-  ...shimmer && {
-    position: "relative",
-    overflow: "hidden"
-  },
-  ...glassmorphism ? glassmorphismStyles(theme) : {},
-  ...shimmer ? shimmerStyles(theme) : {},
-  ...style
-});
-
-export {
-  muiVariantFor,
-  muiAnimationFor,
-  defaultDimensions,
-  skeletonStyles
-};
-//# sourceMappingURL=chunk-JZKOJZ6V.js.map

package/dist/chunk-JZKOJZ6V.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/layout/Skeleton/Skeleton.styles.ts"],"sourcesContent":["import { alpha } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport type { SkeletonProps } from './Skeleton.types';\n\ntype SkeletonVariant = NonNullable<SkeletonProps['variant']>;\ntype SkeletonIntensity = NonNullable<SkeletonProps['intensity']>;\n\n/** `wave` is our own name for a rectangle that animates; MUI has no such variant. */\nexport const muiVariantFor = (\n  variant: SkeletonVariant,\n): 'circular' | 'rectangular' | 'text' => {\n  switch (variant) {\n    case 'circular':\n      return 'circular';\n    case 'rectangular':\n    case 'wave':\n      return 'rectangular';\n    default:\n      return 'text';\n  }\n};\n\nexport const muiAnimationFor = (\n  variant: SkeletonVariant,\n  animation: SkeletonProps['animation'],\n) => {\n  if (variant === 'wave') return 'wave';\n  return animation;\n};\n\nexport const defaultDimensions = (\n  variant: SkeletonVariant,\n): { width: number | string; height: number | undefined } => {\n  switch (variant) {\n    case 'circular':\n      return { width: 40, height: 40 };\n    case 'rectangular':\n    case 'wave':\n      return { width: '100%', height: 40 };\n    default:\n      return { width: '100%', height: undefined };\n  }\n};\n\nconst INTENSITY_OPACITY: Record<SkeletonIntensity, number> = {\n  low: 0.11,\n  medium: 0.13,\n  high: 0.15,\n};\n\nconst intensityOpacity = (intensity: SkeletonIntensity): number =>\n  INTENSITY_OPACITY[intensity] ?? INTENSITY_OPACITY.medium;\n\nconst glassmorphismStyles = (theme: Theme): CSSObject => ({\n  background: `linear-gradient(135deg,\n        ${alpha(theme.palette.background.paper, 0.8)} 0%,\n        ${alpha(theme.palette.background.paper, 0.4)} 100%)`,\n  backdropFilter: 'blur(20px)',\n  border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n  boxShadow: `0 8px 32px 0 ${alpha(theme.palette.common.black, 0.1)}`,\n});\n\n// The sweep is a pseudo-element sliding across the box, so the box has to clip it\n// and establish a positioning context — hence `position`/`overflow` below.\nconst shimmerStyles = (theme: Theme): CSSObject => ({\n  '&::after': {\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    bottom: 0,\n    left: 0,\n    background: `linear-gradient(\n          90deg,\n          transparent,\n          ${alpha(theme.palette.common.white, 0.3)},\n          transparent\n        )`,\n    transform: 'translateX(-100%)',\n    animation: 'shimmer 2s infinite',\n  },\n  '@keyframes shimmer': {\n    '100%': {\n      transform: 'translateX(100%)',\n    },\n  },\n});\n\ninterface SkeletonStyleArgs {\n  intensity: SkeletonIntensity;\n  borderRadius?: number | string;\n  glassmorphism: boolean;\n  shimmer: boolean;\n  style?: React.CSSProperties;\n}\n\nexport const skeletonStyles = (\n  theme: Theme,\n  { intensity, borderRadius, glassmorphism, shimmer, style }: SkeletonStyleArgs,\n): CSSObject => ({\n  borderRadius,\n  backgroundColor: alpha(\n    theme.palette.mode === 'dark' ? theme.palette.common.white : theme.palette.text.primary,\n    intensityOpacity(intensity),\n  ),\n  ...(shimmer && {\n    position: 'relative' as const,\n    overflow: 'hidden' as const,\n  }),\n  ...(glassmorphism ? glassmorphismStyles(theme) : {}),\n  ...(shimmer ? shimmerStyles(theme) : {}),\n  ...style,\n});\n"],"mappings":";AAAA,SAAS,aAAa;AASf,IAAM,gBAAgB,CAC3B,YACwC;AACxC,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAEO,IAAM,kBAAkB,CAC7B,SACA,cACG;AACH,MAAI,YAAY,OAAQ,QAAO;AAC/B,SAAO;AACT;AAEO,IAAM,oBAAoB,CAC/B,YAC2D;AAC3D,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,EAAE,OAAO,IAAI,QAAQ,GAAG;AAAA,IACjC,KAAK;AAAA,IACL,KAAK;AACH,aAAO,EAAE,OAAO,QAAQ,QAAQ,GAAG;AAAA,IACrC;AACE,aAAO,EAAE,OAAO,QAAQ,QAAQ,OAAU;AAAA,EAC9C;AACF;AAEA,IAAM,oBAAuD;AAAA,EAC3D,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,MAAM;AACR;AAEA,IAAM,mBAAmB,CAAC,cACxB,kBAAkB,SAAS,KAAK,kBAAkB;AAEpD,IAAM,sBAAsB,CAAC,WAA6B;AAAA,EACxD,YAAY;AAAA,UACJ,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC;AAAA,UAC1C,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG,CAAC;AAAA,EAClD,gBAAgB;AAAA,EAChB,QAAQ,aAAa,MAAM,MAAM,QAAQ,SAAS,GAAG,CAAC;AAAA,EACtD,WAAW,gBAAgB,MAAM,MAAM,QAAQ,OAAO,OAAO,GAAG,CAAC;AACnE;AAIA,IAAM,gBAAgB,CAAC,WAA6B;AAAA,EAClD,YAAY;AAAA,IACV,SAAS;AAAA,IACT,UAAU;AAAA,IACV,KAAK;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,YAAY;AAAA;AAAA;AAAA,YAGJ,MAAM,MAAM,QAAQ,OAAO,OAAO,GAAG,CAAC;AAAA;AAAA;AAAA,IAG9C,WAAW;AAAA,IACX,WAAW;AAAA,EACb;AAAA,EACA,sBAAsB;AAAA,IACpB,QAAQ;AAAA,MACN,WAAW;AAAA,IACb;AAAA,EACF;AACF;AAUO,IAAM,iBAAiB,CAC5B,OACA,EAAE,WAAW,cAAc,eAAe,SAAS,MAAM,OAC1C;AAAA,EACf;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM,QAAQ,SAAS,SAAS,MAAM,QAAQ,OAAO,QAAQ,MAAM,QAAQ,KAAK;AAAA,IAChF,iBAAiB,SAAS;AAAA,EAC5B;AAAA,EACA,GAAI,WAAW;AAAA,IACb,UAAU;AAAA,IACV,UAAU;AAAA,EACZ;AAAA,EACA,GAAI,gBAAgB,oBAAoB,KAAK,IAAI,CAAC;AAAA,EAClD,GAAI,UAAU,cAAc,KAAK,IAAI,CAAC;AAAA,EACtC,GAAG;AACL;","names":[]}

package/dist/chunk-KADJNWTQ.js

@@ -1,165 +0,0 @@
-import {
-  Sheet
-} from "./chunk-MCRIT46W.js";
-import {
-  Dialog
-} from "./chunk-S5LE2ARG.js";
-import {
-  Button
-} from "./chunk-SL4NFGOL.js";
-import {
-  accentFor
-} from "./chunk-V5IOLAIS.js";
-
-// src/components/navigation/AppHeader/AppHeader.details.tsx
-import Box from "@mui/material/Box/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { useTheme } from "@mui/material/styles/index.js";
-import useMediaQuery from "@mui/material/useMediaQuery/index.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-var DIALOG_WIDTH = 460;
-var XXS_MAX_WIDTH = 360;
-function sheetHeight(xxs) {
-  return { height: "auto", maxHeight: xxs ? "100dvh" : "90dvh" };
-}
-function usesSheet(presentation, compact) {
-  if (presentation === "sheet") return true;
-  if (presentation === "dialog") return false;
-  return compact;
-}
-var DetailRow = ({
-  row,
-  last,
-  dataTestId
-}) => {
-  const theme = useTheme();
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      "data-testid": `${dataTestId}-row`,
-      "data-row": row.id ?? row.label,
-      sx: {
-        display: "flex",
-        alignItems: "flex-start",
-        justifyContent: "space-between",
-        gap: 2,
-        py: 1.5,
-        borderBottom: last ? "none" : `1px solid ${theme.palette.divider}`
-      },
-      children: [
-        /* @__PURE__ */ jsx(Typography, { variant: "body1", color: "text.secondary", component: "span", sx: { flex: "0 0 auto" }, children: row.label }),
-        /* @__PURE__ */ jsx(
-          Typography,
-          {
-            variant: "body1",
-            component: "span",
-            sx: {
-              minWidth: 0,
-              textAlign: "right",
-              fontWeight: row.tone ? 700 : 500,
-              color: row.tone ? accentFor(theme, row.tone).main : "text.primary",
-              // Newlines in a value are meaningful — an address is two lines.
-              whiteSpace: "pre-line"
-            },
-            children: row.value
-          }
-        )
-      ]
-    }
-  );
-};
-var DetailsBody = ({ rows, children, dataTestId }) => /* @__PURE__ */ jsxs(Box, { "data-testid": `${dataTestId}-body`, children: [
-  (rows ?? []).map((row, index) => /* @__PURE__ */ jsx(
-    DetailRow,
-    {
-      row,
-      last: index === (rows?.length ?? 0) - 1 && !children,
-      dataTestId
-    },
-    row.id ?? row.label
-  )),
-  children
-] });
-var DetailsAction = ({ action, dataTestId, padded = false }) => action ? /* @__PURE__ */ jsx(Box, { sx: padded ? { pt: 2 } : void 0, children: /* @__PURE__ */ jsx(
-  Button,
-  {
-    variant: "solid",
-    color: action.color ?? "primary",
-    size: "lg",
-    fullWidth: true,
-    disabled: action.disabled,
-    onClick: action.onClick,
-    dataTestId: action.dataTestId ?? `${dataTestId}-action`,
-    children: action.label
-  }
-) }) : null;
-var AppHeaderDetails = ({
-  open,
-  onClose,
-  title,
-  subtitle,
-  rows,
-  children,
-  action,
-  presentation = "auto",
-  breakpoint = "sm",
-  className,
-  dataTestId = "app-header-details"
-}) => {
-  const theme = useTheme();
-  const asSheet = usesSheet(presentation, useMediaQuery(theme.breakpoints.down(breakpoint)));
-  const xxs = useMediaQuery(`(max-width:${XXS_MAX_WIDTH - 0.05}px)`);
-  const description = typeof subtitle === "string" ? subtitle : void 0;
-  const richSubtitle = description === void 0 ? subtitle : null;
-  const body = /* @__PURE__ */ jsx(DetailsBody, { rows, dataTestId, children });
-  const footer = /* @__PURE__ */ jsx(DetailsAction, { action, dataTestId });
-  if (asSheet) {
-    return /* @__PURE__ */ jsxs(
-      Sheet,
-      {
-        open,
-        onClose,
-        onOpenChange: (next) => !next && onClose(),
-        position: "bottom",
-        size: "md",
-        style: sheetHeight(xxs),
-        className,
-        title,
-        description,
-        showCloseButton: true,
-        rounded: true,
-        footer,
-        dataTestId,
-        children: [
-          richSubtitle,
-          body
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    Dialog,
-    {
-      open,
-      onClose,
-      title,
-      description,
-      showCloseButton: true,
-      fullWidth: true,
-      className,
-      dataTestId,
-      PaperProps: { sx: { maxWidth: DIALOG_WIDTH, borderRadius: 3 } },
-      children: [
-        richSubtitle,
-        body,
-        /* @__PURE__ */ jsx(DetailsAction, { action, dataTestId, padded: true })
-      ]
-    }
-  );
-};
-AppHeaderDetails.displayName = "AppHeaderDetails";
-
-export {
-  AppHeaderDetails
-};
-//# sourceMappingURL=chunk-KADJNWTQ.js.map

package/dist/chunk-KKYW3LU7.js

@@ -1,177 +0,0 @@
-import {
-  EN_US_SOCIAL_LOGIN_COPY
-} from "./chunk-INGPH3YQ.js";
-import {
-  Heading
-} from "./chunk-Z7JNCB5Q.js";
-import {
-  Separator
-} from "./chunk-MCZ7536N.js";
-import {
-  Card,
-  CardContent
-} from "./chunk-D2IASECY.js";
-import {
-  Button
-} from "./chunk-SL4NFGOL.js";
-import {
-  Text
-} from "./chunk-2PCOC3PT.js";
-
-// src/social-login-button/social-login-button.tsx
-import * as React from "react";
-import Box from "@mui/material/Box/index.js";
-import Stack from "@mui/material/Stack/index.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-var GoogleIcon = () => /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-  /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z",
-      fill: "#4285F4"
-    }
-  ),
-  /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z",
-      fill: "#34A853"
-    }
-  ),
-  /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z",
-      fill: "#FBBC05"
-    }
-  ),
-  /* @__PURE__ */ jsx(
-    "path",
-    {
-      d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z",
-      fill: "#EA4335"
-    }
-  )
-] });
-var FacebookIcon = () => /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
-  "path",
-  {
-    d: "M24 12c0-6.627-5.373-12-12-12S0 5.373 0 12c0 5.99 4.388 10.954 10.125 11.854V15.47H7.078V12h3.047V9.356c0-3.007 1.792-4.668 4.533-4.668 1.312 0 2.686.234 2.686.234v2.953H15.83c-1.491 0-1.956.925-1.956 1.874V12h3.328l-.532 3.469h-2.796v8.385C19.612 22.954 24 17.99 24 12z",
-    fill: "#1877F2"
-  }
-) });
-var AppleIcon = () => /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx("path", { d: "M17.05 20.28c-.98.95-2.05.8-3.08.35-1.09-.46-2.09-.48-3.24 0-1.44.62-2.2.44-3.06-.35C2.79 15.25 3.51 7.59 9.05 7.31c1.35.07 2.29.74 3.08.8 1.18-.24 2.31-.93 3.57-.84 1.51.12 2.65.72 3.4 1.8-3.12 1.87-2.38 5.98.48 7.13-.57 1.5-1.31 2.99-2.54 4.09l.01-.01zM12.03 7.25c-.15-2.23 1.66-4.07 3.74-4.25.29 2.58-2.34 4.5-3.74 4.25z" }) });
-var providerConfig = {
-  google: {
-    Icon: GoogleIcon,
-    variant: "outline",
-    color: "neutral",
-    sx: {
-      backgroundColor: "#ffffff",
-      color: "#1f1f1f",
-      borderColor: "#dadce0",
-      "&:hover": {
-        backgroundColor: "#f5f5f5",
-        borderColor: "#dadce0"
-      }
-    }
-  },
-  facebook: {
-    Icon: FacebookIcon,
-    variant: "solid",
-    color: "primary",
-    sx: {
-      backgroundColor: "#1877F2",
-      color: "#ffffff",
-      "&:hover": {
-        backgroundColor: "#166fe5"
-      }
-    }
-  },
-  apple: {
-    Icon: AppleIcon,
-    variant: "solid",
-    color: "neutral",
-    sx: {
-      backgroundColor: "#000000",
-      color: "#ffffff",
-      "&:hover": {
-        backgroundColor: "#1a1a1a"
-      }
-    }
-  }
-};
-var SocialLoginButton = React.forwardRef(
-  ({
-    provider,
-    onClick,
-    loading = false,
-    disabled = false,
-    fullWidth = true,
-    copy = EN_US_SOCIAL_LOGIN_COPY,
-    dataTestId
-  }, ref) => {
-    const config = providerConfig[provider];
-    return /* @__PURE__ */ jsx(
-      Button,
-      {
-        ref,
-        variant: config.variant,
-        color: config.color,
-        size: "lg",
-        loading,
-        disabled,
-        onClick,
-        icon: /* @__PURE__ */ jsx(config.Icon, {}),
-        dataTestId,
-        fullWidth,
-        sx: {
-          minHeight: 48,
-          justifyContent: "flex-start",
-          gap: 2,
-          ...config.sx
-        },
-        children: copy[provider]
-      }
-    );
-  }
-);
-SocialLoginButton.displayName = "SocialLoginButton";
-function SocialLoginContainer({
-  children,
-  title = "Sign in to continue",
-  subtitle,
-  showDivider = false,
-  dividerText = "or",
-  maxWidth = 400
-}) {
-  return (
-    // `width: 100%` is what makes the cap below mean anything. Every caller
-    // centres this card in a flex column (`Container variant="centered"` does),
-    // and a flex item under `align-items: center` sizes to its CONTENT — so the
-    // card sat at whatever the longest label happened to need, ~267px, at every
-    // viewport from 390 to 1280. The 400 was never reached, which is why raising
-    // it would have changed nothing; the card had no width to cap.
-    /* @__PURE__ */ jsx(Card, { variant: "elevated", borderRadius: "lg", sx: { width: "100%", maxWidth }, children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs(Stack, { spacing: 3, sx: { width: "100%" }, children: [
-      title && /* @__PURE__ */ jsxs(Box, { sx: { textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx(Heading, { level: "h2", children: title }),
-        subtitle && /* @__PURE__ */ jsx(Text, { color: "secondary", size: "sm", children: subtitle })
-      ] }),
-      /* @__PURE__ */ jsx(Stack, { spacing: 2, children }),
-      showDivider && /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
-        /* @__PURE__ */ jsx(Separator, {}),
-        /* @__PURE__ */ jsx(Text, { color: "secondary", size: "sm", children: dividerText }),
-        /* @__PURE__ */ jsx(Separator, {})
-      ] })
-    ] }) }) })
-  );
-}
-
-export {
-  GoogleIcon,
-  FacebookIcon,
-  AppleIcon,
-  SocialLoginButton,
-  SocialLoginContainer
-};
-//# sourceMappingURL=chunk-KKYW3LU7.js.map

package/dist/chunk-KPQAPQH6.js

@@ -1,238 +0,0 @@
-import {
-  barEmphasisStyles,
-  barVariantStyles,
-  circularEmphasisStyles,
-  getColorFromTheme,
-  getSizeStyles,
-  pulseAnimation
-} from "./chunk-ZHEJLUCX.js";
-import {
-  resolveProgressProps
-} from "./chunk-HAFE43QJ.js";
-
-// src/components/data-display/Progress/Progress.tsx
-import Box from "@mui/material/Box/index.js";
-import CircularProgress from "@mui/material/CircularProgress/index.js";
-import LinearProgress from "@mui/material/LinearProgress/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { alpha, styled, useTheme } from "@mui/material/styles/index.js";
-import React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var StyledLinearProgress = styled(LinearProgress, {
-  shouldForwardProp: (prop) => !["customVariant", "customSize", "customColor", "glow", "pulse"].includes(prop)
-})(({ theme, customVariant, customSize, customColor = "primary", glow, pulse }) => {
-  const colorPalette = getColorFromTheme(theme, customColor);
-  const sizeStyles = getSizeStyles(customSize);
-  return {
-    height: sizeStyles.height,
-    borderRadius: sizeStyles.height / 2,
-    backgroundColor: alpha(colorPalette.main, 0.1),
-    "& .MuiLinearProgress-bar": {
-      borderRadius: "inherit",
-      transition: "all 0.3s ease",
-      ...barVariantStyles(customVariant, colorPalette),
-      ...barEmphasisStyles(colorPalette, glow, pulse)
-    }
-  };
-});
-var StyledCircularProgress = styled(CircularProgress, {
-  shouldForwardProp: (prop) => !["customColor", "glow", "pulse"].includes(prop)
-})(({ theme, customColor = "primary", glow, pulse }) => {
-  const colorPalette = getColorFromTheme(theme, customColor);
-  return {
-    color: colorPalette.main,
-    ...circularEmphasisStyles(colorPalette, glow, pulse)
-  };
-});
-var SegmentedProgress = ({ value = 0, segments, color, size, glow, pulse, dataTestId }) => {
-  const theme = useTheme();
-  const colorPalette = getColorFromTheme(theme, color);
-  const sizeStyles = getSizeStyles(size);
-  const filledSegments = Math.floor(value / 100 * segments);
-  return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", gap: 0.5, width: "100%" }, "data-testid": `${dataTestId}-segments-container`, children: Array.from({ length: segments }, (_, index) => /* @__PURE__ */ jsx(
-    Box,
-    {
-      "data-testid": `${dataTestId}-segment-${index}`,
-      sx: {
-        flex: 1,
-        height: sizeStyles.height,
-        borderRadius: sizeStyles.height / 2,
-        backgroundColor: index < filledSegments ? colorPalette.main : alpha(colorPalette.main, 0.1),
-        transition: "all 0.3s ease",
-        ...glow && index < filledSegments && {
-          boxShadow: `0 0 6px 1px ${alpha(colorPalette.main, 0.4)}`
-        },
-        ...pulse && index < filledSegments && {
-          animation: `${pulseAnimation} 2s infinite`
-        }
-      }
-    },
-    index
-  )) });
-};
-var ProgressLabel = ({
-  size,
-  label,
-  testId
-}) => /* @__PURE__ */ jsx(
-  Typography,
-  {
-    variant: "caption",
-    sx: {
-      display: "block",
-      textAlign: "center",
-      mt: 1,
-      fontSize: getSizeStyles(size).fontSize,
-      fontWeight: 600
-    },
-    "data-testid": testId,
-    children: label
-  }
-);
-var CircularView = React.forwardRef(
-  ({
-    size,
-    color,
-    glow,
-    pulse,
-    showLabel,
-    displayValue,
-    displayLabel,
-    value,
-    dataTestId,
-    thickness,
-    circularSize,
-    ...props
-  }, ref) => {
-    const sizeStyles = getSizeStyles(size);
-    return /* @__PURE__ */ jsxs(Box, { ref, sx: { position: "relative", display: "inline-flex" }, "data-testid": dataTestId, children: [
-      /* @__PURE__ */ jsx(
-        StyledCircularProgress,
-        {
-          variant: value !== void 0 ? "determinate" : "indeterminate",
-          value: displayValue,
-          size: circularSize || sizeStyles.circularSize,
-          thickness,
-          customColor: color,
-          glow,
-          pulse,
-          "data-testid": `${dataTestId}-circular`,
-          ...props
-        }
-      ),
-      showLabel && value !== void 0 && /* @__PURE__ */ jsx(
-        Box,
-        {
-          sx: {
-            top: 0,
-            left: 0,
-            bottom: 0,
-            right: 0,
-            position: "absolute",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center"
-          },
-          children: /* @__PURE__ */ jsx(
-            Typography,
-            {
-              variant: "caption",
-              component: "div",
-              color: "text.secondary",
-              sx: { fontSize: sizeStyles.fontSize, fontWeight: 600 },
-              "data-testid": `${dataTestId}-label`,
-              children: displayLabel
-            }
-          )
-        }
-      )
-    ] });
-  }
-);
-CircularView.displayName = "ProgressCircularView";
-var SegmentedView = React.forwardRef(
-  ({ size, color, glow, pulse, showLabel, displayValue, displayLabel, dataTestId, segments, value: _value, ...props }, ref) => /* @__PURE__ */ jsxs(Box, { ref, sx: { width: "100%" }, "data-testid": dataTestId, ...props, children: [
-    /* @__PURE__ */ jsx(
-      SegmentedProgress,
-      {
-        value: displayValue,
-        segments,
-        color,
-        size,
-        glow,
-        pulse,
-        dataTestId
-      }
-    ),
-    showLabel && /* @__PURE__ */ jsx(ProgressLabel, { size, label: displayLabel, testId: `${dataTestId}-label` })
-  ] })
-);
-SegmentedView.displayName = "ProgressSegmentedView";
-var LinearView = React.forwardRef(
-  ({ size, color, glow, pulse, showLabel, displayValue, displayLabel, value, dataTestId, variant, ...props }, ref) => /* @__PURE__ */ jsxs(Box, { ref, sx: { width: "100%" }, "data-testid": dataTestId, children: [
-    /* @__PURE__ */ jsx(
-      StyledLinearProgress,
-      {
-        variant: value !== void 0 ? "determinate" : "indeterminate",
-        value: displayValue,
-        customVariant: variant,
-        customSize: size,
-        customColor: color,
-        glow,
-        pulse,
-        "data-testid": `${dataTestId}-linear`,
-        ...props
-      }
-    ),
-    showLabel && /* @__PURE__ */ jsx(ProgressLabel, { size, label: displayLabel, testId: `${dataTestId}-label` })
-  ] })
-);
-LinearView.displayName = "ProgressLinearView";
-var Progress = React.forwardRef(
-  (rawProps, ref) => {
-    const {
-      variant,
-      size,
-      color,
-      glow,
-      pulse,
-      showLabel,
-      label,
-      segments,
-      thickness,
-      circularSize,
-      value,
-      dataTestId,
-      // LinearProgressProps carries a `ref` typed for its own element; the
-      // forwarded one below is the ref that matters.
-      ref: _ref,
-      ...props
-    } = resolveProgressProps(rawProps);
-    const displayValue = value || 0;
-    const shared = {
-      size,
-      color,
-      glow,
-      pulse,
-      showLabel,
-      displayValue,
-      displayLabel: label || (showLabel ? `${Math.round(displayValue)}%` : ""),
-      value,
-      dataTestId,
-      ...props
-    };
-    if (variant === "circular") {
-      return /* @__PURE__ */ jsx(CircularView, { ref, ...shared, thickness, circularSize });
-    }
-    if (variant === "segmented") {
-      return /* @__PURE__ */ jsx(SegmentedView, { ref, ...shared, segments });
-    }
-    return /* @__PURE__ */ jsx(LinearView, { ref, ...shared, variant });
-  }
-);
-Progress.displayName = "Progress";
-
-export {
-  Progress
-};
-//# sourceMappingURL=chunk-KPQAPQH6.js.map