primereact/splitter/splitter.esm.min.js

PrimeReact is an open source UI library for React featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

import*as e from"react";import{useEventListener as t}from"primereact/hooks";import{DomHandler as r,ObjectUtils as n,classNames as u}from"primereact/utils";function l(){return l=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},l.apply(this,arguments)}function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function c(e){if(Array.isArray(e))return i(e)}function a(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function s(e,t){if(e){if("string"==typeof e)return i(e,t);var r=Object.prototype.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)?i(e,t):void 0}}function p(){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 f(e){throw new TypeError('"'+e+'" is read-only')}function d(e){if(Array.isArray(e))return e}function h(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,u,l=[],o=!0,i=!1;try{for(r=r.call(e);!(o=(n=r.next()).done)&&(l.push(n.value),!t||l.length!==t);o=!0);}catch(e){i=!0,u=e}finally{try{o||null==r.return||r.return()}finally{if(i)throw u}}return l}}function y(){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 m(e,t){return d(e)||h(e,t)||s(e,t)||y()}function g(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 v(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?g(Object(r),!0).forEach((function(t){o(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):g(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var b=function(){},S=e.memo(e.forwardRef((function(o,i){var d=e.useRef(null),h=e.useRef(),y=e.useRef({}),g=e.useRef(null),w=e.useRef(null),O=e.useRef(null),z=e.useRef(null),E=e.useRef(null),j=e.useRef(null),P=e.useRef(null),R=e.useRef(null),N=e.useRef(null),x=e.useRef(null),C=m(e.useState([]),2),A=C[0],I=C[1],T=null!=o.stateKey,D=o.children&&o.children.length,K=function(e,t){return t in e?e[t]:(o.children[t].props.size||100)/D},Y=m(t({type:"mousemove",listener:function(e){return $(e)}}),2),k=Y[0],H=Y[1],L=m(t({type:"mouseup",listener:function(e){q(e),B()}}),2),X=L[0],_=L[1],B=function(){H(),_()},M=function(e,t){return!(e>100||e<0)&&(!(t>100||t<0)&&(!(o.children[x.current].props&&o.children[x.current].props.minSize&&o.children[x.current].props.minSize>e)&&!(o.children[x.current+1].props&&o.children[x.current+1].props.minSize&&o.children[x.current+1].props.minSize>t)))},W=e.useCallback((function(){switch(o.stateStorage){case"local":return window.localStorage;case"session":return window.sessionStorage;default:throw new Error(o.stateStorage+' is not a valid value for the state storage, supported values are "local" and "session".')}}),[o.stateStorage]),J=function(e){W().setItem(o.stateKey,JSON.stringify(e))},F=e.useCallback((function(){var e=W().getItem(o.stateKey);e&&I(JSON.parse(e))}),[W,o.stateKey]),U=function(e,t){h.current=y.current[t];var n="touchstart"===e.type?e.touches[0].pageX:e.pageX,u="touchstart"===e.type?e.touches[0].pageY:e.pageY;g.current="horizontal"===o.layout?r.getWidth(d.current):r.getHeight(d.current),w.current=!0,O.current="horizontal"===o.layout?n:u,z.current=h.current.previousElementSibling,E.current=h.current.nextElementSibling,j.current=100*("horizontal"===o.layout?r.getOuterWidth(z.current,!0):r.getOuterHeight(z.current,!0))/g.current,P.current=j.current,R.current=100*("horizontal"===o.layout?r.getOuterWidth(E.current,!0):r.getOuterHeight(E.current,!0))/g.current,N.current=R.current,x.current=t,r.addClass(h.current,"p-splitter-gutter-resizing"),r.addClass(d.current,"p-splitter-resizing")},$=function(e){var t,r=j.current+(t="horizontal"===o.layout?100*("touchmove"===e.type?e.touches[0].pageX:e.pageX)/g.current-100*O.current/g.current:100*("touchmove"===e.type?e.touches[0].pageY:e.pageY)/g.current-100*O.current/g.current),n=R.current-t;M(r,n)&&(P.current=r,N.current=n,z.current.style.flexBasis="calc("+r+"% - "+(o.children.length-1)*o.gutterSize+"px)",E.current.style.flexBasis="calc("+n+"% - "+(o.children.length-1)*o.gutterSize+"px)")},q=function(e){I((function(t){for(var r=[];0<o.children.length;f("index"))r[0]=K(t,0);return r[x.current]=P.current,r[x.current+1]=N.current,o.onResizeEnd&&o.onResizeEnd({originalEvent:e,sizes:r}),T&&J(r),r})),r.removeClass(h.current,"p-splitter-gutter-resizing"),r.removeClass(d.current,"p-splitter-resizing"),w.current=!1,g.current=null,O.current=null,z.current=null,E.current=null,j.current=null,P.current=null,R.current=null,N.current=null,x.current=null},G=function(e,t){U(e,t),k(),X()},Q=function(e,t){U(e,t),window.addEventListener("touchmove",V,{passive:!1,cancelable:!1}),window.addEventListener("touchend",Z)},V=function(e){$(e)},Z=function e(t){q(t),window.removeEventListener("touchmove",V),window.removeEventListener("touchend",e)};e.useImperativeHandle(i,(function(){return{props:o,getElement:function(){return d.current}}})),e.useEffect((function(){var e;(e=d.current.children,c(e)||a(e)||s(e)||p()).filter((function(e){return r.hasClass(e,"p-splitter-panel")})).map((function(e){e.childNodes&&n.isNotEmpty(r.find(e,".p-splitter"))&&r.addClass(e,"p-splitter-panel-nested")}))}),[]),e.useEffect((function(){T&&F()}),[F,T]);var ee=function(t,r){var i=n.findDiffKeys(t.props,b.defaultProps),c=u("p-splitter-panel",t.props.className),a=r!==o.children.length-1&&e.createElement("div",{ref:function(e){return y.current[r]=e},className:"p-splitter-gutter",style:"horizontal"===o.layout?{width:o.gutterSize+"px"}:{height:o.gutterSize+"px"},onMouseDown:function(e){return G(e,r)},onTouchStart:function(e){return Q(e,r)},onTouchMove:function(e){return V(e)},onTouchEnd:function(e){return Z(e)}},e.createElement("div",{className:"p-splitter-gutter-handle"})),s="calc("+K(A,r)+"% - "+(D-1)*o.gutterSize+"px)";return e.createElement(e.Fragment,null,e.createElement("div",l({key:r,className:c,style:v(v({},t.props.style),{},{flexBasis:s})},i),t.props.children),a)},te=n.findDiffKeys(o,S.defaultProps),re=u("p-splitter p-component p-splitter-".concat(o.layout),o.className),ne=e.Children.map(o.children,ee);return e.createElement("div",l({ref:d,id:o.id,className:re,style:o.style},te),ne)})));b.displayName="SplitterPanel",b.defaultProps={__TYPE:"SplitterPanel",className:null,minSize:null,size:null,style:null},S.displayName="Splitter",S.defaultProps={__TYPE:"Splitter",className:null,gutterSize:4,id:null,layout:"horizontal",onResizeEnd:null,stateKey:null,stateStorage:"session",style:null};export{S as Splitter,b as SplitterPanel};