@yeonpm/react
Version:
A library that collects frequently used components and custom hooks in react projects
3 lines (2 loc) • 3 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("react"),t=require("../../common/Wrapper/index.js"),o=require("../../common/Txt/index.js"),r=require("../../../node_modules/yeonpm-modules/dist/esm/formatters/index.js");require("../../../node_modules/yeonpm-modules/dist/esm/node_modules/tslib/tslib.es6.js");var a=function(c){var s,l=c.config,u=c.depth,d=c.routePrefix,f=c.parentPath,h=c.router,m=c.pathname,x=n.useState(!1),p=x[0],j=x[1],g=l.children&&l.children.length>0,v=l.value.replace(/^\//,""),b=f?"".concat(f,"/").concat(v):"/".concat(v),w="".concat(d).concat(b)===m;return e.jsxs(t.default,{column:!0,children:[e.jsxs(t.default,{className:"navigation-item",h:50,onClick:function(){g?j(!p):h.push("".concat(d).concat(b))},mouseCss:!0,white:!0,flex:!0,w:"100%",children:[l.icon&&e.jsx(t.default,{className:"navigation-item-icon",pl:24,h:"100%",ac:!0,jc:!0,children:l.icon}),e.jsxs(t.default,{pl:20*u+16,pr:16,ac:!0,h:"100%",children:[e.jsx(o.default,{fv:{fontSize:0===u?16:1===u?14:2===u?12:16},textDecoration:w?"underline":"none",children:r.capitalize(l.label||l.value)}),e.jsx(i,{isOpen:p,enable:g})]})]}),e.jsx(t.default,{column:!0,css:"\n height: ".concat(p?"auto":"0",";\n opacity: ").concat(p?"1":"0",";\n overflow: hidden;\n transition: all 0.2s ease-in-out;\n "),children:g&&e.jsx(t.default,{column:!0,children:null===(s=l.children)||void 0===s?void 0:s.map(function(n,t){return e.jsx(a,{config:n,depth:u+1,routePrefix:d,parentPath:b,router:h,pathname:m},t)})})})]})},i=function(n){var o=n.isOpen,r=n.enable;return e.jsx(e.Fragment,{children:r&&e.jsx(t.default,{className:"arrow-icon",w:24,h:24,ac:!0,jc:!0,ml:"auto",css:"\n transform: ".concat(o?"rotate(180deg)":"none",';\n transition: transform 0.3s ease;\n &::before {\n content: "";\n width: 0;\n height: 0;\n border-left: 6px solid transparent;\n border-right: 6px solid transparent;\n border-top: 6px solid #dadadaed;\n }\n ')})})};exports.default=function(n){var r=n.navigationConfigs,i=n.logo,c=n.onClickSignOut,s=n.signOutLabel,l=n.router,u=n.pathname,d=n.disableSignOutButton,f=void 0!==d&&d,h=n.width;return e.jsxs(t.default,{className:"main-layout-navigation-bar-wrapper",h:"100%",bg:"#ffffff",column:!0,borderRight:"1px solid #f2f2f2",w:h,children:[i&&e.jsx(t.default,{w:"100%",ac:!0,h:100,jc:!0,children:i}),e.jsx(t.default,{flex1:!0,overflowY:"auto",children:r.configs.map(function(n,t){return e.jsx(a,{router:l,pathname:u,config:n,depth:0,routePrefix:r.routePrefix},t)})}),!f&&e.jsx(t.default,{h:100,ac:!0,jc:!0,onClick:function(){return c?c():window.location.href="/signOut"},children:e.jsx(t.default,{white:!0,mouseCss:!0,children:e.jsx(o.default,{fv:{fontSize:14},color:"#afafaf",textDecoration:"underline",children:s||"sign out"})})})]})};
//# sourceMappingURL=index.js.map