@helpwave/hightide/dist/components/HideableContentSection.mjs.map

helpwave's component and theming library

{"version":3,"sources":["../../src/components/HideableContentSection.tsx"],"sourcesContent":["import { useState, type PropsWithChildren, type ReactNode } from 'react'\nimport { ChevronDown, ChevronUp } from 'lucide-react'\nimport clsx from 'clsx'\n\nexport type HideableContentSectionProps = PropsWithChildren & {\n  initiallyOpen?: boolean,\n  disabled: boolean,\n  header: ReactNode,\n}\n\n/**\n * A Component to hide and show\n */\nexport const HideableContentSection = ({\n  initiallyOpen = true,\n  disabled,\n  children,\n  header\n}: HideableContentSectionProps) => {\n  const [open, setOpen] = useState(initiallyOpen)\n  return (\n    <div className=\"col\">\n      <div\n        className={clsx('row justify-between items-center', { 'cursor-pointer': !disabled })}\n        onClick={() => {\n          if (!disabled) {\n            setOpen(!open)\n          }\n        }}\n      >\n        <div>\n          {header}\n        </div>\n        {!disabled && (open ? <ChevronUp/> : <ChevronDown/>)}\n      </div>\n      {open && (\n        <div>\n          {children}\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":";AAAA,SAAS,gBAAwD;AACjE,SAAS,aAAa,iBAAiB;AACvC,OAAO,UAAU;AAoBX,SAQE,KARF;AATC,IAAM,yBAAyB,CAAC;AAAA,EACrC,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AACF,MAAmC;AACjC,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,aAAa;AAC9C,SACE,qBAAC,SAAI,WAAU,OACb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,KAAK,oCAAoC,EAAE,kBAAkB,CAAC,SAAS,CAAC;AAAA,QACnF,SAAS,MAAM;AACb,cAAI,CAAC,UAAU;AACb,oBAAQ,CAAC,IAAI;AAAA,UACf;AAAA,QACF;AAAA,QAEA;AAAA,8BAAC,SACE,kBACH;AAAA,UACC,CAAC,aAAa,OAAO,oBAAC,aAAS,IAAK,oBAAC,eAAW;AAAA;AAAA;AAAA,IACnD;AAAA,IACC,QACC,oBAAC,SACE,UACH;AAAA,KAEJ;AAEJ;","names":[]}