@numl-react/navigation-bar/dist/index.cjs.js

The navigationbar component is used to display the primary navigation in the sidebar. Navigation Bar includes a list of links that wants to move between page.

"use strict";var e=Object.defineProperty,t=Object.prototype.hasOwnProperty,l=Object.getOwnPropertySymbols,n=Object.prototype.propertyIsEnumerable,r=(t,l,n)=>l in t?e(t,l,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[l]=n,a=(e,a)=>{for(var o in a||(a={}))t.call(a,o)&&r(e,o,a[o]);if(l)for(var o of l(a))n.call(a,o)&&r(e,o,a[o]);return e},o=(e,r)=>{var a={};for(var o in e)t.call(e,o)&&r.indexOf(o)<0&&(a[o]=e[o]);if(null!=e&&l)for(var o of l(e))r.indexOf(o)<0&&n.call(e,o)&&(a[o]=e[o]);return a};Object.defineProperty(exports,"__esModule",{value:!0}),exports[Symbol.toStringTag]="Module";var c=require("@numl-react/elements"),u=require("react"),i=require("@numl-react/core");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function d(e){if(e&&e.__esModule)return e;var t={__proto__:null,[Symbol.toStringTag]:"Module"};return e&&Object.keys(e).forEach((function(l){if("default"!==l){var n=Object.getOwnPropertyDescriptor(e,l);Object.defineProperty(t,l,n.get?n:{enumerable:!0,get:function(){return e[l]}})}})),t.default=e,Object.freeze(t)}var m=d(c),s=f(u);function p(e){const{children:t,fill:l="bg"}=e,n=o(e,["children","fill"]);return s.default.createElement(i.El.Menu,a({width:"min 15",fill:l},n),t)}function b(e){const{height:t="100%",children:l,footer:n}=e;return s.default.createElement(p,{flex:!0,height:t,flow:"column",content:"space-between",width:"min 256px"},s.default.createElement(m.Block,{overflow:"auto"},s.default.createElement(m.Grid,{content:"space-between stretch",xl:"1fr",lg:"1fr",md:"1fr",sm:"1fr",xs:"1fr"},l)),s.default.createElement(m.Footer,null,s.default.createElement(m.Block,{border:"top"},s.default.Children.toArray(n))))}p.Item=function(e){const t=u.useRef(),{children:l,fill:n="bg",icon:r,onClick:c}=e,f=o(e,["children","fill","icon","onClick"]);return u.useEffect((()=>{t.current&&c&&t.current.addEventListener("click",(e=>c(e)))}),[]),s.default.createElement(i.El.Menuitem,a({ref:t,fill:n},f),r?s.default.createElement(s.default.Fragment,null,r&&"string"==typeof r?s.default.createElement(i.El.Icon,{name:r}):r):null,l)},b.Item=e=>{const{label:t,icon:l,children:n,dropdown:r=!1}=e,c=o(e,["label","icon","children","dropdown"]);return s.default.createElement(m.Menuitem,a({gap:"2x",flex:!0,width:"100%",content:"space-between"},c),s.default.createElement(m.Flex,{gap:"2x"},l&&"string"==typeof l?s.default.createElement(m.Icon,{name:l}):l,s.default.createElement(m.BaseElement,null,t||n)),r||1==r?s.default.createElement(m.DropdownIcon,{theme:"default"}):null)};const E=function({item:e}){const[t,l]=s.default.useState(!0);return s.default.useEffect((()=>{}),[t]),s.default.createElement(s.default.Fragment,null,s.default.createElement(b.Item,{icon:e.icon,label:e.label,to:e.to,beforeClick:()=>(l(!t),e.beforeClick),dropdown:!!e.subNavigationItems,onClick:e.onClick}),e.subNavigationItems?s.default.createElement(m.Block,{padding:"left 2.5rem",hide:t?"y":"n"},s.default.Children.toArray(e.subNavigationItems.length>0&&e.subNavigationItems.map((e=>{const{icon:t}=e,l=o(e,["icon"]);return s.default.createElement(E,{item:l})})))):null)};b.Section=function({items:e,title:t=null}){return s.default.createElement(s.default.Fragment,null,t?s.default.createElement(m.BaseElement,{padding:"top 2x"},s.default.createElement(m.Label,{padding:"1x"},t)):null,s.default.Children.toArray(e&&e.map((e=>s.default.createElement(s.default.Fragment,null,s.default.createElement(E,{item:e}))))))},b.displayName="NavigationBar",exports.NavigationBar=b;