@styleless-ui/react/Breadcrumb/Breadcrumb.js

Completely unstyled, headless and accessible React UI components.

"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(e){for(var r,t=1,a=arguments.length;t<a;t++)for(var l in r=arguments[t])Object.prototype.hasOwnProperty.call(r,l)&&(e[l]=r[l]);return e},__assign.apply(this,arguments)},__createBinding=this&&this.__createBinding||(Object.create?function(e,r,t,a){void 0===a&&(a=t);var l=Object.getOwnPropertyDescriptor(r,t);l&&!("get"in l?!r.__esModule:l.writable||l.configurable)||(l={enumerable:!0,get:function(){return r[t]}}),Object.defineProperty(e,a,l)}:function(e,r,t,a){void 0===a&&(a=t),e[a]=r[t]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,r){Object.defineProperty(e,"default",{enumerable:!0,value:r})}:function(e,r){e.default=r}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var r={};if(null!=e)for(var t in e)"default"!==t&&Object.prototype.hasOwnProperty.call(e,t)&&__createBinding(r,e,t);return __setModuleDefault(r,e),r},__rest=this&&this.__rest||function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(a=Object.getOwnPropertySymbols(e);l<a.length;l++)r.indexOf(a[l])<0&&Object.prototype.propertyIsEnumerable.call(e,a[l])&&(t[a[l]]=e[a[l]])}return t},__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});var jsx_runtime_1=require("react/jsx-runtime"),React=__importStar(require("react")),utils_1=require("../utils"),Item_1=__importDefault(require("./Item")),Separator_1=__importDefault(require("./Separator/Separator")),slots_1=require("./slots"),getLabelInfo=function(e){var r={};if("string"==typeof e)r.visibleLabel=e;else if("screenReaderLabel"in e)r.srOnlyLabel=e.screenReaderLabel;else{if(!("labelledBy"in e))throw new Error(["[StylelessUI][Breadcrumb]: Invalid `label` property.","The `label` property must be either a `string` or in shape of `{ screenReaderLabel: string; } | { labelledBy: string; }`"].join("\n"));r.labelledBy=e.labelledBy}return r},BreadcrumbBase=function(e,r){var t=e.label,a=e.children,l=e.id,i=e.classes,n=__rest(e,["label","children","id","classes"]),s=(0,utils_1.useDeterministicId)(l,"styleless-ui__breadcrumb"),o=s?"".concat(s,"__label"):void 0,u=getLabelInfo(t),c=React.Children.map(a,(function(e){return React.isValidElement(e)?e.type!==Item_1.default&&e.type!==Separator_1.default?(console.error("[StylelessUI][Breadcrumb]: The Breadcrumb component only accepts <Breadcrumb.Item> and <Breadcrumb.Separator> as a children."),null):e:null}));return(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[u.visibleLabel&&(0,jsx_runtime_1.jsx)("span",__assign({id:o,"data-slot":slots_1.Label,className:null==i?void 0:i.label},{children:u.visibleLabel})),(0,jsx_runtime_1.jsx)("nav",__assign({},n,{id:s,ref:r,className:null==i?void 0:i.root,"data-slot":slots_1.Root,"aria-label":u.srOnlyLabel,"aria-labelledby":u.visibleLabel?o:u.labelledBy},{children:(0,jsx_runtime_1.jsx)("ol",__assign({ref:function(e){if(e){var r=Array.from(e.children),t=r[r.length-1];if((null==t?void 0:t.firstElementChild)&&"A"===t.firstElementChild.tagName){if(t.firstElementChild.hasAttribute("aria-current"))return;console.warn(["[StylelessUI][Breadcrumb]: The aria attribute `aria-current` is missing from the last <BreadcrumbItem>'s anchor element.","For more information check out: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current"].join("\n"))}}},tabIndex:-1,className:null==i?void 0:i.list,"data-slot":slots_1.List},{children:c}))}))]})},Breadcrumb=(0,utils_1.componentWithForwardedRef)(BreadcrumbBase);exports.default=Breadcrumb;