@etus/ui 0.4.0-beta.2 → 0.4.0-beta.21

package/dist/chunk-5ETVWWA5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/advanced/ErrorBoundary/ErrorBoundary.tsx","../src/components/advanced/ErrorBoundary/ErrorBoundary.variants.ts"],"names":[],"mappings":";;;;;AAaA,SAAS,eAAA,CAAgB,EAAE,KAAA,EAAO,kBAAA,EAAmB,EAAkB;AACrE,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT;AAAA,OACF;AAAA,MACA,WAAA,EAAU,WAAA;AAAA,MACV,WAAA,EAAU,yBAAA;AAAA,MACV,IAAA,EAAK,OAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,kBAAA,EACb,QAAA,kBAAA,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,aAAA,EAAY,MAAA;AAAA,YACZ,SAAA,EAAU,SAAA;AAAA,YACV,IAAA,EAAK,MAAA;AAAA,YACL,MAAA,EAAO,cAAA;AAAA,YACP,aAAA,EAAc,OAAA;AAAA,YACd,cAAA,EAAe,OAAA;AAAA,YACf,WAAA,EAAY,GAAA;AAAA,YACZ,OAAA,EAAQ,WAAA;AAAA,YACR,KAAA,EAAM,4BAAA;AAAA,YAEN,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,YAAO,EAAA,EAAG,IAAA,EAAK,EAAA,EAAG,IAAA,EAAK,GAAE,IAAA,EAAK,CAAA;AAAA,8BAC/B,GAAA,CAAC,UAAK,EAAA,EAAG,IAAA,EAAK,IAAG,IAAA,EAAK,EAAA,EAAG,GAAA,EAAI,EAAA,EAAG,IAAA,EAAK,CAAA;AAAA,8BACrC,GAAA,CAAC,UAAK,EAAA,EAAG,IAAA,EAAK,IAAG,OAAA,EAAQ,EAAA,EAAG,IAAA,EAAK,EAAA,EAAG,IAAA,EAAK;AAAA;AAAA;AAAA,SAC3C,EACF,CAAA;AAAA,wBACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,wCAAA,EAAyC,QAAA,EAAA,sBAAA,EAEvD,CAAA;AAAA,8BACC,GAAA,EAAA,EAAE,SAAA,EAAU,+BAAA,EACV,QAAA,EAAA,KAAA,CAAM,WAAW,8BAAA,EACpB;AAAA,SAAA,EACF,CAAA;AAAA,wBACA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,EAAA;AAAA,cACT,qKAAA;AAAA,cACA;AAAA,aACF;AAAA,YACA,WAAA,EAAU,6BAAA;AAAA,YACV,IAAA,EAAK,QAAA;AAAA,YACL,OAAA,EAAS,kBAAA;AAAA,YACV,QAAA,EAAA;AAAA;AAAA;AAED;AAAA;AAAA,GACF;AAEJ;AAyBA,IAAM,aAAA,GAAN,cAA4B,SAAA,CAAkD;AAAA,EAC5E,YAAY,KAAA,EAA2B;AACrC,IAAA,KAAA,CAAM,KAAK,CAAA;AACX,IAAA,IAAA,CAAK,KAAA,GAAQ;AAAA,MACX,KAAA,EAAO,IAAA;AAAA,MACP,QAAA,EAAU;AAAA,KACZ;AAAA,EACF;AAAA,EAEA,OAAO,yBAAyB,KAAA,EAAkC;AAChE,IAAA,OAAO;AAAA,MACL,KAAA;AAAA,MACA,QAAA,EAAU;AAAA,KACZ;AAAA,EACF;AAAA,EAES,iBAAA,CAAkB,OAAc,SAAA,EAA4B;AACnE,IAAA,MAAM,EAAE,OAAA,EAAQ,GAAI,IAAA,CAAK,KAAA;AACzB,IAAA,OAAA,GAAU,OAAO,SAAS,CAAA;AAAA,EAC5B;AAAA,EAES,mBAAmB,SAAA,EAAqC;AAC/D,IAAA,MAAM,EAAE,SAAA,EAAU,GAAI,IAAA,CAAK,KAAA;AAC3B,IAAA,MAAM,EAAE,QAAA,EAAS,GAAI,IAAA,CAAK,KAAA;AAE1B,IAAA,IAAI,QAAA,IAAY,SAAA,CAAU,SAAA,KAAc,SAAA,EAAW;AAEjD,MAAA,IAAI,SAAA,IAAa,UAAU,SAAA,EAAW;AACpC,QAAA,MAAM,gBAAgB,SAAA,CAAU,IAAA;AAAA,UAC9B,CAAC,GAAA,EAAK,KAAA,KAAU,SAAA,CAAU,SAAA,GAAY,KAAK,CAAA,KAAM;AAAA,SACnD;AACA,QAAA,IAAI,aAAA,EAAe;AACjB,UAAA,IAAA,CAAK,KAAA,EAAM;AAAA,QACb;AAAA,MACF,CAAA,MAAA,IAAW,SAAA,KAAc,SAAA,CAAU,SAAA,EAAW;AAC5C,QAAA,IAAA,CAAK,KAAA,EAAM;AAAA,MACb;AAAA,IACF;AAAA,EACF;AAAA,EAEA,QAAQ,MAAY;AAClB,IAAA,MAAM,EAAE,OAAA,EAAQ,GAAI,IAAA,CAAK,KAAA;AACzB,IAAA,OAAA,IAAU;AACV,IAAA,IAAA,CAAK,QAAA,CAAS;AAAA,MACZ,KAAA,EAAO,IAAA;AAAA,MACP,QAAA,EAAU;AAAA,KACX,CAAA;AAAA,EACH,CAAA;AAAA,EAES,MAAA,GAAoB;AAC3B,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,QAAA,EAAU,iBAAA,KAAsB,IAAA,CAAK,KAAA;AAClE,IAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAS,GAAI,IAAA,CAAK,KAAA;AAEjC,IAAA,IAAI,YAAY,KAAA,EAAO;AACrB,MAAA,MAAM,aAAA,GAA+B;AAAA,QACnC,KAAA;AAAA,QACA,oBAAoB,IAAA,CAAK;AAAA,OAC3B;AAGA,MAAA,IAAI,iBAAA,EAAmB;AACrB,QAAA,uBACE,GAAA,CAAC,SAAI,SAAA,EAAsB,WAAA,EAAU,kBACnC,QAAA,kBAAA,GAAA,CAAC,iBAAA,EAAA,EAAmB,GAAG,aAAA,EAAe,CAAA,EACxC,CAAA;AAAA,MAEJ;AAEA,MAAA,IAAI,OAAO,aAAa,UAAA,EAAY;AAClC,QAAA,MAAM,cAAA,GAAiB,QAAA;AACvB,QAAA,2BACG,KAAA,EAAA,EAAI,SAAA,EAAsB,aAAU,gBAAA,EAClC,QAAA,EAAA,cAAA,CAAe,aAAa,CAAA,EAC/B,CAAA;AAAA,MAEJ;AAEA,MAAA,IAAI,aAAa,MAAA,EAAW;AAC1B,QAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAsB,WAAA,EAAU,kBAClC,QAAA,EAAA,QAAA,EACH,CAAA;AAAA,MAEJ;AAGA,MAAA,uBACE,GAAA,CAAC,SAAI,SAAA,EAAsB,WAAA,EAAU,kBACnC,QAAA,kBAAA,GAAA,CAAC,eAAA,EAAA,EAAiB,GAAG,aAAA,EAAe,CAAA,EACtC,CAAA;AAAA,IAEJ;AAEA,IAAA,OAAO,QAAA;AAAA,EACT;AACF;AChLO,IAAM,6BAAA,GAAgC,GAAA;AAAA,EAC3C,uDAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,WAAA;AAAA,QACT,QAAA,EAAU,WAAA;AAAA,QACV,MAAA,EAAQ,WAAA;AAAA,QACR,UAAA,EAAY;AAAA,OACd;AAAA,MACA,QAAA,EAAU;AAAA,QACR,KAAA,EAAO,kBAAA;AAAA,QACP,OAAA,EAAS,cAAA;AAAA,QACT,IAAA,EAAM;AAAA;AACR,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,UAAA;AAAA,MACT,QAAA,EAAU;AAAA;AACZ;AAEJ;AAKO,IAAM,yBAAA,GAA4B,GAAA;AAAA,EACvC,qCAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,eAAA;AAAA,QACT,QAAA,EAAU,wCAAA;AAAA,QACV,MAAA,EAAQ,wCAAA;AAAA,QACR,UAAA,EAAY;AAAA;AACd,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS;AAAA;AACX;AAEJ;AAKO,IAAM,yBAAA,GAA4B,GAAA;AAAA,EACvC,UAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,SAAA;AAAA,QACJ,EAAA,EAAI,WAAA;AAAA,QACJ,EAAA,EAAI;AAAA,OACN;AAAA,MACA,QAAA,EAAU;AAAA,QACR,KAAA,EAAO,kBAAA;AAAA,QACP,OAAA,EAAS,cAAA;AAAA,QACT,IAAA,EAAM;AAAA;AACR,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM,IAAA;AAAA,MACN,QAAA,EAAU;AAAA;AACZ;AAEJ;AAKO,IAAM,0BAAA,GAA6B,GAAA;AAAA,EACxC,eAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,WAAA;AAAA,QACJ,EAAA,EAAI,SAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM;AAAA;AACR;AAEJ;AAKO,IAAM,4BAAA,GAA+B,GAAA;AAAA,EAC1C,uBAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,SAAA;AAAA,QACJ,EAAA,EAAI,SAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,IAAA,EAAM;AAAA;AACR;AAEJ;AAKO,IAAM,0BAAA,GAA6B,GAAA;AAAA,EACxC,gGAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,SAAA,EAAW;AAAA,QACT,IAAA,EAAM,UAAA;AAAA,QACN,KAAA,EAAO;AAAA;AACT,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,SAAA,EAAW;AAAA;AACb;AAEJ;AAKO,IAAM,2BAAA,GAA8B,GAAA;AAAA,EACzC,gKAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,wDAAA;AAAA,QACT,OAAA,EAAS,gFAAA;AAAA,QACT,KAAA,EAAO;AAAA,OACT;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,EAAA,EAAI,kBAAA;AAAA,QACJ,EAAA,EAAI,kBAAA;AAAA,QACJ,EAAA,EAAI;AAAA;AACN,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,SAAA;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ","file":"chunk-5ETVWWA5.js","sourcesContent":["import type {\n  ErrorBoundaryProps,\n  ErrorBoundaryState,\n  FallbackProps,\n} from \"./ErrorBoundary.types\"\n\nimport { Component, type ErrorInfo, type ReactNode } from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\n\n/**\n * Default fallback UI shown when an error occurs and no custom fallback is provided\n */\nfunction DefaultFallback({ error, resetErrorBoundary }: FallbackProps) {\n  return (\n    <div\n      className={cn(\n        \"flex flex-col items-center justify-center gap-4 rounded-lg border border-destructive bg-destructive/10 p-6\"\n      )}\n      aria-live=\"assertive\"\n      data-slot=\"error-boundary-fallback\"\n      role=\"alert\"\n    >\n      <div className=\"text-destructive\">\n        <svg\n          aria-hidden=\"true\"\n          className=\"size-12\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth=\"2\"\n          viewBox=\"0 0 24 24\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <circle cx=\"12\" cy=\"12\" r=\"10\" />\n          <line x1=\"12\" x2=\"12\" y1=\"8\" y2=\"12\" />\n          <line x1=\"12\" x2=\"12.01\" y1=\"16\" y2=\"16\" />\n        </svg>\n      </div>\n      <div className=\"space-y-2 text-center\">\n        <h2 className=\"text-lg font-semibold text-destructive\">\n          Something went wrong\n        </h2>\n        <p className=\"text-sm text-muted-foreground\">\n          {error.message || \"An unexpected error occurred\"}\n        </p>\n      </div>\n      <button\n        className={cn(\n          \"inline-flex h-9 items-center justify-center gap-2 rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/90\",\n          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\"\n        )}\n        data-slot=\"error-boundary-reset-button\"\n        type=\"button\"\n        onClick={resetErrorBoundary}\n      >\n        Try again\n      </button>\n    </div>\n  )\n}\n\n/**\n * ErrorBoundary catches JavaScript errors in child component trees,\n * logs them, and displays a fallback UI instead of crashing the whole app.\n *\n * @example\n * ```tsx\n * <ErrorBoundary fallback={<p>Something went wrong</p>}>\n *   <MyComponent />\n * </ErrorBoundary>\n * ```\n *\n * @example\n * ```tsx\n * <ErrorBoundary\n *   FallbackComponent={ErrorFallback}\n *   onError={(error, info) => logError(error, info)}\n *   onReset={() => resetAppState()}\n *   resetKeys={[userId]}\n * >\n *   <Dashboard />\n * </ErrorBoundary>\n * ```\n */\nclass ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {\n  constructor(props: ErrorBoundaryProps) {\n    super(props)\n    this.state = {\n      error: null,\n      hasError: false,\n    }\n  }\n\n  static getDerivedStateFromError(error: Error): ErrorBoundaryState {\n    return {\n      error,\n      hasError: true,\n    }\n  }\n\n  override componentDidCatch(error: Error, errorInfo: ErrorInfo): void {\n    const { onError } = this.props\n    onError?.(error, errorInfo)\n  }\n\n  override componentDidUpdate(prevProps: ErrorBoundaryProps): void {\n    const { resetKeys } = this.props\n    const { hasError } = this.state\n\n    if (hasError && prevProps.resetKeys !== resetKeys) {\n      // Check if any resetKey changed\n      if (resetKeys && prevProps.resetKeys) {\n        const hasKeyChanged = resetKeys.some(\n          (key, index) => prevProps.resetKeys?.[index] !== key\n        )\n        if (hasKeyChanged) {\n          this.reset()\n        }\n      } else if (resetKeys !== prevProps.resetKeys) {\n        this.reset()\n      }\n    }\n  }\n\n  reset = (): void => {\n    const { onReset } = this.props\n    onReset?.()\n    this.setState({\n      error: null,\n      hasError: false,\n    })\n  }\n\n  override render(): ReactNode {\n    const { children, className, fallback, FallbackComponent } = this.props\n    const { error, hasError } = this.state\n\n    if (hasError && error) {\n      const fallbackProps: FallbackProps = {\n        error,\n        resetErrorBoundary: this.reset,\n      }\n\n      // Priority: FallbackComponent > fallback function > fallback node > DefaultFallback\n      if (FallbackComponent) {\n        return (\n          <div className={className} data-slot=\"error-boundary\">\n            <FallbackComponent {...fallbackProps} />\n          </div>\n        )\n      }\n\n      if (typeof fallback === \"function\") {\n        const renderFallback = fallback\n        return (\n          <div className={className} data-slot=\"error-boundary\">\n            {renderFallback(fallbackProps)}\n          </div>\n        )\n      }\n\n      if (fallback !== undefined) {\n        return (\n          <div className={className} data-slot=\"error-boundary\">\n            {fallback}\n          </div>\n        )\n      }\n\n      // Default fallback\n      return (\n        <div className={className} data-slot=\"error-boundary\">\n          <DefaultFallback {...fallbackProps} />\n        </div>\n      )\n    }\n\n    return children\n  }\n}\n\nexport { DefaultFallback, ErrorBoundary }\n","import { cva } from \"class-variance-authority\"\n\n/**\n * ErrorBoundary fallback container variants\n */\nexport const errorBoundaryFallbackVariants = cva(\n  \"flex flex-col items-center justify-center text-center\",\n  {\n    variants: {\n      variant: {\n        minimal: \"p-4 gap-2\",\n        detailed: \"p-6 gap-4\",\n        action: \"p-6 gap-4\",\n        fullscreen: \"min-h-screen p-8 gap-6\",\n      },\n      severity: {\n        error: \"text-destructive\",\n        warning: \"text-warning\",\n        info: \"text-muted-foreground\",\n      },\n    },\n    defaultVariants: {\n      variant: \"detailed\",\n      severity: \"error\",\n    },\n  }\n)\n\n/**\n * ErrorBoundary fallback card variants\n */\nexport const errorBoundaryCardVariants = cva(\n  \"rounded-lg border bg-background p-6\",\n  {\n    variants: {\n      variant: {\n        minimal: \"border-border\",\n        detailed: \"border-destructive/50 bg-destructive/5\",\n        action: \"border-destructive/50 bg-destructive/5\",\n        fullscreen: \"border-destructive/50 bg-destructive/5 max-w-md w-full\",\n      },\n    },\n    defaultVariants: {\n      variant: \"detailed\",\n    },\n  }\n)\n\n/**\n * ErrorBoundary icon variants\n */\nexport const errorBoundaryIconVariants = cva(\n  \"shrink-0\",\n  {\n    variants: {\n      size: {\n        sm: \"h-8 w-8\",\n        md: \"h-12 w-12\",\n        lg: \"h-16 w-16\",\n      },\n      severity: {\n        error: \"text-destructive\",\n        warning: \"text-warning\",\n        info: \"text-muted-foreground\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n      severity: \"error\",\n    },\n  }\n)\n\n/**\n * ErrorBoundary title variants\n */\nexport const errorBoundaryTitleVariants = cva(\n  \"font-semibold\",\n  {\n    variants: {\n      size: {\n        sm: \"text-base\",\n        md: \"text-lg\",\n        lg: \"text-xl\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\n/**\n * ErrorBoundary message variants\n */\nexport const errorBoundaryMessageVariants = cva(\n  \"text-muted-foreground\",\n  {\n    variants: {\n      size: {\n        sm: \"text-xs\",\n        md: \"text-sm\",\n        lg: \"text-base\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\n/**\n * ErrorBoundary stack trace variants\n */\nexport const errorBoundaryStackVariants = cva(\n  \"w-full overflow-auto rounded-md bg-muted p-4 text-left font-mono text-xs text-muted-foreground\",\n  {\n    variants: {\n      collapsed: {\n        true: \"max-h-24\",\n        false: \"max-h-64\",\n      },\n    },\n    defaultVariants: {\n      collapsed: true,\n    },\n  }\n)\n\n/**\n * ErrorBoundary action button variants\n */\nexport const errorBoundaryActionVariants = cva(\n  \"inline-flex items-center justify-center gap-2 rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n  {\n    variants: {\n      variant: {\n        primary: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        outline: \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n        ghost: \"hover:bg-accent hover:text-accent-foreground\",\n      },\n      size: {\n        sm: \"h-8 px-3 text-sm\",\n        md: \"h-9 px-4 text-sm\",\n        lg: \"h-10 px-6 text-base\",\n      },\n    },\n    defaultVariants: {\n      variant: \"primary\",\n      size: \"md\",\n    },\n  }\n)\n"]}

package/dist/chunk-5GV4LDX7.js

@@ -0,0 +1,305 @@
+import { Tooltip, TooltipTrigger, TooltipContent } from './chunk-TEVGCTUN.js';
+import { cn } from './chunk-RVAYDRMA.js';
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var PROGRESS_CIRCLE_SIZES = {
+  xxs: { diameter: 64, strokeWidth: 4, fontSize: "text-sm", labelSize: "text-xs" },
+  xs: { diameter: 160, strokeWidth: 8, fontSize: "text-2xl", labelSize: "text-sm" },
+  sm: { diameter: 200, strokeWidth: 10, fontSize: "text-3xl", labelSize: "text-sm" },
+  md: { diameter: 240, strokeWidth: 12, fontSize: "text-4xl", labelSize: "text-base" },
+  lg: { diameter: 280, strokeWidth: 14, fontSize: "text-5xl", labelSize: "text-base" }
+};
+var progressCircleContainerVariants = cva(
+  "relative inline-flex items-center justify-center",
+  {
+    variants: {
+      size: {
+        xxs: "w-[var(--progress-circle-size-xxs-diameter)] h-[var(--progress-circle-size-xxs-diameter)]",
+        xs: "w-[var(--progress-circle-size-xs-diameter)] h-[var(--progress-circle-size-xs-diameter)]",
+        sm: "w-[var(--progress-circle-size-sm-diameter)] h-[var(--progress-circle-size-sm-diameter)]",
+        md: "w-[var(--progress-circle-size-md-diameter)] h-[var(--progress-circle-size-md-diameter)]",
+        lg: "w-[var(--progress-circle-size-lg-diameter)] h-[var(--progress-circle-size-lg-diameter)]"
+      },
+      shape: {
+        circle: "",
+        "half-circle": "!h-auto"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      shape: "circle"
+    }
+  }
+);
+var progressCircleTrackVariants = cva(
+  "transition-colors",
+  {
+    variants: {
+      color: {
+        default: "stroke-[color:var(--progress-circle-track-color-default)]",
+        primary: "stroke-[color:var(--progress-circle-track-color-primary)]",
+        success: "stroke-[color:var(--progress-circle-track-color-success)]",
+        warning: "stroke-[color:var(--progress-circle-track-color-warning)]",
+        error: "stroke-[color:var(--progress-circle-track-color-error)]"
+      }
+    },
+    defaultVariants: {
+      color: "default"
+    }
+  }
+);
+var progressCircleIndicatorVariants = cva(
+  "transition-all duration-700 ease-out motion-reduce:transition-none",
+  {
+    variants: {
+      color: {
+        default: "stroke-[color:var(--progress-circle-indicator-color-default)]",
+        primary: "stroke-[color:var(--progress-circle-indicator-color-primary)]",
+        success: "stroke-[color:var(--progress-circle-indicator-color-success)]",
+        warning: "stroke-[color:var(--progress-circle-indicator-color-warning)]",
+        error: "stroke-[color:var(--progress-circle-indicator-color-error)]"
+      },
+      indeterminate: {
+        true: "animate-spin origin-center",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      color: "default",
+      indeterminate: false
+    }
+  }
+);
+var progressCircleValueVariants = cva(
+  "font-[var(--progress-circle-value-font-weight)] tabular-nums text-[color:var(--progress-circle-value-color)]",
+  {
+    variants: {
+      size: {
+        xxs: "text-sm",
+        xs: "text-2xl",
+        sm: "text-3xl",
+        md: "text-4xl",
+        lg: "text-5xl"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var progressCircleLabelVariants = cva(
+  "text-[color:var(--progress-circle-label-color)]",
+  {
+    variants: {
+      size: {
+        xxs: "text-xs",
+        xs: "text-sm",
+        sm: "text-sm",
+        md: "text-base",
+        lg: "text-base"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var defaultFormatValue = (value) => `${String(value)}%`;
+function ProgressCircle({
+  value = 0,
+  max = 100,
+  indeterminate = false,
+  size = "md",
+  shape = "circle",
+  color = "default",
+  label,
+  formatValue = defaultFormatValue,
+  showValue = true,
+  radius: customRadius,
+  strokeWidth: customStrokeWidth,
+  className,
+  animate = true,
+  tooltip,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledby
+}) {
+  const clampedRawValue = Math.min(max, Math.max(0, value));
+  const clampedValue = clampedRawValue / max * 100;
+  const [isVisible, setIsVisible] = React.useState(!animate || indeterminate);
+  const containerRef = React.useRef(null);
+  React.useEffect(() => {
+    if (!animate || indeterminate || isVisible) {
+      return;
+    }
+    const element = containerRef.current;
+    if (!element) {
+      return;
+    }
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const entry = entries[0];
+        if (entry?.isIntersecting) {
+          requestAnimationFrame(() => {
+            setIsVisible(true);
+          });
+          observer.disconnect();
+        }
+      },
+      { threshold: 0.1 }
+    );
+    observer.observe(element);
+    return () => {
+      observer.disconnect();
+    };
+  }, [animate, indeterminate, isVisible]);
+  const sizeConfig = PROGRESS_CIRCLE_SIZES[size];
+  const strokeWidth = customStrokeWidth ?? sizeConfig.strokeWidth;
+  const diameter = customRadius ? customRadius * 2 + strokeWidth : sizeConfig.diameter;
+  const radius = (diameter - strokeWidth) / 2;
+  const center = diameter / 2;
+  const isHalfCircle = shape === "half-circle";
+  const circumference = isHalfCircle ? Math.PI * radius : 2 * Math.PI * radius;
+  const displayValue = indeterminate ? 25 : isVisible ? clampedValue : 0;
+  const progressOffset = circumference - displayValue / 100 * circumference;
+  const viewBoxHeight = isHalfCircle ? diameter / 2 + strokeWidth : diameter;
+  const getPath = () => {
+    if (isHalfCircle) {
+      const startX = strokeWidth / 2;
+      const startY = center;
+      const endX = diameter - strokeWidth / 2;
+      const endY = center;
+      return `M ${String(startX)} ${String(startY)} A ${String(radius)} ${String(radius)} 0 0 1 ${String(endX)} ${String(endY)}`;
+    }
+    return;
+  };
+  const formattedValue = formatValue(clampedRawValue);
+  const progressCircleElement = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn(
+        progressCircleContainerVariants({ size, shape }),
+        className
+      ),
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledby,
+      "aria-valuemax": max,
+      "aria-valuemin": 0,
+      "aria-valuenow": indeterminate ? void 0 : clampedRawValue,
+      "data-indeterminate": indeterminate || void 0,
+      "data-slot": "progress-circle",
+      role: "progressbar",
+      children: [
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            className: isHalfCircle ? "rotate-0" : "",
+            "data-slot": "progress-circle-svg",
+            height: viewBoxHeight,
+            viewBox: `0 0 ${String(diameter)} ${String(viewBoxHeight)}`,
+            width: diameter,
+            children: isHalfCircle ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                "path",
+                {
+                  className: cn(progressCircleTrackVariants({ color })),
+                  d: getPath(),
+                  "data-slot": "progress-circle-track",
+                  fill: "none",
+                  strokeLinecap: "round",
+                  strokeWidth
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "path",
+                {
+                  className: cn(progressCircleIndicatorVariants({ color })),
+                  d: getPath(),
+                  "data-slot": "progress-circle-indicator",
+                  fill: "none",
+                  strokeDasharray: circumference,
+                  strokeDashoffset: progressOffset,
+                  strokeLinecap: "round",
+                  strokeWidth
+                }
+              )
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  className: cn(progressCircleTrackVariants({ color })),
+                  cx: center,
+                  cy: center,
+                  "data-slot": "progress-circle-track",
+                  fill: "none",
+                  r: radius,
+                  strokeWidth
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  style: {
+                    transform: indeterminate ? void 0 : "rotate(-90deg)",
+                    transformOrigin: "center"
+                  },
+                  className: cn(progressCircleIndicatorVariants({ color, indeterminate })),
+                  cx: center,
+                  cy: center,
+                  "data-slot": "progress-circle-indicator",
+                  fill: "none",
+                  r: radius,
+                  strokeDasharray: circumference,
+                  strokeDashoffset: progressOffset,
+                  strokeLinecap: "round",
+                  strokeWidth
+                }
+              )
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "absolute flex flex-col items-center justify-center",
+              isHalfCircle && "bottom-0"
+            ),
+            "data-slot": "progress-circle-content",
+            children: [
+              showValue && !indeterminate && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(progressCircleValueVariants({ size })),
+                  "data-slot": "progress-circle-value",
+                  children: formattedValue
+                }
+              ),
+              label && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(progressCircleLabelVariants({ size })),
+                  "data-slot": "progress-circle-label",
+                  children: label
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+  if (tooltip) {
+    return /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: progressCircleElement }),
+      /* @__PURE__ */ jsx(TooltipContent, { children: tooltip })
+    ] });
+  }
+  return progressCircleElement;
+}
+
+export { PROGRESS_CIRCLE_SIZES, ProgressCircle, progressCircleContainerVariants, progressCircleIndicatorVariants, progressCircleLabelVariants, progressCircleTrackVariants, progressCircleValueVariants };
+//# sourceMappingURL=chunk-5GV4LDX7.js.map
+//# sourceMappingURL=chunk-5GV4LDX7.js.map

package/dist/chunk-5GV4LDX7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/ProgressCircle/ProgressCircle.variants.ts","../src/components/primitives/ProgressCircle/ProgressCircle.tsx"],"names":[],"mappings":"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","file":"chunk-5GV4LDX7.js","sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\"\n\n/**\n * Size configuration for ProgressCircle\n * Maps size variant to actual pixel dimensions and stroke widths.\n *\n * Values are synced with CSS variables from @etus/tokens:\n * - --progress-circle-size-{size}-diameter\n * - --progress-circle-size-{size}-stroke-width\n *\n * Numeric values are required here for SVG attribute calculations\n * (radius, circumference, path coordinates).\n */\nexport const PROGRESS_CIRCLE_SIZES = {\n  xxs: { diameter: 64, strokeWidth: 4, fontSize: \"text-sm\", labelSize: \"text-xs\" },\n  xs: { diameter: 160, strokeWidth: 8, fontSize: \"text-2xl\", labelSize: \"text-sm\" },\n  sm: { diameter: 200, strokeWidth: 10, fontSize: \"text-3xl\", labelSize: \"text-sm\" },\n  md: { diameter: 240, strokeWidth: 12, fontSize: \"text-4xl\", labelSize: \"text-base\" },\n  lg: { diameter: 280, strokeWidth: 14, fontSize: \"text-5xl\", labelSize: \"text-base\" },\n} as const\n\n/**\n * Container variants for the progress circle\n * Uses CSS custom properties from @etus/tokens for sizing\n */\nexport const progressCircleContainerVariants = cva(\n  \"relative inline-flex items-center justify-center\",\n  {\n    variants: {\n      size: {\n        xxs: \"w-[var(--progress-circle-size-xxs-diameter)] h-[var(--progress-circle-size-xxs-diameter)]\",\n        xs: \"w-[var(--progress-circle-size-xs-diameter)] h-[var(--progress-circle-size-xs-diameter)]\",\n        sm: \"w-[var(--progress-circle-size-sm-diameter)] h-[var(--progress-circle-size-sm-diameter)]\",\n        md: \"w-[var(--progress-circle-size-md-diameter)] h-[var(--progress-circle-size-md-diameter)]\",\n        lg: \"w-[var(--progress-circle-size-lg-diameter)] h-[var(--progress-circle-size-lg-diameter)]\",\n      },\n      shape: {\n        circle: \"\",\n        \"half-circle\": \"!h-auto\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n      shape: \"circle\",\n    },\n  }\n)\n\n/**\n * Track (background circle) color variants\n */\nexport const progressCircleTrackVariants = cva(\n  \"transition-colors\",\n  {\n    variants: {\n      color: {\n        default: \"stroke-[color:var(--progress-circle-track-color-default)]\",\n        primary: \"stroke-[color:var(--progress-circle-track-color-primary)]\",\n        success: \"stroke-[color:var(--progress-circle-track-color-success)]\",\n        warning: \"stroke-[color:var(--progress-circle-track-color-warning)]\",\n        error: \"stroke-[color:var(--progress-circle-track-color-error)]\",\n      },\n    },\n    defaultVariants: {\n      color: \"default\",\n    },\n  }\n)\n\n/**\n * Indicator (progress arc) color variants\n */\nexport const progressCircleIndicatorVariants = cva(\n  \"transition-all duration-700 ease-out motion-reduce:transition-none\",\n  {\n    variants: {\n      color: {\n        default: \"stroke-[color:var(--progress-circle-indicator-color-default)]\",\n        primary: \"stroke-[color:var(--progress-circle-indicator-color-primary)]\",\n        success: \"stroke-[color:var(--progress-circle-indicator-color-success)]\",\n        warning: \"stroke-[color:var(--progress-circle-indicator-color-warning)]\",\n        error: \"stroke-[color:var(--progress-circle-indicator-color-error)]\",\n      },\n      indeterminate: {\n        true: \"animate-spin origin-center\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      color: \"default\",\n      indeterminate: false,\n    },\n  }\n)\n\n/**\n * Value text variants (percentage in center)\n */\nexport const progressCircleValueVariants = cva(\n  \"font-[var(--progress-circle-value-font-weight)] tabular-nums text-[color:var(--progress-circle-value-color)]\",\n  {\n    variants: {\n      size: {\n        xxs: \"text-sm\",\n        xs: \"text-2xl\",\n        sm: \"text-3xl\",\n        md: \"text-4xl\",\n        lg: \"text-5xl\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\n/**\n * Label text variants (below percentage)\n */\nexport const progressCircleLabelVariants = cva(\n  \"text-[color:var(--progress-circle-label-color)]\",\n  {\n    variants: {\n      size: {\n        xxs: \"text-xs\",\n        xs: \"text-sm\",\n        sm: \"text-sm\",\n        md: \"text-base\",\n        lg: \"text-base\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\nexport type ProgressCircleContainerVariants = VariantProps<typeof progressCircleContainerVariants>\nexport type ProgressCircleTrackVariants = VariantProps<typeof progressCircleTrackVariants>\nexport type ProgressCircleIndicatorVariants = VariantProps<typeof progressCircleIndicatorVariants>\n","\"use client\"\n\nimport type { ProgressCircleProps } from \"./ProgressCircle.types\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../../feedback/Tooltip\"\nimport {\n  PROGRESS_CIRCLE_SIZES,\n  progressCircleContainerVariants,\n  progressCircleIndicatorVariants,\n  progressCircleLabelVariants,\n  progressCircleTrackVariants,\n  progressCircleValueVariants,\n} from \"./ProgressCircle.variants\"\n\n/**\n * Default format function for progress value\n */\nconst defaultFormatValue = (value: number): string => `${String(value)}%`\n\n/**\n * ProgressCircle component for displaying circular progress indicators.\n *\n * Built with SVG for smooth rendering and full accessibility support.\n * Supports multiple sizes, shapes (full circle and half-circle),\n * color variants, and optional labels.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <ProgressCircle value={75} />\n *\n * // With label\n * <ProgressCircle value={60} label=\"Active users\" />\n *\n * // Half-circle variant\n * <ProgressCircle value={80} shape=\"half-circle\" />\n *\n * // Different sizes and colors\n * <ProgressCircle value={50} size=\"lg\" color=\"warning\" />\n * ```\n */\nfunction ProgressCircle({\n  value = 0,\n  max = 100,\n  indeterminate = false,\n  size = \"md\",\n  shape = \"circle\",\n  color = \"default\",\n  label,\n  formatValue = defaultFormatValue,\n  showValue = true,\n  radius: customRadius,\n  strokeWidth: customStrokeWidth,\n  className,\n  animate = true,\n  tooltip,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledby,\n}: ProgressCircleProps) {\n  // Clamp the raw value between 0 and max first\n  const clampedRawValue = Math.min(max, Math.max(0, value))\n\n  // Calculate percentage based on clamped value and max\n  const clampedValue = (clampedRawValue / max) * 100\n\n  // Animation state - initialize based on animate and indeterminate props\n  const [isVisible, setIsVisible] = React.useState(!animate || indeterminate)\n  const containerRef = React.useRef<HTMLDivElement>(null)\n\n  // Use IntersectionObserver to trigger animation only when in viewport\n  React.useEffect(() => {\n    // Skip if not animating, indeterminate, or already visible\n    if (!animate || indeterminate || isVisible) {\n      return\n    }\n\n    const element = containerRef.current\n    if (!element) {\n      return\n    }\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        const entry = entries[0]\n        if (entry?.isIntersecting) {\n          requestAnimationFrame(() => {\n            setIsVisible(true)\n          })\n          observer.disconnect()\n        }\n      },\n      { threshold: 0.1 }\n    )\n\n    observer.observe(element)\n\n    return () => { observer.disconnect(); }\n  }, [animate, indeterminate, isVisible])\n\n  // Get size configuration\n  const sizeConfig = PROGRESS_CIRCLE_SIZES[size]\n  const strokeWidth = customStrokeWidth ?? sizeConfig.strokeWidth\n  // Use custom radius if provided, otherwise use size preset\n  const diameter = customRadius ? (customRadius * 2 + strokeWidth) : sizeConfig.diameter\n\n  // Calculate SVG dimensions\n  const radius = (diameter - strokeWidth) / 2\n  const center = diameter / 2\n\n  // Calculate circumference and progress\n  const isHalfCircle = shape === \"half-circle\"\n  const circumference = isHalfCircle ? Math.PI * radius : 2 * Math.PI * radius\n\n  // For indeterminate, show ~25% of the arc; otherwise use the actual value\n  // For animation, start at 0 and animate to the target value when visible\n  const displayValue = indeterminate ? 25 : (isVisible ? clampedValue : 0)\n  const progressOffset = circumference - (displayValue / 100) * circumference\n\n  // SVG viewBox and path calculations\n  const viewBoxHeight = isHalfCircle ? diameter / 2 + strokeWidth : diameter\n\n  // For half-circle, we use an arc path instead of a circle\n  const getPath = () => {\n    if (isHalfCircle) {\n      // Arc from left to right (180 degrees at top)\n      const startX = strokeWidth / 2\n      const startY = center\n      const endX = diameter - strokeWidth / 2\n      const endY = center\n      return `M ${String(startX)} ${String(startY)} A ${String(radius)} ${String(radius)} 0 0 1 ${String(endX)} ${String(endY)}`\n    }\n    return\n  }\n\n  // Format the clamped value for display\n  const formattedValue = formatValue(clampedRawValue)\n\n  const progressCircleElement = (\n    <div\n      ref={containerRef}\n      className={cn(\n        progressCircleContainerVariants({ size, shape }),\n        className\n      )}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledby}\n      aria-valuemax={max}\n      aria-valuemin={0}\n      aria-valuenow={indeterminate ? undefined : clampedRawValue}\n      data-indeterminate={indeterminate || undefined}\n      data-slot=\"progress-circle\"\n      role=\"progressbar\"\n    >\n      <svg\n        className={isHalfCircle ? \"rotate-0\" : \"\"}\n        data-slot=\"progress-circle-svg\"\n        height={viewBoxHeight}\n        viewBox={`0 0 ${String(diameter)} ${String(viewBoxHeight)}`}\n        width={diameter}\n      >\n        {isHalfCircle ? (\n          <>\n            {/* Half-circle track */}\n            <path\n              className={cn(progressCircleTrackVariants({ color }))}\n              d={getPath()}\n              data-slot=\"progress-circle-track\"\n              fill=\"none\"\n              strokeLinecap=\"round\"\n              strokeWidth={strokeWidth}\n            />\n            {/* Half-circle indicator */}\n            <path\n              className={cn(progressCircleIndicatorVariants({ color }))}\n              d={getPath()}\n              data-slot=\"progress-circle-indicator\"\n              fill=\"none\"\n              strokeDasharray={circumference}\n              strokeDashoffset={progressOffset}\n              strokeLinecap=\"round\"\n              strokeWidth={strokeWidth}\n            />\n          </>\n        ) : (\n          <>\n            {/* Full circle track */}\n            <circle\n              className={cn(progressCircleTrackVariants({ color }))}\n              cx={center}\n              cy={center}\n              data-slot=\"progress-circle-track\"\n              fill=\"none\"\n              r={radius}\n              strokeWidth={strokeWidth}\n            />\n            {/* Full circle indicator */}\n            <circle\n              style={{\n                transform: indeterminate ? undefined : \"rotate(-90deg)\",\n                transformOrigin: \"center\",\n              }}\n              className={cn(progressCircleIndicatorVariants({ color, indeterminate }))}\n              cx={center}\n              cy={center}\n              data-slot=\"progress-circle-indicator\"\n              fill=\"none\"\n              r={radius}\n              strokeDasharray={circumference}\n              strokeDashoffset={progressOffset}\n              strokeLinecap=\"round\"\n              strokeWidth={strokeWidth}\n            />\n          </>\n        )}\n      </svg>\n\n      {/* Center content (value and label) */}\n      <div\n        className={cn(\n          \"absolute flex flex-col items-center justify-center\",\n          isHalfCircle && \"bottom-0\"\n        )}\n        data-slot=\"progress-circle-content\"\n      >\n        {showValue && !indeterminate && (\n          <span\n            className={cn(progressCircleValueVariants({ size }))}\n            data-slot=\"progress-circle-value\"\n          >\n            {formattedValue}\n          </span>\n        )}\n        {label && (\n          <span\n            className={cn(progressCircleLabelVariants({ size }))}\n            data-slot=\"progress-circle-label\"\n          >\n            {label}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n\n  if (tooltip) {\n    return (\n      <Tooltip>\n        <TooltipTrigger asChild>\n          {progressCircleElement}\n        </TooltipTrigger>\n        <TooltipContent>\n          {tooltip}\n        </TooltipContent>\n      </Tooltip>\n    )\n  }\n\n  return progressCircleElement\n}\n\nexport { ProgressCircle }\n"]}

package/dist/chunk-5MJQ5XSR.js

@@ -0,0 +1,217 @@
+import { ChartTooltipContent, ChartContainer, ChartTooltip, ChartLegend, ChartLegendContent } from './chunk-XXWCMY2G.js';
+import { cn } from './chunk-RVAYDRMA.js';
+import * as React from 'react';
+import { PieChart as PieChart$1, Pie, Cell } from 'recharts';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function getVariantConfig(variant, innerRadius, outerRadius, startAngle, endAngle) {
+  const defaultOuterRadius = outerRadius ?? 80;
+  switch (variant) {
+    case "donut":
+      return {
+        endAngle: endAngle ?? 360,
+        innerRadius: innerRadius ?? Math.round(defaultOuterRadius * 0.6),
+        outerRadius: defaultOuterRadius,
+        startAngle: startAngle ?? 0
+      };
+    case "semi":
+      return {
+        endAngle: endAngle ?? 0,
+        innerRadius: innerRadius ?? Math.round(defaultOuterRadius * 0.6),
+        outerRadius: defaultOuterRadius,
+        startAngle: startAngle ?? 180
+      };
+    default:
+      return {
+        endAngle: endAngle ?? 360,
+        innerRadius: innerRadius ?? 0,
+        outerRadius: defaultOuterRadius,
+        startAngle: startAngle ?? 0
+      };
+  }
+}
+function CenterLabel({
+  centerLabel,
+  cx,
+  cy
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    centerLabel.value && /* @__PURE__ */ jsx(
+      "text",
+      {
+        className: "fill-foreground text-3xl font-bold",
+        dominantBaseline: "middle",
+        textAnchor: "middle",
+        x: cx,
+        y: centerLabel.label ? "45%" : cy,
+        children: centerLabel.value
+      }
+    ),
+    centerLabel.label && /* @__PURE__ */ jsx(
+      "text",
+      {
+        className: "fill-muted-foreground text-sm",
+        dominantBaseline: "middle",
+        textAnchor: "middle",
+        x: cx,
+        y: centerLabel.value ? "55%" : cy,
+        children: centerLabel.label
+      }
+    )
+  ] });
+}
+function createLabelRenderer(config) {
+  if (config === true) {
+    return ({ name, percent }) => `${name ?? ""} ${((percent ?? 0) * 100).toFixed(0)}%`;
+  }
+  const { formatter } = config;
+  if (formatter) {
+    return (entry) => formatter(entry, entry.percent ?? 0);
+  }
+  return ({ name, percent }) => `${name ?? ""} ${((percent ?? 0) * 100).toFixed(0)}%`;
+}
+function PieChart({
+  activeIndex,
+  activeShape,
+  animationDuration = 400,
+  centerLabel,
+  className,
+  config,
+  cornerRadius = 0,
+  customTooltip,
+  data,
+  dataKey = "value",
+  enableLegendSlider = false,
+  endAngle: endAngleProp,
+  innerRadius: innerRadiusProp,
+  label = false,
+  nameKey = "name",
+  onClick,
+  onMouseEnter,
+  onMouseLeave,
+  outerRadius: outerRadiusProp,
+  paddingAngle = 0,
+  showLegend = false,
+  showTooltip = true,
+  startAngle: startAngleProp,
+  tooltipCallback,
+  tooltipIndicator = "dot",
+  variant = "pie",
+  ...props
+}) {
+  const prevTooltipStateRef = React.useRef(false);
+  const TooltipContentWithCallback = React.useCallback(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (props2) => {
+      const { active = false, payload } = props2;
+      if (tooltipCallback && active !== prevTooltipStateRef.current) {
+        prevTooltipStateRef.current = active;
+        tooltipCallback({
+          active,
+          name: payload?.[0]?.name,
+          payload: payload?.map((p) => ({
+            name: p.name,
+            value: p.value,
+            payload: p.payload
+          }))
+        });
+      }
+      return /* @__PURE__ */ jsx(ChartTooltipContent, { indicator: tooltipIndicator, nameKey, ...props2 });
+    },
+    [tooltipCallback, tooltipIndicator, nameKey]
+  );
+  const {
+    endAngle,
+    innerRadius,
+    outerRadius,
+    startAngle
+  } = getVariantConfig(
+    variant,
+    innerRadiusProp,
+    outerRadiusProp,
+    startAngleProp,
+    endAngleProp
+  );
+  const showCenterLabel = centerLabel && innerRadius > 0;
+  const activeShapeConfig = activeShape ? {
+    outerRadius: activeShape.outerRadius ?? outerRadius + 10,
+    stroke: activeShape.stroke ?? "var(--primary)",
+    strokeWidth: activeShape.strokeWidth ?? 2
+  } : void 0;
+  const labelConfig = typeof label === "boolean" ? label ? true : void 0 : label;
+  const labelRenderer = labelConfig ? createLabelRenderer(labelConfig) : void 0;
+  const showLabelLine = typeof label === "object" && label.line !== false;
+  const handleClick = onClick ? (_, index) => {
+    const item = data[index];
+    if (item) onClick(item, index);
+  } : void 0;
+  const handleMouseEnter = onMouseEnter ? (_, index) => {
+    const item = data[index];
+    if (item) onMouseEnter(item, index);
+  } : void 0;
+  return /* @__PURE__ */ jsx("div", { "data-slot": "pie-chart", ...props, children: /* @__PURE__ */ jsx(
+    ChartContainer,
+    {
+      className: cn(
+        variant === "semi" && "aspect-[2/1]",
+        className
+      ),
+      config,
+      children: /* @__PURE__ */ jsxs(PieChart$1, { children: [
+        showTooltip && /* @__PURE__ */ jsx(
+          ChartTooltip,
+          {
+            content: customTooltip ?? (tooltipCallback ? /* @__PURE__ */ jsx(TooltipContentWithCallback, {}) : /* @__PURE__ */ jsx(ChartTooltipContent, { indicator: tooltipIndicator, nameKey }))
+          }
+        ),
+        showLegend && /* @__PURE__ */ jsx(ChartLegend, { content: /* @__PURE__ */ jsx(ChartLegendContent, { enableSlider: enableLegendSlider, nameKey }) }),
+        /* @__PURE__ */ jsx(
+          Pie,
+          {
+            ...{
+              activeIndex,
+              activeShape: activeShapeConfig,
+              animationDuration,
+              cornerRadius,
+              cx: "50%",
+              cy: variant === "semi" ? "100%" : "50%",
+              data,
+              dataKey,
+              endAngle,
+              innerRadius,
+              label: labelRenderer,
+              labelLine: showLabelLine,
+              nameKey,
+              onClick: handleClick,
+              onMouseEnter: handleMouseEnter,
+              onMouseLeave,
+              outerRadius,
+              paddingAngle,
+              startAngle
+            },
+            children: data.map((entry) => /* @__PURE__ */ jsx(
+              Cell,
+              {
+                fill: entry.fill ?? `var(--color-${entry.name.toLowerCase().replaceAll(" ", "-")})`
+              },
+              entry.name
+            ))
+          }
+        ),
+        showCenterLabel && /* @__PURE__ */ jsx(
+          CenterLabel,
+          {
+            centerLabel,
+            cx: "50%",
+            cy: variant === "semi" ? "100%" : "50%"
+          }
+        )
+      ] })
+    }
+  ) });
+}
+PieChart.displayName = "PieChart";
+
+export { PieChart };
+//# sourceMappingURL=chunk-5MJQ5XSR.js.map
+//# sourceMappingURL=chunk-5MJQ5XSR.js.map

package/dist/chunk-5MJQ5XSR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/PieChart/PieChart.tsx"],"names":["props","RechartsPieChart"],"mappings":"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","file":"chunk-5MJQ5XSR.js","sourcesContent":["\"use client\"\n\nimport type {\n  PieChartActiveShape,\n  PieChartCenterLabel,\n  PieChartDataItem,\n  PieChartLabelConfig,\n  PieChartProps,\n} from \"./PieChart.types\"\n\nimport * as React from \"react\"\nimport {\n  Cell,\n  Pie,\n  PieChart as RechartsPieChart,\n} from \"recharts\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  ChartContainer,\n  ChartLegend,\n  ChartLegendContent,\n  ChartTooltip,\n  ChartTooltipContent,\n} from \"../Chart\"\n\n/**\n * Get variant configuration for pie chart\n */\nfunction getVariantConfig(\n  variant: PieChartProps[\"variant\"],\n  innerRadius?: number,\n  outerRadius?: number,\n  startAngle?: number,\n  endAngle?: number\n): { endAngle: number; innerRadius: number; outerRadius: number; startAngle: number } {\n  const defaultOuterRadius = outerRadius ?? 80\n\n  switch (variant) {\n    case \"donut\":\n      return {\n        endAngle: endAngle ?? 360,\n        innerRadius: innerRadius ?? Math.round(defaultOuterRadius * 0.6),\n        outerRadius: defaultOuterRadius,\n        startAngle: startAngle ?? 0,\n      }\n    case \"semi\":\n      return {\n        endAngle: endAngle ?? 0,\n        innerRadius: innerRadius ?? Math.round(defaultOuterRadius * 0.6),\n        outerRadius: defaultOuterRadius,\n        startAngle: startAngle ?? 180,\n      }\n    default: // \"pie\"\n      return {\n        endAngle: endAngle ?? 360,\n        innerRadius: innerRadius ?? 0,\n        outerRadius: defaultOuterRadius,\n        startAngle: startAngle ?? 0,\n      }\n  }\n}\n\n/**\n * Render center label for donut charts\n */\nfunction CenterLabel({\n  centerLabel,\n  cx,\n  cy,\n}: {\n  centerLabel: PieChartCenterLabel\n  cx: string\n  cy: string\n}) {\n  return (\n    <>\n      {centerLabel.value && (\n        <text\n          className=\"fill-foreground text-3xl font-bold\"\n          dominantBaseline=\"middle\"\n          textAnchor=\"middle\"\n          x={cx}\n          y={centerLabel.label ? \"45%\" : cy}\n        >\n          {centerLabel.value}\n        </text>\n      )}\n      {centerLabel.label && (\n        <text\n          className=\"fill-muted-foreground text-sm\"\n          dominantBaseline=\"middle\"\n          textAnchor=\"middle\"\n          x={cx}\n          y={centerLabel.value ? \"55%\" : cy}\n        >\n          {centerLabel.label}\n        </text>\n      )}\n    </>\n  )\n}\n\n/**\n * Create label render function from config\n */\nfunction createLabelRenderer(config: PieChartLabelConfig | true) {\n  if (config === true) {\n    return ({ name, percent }: { name?: string; percent?: number }) =>\n      `${name ?? ''} ${((percent ?? 0) * 100).toFixed(0)}%`\n  }\n\n  const { formatter } = config\n  if (formatter) {\n    return (entry: { name?: string; percent?: number; value?: number }) =>\n      formatter(entry as PieChartDataItem & { percent: number }, entry.percent ?? 0)\n  }\n\n  return ({ name, percent }: { name?: string; percent?: number }) =>\n    `${name ?? ''} ${((percent ?? 0) * 100).toFixed(0)}%`\n}\n\n/**\n * PieChart - Data visualization component for proportional distribution\n *\n * Displays data as slices of a circle where each slice represents a proportion\n * of the whole. Supports pie, donut, and semi-circle variants.\n *\n * @example\n * ```tsx\n * const data = [\n *   { name: \"Chrome\", value: 275, fill: \"var(--color-chrome)\" },\n *   { name: \"Safari\", value: 200, fill: \"var(--color-safari)\" },\n *   { name: \"Firefox\", value: 187, fill: \"var(--color-firefox)\" },\n * ]\n *\n * const config = {\n *   chrome: { label: \"Chrome\", color: \"hsl(var(--chart-1))\" },\n *   safari: { label: \"Safari\", color: \"hsl(var(--chart-2))\" },\n *   firefox: { label: \"Firefox\", color: \"hsl(var(--chart-3))\" },\n * }\n *\n * <PieChart\n *   data={data}\n *   config={config}\n * />\n * ```\n */\nexport function PieChart({\n  activeIndex,\n  activeShape,\n  animationDuration = 400,\n  centerLabel,\n  className,\n  config,\n  cornerRadius = 0,\n  customTooltip,\n  data,\n  dataKey = \"value\",\n  enableLegendSlider = false,\n  endAngle: endAngleProp,\n  innerRadius: innerRadiusProp,\n  label = false,\n  nameKey = \"name\",\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n  outerRadius: outerRadiusProp,\n  paddingAngle = 0,\n  showLegend = false,\n  showTooltip = true,\n  startAngle: startAngleProp,\n  tooltipCallback,\n  tooltipIndicator = \"dot\",\n  variant = \"pie\",\n  ...props\n}: PieChartProps) {\n  const prevTooltipStateRef = React.useRef<boolean>(false)\n\n  /* eslint-disable react-hooks/static-components, @eslint-react/no-nested-component-definitions, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access -- Intentional: memoized render function with Recharts any-typed props */\n  // Custom tooltip content wrapper for tooltipCallback\n  const TooltipContentWithCallback = React.useCallback(\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (props: any) => {\n      const { active = false, payload } = props\n\n      // Call tooltipCallback when state changes\n      if (tooltipCallback && active !== prevTooltipStateRef.current) {\n        prevTooltipStateRef.current = active\n        tooltipCallback({\n          active,\n          name: payload?.[0]?.name,\n          payload: payload?.map((p: { name: string; payload: PieChartDataItem; value: number; }) => ({\n            name: p.name,\n            value: p.value,\n            payload: p.payload,\n          })),\n        })\n      }\n\n      return <ChartTooltipContent indicator={tooltipIndicator} nameKey={nameKey} {...props} />\n    },\n    [tooltipCallback, tooltipIndicator, nameKey]\n  )\n  const {\n    endAngle,\n    innerRadius,\n    outerRadius,\n    startAngle,\n  } = getVariantConfig(\n    variant,\n    innerRadiusProp,\n    outerRadiusProp,\n    startAngleProp,\n    endAngleProp\n  )\n\n  const showCenterLabel = centerLabel && innerRadius > 0\n\n  // Build active shape config\n  const activeShapeConfig: PieChartActiveShape | undefined = activeShape\n    ? {\n        outerRadius: activeShape.outerRadius ?? outerRadius + 10,\n        stroke: activeShape.stroke ?? \"var(--primary)\",\n        strokeWidth: activeShape.strokeWidth ?? 2,\n      }\n    : undefined\n\n  // Handle label configuration\n  const labelConfig = typeof label === \"boolean\"\n    ? (label ? true : undefined)\n    : label\n\n  const labelRenderer = labelConfig\n    ? createLabelRenderer(labelConfig)\n    : undefined\n\n  const showLabelLine = typeof label === \"object\" && label.line !== false\n\n  // Event handlers\n  const handleClick = onClick\n    ? (_: unknown, index: number) => {\n        const item = data[index]\n        if (item) onClick(item, index)\n      }\n    : undefined\n\n  const handleMouseEnter = onMouseEnter\n    ? (_: unknown, index: number) => {\n        const item = data[index]\n        if (item) onMouseEnter(item, index)\n      }\n    : undefined\n\n  return (\n    <div data-slot=\"pie-chart\" {...props}>\n      <ChartContainer\n        className={cn(\n          variant === \"semi\" && \"aspect-[2/1]\",\n          className\n        )}\n        config={config}\n      >\n        <RechartsPieChart>\n          {showTooltip && (\n            <ChartTooltip\n              content={\n                customTooltip\n                  ?? (tooltipCallback\n                    ? <TooltipContentWithCallback />\n                    : <ChartTooltipContent indicator={tooltipIndicator} nameKey={nameKey} />)\n              }\n            />\n          )}\n\n          {showLegend && (\n            <ChartLegend content={<ChartLegendContent enableSlider={enableLegendSlider} nameKey={nameKey} />} />\n          )}\n\n          { }\n          { }\n          <Pie\n            {...({\n              activeIndex,\n              activeShape: activeShapeConfig,\n              animationDuration,\n              cornerRadius,\n              cx: \"50%\",\n              cy: variant === \"semi\" ? \"100%\" : \"50%\",\n              data,\n              dataKey,\n              endAngle,\n              innerRadius,\n              label: labelRenderer,\n              labelLine: showLabelLine,\n              nameKey,\n              onClick: handleClick,\n              onMouseEnter: handleMouseEnter,\n              onMouseLeave,\n              outerRadius,\n              paddingAngle,\n              startAngle,\n            } as Record<string, unknown>)}\n          >\n            {data.map((entry) => (\n              <Cell\n                key={entry.name}\n                fill={entry.fill ?? `var(--color-${entry.name.toLowerCase().replaceAll(\" \", \"-\")})`}\n              />\n            ))}\n          </Pie>\n\n          {showCenterLabel && (\n            <CenterLabel\n              centerLabel={centerLabel}\n              cx=\"50%\"\n              cy={variant === \"semi\" ? \"100%\" : \"50%\"}\n            />\n          )}\n        </RechartsPieChart>\n      </ChartContainer>\n    </div>\n  )\n}\n\nPieChart.displayName = \"PieChart\"\n"]}