analytica-frontend-lib 1.2.44 → 1.2.45

package/dist/ProgressBar/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/ProgressBar/ProgressBar.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress bar size variants\n */\ntype ProgressBarSize = 'small' | 'medium';\n\n/**\n * Progress bar color variants\n */\ntype ProgressBarVariant = 'blue' | 'green';\n\n/**\n * Progress bar layout variants\n */\ntype ProgressBarLayout = 'default' | 'stacked' | 'compact';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'h-1', // 4px height (h-1 = 4px in Tailwind)\n    bar: 'h-1', // 4px height for the fill bar\n    spacing: 'gap-2', // 8px gap between label and progress bar\n    layout: 'flex-col', // vertical layout for small\n    borderRadius: 'rounded-full', // 9999px border radius\n  },\n  medium: {\n    container: 'h-2', // 8px height (h-2 = 8px in Tailwind)\n    bar: 'h-2', // 8px height for the fill bar\n    spacing: 'gap-2', // 8px gap between progress bar and label\n    layout: 'flex-row items-center', // horizontal layout for medium\n    borderRadius: 'rounded-lg', // 8px border radius\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-primary-700', // Blue for activity progress (#2271C4)\n  },\n  green: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-success-200', // Green for performance (#84D3A2)\n  },\n} as const;\n\n/**\n * Type for size classes\n */\ntype SizeClassType = (typeof SIZE_CLASSES)[keyof typeof SIZE_CLASSES];\n\n/**\n * Type for variant classes\n */\ntype VariantClassType = (typeof VARIANT_CLASSES)[keyof typeof VARIANT_CLASSES];\n\n/**\n * Common props shared across all layout components\n */\ninterface BaseLayoutProps {\n  className: string;\n  label: ReactNode;\n  showPercentage: boolean;\n  showHitCount: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  variantClasses: VariantClassType;\n}\n\n/**\n * Dimensions configuration for layouts\n */\ninterface LayoutDimensions {\n  width: string;\n  height: string;\n}\n\n/**\n * Props for StackedLayout component\n */\ninterface StackedLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for CompactLayout component\n */\ninterface CompactLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for DefaultLayout component\n */\ninterface DefaultLayoutProps {\n  className: string;\n  size: ProgressBarSize;\n  sizeClasses: SizeClassType;\n  variantClasses: VariantClassType;\n  label: ReactNode;\n  showPercentage: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n}\n\n/**\n * ProgressBar component props interface\n */\nexport type ProgressBarProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress bar */\n  size?: ProgressBarSize;\n  /** Color variant of the progress bar */\n  variant?: ProgressBarVariant;\n  /** Layout variant of the progress bar */\n  layout?: ProgressBarLayout;\n  /** Optional label to display */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /**\n   * Show hit count (e.g., \"28 de 30\") instead of percentage\n   *\n   * PRIORITY: When both showHitCount and showPercentage are true,\n   * showHitCount takes precedence (stacked and compact layouts only).\n   * Default layout does not support showHitCount.\n   */\n  showHitCount?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n  /** Custom width for stacked layout (defaults to w-[380px]) */\n  stackedWidth?: string;\n  /** Custom height for stacked layout (defaults to h-[35px]) */\n  stackedHeight?: string;\n  /** Custom width for compact layout (defaults to w-[131px]) */\n  compactWidth?: string;\n  /** Custom height for compact layout (defaults to h-[24px]) */\n  compactHeight?: string;\n};\n\n/**\n * Helper function to calculate safe progress values\n */\nconst calculateProgressValues = (value: number, max: number) => {\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  return { clampedValue, percentage };\n};\n\n/**\n * Helper function to determine if header content should be shown\n */\nconst shouldShowHeader = (\n  label: ReactNode,\n  showPercentage: boolean,\n  showHitCount: boolean\n): boolean => {\n  return !!(label || showPercentage || showHitCount);\n};\n\n/**\n * Centralized function to determine display priority and content\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * @param showHitCount - Whether to show hit count format\n * @param showPercentage - Whether to show percentage format\n * @param label - Custom label to display\n * @param clampedValue - Current progress value\n * @param max - Maximum progress value\n * @param percentage - Calculated percentage value\n * @returns Object with content type and formatted content\n */\nconst getDisplayPriority = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  label: ReactNode,\n  clampedValue: number,\n  max: number,\n  percentage: number\n) => {\n  if (showHitCount) {\n    return {\n      type: 'hitCount' as const,\n      content: `${Math.round(clampedValue)} de ${max}`,\n      hasMetrics: true,\n    };\n  }\n\n  if (showPercentage) {\n    return {\n      type: 'percentage' as const,\n      content: `${Math.round(percentage)}%`,\n      hasMetrics: true,\n    };\n  }\n\n  return {\n    type: 'label' as const,\n    content: label,\n    hasMetrics: false,\n  };\n};\n\n/**\n * Parameters for compact layout configuration\n */\ninterface CompactLayoutConfigParams {\n  showPercentage: boolean;\n  showHitCount: boolean;\n  percentage: number;\n  clampedValue: number;\n  max: number;\n  label: ReactNode;\n  percentageClassName: string;\n  labelClassName: string;\n}\n\n/**\n * Helper function to get compact layout configuration\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst getCompactLayoutConfig = ({\n  showPercentage,\n  showHitCount,\n  percentage,\n  clampedValue,\n  max,\n  label,\n  percentageClassName,\n  labelClassName,\n}: CompactLayoutConfigParams) => {\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    label,\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return {\n    color: displayPriority.hasMetrics ? 'text-primary-600' : 'text-primary-700',\n    className: displayPriority.hasMetrics\n      ? percentageClassName\n      : labelClassName,\n    content: displayPriority.content,\n  };\n};\n\n/**\n * Helper function to get default layout display configuration\n *\n * PRIORITY ORDER for default layout (showHitCount is not supported):\n * 1. showPercentage (when enabled, takes precedence over label)\n * 2. label (shown only when showPercentage is false)\n *\n * Note: Default layout does not support showHitCount feature.\n */\nconst getDefaultLayoutDisplayConfig = (\n  size: ProgressBarSize,\n  label: ReactNode,\n  showPercentage: boolean\n) => ({\n  showHeader: size === 'small' && !!(label || showPercentage),\n  showPercentage: size === 'medium' && showPercentage,\n  showLabel: size === 'medium' && !!label && !showPercentage, // Only show label when percentage is not shown\n});\n\n/**\n * Helper function to render hit count or percentage display for stacked layout\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst renderStackedHitCountDisplay = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  clampedValue: number,\n  max: number,\n  percentage: number,\n  percentageClassName: string\n): ReactNode => {\n  if (!showHitCount && !showPercentage) return null;\n\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    null, // label is not relevant for stacked layout metrics display\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return (\n    <div\n      className={cn(\n        'text-xs font-medium leading-[14px] text-right',\n        percentageClassName\n      )}\n    >\n      {displayPriority.type === 'hitCount' ? (\n        <>\n          <span className=\"text-success-200\">{Math.round(clampedValue)}</span>\n          <span className=\"text-text-600\"> de {max}</span>\n        </>\n      ) : (\n        <Text size=\"xs\" weight=\"medium\" className=\"text-success-200\">\n          {Math.round(percentage)}%\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * Base progress bar component with common rendering logic\n */\nconst ProgressBarBase = ({\n  clampedValue,\n  max,\n  percentage,\n  label,\n  variantClasses,\n  containerClassName,\n  fillClassName,\n}: {\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  label: ReactNode;\n  variantClasses: VariantClassType;\n  containerClassName: string;\n  fillClassName: string;\n}) => (\n  <div\n    className={cn(\n      containerClassName,\n      variantClasses.background,\n      'overflow-hidden relative'\n    )}\n  >\n    <progress\n      value={clampedValue}\n      max={max}\n      aria-label={\n        typeof label === 'string'\n          ? `${label}: ${Math.round(percentage)}% complete`\n          : `Progress: ${Math.round(percentage)}% of ${max}`\n      }\n      className=\"absolute inset-0 w-full h-full opacity-0\"\n    />\n    <div\n      className={cn(\n        fillClassName,\n        variantClasses.fill,\n        'transition-all duration-300 ease-out'\n      )}\n      style={{ width: `${percentage}%` }}\n    />\n  </div>\n);\n\n/**\n * Stacked layout component\n */\nconst StackedLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: StackedLayoutProps) => (\n  <div\n    className={cn(\n      'flex flex-col items-start gap-2',\n      dimensions.width,\n      dimensions.height,\n      className\n    )}\n  >\n    {shouldShowHeader(label, showPercentage, showHitCount) && (\n      <div className=\"flex flex-row justify-between items-center w-full h-[19px]\">\n        {label && (\n          <Text\n            as=\"div\"\n            size=\"md\"\n            weight=\"medium\"\n            className={cn('text-text-600 leading-[19px]', labelClassName)}\n          >\n            {label}\n          </Text>\n        )}\n\n        {renderStackedHitCountDisplay(\n          showHitCount,\n          showPercentage,\n          clampedValue,\n          max,\n          percentage,\n          percentageClassName\n        )}\n      </div>\n    )}\n\n    <ProgressBarBase\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n      label={label}\n      variantClasses={variantClasses}\n      containerClassName=\"w-full h-2 rounded-lg\"\n      fillClassName=\"h-2 rounded-lg shadow-hard-shadow-3\"\n    />\n  </div>\n);\n\n/**\n * Compact layout component\n */\nconst CompactLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: CompactLayoutProps) => {\n  const {\n    color,\n    className: compactClassName,\n    content,\n  } = getCompactLayoutConfig({\n    showPercentage,\n    showHitCount,\n    percentage,\n    clampedValue,\n    max,\n    label,\n    percentageClassName,\n    labelClassName,\n  });\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-start gap-1',\n        dimensions.width,\n        dimensions.height,\n        className\n      )}\n    >\n      {shouldShowHeader(label, showPercentage, showHitCount) && (\n        <Text\n          as=\"div\"\n          size=\"sm\"\n          weight=\"medium\"\n          color={color}\n          className={cn('leading-4 w-full', compactClassName)}\n        >\n          {content}\n        </Text>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName=\"w-full h-1 rounded-full\"\n        fillClassName=\"h-1 rounded-full\"\n      />\n    </div>\n  );\n};\n\n/**\n * Default layout component\n */\nconst DefaultLayout = ({\n  className,\n  size,\n  sizeClasses,\n  variantClasses,\n  label,\n  showPercentage,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n}: DefaultLayoutProps) => {\n  const gapClass = size === 'medium' ? 'gap-2' : sizeClasses.spacing;\n  const progressBarClass = size === 'medium' ? 'flex-grow' : 'w-full';\n  const displayConfig = getDefaultLayoutDisplayConfig(\n    size,\n    label,\n    showPercentage\n  );\n\n  return (\n    <div className={cn('flex', sizeClasses.layout, gapClass, className)}>\n      {displayConfig.showHeader && (\n        <div className=\"flex flex-row items-center justify-between w-full\">\n          {label && (\n            <Text\n              as=\"div\"\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                labelClassName\n              )}\n            >\n              {label}\n            </Text>\n          )}\n\n          {showPercentage && (\n            <Text\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                percentageClassName\n              )}\n            >\n              {Math.round(percentage)}%\n            </Text>\n          )}\n        </div>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName={cn(\n          progressBarClass,\n          sizeClasses.container,\n          sizeClasses.borderRadius\n        )}\n        fillClassName={cn(\n          sizeClasses.bar,\n          sizeClasses.borderRadius,\n          'shadow-hard-shadow-3'\n        )}\n      />\n\n      {displayConfig.showPercentage && (\n        <Text\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            percentageClassName\n          )}\n        >\n          {Math.round(percentage)}%\n        </Text>\n      )}\n\n      {displayConfig.showLabel && (\n        <Text\n          as=\"div\"\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            labelClassName\n          )}\n        >\n          {label}\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * ProgressBar component for Analytica Ensino platforms\n *\n * A progress bar component with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * CONTENT DISPLAY PRIORITY (Consistent across all layouts):\n * 1. showHitCount (highest) - \"X de Y\" format (stacked/compact only)\n * 2. showPercentage - \"X%\" format\n * 3. label (lowest) - Custom label text\n *\n * When multiple display options are enabled, higher priority options take precedence.\n *\n * @example\n * ```tsx\n * // Basic progress bar\n * <ProgressBar value={65} />\n *\n * // Activity progress (blue)\n * <ProgressBar variant=\"blue\" value={45} label=\"Progress\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressBar variant=\"green\" size=\"medium\" value={85} label=\"Performance\" />\n *\n * // Small size with custom max value\n * <ProgressBar size=\"small\" value={3} max={5} showPercentage />\n *\n * // Stacked layout with fixed width and hit count\n * <ProgressBar layout=\"stacked\" variant=\"green\" value={28} max={30} label=\"Fáceis\" showHitCount />\n *\n * // Compact layout for small cards\n * <ProgressBar layout=\"compact\" variant=\"blue\" value={70} label=\"Questão 08\" />\n * ```\n */\nconst ProgressBar = ({\n  value,\n  max = 100,\n  size = 'medium',\n  variant = 'blue',\n  layout = 'default',\n  label,\n  showPercentage = false,\n  showHitCount = false,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n  stackedWidth,\n  stackedHeight,\n  compactWidth,\n  compactHeight,\n}: ProgressBarProps) => {\n  const { clampedValue, percentage } = calculateProgressValues(value, max);\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  if (layout === 'stacked') {\n    return (\n      <StackedLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: stackedWidth ?? 'w-[380px]',\n          height: stackedHeight ?? 'h-[35px]',\n        }}\n      />\n    );\n  }\n\n  if (layout === 'compact') {\n    return (\n      <CompactLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: compactWidth ?? 'w-[131px]',\n          height: compactHeight ?? 'h-[24px]',\n        }}\n      />\n    );\n  }\n\n  return (\n    <DefaultLayout\n      className={className}\n      size={size}\n      sizeClasses={sizeClasses}\n      variantClasses={variantClasses}\n      label={label}\n      showPercentage={showPercentage}\n      labelClassName={labelClassName}\n      percentageClassName={percentageClassName}\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n    />\n  );\n};\n\nexport default ProgressBar;\n","import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n"],"mappings":"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","names":["import_jsx_runtime"]}
+{"version":3,"sources":["../../src/components/ProgressBar/ProgressBar.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress bar size variants\n */\ntype ProgressBarSize = 'small' | 'medium';\n\n/**\n * Progress bar color variants\n */\ntype ProgressBarVariant = 'blue' | 'green';\n\n/**\n * Progress bar layout variants\n */\ntype ProgressBarLayout = 'default' | 'stacked' | 'compact';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'h-1', // 4px height (h-1 = 4px in Tailwind)\n    bar: 'h-1', // 4px height for the fill bar\n    spacing: 'gap-2', // 8px gap between label and progress bar\n    layout: 'flex-col', // vertical layout for small\n    borderRadius: 'rounded-full', // 9999px border radius\n  },\n  medium: {\n    container: 'h-2', // 8px height (h-2 = 8px in Tailwind)\n    bar: 'h-2', // 8px height for the fill bar\n    spacing: 'gap-2', // 8px gap between progress bar and label\n    layout: 'flex-row items-center', // horizontal layout for medium\n    borderRadius: 'rounded-lg', // 8px border radius\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-primary-700', // Blue for activity progress (#2271C4)\n  },\n  green: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-success-200', // Green for performance (#84D3A2)\n  },\n} as const;\n\n/**\n * Type for size classes\n */\ntype SizeClassType = (typeof SIZE_CLASSES)[keyof typeof SIZE_CLASSES];\n\n/**\n * Type for variant classes\n */\ntype VariantClassType = (typeof VARIANT_CLASSES)[keyof typeof VARIANT_CLASSES];\n\n/**\n * Common props shared across all layout components\n */\ninterface BaseLayoutProps {\n  className: string;\n  label: ReactNode;\n  showPercentage: boolean;\n  showHitCount: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  variantClasses: VariantClassType;\n}\n\n/**\n * Dimensions configuration for layouts\n */\ninterface LayoutDimensions {\n  width: string;\n  height: string;\n}\n\n/**\n * Props for StackedLayout component\n */\ninterface StackedLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for CompactLayout component\n */\ninterface CompactLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for DefaultLayout component\n */\ninterface DefaultLayoutProps {\n  className: string;\n  size: ProgressBarSize;\n  sizeClasses: SizeClassType;\n  variantClasses: VariantClassType;\n  label: ReactNode;\n  showPercentage: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n}\n\n/**\n * ProgressBar component props interface\n */\nexport type ProgressBarProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress bar */\n  size?: ProgressBarSize;\n  /** Color variant of the progress bar */\n  variant?: ProgressBarVariant;\n  /** Layout variant of the progress bar */\n  layout?: ProgressBarLayout;\n  /** Optional label to display */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /**\n   * Show hit count (e.g., \"28 de 30\") instead of percentage\n   *\n   * PRIORITY: When both showHitCount and showPercentage are true,\n   * showHitCount takes precedence (stacked and compact layouts only).\n   * Default layout does not support showHitCount.\n   */\n  showHitCount?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n  /** Custom width for stacked layout (defaults to w-[380px]) */\n  stackedWidth?: string;\n  /** Custom height for stacked layout (defaults to h-[35px]) */\n  stackedHeight?: string;\n  /** Custom width for compact layout (defaults to w-[131px]) */\n  compactWidth?: string;\n  /** Custom height for compact layout (defaults to h-[24px]) */\n  compactHeight?: string;\n};\n\n/**\n * Helper function to calculate safe progress values\n */\nconst calculateProgressValues = (value: number, max: number) => {\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  return { clampedValue, percentage };\n};\n\n/**\n * Helper function to determine if header content should be shown\n */\nconst shouldShowHeader = (\n  label: ReactNode,\n  showPercentage: boolean,\n  showHitCount: boolean\n): boolean => {\n  return !!(label || showPercentage || showHitCount);\n};\n\n/**\n * Centralized function to determine display priority and content\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * @param showHitCount - Whether to show hit count format\n * @param showPercentage - Whether to show percentage format\n * @param label - Custom label to display\n * @param clampedValue - Current progress value\n * @param max - Maximum progress value\n * @param percentage - Calculated percentage value\n * @returns Object with content type and formatted content\n */\nconst getDisplayPriority = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  label: ReactNode,\n  clampedValue: number,\n  max: number,\n  percentage: number\n) => {\n  if (showHitCount) {\n    return {\n      type: 'hitCount' as const,\n      content: `${Math.round(clampedValue)} de ${max}`,\n      hasMetrics: true,\n    };\n  }\n\n  if (showPercentage) {\n    return {\n      type: 'percentage' as const,\n      content: `${Math.round(percentage)}%`,\n      hasMetrics: true,\n    };\n  }\n\n  return {\n    type: 'label' as const,\n    content: label,\n    hasMetrics: false,\n  };\n};\n\n/**\n * Parameters for compact layout configuration\n */\ninterface CompactLayoutConfigParams {\n  showPercentage: boolean;\n  showHitCount: boolean;\n  percentage: number;\n  clampedValue: number;\n  max: number;\n  label: ReactNode;\n  percentageClassName: string;\n  labelClassName: string;\n}\n\n/**\n * Helper function to get compact layout configuration\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst getCompactLayoutConfig = ({\n  showPercentage,\n  showHitCount,\n  percentage,\n  clampedValue,\n  max,\n  label,\n  percentageClassName,\n  labelClassName,\n}: CompactLayoutConfigParams) => {\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    label,\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return {\n    color: displayPriority.hasMetrics ? 'text-primary-600' : 'text-primary-700',\n    className: displayPriority.hasMetrics\n      ? percentageClassName\n      : labelClassName,\n    content: displayPriority.content,\n  };\n};\n\n/**\n * Helper function to get default layout display configuration\n *\n * PRIORITY ORDER for default layout (showHitCount is not supported):\n * 1. showPercentage (when enabled, takes precedence over label)\n * 2. label (shown only when showPercentage is false)\n *\n * Note: Default layout does not support showHitCount feature.\n */\nconst getDefaultLayoutDisplayConfig = (\n  size: ProgressBarSize,\n  label: ReactNode,\n  showPercentage: boolean\n) => ({\n  showHeader: size === 'small' && !!(label || showPercentage),\n  showPercentage: size === 'medium' && showPercentage,\n  showLabel: size === 'medium' && !!label && !showPercentage, // Only show label when percentage is not shown\n});\n\n/**\n * Helper function to render hit count or percentage display for stacked layout\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst renderStackedHitCountDisplay = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  clampedValue: number,\n  max: number,\n  percentage: number,\n  percentageClassName: string\n): ReactNode => {\n  if (!showHitCount && !showPercentage) return null;\n\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    null, // label is not relevant for stacked layout metrics display\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return (\n    <div\n      className={cn(\n        'text-xs font-medium leading-[14px] text-right',\n        percentageClassName\n      )}\n    >\n      {displayPriority.type === 'hitCount' ? (\n        <>\n          <span className=\"text-success-200\">{Math.round(clampedValue)}</span>\n          <span className=\"text-text-600\"> de {max}</span>\n        </>\n      ) : (\n        <Text size=\"xs\" weight=\"medium\" className=\"text-success-200\">\n          {Math.round(percentage)}%\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * Base progress bar component with common rendering logic\n */\nconst ProgressBarBase = ({\n  clampedValue,\n  max,\n  percentage,\n  label,\n  variantClasses,\n  containerClassName,\n  fillClassName,\n}: {\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  label: ReactNode;\n  variantClasses: VariantClassType;\n  containerClassName: string;\n  fillClassName: string;\n}) => (\n  <div\n    className={cn(\n      containerClassName,\n      variantClasses.background,\n      'overflow-hidden relative'\n    )}\n  >\n    <progress\n      value={clampedValue}\n      max={max}\n      aria-label={\n        typeof label === 'string'\n          ? `${label}: ${Math.round(percentage)}% complete`\n          : `Progress: ${Math.round(percentage)}% of ${max}`\n      }\n      className=\"absolute inset-0 w-full h-full opacity-0\"\n    />\n    <div\n      className={cn(\n        fillClassName,\n        variantClasses.fill,\n        'transition-all duration-300 ease-out'\n      )}\n      style={{ width: `${percentage}%` }}\n    />\n  </div>\n);\n\n/**\n * Stacked layout component\n */\nconst StackedLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: StackedLayoutProps) => (\n  <div\n    className={cn(\n      'flex flex-col items-start gap-2',\n      dimensions.width,\n      dimensions.height,\n      className\n    )}\n  >\n    {shouldShowHeader(label, showPercentage, showHitCount) && (\n      <div className=\"flex flex-row justify-between items-center w-full h-[19px]\">\n        {label && (\n          <Text\n            as=\"div\"\n            size=\"md\"\n            weight=\"medium\"\n            className={cn('text-text-600 leading-[19px]', labelClassName)}\n          >\n            {label}\n          </Text>\n        )}\n\n        {renderStackedHitCountDisplay(\n          showHitCount,\n          showPercentage,\n          clampedValue,\n          max,\n          percentage,\n          percentageClassName\n        )}\n      </div>\n    )}\n\n    <ProgressBarBase\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n      label={label}\n      variantClasses={variantClasses}\n      containerClassName=\"w-full h-2 rounded-lg\"\n      fillClassName=\"h-2 rounded-lg shadow-hard-shadow-3\"\n    />\n  </div>\n);\n\n/**\n * Compact layout component\n */\nconst CompactLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: CompactLayoutProps) => {\n  const {\n    color,\n    className: compactClassName,\n    content,\n  } = getCompactLayoutConfig({\n    showPercentage,\n    showHitCount,\n    percentage,\n    clampedValue,\n    max,\n    label,\n    percentageClassName,\n    labelClassName,\n  });\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-start gap-1',\n        dimensions.width,\n        dimensions.height,\n        className\n      )}\n    >\n      {shouldShowHeader(label, showPercentage, showHitCount) && (\n        <Text\n          as=\"div\"\n          size=\"sm\"\n          weight=\"medium\"\n          color={color}\n          className={cn('leading-4 w-full', compactClassName)}\n        >\n          {content}\n        </Text>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName=\"w-full h-1 rounded-full\"\n        fillClassName=\"h-1 rounded-full\"\n      />\n    </div>\n  );\n};\n\n/**\n * Default layout component\n */\nconst DefaultLayout = ({\n  className,\n  size,\n  sizeClasses,\n  variantClasses,\n  label,\n  showPercentage,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n}: DefaultLayoutProps) => {\n  const gapClass = size === 'medium' ? 'gap-2' : sizeClasses.spacing;\n  const progressBarClass = size === 'medium' ? 'flex-grow' : 'w-full';\n  const displayConfig = getDefaultLayoutDisplayConfig(\n    size,\n    label,\n    showPercentage\n  );\n\n  return (\n    <div className={cn('flex', sizeClasses.layout, gapClass, className)}>\n      {displayConfig.showHeader && (\n        <div className=\"flex flex-row items-center justify-between w-full\">\n          {label && (\n            <Text\n              as=\"div\"\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                labelClassName\n              )}\n            >\n              {label}\n            </Text>\n          )}\n\n          {showPercentage && (\n            <Text\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                percentageClassName\n              )}\n            >\n              {Math.round(percentage)}%\n            </Text>\n          )}\n        </div>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName={cn(\n          progressBarClass,\n          sizeClasses.container,\n          sizeClasses.borderRadius\n        )}\n        fillClassName={cn(\n          sizeClasses.bar,\n          sizeClasses.borderRadius,\n          'shadow-hard-shadow-3'\n        )}\n      />\n\n      {displayConfig.showPercentage && (\n        <Text\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            percentageClassName\n          )}\n        >\n          {Math.round(percentage)}%\n        </Text>\n      )}\n\n      {displayConfig.showLabel && (\n        <Text\n          as=\"div\"\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            labelClassName\n          )}\n        >\n          {label}\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * ProgressBar component for Analytica Ensino platforms\n *\n * A progress bar component with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * CONTENT DISPLAY PRIORITY (Consistent across all layouts):\n * 1. showHitCount (highest) - \"X de Y\" format (stacked/compact only)\n * 2. showPercentage - \"X%\" format\n * 3. label (lowest) - Custom label text\n *\n * When multiple display options are enabled, higher priority options take precedence.\n *\n * @example\n * ```tsx\n * // Basic progress bar\n * <ProgressBar value={65} />\n *\n * // Activity progress (blue)\n * <ProgressBar variant=\"blue\" value={45} label=\"Progress\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressBar variant=\"green\" size=\"medium\" value={85} label=\"Performance\" />\n *\n * // Small size with custom max value\n * <ProgressBar size=\"small\" value={3} max={5} showPercentage />\n *\n * // Stacked layout with fixed width and hit count\n * <ProgressBar layout=\"stacked\" variant=\"green\" value={28} max={30} label=\"Fáceis\" showHitCount />\n *\n * // Compact layout for small cards\n * <ProgressBar layout=\"compact\" variant=\"blue\" value={70} label=\"Questão 08\" />\n * ```\n */\nconst ProgressBar = ({\n  value,\n  max = 100,\n  size = 'medium',\n  variant = 'blue',\n  layout = 'default',\n  label,\n  showPercentage = false,\n  showHitCount = false,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n  stackedWidth,\n  stackedHeight,\n  compactWidth,\n  compactHeight,\n}: ProgressBarProps) => {\n  const { clampedValue, percentage } = calculateProgressValues(value, max);\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  if (layout === 'stacked') {\n    return (\n      <StackedLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: stackedWidth ?? 'w-[380px]',\n          height: stackedHeight ?? 'h-[35px]',\n        }}\n      />\n    );\n  }\n\n  if (layout === 'compact') {\n    return (\n      <CompactLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: compactWidth ?? 'w-[131px]',\n          height: compactHeight ?? 'h-[24px]',\n        }}\n      />\n    );\n  }\n\n  return (\n    <DefaultLayout\n      className={className}\n      size={size}\n      sizeClasses={sizeClasses}\n      variantClasses={variantClasses}\n      label={label}\n      showPercentage={showPercentage}\n      labelClassName={labelClassName}\n      percentageClassName={percentageClassName}\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n    />\n  );\n};\n\nexport default ProgressBar;\n","import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\nexport {\n  getStatusBadgeConfig,\n  formatTimeSpent,\n  formatQuestionNumbers,\n  formatDateToBrazilian,\n} from './activityDetailsUtils';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n"],"mappings":"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","names":["import_jsx_runtime"]}

package/dist/ProgressBar/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n","import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress bar size variants\n */\ntype ProgressBarSize = 'small' | 'medium';\n\n/**\n * Progress bar color variants\n */\ntype ProgressBarVariant = 'blue' | 'green';\n\n/**\n * Progress bar layout variants\n */\ntype ProgressBarLayout = 'default' | 'stacked' | 'compact';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'h-1', // 4px height (h-1 = 4px in Tailwind)\n    bar: 'h-1', // 4px height for the fill bar\n    spacing: 'gap-2', // 8px gap between label and progress bar\n    layout: 'flex-col', // vertical layout for small\n    borderRadius: 'rounded-full', // 9999px border radius\n  },\n  medium: {\n    container: 'h-2', // 8px height (h-2 = 8px in Tailwind)\n    bar: 'h-2', // 8px height for the fill bar\n    spacing: 'gap-2', // 8px gap between progress bar and label\n    layout: 'flex-row items-center', // horizontal layout for medium\n    borderRadius: 'rounded-lg', // 8px border radius\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-primary-700', // Blue for activity progress (#2271C4)\n  },\n  green: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-success-200', // Green for performance (#84D3A2)\n  },\n} as const;\n\n/**\n * Type for size classes\n */\ntype SizeClassType = (typeof SIZE_CLASSES)[keyof typeof SIZE_CLASSES];\n\n/**\n * Type for variant classes\n */\ntype VariantClassType = (typeof VARIANT_CLASSES)[keyof typeof VARIANT_CLASSES];\n\n/**\n * Common props shared across all layout components\n */\ninterface BaseLayoutProps {\n  className: string;\n  label: ReactNode;\n  showPercentage: boolean;\n  showHitCount: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  variantClasses: VariantClassType;\n}\n\n/**\n * Dimensions configuration for layouts\n */\ninterface LayoutDimensions {\n  width: string;\n  height: string;\n}\n\n/**\n * Props for StackedLayout component\n */\ninterface StackedLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for CompactLayout component\n */\ninterface CompactLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for DefaultLayout component\n */\ninterface DefaultLayoutProps {\n  className: string;\n  size: ProgressBarSize;\n  sizeClasses: SizeClassType;\n  variantClasses: VariantClassType;\n  label: ReactNode;\n  showPercentage: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n}\n\n/**\n * ProgressBar component props interface\n */\nexport type ProgressBarProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress bar */\n  size?: ProgressBarSize;\n  /** Color variant of the progress bar */\n  variant?: ProgressBarVariant;\n  /** Layout variant of the progress bar */\n  layout?: ProgressBarLayout;\n  /** Optional label to display */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /**\n   * Show hit count (e.g., \"28 de 30\") instead of percentage\n   *\n   * PRIORITY: When both showHitCount and showPercentage are true,\n   * showHitCount takes precedence (stacked and compact layouts only).\n   * Default layout does not support showHitCount.\n   */\n  showHitCount?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n  /** Custom width for stacked layout (defaults to w-[380px]) */\n  stackedWidth?: string;\n  /** Custom height for stacked layout (defaults to h-[35px]) */\n  stackedHeight?: string;\n  /** Custom width for compact layout (defaults to w-[131px]) */\n  compactWidth?: string;\n  /** Custom height for compact layout (defaults to h-[24px]) */\n  compactHeight?: string;\n};\n\n/**\n * Helper function to calculate safe progress values\n */\nconst calculateProgressValues = (value: number, max: number) => {\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  return { clampedValue, percentage };\n};\n\n/**\n * Helper function to determine if header content should be shown\n */\nconst shouldShowHeader = (\n  label: ReactNode,\n  showPercentage: boolean,\n  showHitCount: boolean\n): boolean => {\n  return !!(label || showPercentage || showHitCount);\n};\n\n/**\n * Centralized function to determine display priority and content\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * @param showHitCount - Whether to show hit count format\n * @param showPercentage - Whether to show percentage format\n * @param label - Custom label to display\n * @param clampedValue - Current progress value\n * @param max - Maximum progress value\n * @param percentage - Calculated percentage value\n * @returns Object with content type and formatted content\n */\nconst getDisplayPriority = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  label: ReactNode,\n  clampedValue: number,\n  max: number,\n  percentage: number\n) => {\n  if (showHitCount) {\n    return {\n      type: 'hitCount' as const,\n      content: `${Math.round(clampedValue)} de ${max}`,\n      hasMetrics: true,\n    };\n  }\n\n  if (showPercentage) {\n    return {\n      type: 'percentage' as const,\n      content: `${Math.round(percentage)}%`,\n      hasMetrics: true,\n    };\n  }\n\n  return {\n    type: 'label' as const,\n    content: label,\n    hasMetrics: false,\n  };\n};\n\n/**\n * Parameters for compact layout configuration\n */\ninterface CompactLayoutConfigParams {\n  showPercentage: boolean;\n  showHitCount: boolean;\n  percentage: number;\n  clampedValue: number;\n  max: number;\n  label: ReactNode;\n  percentageClassName: string;\n  labelClassName: string;\n}\n\n/**\n * Helper function to get compact layout configuration\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst getCompactLayoutConfig = ({\n  showPercentage,\n  showHitCount,\n  percentage,\n  clampedValue,\n  max,\n  label,\n  percentageClassName,\n  labelClassName,\n}: CompactLayoutConfigParams) => {\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    label,\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return {\n    color: displayPriority.hasMetrics ? 'text-primary-600' : 'text-primary-700',\n    className: displayPriority.hasMetrics\n      ? percentageClassName\n      : labelClassName,\n    content: displayPriority.content,\n  };\n};\n\n/**\n * Helper function to get default layout display configuration\n *\n * PRIORITY ORDER for default layout (showHitCount is not supported):\n * 1. showPercentage (when enabled, takes precedence over label)\n * 2. label (shown only when showPercentage is false)\n *\n * Note: Default layout does not support showHitCount feature.\n */\nconst getDefaultLayoutDisplayConfig = (\n  size: ProgressBarSize,\n  label: ReactNode,\n  showPercentage: boolean\n) => ({\n  showHeader: size === 'small' && !!(label || showPercentage),\n  showPercentage: size === 'medium' && showPercentage,\n  showLabel: size === 'medium' && !!label && !showPercentage, // Only show label when percentage is not shown\n});\n\n/**\n * Helper function to render hit count or percentage display for stacked layout\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst renderStackedHitCountDisplay = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  clampedValue: number,\n  max: number,\n  percentage: number,\n  percentageClassName: string\n): ReactNode => {\n  if (!showHitCount && !showPercentage) return null;\n\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    null, // label is not relevant for stacked layout metrics display\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return (\n    <div\n      className={cn(\n        'text-xs font-medium leading-[14px] text-right',\n        percentageClassName\n      )}\n    >\n      {displayPriority.type === 'hitCount' ? (\n        <>\n          <span className=\"text-success-200\">{Math.round(clampedValue)}</span>\n          <span className=\"text-text-600\"> de {max}</span>\n        </>\n      ) : (\n        <Text size=\"xs\" weight=\"medium\" className=\"text-success-200\">\n          {Math.round(percentage)}%\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * Base progress bar component with common rendering logic\n */\nconst ProgressBarBase = ({\n  clampedValue,\n  max,\n  percentage,\n  label,\n  variantClasses,\n  containerClassName,\n  fillClassName,\n}: {\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  label: ReactNode;\n  variantClasses: VariantClassType;\n  containerClassName: string;\n  fillClassName: string;\n}) => (\n  <div\n    className={cn(\n      containerClassName,\n      variantClasses.background,\n      'overflow-hidden relative'\n    )}\n  >\n    <progress\n      value={clampedValue}\n      max={max}\n      aria-label={\n        typeof label === 'string'\n          ? `${label}: ${Math.round(percentage)}% complete`\n          : `Progress: ${Math.round(percentage)}% of ${max}`\n      }\n      className=\"absolute inset-0 w-full h-full opacity-0\"\n    />\n    <div\n      className={cn(\n        fillClassName,\n        variantClasses.fill,\n        'transition-all duration-300 ease-out'\n      )}\n      style={{ width: `${percentage}%` }}\n    />\n  </div>\n);\n\n/**\n * Stacked layout component\n */\nconst StackedLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: StackedLayoutProps) => (\n  <div\n    className={cn(\n      'flex flex-col items-start gap-2',\n      dimensions.width,\n      dimensions.height,\n      className\n    )}\n  >\n    {shouldShowHeader(label, showPercentage, showHitCount) && (\n      <div className=\"flex flex-row justify-between items-center w-full h-[19px]\">\n        {label && (\n          <Text\n            as=\"div\"\n            size=\"md\"\n            weight=\"medium\"\n            className={cn('text-text-600 leading-[19px]', labelClassName)}\n          >\n            {label}\n          </Text>\n        )}\n\n        {renderStackedHitCountDisplay(\n          showHitCount,\n          showPercentage,\n          clampedValue,\n          max,\n          percentage,\n          percentageClassName\n        )}\n      </div>\n    )}\n\n    <ProgressBarBase\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n      label={label}\n      variantClasses={variantClasses}\n      containerClassName=\"w-full h-2 rounded-lg\"\n      fillClassName=\"h-2 rounded-lg shadow-hard-shadow-3\"\n    />\n  </div>\n);\n\n/**\n * Compact layout component\n */\nconst CompactLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: CompactLayoutProps) => {\n  const {\n    color,\n    className: compactClassName,\n    content,\n  } = getCompactLayoutConfig({\n    showPercentage,\n    showHitCount,\n    percentage,\n    clampedValue,\n    max,\n    label,\n    percentageClassName,\n    labelClassName,\n  });\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-start gap-1',\n        dimensions.width,\n        dimensions.height,\n        className\n      )}\n    >\n      {shouldShowHeader(label, showPercentage, showHitCount) && (\n        <Text\n          as=\"div\"\n          size=\"sm\"\n          weight=\"medium\"\n          color={color}\n          className={cn('leading-4 w-full', compactClassName)}\n        >\n          {content}\n        </Text>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName=\"w-full h-1 rounded-full\"\n        fillClassName=\"h-1 rounded-full\"\n      />\n    </div>\n  );\n};\n\n/**\n * Default layout component\n */\nconst DefaultLayout = ({\n  className,\n  size,\n  sizeClasses,\n  variantClasses,\n  label,\n  showPercentage,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n}: DefaultLayoutProps) => {\n  const gapClass = size === 'medium' ? 'gap-2' : sizeClasses.spacing;\n  const progressBarClass = size === 'medium' ? 'flex-grow' : 'w-full';\n  const displayConfig = getDefaultLayoutDisplayConfig(\n    size,\n    label,\n    showPercentage\n  );\n\n  return (\n    <div className={cn('flex', sizeClasses.layout, gapClass, className)}>\n      {displayConfig.showHeader && (\n        <div className=\"flex flex-row items-center justify-between w-full\">\n          {label && (\n            <Text\n              as=\"div\"\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                labelClassName\n              )}\n            >\n              {label}\n            </Text>\n          )}\n\n          {showPercentage && (\n            <Text\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                percentageClassName\n              )}\n            >\n              {Math.round(percentage)}%\n            </Text>\n          )}\n        </div>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName={cn(\n          progressBarClass,\n          sizeClasses.container,\n          sizeClasses.borderRadius\n        )}\n        fillClassName={cn(\n          sizeClasses.bar,\n          sizeClasses.borderRadius,\n          'shadow-hard-shadow-3'\n        )}\n      />\n\n      {displayConfig.showPercentage && (\n        <Text\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            percentageClassName\n          )}\n        >\n          {Math.round(percentage)}%\n        </Text>\n      )}\n\n      {displayConfig.showLabel && (\n        <Text\n          as=\"div\"\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            labelClassName\n          )}\n        >\n          {label}\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * ProgressBar component for Analytica Ensino platforms\n *\n * A progress bar component with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * CONTENT DISPLAY PRIORITY (Consistent across all layouts):\n * 1. showHitCount (highest) - \"X de Y\" format (stacked/compact only)\n * 2. showPercentage - \"X%\" format\n * 3. label (lowest) - Custom label text\n *\n * When multiple display options are enabled, higher priority options take precedence.\n *\n * @example\n * ```tsx\n * // Basic progress bar\n * <ProgressBar value={65} />\n *\n * // Activity progress (blue)\n * <ProgressBar variant=\"blue\" value={45} label=\"Progress\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressBar variant=\"green\" size=\"medium\" value={85} label=\"Performance\" />\n *\n * // Small size with custom max value\n * <ProgressBar size=\"small\" value={3} max={5} showPercentage />\n *\n * // Stacked layout with fixed width and hit count\n * <ProgressBar layout=\"stacked\" variant=\"green\" value={28} max={30} label=\"Fáceis\" showHitCount />\n *\n * // Compact layout for small cards\n * <ProgressBar layout=\"compact\" variant=\"blue\" value={70} label=\"Questão 08\" />\n * ```\n */\nconst ProgressBar = ({\n  value,\n  max = 100,\n  size = 'medium',\n  variant = 'blue',\n  layout = 'default',\n  label,\n  showPercentage = false,\n  showHitCount = false,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n  stackedWidth,\n  stackedHeight,\n  compactWidth,\n  compactHeight,\n}: ProgressBarProps) => {\n  const { clampedValue, percentage } = calculateProgressValues(value, max);\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  if (layout === 'stacked') {\n    return (\n      <StackedLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: stackedWidth ?? 'w-[380px]',\n          height: stackedHeight ?? 'h-[35px]',\n        }}\n      />\n    );\n  }\n\n  if (layout === 'compact') {\n    return (\n      <CompactLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: compactWidth ?? 'w-[131px]',\n          height: compactHeight ?? 'h-[24px]',\n        }}\n      />\n    );\n  }\n\n  return (\n    <DefaultLayout\n      className={className}\n      size={size}\n      sizeClasses={sizeClasses}\n      variantClasses={variantClasses}\n      label={label}\n      showPercentage={showPercentage}\n      labelClassName={labelClassName}\n      percentageClassName={percentageClassName}\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n    />\n  );\n};\n\nexport default ProgressBar;\n"],"mappings":"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","names":["jsx"]}
+{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/ProgressBar/ProgressBar.tsx"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\nexport {\n  getStatusBadgeConfig,\n  formatTimeSpent,\n  formatQuestionNumbers,\n  formatDateToBrazilian,\n} from './activityDetailsUtils';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n","import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress bar size variants\n */\ntype ProgressBarSize = 'small' | 'medium';\n\n/**\n * Progress bar color variants\n */\ntype ProgressBarVariant = 'blue' | 'green';\n\n/**\n * Progress bar layout variants\n */\ntype ProgressBarLayout = 'default' | 'stacked' | 'compact';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'h-1', // 4px height (h-1 = 4px in Tailwind)\n    bar: 'h-1', // 4px height for the fill bar\n    spacing: 'gap-2', // 8px gap between label and progress bar\n    layout: 'flex-col', // vertical layout for small\n    borderRadius: 'rounded-full', // 9999px border radius\n  },\n  medium: {\n    container: 'h-2', // 8px height (h-2 = 8px in Tailwind)\n    bar: 'h-2', // 8px height for the fill bar\n    spacing: 'gap-2', // 8px gap between progress bar and label\n    layout: 'flex-row items-center', // horizontal layout for medium\n    borderRadius: 'rounded-lg', // 8px border radius\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-primary-700', // Blue for activity progress (#2271C4)\n  },\n  green: {\n    background: 'bg-background-300', // Background track color (#D5D4D4)\n    fill: 'bg-success-200', // Green for performance (#84D3A2)\n  },\n} as const;\n\n/**\n * Type for size classes\n */\ntype SizeClassType = (typeof SIZE_CLASSES)[keyof typeof SIZE_CLASSES];\n\n/**\n * Type for variant classes\n */\ntype VariantClassType = (typeof VARIANT_CLASSES)[keyof typeof VARIANT_CLASSES];\n\n/**\n * Common props shared across all layout components\n */\ninterface BaseLayoutProps {\n  className: string;\n  label: ReactNode;\n  showPercentage: boolean;\n  showHitCount: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  variantClasses: VariantClassType;\n}\n\n/**\n * Dimensions configuration for layouts\n */\ninterface LayoutDimensions {\n  width: string;\n  height: string;\n}\n\n/**\n * Props for StackedLayout component\n */\ninterface StackedLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for CompactLayout component\n */\ninterface CompactLayoutProps extends BaseLayoutProps {\n  dimensions: LayoutDimensions;\n}\n\n/**\n * Props for DefaultLayout component\n */\ninterface DefaultLayoutProps {\n  className: string;\n  size: ProgressBarSize;\n  sizeClasses: SizeClassType;\n  variantClasses: VariantClassType;\n  label: ReactNode;\n  showPercentage: boolean;\n  labelClassName: string;\n  percentageClassName: string;\n  clampedValue: number;\n  max: number;\n  percentage: number;\n}\n\n/**\n * ProgressBar component props interface\n */\nexport type ProgressBarProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress bar */\n  size?: ProgressBarSize;\n  /** Color variant of the progress bar */\n  variant?: ProgressBarVariant;\n  /** Layout variant of the progress bar */\n  layout?: ProgressBarLayout;\n  /** Optional label to display */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /**\n   * Show hit count (e.g., \"28 de 30\") instead of percentage\n   *\n   * PRIORITY: When both showHitCount and showPercentage are true,\n   * showHitCount takes precedence (stacked and compact layouts only).\n   * Default layout does not support showHitCount.\n   */\n  showHitCount?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n  /** Custom width for stacked layout (defaults to w-[380px]) */\n  stackedWidth?: string;\n  /** Custom height for stacked layout (defaults to h-[35px]) */\n  stackedHeight?: string;\n  /** Custom width for compact layout (defaults to w-[131px]) */\n  compactWidth?: string;\n  /** Custom height for compact layout (defaults to h-[24px]) */\n  compactHeight?: string;\n};\n\n/**\n * Helper function to calculate safe progress values\n */\nconst calculateProgressValues = (value: number, max: number) => {\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  return { clampedValue, percentage };\n};\n\n/**\n * Helper function to determine if header content should be shown\n */\nconst shouldShowHeader = (\n  label: ReactNode,\n  showPercentage: boolean,\n  showHitCount: boolean\n): boolean => {\n  return !!(label || showPercentage || showHitCount);\n};\n\n/**\n * Centralized function to determine display priority and content\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * @param showHitCount - Whether to show hit count format\n * @param showPercentage - Whether to show percentage format\n * @param label - Custom label to display\n * @param clampedValue - Current progress value\n * @param max - Maximum progress value\n * @param percentage - Calculated percentage value\n * @returns Object with content type and formatted content\n */\nconst getDisplayPriority = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  label: ReactNode,\n  clampedValue: number,\n  max: number,\n  percentage: number\n) => {\n  if (showHitCount) {\n    return {\n      type: 'hitCount' as const,\n      content: `${Math.round(clampedValue)} de ${max}`,\n      hasMetrics: true,\n    };\n  }\n\n  if (showPercentage) {\n    return {\n      type: 'percentage' as const,\n      content: `${Math.round(percentage)}%`,\n      hasMetrics: true,\n    };\n  }\n\n  return {\n    type: 'label' as const,\n    content: label,\n    hasMetrics: false,\n  };\n};\n\n/**\n * Parameters for compact layout configuration\n */\ninterface CompactLayoutConfigParams {\n  showPercentage: boolean;\n  showHitCount: boolean;\n  percentage: number;\n  clampedValue: number;\n  max: number;\n  label: ReactNode;\n  percentageClassName: string;\n  labelClassName: string;\n}\n\n/**\n * Helper function to get compact layout configuration\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n * 3. label (lowest priority) - displays custom label\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst getCompactLayoutConfig = ({\n  showPercentage,\n  showHitCount,\n  percentage,\n  clampedValue,\n  max,\n  label,\n  percentageClassName,\n  labelClassName,\n}: CompactLayoutConfigParams) => {\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    label,\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return {\n    color: displayPriority.hasMetrics ? 'text-primary-600' : 'text-primary-700',\n    className: displayPriority.hasMetrics\n      ? percentageClassName\n      : labelClassName,\n    content: displayPriority.content,\n  };\n};\n\n/**\n * Helper function to get default layout display configuration\n *\n * PRIORITY ORDER for default layout (showHitCount is not supported):\n * 1. showPercentage (when enabled, takes precedence over label)\n * 2. label (shown only when showPercentage is false)\n *\n * Note: Default layout does not support showHitCount feature.\n */\nconst getDefaultLayoutDisplayConfig = (\n  size: ProgressBarSize,\n  label: ReactNode,\n  showPercentage: boolean\n) => ({\n  showHeader: size === 'small' && !!(label || showPercentage),\n  showPercentage: size === 'medium' && showPercentage,\n  showLabel: size === 'medium' && !!label && !showPercentage, // Only show label when percentage is not shown\n});\n\n/**\n * Helper function to render hit count or percentage display for stacked layout\n *\n * PRIORITY ORDER (consistent across all layouts):\n * 1. showHitCount (highest priority) - displays \"X de Y\" format\n * 2. showPercentage - displays \"X%\" format\n *\n * When both showHitCount and showPercentage are true, showHitCount takes precedence.\n */\nconst renderStackedHitCountDisplay = (\n  showHitCount: boolean,\n  showPercentage: boolean,\n  clampedValue: number,\n  max: number,\n  percentage: number,\n  percentageClassName: string\n): ReactNode => {\n  if (!showHitCount && !showPercentage) return null;\n\n  // Use centralized priority logic for consistency\n  const displayPriority = getDisplayPriority(\n    showHitCount,\n    showPercentage,\n    null, // label is not relevant for stacked layout metrics display\n    clampedValue,\n    max,\n    percentage\n  );\n\n  return (\n    <div\n      className={cn(\n        'text-xs font-medium leading-[14px] text-right',\n        percentageClassName\n      )}\n    >\n      {displayPriority.type === 'hitCount' ? (\n        <>\n          <span className=\"text-success-200\">{Math.round(clampedValue)}</span>\n          <span className=\"text-text-600\"> de {max}</span>\n        </>\n      ) : (\n        <Text size=\"xs\" weight=\"medium\" className=\"text-success-200\">\n          {Math.round(percentage)}%\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * Base progress bar component with common rendering logic\n */\nconst ProgressBarBase = ({\n  clampedValue,\n  max,\n  percentage,\n  label,\n  variantClasses,\n  containerClassName,\n  fillClassName,\n}: {\n  clampedValue: number;\n  max: number;\n  percentage: number;\n  label: ReactNode;\n  variantClasses: VariantClassType;\n  containerClassName: string;\n  fillClassName: string;\n}) => (\n  <div\n    className={cn(\n      containerClassName,\n      variantClasses.background,\n      'overflow-hidden relative'\n    )}\n  >\n    <progress\n      value={clampedValue}\n      max={max}\n      aria-label={\n        typeof label === 'string'\n          ? `${label}: ${Math.round(percentage)}% complete`\n          : `Progress: ${Math.round(percentage)}% of ${max}`\n      }\n      className=\"absolute inset-0 w-full h-full opacity-0\"\n    />\n    <div\n      className={cn(\n        fillClassName,\n        variantClasses.fill,\n        'transition-all duration-300 ease-out'\n      )}\n      style={{ width: `${percentage}%` }}\n    />\n  </div>\n);\n\n/**\n * Stacked layout component\n */\nconst StackedLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: StackedLayoutProps) => (\n  <div\n    className={cn(\n      'flex flex-col items-start gap-2',\n      dimensions.width,\n      dimensions.height,\n      className\n    )}\n  >\n    {shouldShowHeader(label, showPercentage, showHitCount) && (\n      <div className=\"flex flex-row justify-between items-center w-full h-[19px]\">\n        {label && (\n          <Text\n            as=\"div\"\n            size=\"md\"\n            weight=\"medium\"\n            className={cn('text-text-600 leading-[19px]', labelClassName)}\n          >\n            {label}\n          </Text>\n        )}\n\n        {renderStackedHitCountDisplay(\n          showHitCount,\n          showPercentage,\n          clampedValue,\n          max,\n          percentage,\n          percentageClassName\n        )}\n      </div>\n    )}\n\n    <ProgressBarBase\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n      label={label}\n      variantClasses={variantClasses}\n      containerClassName=\"w-full h-2 rounded-lg\"\n      fillClassName=\"h-2 rounded-lg shadow-hard-shadow-3\"\n    />\n  </div>\n);\n\n/**\n * Compact layout component\n */\nconst CompactLayout = ({\n  className,\n  label,\n  showPercentage,\n  showHitCount,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n  variantClasses,\n  dimensions,\n}: CompactLayoutProps) => {\n  const {\n    color,\n    className: compactClassName,\n    content,\n  } = getCompactLayoutConfig({\n    showPercentage,\n    showHitCount,\n    percentage,\n    clampedValue,\n    max,\n    label,\n    percentageClassName,\n    labelClassName,\n  });\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col items-start gap-1',\n        dimensions.width,\n        dimensions.height,\n        className\n      )}\n    >\n      {shouldShowHeader(label, showPercentage, showHitCount) && (\n        <Text\n          as=\"div\"\n          size=\"sm\"\n          weight=\"medium\"\n          color={color}\n          className={cn('leading-4 w-full', compactClassName)}\n        >\n          {content}\n        </Text>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName=\"w-full h-1 rounded-full\"\n        fillClassName=\"h-1 rounded-full\"\n      />\n    </div>\n  );\n};\n\n/**\n * Default layout component\n */\nconst DefaultLayout = ({\n  className,\n  size,\n  sizeClasses,\n  variantClasses,\n  label,\n  showPercentage,\n  labelClassName,\n  percentageClassName,\n  clampedValue,\n  max,\n  percentage,\n}: DefaultLayoutProps) => {\n  const gapClass = size === 'medium' ? 'gap-2' : sizeClasses.spacing;\n  const progressBarClass = size === 'medium' ? 'flex-grow' : 'w-full';\n  const displayConfig = getDefaultLayoutDisplayConfig(\n    size,\n    label,\n    showPercentage\n  );\n\n  return (\n    <div className={cn('flex', sizeClasses.layout, gapClass, className)}>\n      {displayConfig.showHeader && (\n        <div className=\"flex flex-row items-center justify-between w-full\">\n          {label && (\n            <Text\n              as=\"div\"\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                labelClassName\n              )}\n            >\n              {label}\n            </Text>\n          )}\n\n          {showPercentage && (\n            <Text\n              size=\"xs\"\n              weight=\"medium\"\n              className={cn(\n                'text-text-950 leading-none tracking-normal text-center',\n                percentageClassName\n              )}\n            >\n              {Math.round(percentage)}%\n            </Text>\n          )}\n        </div>\n      )}\n\n      <ProgressBarBase\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        label={label}\n        variantClasses={variantClasses}\n        containerClassName={cn(\n          progressBarClass,\n          sizeClasses.container,\n          sizeClasses.borderRadius\n        )}\n        fillClassName={cn(\n          sizeClasses.bar,\n          sizeClasses.borderRadius,\n          'shadow-hard-shadow-3'\n        )}\n      />\n\n      {displayConfig.showPercentage && (\n        <Text\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            percentageClassName\n          )}\n        >\n          {Math.round(percentage)}%\n        </Text>\n      )}\n\n      {displayConfig.showLabel && (\n        <Text\n          as=\"div\"\n          size=\"xs\"\n          weight=\"medium\"\n          className={cn(\n            'text-text-950 leading-none tracking-normal text-center flex-none',\n            labelClassName\n          )}\n        >\n          {label}\n        </Text>\n      )}\n    </div>\n  );\n};\n\n/**\n * ProgressBar component for Analytica Ensino platforms\n *\n * A progress bar component with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * CONTENT DISPLAY PRIORITY (Consistent across all layouts):\n * 1. showHitCount (highest) - \"X de Y\" format (stacked/compact only)\n * 2. showPercentage - \"X%\" format\n * 3. label (lowest) - Custom label text\n *\n * When multiple display options are enabled, higher priority options take precedence.\n *\n * @example\n * ```tsx\n * // Basic progress bar\n * <ProgressBar value={65} />\n *\n * // Activity progress (blue)\n * <ProgressBar variant=\"blue\" value={45} label=\"Progress\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressBar variant=\"green\" size=\"medium\" value={85} label=\"Performance\" />\n *\n * // Small size with custom max value\n * <ProgressBar size=\"small\" value={3} max={5} showPercentage />\n *\n * // Stacked layout with fixed width and hit count\n * <ProgressBar layout=\"stacked\" variant=\"green\" value={28} max={30} label=\"Fáceis\" showHitCount />\n *\n * // Compact layout for small cards\n * <ProgressBar layout=\"compact\" variant=\"blue\" value={70} label=\"Questão 08\" />\n * ```\n */\nconst ProgressBar = ({\n  value,\n  max = 100,\n  size = 'medium',\n  variant = 'blue',\n  layout = 'default',\n  label,\n  showPercentage = false,\n  showHitCount = false,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n  stackedWidth,\n  stackedHeight,\n  compactWidth,\n  compactHeight,\n}: ProgressBarProps) => {\n  const { clampedValue, percentage } = calculateProgressValues(value, max);\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  if (layout === 'stacked') {\n    return (\n      <StackedLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: stackedWidth ?? 'w-[380px]',\n          height: stackedHeight ?? 'h-[35px]',\n        }}\n      />\n    );\n  }\n\n  if (layout === 'compact') {\n    return (\n      <CompactLayout\n        className={className}\n        label={label}\n        showPercentage={showPercentage}\n        showHitCount={showHitCount}\n        labelClassName={labelClassName}\n        percentageClassName={percentageClassName}\n        clampedValue={clampedValue}\n        max={max}\n        percentage={percentage}\n        variantClasses={variantClasses}\n        dimensions={{\n          width: compactWidth ?? 'w-[131px]',\n          height: compactHeight ?? 'h-[24px]',\n        }}\n      />\n    );\n  }\n\n  return (\n    <DefaultLayout\n      className={className}\n      size={size}\n      sizeClasses={sizeClasses}\n      variantClasses={variantClasses}\n      label={label}\n      showPercentage={showPercentage}\n      labelClassName={labelClassName}\n      percentageClassName={percentageClassName}\n      clampedValue={clampedValue}\n      max={max}\n      percentage={percentage}\n    />\n  );\n};\n\nexport default ProgressBar;\n"],"mappings":"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","names":["jsx"]}

package/dist/ProgressCircle/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/ProgressCircle/ProgressCircle.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress circle size variants\n */\ntype ProgressCircleSize = 'small' | 'medium';\n\n/**\n * Progress circle color variants\n */\ntype ProgressCircleVariant = 'blue' | 'green';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'w-[90px] h-[90px]', // 90px circle from design specs\n    strokeWidth: 4, // 4px stroke width - matches ProgressBar small (h-1)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: '2xs' as const, // Will be overridden with custom 8px in className\n    labelWeight: 'bold', // font-weight: 700\n    spacing: 'gap-0', // Reduced gap between percentage and label for better spacing\n    contentWidth: 'max-w-[50px]', // Reduced width to fit text inside circle\n  },\n  medium: {\n    container: 'w-[152px] h-[152px]', // 151.67px ≈ 152px circle from design specs\n    strokeWidth: 8, // 8px stroke width - matches ProgressBar medium (h-2)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: 'xs' as const, // 12px for status label (font-size: 12px)\n    labelWeight: 'medium', // font-weight: 500 (changed from bold)\n    spacing: 'gap-1', // 4px gap between percentage and label\n    contentWidth: 'max-w-[90px]', // Reduced width to fit text inside circle\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'stroke-primary-100', // Light blue background (#BBDCF7)\n    fill: 'stroke-primary-700', // Blue for activity progress (#2271C4)\n    textColor: 'text-primary-700', // Blue text color (#2271C4)\n    labelColor: 'text-text-700', // Gray text for label (#525252)\n  },\n  green: {\n    background: 'stroke-background-300', // Gray background (#D5D4D4 - matches design)\n    fill: 'stroke-success-200', // Green for performance (#84D3A2 - matches design)\n    textColor: 'text-text-800', // Dark gray text (#404040 - matches design)\n    labelColor: 'text-text-600', // Medium gray text for label (#737373 - matches design)\n  },\n} as const;\n\n/**\n * ProgressCircle component props interface\n */\nexport type ProgressCircleProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress circle */\n  size?: ProgressCircleSize;\n  /** Color variant of the progress circle */\n  variant?: ProgressCircleVariant;\n  /** Optional label to display below percentage */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n};\n\n/**\n * ProgressCircle component for Analytica Ensino platforms\n *\n * A circular progress indicator with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * @example\n * ```tsx\n * // Basic progress circle\n * <ProgressCircle value={65} />\n *\n * // Activity progress (blue)\n * <ProgressCircle variant=\"blue\" value={45} label=\"CONCLUÍDO\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressCircle variant=\"green\" size=\"medium\" value={85} label=\"MÉDIA\" />\n *\n * // Small size with custom max value\n * <ProgressCircle size=\"small\" value={3} max={5} showPercentage />\n * ```\n */\nconst ProgressCircle = ({\n  value,\n  max = 100,\n  size = 'small',\n  variant = 'blue',\n  label,\n  showPercentage = true,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n}: ProgressCircleProps) => {\n  // Ensure value is within bounds and handle NaN/Infinity\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  // Get size and variant classes\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  // Calculate SVG dimensions and stroke properties\n  const radius = size === 'small' ? 37 : 64; // Radius calculation based on container size\n  const circumference = 2 * Math.PI * radius;\n  const strokeDashoffset = circumference - (percentage / 100) * circumference;\n  const center = size === 'small' ? 45 : 76; // Center point of SVG\n  const svgSize = size === 'small' ? 90 : 152; // SVG viewBox size\n\n  return (\n    <div\n      className={cn(\n        'relative flex flex-col items-center justify-center',\n        sizeClasses.container,\n        'rounded-lg',\n        className\n      )}\n    >\n      {/* Progress circle SVG */}\n      <svg\n        className=\"absolute inset-0 transform -rotate-90\"\n        width={svgSize}\n        height={svgSize}\n        viewBox={`0 0 ${svgSize} ${svgSize}`}\n        aria-hidden=\"true\"\n      >\n        {/* Background circle */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          className={cn(variantClasses.background, 'rounded-lg')}\n        />\n        {/* Progress circle - SVG stroke properties require style for animation */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={strokeDashoffset}\n          className={cn(\n            variantClasses.fill,\n            'transition-all duration-500 ease-out shadow-soft-shadow-3 rounded-lg'\n          )}\n        />\n      </svg>\n\n      {/* Native progress element for accessibility */}\n      <progress\n        value={clampedValue}\n        max={max}\n        aria-label={typeof label === 'string' ? label : 'Progress'}\n        className=\"absolute opacity-0 w-0 h-0\"\n      />\n\n      {/* Content overlay - centered content */}\n      <div\n        className={cn(\n          'relative z-10 flex flex-col items-center justify-center',\n          sizeClasses.spacing,\n          sizeClasses.contentWidth\n        )}\n      >\n        {/* Percentage text */}\n        {showPercentage && (\n          <Text\n            size={sizeClasses.textSize}\n            weight={sizeClasses.textWeight}\n            className={cn(\n              'text-center w-full',\n              variantClasses.textColor,\n              percentageClassName\n            )}\n          >\n            {Math.round(percentage)}%\n          </Text>\n        )}\n\n        {/* Label text */}\n        {label && (\n          <Text\n            as=\"span\"\n            size={sizeClasses.labelSize}\n            weight={sizeClasses.labelWeight}\n            className={cn(\n              variantClasses.labelColor,\n              'text-center uppercase tracking-wide truncate w-full',\n              labelClassName\n            )}\n          >\n            {label}\n          </Text>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default ProgressCircle;\n","import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n"],"mappings":"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","names":["import_jsx_runtime"]}
+{"version":3,"sources":["../../src/components/ProgressCircle/ProgressCircle.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress circle size variants\n */\ntype ProgressCircleSize = 'small' | 'medium';\n\n/**\n * Progress circle color variants\n */\ntype ProgressCircleVariant = 'blue' | 'green';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'w-[90px] h-[90px]', // 90px circle from design specs\n    strokeWidth: 4, // 4px stroke width - matches ProgressBar small (h-1)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: '2xs' as const, // Will be overridden with custom 8px in className\n    labelWeight: 'bold', // font-weight: 700\n    spacing: 'gap-0', // Reduced gap between percentage and label for better spacing\n    contentWidth: 'max-w-[50px]', // Reduced width to fit text inside circle\n  },\n  medium: {\n    container: 'w-[152px] h-[152px]', // 151.67px ≈ 152px circle from design specs\n    strokeWidth: 8, // 8px stroke width - matches ProgressBar medium (h-2)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: 'xs' as const, // 12px for status label (font-size: 12px)\n    labelWeight: 'medium', // font-weight: 500 (changed from bold)\n    spacing: 'gap-1', // 4px gap between percentage and label\n    contentWidth: 'max-w-[90px]', // Reduced width to fit text inside circle\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'stroke-primary-100', // Light blue background (#BBDCF7)\n    fill: 'stroke-primary-700', // Blue for activity progress (#2271C4)\n    textColor: 'text-primary-700', // Blue text color (#2271C4)\n    labelColor: 'text-text-700', // Gray text for label (#525252)\n  },\n  green: {\n    background: 'stroke-background-300', // Gray background (#D5D4D4 - matches design)\n    fill: 'stroke-success-200', // Green for performance (#84D3A2 - matches design)\n    textColor: 'text-text-800', // Dark gray text (#404040 - matches design)\n    labelColor: 'text-text-600', // Medium gray text for label (#737373 - matches design)\n  },\n} as const;\n\n/**\n * ProgressCircle component props interface\n */\nexport type ProgressCircleProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress circle */\n  size?: ProgressCircleSize;\n  /** Color variant of the progress circle */\n  variant?: ProgressCircleVariant;\n  /** Optional label to display below percentage */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n};\n\n/**\n * ProgressCircle component for Analytica Ensino platforms\n *\n * A circular progress indicator with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * @example\n * ```tsx\n * // Basic progress circle\n * <ProgressCircle value={65} />\n *\n * // Activity progress (blue)\n * <ProgressCircle variant=\"blue\" value={45} label=\"CONCLUÍDO\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressCircle variant=\"green\" size=\"medium\" value={85} label=\"MÉDIA\" />\n *\n * // Small size with custom max value\n * <ProgressCircle size=\"small\" value={3} max={5} showPercentage />\n * ```\n */\nconst ProgressCircle = ({\n  value,\n  max = 100,\n  size = 'small',\n  variant = 'blue',\n  label,\n  showPercentage = true,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n}: ProgressCircleProps) => {\n  // Ensure value is within bounds and handle NaN/Infinity\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  // Get size and variant classes\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  // Calculate SVG dimensions and stroke properties\n  const radius = size === 'small' ? 37 : 64; // Radius calculation based on container size\n  const circumference = 2 * Math.PI * radius;\n  const strokeDashoffset = circumference - (percentage / 100) * circumference;\n  const center = size === 'small' ? 45 : 76; // Center point of SVG\n  const svgSize = size === 'small' ? 90 : 152; // SVG viewBox size\n\n  return (\n    <div\n      className={cn(\n        'relative flex flex-col items-center justify-center',\n        sizeClasses.container,\n        'rounded-lg',\n        className\n      )}\n    >\n      {/* Progress circle SVG */}\n      <svg\n        className=\"absolute inset-0 transform -rotate-90\"\n        width={svgSize}\n        height={svgSize}\n        viewBox={`0 0 ${svgSize} ${svgSize}`}\n        aria-hidden=\"true\"\n      >\n        {/* Background circle */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          className={cn(variantClasses.background, 'rounded-lg')}\n        />\n        {/* Progress circle - SVG stroke properties require style for animation */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={strokeDashoffset}\n          className={cn(\n            variantClasses.fill,\n            'transition-all duration-500 ease-out shadow-soft-shadow-3 rounded-lg'\n          )}\n        />\n      </svg>\n\n      {/* Native progress element for accessibility */}\n      <progress\n        value={clampedValue}\n        max={max}\n        aria-label={typeof label === 'string' ? label : 'Progress'}\n        className=\"absolute opacity-0 w-0 h-0\"\n      />\n\n      {/* Content overlay - centered content */}\n      <div\n        className={cn(\n          'relative z-10 flex flex-col items-center justify-center',\n          sizeClasses.spacing,\n          sizeClasses.contentWidth\n        )}\n      >\n        {/* Percentage text */}\n        {showPercentage && (\n          <Text\n            size={sizeClasses.textSize}\n            weight={sizeClasses.textWeight}\n            className={cn(\n              'text-center w-full',\n              variantClasses.textColor,\n              percentageClassName\n            )}\n          >\n            {Math.round(percentage)}%\n          </Text>\n        )}\n\n        {/* Label text */}\n        {label && (\n          <Text\n            as=\"span\"\n            size={sizeClasses.labelSize}\n            weight={sizeClasses.labelWeight}\n            className={cn(\n              variantClasses.labelColor,\n              'text-center uppercase tracking-wide truncate w-full',\n              labelClassName\n            )}\n          >\n            {label}\n          </Text>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default ProgressCircle;\n","import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\nexport {\n  getStatusBadgeConfig,\n  formatTimeSpent,\n  formatQuestionNumbers,\n  formatDateToBrazilian,\n} from './activityDetailsUtils';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n"],"mappings":"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","names":["import_jsx_runtime"]}

package/dist/ProgressCircle/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/ProgressCircle/ProgressCircle.tsx"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n","import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress circle size variants\n */\ntype ProgressCircleSize = 'small' | 'medium';\n\n/**\n * Progress circle color variants\n */\ntype ProgressCircleVariant = 'blue' | 'green';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'w-[90px] h-[90px]', // 90px circle from design specs\n    strokeWidth: 4, // 4px stroke width - matches ProgressBar small (h-1)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: '2xs' as const, // Will be overridden with custom 8px in className\n    labelWeight: 'bold', // font-weight: 700\n    spacing: 'gap-0', // Reduced gap between percentage and label for better spacing\n    contentWidth: 'max-w-[50px]', // Reduced width to fit text inside circle\n  },\n  medium: {\n    container: 'w-[152px] h-[152px]', // 151.67px ≈ 152px circle from design specs\n    strokeWidth: 8, // 8px stroke width - matches ProgressBar medium (h-2)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: 'xs' as const, // 12px for status label (font-size: 12px)\n    labelWeight: 'medium', // font-weight: 500 (changed from bold)\n    spacing: 'gap-1', // 4px gap between percentage and label\n    contentWidth: 'max-w-[90px]', // Reduced width to fit text inside circle\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'stroke-primary-100', // Light blue background (#BBDCF7)\n    fill: 'stroke-primary-700', // Blue for activity progress (#2271C4)\n    textColor: 'text-primary-700', // Blue text color (#2271C4)\n    labelColor: 'text-text-700', // Gray text for label (#525252)\n  },\n  green: {\n    background: 'stroke-background-300', // Gray background (#D5D4D4 - matches design)\n    fill: 'stroke-success-200', // Green for performance (#84D3A2 - matches design)\n    textColor: 'text-text-800', // Dark gray text (#404040 - matches design)\n    labelColor: 'text-text-600', // Medium gray text for label (#737373 - matches design)\n  },\n} as const;\n\n/**\n * ProgressCircle component props interface\n */\nexport type ProgressCircleProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress circle */\n  size?: ProgressCircleSize;\n  /** Color variant of the progress circle */\n  variant?: ProgressCircleVariant;\n  /** Optional label to display below percentage */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n};\n\n/**\n * ProgressCircle component for Analytica Ensino platforms\n *\n * A circular progress indicator with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * @example\n * ```tsx\n * // Basic progress circle\n * <ProgressCircle value={65} />\n *\n * // Activity progress (blue)\n * <ProgressCircle variant=\"blue\" value={45} label=\"CONCLUÍDO\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressCircle variant=\"green\" size=\"medium\" value={85} label=\"MÉDIA\" />\n *\n * // Small size with custom max value\n * <ProgressCircle size=\"small\" value={3} max={5} showPercentage />\n * ```\n */\nconst ProgressCircle = ({\n  value,\n  max = 100,\n  size = 'small',\n  variant = 'blue',\n  label,\n  showPercentage = true,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n}: ProgressCircleProps) => {\n  // Ensure value is within bounds and handle NaN/Infinity\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  // Get size and variant classes\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  // Calculate SVG dimensions and stroke properties\n  const radius = size === 'small' ? 37 : 64; // Radius calculation based on container size\n  const circumference = 2 * Math.PI * radius;\n  const strokeDashoffset = circumference - (percentage / 100) * circumference;\n  const center = size === 'small' ? 45 : 76; // Center point of SVG\n  const svgSize = size === 'small' ? 90 : 152; // SVG viewBox size\n\n  return (\n    <div\n      className={cn(\n        'relative flex flex-col items-center justify-center',\n        sizeClasses.container,\n        'rounded-lg',\n        className\n      )}\n    >\n      {/* Progress circle SVG */}\n      <svg\n        className=\"absolute inset-0 transform -rotate-90\"\n        width={svgSize}\n        height={svgSize}\n        viewBox={`0 0 ${svgSize} ${svgSize}`}\n        aria-hidden=\"true\"\n      >\n        {/* Background circle */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          className={cn(variantClasses.background, 'rounded-lg')}\n        />\n        {/* Progress circle - SVG stroke properties require style for animation */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={strokeDashoffset}\n          className={cn(\n            variantClasses.fill,\n            'transition-all duration-500 ease-out shadow-soft-shadow-3 rounded-lg'\n          )}\n        />\n      </svg>\n\n      {/* Native progress element for accessibility */}\n      <progress\n        value={clampedValue}\n        max={max}\n        aria-label={typeof label === 'string' ? label : 'Progress'}\n        className=\"absolute opacity-0 w-0 h-0\"\n      />\n\n      {/* Content overlay - centered content */}\n      <div\n        className={cn(\n          'relative z-10 flex flex-col items-center justify-center',\n          sizeClasses.spacing,\n          sizeClasses.contentWidth\n        )}\n      >\n        {/* Percentage text */}\n        {showPercentage && (\n          <Text\n            size={sizeClasses.textSize}\n            weight={sizeClasses.textWeight}\n            className={cn(\n              'text-center w-full',\n              variantClasses.textColor,\n              percentageClassName\n            )}\n          >\n            {Math.round(percentage)}%\n          </Text>\n        )}\n\n        {/* Label text */}\n        {label && (\n          <Text\n            as=\"span\"\n            size={sizeClasses.labelSize}\n            weight={sizeClasses.labelWeight}\n            className={cn(\n              variantClasses.labelColor,\n              'text-center uppercase tracking-wide truncate w-full',\n              labelClassName\n            )}\n          >\n            {label}\n          </Text>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default ProgressCircle;\n"],"mappings":"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","names":["jsx"]}
+{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/ProgressCircle/ProgressCircle.tsx"],"sourcesContent":["import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n} from './activityFilters';\nexport {\n  getStatusBadgeConfig,\n  formatTimeSpent,\n  formatQuestionNumbers,\n  formatDateToBrazilian,\n} from './activityDetailsUtils';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n","import { ReactNode } from 'react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Progress circle size variants\n */\ntype ProgressCircleSize = 'small' | 'medium';\n\n/**\n * Progress circle color variants\n */\ntype ProgressCircleVariant = 'blue' | 'green';\n\n/**\n * Size configurations using Tailwind classes\n */\nconst SIZE_CLASSES = {\n  small: {\n    container: 'w-[90px] h-[90px]', // 90px circle from design specs\n    strokeWidth: 4, // 4px stroke width - matches ProgressBar small (h-1)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: '2xs' as const, // Will be overridden with custom 8px in className\n    labelWeight: 'bold', // font-weight: 700\n    spacing: 'gap-0', // Reduced gap between percentage and label for better spacing\n    contentWidth: 'max-w-[50px]', // Reduced width to fit text inside circle\n  },\n  medium: {\n    container: 'w-[152px] h-[152px]', // 151.67px ≈ 152px circle from design specs\n    strokeWidth: 8, // 8px stroke width - matches ProgressBar medium (h-2)\n    textSize: '2xl', // 24px for percentage (font-size: 24px)\n    textWeight: 'medium', // font-weight: 500\n    labelSize: 'xs' as const, // 12px for status label (font-size: 12px)\n    labelWeight: 'medium', // font-weight: 500 (changed from bold)\n    spacing: 'gap-1', // 4px gap between percentage and label\n    contentWidth: 'max-w-[90px]', // Reduced width to fit text inside circle\n  },\n} as const;\n\n/**\n * Color configurations using design system colors\n */\nconst VARIANT_CLASSES = {\n  blue: {\n    background: 'stroke-primary-100', // Light blue background (#BBDCF7)\n    fill: 'stroke-primary-700', // Blue for activity progress (#2271C4)\n    textColor: 'text-primary-700', // Blue text color (#2271C4)\n    labelColor: 'text-text-700', // Gray text for label (#525252)\n  },\n  green: {\n    background: 'stroke-background-300', // Gray background (#D5D4D4 - matches design)\n    fill: 'stroke-success-200', // Green for performance (#84D3A2 - matches design)\n    textColor: 'text-text-800', // Dark gray text (#404040 - matches design)\n    labelColor: 'text-text-600', // Medium gray text for label (#737373 - matches design)\n  },\n} as const;\n\n/**\n * ProgressCircle component props interface\n */\nexport type ProgressCircleProps = {\n  /** Progress value between 0 and 100 */\n  value: number;\n  /** Maximum value (defaults to 100) */\n  max?: number;\n  /** Size variant of the progress circle */\n  size?: ProgressCircleSize;\n  /** Color variant of the progress circle */\n  variant?: ProgressCircleVariant;\n  /** Optional label to display below percentage */\n  label?: ReactNode;\n  /** Show percentage text */\n  showPercentage?: boolean;\n  /** Additional CSS classes */\n  className?: string;\n  /** Label CSS classes */\n  labelClassName?: string;\n  /** Percentage text CSS classes */\n  percentageClassName?: string;\n};\n\n/**\n * ProgressCircle component for Analytica Ensino platforms\n *\n * A circular progress indicator with size and color variants designed for tracking\n * activity progress (blue) and performance metrics (green).\n * Uses the Analytica Ensino Design System colors from styles.css with automatic\n * light/dark mode support. Includes Text component integration for consistent typography.\n *\n * @example\n * ```tsx\n * // Basic progress circle\n * <ProgressCircle value={65} />\n *\n * // Activity progress (blue)\n * <ProgressCircle variant=\"blue\" value={45} label=\"CONCLUÍDO\" showPercentage />\n *\n * // Performance metrics (green)\n * <ProgressCircle variant=\"green\" size=\"medium\" value={85} label=\"MÉDIA\" />\n *\n * // Small size with custom max value\n * <ProgressCircle size=\"small\" value={3} max={5} showPercentage />\n * ```\n */\nconst ProgressCircle = ({\n  value,\n  max = 100,\n  size = 'small',\n  variant = 'blue',\n  label,\n  showPercentage = true,\n  className = '',\n  labelClassName = '',\n  percentageClassName = '',\n}: ProgressCircleProps) => {\n  // Ensure value is within bounds and handle NaN/Infinity\n  const safeValue = isNaN(value) ? 0 : value;\n  const clampedValue = Math.max(0, Math.min(safeValue, max));\n  const percentage = max === 0 ? 0 : (clampedValue / max) * 100;\n\n  // Get size and variant classes\n  const sizeClasses = SIZE_CLASSES[size];\n  const variantClasses = VARIANT_CLASSES[variant];\n\n  // Calculate SVG dimensions and stroke properties\n  const radius = size === 'small' ? 37 : 64; // Radius calculation based on container size\n  const circumference = 2 * Math.PI * radius;\n  const strokeDashoffset = circumference - (percentage / 100) * circumference;\n  const center = size === 'small' ? 45 : 76; // Center point of SVG\n  const svgSize = size === 'small' ? 90 : 152; // SVG viewBox size\n\n  return (\n    <div\n      className={cn(\n        'relative flex flex-col items-center justify-center',\n        sizeClasses.container,\n        'rounded-lg',\n        className\n      )}\n    >\n      {/* Progress circle SVG */}\n      <svg\n        className=\"absolute inset-0 transform -rotate-90\"\n        width={svgSize}\n        height={svgSize}\n        viewBox={`0 0 ${svgSize} ${svgSize}`}\n        aria-hidden=\"true\"\n      >\n        {/* Background circle */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          className={cn(variantClasses.background, 'rounded-lg')}\n        />\n        {/* Progress circle - SVG stroke properties require style for animation */}\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          strokeWidth={sizeClasses.strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={strokeDashoffset}\n          className={cn(\n            variantClasses.fill,\n            'transition-all duration-500 ease-out shadow-soft-shadow-3 rounded-lg'\n          )}\n        />\n      </svg>\n\n      {/* Native progress element for accessibility */}\n      <progress\n        value={clampedValue}\n        max={max}\n        aria-label={typeof label === 'string' ? label : 'Progress'}\n        className=\"absolute opacity-0 w-0 h-0\"\n      />\n\n      {/* Content overlay - centered content */}\n      <div\n        className={cn(\n          'relative z-10 flex flex-col items-center justify-center',\n          sizeClasses.spacing,\n          sizeClasses.contentWidth\n        )}\n      >\n        {/* Percentage text */}\n        {showPercentage && (\n          <Text\n            size={sizeClasses.textSize}\n            weight={sizeClasses.textWeight}\n            className={cn(\n              'text-center w-full',\n              variantClasses.textColor,\n              percentageClassName\n            )}\n          >\n            {Math.round(percentage)}%\n          </Text>\n        )}\n\n        {/* Label text */}\n        {label && (\n          <Text\n            as=\"span\"\n            size={sizeClasses.labelSize}\n            weight={sizeClasses.labelWeight}\n            className={cn(\n              variantClasses.labelColor,\n              'text-center uppercase tracking-wide truncate w-full',\n              labelClassName\n            )}\n          >\n            {label}\n          </Text>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default ProgressCircle;\n"],"mappings":"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","names":["jsx"]}