@humain/ui 2.4.1 → 2.4.3

package/dist/wc-react/hf-empty-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-empty-state.js","names":[],"sources":["../../src/components/organisms/content/EmptyState/EmptyState.tsx","../../src/wc/hf-empty-state.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { Heart, Search } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { FeaturedIcon } from '@/components/molecules/data/FeaturedIcon';\nimport {\n  type FileExtension,\n  FileTypeIcon,\n  type SimpleFileType,\n} from '@/components/molecules/files/FileTypeIcon';\nimport { cn } from '@/lib/utils';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type EmptyStateSize = 'sm' | 'md' | 'lg';\nexport type EmptyStateMedia =\n  | 'featured-icon'\n  | 'illustration'\n  | 'file-type-icon'\n  | 'none';\nexport type EmptyStateBackgroundPatternVariant =\n  | 'circles'\n  | 'grid'\n  | 'grid-dot'\n  | 'squares'\n  | 'none';\nexport type EmptyStateIllustrationVariant =\n  | 'cloud'\n  | 'box'\n  | 'documents'\n  | 'credit-card';\nexport type EmptyStateTone = 'primary' | 'gray';\n\nexport interface EmptyStateActionConfig {\n  label: React.ReactNode;\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  startIcon?: React.ReactNode;\n  disabled?: boolean;\n  loading?: boolean;\n  'aria-label'?: string;\n}\n\n// ============================================================================\n// Shared maps\n// ============================================================================\n\nconst patternSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-[336px]',\n  md: 'size-[480px]',\n  lg: 'size-[768px]',\n};\n\nconst patternGridSize: Record<EmptyStateSize, string> = {\n  sm: '24px 24px',\n  md: '32px 32px',\n  lg: '48px 48px',\n};\n\nconst illustrationSizeClass: Record<\n  EmptyStateSize,\n  Record<EmptyStateIllustrationVariant, string>\n> = {\n  sm: {\n    cloud: 'h-[118px] w-[152px]',\n    box: 'h-[124px] w-[152px]',\n    documents: 'h-[118px] w-[152px]',\n    'credit-card': 'h-[118px] w-[152px]',\n  },\n  md: {\n    cloud: 'h-32 w-[172px]',\n    box: 'h-[136px] w-[172px]',\n    documents: 'h-32 w-[172px]',\n    'credit-card': 'h-[134px] w-[172px]',\n  },\n  lg: {\n    cloud: 'h-40 w-[220px]',\n    box: 'h-[168px] w-[220px]',\n    documents: 'h-40 w-[220px]',\n    'credit-card': 'h-40 w-[220px]',\n  },\n};\n\nconst illustrationIconSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'p-2',\n  md: 'p-2.5',\n  lg: 'p-2.5',\n};\n\nconst iconGlyphSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-4',\n  md: 'size-4',\n  lg: 'size-5',\n};\n\nconst illustrationIconCenterClass: Record<\n  EmptyStateIllustrationVariant,\n  string\n> = {\n  cloud: 'top-[58%]',\n  box: 'top-[58%]',\n  documents: 'top-[60%]',\n  'credit-card': 'top-[60%]',\n};\n\nconst illustrationCircleSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-[104px]',\n  md: 'size-32',\n  lg: 'size-40',\n};\n\nconst fileIconWrapSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-20',\n  md: 'size-24',\n  lg: 'size-28',\n};\n\nconst textGapClass: Record<EmptyStateSize, string> = {\n  sm: 'gap-1',\n  md: 'gap-2',\n  lg: 'gap-2',\n};\n\nconst mediaGapClass: Record<EmptyStateSize, string> = {\n  sm: 'gap-4',\n  md: 'gap-5',\n  lg: 'gap-5',\n};\n\nconst contentGapClass: Record<EmptyStateSize, string> = {\n  sm: 'gap-6',\n  md: 'gap-8',\n  lg: 'gap-8',\n};\n\nconst featuredIconSize: Record<EmptyStateSize, 'sm' | 'md' | 'lg'> = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n};\n\nconst fileIconSize: Record<EmptyStateSize, 'sm' | 'md' | 'lg'> = {\n  sm: 'md',\n  md: 'md',\n  lg: 'md',\n};\n\nconst headingTag = {\n  2: 'h2',\n  3: 'h3',\n  4: 'h4',\n} as const;\n\nfunction EmptyStateIconGlyph({\n  icon,\n  size,\n}: {\n  icon: React.ReactNode;\n  size: EmptyStateSize;\n}) {\n  return (\n    <span\n      data-slot=\"empty-state-icon-glyph\"\n      data-testid=\"empty-state-icon-glyph\"\n      data-centered=\"true\"\n      aria-hidden=\"true\"\n      className={cn(\n        'inline-flex shrink-0 items-center justify-center leading-none [line-height:0] [&>svg]:block [&>svg]:size-full [&>svg]:shrink-0',\n        iconGlyphSizeClass[size],\n      )}\n    >\n      {icon}\n    </span>\n  );\n}\n\n// ============================================================================\n// Background Pattern\n// ============================================================================\n\nexport interface EmptyStateBackgroundPatternProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  size?: EmptyStateSize;\n  variant?: EmptyStateBackgroundPatternVariant;\n}\n\nconst gridPatternStyle = (\n  size: EmptyStateSize,\n  dot = false,\n): React.CSSProperties => ({\n  backgroundImage: dot\n    ? 'radial-gradient(circle, color-mix(in oklch, var(--border) 70%, transparent) 1px, transparent 1px)'\n    : [\n        'linear-gradient(to right, color-mix(in oklch, var(--border) 54%, transparent) 1px, transparent 1px)',\n        'linear-gradient(to bottom, color-mix(in oklch, var(--border) 54%, transparent) 1px, transparent 1px)',\n      ].join(', '),\n  backgroundSize: patternGridSize[size],\n});\n\nconst squaresBySize: Record<EmptyStateSize, number[]> = {\n  sm: [96, 144, 192, 240, 288, 336],\n  md: [96, 160, 224, 288, 352, 416, 480],\n  lg: [96, 192, 288, 384, 480, 576, 672, 768],\n};\n\nexport const EmptyStateBackgroundPattern = React.forwardRef<\n  HTMLDivElement,\n  EmptyStateBackgroundPatternProps\n>(({ className, size = 'sm', variant = 'circles', style, ...props }, ref) => {\n  if (variant === 'none') {\n    return null;\n  }\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"empty-state-background-pattern\"\n      data-testid=\"empty-state-pattern\"\n      data-size={size}\n      data-variant={variant}\n      aria-hidden=\"true\"\n      className={cn(\n        'pointer-events-none absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 overflow-hidden opacity-75',\n        patternSizeClass[size],\n        className,\n      )}\n      style={style}\n      {...props}\n    >\n      <div className=\"absolute inset-0 bg-[radial-gradient(circle_at_center,var(--background)_0%,transparent_68%)]\" />\n\n      {variant === 'circles' && (\n        <div className=\"absolute inset-0\">\n          {Array.from({ length: 7 }, (_, index) => (\n            <span\n              key={index}\n              className=\"absolute left-1/2 top-1/2 rounded-full border border-border/60\"\n              style={{\n                width: `${(index + 1) * 14}%`,\n                height: `${(index + 1) * 14}%`,\n                transform: 'translate(-50%, -50%)',\n              }}\n            />\n          ))}\n        </div>\n      )}\n\n      {(variant === 'grid' || variant === 'grid-dot') && (\n        <div\n          className=\"absolute inset-0 opacity-70 [mask-image:radial-gradient(circle_at_center,black_0%,black_48%,transparent_76%)]\"\n          style={gridPatternStyle(size, variant === 'grid-dot')}\n        />\n      )}\n\n      {variant === 'squares' && (\n        <div className=\"absolute inset-0\">\n          {squaresBySize[size].map((squareSize) => (\n            <span\n              key={squareSize}\n              className=\"absolute left-1/2 top-1/2 rounded-xl border border-border/55\"\n              style={{\n                width: squareSize,\n                height: squareSize,\n                transform: 'translate(-50%, -50%) rotate(-12.5deg)',\n              }}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n});\n\nEmptyStateBackgroundPattern.displayName = 'EmptyStateBackgroundPattern';\n\n// ============================================================================\n// Illustration\n// ============================================================================\n\nexport interface EmptyStateIllustrationProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  size?: EmptyStateSize;\n  variant?: EmptyStateIllustrationVariant;\n  tone?: EmptyStateTone;\n  icon?: React.ReactNode;\n}\n\nfunction DecorativeDots({ tone }: { tone: EmptyStateTone }) {\n  const dotClassName =\n    tone === 'primary' ? 'bg-primary/70' : 'bg-muted-foreground/10';\n\n  return (\n    <>\n      <span\n        className={cn(\n          'absolute left-[7%] top-[8%] size-2 rounded-full',\n          dotClassName,\n        )}\n      />\n      <span\n        className={cn(\n          'absolute right-[6%] top-[18%] size-3 rounded-full',\n          dotClassName,\n        )}\n      />\n      <span\n        className={cn(\n          'absolute bottom-[10%] left-[8%] size-3 rounded-full',\n          dotClassName,\n        )}\n      />\n      <span\n        className={cn(\n          'absolute bottom-[18%] right-[13%] size-2 rounded-full',\n          dotClassName,\n        )}\n      />\n    </>\n  );\n}\n\nfunction CloudShape({\n  accentId,\n  shadeId,\n  tone,\n}: {\n  accentId: string;\n  shadeId: string;\n  tone: EmptyStateTone;\n}) {\n  return (\n    <g className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\">\n      <path\n        d=\"M54 110c-21 0-38-14-38-32 0-16 14-30 33-32 8-19 27-31 49-31 27 0 50 19 55 43 17 3 30 16 30 32 0 19-18 34-40 34H55c-1 0-1-14-1-14Z\"\n        fill={`url(#${shadeId})`}\n      />\n      <path\n        d=\"M68 106c-18 0-32-12-32-27 0-13 11-24 27-26 7-16 23-26 42-26 23 0 42 16 46 36 15 3 26 14 26 28 0 16-15 29-34 29H68v-14Z\"\n        fill={`url(#${accentId})`}\n        opacity={tone === 'primary' ? 0.78 : 0.36}\n      />\n    </g>\n  );\n}\n\nfunction BoxShape({\n  accentId,\n  shadeId,\n}: {\n  accentId: string;\n  shadeId: string;\n}) {\n  return (\n    <g className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\">\n      <path d=\"M72 42 132 20l55 31-62 24-53-33Z\" fill={`url(#${accentId})`} />\n      <path d=\"M72 42v72l53 34V75L72 42Z\" fill={`url(#${shadeId})`} />\n      <path d=\"M125 75v73l62-35V51l-62 24Z\" fill=\"var(--card)\" />\n      <path\n        d=\"M132 20v33l24 14V34l-24-14Z\"\n        fill=\"currentColor\"\n        opacity=\"0.34\"\n      />\n      <path\n        d=\"M72 42 132 20l55 31-62 24-53-33Z\"\n        fill=\"none\"\n        stroke=\"var(--border)\"\n      />\n    </g>\n  );\n}\n\nfunction DocumentsShape({\n  accentId,\n  shadeId,\n}: {\n  accentId: string;\n  shadeId: string;\n}) {\n  return (\n    <g className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\">\n      <g transform=\"translate(44 48) rotate(-18)\">\n        <rect\n          width=\"58\"\n          height=\"78\"\n          rx=\"7\"\n          fill={`url(#${shadeId})`}\n          stroke=\"var(--border)\"\n        />\n        <path\n          d=\"M15 21h28M15 35h21M15 49h28\"\n          stroke=\"currentColor\"\n          strokeOpacity=\"0.28\"\n        />\n      </g>\n      <g transform=\"translate(83 32)\">\n        <rect\n          width=\"58\"\n          height=\"88\"\n          rx=\"7\"\n          fill=\"var(--card)\"\n          stroke=\"var(--border)\"\n        />\n        <path\n          d=\"M16 26h28M16 41h22M16 56h28\"\n          stroke=\"currentColor\"\n          strokeOpacity=\"0.32\"\n        />\n      </g>\n      <g transform=\"translate(121 47) rotate(18)\">\n        <rect\n          width=\"58\"\n          height=\"78\"\n          rx=\"7\"\n          fill={`url(#${accentId})`}\n          stroke=\"var(--border)\"\n        />\n        <path\n          d=\"M15 21h28M15 35h21M15 49h28\"\n          stroke=\"currentColor\"\n          strokeOpacity=\"0.32\"\n        />\n      </g>\n    </g>\n  );\n}\n\nfunction CreditCardShape({\n  accentId,\n  shadeId,\n}: {\n  accentId: string;\n  shadeId: string;\n}) {\n  return (\n    <g className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\">\n      <rect\n        x=\"42\"\n        y=\"48\"\n        width=\"136\"\n        height=\"82\"\n        rx=\"12\"\n        fill={`url(#${shadeId})`}\n        stroke=\"var(--border)\"\n      />\n      <rect\n        x=\"42\"\n        y=\"70\"\n        width=\"136\"\n        height=\"16\"\n        fill={`url(#${accentId})`}\n        opacity=\"0.72\"\n      />\n      <rect\n        x=\"58\"\n        y=\"104\"\n        width=\"28\"\n        height=\"8\"\n        rx=\"2\"\n        fill=\"currentColor\"\n        opacity=\"0.28\"\n      />\n      <rect\n        x=\"58\"\n        y=\"116\"\n        width=\"58\"\n        height=\"5\"\n        rx=\"2.5\"\n        fill=\"currentColor\"\n        opacity=\"0.18\"\n      />\n      <circle cx=\"146\" cy=\"112\" r=\"10\" fill=\"currentColor\" opacity=\"0.24\" />\n      <circle cx=\"158\" cy=\"112\" r=\"10\" fill=\"currentColor\" opacity=\"0.38\" />\n    </g>\n  );\n}\n\nexport const EmptyStateIllustration = React.forwardRef<\n  HTMLDivElement,\n  EmptyStateIllustrationProps\n>(\n  (\n    {\n      className,\n      size = 'sm',\n      variant = 'cloud',\n      tone = 'primary',\n      icon = <Heart aria-hidden=\"true\" />,\n      ...props\n    },\n    ref,\n  ) => {\n    const accentId = React.useId();\n    const shadeId = React.useId();\n    const isPrimary = tone === 'primary';\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"empty-state-illustration\"\n        data-testid=\"empty-state-illustration\"\n        data-size={size}\n        data-variant={variant}\n        data-tone={tone}\n        aria-hidden=\"true\"\n        className={cn(\n          'relative shrink-0 text-primary',\n          !isPrimary && 'text-muted-foreground',\n          illustrationSizeClass[size][variant],\n          className,\n        )}\n        {...props}\n      >\n        <div\n          data-slot=\"empty-state-illustration-background\"\n          data-testid=\"empty-state-illustration-background\"\n          data-centered=\"true\"\n          className={cn(\n            'absolute left-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full',\n            isPrimary ? 'bg-primary/20' : 'bg-muted/80',\n            illustrationCircleSizeClass[size],\n            illustrationIconCenterClass[variant],\n          )}\n        />\n        <DecorativeDots tone={tone} />\n        <svg\n          viewBox=\"0 0 220 168\"\n          className=\"absolute inset-0 size-full overflow-visible\"\n          fill=\"none\"\n          aria-hidden=\"true\"\n        >\n          <defs>\n            <linearGradient id={accentId} x1=\"25\" y1=\"12\" x2=\"190\" y2=\"148\">\n              <stop\n                stopColor={isPrimary ? 'var(--primary)' : 'var(--muted)'}\n                stopOpacity={isPrimary ? 0.34 : 0.74}\n              />\n              <stop stopColor=\"var(--card)\" stopOpacity={0.95} />\n            </linearGradient>\n            <linearGradient id={shadeId} x1=\"54\" y1=\"18\" x2=\"165\" y2=\"140\">\n              <stop stopColor=\"var(--card)\" />\n              <stop\n                stopColor={\n                  isPrimary ? 'var(--primary)' : 'var(--muted-foreground)'\n                }\n                stopOpacity={isPrimary ? 0.18 : 0.14}\n              />\n            </linearGradient>\n          </defs>\n\n          {variant === 'cloud' && (\n            <CloudShape accentId={accentId} shadeId={shadeId} tone={tone} />\n          )}\n          {variant === 'box' && (\n            <BoxShape accentId={accentId} shadeId={shadeId} />\n          )}\n          {variant === 'documents' && (\n            <DocumentsShape accentId={accentId} shadeId={shadeId} />\n          )}\n          {variant === 'credit-card' && (\n            <CreditCardShape accentId={accentId} shadeId={shadeId} />\n          )}\n        </svg>\n        <div\n          data-slot=\"empty-state-illustration-icon\"\n          data-testid=\"empty-state-illustration-icon\"\n          data-centered=\"true\"\n          className={cn(\n            'absolute left-1/2 flex -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-xl bg-primary/10 text-primary shadow-xs backdrop-blur-md supports-backdrop-filter:backdrop-blur-md [&>svg]:shrink-0',\n            !isPrimary && 'bg-muted text-muted-foreground',\n            illustrationIconSizeClass[size],\n            illustrationIconCenterClass[variant],\n          )}\n        >\n          <EmptyStateIconGlyph icon={icon} size={size} />\n        </div>\n      </div>\n    );\n  },\n);\n\nEmptyStateIllustration.displayName = 'EmptyStateIllustration';\n\n// ============================================================================\n// EmptyState\n// ============================================================================\n\nconst emptyStateVariants = cva(\n  'relative isolate mx-auto flex w-full max-w-[512px] items-center justify-center overflow-visible py-8 text-center',\n  {\n    variants: {\n      size: {\n        sm: 'min-h-[212px]',\n        md: 'min-h-[280px]',\n        lg: 'min-h-[360px]',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n    },\n  },\n);\n\nexport interface EmptyStateProps\n  extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  size?: EmptyStateSize;\n  media?: EmptyStateMedia;\n  pattern?: EmptyStateBackgroundPatternVariant | 'auto';\n  icon?: React.ReactNode;\n  iconLabel?: string;\n  illustrationVariant?: EmptyStateIllustrationVariant;\n  illustrationTone?: EmptyStateTone;\n  fileExtension?: FileExtension;\n  fileType?: SimpleFileType;\n  primaryAction?: EmptyStateActionConfig;\n  secondaryAction?: EmptyStateActionConfig;\n  actions?: React.ReactNode;\n  headingLevel?: 2 | 3 | 4;\n}\n\nfunction resolvePattern(\n  pattern: EmptyStateProps['pattern'],\n  media: EmptyStateMedia,\n): EmptyStateBackgroundPatternVariant {\n  if (!pattern || pattern === 'auto') {\n    if (media === 'illustration') return 'grid';\n    if (media === 'none') return 'none';\n    return 'circles';\n  }\n  return pattern;\n}\n\nfunction renderEmptyStateAction(\n  action: EmptyStateActionConfig,\n  intent: 'primary' | 'secondary',\n) {\n  const {\n    label,\n    onClick,\n    startIcon,\n    disabled,\n    loading,\n    'aria-label': ariaLabel,\n  } = action;\n\n  return (\n    <Button\n      appearance={intent === 'primary' ? 'solid' : 'outline'}\n      variant={intent === 'primary' ? 'primary' : 'secondary'}\n      size=\"sm\"\n      shape=\"rounded\"\n      onClick={onClick}\n      disabled={disabled}\n      loading={loading}\n      startIcon={startIcon}\n      aria-label={ariaLabel}\n      type=\"button\"\n    >\n      {label}\n    </Button>\n  );\n}\n\nexport const EmptyState = React.forwardRef<HTMLElement, EmptyStateProps>(\n  (\n    {\n      className,\n      title,\n      description,\n      size = 'sm',\n      media = 'featured-icon',\n      pattern = 'auto',\n      icon,\n      iconLabel,\n      illustrationVariant = 'cloud',\n      illustrationTone = 'gray',\n      fileExtension,\n      fileType = 'document',\n      primaryAction,\n      secondaryAction,\n      actions,\n      headingLevel = 3,\n      ...props\n    },\n    ref,\n  ) => {\n    const Heading = headingTag[headingLevel];\n    const resolvedPattern = resolvePattern(pattern, media);\n    const defaultIcon = icon ?? <Search aria-hidden=\"true\" />;\n    const hasActions = actions || primaryAction || secondaryAction;\n\n    return (\n      <section\n        ref={ref}\n        data-slot=\"empty-state\"\n        aria-label={typeof title === 'string' ? title : 'Empty state'}\n        className={cn(emptyStateVariants({ size }), className)}\n        {...props}\n      >\n        <div\n          data-slot=\"empty-state-content\"\n          className={cn(\n            'relative z-10 flex min-w-0 flex-1 flex-col items-center',\n            contentGapClass[size],\n          )}\n        >\n          <div\n            data-slot=\"empty-state-body\"\n            className={cn(\n              'flex w-full flex-col items-center',\n              mediaGapClass[size],\n            )}\n          >\n            {media !== 'none' && (\n              <div\n                data-slot=\"empty-state-media\"\n                data-testid=\"empty-state-media\"\n                data-media={media}\n                data-centered=\"true\"\n                className=\"relative flex w-full min-w-0 justify-center\"\n              >\n                <EmptyStateBackgroundPattern\n                  size={size}\n                  variant={resolvedPattern}\n                  data-centered=\"true\"\n                  className=\"z-0\"\n                />\n\n                {media === 'featured-icon' && (\n                  <FeaturedIcon\n                    data-slot=\"empty-state-featured-icon\"\n                    size={featuredIconSize[size]}\n                    shape=\"rounded\"\n                    intent=\"default\"\n                    icon={\n                      <EmptyStateIconGlyph icon={defaultIcon} size={size} />\n                    }\n                    aria-label={iconLabel}\n                    className=\"relative z-10 delight-stagger motion-reduce:animate-none\"\n                  />\n                )}\n\n                {media === 'illustration' && (\n                  <EmptyStateIllustration\n                    size={size}\n                    variant={illustrationVariant}\n                    tone={illustrationTone}\n                    icon={defaultIcon}\n                    className=\"relative z-10 delight-stagger motion-reduce:animate-none\"\n                  />\n                )}\n\n                {media === 'file-type-icon' && (\n                  <div\n                    data-slot=\"empty-state-file-icon-wrap\"\n                    data-testid=\"empty-state-file-icon-wrap\"\n                    data-centered=\"true\"\n                    className={cn(\n                      'relative z-10 flex items-center justify-center rounded-full bg-linear-[104deg,color-mix(in_oklch,var(--card)_60%,transparent),color-mix(in_oklch,var(--muted)_55%,transparent)] delight-stagger motion-reduce:animate-none',\n                      fileIconWrapSizeClass[size],\n                    )}\n                  >\n                    <div\n                      data-slot=\"empty-state-file-icon-optical-center\"\n                      data-testid=\"empty-state-file-icon-optical-center\"\n                      data-centered=\"true\"\n                    >\n                      <FileTypeIcon\n                        extension={fileExtension}\n                        fileType={fileExtension ? undefined : fileType}\n                        size={fileIconSize[size]}\n                        className=\"drop-shadow-[0_1px_2px_var(--shadow-xs-1-color)]\"\n                      />\n                    </div>\n                  </div>\n                )}\n              </div>\n            )}\n\n            <div\n              data-slot=\"empty-state-text\"\n              className={cn(\n                'flex w-full max-w-[352px] flex-col items-center text-center',\n                textGapClass[size],\n              )}\n            >\n              <Heading className=\"w-full text-base font-semibold leading-6 text-foreground\">\n                {title}\n              </Heading>\n              {description && (\n                <p className=\"w-full text-sm leading-5 text-secondary-foreground\">\n                  {description}\n                </p>\n              )}\n            </div>\n          </div>\n\n          {hasActions && (\n            <div\n              data-slot=\"empty-state-actions\"\n              className=\"flex flex-wrap items-center justify-center gap-3\"\n            >\n              {actions ?? (\n                <>\n                  {secondaryAction &&\n                    renderEmptyStateAction(secondaryAction, 'secondary')}\n                  {primaryAction &&\n                    renderEmptyStateAction(primaryAction, 'primary')}\n                </>\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    );\n  },\n);\n\nEmptyState.displayName = 'EmptyState';\n","/**\n * Web Component wrapper for EmptyState\n * Custom element: <hf-empty-state>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { EmptyState } from '../components/organisms/content/EmptyState';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    title: 'string',\n    description: 'string',\n    size: 'string',\n    media: 'string',\n    pattern: 'string',\n    icon: 'json',\n    iconLabel: 'string',\n    illustrationVariant: 'string',\n    illustrationTone: 'string',\n    fileExtension: 'string',\n    fileType: 'string',\n    primaryAction: 'json',\n    secondaryAction: 'json',\n    actions: 'json',\n    headingLevel: 'string'\n};\n\nclass EmptyStateWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root || !this._childrenContainer) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      EmptyState,\n      props,\n      React.createElement('span', {\n        ref: (el: HTMLSpanElement | null) => {\n          if (el && this._childrenContainer) {\n            el.replaceWith(this._childrenContainer);\n          }\n        },\n        style: { display: 'contents' },\n      }),\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(EmptyStateWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-empty-state')) {\n  customElements.define('hf-empty-state', EmptyStateWC);\n}\n\nexport { EmptyStateWC };\nexport default EmptyStateWC;\n"],"mappings":"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"}
+{"version":3,"file":"hf-empty-state.js","names":[],"sources":["../../src/components/organisms/content/EmptyState/EmptyState.tsx","../../src/wc/hf-empty-state.ts"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport { Heart, Search } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { FeaturedIcon } from '@/components/molecules/data/FeaturedIcon';\nimport {\n  type FileExtension,\n  FileTypeIcon,\n  type SimpleFileType,\n} from '@/components/molecules/files/FileTypeIcon';\nimport { cn } from '@/lib/utils';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type EmptyStateSize = 'sm' | 'md' | 'lg';\nexport type EmptyStateMedia =\n  | 'featured-icon'\n  | 'illustration'\n  | 'file-type-icon'\n  | 'none';\nexport type EmptyStateBackgroundPatternVariant =\n  | 'circles'\n  | 'grid'\n  | 'grid-dot'\n  | 'squares'\n  | 'none';\nexport type EmptyStateIllustrationVariant =\n  | 'cloud'\n  | 'box'\n  | 'documents'\n  | 'credit-card';\nexport type EmptyStateTone = 'primary' | 'gray';\n\nexport interface EmptyStateActionConfig {\n  label: React.ReactNode;\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  startIcon?: React.ReactNode;\n  disabled?: boolean;\n  loading?: boolean;\n  'aria-label'?: string;\n}\n\n// ============================================================================\n// Shared maps\n// ============================================================================\n\nconst patternSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-[336px]',\n  md: 'size-[480px]',\n  lg: 'size-[768px]',\n};\n\nconst patternGridSize: Record<EmptyStateSize, string> = {\n  sm: '24px 24px',\n  md: '32px 32px',\n  lg: '48px 48px',\n};\n\nconst illustrationSizeClass: Record<\n  EmptyStateSize,\n  Record<EmptyStateIllustrationVariant, string>\n> = {\n  sm: {\n    cloud: 'h-[118px] w-[152px]',\n    box: 'h-[124px] w-[152px]',\n    documents: 'h-[118px] w-[152px]',\n    'credit-card': 'h-[118px] w-[152px]',\n  },\n  md: {\n    cloud: 'h-32 w-[172px]',\n    box: 'h-[136px] w-[172px]',\n    documents: 'h-32 w-[172px]',\n    'credit-card': 'h-[134px] w-[172px]',\n  },\n  lg: {\n    cloud: 'h-40 w-[220px]',\n    box: 'h-[168px] w-[220px]',\n    documents: 'h-40 w-[220px]',\n    'credit-card': 'h-40 w-[220px]',\n  },\n};\n\nconst illustrationIconSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'p-2',\n  md: 'p-2.5',\n  lg: 'p-2.5',\n};\n\nconst iconGlyphSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-4',\n  md: 'size-4',\n  lg: 'size-5',\n};\n\nconst illustrationCircleSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-[104px]',\n  md: 'size-32',\n  lg: 'size-40',\n};\n\nconst fileIconWrapSizeClass: Record<EmptyStateSize, string> = {\n  sm: 'size-20',\n  md: 'size-24',\n  lg: 'size-28',\n};\n\nconst textGapClass: Record<EmptyStateSize, string> = {\n  sm: 'gap-1',\n  md: 'gap-2',\n  lg: 'gap-2',\n};\n\nconst mediaGapClass: Record<EmptyStateSize, string> = {\n  sm: 'gap-4',\n  md: 'gap-5',\n  lg: 'gap-5',\n};\n\nconst contentGapClass: Record<EmptyStateSize, string> = {\n  sm: 'gap-6',\n  md: 'gap-8',\n  lg: 'gap-8',\n};\n\nconst featuredIconSize: Record<EmptyStateSize, 'sm' | 'md' | 'lg'> = {\n  sm: 'sm',\n  md: 'md',\n  lg: 'lg',\n};\n\nconst fileIconSize: Record<EmptyStateSize, 'sm' | 'md' | 'lg'> = {\n  sm: 'md',\n  md: 'md',\n  lg: 'md',\n};\n\nconst headingTag = {\n  2: 'h2',\n  3: 'h3',\n  4: 'h4',\n} as const;\n\nfunction EmptyStateIconGlyph({\n  icon,\n  size,\n}: {\n  icon: React.ReactNode;\n  size: EmptyStateSize;\n}) {\n  return (\n    <span\n      data-slot=\"empty-state-icon-glyph\"\n      data-testid=\"empty-state-icon-glyph\"\n      data-centered=\"true\"\n      aria-hidden=\"true\"\n      className={cn(\n        'inline-flex shrink-0 items-center justify-center leading-none [line-height:0] [&>svg]:block [&>svg]:size-full [&>svg]:shrink-0',\n        iconGlyphSizeClass[size],\n      )}\n    >\n      {icon}\n    </span>\n  );\n}\n\n// ============================================================================\n// Background Pattern\n// ============================================================================\n\nexport interface EmptyStateBackgroundPatternProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  size?: EmptyStateSize;\n  variant?: EmptyStateBackgroundPatternVariant;\n}\n\nconst gridPatternStyle = (\n  size: EmptyStateSize,\n  dot = false,\n): React.CSSProperties => ({\n  backgroundImage: dot\n    ? 'radial-gradient(circle, color-mix(in oklch, var(--border) 70%, transparent) 1px, transparent 1px)'\n    : [\n        'linear-gradient(to right, color-mix(in oklch, var(--border) 54%, transparent) 1px, transparent 1px)',\n        'linear-gradient(to bottom, color-mix(in oklch, var(--border) 54%, transparent) 1px, transparent 1px)',\n      ].join(', '),\n  backgroundSize: patternGridSize[size],\n});\n\nconst squaresBySize: Record<EmptyStateSize, number[]> = {\n  sm: [96, 144, 192, 240, 288, 336],\n  md: [96, 160, 224, 288, 352, 416, 480],\n  lg: [96, 192, 288, 384, 480, 576, 672, 768],\n};\n\nexport const EmptyStateBackgroundPattern = React.forwardRef<\n  HTMLDivElement,\n  EmptyStateBackgroundPatternProps\n>(({ className, size = 'sm', variant = 'circles', style, ...props }, ref) => {\n  if (variant === 'none') {\n    return null;\n  }\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"empty-state-background-pattern\"\n      data-testid=\"empty-state-pattern\"\n      data-size={size}\n      data-variant={variant}\n      aria-hidden=\"true\"\n      className={cn(\n        'pointer-events-none absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 overflow-hidden opacity-75',\n        patternSizeClass[size],\n        className,\n      )}\n      style={style}\n      {...props}\n    >\n      <div className=\"absolute inset-0 bg-[radial-gradient(circle_at_center,var(--background)_0%,transparent_68%)]\" />\n\n      {variant === 'circles' && (\n        <div className=\"absolute inset-0\">\n          {Array.from({ length: 7 }, (_, index) => (\n            <span\n              key={index}\n              className=\"absolute left-1/2 top-1/2 rounded-full border border-border/60\"\n              style={{\n                width: `${(index + 1) * 14}%`,\n                height: `${(index + 1) * 14}%`,\n                transform: 'translate(-50%, -50%)',\n              }}\n            />\n          ))}\n        </div>\n      )}\n\n      {(variant === 'grid' || variant === 'grid-dot') && (\n        <div\n          className=\"absolute inset-0 opacity-70 [mask-image:radial-gradient(circle_at_center,black_0%,black_48%,transparent_76%)]\"\n          style={gridPatternStyle(size, variant === 'grid-dot')}\n        />\n      )}\n\n      {variant === 'squares' && (\n        <div className=\"absolute inset-0\">\n          {squaresBySize[size].map((squareSize) => (\n            <span\n              key={squareSize}\n              className=\"absolute left-1/2 top-1/2 rounded-xl border border-border/55\"\n              style={{\n                width: squareSize,\n                height: squareSize,\n                transform: 'translate(-50%, -50%) rotate(-12.5deg)',\n              }}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n});\n\nEmptyStateBackgroundPattern.displayName = 'EmptyStateBackgroundPattern';\n\n// ============================================================================\n// Illustration\n// ============================================================================\n\nexport interface EmptyStateIllustrationProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {\n  size?: EmptyStateSize;\n  variant?: EmptyStateIllustrationVariant;\n  tone?: EmptyStateTone;\n  icon?: React.ReactNode;\n}\n\nfunction DecorativeDots({ tone }: { tone: EmptyStateTone }) {\n  const dotClassName =\n    tone === 'primary' ? 'bg-primary/70' : 'bg-muted-foreground/10';\n\n  return (\n    <>\n      <span\n        className={cn(\n          'absolute left-[7%] top-[8%] size-2 rounded-full',\n          dotClassName,\n        )}\n      />\n      <span\n        className={cn(\n          'absolute right-[6%] top-[18%] size-3 rounded-full',\n          dotClassName,\n        )}\n      />\n      <span\n        className={cn(\n          'absolute bottom-[10%] left-[8%] size-3 rounded-full',\n          dotClassName,\n        )}\n      />\n      <span\n        className={cn(\n          'absolute bottom-[18%] right-[13%] size-2 rounded-full',\n          dotClassName,\n        )}\n      />\n    </>\n  );\n}\n\n// Keep every artwork bbox centered on the shared 220 × 168 viewBox center (110, 84).\nfunction CloudShape({\n  accentId,\n  shadeId,\n  tone,\n}: {\n  accentId: string;\n  shadeId: string;\n  tone: EmptyStateTone;\n}) {\n  return (\n    <g\n      transform=\"translate(10.5 14.5)\"\n      className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\"\n    >\n      <path\n        d=\"M54 110c-21 0-38-14-38-32 0-16 14-30 33-32 8-19 27-31 49-31 27 0 50 19 55 43 17 3 30 16 30 32 0 19-18 34-40 34H55c-1 0-1-14-1-14Z\"\n        fill={`url(#${shadeId})`}\n      />\n      <path\n        d=\"M68 106c-18 0-32-12-32-27 0-13 11-24 27-26 7-16 23-26 42-26 23 0 42 16 46 36 15 3 26 14 26 28 0 16-15 29-34 29H68v-14Z\"\n        fill={`url(#${accentId})`}\n        opacity={tone === 'primary' ? 0.78 : 0.36}\n      />\n    </g>\n  );\n}\n\nfunction BoxShape({\n  accentId,\n  shadeId,\n}: {\n  accentId: string;\n  shadeId: string;\n}) {\n  return (\n    <g\n      transform=\"translate(-19.5)\"\n      className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\"\n    >\n      <path d=\"M72 42 132 20l55 31-62 24-53-33Z\" fill={`url(#${accentId})`} />\n      <path d=\"M72 42v72l53 34V75L72 42Z\" fill={`url(#${shadeId})`} />\n      <path d=\"M125 75v73l62-35V51l-62 24Z\" fill=\"var(--card)\" />\n      <path\n        d=\"M132 20v33l24 14V34l-24-14Z\"\n        fill=\"currentColor\"\n        opacity=\"0.34\"\n      />\n      <path\n        d=\"M72 42 132 20l55 31-62 24-53-33Z\"\n        fill=\"none\"\n        stroke=\"var(--border)\"\n      />\n    </g>\n  );\n}\n\nfunction DocumentsShape({\n  accentId,\n  shadeId,\n}: {\n  accentId: string;\n  shadeId: string;\n}) {\n  return (\n    <g\n      transform=\"translate(0 -0.5)\"\n      className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\"\n    >\n      <g transform=\"translate(44 48) rotate(-18)\">\n        <rect\n          width=\"58\"\n          height=\"78\"\n          rx=\"7\"\n          fill={`url(#${shadeId})`}\n          stroke=\"var(--border)\"\n        />\n        <path\n          d=\"M15 21h28M15 35h21M15 49h28\"\n          stroke=\"currentColor\"\n          strokeOpacity=\"0.28\"\n        />\n      </g>\n      <g transform=\"translate(83 32)\">\n        <rect\n          width=\"58\"\n          height=\"88\"\n          rx=\"7\"\n          fill=\"var(--card)\"\n          stroke=\"var(--border)\"\n        />\n        <path\n          d=\"M16 26h28M16 41h22M16 56h28\"\n          stroke=\"currentColor\"\n          strokeOpacity=\"0.32\"\n        />\n      </g>\n      <g transform=\"translate(121 47) rotate(18)\">\n        <rect\n          width=\"58\"\n          height=\"78\"\n          rx=\"7\"\n          fill={`url(#${accentId})`}\n          stroke=\"var(--border)\"\n        />\n        <path\n          d=\"M15 21h28M15 35h21M15 49h28\"\n          stroke=\"currentColor\"\n          strokeOpacity=\"0.32\"\n        />\n      </g>\n    </g>\n  );\n}\n\nfunction CreditCardShape({\n  accentId,\n  shadeId,\n}: {\n  accentId: string;\n  shadeId: string;\n}) {\n  return (\n    <g\n      transform=\"translate(0 -5)\"\n      className=\"drop-shadow-[0_8px_16px_var(--shadow-soft-3-color)]\"\n    >\n      <rect\n        x=\"42\"\n        y=\"48\"\n        width=\"136\"\n        height=\"82\"\n        rx=\"12\"\n        fill={`url(#${shadeId})`}\n        stroke=\"var(--border)\"\n      />\n      <rect\n        x=\"42\"\n        y=\"70\"\n        width=\"136\"\n        height=\"16\"\n        fill={`url(#${accentId})`}\n        opacity=\"0.72\"\n      />\n      <rect\n        x=\"58\"\n        y=\"104\"\n        width=\"28\"\n        height=\"8\"\n        rx=\"2\"\n        fill=\"currentColor\"\n        opacity=\"0.28\"\n      />\n      <rect\n        x=\"58\"\n        y=\"116\"\n        width=\"58\"\n        height=\"5\"\n        rx=\"2.5\"\n        fill=\"currentColor\"\n        opacity=\"0.18\"\n      />\n      <circle cx=\"146\" cy=\"112\" r=\"10\" fill=\"currentColor\" opacity=\"0.24\" />\n      <circle cx=\"158\" cy=\"112\" r=\"10\" fill=\"currentColor\" opacity=\"0.38\" />\n    </g>\n  );\n}\n\nexport const EmptyStateIllustration = React.forwardRef<\n  HTMLDivElement,\n  EmptyStateIllustrationProps\n>(\n  (\n    {\n      className,\n      size = 'sm',\n      variant = 'cloud',\n      tone = 'primary',\n      icon = <Heart aria-hidden=\"true\" />,\n      ...props\n    },\n    ref,\n  ) => {\n    const accentId = React.useId();\n    const shadeId = React.useId();\n    const isPrimary = tone === 'primary';\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"empty-state-illustration\"\n        data-testid=\"empty-state-illustration\"\n        data-size={size}\n        data-variant={variant}\n        data-tone={tone}\n        aria-hidden=\"true\"\n        className={cn(\n          'relative shrink-0 text-primary',\n          !isPrimary && 'text-muted-foreground',\n          illustrationSizeClass[size][variant],\n          className,\n        )}\n        {...props}\n      >\n        <div\n          data-slot=\"empty-state-illustration-background\"\n          data-testid=\"empty-state-illustration-background\"\n          data-centered=\"true\"\n          className={cn(\n            'absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full',\n            isPrimary ? 'bg-primary/20' : 'bg-muted/80',\n            illustrationCircleSizeClass[size],\n          )}\n        />\n        <DecorativeDots tone={tone} />\n        <svg\n          viewBox=\"0 0 220 168\"\n          className=\"absolute inset-0 size-full overflow-visible\"\n          fill=\"none\"\n          aria-hidden=\"true\"\n        >\n          <defs>\n            <linearGradient id={accentId} x1=\"25\" y1=\"12\" x2=\"190\" y2=\"148\">\n              <stop\n                stopColor={isPrimary ? 'var(--primary)' : 'var(--muted)'}\n                stopOpacity={isPrimary ? 0.34 : 0.74}\n              />\n              <stop stopColor=\"var(--card)\" stopOpacity={0.95} />\n            </linearGradient>\n            <linearGradient id={shadeId} x1=\"54\" y1=\"18\" x2=\"165\" y2=\"140\">\n              <stop stopColor=\"var(--card)\" />\n              <stop\n                stopColor={\n                  isPrimary ? 'var(--primary)' : 'var(--muted-foreground)'\n                }\n                stopOpacity={isPrimary ? 0.18 : 0.14}\n              />\n            </linearGradient>\n          </defs>\n\n          {variant === 'cloud' && (\n            <CloudShape accentId={accentId} shadeId={shadeId} tone={tone} />\n          )}\n          {variant === 'box' && (\n            <BoxShape accentId={accentId} shadeId={shadeId} />\n          )}\n          {variant === 'documents' && (\n            <DocumentsShape accentId={accentId} shadeId={shadeId} />\n          )}\n          {variant === 'credit-card' && (\n            <CreditCardShape accentId={accentId} shadeId={shadeId} />\n          )}\n        </svg>\n        <div\n          data-slot=\"empty-state-illustration-icon\"\n          data-testid=\"empty-state-illustration-icon\"\n          data-centered=\"true\"\n          className={cn(\n            'absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 items-center justify-center rounded-xl bg-primary/10 text-primary shadow-xs backdrop-blur-md supports-backdrop-filter:backdrop-blur-md [&>svg]:shrink-0',\n            !isPrimary && 'bg-muted text-muted-foreground',\n            illustrationIconSizeClass[size],\n          )}\n        >\n          <EmptyStateIconGlyph icon={icon} size={size} />\n        </div>\n      </div>\n    );\n  },\n);\n\nEmptyStateIllustration.displayName = 'EmptyStateIllustration';\n\n// ============================================================================\n// EmptyState\n// ============================================================================\n\nconst emptyStateVariants = cva(\n  'relative isolate mx-auto flex w-full max-w-[512px] items-center justify-center overflow-visible py-8 text-center',\n  {\n    variants: {\n      size: {\n        sm: 'min-h-[212px]',\n        md: 'min-h-[280px]',\n        lg: 'min-h-[360px]',\n      },\n    },\n    defaultVariants: {\n      size: 'sm',\n    },\n  },\n);\n\nexport interface EmptyStateProps\n  extends Omit<React.HTMLAttributes<HTMLElement>, 'title'> {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  size?: EmptyStateSize;\n  media?: EmptyStateMedia;\n  pattern?: EmptyStateBackgroundPatternVariant | 'auto';\n  icon?: React.ReactNode;\n  iconLabel?: string;\n  illustrationVariant?: EmptyStateIllustrationVariant;\n  illustrationTone?: EmptyStateTone;\n  fileExtension?: FileExtension;\n  fileType?: SimpleFileType;\n  primaryAction?: EmptyStateActionConfig;\n  secondaryAction?: EmptyStateActionConfig;\n  actions?: React.ReactNode;\n  headingLevel?: 2 | 3 | 4;\n}\n\nfunction resolvePattern(\n  pattern: EmptyStateProps['pattern'],\n  media: EmptyStateMedia,\n): EmptyStateBackgroundPatternVariant {\n  if (!pattern || pattern === 'auto') {\n    if (media === 'illustration') return 'grid';\n    if (media === 'none') return 'none';\n    return 'circles';\n  }\n  return pattern;\n}\n\nfunction renderEmptyStateAction(\n  action: EmptyStateActionConfig,\n  intent: 'primary' | 'secondary',\n) {\n  const {\n    label,\n    onClick,\n    startIcon,\n    disabled,\n    loading,\n    'aria-label': ariaLabel,\n  } = action;\n\n  return (\n    <Button\n      appearance={intent === 'primary' ? 'solid' : 'outline'}\n      variant={intent === 'primary' ? 'primary' : 'secondary'}\n      size=\"sm\"\n      shape=\"rounded\"\n      onClick={onClick}\n      disabled={disabled}\n      loading={loading}\n      startIcon={startIcon}\n      aria-label={ariaLabel}\n      type=\"button\"\n    >\n      {label}\n    </Button>\n  );\n}\n\nexport const EmptyState = React.forwardRef<HTMLElement, EmptyStateProps>(\n  (\n    {\n      className,\n      title,\n      description,\n      size = 'sm',\n      media = 'featured-icon',\n      pattern = 'auto',\n      icon,\n      iconLabel,\n      illustrationVariant = 'cloud',\n      illustrationTone = 'gray',\n      fileExtension,\n      fileType = 'document',\n      primaryAction,\n      secondaryAction,\n      actions,\n      headingLevel = 3,\n      ...props\n    },\n    ref,\n  ) => {\n    const Heading = headingTag[headingLevel];\n    const resolvedPattern = resolvePattern(pattern, media);\n    const defaultIcon = icon ?? <Search aria-hidden=\"true\" />;\n    const hasActions = actions || primaryAction || secondaryAction;\n\n    return (\n      <section\n        ref={ref}\n        data-slot=\"empty-state\"\n        aria-label={typeof title === 'string' ? title : 'Empty state'}\n        className={cn(emptyStateVariants({ size }), className)}\n        {...props}\n      >\n        <div\n          data-slot=\"empty-state-content\"\n          className={cn(\n            'relative z-10 flex min-w-0 flex-1 flex-col items-center',\n            contentGapClass[size],\n          )}\n        >\n          <div\n            data-slot=\"empty-state-body\"\n            className={cn(\n              'flex w-full flex-col items-center',\n              mediaGapClass[size],\n            )}\n          >\n            {media !== 'none' && (\n              <div\n                data-slot=\"empty-state-media\"\n                data-testid=\"empty-state-media\"\n                data-media={media}\n                data-centered=\"true\"\n                className=\"relative flex w-full min-w-0 justify-center\"\n              >\n                <EmptyStateBackgroundPattern\n                  size={size}\n                  variant={resolvedPattern}\n                  data-centered=\"true\"\n                  className=\"z-0\"\n                />\n\n                {media === 'featured-icon' && (\n                  <FeaturedIcon\n                    data-slot=\"empty-state-featured-icon\"\n                    size={featuredIconSize[size]}\n                    shape=\"rounded\"\n                    intent=\"default\"\n                    icon={\n                      <EmptyStateIconGlyph icon={defaultIcon} size={size} />\n                    }\n                    aria-label={iconLabel}\n                    className=\"relative z-10 delight-stagger motion-reduce:animate-none\"\n                  />\n                )}\n\n                {media === 'illustration' && (\n                  <EmptyStateIllustration\n                    size={size}\n                    variant={illustrationVariant}\n                    tone={illustrationTone}\n                    icon={defaultIcon}\n                    className=\"relative z-10 delight-stagger motion-reduce:animate-none\"\n                  />\n                )}\n\n                {media === 'file-type-icon' && (\n                  <div\n                    data-slot=\"empty-state-file-icon-wrap\"\n                    data-testid=\"empty-state-file-icon-wrap\"\n                    data-centered=\"true\"\n                    className={cn(\n                      'relative z-10 flex items-center justify-center rounded-full bg-linear-[104deg,color-mix(in_oklch,var(--card)_60%,transparent),color-mix(in_oklch,var(--muted)_55%,transparent)] delight-stagger motion-reduce:animate-none',\n                      fileIconWrapSizeClass[size],\n                    )}\n                  >\n                    <div\n                      data-slot=\"empty-state-file-icon-optical-center\"\n                      data-testid=\"empty-state-file-icon-optical-center\"\n                      data-centered=\"true\"\n                    >\n                      <FileTypeIcon\n                        extension={fileExtension}\n                        fileType={fileExtension ? undefined : fileType}\n                        size={fileIconSize[size]}\n                        className=\"drop-shadow-[0_1px_2px_var(--shadow-xs-1-color)]\"\n                      />\n                    </div>\n                  </div>\n                )}\n              </div>\n            )}\n\n            <div\n              data-slot=\"empty-state-text\"\n              className={cn(\n                'flex w-full max-w-[352px] flex-col items-center text-center',\n                textGapClass[size],\n              )}\n            >\n              <Heading className=\"w-full text-base font-semibold leading-6 text-foreground\">\n                {title}\n              </Heading>\n              {description && (\n                <p className=\"w-full text-sm leading-5 text-secondary-foreground\">\n                  {description}\n                </p>\n              )}\n            </div>\n          </div>\n\n          {hasActions && (\n            <div\n              data-slot=\"empty-state-actions\"\n              className=\"flex flex-wrap items-center justify-center gap-3\"\n            >\n              {actions ?? (\n                <>\n                  {secondaryAction &&\n                    renderEmptyStateAction(secondaryAction, 'secondary')}\n                  {primaryAction &&\n                    renderEmptyStateAction(primaryAction, 'primary')}\n                </>\n              )}\n            </div>\n          )}\n        </div>\n      </section>\n    );\n  },\n);\n\nEmptyState.displayName = 'EmptyState';\n","/**\n * Web Component wrapper for EmptyState\n * Custom element: <hf-empty-state>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { EmptyState } from '../components/organisms/content/EmptyState';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    title: 'string',\n    description: 'string',\n    size: 'string',\n    media: 'string',\n    pattern: 'string',\n    icon: 'json',\n    iconLabel: 'string',\n    illustrationVariant: 'string',\n    illustrationTone: 'string',\n    fileExtension: 'string',\n    fileType: 'string',\n    primaryAction: 'json',\n    secondaryAction: 'json',\n    actions: 'json',\n    headingLevel: 'string'\n};\n\nclass EmptyStateWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root || !this._childrenContainer) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      EmptyState,\n      props,\n      React.createElement('span', {\n        ref: (el: HTMLSpanElement | null) => {\n          if (el && this._childrenContainer) {\n            el.replaceWith(this._childrenContainer);\n          }\n        },\n        style: { display: 'contents' },\n      }),\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(EmptyStateWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-empty-state')) {\n  customElements.define('hf-empty-state', EmptyStateWC);\n}\n\nexport { EmptyStateWC };\nexport default EmptyStateWC;\n"],"mappings":"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"}

package/dist/wc-react/hf-history.js

@@ -12,8 +12,8 @@ import { t as A } from "./trash-2.js";
 import { t as F } from "./Avatar.js";
 import { t as ae } from "./x.js";
 import { c as ne, d as L, f as d, s as D } from "./_shared.js";
-import { t as se } from "./button.js";
-import { t as oe } from "./Badge.js";
+import { t as se } from "./Badge.js";
+import { t as oe } from "./button.js";
 import * as m from "react";
 import H from "react";
 import { createRoot as ie } from "react-dom/client";
@@ -608,7 +608,7 @@ function Ee({ actor: e, type: a, showConnector: r }) {
 function Ie({ flags: e }) {
   return e?.length ? /* @__PURE__ */ t("span", {
     className: "inline-flex min-w-0 items-center gap-1",
-    children: e.map((a) => /* @__PURE__ */ t(oe, {
+    children: e.map((a) => /* @__PURE__ */ t(se, {
       variant: "soft",
       color: "purple",
       size: "xs",
@@ -685,7 +685,7 @@ function Ae({ title: e, actions: a }) {
       className: "flex shrink-0 items-center gap-1",
       children: a.map((r) => {
         const n = ge[r.id], s = n.Icon;
-        return /* @__PURE__ */ t(se, {
+        return /* @__PURE__ */ t(oe, {
           type: "button",
           appearance: "ghost",
           variant: "secondary",

package/dist/wc-react/hf-hover-card.js

@@ -5,8 +5,8 @@ import { s as N, t as z } from "./useRenderElement.js";
 import { l as ae, t as le } from "./createBaseUIEventDetails.js";
 import { t as ce } from "./useBaseUiId.js";
 import { C as ue, H as de, P as pe, R as ge, S as fe, V as me, _ as he, a as Ce, c as ve, f as Pe, h as Re, i as xe, m as Ie, n as Se, o as ye, p as Te, s as be, w as we, x as Oe } from "./popupStateMapping.js";
-import { t as Ee } from "./useOpenChangeComplete.js";
-import { n as Ne, r as Me, t as Ae } from "./safePolygon.js";
+import { n as Ee, r as Ne, t as Me } from "./safePolygon.js";
+import { r as Ae } from "./stateAttributesMapping.js";
 import { n as Fe, r as He, t as _e } from "./usePositioner.js";
 import { n as De, r as ke, t as Be } from "./store.js";
 import { t as Le } from "./usePopupHandleStore.js";
@@ -247,10 +247,10 @@ var ot = /* @__PURE__ */ v.forwardRef(function(t, n) {
   const l = ce(r), p = d.useState("isTriggerActive", l), P = d.useState("isOpenedByTrigger", l), S = d.useState("floatingRootContext"), y = d.context.inlineRectCoordsRef, C = v.useRef(null), w = u ?? 600, T = c ?? 300, { registerTrigger: R, isMountedByThisTrigger: x } = he(l, C, d, {
     payload: a,
     closeDelay: T
-  }), M = Ne(S, {
+  }), M = Ee(S, {
     mouseOnly: !0,
     move: !1,
-    handleClose: Ae(),
+    handleClose: Me(),
     delay: () => ({
       open: w,
       close: T
@@ -333,13 +333,13 @@ var it = /* @__PURE__ */ v.forwardRef(function(t, n) {
   });
 }), st = /* @__PURE__ */ v.forwardRef(function(t, n) {
   const { className: o, render: i, style: u, ...c } = t, r = b(), { side: a, align: g } = rt(), s = r.useState("open"), f = r.useState("instantType"), h = r.useState("transitionStatus"), d = r.useState("popupProps"), l = r.useState("floatingRootContext"), p = r.useState("closeDelay");
-  return Ee({
+  return Ae({
     open: s,
     ref: r.context.popupRef,
     onComplete() {
       s && r.context.onOpenChangeComplete?.(!0);
     }
-  }), Me(l, { closeDelay: p }), z("div", t, {
+  }), Ne(l, { closeDelay: p }), z("div", t, {
     state: {
       open: s,
       side: a,

package/dist/wc-react/hf-metric-item.js

@@ -5,9 +5,9 @@ import { t as V } from "./arrow-up.js";
 import { t as P } from "./ellipsis-vertical.js";
 import { t as L } from "./trending-up.js";
 import { c as Y, f as m, s as R } from "./_shared.js";
-import { r as T } from "./chart.js";
-import { t as ee } from "./use-reduced-motion.js";
-import { t as te } from "./button.js";
+import { t as T } from "./button.js";
+import { r as ee } from "./chart.js";
+import { t as te } from "./use-reduced-motion.js";
 import * as b from "react";
 import j from "react";
 import { createRoot as re } from "react-dom/client";
@@ -53,7 +53,7 @@ var ce = O("relative shrink-0", {
   defaultVariants: { variant: "line" }
 });
 function y({ data: t, color: r, width: i, height: n = 56, variant: a = "line", showMarker: x = !0, trend: l = "positive", className: N, ...v }) {
-  const u = b.useId(), _ = !ee(), d = r || (l === "positive" ? "var(--success)" : "var(--destructive)"), w = le(i), M = ae(n, 56), f = b.useMemo(() => t.map((h) => U(h)), [t]), c = b.useMemo(() => f.map((h, I) => ({
+  const u = b.useId(), _ = !te(), d = r || (l === "positive" ? "var(--success)" : "var(--destructive)"), w = le(i), M = ae(n, 56), f = b.useMemo(() => t.map((h) => U(h)), [t]), c = b.useMemo(() => f.map((h, I) => ({
     index: I,
     value: h
   })), [f]), g = b.useMemo(() => ({ value: { color: d } }), [d]), o = f[f.length - 1] ?? 0, E = b.useMemo(() => {
@@ -70,7 +70,7 @@ function y({ data: t, color: r, width: i, height: n = 56, variant: a = "line", s
     className: m(ce({ variant: a }), N),
     style: A,
     ...v,
-    children: [/* @__PURE__ */ e(T, {
+    children: [/* @__PURE__ */ e(ee, {
       config: g,
       className: "size-full",
       children: a === "layers" ? /* @__PURE__ */ s(J, {
@@ -485,7 +485,7 @@ var S = O("relative flex flex-col gap-2 p-5 bg-background rounded-xl border bord
       }),
       u && /* @__PURE__ */ e("div", {
         className: "flex items-center gap-2 pt-2",
-        children: /* @__PURE__ */ e(te, {
+        children: /* @__PURE__ */ e(T, {
           appearance: "outline",
           variant: "secondary",
           size: "sm",

package/dist/wc-react/hf-metric-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-metric-item.js","names":["__iconNode"],"sources":["../../../../node_modules/.bun/lucide-react@1.37.0+0f58469d5b3bd39f/node_modules/lucide-react/dist/esm/icons/arrow-up-right.mjs","../../../../node_modules/.bun/lucide-react@1.37.0+0f58469d5b3bd39f/node_modules/lucide-react/dist/esm/icons/eye.mjs","../../src/components/organisms/content/MetricItem/MetricItem.tsx","../../src/wc/hf-metric-item.ts"],"sourcesContent":["/**\n * @license lucide-react v1.37.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\"path\", { d: \"M7 7h10v10\", key: \"1tivn9\" }],\n  [\"path\", { d: \"M7 17 17 7\", key: \"1vkiza\" }]\n];\nconst ArrowUpRight = createLucideIcon(\"arrow-up-right\", __iconNode);\n\nexport { __iconNode, ArrowUpRight as default };\n//# sourceMappingURL=arrow-up-right.mjs.map\n","/**\n * @license lucide-react v1.37.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\n    \"path\",\n    {\n      d: \"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\",\n      key: \"1nclc0\"\n    }\n  ],\n  [\"circle\", { cx: \"12\", cy: \"12\", r: \"3\", key: \"1v7zrd\" }]\n];\nconst Eye = createLucideIcon(\"eye\", __iconNode);\n\nexport { __iconNode, Eye as default };\n//# sourceMappingURL=eye.mjs.map\n","import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  ArrowUp,\n  ArrowUpRight,\n  Eye,\n  MoreVertical,\n  TrendingUp,\n} from 'lucide-react';\nimport * as React from 'react';\nimport { Area, AreaChart, Line, LineChart } from 'recharts';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { type ChartConfig, ChartContainer } from '@/components/ui/chart';\nimport { useReducedMotion } from '@/hooks/use-reduced-motion';\nimport { cn } from '@/lib/utils';\n\nconst MINI_CHART_MARGIN = { top: 0, right: 0, bottom: 0, left: 0 };\n\nfunction getFiniteMetricNumber(value: number, fallback = 0): number {\n  return Number.isFinite(value) ? value : fallback;\n}\n\nfunction getFinitePositiveMetricNumber(\n  value: number | undefined,\n  fallback: number,\n): number {\n  return typeof value === 'number' && Number.isFinite(value) && value > 0\n    ? value\n    : fallback;\n}\n\nfunction getFinitePositiveMetricNumberOrUndefined(\n  value: number | undefined,\n): number | undefined {\n  return typeof value === 'number' && Number.isFinite(value) && value > 0\n    ? value\n    : undefined;\n}\n\nfunction formatMetricValue(value: string | number): string | number {\n  return typeof value === 'number'\n    ? getFiniteMetricNumber(value).toLocaleString()\n    : value;\n}\n\n// ============================================\n// MetricMiniChart - Sparkline chart component\n// ============================================\n\nconst metricMiniChartVariants = cva('relative shrink-0', {\n  variants: {\n    variant: {\n      line: '',\n      area: '',\n      layers: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'line',\n  },\n});\n\nexport interface MetricMiniChartProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof metricMiniChartVariants> {\n  /** Data points for the sparkline */\n  data: number[];\n  /** Color of the chart line/area */\n  color?: string;\n  /** Width of the chart */\n  width?: number;\n  /** Height of the chart */\n  height?: number;\n  /** Show marker dot at the end */\n  showMarker?: boolean;\n  /** Trend direction for styling */\n  trend?: 'positive' | 'negative';\n}\n\nfunction MetricMiniChart({\n  data,\n  color,\n  width,\n  height = 56,\n  variant = 'line',\n  showMarker = true,\n  trend = 'positive',\n  className,\n  ...props\n}: MetricMiniChartProps) {\n  const gradientId = React.useId();\n  const prefersReducedMotion = useReducedMotion();\n  const shouldAnimate = !prefersReducedMotion;\n  const trendColor =\n    trend === 'positive' ? 'var(--success)' : 'var(--destructive)';\n  const chartColor = color || trendColor;\n  const chartWidth = getFinitePositiveMetricNumberOrUndefined(width);\n  const chartHeight = getFinitePositiveMetricNumber(height, 56);\n  const safeData = React.useMemo(\n    () => data.map((value) => getFiniteMetricNumber(value)),\n    [data],\n  );\n\n  // Transform data for recharts\n  const chartData = React.useMemo(\n    () => safeData.map((value, index) => ({ index, value })),\n    [safeData],\n  );\n\n  const chartConfig: ChartConfig = React.useMemo(\n    () => ({\n      value: {\n        color: chartColor,\n      },\n    }),\n    [chartColor],\n  );\n\n  // Find the max value index for marker positioning\n  const lastIndex = safeData.length - 1;\n  const lastValue = safeData[lastIndex] ?? 0;\n  const markerTop = React.useMemo(() => {\n    const maxValue = safeData.length > 0 ? Math.max(...safeData) : 0;\n    return maxValue <= 0\n      ? 50\n      : Math.max(10, Math.min(90, 100 - (lastValue / maxValue) * 100));\n  }, [safeData, lastValue]);\n  const rootStyle = React.useMemo(\n    () => ({ width: chartWidth, height: chartHeight }),\n    [chartHeight, chartWidth],\n  );\n\n  // Width can be undefined to allow CSS classes (like w-full) to control responsive width\n  return (\n    <div\n      data-slot=\"metric-mini-chart\"\n      aria-hidden=\"true\"\n      inert={true}\n      className={cn(metricMiniChartVariants({ variant }), className)}\n      style={rootStyle}\n      {...props}\n    >\n      <ChartContainer config={chartConfig} className=\"size-full\">\n        {variant === 'layers' ? (\n          <AreaChart data={chartData} margin={MINI_CHART_MARGIN}>\n            <defs>\n              <linearGradient\n                id={`fillArea${gradientId}`}\n                x1=\"0\"\n                y1=\"0\"\n                x2=\"0\"\n                y2=\"1\"\n              >\n                <stop offset=\"0%\" stopColor={chartColor} stopOpacity={0.3} />\n                <stop offset=\"100%\" stopColor={chartColor} stopOpacity={0.05} />\n              </linearGradient>\n            </defs>\n            <Area\n              type=\"monotone\"\n              dataKey=\"value\"\n              stroke={chartColor}\n              strokeWidth={2}\n              fill={`url(#fillArea${gradientId})`}\n              isAnimationActive={shouldAnimate}\n            />\n          </AreaChart>\n        ) : (\n          <LineChart data={chartData} margin={MINI_CHART_MARGIN}>\n            {variant === 'area' && (\n              <>\n                <defs>\n                  <linearGradient\n                    id={`fillLine${gradientId}`}\n                    x1=\"0\"\n                    y1=\"0\"\n                    x2=\"0\"\n                    y2=\"1\"\n                  >\n                    <stop\n                      offset=\"0%\"\n                      stopColor={chartColor}\n                      stopOpacity={0.15}\n                    />\n                    <stop\n                      offset=\"100%\"\n                      stopColor={chartColor}\n                      stopOpacity={0.02}\n                    />\n                  </linearGradient>\n                </defs>\n                <Area\n                  type=\"monotone\"\n                  dataKey=\"value\"\n                  stroke=\"none\"\n                  fill={`url(#fillLine${gradientId})`}\n                  isAnimationActive={shouldAnimate}\n                />\n              </>\n            )}\n            <Line\n              type=\"monotone\"\n              dataKey=\"value\"\n              stroke={chartColor}\n              strokeWidth={2}\n              dot={false}\n              isAnimationActive={shouldAnimate}\n            />\n          </LineChart>\n        )}\n      </ChartContainer>\n\n      {/* Marker dot */}\n      {showMarker && variant === 'line' && (\n        <div\n          className=\"absolute\"\n          style={{\n            right: 0,\n            top: `${markerTop}%`,\n            transform: 'translate(50%, -50%)',\n          }}\n        >\n          <div\n            className=\"size-[19px] rounded-full opacity-20\"\n            style={{ backgroundColor: chartColor }}\n          />\n          <div\n            className=\"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 size-[10px] rounded-full bg-background border-2\"\n            style={{ borderColor: chartColor }}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nMetricMiniChart.displayName = 'MetricMiniChart';\n\n// ============================================\n// MetricChange - Change indicator component\n// ============================================\n\nconst metricChangeVariants = cva('inline-flex items-center gap-0.5', {\n  variants: {\n    variant: {\n      default: '',\n      badge:\n        'bg-background border border-border rounded-md shadow-xs px-1.5 py-0.5',\n    },\n    trend: {\n      positive: '',\n      negative: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    trend: 'positive',\n  },\n});\n\nexport interface MetricChangeProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof metricChangeVariants> {\n  /** Change value (e.g., \"100%\", \"+25%\") */\n  value: string;\n  /** Icon type ('none' to hide icon) */\n  icon?: 'arrow' | 'trend' | 'arrow-right' | 'none';\n}\n\nfunction MetricChange({\n  value,\n  variant = 'default',\n  trend = 'positive',\n  icon = 'arrow',\n  className,\n  ...props\n}: MetricChangeProps) {\n  const iconColor =\n    trend === 'positive' ? 'var(--success)' : 'var(--destructive)';\n  const textColor =\n    variant === 'badge'\n      ? 'text-secondary-foreground'\n      : trend === 'positive'\n        ? 'text-success'\n        : 'text-destructive';\n\n  const IconComponent =\n    icon === 'none'\n      ? null\n      : icon === 'trend'\n        ? TrendingUp\n        : icon === 'arrow-right'\n          ? ArrowUpRight\n          : ArrowUp;\n\n  const iconSize = variant === 'badge' ? 12 : 16;\n\n  return (\n    <div\n      className={cn(metricChangeVariants({ variant, trend }), className)}\n      {...props}\n    >\n      {IconComponent && (\n        <IconComponent\n          aria-hidden=\"true\"\n          width={iconSize}\n          height={iconSize}\n          color={iconColor}\n          className={cn(trend === 'negative' && 'rotate-180')}\n        />\n      )}\n      <span className=\"sr-only\">\n        {trend === 'positive' ? 'Increased' : 'Decreased'}\n      </span>\n      <span className={cn('text-sm font-medium', textColor)}>{value}</span>\n    </div>\n  );\n}\n\nMetricChange.displayName = 'MetricChange';\n\n// ============================================\n// MetricItem - Main component\n// ============================================\n\nconst metricItemVariants = cva(\n  'relative flex flex-col gap-2 p-5 bg-background rounded-xl border border-border shadow-xs transition-shadow duration-200 ease-out hover:shadow-sm motion-reduce:transition-none',\n  {\n    variants: {\n      type: {\n        simple: '',\n        'icon-01': '',\n        'icon-02': '',\n        'icon-03': '',\n        'icon-04': 'flex-row items-center',\n        'chart-01': '',\n        'chart-02': '',\n        'chart-03': '',\n        'chart-04': 'p-0 bg-transparent border-0 shadow-none',\n      },\n      breakpoint: {\n        desktop: '',\n        mobile: '',\n      },\n    },\n    defaultVariants: {\n      type: 'simple',\n      breakpoint: 'desktop',\n    },\n  },\n);\n\nexport interface MetricItemProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof metricItemVariants> {\n  /** Title/label of the metric */\n  title: string;\n  /** Main value to display */\n  value: string | number;\n  /** Change indicator value */\n  changeValue?: string;\n  /** Change trend direction */\n  changeTrend?: 'positive' | 'negative';\n  /** Change icon type ('none' to hide icon) */\n  changeIcon?: 'arrow' | 'trend' | 'arrow-right' | 'none';\n  /** Comparison text (e.g., \"vs last month\") */\n  comparisonText?: string;\n  /** Subtitle/description text shown next to value (alternative to change indicator) */\n  subtitle?: string;\n  /** Show dropdown menu button */\n  showDropdown?: boolean;\n  /** Show action buttons */\n  showActions?: boolean;\n  /** Action button click handler */\n  onViewReport?: () => void;\n  /** Dropdown click handler */\n  onDropdownClick?: () => void;\n  /** Icon for icon variants */\n  icon?: React.ReactNode;\n  /** Icon background color */\n  iconBgColor?: string;\n  /** Icon color */\n  iconColor?: string;\n  /** Chart data for chart variants */\n  chartData?: number[];\n  /** Featured icon variant style */\n  featuredIconVariant?: 'circle' | 'square' | 'modern';\n  /** Custom content to render instead of chart (for chart-04 type) */\n  children?: React.ReactNode;\n}\n\nconst MetricItem = React.memo(function MetricItem({\n  title,\n  value,\n  changeValue,\n  changeTrend = 'positive',\n  changeIcon,\n  comparisonText,\n  subtitle,\n  showDropdown = false,\n  showActions = false,\n  onViewReport,\n  onDropdownClick,\n  icon,\n  iconBgColor,\n  iconColor,\n  chartData,\n  featuredIconVariant = 'circle',\n  type = 'simple',\n  breakpoint = 'desktop',\n  className,\n  children,\n  ...props\n}: MetricItemProps) {\n  // Default icon for icon variants\n  const defaultIcon = <TrendingUp width={24} height={24} />;\n  const displayIcon = icon || defaultIcon;\n  const displayValue = formatMetricValue(value);\n\n  // Default icon colors based on type and variant\n  const defaultIconBgColor =\n    type === 'icon-01'\n      ? featuredIconVariant === 'modern'\n        ? 'var(--muted)' // for modern\n        : 'var(--success-muted)' // for circle/square\n      : type === 'icon-02' || type === 'icon-03' || type === 'icon-04'\n        ? 'var(--muted)'\n        : 'var(--success-muted)';\n\n  const defaultIconColor =\n    type === 'icon-01'\n      ? featuredIconVariant === 'modern'\n        ? 'var(--secondary-foreground)' // for modern\n        : 'var(--success)' // for circle/square\n      : type === 'icon-02'\n        ? 'var(--secondary-foreground)'\n        : 'var(--success)';\n\n  const finalIconBgColor = iconBgColor || defaultIconBgColor;\n  const finalIconColor = iconColor || defaultIconColor;\n\n  // Chart-04 has a different structure\n  if (type === 'chart-04') {\n    return (\n      <div\n        data-slot=\"metric-item\"\n        className={cn(metricItemVariants({ type, breakpoint }), className)}\n        {...props}\n      >\n        <div className=\"flex flex-col gap-0.5 w-full\">\n          {/* Header */}\n          <div className=\"flex items-center px-5 pt-3 pb-2 w-full\">\n            <p className=\"flex-1 text-sm font-semibold text-foreground\">\n              {title}\n            </p>\n          </div>\n\n          {/* Content card */}\n          <div className=\"relative bg-background border border-border rounded-xl shadow-xs p-5 flex flex-col gap-5\">\n            {/* Number and change */}\n            <div className=\"flex flex-wrap items-center gap-3\">\n              <p className=\"text-display-sm font-semibold text-foreground\">\n                {displayValue}\n              </p>\n              {changeValue && (\n                <div className=\"flex items-center gap-2\">\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    // chart-04 defaults to 'trend' icon for backward compatibility\n                    icon={changeIcon ?? 'trend'}\n                  />\n                  {comparisonText && (\n                    <span className=\"text-sm font-medium text-muted-foreground\">\n                      {comparisonText}\n                    </span>\n                  )}\n                </div>\n              )}\n            </div>\n\n            {/* Chart or custom content */}\n            {children ? (\n              children\n            ) : chartData ? (\n              <MetricMiniChart\n                data={chartData}\n                width={undefined}\n                height={56}\n                variant=\"line\"\n                showMarker={false}\n                trend={changeTrend}\n                className=\"w-full\"\n              />\n            ) : null}\n\n            {/* Dropdown */}\n            {showDropdown && (\n              <button\n                type=\"button\"\n                aria-label=\"More options\"\n                className=\"absolute top-2 end-2 p-3 cursor-pointer rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background transition-colors duration-150 ease-out hover:text-foreground\"\n                onClick={onDropdownClick}\n              >\n                <MoreVertical\n                  width={20}\n                  height={20}\n                  className=\"text-muted-foreground\"\n                />\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      data-slot=\"metric-item\"\n      className={cn(metricItemVariants({ type, breakpoint }), className)}\n      {...props}\n    >\n      {/* Featured Icon (for icon-01 only - standalone icon above content) */}\n      {type === 'icon-01' && (\n        <div\n          className={cn(\n            'flex items-center justify-center shrink-0 relative overflow-clip',\n            featuredIconVariant === 'modern'\n              ? 'rounded-[10px] border border-border shadow-xs'\n              : featuredIconVariant === 'square'\n                ? 'rounded-[10px] border border-border shadow-xs'\n                : 'rounded-full',\n          )}\n          style={{\n            width: 48,\n            height: 48,\n            backgroundColor: finalIconBgColor,\n            color: finalIconColor,\n          }}\n        >\n          {displayIcon}\n          {/* Skeuomorphic inner shadow overlay for modern variant */}\n          {featuredIconVariant === 'modern' && (\n            <div\n              className=\"absolute inset-0 pointer-events-none rounded-[10px]\"\n              style={{\n                boxShadow: 'var(--shadow-inset-ring)',\n              }}\n            />\n          )}\n        </div>\n      )}\n\n      {/* Icon-02 and Icon-03: Heading row with icon + title */}\n      {(type === 'icon-02' || type === 'icon-03') && (\n        <div className=\"flex items-center gap-3 w-full\">\n          <div\n            className={cn(\n              'flex items-center justify-center shrink-0',\n              type === 'icon-02'\n                ? 'rounded-full'\n                : 'rounded-lg border border-border shadow-xs',\n            )}\n            style={{\n              width: 48,\n              height: 48,\n              backgroundColor: finalIconBgColor,\n              color: finalIconColor,\n            }}\n          >\n            {icon || <Eye width={24} height={24} />}\n          </div>\n          <p className=\"flex-1 text-base font-semibold text-foreground\">\n            {title}\n          </p>\n        </div>\n      )}\n\n      {/* Icon-04: Horizontal layout with featured icon + content */}\n      {type === 'icon-04' && (\n        <div\n          className={cn(\n            'flex items-center justify-center shrink-0 rounded-md border border-border shadow-xs',\n          )}\n          style={{\n            width: 40,\n            height: 40,\n            backgroundColor: finalIconBgColor,\n            color: finalIconColor,\n          }}\n        >\n          {icon || <TrendingUp width={20} height={20} />}\n        </div>\n      )}\n\n      {/* Heading and number section */}\n      {type !== 'icon-02' && type !== 'icon-03' && (\n        <div\n          className={cn(\n            'flex flex-col gap-2',\n            type === 'icon-04' ? 'flex-1 min-w-0' : 'w-full',\n          )}\n        >\n          {/* Title */}\n          {type === 'chart-01' || type === 'chart-02' ? (\n            <p className=\"text-base font-semibold text-foreground\">{title}</p>\n          ) : type === 'icon-04' || type === 'icon-01' ? (\n            <p className=\"text-sm font-semibold text-muted-foreground\">\n              {title}\n            </p>\n          ) : (\n            <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>\n          )}\n\n          {/* Number and badge row */}\n          {type === 'simple' || type === 'icon-01' || type === 'icon-04' ? (\n            <div className=\"flex flex-wrap items-center justify-between gap-3 w-full\">\n              <p className=\"text-display-sm font-semibold text-foreground\">\n                {displayValue}\n              </p>\n              {/* Show inline change + comparison OR badge OR subtitle */}\n              {changeValue && comparisonText ? (\n                <div className=\"flex items-center gap-2\">\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    icon=\"arrow\"\n                  />\n                  <span className=\"text-sm font-medium text-muted-foreground\">\n                    {comparisonText}\n                  </span>\n                </div>\n              ) : changeValue ? (\n                <MetricChange\n                  value={changeValue}\n                  trend={changeTrend}\n                  // badge variant defaults to 'arrow-right' icon for backward compatibility\n                  icon={changeIcon ?? 'arrow-right'}\n                  variant=\"badge\"\n                />\n              ) : subtitle ? (\n                <span className=\"text-sm font-medium text-muted-foreground\">\n                  {subtitle}\n                </span>\n              ) : null}\n            </div>\n          ) : null}\n        </div>\n      )}\n\n      {/* Chart variants content */}\n      {type === 'chart-01' && (\n        <div className=\"flex items-end gap-4 w-full\">\n          <div className=\"flex-1 flex flex-col gap-3\">\n            <p className=\"text-display-sm font-semibold text-foreground\">\n              {displayValue}\n            </p>\n            {(changeValue || comparisonText) && (\n              <div className=\"flex items-center gap-2\">\n                {changeValue && (\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    icon=\"arrow\"\n                  />\n                )}\n                {comparisonText && (\n                  <span className=\"text-sm font-medium text-muted-foreground truncate\">\n                    {comparisonText}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              width={112}\n              height={56}\n              variant=\"line\"\n              trend={changeTrend}\n            />\n          )}\n        </div>\n      )}\n\n      {type === 'chart-02' && (\n        <div className=\"flex items-end gap-4 w-full\">\n          <div className=\"flex-1 flex items-start gap-2\">\n            <p className=\"text-display-md font-semibold text-foreground\">\n              {displayValue}\n            </p>\n            {changeValue && (\n              <MetricChange\n                value={changeValue}\n                trend={changeTrend}\n                icon=\"trend\"\n              />\n            )}\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              width={128}\n              height={56}\n              variant=\"layers\"\n              showMarker={false}\n              trend={changeTrend}\n            />\n          )}\n        </div>\n      )}\n\n      {type === 'chart-03' && (\n        <>\n          <div className=\"flex flex-col gap-2 w-full\">\n            <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>\n            <div className=\"flex flex-wrap items-center justify-between gap-3 w-full\">\n              <p className=\"text-display-sm font-semibold text-foreground\">\n                {displayValue}\n              </p>\n              {(changeValue || comparisonText) && (\n                <div className=\"flex items-center gap-2\">\n                  {changeValue && (\n                    <MetricChange\n                      value={changeValue}\n                      trend={changeTrend}\n                      icon=\"trend\"\n                    />\n                  )}\n                  {comparisonText && (\n                    <span className=\"text-sm font-medium text-muted-foreground\">\n                      {comparisonText}\n                    </span>\n                  )}\n                </div>\n              )}\n            </div>\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              height={72}\n              variant=\"area\"\n              showMarker={false}\n              trend={changeTrend}\n              className=\"w-full\"\n            />\n          )}\n        </>\n      )}\n\n      {/* Icon-02 and Icon-03 number section */}\n      {(type === 'icon-02' || type === 'icon-03') && (\n        <div className=\"flex items-end gap-4 w-full\">\n          <div className=\"flex-1 flex flex-col gap-3\">\n            <p className=\"text-display-md font-semibold text-foreground\">\n              {displayValue}\n            </p>\n            {(changeValue || comparisonText) && (\n              <div className=\"flex items-center gap-2\">\n                {changeValue && (\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    icon={type === 'icon-03' ? 'trend' : 'arrow'}\n                  />\n                )}\n                {comparisonText && (\n                  <span className=\"text-sm font-medium text-muted-foreground truncate\">\n                    {comparisonText}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              width={112}\n              height={56}\n              variant=\"line\"\n              trend={changeTrend}\n            />\n          )}\n        </div>\n      )}\n\n      {/* Dropdown button */}\n      {showDropdown && (\n        <button\n          type=\"button\"\n          aria-label=\"More options\"\n          className=\"absolute top-2 end-2 cursor-pointer rounded-sm p-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background transition-colors duration-150 ease-out hover:text-foreground\"\n          onClick={onDropdownClick}\n        >\n          <MoreVertical\n            width={20}\n            height={20}\n            className=\"text-muted-foreground\"\n          />\n        </button>\n      )}\n\n      {/* Action buttons */}\n      {showActions && (\n        <div className=\"flex items-center gap-2 pt-2\">\n          <Button\n            appearance=\"outline\"\n            variant=\"secondary\"\n            size=\"sm\"\n            onClick={onViewReport}\n          >\n            View report\n          </Button>\n        </div>\n      )}\n    </div>\n  );\n});\n\nMetricItem.displayName = 'MetricItem';\n\nexport {\n  MetricChange,\n  MetricItem,\n  MetricMiniChart,\n  metricChangeVariants,\n  metricItemVariants,\n  metricMiniChartVariants,\n};\n","/**\n * Web Component wrapper for MetricItem\n * Custom element: <hf-metric-item>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { MetricItem } from '../components/organisms/content/MetricItem';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Event wrapper that dispatches custom DOM events\n */\nfunction createEventDispatcher(element: HTMLElement) {\n  return {\n    onViewReport: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('view-report', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    },\n    onDropdownClick: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('dropdown-click', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    }\n  };\n}\n\n/**\n * Wrapper component that connects React events to DOM custom events\n */\nfunction MetricItemWrapper(props: React.ComponentProps<typeof MetricItem> & { _hostElement?: HTMLElement }) {\n  const { _hostElement, ...restProps } = props;\n\n  const eventHandlers = React.useMemo(() => {\n    if (!_hostElement) return {};\n    return createEventDispatcher(_hostElement);\n  }, [_hostElement]);\n\n  return React.createElement(MetricItem, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    type: 'string',\n    breakpoint: 'string',\n    title: 'string',\n    value: 'string',\n    changeValue: 'string',\n    changeTrend: 'string',\n    changeIcon: 'string',\n    comparisonText: 'string',\n    subtitle: 'string',\n    showDropdown: 'boolean',\n    showActions: 'boolean',\n    icon: 'json',\n    iconBgColor: 'string',\n    iconColor: 'string',\n    chartData: 'json',\n    featuredIconVariant: 'string'\n};\n\nclass MetricItemWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root || !this._childrenContainer) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      MetricItemWrapper,\n      { ...props, _hostElement: this },\n      React.createElement('span', {\n        ref: (el: HTMLSpanElement | null) => {\n          if (el && this._childrenContainer) {\n            el.replaceWith(this._childrenContainer);\n          }\n        },\n        style: { display: 'contents' },\n      }),\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(MetricItemWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-metric-item')) {\n  customElements.define('hf-metric-item', MetricItemWC);\n}\n\nexport { MetricItemWC };\nexport default MetricItemWC;\n"],"x_google_ignoreList":[0,1],"mappings":"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"}
+{"version":3,"file":"hf-metric-item.js","names":["__iconNode"],"sources":["../../../../node_modules/.bun/lucide-react@1.37.0+0f58469d5b3bd39f/node_modules/lucide-react/dist/esm/icons/arrow-up-right.mjs","../../../../node_modules/.bun/lucide-react@1.37.0+0f58469d5b3bd39f/node_modules/lucide-react/dist/esm/icons/eye.mjs","../../src/components/organisms/content/MetricItem/MetricItem.tsx","../../src/wc/hf-metric-item.ts"],"sourcesContent":["/**\n * @license lucide-react v1.37.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\"path\", { d: \"M7 7h10v10\", key: \"1tivn9\" }],\n  [\"path\", { d: \"M7 17 17 7\", key: \"1vkiza\" }]\n];\nconst ArrowUpRight = createLucideIcon(\"arrow-up-right\", __iconNode);\n\nexport { __iconNode, ArrowUpRight as default };\n//# sourceMappingURL=arrow-up-right.mjs.map\n","/**\n * @license lucide-react v1.37.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\n    \"path\",\n    {\n      d: \"M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0\",\n      key: \"1nclc0\"\n    }\n  ],\n  [\"circle\", { cx: \"12\", cy: \"12\", r: \"3\", key: \"1v7zrd\" }]\n];\nconst Eye = createLucideIcon(\"eye\", __iconNode);\n\nexport { __iconNode, Eye as default };\n//# sourceMappingURL=eye.mjs.map\n","import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  ArrowUp,\n  ArrowUpRight,\n  Eye,\n  MoreVertical,\n  TrendingUp,\n} from 'lucide-react';\nimport * as React from 'react';\nimport { Area, AreaChart, Line, LineChart } from 'recharts';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { type ChartConfig, ChartContainer } from '@/components/ui/chart';\nimport { useReducedMotion } from '@/hooks/use-reduced-motion';\nimport { cn } from '@/lib/utils';\n\nconst MINI_CHART_MARGIN = { top: 0, right: 0, bottom: 0, left: 0 };\n\nfunction getFiniteMetricNumber(value: number, fallback = 0): number {\n  return Number.isFinite(value) ? value : fallback;\n}\n\nfunction getFinitePositiveMetricNumber(\n  value: number | undefined,\n  fallback: number,\n): number {\n  return typeof value === 'number' && Number.isFinite(value) && value > 0\n    ? value\n    : fallback;\n}\n\nfunction getFinitePositiveMetricNumberOrUndefined(\n  value: number | undefined,\n): number | undefined {\n  return typeof value === 'number' && Number.isFinite(value) && value > 0\n    ? value\n    : undefined;\n}\n\nfunction formatMetricValue(value: string | number): string | number {\n  return typeof value === 'number'\n    ? getFiniteMetricNumber(value).toLocaleString()\n    : value;\n}\n\n// ============================================\n// MetricMiniChart - Sparkline chart component\n// ============================================\n\nconst metricMiniChartVariants = cva('relative shrink-0', {\n  variants: {\n    variant: {\n      line: '',\n      area: '',\n      layers: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'line',\n  },\n});\n\nexport interface MetricMiniChartProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof metricMiniChartVariants> {\n  /** Data points for the sparkline */\n  data: number[];\n  /** Color of the chart line/area */\n  color?: string;\n  /** Width of the chart */\n  width?: number;\n  /** Height of the chart */\n  height?: number;\n  /** Show marker dot at the end */\n  showMarker?: boolean;\n  /** Trend direction for styling */\n  trend?: 'positive' | 'negative';\n}\n\nfunction MetricMiniChart({\n  data,\n  color,\n  width,\n  height = 56,\n  variant = 'line',\n  showMarker = true,\n  trend = 'positive',\n  className,\n  ...props\n}: MetricMiniChartProps) {\n  const gradientId = React.useId();\n  const prefersReducedMotion = useReducedMotion();\n  const shouldAnimate = !prefersReducedMotion;\n  const trendColor =\n    trend === 'positive' ? 'var(--success)' : 'var(--destructive)';\n  const chartColor = color || trendColor;\n  const chartWidth = getFinitePositiveMetricNumberOrUndefined(width);\n  const chartHeight = getFinitePositiveMetricNumber(height, 56);\n  const safeData = React.useMemo(\n    () => data.map((value) => getFiniteMetricNumber(value)),\n    [data],\n  );\n\n  // Transform data for recharts\n  const chartData = React.useMemo(\n    () => safeData.map((value, index) => ({ index, value })),\n    [safeData],\n  );\n\n  const chartConfig: ChartConfig = React.useMemo(\n    () => ({\n      value: {\n        color: chartColor,\n      },\n    }),\n    [chartColor],\n  );\n\n  // Find the max value index for marker positioning\n  const lastIndex = safeData.length - 1;\n  const lastValue = safeData[lastIndex] ?? 0;\n  const markerTop = React.useMemo(() => {\n    const maxValue = safeData.length > 0 ? Math.max(...safeData) : 0;\n    return maxValue <= 0\n      ? 50\n      : Math.max(10, Math.min(90, 100 - (lastValue / maxValue) * 100));\n  }, [safeData, lastValue]);\n  const rootStyle = React.useMemo(\n    () => ({ width: chartWidth, height: chartHeight }),\n    [chartHeight, chartWidth],\n  );\n\n  // Width can be undefined to allow CSS classes (like w-full) to control responsive width\n  return (\n    <div\n      data-slot=\"metric-mini-chart\"\n      aria-hidden=\"true\"\n      inert={true}\n      className={cn(metricMiniChartVariants({ variant }), className)}\n      style={rootStyle}\n      {...props}\n    >\n      <ChartContainer config={chartConfig} className=\"size-full\">\n        {variant === 'layers' ? (\n          <AreaChart data={chartData} margin={MINI_CHART_MARGIN}>\n            <defs>\n              <linearGradient\n                id={`fillArea${gradientId}`}\n                x1=\"0\"\n                y1=\"0\"\n                x2=\"0\"\n                y2=\"1\"\n              >\n                <stop offset=\"0%\" stopColor={chartColor} stopOpacity={0.3} />\n                <stop offset=\"100%\" stopColor={chartColor} stopOpacity={0.05} />\n              </linearGradient>\n            </defs>\n            <Area\n              type=\"monotone\"\n              dataKey=\"value\"\n              stroke={chartColor}\n              strokeWidth={2}\n              fill={`url(#fillArea${gradientId})`}\n              isAnimationActive={shouldAnimate}\n            />\n          </AreaChart>\n        ) : (\n          <LineChart data={chartData} margin={MINI_CHART_MARGIN}>\n            {variant === 'area' && (\n              <>\n                <defs>\n                  <linearGradient\n                    id={`fillLine${gradientId}`}\n                    x1=\"0\"\n                    y1=\"0\"\n                    x2=\"0\"\n                    y2=\"1\"\n                  >\n                    <stop\n                      offset=\"0%\"\n                      stopColor={chartColor}\n                      stopOpacity={0.15}\n                    />\n                    <stop\n                      offset=\"100%\"\n                      stopColor={chartColor}\n                      stopOpacity={0.02}\n                    />\n                  </linearGradient>\n                </defs>\n                <Area\n                  type=\"monotone\"\n                  dataKey=\"value\"\n                  stroke=\"none\"\n                  fill={`url(#fillLine${gradientId})`}\n                  isAnimationActive={shouldAnimate}\n                />\n              </>\n            )}\n            <Line\n              type=\"monotone\"\n              dataKey=\"value\"\n              stroke={chartColor}\n              strokeWidth={2}\n              dot={false}\n              isAnimationActive={shouldAnimate}\n            />\n          </LineChart>\n        )}\n      </ChartContainer>\n\n      {/* Marker dot */}\n      {showMarker && variant === 'line' && (\n        <div\n          className=\"absolute\"\n          style={{\n            right: 0,\n            top: `${markerTop}%`,\n            transform: 'translate(50%, -50%)',\n          }}\n        >\n          <div\n            className=\"size-[19px] rounded-full opacity-20\"\n            style={{ backgroundColor: chartColor }}\n          />\n          <div\n            className=\"absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 size-[10px] rounded-full bg-background border-2\"\n            style={{ borderColor: chartColor }}\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n\nMetricMiniChart.displayName = 'MetricMiniChart';\n\n// ============================================\n// MetricChange - Change indicator component\n// ============================================\n\nconst metricChangeVariants = cva('inline-flex items-center gap-0.5', {\n  variants: {\n    variant: {\n      default: '',\n      badge:\n        'bg-background border border-border rounded-md shadow-xs px-1.5 py-0.5',\n    },\n    trend: {\n      positive: '',\n      negative: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n    trend: 'positive',\n  },\n});\n\nexport interface MetricChangeProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof metricChangeVariants> {\n  /** Change value (e.g., \"100%\", \"+25%\") */\n  value: string;\n  /** Icon type ('none' to hide icon) */\n  icon?: 'arrow' | 'trend' | 'arrow-right' | 'none';\n}\n\nfunction MetricChange({\n  value,\n  variant = 'default',\n  trend = 'positive',\n  icon = 'arrow',\n  className,\n  ...props\n}: MetricChangeProps) {\n  const iconColor =\n    trend === 'positive' ? 'var(--success)' : 'var(--destructive)';\n  const textColor =\n    variant === 'badge'\n      ? 'text-secondary-foreground'\n      : trend === 'positive'\n        ? 'text-success'\n        : 'text-destructive';\n\n  const IconComponent =\n    icon === 'none'\n      ? null\n      : icon === 'trend'\n        ? TrendingUp\n        : icon === 'arrow-right'\n          ? ArrowUpRight\n          : ArrowUp;\n\n  const iconSize = variant === 'badge' ? 12 : 16;\n\n  return (\n    <div\n      className={cn(metricChangeVariants({ variant, trend }), className)}\n      {...props}\n    >\n      {IconComponent && (\n        <IconComponent\n          aria-hidden=\"true\"\n          width={iconSize}\n          height={iconSize}\n          color={iconColor}\n          className={cn(trend === 'negative' && 'rotate-180')}\n        />\n      )}\n      <span className=\"sr-only\">\n        {trend === 'positive' ? 'Increased' : 'Decreased'}\n      </span>\n      <span className={cn('text-sm font-medium', textColor)}>{value}</span>\n    </div>\n  );\n}\n\nMetricChange.displayName = 'MetricChange';\n\n// ============================================\n// MetricItem - Main component\n// ============================================\n\nconst metricItemVariants = cva(\n  'relative flex flex-col gap-2 p-5 bg-background rounded-xl border border-border shadow-xs transition-shadow duration-200 ease-out hover:shadow-sm motion-reduce:transition-none',\n  {\n    variants: {\n      type: {\n        simple: '',\n        'icon-01': '',\n        'icon-02': '',\n        'icon-03': '',\n        'icon-04': 'flex-row items-center',\n        'chart-01': '',\n        'chart-02': '',\n        'chart-03': '',\n        'chart-04': 'p-0 bg-transparent border-0 shadow-none',\n      },\n      breakpoint: {\n        desktop: '',\n        mobile: '',\n      },\n    },\n    defaultVariants: {\n      type: 'simple',\n      breakpoint: 'desktop',\n    },\n  },\n);\n\nexport interface MetricItemProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof metricItemVariants> {\n  /** Title/label of the metric */\n  title: string;\n  /** Main value to display */\n  value: string | number;\n  /** Change indicator value */\n  changeValue?: string;\n  /** Change trend direction */\n  changeTrend?: 'positive' | 'negative';\n  /** Change icon type ('none' to hide icon) */\n  changeIcon?: 'arrow' | 'trend' | 'arrow-right' | 'none';\n  /** Comparison text (e.g., \"vs last month\") */\n  comparisonText?: string;\n  /** Subtitle/description text shown next to value (alternative to change indicator) */\n  subtitle?: string;\n  /** Show dropdown menu button */\n  showDropdown?: boolean;\n  /** Show action buttons */\n  showActions?: boolean;\n  /** Action button click handler */\n  onViewReport?: () => void;\n  /** Dropdown click handler */\n  onDropdownClick?: () => void;\n  /** Icon for icon variants */\n  icon?: React.ReactNode;\n  /** Icon background color */\n  iconBgColor?: string;\n  /** Icon color */\n  iconColor?: string;\n  /** Chart data for chart variants */\n  chartData?: number[];\n  /** Featured icon variant style */\n  featuredIconVariant?: 'circle' | 'square' | 'modern';\n  /** Custom content to render instead of chart (for chart-04 type) */\n  children?: React.ReactNode;\n}\n\nconst MetricItem = React.memo(function MetricItem({\n  title,\n  value,\n  changeValue,\n  changeTrend = 'positive',\n  changeIcon,\n  comparisonText,\n  subtitle,\n  showDropdown = false,\n  showActions = false,\n  onViewReport,\n  onDropdownClick,\n  icon,\n  iconBgColor,\n  iconColor,\n  chartData,\n  featuredIconVariant = 'circle',\n  type = 'simple',\n  breakpoint = 'desktop',\n  className,\n  children,\n  ...props\n}: MetricItemProps) {\n  // Default icon for icon variants\n  const defaultIcon = <TrendingUp width={24} height={24} />;\n  const displayIcon = icon || defaultIcon;\n  const displayValue = formatMetricValue(value);\n\n  // Default icon colors based on type and variant\n  const defaultIconBgColor =\n    type === 'icon-01'\n      ? featuredIconVariant === 'modern'\n        ? 'var(--muted)' // for modern\n        : 'var(--success-muted)' // for circle/square\n      : type === 'icon-02' || type === 'icon-03' || type === 'icon-04'\n        ? 'var(--muted)'\n        : 'var(--success-muted)';\n\n  const defaultIconColor =\n    type === 'icon-01'\n      ? featuredIconVariant === 'modern'\n        ? 'var(--secondary-foreground)' // for modern\n        : 'var(--success)' // for circle/square\n      : type === 'icon-02'\n        ? 'var(--secondary-foreground)'\n        : 'var(--success)';\n\n  const finalIconBgColor = iconBgColor || defaultIconBgColor;\n  const finalIconColor = iconColor || defaultIconColor;\n\n  // Chart-04 has a different structure\n  if (type === 'chart-04') {\n    return (\n      <div\n        data-slot=\"metric-item\"\n        className={cn(metricItemVariants({ type, breakpoint }), className)}\n        {...props}\n      >\n        <div className=\"flex flex-col gap-0.5 w-full\">\n          {/* Header */}\n          <div className=\"flex items-center px-5 pt-3 pb-2 w-full\">\n            <p className=\"flex-1 text-sm font-semibold text-foreground\">\n              {title}\n            </p>\n          </div>\n\n          {/* Content card */}\n          <div className=\"relative bg-background border border-border rounded-xl shadow-xs p-5 flex flex-col gap-5\">\n            {/* Number and change */}\n            <div className=\"flex flex-wrap items-center gap-3\">\n              <p className=\"text-display-sm font-semibold text-foreground\">\n                {displayValue}\n              </p>\n              {changeValue && (\n                <div className=\"flex items-center gap-2\">\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    // chart-04 defaults to 'trend' icon for backward compatibility\n                    icon={changeIcon ?? 'trend'}\n                  />\n                  {comparisonText && (\n                    <span className=\"text-sm font-medium text-muted-foreground\">\n                      {comparisonText}\n                    </span>\n                  )}\n                </div>\n              )}\n            </div>\n\n            {/* Chart or custom content */}\n            {children ? (\n              children\n            ) : chartData ? (\n              <MetricMiniChart\n                data={chartData}\n                width={undefined}\n                height={56}\n                variant=\"line\"\n                showMarker={false}\n                trend={changeTrend}\n                className=\"w-full\"\n              />\n            ) : null}\n\n            {/* Dropdown */}\n            {showDropdown && (\n              <button\n                type=\"button\"\n                aria-label=\"More options\"\n                className=\"absolute top-2 end-2 p-3 cursor-pointer rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background transition-colors duration-150 ease-out hover:text-foreground\"\n                onClick={onDropdownClick}\n              >\n                <MoreVertical\n                  width={20}\n                  height={20}\n                  className=\"text-muted-foreground\"\n                />\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      data-slot=\"metric-item\"\n      className={cn(metricItemVariants({ type, breakpoint }), className)}\n      {...props}\n    >\n      {/* Featured Icon (for icon-01 only - standalone icon above content) */}\n      {type === 'icon-01' && (\n        <div\n          className={cn(\n            'flex items-center justify-center shrink-0 relative overflow-clip',\n            featuredIconVariant === 'modern'\n              ? 'rounded-[10px] border border-border shadow-xs'\n              : featuredIconVariant === 'square'\n                ? 'rounded-[10px] border border-border shadow-xs'\n                : 'rounded-full',\n          )}\n          style={{\n            width: 48,\n            height: 48,\n            backgroundColor: finalIconBgColor,\n            color: finalIconColor,\n          }}\n        >\n          {displayIcon}\n          {/* Skeuomorphic inner shadow overlay for modern variant */}\n          {featuredIconVariant === 'modern' && (\n            <div\n              className=\"absolute inset-0 pointer-events-none rounded-[10px]\"\n              style={{\n                boxShadow: 'var(--shadow-inset-ring)',\n              }}\n            />\n          )}\n        </div>\n      )}\n\n      {/* Icon-02 and Icon-03: Heading row with icon + title */}\n      {(type === 'icon-02' || type === 'icon-03') && (\n        <div className=\"flex items-center gap-3 w-full\">\n          <div\n            className={cn(\n              'flex items-center justify-center shrink-0',\n              type === 'icon-02'\n                ? 'rounded-full'\n                : 'rounded-lg border border-border shadow-xs',\n            )}\n            style={{\n              width: 48,\n              height: 48,\n              backgroundColor: finalIconBgColor,\n              color: finalIconColor,\n            }}\n          >\n            {icon || <Eye width={24} height={24} />}\n          </div>\n          <p className=\"flex-1 text-base font-semibold text-foreground\">\n            {title}\n          </p>\n        </div>\n      )}\n\n      {/* Icon-04: Horizontal layout with featured icon + content */}\n      {type === 'icon-04' && (\n        <div\n          className={cn(\n            'flex items-center justify-center shrink-0 rounded-md border border-border shadow-xs',\n          )}\n          style={{\n            width: 40,\n            height: 40,\n            backgroundColor: finalIconBgColor,\n            color: finalIconColor,\n          }}\n        >\n          {icon || <TrendingUp width={20} height={20} />}\n        </div>\n      )}\n\n      {/* Heading and number section */}\n      {type !== 'icon-02' && type !== 'icon-03' && (\n        <div\n          className={cn(\n            'flex flex-col gap-2',\n            type === 'icon-04' ? 'flex-1 min-w-0' : 'w-full',\n          )}\n        >\n          {/* Title */}\n          {type === 'chart-01' || type === 'chart-02' ? (\n            <p className=\"text-base font-semibold text-foreground\">{title}</p>\n          ) : type === 'icon-04' || type === 'icon-01' ? (\n            <p className=\"text-sm font-semibold text-muted-foreground\">\n              {title}\n            </p>\n          ) : (\n            <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>\n          )}\n\n          {/* Number and badge row */}\n          {type === 'simple' || type === 'icon-01' || type === 'icon-04' ? (\n            <div className=\"flex flex-wrap items-center justify-between gap-3 w-full\">\n              <p className=\"text-display-sm font-semibold text-foreground\">\n                {displayValue}\n              </p>\n              {/* Show inline change + comparison OR badge OR subtitle */}\n              {changeValue && comparisonText ? (\n                <div className=\"flex items-center gap-2\">\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    icon=\"arrow\"\n                  />\n                  <span className=\"text-sm font-medium text-muted-foreground\">\n                    {comparisonText}\n                  </span>\n                </div>\n              ) : changeValue ? (\n                <MetricChange\n                  value={changeValue}\n                  trend={changeTrend}\n                  // badge variant defaults to 'arrow-right' icon for backward compatibility\n                  icon={changeIcon ?? 'arrow-right'}\n                  variant=\"badge\"\n                />\n              ) : subtitle ? (\n                <span className=\"text-sm font-medium text-muted-foreground\">\n                  {subtitle}\n                </span>\n              ) : null}\n            </div>\n          ) : null}\n        </div>\n      )}\n\n      {/* Chart variants content */}\n      {type === 'chart-01' && (\n        <div className=\"flex items-end gap-4 w-full\">\n          <div className=\"flex-1 flex flex-col gap-3\">\n            <p className=\"text-display-sm font-semibold text-foreground\">\n              {displayValue}\n            </p>\n            {(changeValue || comparisonText) && (\n              <div className=\"flex items-center gap-2\">\n                {changeValue && (\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    icon=\"arrow\"\n                  />\n                )}\n                {comparisonText && (\n                  <span className=\"text-sm font-medium text-muted-foreground truncate\">\n                    {comparisonText}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              width={112}\n              height={56}\n              variant=\"line\"\n              trend={changeTrend}\n            />\n          )}\n        </div>\n      )}\n\n      {type === 'chart-02' && (\n        <div className=\"flex items-end gap-4 w-full\">\n          <div className=\"flex-1 flex items-start gap-2\">\n            <p className=\"text-display-md font-semibold text-foreground\">\n              {displayValue}\n            </p>\n            {changeValue && (\n              <MetricChange\n                value={changeValue}\n                trend={changeTrend}\n                icon=\"trend\"\n              />\n            )}\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              width={128}\n              height={56}\n              variant=\"layers\"\n              showMarker={false}\n              trend={changeTrend}\n            />\n          )}\n        </div>\n      )}\n\n      {type === 'chart-03' && (\n        <>\n          <div className=\"flex flex-col gap-2 w-full\">\n            <p className=\"text-sm font-medium text-muted-foreground\">{title}</p>\n            <div className=\"flex flex-wrap items-center justify-between gap-3 w-full\">\n              <p className=\"text-display-sm font-semibold text-foreground\">\n                {displayValue}\n              </p>\n              {(changeValue || comparisonText) && (\n                <div className=\"flex items-center gap-2\">\n                  {changeValue && (\n                    <MetricChange\n                      value={changeValue}\n                      trend={changeTrend}\n                      icon=\"trend\"\n                    />\n                  )}\n                  {comparisonText && (\n                    <span className=\"text-sm font-medium text-muted-foreground\">\n                      {comparisonText}\n                    </span>\n                  )}\n                </div>\n              )}\n            </div>\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              height={72}\n              variant=\"area\"\n              showMarker={false}\n              trend={changeTrend}\n              className=\"w-full\"\n            />\n          )}\n        </>\n      )}\n\n      {/* Icon-02 and Icon-03 number section */}\n      {(type === 'icon-02' || type === 'icon-03') && (\n        <div className=\"flex items-end gap-4 w-full\">\n          <div className=\"flex-1 flex flex-col gap-3\">\n            <p className=\"text-display-md font-semibold text-foreground\">\n              {displayValue}\n            </p>\n            {(changeValue || comparisonText) && (\n              <div className=\"flex items-center gap-2\">\n                {changeValue && (\n                  <MetricChange\n                    value={changeValue}\n                    trend={changeTrend}\n                    icon={type === 'icon-03' ? 'trend' : 'arrow'}\n                  />\n                )}\n                {comparisonText && (\n                  <span className=\"text-sm font-medium text-muted-foreground truncate\">\n                    {comparisonText}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n          {chartData && (\n            <MetricMiniChart\n              data={chartData}\n              width={112}\n              height={56}\n              variant=\"line\"\n              trend={changeTrend}\n            />\n          )}\n        </div>\n      )}\n\n      {/* Dropdown button */}\n      {showDropdown && (\n        <button\n          type=\"button\"\n          aria-label=\"More options\"\n          className=\"absolute top-2 end-2 cursor-pointer rounded-sm p-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-background transition-colors duration-150 ease-out hover:text-foreground\"\n          onClick={onDropdownClick}\n        >\n          <MoreVertical\n            width={20}\n            height={20}\n            className=\"text-muted-foreground\"\n          />\n        </button>\n      )}\n\n      {/* Action buttons */}\n      {showActions && (\n        <div className=\"flex items-center gap-2 pt-2\">\n          <Button\n            appearance=\"outline\"\n            variant=\"secondary\"\n            size=\"sm\"\n            onClick={onViewReport}\n          >\n            View report\n          </Button>\n        </div>\n      )}\n    </div>\n  );\n});\n\nMetricItem.displayName = 'MetricItem';\n\nexport {\n  MetricChange,\n  MetricItem,\n  MetricMiniChart,\n  metricChangeVariants,\n  metricItemVariants,\n  metricMiniChartVariants,\n};\n","/**\n * Web Component wrapper for MetricItem\n * Custom element: <hf-metric-item>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { MetricItem } from '../components/organisms/content/MetricItem';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Event wrapper that dispatches custom DOM events\n */\nfunction createEventDispatcher(element: HTMLElement) {\n  return {\n    onViewReport: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('view-report', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    },\n    onDropdownClick: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('dropdown-click', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    }\n  };\n}\n\n/**\n * Wrapper component that connects React events to DOM custom events\n */\nfunction MetricItemWrapper(props: React.ComponentProps<typeof MetricItem> & { _hostElement?: HTMLElement }) {\n  const { _hostElement, ...restProps } = props;\n\n  const eventHandlers = React.useMemo(() => {\n    if (!_hostElement) return {};\n    return createEventDispatcher(_hostElement);\n  }, [_hostElement]);\n\n  return React.createElement(MetricItem, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    type: 'string',\n    breakpoint: 'string',\n    title: 'string',\n    value: 'string',\n    changeValue: 'string',\n    changeTrend: 'string',\n    changeIcon: 'string',\n    comparisonText: 'string',\n    subtitle: 'string',\n    showDropdown: 'boolean',\n    showActions: 'boolean',\n    icon: 'json',\n    iconBgColor: 'string',\n    iconColor: 'string',\n    chartData: 'json',\n    featuredIconVariant: 'string'\n};\n\nclass MetricItemWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root || !this._childrenContainer) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      MetricItemWrapper,\n      { ...props, _hostElement: this },\n      React.createElement('span', {\n        ref: (el: HTMLSpanElement | null) => {\n          if (el && this._childrenContainer) {\n            el.replaceWith(this._childrenContainer);\n          }\n        },\n        style: { display: 'contents' },\n      }),\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(MetricItemWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-metric-item')) {\n  customElements.define('hf-metric-item', MetricItemWC);\n}\n\nexport { MetricItemWC };\nexport default MetricItemWC;\n"],"x_google_ignoreList":[0,1],"mappings":"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"}