xtreme-ui
Version:
Collection of reusable components that can be used in web projects
2 lines (1 loc) • 1.1 kB
JavaScript
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("react"),e=require("clsx"),q=require("../../base/Icon/Icon.cjs");;/* empty css */const d=c.forwardRef((f,h)=>{const{className:m,children:g,hrefPropName:N="href",routes:v=[],pathname:i="",as:x="a"}=f,[n,l]=c.useState("/"),j=e("xtrNavigation",m);return c.useEffect(()=>{n===i&&l("/")},[n,i]),s.jsxs("nav",{ref:h,className:j,role:"navigation",children:[s.jsx("div",{className:"brand",children:g}),s.jsx("div",{className:"routeList",children:v.map((a,p)=>s.jsxs(x,{className:e("route",(a==null?void 0:a.href)===n&&"loading",(a==null?void 0:a.href)===i&&"active"),[N]:a==null?void 0:a.href,onClick:()=>{setTimeout(()=>{n!==i&&l(a==null?void 0:a.href)},150)},children:[(a==null?void 0:a.icon)&&s.jsx(q.Icon,{code:a==null?void 0:a.icon,type:(a==null?void 0:a.href)===i?"duotone":"light"}),s.jsx("span",{className:"label",children:a==null?void 0:a.name})]},`route-${a==null?void 0:a.href}-${p}`))})]})});d.displayName="Navigation";exports.Navigation=d;