primereact
Version:
PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime
2 lines (1 loc) • 9.47 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("primereact/api"),t=require("primereact/csstransition"),r=require("primereact/hooks"),o=require("primereact/overlayservice"),i=require("primereact/portal"),l=require("primereact/utils"),a=require("primereact/ripple");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var s=c(e),p=u(n);function m(){return m=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},m.apply(this,arguments)}function d(e){if(Array.isArray(e))return e}function f(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var r,o,i,l,a=[],u=!0,c=!1;try{if(i=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;u=!1}else for(;!(u=(r=i.call(t)).done)&&(a.push(r.value),a.length!==n);u=!0);}catch(e){c=!0,o=e}finally{try{if(!u&&null!=t.return&&(l=t.return(),Object(l)!==l))return}finally{if(c)throw o}}return a}}function b(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,r=new Array(n);t<n;t++)r[t]=e[t];return r}function v(e,n){if(e){if("string"==typeof e)return b(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?b(e,n):void 0}}function g(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function h(e,n){return d(e)||f(e,n)||v(e,n)||g()}var y={defaultProps:{__TYPE:"TieredMenu",id:null,model:null,popup:!1,style:null,className:null,autoZIndex:!0,baseZIndex:0,breakpoint:void 0,scrollHeight:"400px",appendTo:null,transitionOptions:null,onShow:null,onHide:null,children:void 0},getProps:function(e){return l.ObjectUtils.getMergedProps(e,y.defaultProps)},getOtherProps:function(e){return l.ObjectUtils.getDiffProps(e,y.defaultProps)}},E=s.memo((function(e){var n=h(s.useState(null),2),t=n[0],o=n[1],i=s.useRef(null),u=h(r.useEventListener({type:"click",listener:function(n){e.isMobileMode||!i.current||i.current.contains(n.target)||o(null)}}),1)[0],c=h(r.useResizeListener({listener:function(){!e.isMobileMode&&o(null)}}),1)[0],p=function(){if(i.current){var e=i.current.parentElement,n=l.DomHandler.getOffset(e),t=l.DomHandler.getViewport(),r=i.current.offsetParent?i.current.offsetWidth:l.DomHandler.getHiddenElementOuterWidth(i.current),o=l.DomHandler.getOuterWidth(e.children[0]),a=parseInt(n.top,10)+i.current.offsetHeight-l.DomHandler.getWindowScrollTop();i.current.style.top=a>t.height?t.height-a+"px":"0px",parseInt(n.left,10)+o+r>t.width-l.DomHandler.calculateScrollbarWidth()&&l.DomHandler.addClass(i.current,"p-submenu-list-flipped")}},m=function(n,r){r.disabled||e.isMobileMode?n.preventDefault():e.root?(t||e.popup)&&o(r):o(r)},d=function(n,r){r.disabled?n.preventDefault():(r.url||n.preventDefault(),r.command&&r.command({originalEvent:n,item:r}),(e.root||e.isMobileMode)&&r.items&&o(t&&r===t?null:r),r.items||y(n))},f=function(n,t){var r=n.currentTarget.parentElement;switch(n.which){case 40:var i=v(r);i&&i.children[0].focus(),n.preventDefault();break;case 38:var l=g(r);l&&l.children[0].focus(),n.preventDefault();break;case 39:t.items&&(o(t),setTimeout((function(){r.children[1].children[0].children[0].focus()}),50)),n.preventDefault()}e.onKeyDown&&e.onKeyDown(n,r)},b=function(e,n){37===e.which&&(o(null),n.parentElement.previousElementSibling.focus())},v=function e(n){var t=n.nextElementSibling;return t?l.DomHandler.hasClass(t,"p-disabled")||!l.DomHandler.hasClass(t,"p-menuitem")?e(t):t:null},g=function e(n){var t=n.previousElementSibling;return t?l.DomHandler.hasClass(t,"p-disabled")||!l.DomHandler.hasClass(t,"p-menuitem")?e(t):t:null},y=function(n){e.isMobileMode&&!e.popup||(o(null),e.onLeafClick&&e.onLeafClick(n),e.onHide&&e.onHide(n))};r.useMountEffect((function(){u(),c()})),r.useUpdateEffect((function(){e.parentActive||o(null),e.root||!e.parentActive||e.isMobileMode||p()}),[e.parentActive]),r.useUpdateEffect((function(){e.onItemToggle&&e.onItemToggle()}),[t]);var M=function(e){return s.createElement("li",{key:"separator_"+e,className:"p-menu-separator",role:"separator"})},w=function(n){return n.items?s.createElement(E,{menuProps:e.menuProps,model:n.items,onLeafClick:y,popup:e.popup,onKeyDown:b,parentActive:n===t,isMobileMode:e.isMobileMode,onItemToggle:e.onItemToggle}):null},D=function(n,r){if(!1===n.visible)return null;var o=n.style,i=n.disabled,u=n.icon,c=n.label,p=n.items,b=n.target,v=n.url,g=n.template,h=c+"_"+r,y=t===n,E=l.classNames("p-menuitem",{"p-menuitem-active":y},n.className),M=l.classNames("p-menuitem-link",{"p-disabled":i}),D=l.classNames("p-menuitem-icon",u),H="p-submenu-icon pi pi-angle-right",O=l.IconUtils.getJSXIcon(u,{className:"p-menuitem-icon"},{props:e.menuProps}),x=c&&s.createElement("span",{className:"p-menuitem-text"},c),I=p&&s.createElement("span",{className:H}),S=w(n),k=s.createElement("a",{href:v||"#",className:M,target:b,role:"menuitem","aria-haspopup":null!=p,onClick:function(e){return d(e,n)},onKeyDown:function(e){return f(e,n)},"aria-disabled":i},O,x,I,s.createElement(a.Ripple,null));g&&(k=l.ObjectUtils.getJSXElement(g,n,{onClick:function(e){return d(e,n)},onKeyDown:function(e){return f(e,n)},className:M,labelClassName:"p-menuitem-text",iconClassName:D,submenuIconClassName:H,element:k,props:e,active:y,disabled:i}));return s.createElement("li",{key:h,id:n,className:E,style:o,onMouseEnter:function(e){return m(e,n)},role:"none"},k,S)},H=function(e,n){return e.separator?M(n):D(e,n)},O=l.classNames({"p-submenu-list":!e.root}),x=e.model?e.model.map(H):null;return s.createElement("ul",{ref:i,className:O,role:e.root?"menubar":"menu","aria-orientation":"horizontal"},x)}));E.displayName="TieredMenuSub";var M=s.memo(s.forwardRef((function(e,n){var a=y.getProps(e),u=h(s.useState(!a.popup),2),c=u[0],d=u[1],f=h(s.useState(null),2),b=f[0],v=f[1],g=s.useRef(null),M=s.useRef(null),w=s.useRef(null),D=r.useMatchMedia("screen and (max-width: ".concat(a.breakpoint,")"),!!a.breakpoint),H=h(r.useOverlayListener({target:M,overlay:g,listener:function(e,n){n.valid&&N(e)},when:c}),2),O=H[0],x=H[1],I=function(e){a.popup&&o.OverlayService.emit("overlay-click",{originalEvent:e,target:M.current})},S=function(e){a.popup&&(c?N(e):k(e))},k=function(e){M.current=e.currentTarget,d(!0),a.onShow&&a.onShow(e)},N=function(e){a.popup&&(M.current=e.currentTarget,d(!1),a.onHide&&a.onHide(e))},P=function(){a.popup&&D&&l.DomHandler.absolutePosition(g.current,M.current)},T=function(){if(!w.current){w.current=l.DomHandler.createInlineStyle(p.default.nonce);var e="".concat(b),n="\n@media screen and (max-width: ".concat(a.breakpoint,") {\n .p-tieredmenu[").concat(e,"] > ul {\n max-height: ").concat(a.scrollHeight,";\n overflow: ").concat(a.scrollHeight?"auto":"",";\n }\n\n .p-tieredmenu[").concat(e,"] .p-submenu-list {\n position: relative;\n }\n\n .p-tieredmenu[").concat(e,"] .p-menuitem-active > .p-submenu-list {\n left: 0 !important;\n box-shadow: none;\n border-radius: 0;\n padding: 0 0 0 calc(var(--inline-spacing) * 2); /* @todo */\n }\n\n .p-tieredmenu[").concat(e,"] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n transform: rotate(-180deg);\n }\n\n .p-tieredmenu[").concat(e,'] .p-submenu-icon:before {\n content: "\\e930";\n }\n\n ').concat(a.popup?"":".p-tieredmenu[".concat(e,"] { width: 100%; }"),"\n}\n");w.current.innerHTML=n}},j=function(){w.current=l.DomHandler.removeInlineStyle(w.current)},C=function(){a.autoZIndex&&l.ZIndexUtils.set("menu",g.current,p.default.autoZIndex,a.baseZIndex||p.default.zIndex.menu),l.DomHandler.absolutePosition(g.current,M.current),b&&a.breakpoint&&(g.current.setAttribute(b,""),T())},U=function(){O()},A=function(){M.current=null,x()},q=function(){l.ZIndexUtils.clear(g.current),j()};r.useMountEffect((function(){a.breakpoint&&!b&&v(l.UniqueComponentId())})),r.useUpdateEffect((function(){return b&&g.current&&(g.current.setAttribute(b,""),T()),function(){j()}}),[b,a.breakpoint]),r.useUnmountEffect((function(){l.ZIndexUtils.clear(g.current)})),s.useImperativeHandle(n,(function(){return{props:a,toggle:S,show:k,hide:N,getElement:function(){return g.current}}}));var R,Z,_=(R=y.getOtherProps(a),Z=l.classNames("p-tieredmenu p-component",{"p-tieredmenu-overlay":a.popup,"p-input-filled":"filled"===p.default.inputStyle,"p-ripple-disabled":!1===p.default.ripple},a.className),s.createElement(t.CSSTransition,{nodeRef:g,classNames:"p-connected-overlay",in:c,timeout:{enter:120,exit:100},options:a.transitionOptions,unmountOnExit:!0,onEnter:C,onEntered:U,onExit:A,onExited:q},s.createElement("div",m({ref:g,id:a.id,className:Z,style:a.style},R,{onClick:I}),s.createElement(E,{menuProps:a,model:a.model,root:!0,popup:a.popup,onHide:N,isMobileMode:D,onItemToggle:P}))));return a.popup?s.createElement(i.Portal,{element:_,appendTo:a.appendTo}):_})));M.displayName="TieredMenu",exports.TieredMenu=M;