analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
1 lines • 5.32 kB
Source Map (JSON)
{"version":3,"sources":["../src/components/shared/RankingShared.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode } from 'react';\nimport { TrophyIcon } from '@phosphor-icons/react/dist/csr/Trophy';\nimport { WarningIcon } from '@phosphor-icons/react/dist/csr/Warning';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Shared ranking variant type\n */\nexport type RankingVariant = 'highlight' | 'attention';\n\n/**\n * Card background colors by position (1 = most intense, 3+ = lightest)\n */\nexport const CARD_BACKGROUND_CLASSES = {\n highlight: {\n 1: 'bg-success-200',\n 2: 'bg-success-100',\n 3: 'bg-success-background',\n },\n attention: {\n 1: 'bg-error-200',\n 2: 'bg-error-100',\n 3: 'bg-error-background',\n },\n} as const;\n\n/**\n * Position badge background colors\n */\nexport const BADGE_BACKGROUND_CLASSES = {\n highlight: 'bg-indicator-positive',\n attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Percentage badge background colors\n */\nexport const PERCENTAGE_BADGE_CLASSES = {\n highlight: 'bg-success-700',\n attention: 'bg-indicator-negative',\n} as const;\n\n/** Header icon badge uses the same palette as position badges */\nexport const HEADER_BADGE_CLASSES = BADGE_BACKGROUND_CLASSES;\n\n/**\n * Get background class based on position (1, 2, or 3+)\n */\nexport const getPositionBackgroundClass = (\n variant: RankingVariant,\n position: number\n): string => {\n const positionKey = Math.max(1, Math.min(position, 3)) as 1 | 2 | 3;\n return CARD_BACKGROUND_CLASSES[variant][positionKey];\n};\n\n/**\n * Generic ranking card wrapper — renders a header (title + icon badge)\n * followed by a list of items using the provided render function.\n */\nexport interface BaseRankingCardProps<\n T,\n> extends HTMLAttributes<HTMLDivElement> {\n title: string;\n variant: RankingVariant;\n items: T[];\n renderItem: (item: T, variant: RankingVariant, index: number) => ReactNode;\n /** Override the default header icon (Trophy/Warning) */\n headerIcon?: ReactNode;\n}\n\nexport function BaseRankingCard<T>({\n title,\n variant,\n items,\n renderItem,\n headerIcon,\n className,\n ...props\n}: Readonly<BaseRankingCardProps<T>>) {\n const DefaultIcon = variant === 'highlight' ? TrophyIcon : WarningIcon;\n\n return (\n <div\n className={cn(\n 'flex flex-col flex-1 min-h-[254px] p-5 gap-4 bg-background border border-border-50 rounded-xl',\n className\n )}\n {...props}\n >\n {/* Header */}\n <div className=\"flex flex-row justify-between items-center h-6 gap-4\">\n <Text\n as=\"h3\"\n size=\"lg\"\n weight=\"bold\"\n className=\"text-text-950 tracking-[0.2px]\"\n >\n {title}\n </Text>\n\n <span\n className={cn(\n 'w-6 h-6 rounded-full flex items-center justify-center',\n HEADER_BADGE_CLASSES[variant]\n )}\n >\n {headerIcon ?? (\n <DefaultIcon\n size={14}\n weight=\"fill\"\n className={\n variant === 'highlight' ? 'text-text-950' : 'text-text'\n }\n />\n )}\n </span>\n </div>\n\n {/* Items list */}\n <div className=\"flex flex-col gap-2\">\n {items.map((item, index) => renderItem(item, variant, index))}\n </div>\n </div>\n );\n}\n\n/**\n * Two-card side-by-side responsive layout for ranking components\n */\nexport interface RankingLayoutProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\nexport function RankingLayout({\n children,\n className,\n ...props\n}: Readonly<RankingLayoutProps>) {\n return (\n <div\n className={cn('grid grid-cols-1 sm:grid-cols-2 w-full gap-4', className)}\n {...props}\n >\n {children}\n </div>\n );\n}\n"],"mappings":";;;;;;;;AACA,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AA0FtB,SACE,KADF;AA9EC,IAAM,0BAA0B;AAAA,EACrC,WAAW;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AAAA,EACA,WAAW;AAAA,IACT,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACL;AACF;AAKO,IAAM,2BAA2B;AAAA,EACtC,WAAW;AAAA,EACX,WAAW;AACb;AAKO,IAAM,2BAA2B;AAAA,EACtC,WAAW;AAAA,EACX,WAAW;AACb;AAGO,IAAM,uBAAuB;AAK7B,IAAM,6BAA6B,CACxC,SACA,aACW;AACX,QAAM,cAAc,KAAK,IAAI,GAAG,KAAK,IAAI,UAAU,CAAC,CAAC;AACrD,SAAO,wBAAwB,OAAO,EAAE,WAAW;AACrD;AAiBO,SAAS,gBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAsC;AACpC,QAAM,cAAc,YAAY,cAAc,aAAa;AAE3D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAGJ;AAAA,6BAAC,SAAI,WAAU,wDACb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,IAAG;AAAA,cACH,MAAK;AAAA,cACL,QAAO;AAAA,cACP,WAAU;AAAA,cAET;AAAA;AAAA,UACH;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA,qBAAqB,OAAO;AAAA,cAC9B;AAAA,cAEC,wBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAM;AAAA,kBACN,QAAO;AAAA,kBACP,WACE,YAAY,cAAc,kBAAkB;AAAA;AAAA,cAEhD;AAAA;AAAA,UAEJ;AAAA,WACF;AAAA,QAGA,oBAAC,SAAI,WAAU,uBACZ,gBAAM,IAAI,CAAC,MAAM,UAAU,WAAW,MAAM,SAAS,KAAK,CAAC,GAC9D;AAAA;AAAA;AAAA,EACF;AAEJ;AASO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiC;AAC/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,gDAAgD,SAAS;AAAA,MACtE,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":[]}