analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
1 lines • 4.15 kB
Source Map (JSON)
{"version":3,"sources":["../src/components/Alert/Alert.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\nimport { CheckCircleIcon } from '@phosphor-icons/react/dist/csr/CheckCircle';\nimport { InfoIcon } from '@phosphor-icons/react/dist/csr/Info';\nimport { WarningCircleIcon } from '@phosphor-icons/react/dist/csr/WarningCircle';\nimport { XCircleIcon } from '@phosphor-icons/react/dist/csr/XCircle';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\ntype AlertProps = {\n title?: string;\n description: string;\n variant?: 'solid' | 'outline';\n action?: 'default' | 'info' | 'success' | 'warning' | 'error';\n className?: string;\n} & HTMLAttributes<HTMLDivElement>;\n\nconst VARIANT_ACTION_CLASSES = {\n solid: {\n default: 'bg-background-50 border-transparent',\n info: 'bg-info border-transparent',\n success: 'bg-success border-transparent',\n warning: 'bg-warning border-transparent',\n error: 'bg-error border-transparent',\n },\n outline: {\n default: 'bg-background border border-border-100',\n info: 'bg-background border border-border-100',\n success: 'bg-background border border-border-100',\n warning: 'bg-background border border-border-100',\n error: 'bg-background border border-border-100',\n },\n} as const;\n\nconst COLOR_CLASSES = {\n default: 'text-text-950',\n info: 'text-info-800',\n success: 'text-success-800',\n warning: 'text-warning-800',\n error: 'text-error-800',\n} as const;\n\nconst ICONS = {\n default: <CheckCircleIcon size={18} />,\n info: <InfoIcon size={18} />,\n success: <CheckCircleIcon size={18} />,\n warning: <WarningCircleIcon size={18} />,\n error: <XCircleIcon size={18} />,\n} as const;\n\nconst Alert = ({\n variant = 'solid',\n title,\n description,\n action = 'default',\n className,\n ...props\n}: AlertProps) => {\n const baseClasses =\n 'alert-wrapper flex items-start gap-2 w-[384px] py-3 px-4 font-inherit rounded-md';\n const variantClasses = VARIANT_ACTION_CLASSES[variant][action];\n const variantColor = COLOR_CLASSES[action];\n const variantIcon = ICONS[action];\n const hasHeading = Boolean(title);\n\n return (\n <div className={cn(baseClasses, variantClasses, className)} {...props}>\n <span className={cn('mt-0.5', variantColor)}>{variantIcon}</span>\n <div>\n {hasHeading && (\n <Text\n size=\"md\"\n weight=\"medium\"\n color={variantColor}\n className=\"mb-0.5\"\n >\n {title}\n </Text>\n )}\n <Text\n size={hasHeading ? 'sm' : 'md'}\n weight=\"normal\"\n color={!hasHeading ? variantColor : 'text-text-700'}\n >\n {description}\n </Text>\n </div>\n </div>\n );\n};\n\nexport default Alert;\n"],"mappings":";;;;;;;;AACA,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAsCjB,cAyBL,YAzBK;AA1BX,IAAM,yBAAyB;AAAA,EAC7B,OAAO;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,EACT;AACF;AAEA,IAAM,gBAAgB;AAAA,EACpB,SAAS;AAAA,EACT,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;AAEA,IAAM,QAAQ;AAAA,EACZ,SAAS,oBAAC,mBAAgB,MAAM,IAAI;AAAA,EACpC,MAAM,oBAAC,YAAS,MAAM,IAAI;AAAA,EAC1B,SAAS,oBAAC,mBAAgB,MAAM,IAAI;AAAA,EACpC,SAAS,oBAAC,qBAAkB,MAAM,IAAI;AAAA,EACtC,OAAO,oBAAC,eAAY,MAAM,IAAI;AAChC;AAEA,IAAM,QAAQ,CAAC;AAAA,EACb,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAkB;AAChB,QAAM,cACJ;AACF,QAAM,iBAAiB,uBAAuB,OAAO,EAAE,MAAM;AAC7D,QAAM,eAAe,cAAc,MAAM;AACzC,QAAM,cAAc,MAAM,MAAM;AAChC,QAAM,aAAa,QAAQ,KAAK;AAEhC,SACE,qBAAC,SAAI,WAAW,GAAG,aAAa,gBAAgB,SAAS,GAAI,GAAG,OAC9D;AAAA,wBAAC,UAAK,WAAW,GAAG,UAAU,YAAY,GAAI,uBAAY;AAAA,IAC1D,qBAAC,SACE;AAAA,oBACC;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,OAAO;AAAA,UACP,WAAU;AAAA,UAET;AAAA;AAAA,MACH;AAAA,MAEF;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,aAAa,OAAO;AAAA,UAC1B,QAAO;AAAA,UACP,OAAO,CAAC,aAAa,eAAe;AAAA,UAEnC;AAAA;AAAA,MACH;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,IAAO,gBAAQ;","names":[]}