{"version":3,"sources":["../src/components/Chips/Chips.tsx"],"sourcesContent":["import { ButtonHTMLAttributes, ReactNode } from 'react';\nimport { CheckIcon } from '@phosphor-icons/react/dist/csr/Check';\nimport { cn } from '../../utils/utils';\n\n/**\n * Lookup table for chip state classes\n */\nconst STATE_CLASSES = {\n  default:\n    'bg-background text-text-950 border border-border-100 hover:bg-secondary-50 hover:border-border-300',\n  selected:\n    'bg-info-background text-primary-950 border-2 border-primary-950 hover:bg-secondary-50 focus-visible:border-0',\n} as const;\n\n/**\n * Chips component props interface\n */\ntype ChipsProps = {\n  /** Content to be displayed inside the chip */\n  children: ReactNode;\n  /** Se o chip está selecionado (mostra check automaticamente) */\n  selected?: boolean;\n\n  /** Additional CSS classes to apply */\n  className?: string;\n} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;\n\n/**\n * Chips component for Analytica Ensino platforms\n *\n * Um componente de chip seguindo exatamente o design do Figma.\n * Suporte a dois estados principais: default (sem ícone) e selected (com ícone de check).\n * Quando selecionado, automaticamente mostra o ícone de check.\n *\n * @param children - O conteúdo a ser exibido dentro do chip\n * @param selected - Se o chip está selecionado (mostra check automaticamente)\n * @param className - Classes CSS adicionais\n * @param props - Todos os outros atributos padrão de button HTML\n * @returns Um elemento de chip estilizado\n *\n * @example\n * ```tsx\n * <Chips onClick={() => console.log('clicked')}>\n *   Label\n * </Chips>\n *\n * <Chips selected onClick={() => console.log('selected')}>\n *   Selected Label\n * </Chips>\n * ```\n */\nconst Chips = ({\n  children,\n  selected = false,\n  className = '',\n  disabled,\n  type = 'button',\n  ...props\n}: ChipsProps) => {\n  // Get classes from lookup tables\n  const stateClasses = selected\n    ? STATE_CLASSES.selected\n    : STATE_CLASSES.default;\n\n  const baseClasses =\n    'inline-flex items-center justify-center rounded-full cursor-pointer font-normal text-sm px-4 py-2 gap-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-primary-600 disabled:opacity-40 disabled:cursor-not-allowed';\n\n  return (\n    <button\n      className={cn(baseClasses, stateClasses, className)}\n      disabled={disabled}\n      type={type}\n      {...props}\n    >\n      {selected && (\n        <span className={`flex items-center`}>\n          <CheckIcon weight=\"bold\" size={16} />\n        </span>\n      )}\n\n      <span className=\"flex-1\">{children}</span>\n    </button>\n  );\n};\n\nexport default Chips;\n"],"mappings":";;;;;AACA,SAAS,iBAAiB;AAmEtB,SAQM,KARN;AA7DJ,IAAM,gBAAgB;AAAA,EACpB,SACE;AAAA,EACF,UACE;AACJ;AAuCA,IAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAkB;AAEhB,QAAM,eAAe,WACjB,cAAc,WACd,cAAc;AAElB,QAAM,cACJ;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,aAAa,cAAc,SAAS;AAAA,MAClD;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,oBACC,oBAAC,UAAK,WAAW,qBACf,8BAAC,aAAU,QAAO,QAAO,MAAM,IAAI,GACrC;AAAA,QAGF,oBAAC,UAAK,WAAU,UAAU,UAAS;AAAA;AAAA;AAAA,EACrC;AAEJ;AAEA,IAAO,gBAAQ;","names":[]}