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) • 13.3 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),r=require("primereact/componentbase"),n=require("primereact/hooks"),u=require("primereact/utils");function i(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var l=i(e);function o(){return o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)({}).hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},o.apply(null,arguments)}function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);r<t;r++)n[r]=e[r];return n}function c(e){if(Array.isArray(e))return a(e)}function s(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function p(e,t){if(e){if("string"==typeof e)return a(e,t);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?a(e,t):void 0}}function f(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function d(e){return c(e)||s(e)||p(e)||f()}function m(e){return m="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},m(e)}function g(e,t){if("object"!=m(e)||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!=m(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function h(e){var t=g(e,"string");return"symbol"==m(t)?t:t+""}function y(e,t,r){return(t=h(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function b(e){if(Array.isArray(e))return e}function v(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,u,i,l,o=[],a=!0,c=!1;try{if(i=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;a=!1}else for(;!(a=(n=i.call(r)).done)&&(o.push(n.value),o.length!==t);a=!0);}catch(e){c=!0,u=e}finally{try{if(!a&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(c)throw u}}return o}}function S(){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 w(e,t){return b(e)||v(e,t)||p(e,t)||S()}var O=r.ComponentBase.extend({defaultProps:{__TYPE:"Splitter",className:null,gutterSize:4,id:null,step:5,layout:"horizontal",onResizeEnd:null,stateKey:null,stateStorage:"session",style:null,children:void 0},css:{classes:{root:function(e){return u.classNames("p-splitter p-component p-splitter-".concat(e.props.layout))},gutter:"p-splitter-gutter",gutterHandler:"p-splitter-gutter-handle",panel:{root:"p-splitter-panel"}},styles:"\n@layer primereact {\n .p-splitter {\n display: flex;\n flex-wrap: nowrap;\n }\n\n .p-splitter-vertical {\n flex-direction: column;\n }\n\n .p-splitter-panel {\n flex-grow: 1;\n }\n\n .p-splitter-panel-nested {\n display: flex;\n }\n\n .p-splitter-panel .p-splitter {\n flex-grow: 1;\n border: 0 none;\n }\n\n .p-splitter-gutter {\n flex-grow: 0;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: col-resize;\n }\n\n .p-splitter-horizontal.p-splitter-resizing {\n cursor: col-resize;\n user-select: none;\n }\n\n .p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {\n height: 24px;\n width: 100%;\n }\n\n .p-splitter-horizontal > .p-splitter-gutter {\n cursor: col-resize;\n }\n\n .p-splitter-vertical.p-splitter-resizing {\n cursor: row-resize;\n user-select: none;\n }\n\n .p-splitter-vertical > .p-splitter-gutter {\n cursor: row-resize;\n }\n\n .p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {\n width: 24px;\n height: 100%;\n }\n}\n\n"}}),z=r.ComponentBase.extend({defaultProps:{__TYPE:"SplitterPanel",className:null,minSize:null,size:null,style:null,children:void 0},getCProps:function(e){return u.ObjectUtils.getComponentProps(e,z.defaultProps)},getCOtherProps:function(e){return u.ObjectUtils.getComponentDiffProps(e,z.defaultProps)},getCProp:function(e,t){return u.ObjectUtils.getComponentProp(e,t,z.defaultProps)}});function E(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function D(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?E(Object(r),!0).forEach((function(t){y(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):E(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var x=function(){},P=l.memo(l.forwardRef((function(e,i){var a=n.useMergeProps(),c=l.useContext(t.PrimeReactContext),s=O.getProps(e,c),p=l.useRef(""),f=l.useRef(null),m=l.useRef(),g=l.useRef({}),h=l.useRef(null),y=l.useRef(null),b=l.useRef(null),v=l.useRef(null),S=l.useRef(null),E=l.useRef(null),x=l.useRef(null),P=l.useRef(null),j=l.useRef(null),H=l.useRef(null),C=l.useRef(null),R=l.useRef(null),A=w(l.useState([]),2),N=A[0],k=A[1],I=w(l.useState(!1),2),U=I[0],_=I[1],M=null!=s.stateKey,T=s.children&&s.children.length||1,K=function(e,t){return t in e?e[t]:s.children&&[].concat(s.children)[t].props.size||100/T},L="horizontal"===s.layout,q={props:s,state:{panelSizes:N,nested:!0===u.DomHandler.getAttribute(f.current&&f.current.parentElement,"data-p-splitter-panel-nested")}},W=O.setMetaData(D({},q)),Y=W.ptm,B=W.cx,F=W.isUnstyled;r.useHandleStyle(O.css.styles,F,{name:"splitter"});var X=w(n.useEventListener({type:"mousemove",listener:function(e){return le(e)}}),2),J=X[0],$=X[1],G=w(n.useEventListener({type:"mouseup",listener:function(e){oe(e),Z()}}),2),Q=G[0],V=G[1],Z=function(){$(),V()},ee=function(e,t){return z.getCProp(e,t)},te=function(e,t){return!(e>100||e<0)&&(!(t>100||t<0)&&(!(s.children[C.current].props&&s.children[C.current].props.minSize&&s.children[C.current].props.minSize>e)&&!(s.children[C.current+1].props&&s.children[C.current+1].props.minSize&&s.children[C.current+1].props.minSize>t)))},re=l.useCallback((function(){switch(s.stateStorage){case"local":return window.localStorage;case"session":return window.sessionStorage;default:throw new Error(s.stateStorage+' is not a valid value for the state storage, supported values are "local" and "session".')}}),[s.stateStorage]),ne=function(e){u.ObjectUtils.isArray(e)&&re().setItem(s.stateKey,JSON.stringify(e))},ue=l.useCallback((function(){var e=re().getItem(s.stateKey);e&&k(JSON.parse(e))}),[re,s.stateKey]),ie=function(e,t,r){var n="touchstart"===e.type?e.touches[0].pageX:e.pageX,i="touchstart"===e.type?e.touches[0].pageY:e.pageY;m.current=g.current[t],h.current=L?u.DomHandler.getWidth(f.current):u.DomHandler.getHeight(f.current),y.current=!0,b.current=L?n:i,v.current=m.current.previousElementSibling,S.current=m.current.nextElementSibling,r?(E.current=L?u.DomHandler.getOuterWidth(v.current,!0):u.DomHandler.getOuterHeight(v.current,!0),j.current=L?u.DomHandler.getOuterWidth(S.current,!0):u.DomHandler.getOuterHeight(S.current,!0)):(E.current=100*(L?u.DomHandler.getOuterWidth(v.current,!0):u.DomHandler.getOuterHeight(v.current,!0))/h.current,j.current=100*(L?u.DomHandler.getOuterWidth(S.current,!0):u.DomHandler.getOuterHeight(S.current,!0))/h.current),P.current=E.current,H.current=j.current,C.current=t,!F()&&u.DomHandler.addClass(m.current,"p-splitter-gutter-resizing"),m.current.setAttribute("data-p-splitter-gutter-resizing",!0),!F()&&u.DomHandler.addClass(f.current,"p-splitter-resizing"),f.current.setAttribute("data-p-splitter-resizing",!0)},le=function(e){var t,r,n,u=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;arguments.length>2&&void 0!==arguments[2]&&arguments[2]?L?(n=100*(E.current+u)/h.current,r=100*(j.current-u)/h.current):(n=100*(E.current-u)/h.current,r=100*(j.current+u)/h.current):(n=E.current+(t=L?100*("touchmove"===e.type?e.touches[0].pageX:e.pageX)/h.current-100*b.current/h.current:100*("touchmove"===e.type?e.touches[0].pageY:e.pageY)/h.current-100*b.current/h.current),r=j.current-t),se(C.current,n,r)},oe=function(e){var t=d(N);t[C.current]=P.current,t[C.current+1]=H.current,s.onResizeEnd&&s.onResizeEnd({originalEvent:e,sizes:t}),M&&ne(t),k(t),!F()&&u.DomHandler.removeClass(m.current,"p-splitter-gutter-resizing"),g.current&&Object.keys(g.current).forEach((function(e){return g.current[e].setAttribute("data-p-splitter-gutter-resizing",!1)})),!F()&&u.DomHandler.removeClass(f.current,"p-splitter-resizing"),f.current.setAttribute("data-p-splitter-resizing",!1),y.current=!1,h.current=null,b.current=null,v.current=null,S.current=null,E.current=null,P.current=null,j.current=null,H.current=null,C.current=null},ae=function(){de(),oe()},ce=function(e,t){var r=s.children[t].props&&s.children[t].props.minSize||0;switch(e.code){case"ArrowLeft":L&&fe(e,t,-1*s.step),e.preventDefault();break;case"ArrowRight":L&&fe(e,t,s.step),e.preventDefault();break;case"ArrowDown":L||fe(e,t,-1*s.step),e.preventDefault();break;case"ArrowUp":L||fe(e,t,s.step),e.preventDefault();break;case"Home":se(t,100-r,r),e.preventDefault();break;case"End":se(t,r,100-r),e.preventDefault();break;case"NumpadEnter":case"Enter":x.current>=100-(r||5)?se(t,r,100-r):se(t,100-r,r),e.preventDefault()}},se=function(e,t,r){C.current=e,m.current=g.current[e],h.current=L?u.DomHandler.getWidth(f.current):u.DomHandler.getHeight(f.current),v.current=m.current.previousElementSibling,S.current=m.current.nextElementSibling,te(t,r)&&(P.current=t,H.current=r,v.current.style.flexBasis="calc("+t+"% - "+(s.children.length-1)*s.gutterSize+"px)",S.current.style.flexBasis="calc("+r+"% - "+(s.children.length-1)*s.gutterSize+"px)",x.current=parseFloat(t).toFixed(4))},pe=function(e,t,r){ie(e,t,!0),le(e,r,!0)},fe=function(e,t,r){R.current||(R.current=setInterval((function(){pe(e,t,r)}),40))},de=function(){R.current&&(clearInterval(R.current),R.current=null)},me=function(e,t){ie(e,t,!1),J(),Q()},ge=function(e,t){ie(e,t,!1),window.addEventListener("touchmove",he,{passive:!1,cancelable:!1}),window.addEventListener("touchend",ye)},he=function(e){le(e)},ye=function(e){oe(e),window.removeEventListener("touchmove",he),window.removeEventListener("touchend",ye)};l.useImperativeHandle(i,(function(){return{props:s,getElement:function(){return f.current}}})),n.useMountEffect((function(){f.current&&(p.current=u.UniqueComponentId())})),l.useEffect((function(){var e=d(f.current.children).filter((function(e){return"splitterpanel.root"===u.DomHandler.getAttribute(e,"data-pc-section")})),t=[];e.map((function(e,r){x.current=K(N,0),t[r]=K(N,r),e.childNodes&&u.ObjectUtils.isNotEmpty(u.DomHandler.find(e,"[data-pc-name='splitter']")&&u.DomHandler.find(e,"[data-pc-section='root']"))&&(!F()&&u.DomHandler.addClass(e,"p-splitter-panel-nested"),e.setAttribute("data-p-splitter-panel-nested",!0),_(!0))})),k(t)}),[]),l.useEffect((function(){M&&ue()}),[ue,M]);var be=function(e,t){var r=ee(e,"id")||"".concat(p.current,"_").concat(t),n=u.classNames(ee(e,"className"),B("panel.root")),i=a({ref:function(e){return g.current[t]=e},className:B("gutter"),style:L?{width:s.gutterSize+"px"}:{height:s.gutterSize+"px"},onMouseDown:function(e){return me(e,t)},onKeyDown:function(e){return ce(e,t)},onKeyUp:ae,onTouchStart:function(e){return ge(e,t)},onTouchMove:function(e){return he(e)},onTouchEnd:function(e){return ye(e)},"data-p-splitter-gutter-resizing":!1},Y("gutter")),o=a({tabIndex:ee(e,"tabIndex")||0,className:B("gutterHandler"),role:"separator","aria-orientation":L?"vertical":"horizontal","aria-controls":r,"aria-label":ee(e,"aria-label"),"aria-labelledby":ee(e,"aria-labelledby"),"aria-valuenow":x.current,"aria-valuetext":parseFloat(x.current).toFixed(0)+"%","aria-valuemin":ee(e,"minSize")||"0","aria-valuemax":"100"},Y("gutterHandler")),c=t!==s.children.length-1&&l.createElement("div",i,l.createElement("div",o)),f="calc("+K(N,t)+"% - "+(T-1)*s.gutterSize+"px)",d=a({key:t,id:r,className:n,style:D(D({},ee(e,"style")),{},{flexBasis:f}),role:"presentation","data-p-splitter-panel-nested":!1,onClick:ee(e,"onClick")},Y("splitterpanel.root",{context:{nested:U}}));return l.createElement(l.Fragment,null,l.createElement("div",d,ee(e,"children")),c)},ve=a({id:s.id,style:s.style,className:u.classNames(s.className,B("root")),"data-p-splitter-resizing":!1},O.getOtherProps(s),Y("root")),Se=l.Children.map(s.children,be);return l.createElement("div",o({ref:f},ve),Se)})));x.displayName="SplitterPanel",P.displayName="Splitter",exports.Splitter=P,exports.SplitterPanel=x;