UNPKG

react-dynamic-snbar

Version:

Responsive React sidebar with role-based navigation support and easy customization.

12 lines (11 loc) 13.8 kB
import e,{useState as r,useEffect as t}from"react";import{useLocation as n,Link as o}from"react-router-dom";var a,c={exports:{}},l={};var i,s,u={}; /** * @license React * react-jsx-runtime.development.js * * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */function f(){return i||(i=1,"production"!==process.env.NODE_ENV&&function(){function r(e){if(null==e)return null;if("function"==typeof e)return e.$$typeof===N?null:e.displayName||e.name||null;if("string"==typeof e)return e;switch(e){case y:return"Fragment";case b:return"Profiler";case m:return"StrictMode";case j:return"Suspense";case k:return"SuspenseList";case w:return"Activity"}if("object"==typeof e)switch("number"==typeof e.tag&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case p:return"Portal";case g:return(e.displayName||"Context")+".Provider";case v:return(e._context.displayName||"Context")+".Consumer";case h:var t=e.render;return(e=e.displayName)||(e=""!==(e=t.displayName||t.name||"")?"ForwardRef("+e+")":"ForwardRef"),e;case x:return null!==(t=e.displayName||null)?t:r(e.type)||"Memo";case O:t=e._payload,e=e._init;try{return r(e(t))}catch(e){}}return null}function t(e){return""+e}function n(e){try{t(e);var r=!1}catch(e){r=!0}if(r){var n=(r=console).error,o="function"==typeof Symbol&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return n.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",o),t(e)}}function o(e){if(e===y)return"<>";if("object"==typeof e&&null!==e&&e.$$typeof===O)return"<...>";try{var t=r(e);return t?"<"+t+">":"<...>"}catch(e){return"<...>"}}function a(){return Error("react-stack-top-frame")}function c(){var e=r(this.type);return E[e]||(E[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),void 0!==(e=this.props.ref)?e:null}function l(e,t,o,a,l,u,f,p){var y,m=t.children;if(void 0!==m)if(a)if(P(m)){for(a=0;a<m.length;a++)i(m[a]);Object.freeze&&Object.freeze(m)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else i(m);if(C.call(t,"key")){m=r(e);var b=Object.keys(t).filter((function(e){return"key"!==e}));a=0<b.length?"{key: someKey, "+b.join(": ..., ")+": ...}":"{key: someKey}",T[m+a]||(b=0<b.length?"{"+b.join(": ..., ")+": ...}":"{}",console.error('A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',a,m,b,m),T[m+a]=!0)}if(m=null,void 0!==o&&(n(o),m=""+o),function(e){if(C.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return void 0!==e.key}(t)&&(n(t.key),m=""+t.key),"key"in t)for(var v in o={},t)"key"!==v&&(o[v]=t[v]);else o=t;return m&&function(e,r){function t(){s||(s=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}(o,"function"==typeof e?e.displayName||e.name||"Unknown":e),function(e,r,t,n,o,a,l,i){return t=a.ref,e={$$typeof:d,type:e,key:r,props:a,_owner:o},null!==(void 0!==t?t:null)?Object.defineProperty(e,"ref",{enumerable:!1,get:c}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:l}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}(e,m,u,0,null===(y=S.A)?null:y.getOwner(),o,f,p)}function i(e){"object"==typeof e&&null!==e&&e.$$typeof===d&&e._store&&(e._store.validated=1)}var s,f=e,d=Symbol.for("react.transitional.element"),p=Symbol.for("react.portal"),y=Symbol.for("react.fragment"),m=Symbol.for("react.strict_mode"),b=Symbol.for("react.profiler"),v=Symbol.for("react.consumer"),g=Symbol.for("react.context"),h=Symbol.for("react.forward_ref"),j=Symbol.for("react.suspense"),k=Symbol.for("react.suspense_list"),x=Symbol.for("react.memo"),O=Symbol.for("react.lazy"),w=Symbol.for("react.activity"),N=Symbol.for("react.client.reference"),S=f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,C=Object.prototype.hasOwnProperty,P=Array.isArray,_=console.createTask?console.createTask:function(){return null},E={},L=(f={"react-stack-bottom-frame":function(e){return e()}})["react-stack-bottom-frame"].bind(f,a)(),R=_(o(a)),T={};u.Fragment=y,u.jsx=function(e,r,t,n,a){var c=1e4>S.recentlyCreatedOwnerStacks++;return l(e,r,t,!1,0,a,c?Error("react-stack-top-frame"):L,c?_(o(e)):R)},u.jsxs=function(e,r,t,n,a){var c=1e4>S.recentlyCreatedOwnerStacks++;return l(e,r,t,!0,0,a,c?Error("react-stack-top-frame"):L,c?_(o(e)):R)}}()),u}var d=(s||(s=1,"production"===process.env.NODE_ENV?c.exports=function(){if(a)return l;a=1;var e=Symbol.for("react.transitional.element"),r=Symbol.for("react.fragment");function t(r,t,n){var o=null;if(void 0!==n&&(o=""+n),void 0!==t.key&&(o=""+t.key),"key"in t)for(var a in n={},t)"key"!==a&&(n[a]=t[a]);else n=t;return t=n.ref,{$$typeof:e,type:r,key:o,ref:void 0!==t?t:null,props:n}}return l.Fragment=r,l.jsx=t,l.jsxs=t,l}():c.exports=f()),c.exports),p={color:void 0,size:void 0,className:void 0,style:void 0,attr:void 0},y=e.createContext&&e.createContext(p),m=["attr","size","title"];function b(e,r){if(null==e)return{};var t,n,o=function(e,r){if(null==e)return{};var t={};for(var n in e)if(Object.prototype.hasOwnProperty.call(e,n)){if(r.indexOf(n)>=0)continue;t[n]=e[n]}return t}(e,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)t=a[n],r.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(o[t]=e[t])}return o}function v(){return v=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},v.apply(this,arguments)}function g(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}function h(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?g(Object(t),!0).forEach((function(r){j(e,r,t[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):g(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}))}return e}function j(e,r,t){var n;return(r="symbol"==typeof(n=function(e,r){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var n=t.call(e,r);if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}(r,"string"))?n:n+"")in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function k(r){return r&&r.map(((r,t)=>e.createElement(r.tag,h({key:t},r.attr),k(r.child))))}function x(r){return t=>e.createElement(O,v({attr:h({},r.attr)},t),k(r.child))}function O(r){var t=t=>{var n,{attr:o,size:a,title:c}=r,l=b(r,m),i=a||t.size||"1em";return t.className&&(n=t.className),r.className&&(n=(n?n+" ":"")+r.className),e.createElement("svg",v({stroke:"currentColor",fill:"currentColor",strokeWidth:"0"},t.attr,o,l,{className:n,style:h(h({color:r.color||t.color},t.style),r.style),height:i,width:i,xmlns:"http://www.w3.org/2000/svg"}),c&&e.createElement("title",null,c),r.children)};return void 0!==y?e.createElement(y.Consumer,null,(e=>t(e))):t(p)}function w(e){return x({attr:{viewBox:"0 0 448 512"},child:[{tag:"path",attr:{d:"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z"},child:[]}]})(e)}function N(e){return x({attr:{viewBox:"0 0 320 512"},child:[{tag:"path",attr:{d:"M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z"},child:[]}]})(e)}function S(e){return x({attr:{viewBox:"0 0 320 512"},child:[{tag:"path",attr:{d:"M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z"},child:[]}]})(e)}function C(e){return x({attr:{viewBox:"0 0 448 512"},child:[{tag:"path",attr:{d:"M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z"},child:[]}]})(e)}var P=function(e){var a=e.activeBg,c=e.activeColor,l=e.navItems,i=e.setMaxWidth,s=e.logo,u=e.title,f=e.role,p=e.fontFamily,y=e.backgroundColor,m=e.color,b=e.categoryColor,v=e.toggleBtn,g=void 0===v||v,h=r({}),j=h[0],k=h[1],x=r(null),O=x[0],P=x[1],_=r(!0),E=_[0],L=_[1],R=r(!1),T=R[0],z=R[1],$=n().pathname;t((function(){E?null==i||i(!0):null==i||i(!1)}),[E]),t((function(){var e,r=f&&l.some((function(e){var r;return null===(r=e.roles)||void 0===r?void 0:r.includes(f)}));if(e=r?l.filter((function(e){return!e.roles||0===e.roles.length||e.roles.includes(f)})):l,l&&0!==l.length){var t=e.reduce((function(e,r){var t=r.category;return e[t]=e[t]||[],e[t].push(r),e}),{});k(t)}}),[l,f]);return t((function(){var e=$,r=l.find((function(r){var t;return null===(t=r.children)||void 0===t?void 0:t.some((function(r){return e.startsWith(r.path)}))}));r&&P(r.label)}),[$,l]),d.jsxs(d.Fragment,{children:[d.jsx("button",{className:"mobile-toggle ".concat(T?"mobile-toggle-open":"mobile-toggle-closed"),onClick:function(){return z((function(e){return!e}))},style:{backgroundColor:y||"#1a202c",color:m||"#e2e8f0"},children:T?d.jsx(N,{}):d.jsx(S,{})}),g&&d.jsx("button",{className:"desktop-toggle ".concat(E?"desktop-toggle-expanded":"desktop-toggle-collapsed"),style:{backgroundColor:y||"#1a202c",color:m||"#e2e8f0"},onClick:function(){return L((function(e){return!e}))},children:E?d.jsx(N,{}):d.jsx(S,{})}),d.jsxs("div",{className:"sidebar ".concat(!E&&"sidebar-collapsed"," ").concat(!T&&"sidebar-hidden"),style:{backgroundColor:y||"#1a202c",color:m||"#e2e8f0",fontFamily:p},children:[d.jsx("div",{className:"logo-section",style:{backgroundColor:y||"#1a202c",color:m||"#e2e8f0"},children:d.jsxs("div",{className:"logo-container ".concat(!E&&"logo-container-centered"),children:[d.jsx("img",{src:s,alt:"Logo",className:"logo-image ".concat(E?"logo-image-expanded":"logo-image-collapsed")}),E&&d.jsx("p",{className:"logo-title",style:{opacity:E?1:0},children:u})]})}),Object.entries(j).map((function(e){var r=e[0],t=e[1];return d.jsxs("div",{className:"category-section",children:[d.jsx("h3",{className:"category-title",style:{color:b||"#a0aec0"},children:E&&r}),d.jsx("ul",{className:"nav-list",children:t&&t.map((function(e,r){return d.jsx("li",{children:e.children&&e.children.length>0?d.jsxs("div",{children:[d.jsxs("button",{onClick:function(){return function(e){P((function(r){return r===e?null:e}))}(e.label)},className:"nav-button ".concat(!E&&"nav-button-centered"),style:{backgroundColor:y||"#1a202c",color:m||"#e2e8f0",fontFamily:p},children:[d.jsxs("div",{className:"nav-item-content",children:[e.icon,E&&d.jsx("span",{className:"nav-item-label",children:e.label})]}),E&&d.jsx("span",{className:"dropdown-icon",children:O===e.label?d.jsx(C,{}):d.jsx(w,{})})]}),d.jsx("div",{className:"dropdown-content ".concat(O===e.label?"dropdown-content-open":"dropdown-content-closed"),children:d.jsx("ul",{className:"dropdown-list",children:e.children.map((function(e,r){return d.jsx("li",{children:d.jsxs(o,{to:e.path,style:{color:$===e.path?c||"#3b82f6":m,backgroundColor:$===e.path?a||"#2d3748":"",borderLeft:$===e.path?"2px solid":"none",borderColor:$===e.path?c||"#3b82f6":""},className:"dropdown-link ".concat($===e.path?"dropdown-link-active":""," ").concat(!E&&"dropdown-link-centered"),onClick:function(){return z((function(e){return!e}))},children:[e.icon,E&&d.jsx("span",{className:"dropdown-label",children:e.label})]})},r)}))})})]}):e.path&&d.jsxs(o,{to:e.path,onClick:function(){P(""),z(!1)},style:{color:$===e.path?c||"#3b82f6":m,backgroundColor:$===e.path?a||"#2d3748":"",borderLeft:$===e.path?"2px solid":"none",borderColor:$===e.path?c||"#3b82f6":""},className:"nav-link ".concat($===e.path?"nav-link-active":""," ").concat(!E&&"nav-link-centered"),children:[e.icon,E&&d.jsx("span",{className:"nav-item-label",children:e.label})]})},r)}))})]},r)}))]})]})};export{P as Sidebar}; //# sourceMappingURL=index.mjs.map