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

helpwave's component and theming library

{"version":3,"sources":["../../src/components/BreadCrumb.tsx"],"sourcesContent":["import Link from 'next/link'\nimport clsx from 'clsx'\n\nexport type Crumb = {\n  display: string,\n  link: string,\n}\n\ntype BreadCrumbProps = {\n  crumbs: Crumb[],\n  linkClassName?: string,\n  containerClassName?: string,\n}\n\n/**\n * A component for showing a hierarchical link structure with an independent link on each element\n *\n * e.g. Organizations/Ward/<id>\n */\nexport const BreadCrumb = ({ crumbs, linkClassName, containerClassName }: BreadCrumbProps) => {\n  const color = 'text-description'\n\n  return (\n    <div className={clsx('row', containerClassName)}>\n      {crumbs.map((crumb, index) => (\n        <div key={index}>\n          <Link href={crumb.link} className={clsx(linkClassName, { [`${color} hover:brightness-60`]: index !== crumbs.length - 1 })}>\n            {crumb.display}\n          </Link>\n          {index !== crumbs.length - 1 && <span className={clsx(`px-1`, color)}>/</span>}\n        </div>\n      ))}\n    </div>\n  )\n}\n"],"mappings":";AAAA,OAAO,UAAU;AACjB,OAAO,UAAU;AAwBT,SACE,KADF;AAND,IAAM,aAAa,CAAC,EAAE,QAAQ,eAAe,mBAAmB,MAAuB;AAC5F,QAAM,QAAQ;AAEd,SACE,oBAAC,SAAI,WAAW,KAAK,OAAO,kBAAkB,GAC3C,iBAAO,IAAI,CAAC,OAAO,UAClB,qBAAC,SACC;AAAA,wBAAC,QAAK,MAAM,MAAM,MAAM,WAAW,KAAK,eAAe,EAAE,CAAC,GAAG,KAAK,sBAAsB,GAAG,UAAU,OAAO,SAAS,EAAE,CAAC,GACrH,gBAAM,SACT;AAAA,IACC,UAAU,OAAO,SAAS,KAAK,oBAAC,UAAK,WAAW,KAAK,QAAQ,KAAK,GAAG,eAAC;AAAA,OAJ/D,KAKV,CACD,GACH;AAEJ;","names":[]}