analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
1 lines • 1.55 kB
Source Map (JSON)
{"version":3,"sources":["../src/components/shared/MetricBox.tsx"],"sourcesContent":["import { cn } from '../../utils/utils';\nimport Text from '../Text/Text';\nimport Badge from '../Badge/Badge';\n\ninterface MetricBoxProps {\n label: string;\n value: string | number;\n className?: string;\n}\n\n/**\n * Compact metric display: uppercase label + info badge value.\n * Use `className` to control flex growth, padding overrides, etc.\n *\n * @example\n * // Side-by-side layout (each box grows equally)\n * <div className=\"flex gap-3\">\n * <MetricBox className=\"flex-1\" label=\"Atividades realizadas\" value={10} />\n * <MetricBox className=\"flex-1\" label=\"Total de questões\" value={80} />\n * </div>\n */\nexport const MetricBox = ({ label, value, className }: MetricBoxProps) => (\n <div\n className={cn(\n 'flex flex-col items-center justify-center gap-2 px-4 py-3 rounded-xl border border-border-50 bg-background',\n className\n )}\n >\n <Text\n size=\"2xs\"\n weight=\"medium\"\n className=\"text-text-600 uppercase text-center tracking-wide\"\n >\n {label}\n </Text>\n <Badge size=\"large\" action=\"info\">\n {value}\n </Badge>\n </div>\n);\n"],"mappings":";;;;;;;;;;;AAsBE,SAME,KANF;AADK,IAAM,YAAY,CAAC,EAAE,OAAO,OAAO,UAAU,MAClD;AAAA,EAAC;AAAA;AAAA,IACC,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IAEA;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,WAAU;AAAA,UAET;AAAA;AAAA,MACH;AAAA,MACA,oBAAC,iBAAM,MAAK,SAAQ,QAAO,QACxB,iBACH;AAAA;AAAA;AACF;","names":[]}