analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
1 lines • 22.4 kB
Source Map (JSON)
{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/Stepper/Stepper.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 areFiltersEqual,\n} from './activityFilters';\nexport {\n mapQuestionTypeToEnum,\n mapQuestionTypeToEnumRequired,\n} from './questionTypeUtils';\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 Text from '../Text/Text';\nimport { Check } from 'phosphor-react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Stepper size variants\n */\ntype StepperSize = 'small' | 'medium' | 'large' | 'extraLarge';\n\n/**\n * Step state variants\n */\ntype StepState = 'pending' | 'current' | 'completed';\n\n/**\n * Individual step data interface\n */\nexport interface StepData {\n /** Unique identifier for the step */\n id: string;\n /** Label text for the step */\n label: string;\n /** Current state of the step */\n state: StepState;\n}\n\n/**\n * Size configurations - Following design system pattern from CSS specifications\n * Small size based on exact CSS: width 58px, height 38px, gap 8px\n */\nconst SIZE_CLASSES = {\n small: {\n container: 'gap-2', // 8px gap as specified in CSS\n stepWidth: 'w-[58px]', // exact 58px from CSS\n stepHeight: 'h-[38px]', // exact 38px from CSS\n indicator: 'w-5 h-5', // 20px as specified\n progressBar: 'h-0.5', // 2px as specified\n indicatorTextSize: '2xs', // 10px as specified\n labelTextSize: 'xs', // 12px as specified\n iconSize: 'w-3 h-3', // 12px\n },\n medium: {\n container: 'gap-3', // 12px (8px + 4px progression)\n stepWidth: 'w-[110px]', // 110px (increased from 90px to fit \"Endereço Residencial\")\n stepHeight: 'h-[48px]', // 48px (increased from 46px for better proportion)\n indicator: 'w-6 h-6', // 24px (20px + 4px progression)\n progressBar: 'h-0.5', // 2px maintained for consistency\n indicatorTextSize: '2xs', // 10px maintained for readability\n labelTextSize: 'xs', // 12px maintained\n iconSize: 'w-3.5 h-3.5', // 14px\n },\n large: {\n container: 'gap-4', // 16px (12px + 4px progression)\n stepWidth: 'w-[160px]', // 160px (increased from 140px to fit \"Endereço Residencial\")\n stepHeight: 'h-[58px]', // 58px (increased from 54px for better proportion)\n indicator: 'w-7 h-7', // 28px (24px + 4px progression)\n progressBar: 'h-1', // 4px (increased for better visibility)\n indicatorTextSize: 'xs', // 12px (increased for larger size)\n labelTextSize: 'sm', // 14px (increased for larger size)\n iconSize: 'w-4 h-4', // 16px\n },\n extraLarge: {\n container: 'gap-5', // 20px (16px + 4px progression)\n stepWidth: 'w-[200px]', // 200px (increased from 180px to ensure \"Endereço Residencial\" fits)\n stepHeight: 'h-[68px]', // 68px (increased from 62px for better proportion)\n indicator: 'w-8 h-8', // 32px (28px + 4px progression)\n progressBar: 'h-1', // 4px maintained\n indicatorTextSize: 'xs', // 12px maintained for readability\n labelTextSize: 'sm', // 14px maintained\n iconSize: 'w-[18px] h-[18px]', // 18px\n },\n} as const;\n\n/**\n * State configurations using exact colors from CSS specs\n * pending: #A3A3A3 = text-400 (etapa ainda não iniciada)\n * current: #1C61B2 = primary-800 (etapa atual sendo preenchida) - baseado no CSS fornecido\n * completed: #1C61B2 = primary-800 (etapa concluída)\n * text color: #FEFEFF = text\n */\nconst STATE_CLASSES = {\n pending: {\n progressBar: 'bg-text-400', // #A3A3A3\n indicator: 'bg-text-400', // #A3A3A3\n indicatorText: 'text-white', // Branco para contraste com background cinza\n label: 'text-text-400', // #A3A3A3\n },\n current: {\n progressBar: 'bg-primary-800', // #1C61B2 usando classe Tailwind padrão\n indicator: 'bg-primary-800', // #1C61B2 usando classe Tailwind padrão\n indicatorText: 'text-white', // Branco usando classe Tailwind padrão\n label: 'text-primary-800', // #1C61B2 usando classe Tailwind padrão\n },\n completed: {\n progressBar: 'bg-primary-400', // #48A0E8 para barra quando checked (completed)\n indicator: 'bg-primary-400', // #48A0E8 para corresponder à barra de progresso\n indicatorText: 'text-white', // Branco usando classe Tailwind padrão\n label: 'text-primary-400', // #48A0E8 para corresponder à barra de progresso\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 state classes\n */\ntype StateClassType = (typeof STATE_CLASSES)[keyof typeof STATE_CLASSES];\n\n/**\n * Props for individual step component\n */\ninterface StepProps {\n step: StepData;\n index: number;\n size: StepperSize;\n sizeClasses: SizeClassType;\n stateClasses: StateClassType;\n isLast: boolean;\n className?: string;\n}\n\n/**\n * Individual Step component - Based on exact design specifications\n * Layout: flex-column with progress bar at top, then icon+label row\n * Fully responsive for mobile, tablets, and laptops\n */\nexport const Step = ({\n step,\n index,\n size: _size,\n sizeClasses,\n stateClasses,\n isLast: _isLast,\n className = '',\n}: StepProps) => {\n const stepNumber = index + 1;\n const isCompleted = step.state === 'completed';\n\n // Generate accessible aria-label based on step state\n const getAriaLabel = () => {\n let suffix = '';\n if (step.state === 'completed') {\n suffix = ' (concluído)';\n } else if (step.state === 'current') {\n suffix = ' (atual)';\n }\n return `${step.label}${suffix}`;\n };\n\n return (\n <div\n className={`\n flex flex-col justify-center items-center pb-2 gap-2\n ${sizeClasses.stepWidth} ${sizeClasses.stepHeight}\n flex-none flex-grow\n ${className}\n sm:max-w-[100px] md:max-w-[120px] lg:max-w-none xl:max-w-none\n sm:min-h-[40px] md:min-h-[45px] lg:min-h-none\n overflow-visible\n `}\n >\n {/* Progress Bar - Full width at top with responsive scaling */}\n <div\n className={`\n w-full ${sizeClasses.progressBar} ${stateClasses.progressBar}\n rounded-sm flex-none\n `}\n />\n\n {/* Step Content Container - Responsive layout for all devices, no vertical scroll */}\n <div\n className={`\n flex flex-col sm:flex-row items-center\n gap-1 sm:gap-2 w-full sm:w-auto\n h-auto sm:h-5 flex-none\n overflow-visible\n `}\n >\n {/* Step Indicator Circle with responsive sizing */}\n <div\n className={`\n ${sizeClasses.indicator} ${stateClasses.indicator}\n rounded-full flex items-center justify-center relative\n flex-none transition-all duration-300 ease-out\n `}\n aria-label={getAriaLabel()}\n >\n {isCompleted ? (\n <Check\n weight=\"bold\"\n className={`\n ${stateClasses.indicatorText}\n w-2.5 h-2.5 sm:w-3 sm:h-3 md:w-3 md:h-3 lg:w-3.5 lg:h-3.5\n `}\n />\n ) : (\n <Text\n size={sizeClasses.indicatorTextSize as '2xs' | 'xs' | 'sm'}\n weight=\"medium\"\n color=\"\"\n className={cn(stateClasses.indicatorText, 'leading-none')}\n >\n {stepNumber}\n </Text>\n )}\n </div>\n\n {/* Step Label with full responsive text sizing, no vertical overflow */}\n <Text\n size={sizeClasses.labelTextSize as '2xs' | 'xs' | 'sm' | 'md'}\n weight=\"medium\"\n color=\"\"\n className={cn(\n stateClasses.label,\n 'leading-tight flex-none text-center sm:text-left break-words px-1 sm:px-0 max-w-full whitespace-normal'\n )}\n >\n {step.label}\n </Text>\n </div>\n </div>\n );\n};\n\n/**\n * Stepper component props interface\n */\nexport type StepperProps = {\n /** Array of step data */\n steps: StepData[];\n /** Size variant of the stepper */\n size?: StepperSize;\n /** Current active step index */\n currentStep?: number;\n /** Additional CSS classes */\n className?: string;\n /** Step container CSS classes */\n stepClassName?: string;\n /** Progress indicator (e.g., \"Etapa 2 de 4\") */\n showProgress?: boolean;\n /** Custom progress text */\n progressText?: string;\n /** Make stepper responsive (vertical on mobile) */\n responsive?: boolean;\n};\n\n/**\n * Helper function to calculate step states based on current step\n */\nconst calculateStepStates = (\n steps: StepData[],\n currentStep: number\n): StepData[] => {\n return steps.map((step, index) => {\n let stepState: StepState;\n\n if (index < currentStep) {\n stepState = 'completed';\n } else if (index === currentStep) {\n stepState = 'current';\n } else {\n stepState = 'pending';\n }\n\n return {\n ...step,\n state: stepState,\n };\n });\n};\n\n/**\n * Helper function to get progress text\n */\nconst getProgressText = (\n currentStep: number,\n totalSteps: number,\n customText?: string\n): string => {\n if (customText) return customText;\n return `Etapa ${currentStep + 1} de ${totalSteps}`;\n};\n\n/**\n * Stepper component for Analytica Ensino platforms\n *\n * A progress stepper component that displays a sequence of steps with different states.\n * Follows the exact design specifications with proper spacing, colors, and layout.\n * Fully responsive for mobile, tablets, and laptops.\n *\n * Design specifications:\n * - Based on exact CSS specifications from Figma design\n * - Fully responsive: mobile (320px+) -> tablets (640px+) -> laptops (1024px+)\n * - Progressive sizing with responsive breakpoints that adapt to device type\n * - Consistent gaps that scale with screen size and device capabilities\n * - Consistent color scheme: pending (gray), current (dark blue), completed (light blue)\n * - Responsive design with overflow scroll on smaller devices\n * - Optimized text sizing and layout for each device category\n *\n * @example\n * ```tsx\n * // Basic stepper - automatically responsive for all devices\n * <Stepper steps={steps} currentStep={1} />\n *\n * // Custom styling with full responsive behavior\n * <Stepper steps={steps} size=\"medium\" showProgress responsive />\n * ```\n */\nconst Stepper = ({\n steps: initialSteps,\n size = 'medium',\n currentStep,\n className = '',\n stepClassName = '',\n showProgress = false,\n progressText,\n responsive = true,\n}: StepperProps) => {\n const sizeClasses = SIZE_CLASSES[size];\n\n // Calculate steps with states if currentStep is provided\n const steps =\n currentStep !== undefined\n ? calculateStepStates(initialSteps, currentStep)\n : initialSteps;\n\n return (\n <fieldset\n className={cn(\n 'flex flex-col gap-4 sm:gap-5 md:gap-6',\n className,\n 'border-0 p-0 m-0'\n )}\n >\n <legend className=\"absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0\">\n Stepper de formulário\n </legend>\n {/* Progress indicator with responsive text */}\n {showProgress && currentStep !== undefined && (\n <Text\n size=\"sm\"\n weight=\"medium\"\n className=\"text-text-600 text-center sm:text-left text-xs sm:text-sm\"\n >\n {getProgressText(currentStep, steps.length, progressText)}\n </Text>\n )}\n\n {/* Stepper container - Fully responsive for all devices with horizontal scroll only */}\n <div\n className={cn(\n 'flex items-center',\n sizeClasses.container,\n responsive\n ? 'flex-row overflow-x-auto overflow-y-hidden scrollbar-hide justify-start sm:justify-center md:justify-center lg:justify-center'\n : 'flex-row justify-center',\n 'max-w-full min-w-0 gap-2 sm:gap-3 md:gap-4 lg:gap-4'\n )}\n role=\"tablist\"\n aria-label=\"Progress steps\"\n >\n {steps.map((step, index) => {\n const stateClasses = STATE_CLASSES[step.state];\n\n return (\n <Step\n key={step.id}\n step={step}\n index={index}\n size={size}\n sizeClasses={sizeClasses}\n stateClasses={stateClasses}\n isLast={index === steps.length - 1}\n className={stepClassName}\n />\n );\n })}\n </div>\n </fieldset>\n );\n};\n\nexport default Stepper;\n"],"mappings":"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","names":["jsx"]}