retro-react/dist/cjs/components/breadcrumbs/Breadcrumbs.js

A React component library for building retro-style websites

"use strict";var e=require("../../_virtual/_tslib.js"),r=require("react"),a=require("../../node_modules/@theme-ui/core/jsx-runtime/dist/theme-ui-core-jsx-runtime.esm.js"),t=require("../../utils/classNames.js"),i=require("../../constants/commonClassNames.js"),s=require("./Breadcrumbs.styled.js");const c=r.forwardRef(((c,n)=>{var{id:d,className:o,children:l,items:u=[],maxItems:b,separator:m="arrow",showCopyButton:h=!1,onCopy:p,sx:v}=c,j=e.__rest(c,["id","className","children","items","maxItems","separator","showCopyButton","onCopy","sx"]);const x=e=>r=>{e.disabled?r.preventDefault():(e.href&&""!==e.href||r.preventDefault(),e.onClick&&e.onClick(r))},g=e=>r=>{e.disabled||"Enter"!==r.key&&" "!==r.key||(r.preventDefault(),e.onClick?e.onClick(r):e.href&&(window.location.href=e.href))},f=(()=>{if(!b||u.length<=b)return u;return[u[0],{text:"...",disabled:!0},...u.slice(-(b-2))]})(),y=e=>{switch(e){case"arrow":default:return">";case"backslash":return"\\";case"dot":return"•";case"pipe":return"|"}};return a.jsxs(s.BreadcrumbsWrapper,Object.assign({ref:n,id:d,className:t.classNames("breadcrumbs-root",o,i.default),role:"navigation","aria-label":"Breadcrumb navigation"},j,{children:[f.map(((e,t)=>a.jsxs(r.Fragment,{children:[a.jsx(s.Breadcrumb,Object.assign({$active:e.active,$disabled:e.disabled,className:"breadcrumb",role:"listitem"},{children:"..."===e.text?a.jsx(s.TruncationIndicator,Object.assign({title:u.length-b+1+" items hidden","aria-label":u.length-b+1+" items hidden"},{children:"..."}),void 0):e.active?a.jsxs(s.BreadcrumbActive,Object.assign({className:"breadcrumb-active","aria-current":"page"},{children:[e.icon&&a.jsx(s.BreadcrumbIcon,{children:e.icon},void 0),e.text||""]}),void 0):a.jsxs(s.BreadcrumbAnchor,Object.assign({href:e.href,$disabled:e.disabled,onClick:x(e),onKeyDown:g(e),className:"breadcrumb-anchor",tabIndex:e.disabled?-1:0,"aria-label":`Navigate to ${e.text}`},{children:[e.icon&&a.jsx(s.BreadcrumbIcon,{children:e.icon},void 0),e.text||""]}),void 0)}),void 0),t<f.length-1&&a.jsx(s.BreadcrumbSeparator,Object.assign({$type:m,"aria-hidden":"true"},{children:y(m)}),void 0)]},t))),h&&a.jsx(s.CopyButton,Object.assign({onClick:()=>{var e;const r=u.map((e=>e.text)).join(" > ");null===(e=navigator.clipboard)||void 0===e||e.writeText(r).then((()=>{p&&p(r)}))},title:"Copy path to clipboard","aria-label":"Copy breadcrumb path to clipboard",type:"button"},{children:"📋"}),void 0)]}),void 0)}));c.displayName="Breadcrumbs",exports.Breadcrumbs=c;