@tidy-ui/breadcrumb
Version:
The Breadcrumb is your trusty guide for tracking website navigation, providing a clear path of your current location. Easily navigate between hierarchies. Collapse lengthy breadcrumbs for a clean view, expand for full journey. Customize separators, set ca
2 lines (1 loc) • 4.16 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("@tidy-ui/commons");function t(e){return e&&e.__esModule?e:{default:e}}var r=/*#__PURE__*/t(e),o=function(){return o=Object.assign||function(e){for(var n,t=1,r=arguments.length;t<r;t++)for(var o in n=arguments[t])Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o]);return e},o.apply(this,arguments)};function a(e,n){var t={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&n.indexOf(r)<0&&(t[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)n.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(t[r[o]]=e[r[o]])}return t}function l(e,n){return Object.defineProperty?Object.defineProperty(e,"raw",{value:n}):e.raw=n,e}var i,u,c,s,d,f,p,m,g,y=n.css(u||(u=l(["\n ","\n"],["\n ","\n"])),function(e){var t=e.theme,r=t.font,o=t.palette,a=t.isDark;return n.css(i||(i=l(["\n font-weight: ",";\n text-decoration: none;\n cursor: auto;\n pointer-events: none;\n opacity: 0.6;\n color: ",";\n "],["\n font-weight: ",";\n text-decoration: none;\n cursor: auto;\n pointer-events: none;\n opacity: 0.6;\n color: ",";\n "])),r.medium,a?o.neutral[400]:o.neutral[800])}),b=n.css(s||(s=l(["\n cursor: pointer;\n text-decoration: none;\n background-image: linear-gradient(currentColor, currentColor);\n background-size: 0% 0.1em;\n background-position-y: 100%;\n background-position-x: 0%;\n background-repeat: no-repeat;\n transition: background-size 0.2s ease-in-out;\n &:hover,\n &:focus {\n background-size: 100% 0.1em;\n }\n ","\n"],["\n cursor: pointer;\n text-decoration: none;\n background-image: linear-gradient(currentColor, currentColor);\n background-size: 0% 0.1em;\n background-position-y: 100%;\n background-position-x: 0%;\n background-repeat: no-repeat;\n transition: background-size 0.2s ease-in-out;\n &:hover,\n &:focus {\n background-size: 100% 0.1em;\n }\n ","\n"])),function(e){var t=e.theme.font;return n.css(c||(c=l(["\n font-weight: ",";\n "],["\n font-weight: ",";\n "])),t.regular)}),v=n.styled.ol(d||(d=l(["\n display: flex;\n gap: 0.5rem;\n ","\n"],["\n display: flex;\n gap: 0.5rem;\n ","\n"])),n.applyStandardOverrideStyles),h=n.styled.a(p||(p=l(["\n ","\n ","\n"],["\n ","\n ","\n"])),function(e){var t=e.theme,r=t.palette,o=t.isDark,a=e.tone,i=e.isActive;return n.css(f||(f=l(["\n ","\n ","\n color: ",";\n "],["\n ","\n ","\n color: ",";\n "])),n.createFontStyle(),i?y:b,o?r[a][500]:r[a][700])},n.applyStandardOverrideStyles),k=n.styled.div(g||(g=l(["\n ","\n"],["\n ","\n"])),function(e){var t=e.theme.palette;return n.css(m||(m=l(["\n ","\n color: ",";\n "],["\n ","\n color: ",";\n "])),n.createFontStyle(),t.neutral[500])}),O=r.default.forwardRef(function(e,n){var t=e.children,l=e.ele,i=a(e,["children","ele"]);return r.default.createElement(h,o({ref:n,role:"link"},i),l?r.default.cloneElement(l,{},t):t)});O.defaultProps={isActive:!1,tone:"neutral"},O.displayName="BreadcrumbItem";var x=r.default.forwardRef(function(e,n){var t=e.children,l=e.limit,i=e.separator,u=e.onExpand,c=e.isLastItemNotActive,s=a(e,["children","limit","separator","onExpand","isLastItemNotActive"]),d=r.default.Children.toArray(t),f=r.default.useState(d.length<l),p=f[0],m=f[1],g=r.default.useCallback(function(){return["string","number"].includes(typeof i)?r.default.createElement(k,null,i):i},[i]),y=r.default.useCallback(function(e){return r.default.Children.map(e,function(n,t){var a,l=n;return[r.default.cloneElement(l,o(o({},l.props),t==e.length-1?{isActive:!c}:{tone:null!==(a=s.tone)&&void 0!==a?a:l.props.tone})),t<e.length-1?g():null]})},[t,l,i]),b=r.default.useCallback(function(e){m(!0),null==u||u(e)},[u]);return r.default.createElement(v,o({ref:n,role:"navigation"},s),y(p?d:[d[0],r.default.createElement(O,{key:1,onClick:b},"..."),d[d.length-1]]))});x.defaultProps={isLastItemNotActive:!1,limit:Number.MAX_SAFE_INTEGER,separator:"/"},x.displayName="Breadcrumb",exports.Breadcrumb=x,exports.BreadcrumbItem=O;