UNPKG

analytica-frontend-lib

Version:

Repositório público dos componentes utilizados nas plataformas da Analytica Ensino

1 lines 2.81 kB
{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/IconRoundedButton/IconRoundedButton.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","import { ButtonHTMLAttributes, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * IconRoundedButton component props interface\n */\ntype IconRoundedButtonProps = {\n /** Ícone a ser exibido no botão */\n icon: ReactNode;\n /** Additional CSS classes to apply */\n className?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * IconRoundedButton component for Analytica Ensino platforms\n *\n * Um botão redondo simples que exibe apenas um ícone.\n * Ideal para ações como navegação, fechar, editar, etc.\n *\n * @param icon - O ícone a ser exibido no botão\n * @param className - Classes CSS adicionais\n * @param props - Todos os outros atributos HTML padrão de button\n * @returns Um elemento button estilizado e redondo\n *\n * @example\n * ```tsx\n * <IconRoundedButton\n * icon={<ChevronRightIcon />}\n * onClick={() => console.log('clicked')}\n * />\n * ```\n */\nconst IconRoundedButton = ({\n icon,\n className = '',\n disabled,\n ...props\n}: IconRoundedButtonProps) => {\n const baseClasses = [\n 'inline-flex',\n 'items-center',\n 'justify-center',\n 'w-8',\n 'h-8',\n 'rounded-full',\n 'cursor-pointer',\n 'border',\n 'border-background-200',\n 'bg-background',\n 'text-text-950',\n 'hover:shadow-hard-shadow-1',\n 'focus-visible:outline-none',\n 'focus-visible:shadow-hard-shadow-1',\n 'focus-visible:ring-2',\n 'focus-visible:ring-indicator-info',\n 'focus-visible:ring-offset-0',\n 'disabled:opacity-50',\n 'disabled:cursor-not-allowed',\n ].join(' ');\n\n return (\n <button\n type=\"button\"\n className={cn(baseClasses, className)}\n disabled={disabled}\n {...props}\n >\n <span className=\"flex items-center justify-center w-5 h-5\">{icon}</span>\n </button>\n );\n};\n\nexport default IconRoundedButton;\n"],"mappings":";AAAA,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;AC8DM;AAnCN,IAAM,oBAAoB,CAAC;AAAA,EACzB;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA,GAAG;AACL,MAA8B;AAC5B,QAAM,cAAc;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,EAAE,KAAK,GAAG;AAEV,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW,GAAG,aAAa,SAAS;AAAA,MACpC;AAAA,MACC,GAAG;AAAA,MAEJ,8BAAC,UAAK,WAAU,4CAA4C,gBAAK;AAAA;AAAA,EACnE;AAEJ;AAEA,IAAO,4BAAQ;","names":[]}