UNPKG

react-multilevel-sidebar

Version:
6 lines 10.6 kB
module.exports=function(e){var t={};function n(a){if(t[a])return t[a].exports;var r=t[a]={i:a,l:!1,exports:{}};return e[a].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,a){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:a})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var a=Object.create(null);if(n.r(a),Object.defineProperty(a,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(a,r,function(t){return e[t]}.bind(null,r));return a},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},r=function(){function e(e,t){for(var n=0;n<t.length;n++){var a=t[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}return function(t,n,a){return n&&e(t.prototype,n),a&&e(t,a),t}}(),l=n(1),i=u(l),c=u(n(2)),o=u(n(3));function u(e){return e&&e.__esModule?e:{default:e}}function s(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function d(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)}var f=function(e){function t(){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var e=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this));return e.state={activeTab:[]},e.handleTabClick=e.handleTabClick.bind(e),e.handleBackdropClick=e.handleBackdropClick.bind(e),e.handleBackClick=e.handleBackClick.bind(e),e}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,e),r(t,[{key:"handleBackdropClick",value:function(){var e=this,t=this.props,n=t.onToggle,a=t.onClose,r=t.persist;n(!1),a&&a(),r||setTimeout((function(){e.setState({activeTab:[]})}),501)}},{key:"handleTabClick",value:function(e){if(!e.disabled){var t=this.props.onItemClick;if(e.children){var n=[].concat(d(this.state.activeTab));n.push(e.id),this.setState({activeTab:n})}t&&t(e)}}},{key:"handleBackClick",value:function(e){var t=this.props.onBackClick;if(e){var n=[].concat(d(this.state.activeTab)),a=n.findIndex((function(t){return t===e.id}));n.splice(a,1),this.setState({activeTab:n})}else this.setState({activeTab:[]});t&&t()}},{key:"getParentHeight",value:function(){var e=document.querySelector("#sidebar-parent");return e?e.scrollHeight:"100vh"}},{key:"renderSecondChildren",value:function(e,t){var n=this,r=this.props.wrapperClassName,o=this.state.activeTab;return i.default.createElement(p,a({},this.props,{sidebarProps:{className:(0,c.default)("sidebar-main second",s({show:o.includes(t.id)},r,r)),style:{height:this.getParentHeight()}},headerContent:i.default.createElement(l.Fragment,null,i.default.createElement("div",{className:"first-back-btn",onClick:function(){return n.handleBackClick()}},i.default.createElement(m,null),i.default.createElement("span",null,e.name)),i.default.createElement("div",{className:"second-back-btn",onClick:function(){return n.handleBackClick(t)}},i.default.createElement(m,null),i.default.createElement("span",null,t.name))),options:t.children,handleTabClick:this.handleTabClick}))}},{key:"renderFirstChildren",value:function(e){var t=this,n=this.props.wrapperClassName,r=this.state.activeTab;return i.default.createElement(p,a({},this.props,{sidebarProps:{className:(0,c.default)("sidebar-main second",s({show:r.includes(e.id)},n,n)),style:{height:this.getParentHeight()}},headerContent:i.default.createElement("div",{className:"first-back-btn",onClick:function(){return t.handleBackClick()}},i.default.createElement(m,null),i.default.createElement("span",null,e.name)),options:e.children,handleTabClick:this.handleTabClick}),(function(n){return n.children&&t.renderSecondChildren(e,n)}))}},{key:"render",value:function(){var e=this,t=this.props,n=t.open,r=t.wrapperClassName,l=t.headerClassName,o=t.header,u=t.options;return i.default.createElement("div",{id:"react-sidebar",className:"slidebar"},i.default.createElement("div",{className:(0,c.default)("sidebar-backdrop",{show:n}),onClick:this.handleBackdropClick}),i.default.createElement(p,a({},this.props,{sidebarProps:{id:"sidebar-parent",className:(0,c.default)("sidebar-main",s({show:n},r,r))},headerContent:"string"==typeof o?i.default.createElement("div",{className:"sidebar-header "+(0,c.default)(s({},l,l))},o):i.default.createElement("div",{className:(0,c.default)(s({},l,l))},o),options:u,handleTabClick:this.handleTabClick}),(function(t){return t.children&&e.renderFirstChildren(t)})))}}]),t}(l.Component);f.propTypes={open:o.default.bool.isRequired,onToggle:o.default.func.isRequired,options:o.default.array.isRequired,header:o.default.oneOfType([o.default.string,o.default.element,o.default.node]),persist:o.default.bool,wrapperClassName:o.default.string,headerClassName:o.default.string,onClose:o.default.func,onItemClick:o.default.func,onBackClick:o.default.func},f.defaultProps={persist:!1},t.default=f;var p=function(e){var t=e.sidebarProps,n=e.headerContent,a=e.options,r=e.children,o=e.handleTabClick;return i.default.createElement("div",t,i.default.createElement("div",{className:"sidebar-main-content"},n,i.default.createElement("div",{className:"sidebar-body"},a.map((function(e,t){return i.default.createElement(l.Fragment,{key:t},!(e.hideBorder||0===t)&&i.default.createElement("hr",{className:"section-seprator"}),e.title&&i.default.createElement("div",{className:"section-heading"},e.titleIcon&&e.titleIcon,i.default.createElement("span",{className:(0,c.default)({text:e.titleIcon})},e.title)),i.default.createElement("ul",null,e.content.map((function(e,t){return i.default.createElement(l.Fragment,{key:t},!e.to||e.children||e.disabled?i.default.createElement("li",{className:(0,c.default)({disabled:e.disabled}),onClick:function(){return o(e)}},i.default.createElement("span",{className:"flex-align-center"},e.icon&&e.icon,i.default.createElement("span",null,e.name)),r&&e.children&&i.default.createElement(h,null)):i.default.createElement("a",{href:e.to},i.default.createElement("li",{className:(0,c.default)({disabled:e.disabled}),onClick:function(){return o(e)}},i.default.createElement("span",{className:"flex-align-center"},e.icon&&e.icon,i.default.createElement("span",null,e.name)),r&&e.children&&i.default.createElement(h,null))),r&&r(e))}))))})))))},h=function(e){return i.default.createElement("svg",{width:"12px",height:"12px",viewBox:"0 0 8 13",version:"1.1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink"},i.default.createElement("title",null,"Icon"),i.default.createElement("desc",null,"Created with Sketch."),i.default.createElement("g",{id:"Symbols",stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},i.default.createElement("g",{id:"Icon/Arrow/Right/Gray",fill:"#898989"},i.default.createElement("g",{id:"icon/Arrow/Right/Gray"},i.default.createElement("polygon",{id:"Icon",points:"0 11.4725 4.94466937 6.5 0 1.5275 1.52226721 0 8 6.5 1.52226721 13"})))))},m=function(e){return i.default.createElement("svg",{version:"1.1",id:"Capa_1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",x:"0px",y:"0px",width:"10px",height:"10px",viewBox:"0 0 548.797 548.797",xmlSpace:"preserve"},i.default.createElement("g",null,i.default.createElement("g",null,i.default.createElement("path",{d:"M476.249,20.818c-13.855-21.23-42.283-27.203-63.525-13.354l-304.904,199.01c-27.185,16.01-42.742,40.692-42.742,67.92\r c0,27.228,15.557,51.903,42.742,67.926l304.904,199.004c7.748,5.056,16.445,7.473,25.049,7.473\r c14.982,0,29.682-7.332,38.477-20.814c13.861-21.229,7.883-49.67-13.348-63.525L171.705,274.395l291.196-190.05\r C484.131,70.488,490.104,42.049,476.249,20.818z"}))),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null),i.default.createElement("g",null))}},function(e,t){e.exports=require("react")},function(e,t,n){var a; /*! Copyright (c) 2017 Jed Watson. Licensed under the MIT License (MIT), see http://jedwatson.github.io/classnames */!function(){"use strict";var n={}.hasOwnProperty;function r(){for(var e=[],t=0;t<arguments.length;t++){var a=arguments[t];if(a){var l=typeof a;if("string"===l||"number"===l)e.push(a);else if(Array.isArray(a)&&a.length){var i=r.apply(null,a);i&&e.push(i)}else if("object"===l)for(var c in a)n.call(a,c)&&a[c]&&e.push(c)}}return e.join(" ")}e.exports?(r.default=r,e.exports=r):void 0===(a=function(){return r}.apply(t,[]))||(e.exports=a)}()},function(e,t,n){e.exports=n(4)()},function(e,t,n){"use strict";var a=n(5);function r(){}function l(){}l.resetWarningCache=r,e.exports=function(){function e(e,t,n,r,l,i){if(i!==a){var c=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw c.name="Invariant Violation",c}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:l,resetWarningCache:r};return n.PropTypes=n,n}},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}]);