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) • 8.29 kB
JavaScript
import*as e from"react";import t from"primereact/api";import{CSSTransition as n}from"primereact/csstransition";import{useUpdateEffect as r,useMatchMedia as o,useEventListener as i,useResizeListener as u,useMountEffect as l,useUnmountEffect as a}from"primereact/hooks";import{Portal as c}from"primereact/portal";import{ObjectUtils as s,classNames as m,DomHandler as p,IconUtils as f,UniqueComponentId as d,ZIndexUtils as b}from"primereact/utils";import{Ripple as g}from"primereact/ripple";function h(){return h=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},h.apply(this,arguments)}function y(e){if(Array.isArray(e))return e}function v(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i,u,l=[],a=!0,c=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;a=!1}else for(;!(a=(r=i.call(n)).done)&&(l.push(r.value),l.length!==t);a=!0);}catch(e){c=!0,o=e}finally{try{if(!a&&null!=n.return&&(u=n.return(),Object(u)!==u))return}finally{if(c)throw o}}return l}}function x(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function E(e,t){if(e){if("string"==typeof e)return x(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?x(e,t):void 0}}function M(){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 S(e,t){return y(e)||v(e,t)||E(e,t)||M()}var k={defaultProps:{__TYPE:"ContextMenu",id:null,model:null,style:null,className:null,global:!1,autoZIndex:!0,baseZIndex:0,breakpoint:void 0,scrollHeight:"400px",appendTo:null,transitionOptions:null,onShow:null,onHide:null,children:void 0},getProps:function(e){return s.getMergedProps(e,k.defaultProps)},getOtherProps:function(e){return s.getDiffProps(e,k.defaultProps)}},N=e.memo((function(t){var o=S(e.useState(null),2),i=o[0],u=o[1],l=e.useRef(null),a=t.root||!t.resetMenu;!0===t.resetMenu&&null!==i&&u(null);var c=function(e,n){n.disabled||t.isMobileMode?e.preventDefault():u(n)},d=function(e,n){n.disabled?e.preventDefault():(n.url||e.preventDefault(),n.command&&n.command({originalEvent:e,item:n}),t.isMobileMode&&n.items&&u(i&&n===i?null:n),n.items||t.onLeafClick(e))},b=function(){if(!t.isMobileMode){var e=l.current.parentElement,n=p.getOffset(e),r=p.getViewport(),o=l.current.offsetParent?l.current.offsetWidth:p.getHiddenElementOuterWidth(l.current),i=p.getOuterWidth(e.children[0]),u=parseInt(n.top,10)+l.current.offsetHeight-p.getWindowScrollTop();l.current.style.top=u>r.height?r.height-u+"px":"0px",l.current.style.left=parseInt(n.left,10)+i+o>r.width-p.calculateScrollbarWidth()?-1*o+"px":i+"px"}};r((function(){a&&b()}));var h=function(t){return e.createElement("li",{key:"separator_"+t,className:"p-menu-separator",role:"separator"})},y=function(n){return n.items?e.createElement(N,{menuProps:t.menuProps,model:n.items,resetMenu:n!==i,onLeafClick:t.onLeafClick,isMobileMode:t.isMobileMode}):null},v=function(n,r){if(!1===n.visible)return null;var o=i===n,u=n.label+"_"+r,l=m("p-menuitem",{"p-menuitem-active":o},n.className),a=m("p-menuitem-link",{"p-disabled":n.disabled}),p=m("p-menuitem-icon",n.icon),b="p-submenu-icon pi pi-angle-right",h=f.getJSXIcon(n.icon,{className:"p-menuitem-icon"},{props:t.menuProps}),v=n.label&&e.createElement("span",{className:"p-menuitem-text"},n.label),x=n.items&&e.createElement("span",{className:b}),E=y(n),M=e.createElement("a",{href:n.url||"#",className:a,target:n.target,onClick:function(e){return d(e,n)},role:"menuitem","aria-haspopup":null!=n.items,"aria-disabled":n.disabled},h,v,x,e.createElement(g,null));n.template&&(M=s.getJSXElement(n.template,n,{onClick:function(e){return d(e,n)},className:a,labelClassName:"p-menuitem-text",iconClassName:p,submenuIconClassName:b,element:M,props:t,active:o}));return e.createElement("li",{key:u,role:"none",id:n.id,className:l,style:n.style,onMouseEnter:function(e){return c(e,n)}},M,E)},x=function(e,t){return e.separator?h(t):v(e,t)},E=m({"p-submenu-list":!t.root}),M=t.model?t.model.map(x):null;return e.createElement(n,{nodeRef:l,classNames:"p-contextmenusub",in:a,timeout:{enter:0,exit:0},unmountOnExit:!0,onEnter:function(){b()}},e.createElement("ul",{ref:l,className:E},M))}));N.displayName="ContextMenuSub";var P=e.memo(e.forwardRef((function(s,f){var g=k.getProps(s),y=S(e.useState(!1),2),v=y[0],x=y[1],E=S(e.useState(!1),2),M=E[0],P=E[1],w=S(e.useState(!1),2),O=w[0],I=w[1],C=S(e.useState(null),2),H=C[0],T=C[1],j=e.useRef(null),A=e.useRef(null),L=e.useRef(null),R=o("screen and (max-width: ".concat(g.breakpoint,")"),!!g.breakpoint),W=S(i({type:"click",listener:function(e){ne(e)&&2!==e.button&&(B(e),I(!0))}}),2),D=W[0],Z=W[1],_=S(i({type:"contextmenu",listener:function(e){q(e)}}),1)[0],X=S(u({listener:function(e){v&&!p.isTouchDevice()&&B(e)}}),2),J=X[0],V=X[1],Y=function(){if(!L.current){L.current=p.createInlineStyle(t.nonce);var e="".concat(H),n="\n@media screen and (max-width: ".concat(g.breakpoint,") {\n .p-contextmenu[").concat(e,"] > ul {\n max-height: ").concat(g.scrollHeight,";\n overflow: ").concat(g.scrollHeight?"auto":"",";\n }\n\n .p-contextmenu[").concat(e,"] .p-submenu-list {\n position: relative;\n }\n\n .p-contextmenu[").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-contextmenu[").concat(e,"] .p-menuitem-active > .p-menuitem-link > .p-submenu-icon {\n transform: rotate(-180deg);\n }\n\n .p-contextmenu[").concat(e,'] .p-submenu-icon:before {\n content: "\\e930";\n }\n}\n');L.current.innerHTML=n}},z=function(){L.current=p.removeInlineStyle(L.current)},U=function(){I(!1)},$=function(){I(!1)},q=function(e){e.stopPropagation(),e.preventDefault(),A.current=e,v?P(!0):(x(!0),g.onShow&&g.onShow(A.current))},B=function(e){A.current=e,x(!1),P(!1),g.onHide&&g.onHide(A.current)},F=function(){g.autoZIndex&&b.set("menu",j.current,t.autoZIndex,g.baseZIndex||t.zIndex.menu),ee(A.current),H&&g.breakpoint&&(j.current.setAttribute(H,""),Y())},G=function(){re()},K=function(){oe(),b.clear(j.current)},Q=function(){b.clear(j.current),z()},ee=function(e){if(e){var t=e.pageX+1,n=e.pageY+1,r=j.current.offsetParent?j.current.offsetWidth:p.getHiddenElementOuterWidth(j.current),o=j.current.offsetParent?j.current.offsetHeight:p.getHiddenElementOuterHeight(j.current),i=p.getViewport();t+r-document.body.scrollLeft>i.width&&(t-=r),n+o-document.body.scrollTop>i.height&&(n-=o),t<document.body.scrollLeft&&(t=document.body.scrollLeft),n<document.body.scrollTop&&(n=document.body.scrollTop),j.current.style.left=t+"px",j.current.style.top=n+"px"}},te=function(e){I(!0),B(e),e.stopPropagation()},ne=function(e){return j&&j.current&&!(j.current.isSameNode(e.target)||j.current.contains(e.target))},re=function(){J(),D()},oe=function(){V(),Z()};l((function(){g.global&&_(),g.breakpoint&&!H&&T(d())})),r((function(){return H&&j.current&&(j.current.setAttribute(H,""),Y()),function(){z()}}),[H,g.breakpoint]),r((function(){v?(x(!1),P(!1),I(!0)):M||v||!O||q(A.current)}),[M]),a((function(){b.clear(j.current)})),e.useImperativeHandle(f,(function(){return{props:g,show:q,hide:B,getElement:function(){return j.current}}}));var ie,ue,le=(ie=k.getOtherProps(g),ue=m("p-contextmenu p-component",g.className,{"p-input-filled":"filled"===t.inputStyle,"p-ripple-disabled":!1===t.ripple}),e.createElement(n,{nodeRef:j,classNames:"p-contextmenu",in:v,timeout:{enter:250,exit:0},options:g.transitionOptions,unmountOnExit:!0,onEnter:F,onEntered:G,onExit:K,onExited:Q},e.createElement("div",h({ref:j,id:g.id,className:ue,style:g.style},ie,{onClick:U,onMouseEnter:$}),e.createElement(N,{menuProps:g,model:g.model,root:!0,resetMenu:O,onLeafClick:te,isMobileMode:R}))));return e.createElement(c,{element:le,appendTo:g.appendTo})})));P.displayName="ContextMenu";export{P as ContextMenu};