analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
1 lines • 6.18 kB
Source Map (JSON)
{"version":3,"sources":["../src/components/Accordation/Accordation.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n KeyboardEvent,\n ReactNode,\n useId,\n useState,\n useEffect,\n} from 'react';\nimport { CardBase } from '../Card/Card';\nimport { CaretRightIcon } from '@phosphor-icons/react/dist/csr/CaretRight';\nimport { cn } from '../../utils/utils';\n\ninterface CardAccordationProps extends HTMLAttributes<HTMLDivElement> {\n trigger: ReactNode;\n children: ReactNode;\n defaultExpanded?: boolean;\n expanded?: boolean;\n onToggleExpanded?: (isExpanded: boolean) => void;\n value?: string;\n disabled?: boolean;\n /** Additional class for the trigger button */\n triggerClassName?: string;\n /** Additional class for the content wrapper */\n contentClassName?: string;\n}\n\nconst CardAccordation = forwardRef<HTMLDivElement, CardAccordationProps>(\n (\n {\n trigger,\n children,\n className,\n defaultExpanded = false,\n expanded: controlledExpanded,\n onToggleExpanded,\n value,\n disabled = false,\n triggerClassName,\n contentClassName,\n ...props\n },\n ref\n ) => {\n const [internalExpanded, setInternalExpanded] = useState(defaultExpanded);\n const generatedId = useId();\n\n // Use value as ID base for better semantics, fallback to generated ID\n const contentId = value ? `accordion-content-${value}` : generatedId;\n const headerId = value\n ? `accordion-header-${value}`\n : `${generatedId}-header`;\n\n // Determine if component is controlled\n const isControlled = controlledExpanded !== undefined;\n const isExpanded = isControlled ? controlledExpanded : internalExpanded;\n\n // Sync internal state when controlled value changes\n useEffect(() => {\n if (isControlled) {\n setInternalExpanded(controlledExpanded);\n }\n }, [isControlled, controlledExpanded]);\n\n const handleToggle = () => {\n if (disabled) return;\n\n const newExpanded = !isExpanded;\n\n if (!isControlled) {\n setInternalExpanded(newExpanded);\n }\n\n onToggleExpanded?.(newExpanded);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return;\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n handleToggle();\n }\n };\n\n return (\n <CardBase\n ref={ref}\n layout=\"vertical\"\n padding=\"none\"\n minHeight=\"none\"\n className={cn('overflow-hidden', className)}\n {...props}\n >\n {/* Clickable header */}\n <button\n id={headerId}\n type=\"button\"\n onClick={handleToggle}\n onKeyDown={handleKeyDown}\n disabled={disabled}\n className={cn(\n 'w-full cursor-pointer not-aria-expanded:rounded-xl aria-expanded:rounded-t-xl flex items-center justify-between gap-3 text-left transition-colors duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-950 focus-visible:ring-inset pl-2 pr-10',\n disabled && 'cursor-not-allowed text-text-400',\n triggerClassName\n )}\n aria-expanded={isExpanded}\n aria-controls={contentId}\n aria-disabled={disabled}\n data-value={value}\n >\n {trigger}\n\n <CaretRightIcon\n size={20}\n className={cn(\n 'transition-transform duration-200 flex-shrink-0',\n disabled ? 'text-gray-400' : 'text-text-700',\n isExpanded ? 'rotate-90' : 'rotate-0'\n )}\n data-testid=\"accordion-caret\"\n />\n </button>\n\n {/* Expandable content */}\n <section\n id={contentId}\n aria-labelledby={headerId}\n aria-hidden={!isExpanded}\n className={cn(\n 'transition-all duration-300 ease-in-out overflow-hidden',\n isExpanded ? 'opacity-100' : 'max-h-0 opacity-0'\n )}\n data-testid=\"accordion-content\"\n data-value={value}\n >\n <div className={cn('p-4 pt-0', contentClassName)}>{children}</div>\n </section>\n </CardBase>\n );\n }\n);\n\nCardAccordation.displayName = 'CardAccordation';\n\nexport { CardAccordation };\nexport type { CardAccordationProps };\n"],"mappings":";;;;;;;;AAAA;AAAA,EACE;AAAA,EAIA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,sBAAsB;AAqFvB,SAkBE,KAlBF;AApER,IAAM,kBAAkB;AAAA,EACtB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,eAAe;AACxE,UAAM,cAAc,MAAM;AAG1B,UAAM,YAAY,QAAQ,qBAAqB,KAAK,KAAK;AACzD,UAAM,WAAW,QACb,oBAAoB,KAAK,KACzB,GAAG,WAAW;AAGlB,UAAM,eAAe,uBAAuB;AAC5C,UAAM,aAAa,eAAe,qBAAqB;AAGvD,cAAU,MAAM;AACd,UAAI,cAAc;AAChB,4BAAoB,kBAAkB;AAAA,MACxC;AAAA,IACF,GAAG,CAAC,cAAc,kBAAkB,CAAC;AAErC,UAAM,eAAe,MAAM;AACzB,UAAI,SAAU;AAEd,YAAM,cAAc,CAAC;AAErB,UAAI,CAAC,cAAc;AACjB,4BAAoB,WAAW;AAAA,MACjC;AAEA,yBAAmB,WAAW;AAAA,IAChC;AAEA,UAAM,gBAAgB,CAAC,UAA4C;AACjE,UAAI,SAAU;AAEd,UAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;AAC9C,cAAM,eAAe;AACrB,qBAAa;AAAA,MACf;AAAA,IACF;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,QAAO;AAAA,QACP,SAAQ;AAAA,QACR,WAAU;AAAA,QACV,WAAW,GAAG,mBAAmB,SAAS;AAAA,QACzC,GAAG;AAAA,QAGJ;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,SAAS;AAAA,cACT,WAAW;AAAA,cACX;AAAA,cACA,WAAW;AAAA,gBACT;AAAA,gBACA,YAAY;AAAA,gBACZ;AAAA,cACF;AAAA,cACA,iBAAe;AAAA,cACf,iBAAe;AAAA,cACf,iBAAe;AAAA,cACf,cAAY;AAAA,cAEX;AAAA;AAAA,gBAED;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAM;AAAA,oBACN,WAAW;AAAA,sBACT;AAAA,sBACA,WAAW,kBAAkB;AAAA,sBAC7B,aAAa,cAAc;AAAA,oBAC7B;AAAA,oBACA,eAAY;AAAA;AAAA,gBACd;AAAA;AAAA;AAAA,UACF;AAAA,UAGA;AAAA,YAAC;AAAA;AAAA,cACC,IAAI;AAAA,cACJ,mBAAiB;AAAA,cACjB,eAAa,CAAC;AAAA,cACd,WAAW;AAAA,gBACT;AAAA,gBACA,aAAa,gBAAgB;AAAA,cAC/B;AAAA,cACA,eAAY;AAAA,cACZ,cAAY;AAAA,cAEZ,8BAAC,SAAI,WAAW,GAAG,YAAY,gBAAgB,GAAI,UAAS;AAAA;AAAA,UAC9D;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,gBAAgB,cAAc;","names":[]}