@geoffcox/react-splitter/build/index.js

A splitter for React components that leverages CSS grid templates for simple and consistent resizing.

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("ReactSplitter",["react"],t):"object"==typeof exports?exports.ReactSplitter=t(require("react")):e.ReactSplitter=t(e.React)}(self,(e=>(()=>{var t={58:(e,t,n)=>{"use strict";n.d(t,{Z:()=>a});var r=n(864),i=n.n(r),o=n(352),s=n.n(o)()(i());s.push([e.id,"\n/* The default splitter within a react-split */\n.react-split > .split-container > .splitter .default-splitter {\n  box-sizing: border-box;\n  height: 100%;\n  outline: none;\n  overflow: hidden;\n  user-select: none;\n  width: 100%;\n  --default-splitter-line-color: silver;\n  --default-splitter-line-hover-color: black;\n  --default-splitter-line-margin: 2px;\n  --default-splitter-line-size: 3px;\n}\n\n.react-split > .split-container.horizontal > .splitter .default-splitter {\n  cursor: row-resize;\n}\n\n.react-split > .split-container.vertical > .splitter .default-splitter {\n  cursor: col-resize;\n}\n\n/* The thin line within a default splitter hit area */\n.react-split > .split-container > .splitter .default-splitter > .line {\n  background: var(--default-splitter-line-color);\n}\n\n.react-split > .split-container > .splitter .default-splitter:hover > .line {\n  background: var(--default-splitter-line-hover-color);\n}\n\n.react-split > .split-container.horizontal > .splitter .default-splitter > .line {\n  height: var(--default-splitter-line-size);\n  width: 100%;\n  margin-top: var(--default-splitter-line-margin);\n  margin-left: 0;\n}\n\n.react-split > .split-container.vertical > .splitter .default-splitter > .line {\n  height: 100%;\n  width: var(--default-splitter-line-size);\n  margin-top: 0;\n  margin-left: var(--default-splitter-line-margin);\n}","",{version:3,sources:["webpack://./src/defaultSplitter.css"],names:[],mappings:";AACA,8CAA8C;AAC9C;EACE,sBAAsB;EACtB,YAAY;EACZ,aAAa;EACb,gBAAgB;EAChB,iBAAiB;EACjB,WAAW;EACX,qCAAqC;EACrC,0CAA0C;EAC1C,mCAAmC;EACnC,iCAAiC;AACnC;;AAEA;EACE,kBAAkB;AACpB;;AAEA;EACE,kBAAkB;AACpB;;AAEA,qDAAqD;AACrD;EACE,8CAA8C;AAChD;;AAEA;EACE,oDAAoD;AACtD;;AAEA;EACE,yCAAyC;EACzC,WAAW;EACX,+CAA+C;EAC/C,cAAc;AAChB;;AAEA;EACE,YAAY;EACZ,wCAAwC;EACxC,aAAa;EACb,gDAAgD;AAClD",sourcesContent:["\n/* The default splitter within a react-split */\n.react-split > .split-container > .splitter .default-splitter {\n  box-sizing: border-box;\n  height: 100%;\n  outline: none;\n  overflow: hidden;\n  user-select: none;\n  width: 100%;\n  --default-splitter-line-color: silver;\n  --default-splitter-line-hover-color: black;\n  --default-splitter-line-margin: 2px;\n  --default-splitter-line-size: 3px;\n}\n\n.react-split > .split-container.horizontal > .splitter .default-splitter {\n  cursor: row-resize;\n}\n\n.react-split > .split-container.vertical > .splitter .default-splitter {\n  cursor: col-resize;\n}\n\n/* The thin line within a default splitter hit area */\n.react-split > .split-container > .splitter .default-splitter > .line {\n  background: var(--default-splitter-line-color);\n}\n\n.react-split > .split-container > .splitter .default-splitter:hover > .line {\n  background: var(--default-splitter-line-hover-color);\n}\n\n.react-split > .split-container.horizontal > .splitter .default-splitter > .line {\n  height: var(--default-splitter-line-size);\n  width: 100%;\n  margin-top: var(--default-splitter-line-margin);\n  margin-left: 0;\n}\n\n.react-split > .split-container.vertical > .splitter .default-splitter > .line {\n  height: 100%;\n  width: var(--default-splitter-line-size);\n  margin-top: 0;\n  margin-left: var(--default-splitter-line-margin);\n}"],sourceRoot:""}]);const a=s},672:(e,t,n)=>{"use strict";n.d(t,{Z:()=>a});var r=n(864),i=n.n(r),o=n(352),s=n.n(o)()(i());s.push([e.id,'/* The top-level element of the splitter*/\n.react-split {\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n  --react-split-min-primary: 0;\n  --react-split-min-secondary: 0;\n  --react-split-primary: 50%;\n  --react-split-splitter: 7px;\n}\n\n/* The container for the primary pane, splitter, and secondary pane.*/\n.react-split > .split-container {\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n  display: grid;\n}\n\n/* When the container is splitting horizontally */\n.react-split > .split-container.horizontal {\n  grid-template-columns: 1fr;\n  grid-template-rows: minmax(var(--react-split-min-primary),var(--react-split-primary)) var(--react-split-splitter) minmax(var(--react-split-min-secondary), 1fr);\n  grid-template-areas: "primary" "split" "secondary";\n}\n\n/* When the container is splitting vertical */\n.react-split > .split-container.vertical {\n  grid-template-columns: minmax(var(--react-split-min-primary),var(--react-split-primary)) var(--react-split-splitter) minmax(var(--react-split-min-secondary), 1fr);\n  grid-template-rows: 1fr;\n  grid-template-areas: "primary split secondary";\n}\n\n/* The primary pane. This is either the left or top depending on the split type */\n.react-split > .split-container > .primary {\n  grid-area: primary;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n\n.react-split > .split-container.horizontal > .primary {\n  height: auto;\n  width: 100%;\n}\n\n.react-split > .split-container.vertical > .primary {\n  height: 100%;\n  width: auto;\n}\n\n/* The splitter between panes. */\n.react-split > .split-container > .splitter {\n  grid-area: split;\n  background: transparent;\n  user-select: none;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n\n.react-split > .split-container.horizontal > .splitter {\n  height: auto;\n  width: 100%;\n  cursor: row-resize;\n}\n\n.react-split > .split-container.vertical > .splitter {\n  height: 100%;\n  width: auto;\n  cursor: col-resize;\n}\n\n/* The secondary pane. This is either the right or bottom depending on the split type */\n.react-split > .split-container >.secondary {\n  grid-area: secondary;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n\n.react-split > .split-container.horizontal > .secondary {\n  height: auto;\n  width: 100%;\n}\n\n.react-split > .split-container.vertical > .secondary {\n  height: 100%;\n  width: auto;\n}\n\n/* The content within the primary pane, splitter, or secondary pane.*/\n.react-split .full-content {\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n',"",{version:3,sources:["webpack://./src/split.css"],names:[],mappings:"AAAA,yCAAyC;AACzC;EACE,WAAW;EACX,YAAY;EACZ,sBAAsB;EACtB,aAAa;EACb,gBAAgB;EAChB,4BAA4B;EAC5B,8BAA8B;EAC9B,0BAA0B;EAC1B,2BAA2B;AAC7B;;AAEA,qEAAqE;AACrE;EACE,WAAW;EACX,YAAY;EACZ,sBAAsB;EACtB,aAAa;EACb,gBAAgB;EAChB,aAAa;AACf;;AAEA,iDAAiD;AACjD;EACE,0BAA0B;EAC1B,+JAA+J;EAC/J,kDAAkD;AACpD;;AAEA,6CAA6C;AAC7C;EACE,kKAAkK;EAClK,uBAAuB;EACvB,8CAA8C;AAChD;;AAEA,iFAAiF;AACjF;EACE,kBAAkB;EAClB,sBAAsB;EACtB,aAAa;EACb,gBAAgB;AAClB;;AAEA;EACE,YAAY;EACZ,WAAW;AACb;;AAEA;EACE,YAAY;EACZ,WAAW;AACb;;AAEA,gCAAgC;AAChC;EACE,gBAAgB;EAChB,uBAAuB;EACvB,iBAAiB;EACjB,sBAAsB;EACtB,aAAa;EACb,gBAAgB;AAClB;;AAEA;EACE,YAAY;EACZ,WAAW;EACX,kBAAkB;AACpB;;AAEA;EACE,YAAY;EACZ,WAAW;EACX,kBAAkB;AACpB;;AAEA,uFAAuF;AACvF;EACE,oBAAoB;EACpB,sBAAsB;EACtB,aAAa;EACb,gBAAgB;AAClB;;AAEA;EACE,YAAY;EACZ,WAAW;AACb;;AAEA;EACE,YAAY;EACZ,WAAW;AACb;;AAEA,qEAAqE;AACrE;EACE,WAAW;EACX,YAAY;EACZ,sBAAsB;EACtB,aAAa;EACb,gBAAgB;AAClB",sourcesContent:['/* The top-level element of the splitter*/\n.react-split {\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n  --react-split-min-primary: 0;\n  --react-split-min-secondary: 0;\n  --react-split-primary: 50%;\n  --react-split-splitter: 7px;\n}\n\n/* The container for the primary pane, splitter, and secondary pane.*/\n.react-split > .split-container {\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n  display: grid;\n}\n\n/* When the container is splitting horizontally */\n.react-split > .split-container.horizontal {\n  grid-template-columns: 1fr;\n  grid-template-rows: minmax(var(--react-split-min-primary),var(--react-split-primary)) var(--react-split-splitter) minmax(var(--react-split-min-secondary), 1fr);\n  grid-template-areas: "primary" "split" "secondary";\n}\n\n/* When the container is splitting vertical */\n.react-split > .split-container.vertical {\n  grid-template-columns: minmax(var(--react-split-min-primary),var(--react-split-primary)) var(--react-split-splitter) minmax(var(--react-split-min-secondary), 1fr);\n  grid-template-rows: 1fr;\n  grid-template-areas: "primary split secondary";\n}\n\n/* The primary pane. This is either the left or top depending on the split type */\n.react-split > .split-container > .primary {\n  grid-area: primary;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n\n.react-split > .split-container.horizontal > .primary {\n  height: auto;\n  width: 100%;\n}\n\n.react-split > .split-container.vertical > .primary {\n  height: 100%;\n  width: auto;\n}\n\n/* The splitter between panes. */\n.react-split > .split-container > .splitter {\n  grid-area: split;\n  background: transparent;\n  user-select: none;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n\n.react-split > .split-container.horizontal > .splitter {\n  height: auto;\n  width: 100%;\n  cursor: row-resize;\n}\n\n.react-split > .split-container.vertical > .splitter {\n  height: 100%;\n  width: auto;\n  cursor: col-resize;\n}\n\n/* The secondary pane. This is either the right or bottom depending on the split type */\n.react-split > .split-container >.secondary {\n  grid-area: secondary;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n\n.react-split > .split-container.horizontal > .secondary {\n  height: auto;\n  width: 100%;\n}\n\n.react-split > .split-container.vertical > .secondary {\n  height: 100%;\n  width: auto;\n}\n\n/* The content within the primary pane, splitter, or secondary pane.*/\n.react-split .full-content {\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n  outline: none;\n  overflow: hidden;\n}\n'],sourceRoot:""}]);const a=s},352:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n="",r=void 0!==t[5];return t[4]&&(n+="@supports (".concat(t[4],") {")),t[2]&&(n+="@media ".concat(t[2]," {")),r&&(n+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),n+=e(t),r&&(n+="}"),t[2]&&(n+="}"),t[4]&&(n+="}"),n})).join("")},t.i=function(e,n,r,i,o){"string"==typeof e&&(e=[[null,e,void 0]]);var s={};if(r)for(var a=0;a<this.length;a++){var l=this[a][0];null!=l&&(s[l]=!0)}for(var c=0;c<e.length;c++){var p=[].concat(e[c]);r&&s[p[0]]||(void 0!==o&&(void 0===p[5]||(p[1]="@layer".concat(p[5].length>0?" ".concat(p[5]):""," {").concat(p[1],"}")),p[5]=o),n&&(p[2]?(p[1]="@media ".concat(p[2]," {").concat(p[1],"}"),p[2]=n):p[2]=n),i&&(p[4]?(p[1]="@supports (".concat(p[4],") {").concat(p[1],"}"),p[4]=i):p[4]="".concat(i)),t.push(p))}},t}},864:e=>{"use strict";e.exports=function(e){var t=e[1],n=e[3];if(!n)return t;if("function"==typeof btoa){var r=btoa(unescape(encodeURIComponent(JSON.stringify(n)))),i="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(r),o="/*# ".concat(i," */");return[t].concat([o]).join("\n")}return[t].join("\n")}},372:(e,t,n)=>{"use strict";var r=n(567);function i(){}function o(){}o.resetWarningCache=i,e.exports=function(){function e(e,t,n,i,o,s){if(s!==r){var a=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 a.name="Invariant Violation",a}}function t(){return e}e.isRequired=e;var n={array:e,bigint: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:o,resetWarningCache:i};return n.PropTypes=n,n}},652:(e,t,n)=>{e.exports=n(372)()},567:e=>{"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},701:e=>{"use strict";var t=[];function n(e){for(var n=-1,r=0;r<t.length;r++)if(t[r].identifier===e){n=r;break}return n}function r(e,r){for(var o={},s=[],a=0;a<e.length;a++){var l=e[a],c=r.base?l[0]+r.base:l[0],p=o[c]||0,u="".concat(c," ").concat(p);o[c]=p+1;var h=n(u),d={css:l[1],media:l[2],sourceMap:l[3],supports:l[4],layer:l[5]};if(-1!==h)t[h].references++,t[h].updater(d);else{var f=i(d,r);r.byIndex=a,t.splice(a,0,{identifier:u,updater:f,references:1})}s.push(u)}return s}function i(e,t){var n=t.domAPI(t);return n.update(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap&&t.supports===e.supports&&t.layer===e.layer)return;n.update(e=t)}else n.remove()}}e.exports=function(e,i){var o=r(e=e||[],i=i||{});return function(e){e=e||[];for(var s=0;s<o.length;s++){var a=n(o[s]);t[a].references--}for(var l=r(e,i),c=0;c<o.length;c++){var p=n(o[c]);0===t[p].references&&(t[p].updater(),t.splice(p,1))}o=l}}},80:e=>{"use strict";var t={};e.exports=function(e,n){var r=function(e){if(void 0===t[e]){var n=document.querySelector(e);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}t[e]=n}return t[e]}(e);if(!r)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");r.appendChild(n)}},182:e=>{"use strict";e.exports=function(e){var t=document.createElement("style");return e.setAttributes(t,e.attributes),e.insert(t,e.options),t}},850:(e,t,n)=>{"use strict";e.exports=function(e){var t=n.nc;t&&e.setAttribute("nonce",t)}},236:e=>{"use strict";e.exports=function(e){var t=e.insertStyleElement(e);return{update:function(n){!function(e,t,n){var r="";n.supports&&(r+="@supports (".concat(n.supports,") {")),n.media&&(r+="@media ".concat(n.media," {"));var i=void 0!==n.layer;i&&(r+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),r+=n.css,i&&(r+="}"),n.media&&(r+="}"),n.supports&&(r+="}");var o=n.sourceMap;o&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," */")),t.styleTagTransform(r,e,t.options)}(t,e,n)},remove:function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(t)}}}},213:e=>{"use strict";e.exports=function(e,t){if(t.styleSheet)t.styleSheet.cssText=e;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(e))}}},359:t=>{"use strict";t.exports=e}},n={};function r(e){var i=n[e];if(void 0!==i)return i.exports;var o=n[e]={id:e,exports:{}};return t[e](o,o.exports,r),o.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.nc=void 0;var i={};return(()=>{"use strict";r.r(i),r.d(i,{DefaultSplitter:()=>g,Split:()=>$});var e=r(359),t=r(701),n=r.n(t),o=r(236),s=r.n(o),a=r(80),l=r.n(a),c=r(850),p=r.n(c),u=r(182),h=r.n(u),d=r(213),f=r.n(d),A=r(58),m={};m.styleTagTransform=f(),m.setAttributes=p(),m.insert=l().bind(null,"head"),m.domAPI=s(),m.insertStyleElement=h(),n()(A.Z,m),A.Z&&A.Z.locals&&A.Z.locals;const v=e=>(e%2==0?2:3)+"px",g=t=>{const{dragging:n,pixelSize:r,color:i="silver",hoverColor:o="gray",dragColor:s="black"}=t,a={"--default-splitter-line-margin":(l=r,`${Math.max(0,Math.floor(l/2)-1)}px`),"--default-splitter-line-size":v(r),"--default-splitter-line-color":n?s:i,"--default-splitter-line-hover-color":n?s:o};var l;return e.createElement("div",{className:"default-splitter",style:a},e.createElement("div",{className:"line"}))};function b(){return b=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},b.apply(this,arguments)}function y(e,t){return y=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},y(e,t)}var E=r(652),C=r.n(E),w=function(){if("undefined"!=typeof Map)return Map;function e(e,t){var n=-1;return e.some((function(e,r){return e[0]===t&&(n=r,!0)})),n}return function(){function t(){this.__entries__=[]}return Object.defineProperty(t.prototype,"size",{get:function(){return this.__entries__.length},enumerable:!0,configurable:!0}),t.prototype.get=function(t){var n=e(this.__entries__,t),r=this.__entries__[n];return r&&r[1]},t.prototype.set=function(t,n){var r=e(this.__entries__,t);~r?this.__entries__[r][1]=n:this.__entries__.push([t,n])},t.prototype.delete=function(t){var n=this.__entries__,r=e(n,t);~r&&n.splice(r,1)},t.prototype.has=function(t){return!!~e(this.__entries__,t)},t.prototype.clear=function(){this.__entries__.splice(0)},t.prototype.forEach=function(e,t){void 0===t&&(t=null);for(var n=0,r=this.__entries__;n<r.length;n++){var i=r[n];e.call(t,i[1],i[0])}},t}()}(),_="undefined"!=typeof window&&"undefined"!=typeof document&&window.document===document,B=void 0!==r.g&&r.g.Math===Math?r.g:"undefined"!=typeof self&&self.Math===Math?self:"undefined"!=typeof window&&window.Math===Math?window:Function("return this")(),x="function"==typeof requestAnimationFrame?requestAnimationFrame.bind(B):function(e){return setTimeout((function(){return e(Date.now())}),1e3/60)},z=["top","right","bottom","left","width","height","size","weight"],O="undefined"!=typeof MutationObserver,T=function(){function e(){this.connected_=!1,this.mutationEventsAdded_=!1,this.mutationsObserver_=null,this.observers_=[],this.onTransitionEnd_=this.onTransitionEnd_.bind(this),this.refresh=function(e,t){var n=!1,r=!1,i=0;function o(){n&&(n=!1,e()),r&&a()}function s(){x(o)}function a(){var e=Date.now();if(n){if(e-i<2)return;r=!0}else n=!0,r=!1,setTimeout(s,20);i=e}return a}(this.refresh.bind(this))}return e.prototype.addObserver=function(e){~this.observers_.indexOf(e)||this.observers_.push(e),this.connected_||this.connect_()},e.prototype.removeObserver=function(e){var t=this.observers_,n=t.indexOf(e);~n&&t.splice(n,1),!t.length&&this.connected_&&this.disconnect_()},e.prototype.refresh=function(){this.updateObservers_()&&this.refresh()},e.prototype.updateObservers_=function(){var e=this.observers_.filter((function(e){return e.gatherActive(),e.hasActive()}));return e.forEach((function(e){return e.broadcastActive()})),e.length>0},e.prototype.connect_=function(){_&&!this.connected_&&(document.addEventListener("transitionend",this.onTransitionEnd_),window.addEventListener("resize",this.refresh),O?(this.mutationsObserver_=new MutationObserver(this.refresh),this.mutationsObserver_.observe(document,{attributes:!0,childList:!0,characterData:!0,subtree:!0})):(document.addEventListener("DOMSubtreeModified",this.refresh),this.mutationEventsAdded_=!0),this.connected_=!0)},e.prototype.disconnect_=function(){_&&this.connected_&&(document.removeEventListener("transitionend",this.onTransitionEnd_),window.removeEventListener("resize",this.refresh),this.mutationsObserver_&&this.mutationsObserver_.disconnect(),this.mutationEventsAdded_&&document.removeEventListener("DOMSubtreeModified",this.refresh),this.mutationsObserver_=null,this.mutationEventsAdded_=!1,this.connected_=!1)},e.prototype.onTransitionEnd_=function(e){var t=e.propertyName,n=void 0===t?"":t;z.some((function(e){return!!~n.indexOf(e)}))&&this.refresh()},e.getInstance=function(){return this.instance_||(this.instance_=new e),this.instance_},e.instance_=null,e}(),R=function(e,t){for(var n=0,r=Object.keys(t);n<r.length;n++){var i=r[n];Object.defineProperty(e,i,{value:t[i],enumerable:!1,writable:!1,configurable:!0})}return e},S=function(e){return e&&e.ownerDocument&&e.ownerDocument.defaultView||B},M=P(0,0,0,0);function k(e){return parseFloat(e)||0}function D(e){for(var t=[],n=1;n<arguments.length;n++)t[n-1]=arguments[n];return t.reduce((function(t,n){return t+k(e["border-"+n+"-width"])}),0)}var W="undefined"!=typeof SVGGraphicsElement?function(e){return e instanceof S(e).SVGGraphicsElement}:function(e){return e instanceof S(e).SVGElement&&"function"==typeof e.getBBox};function j(e){return _?W(e)?function(e){var t=e.getBBox();return P(0,0,t.width,t.height)}(e):function(e){var t=e.clientWidth,n=e.clientHeight;if(!t&&!n)return M;var r=S(e).getComputedStyle(e),i=function(e){for(var t={},n=0,r=["top","right","bottom","left"];n<r.length;n++){var i=r[n],o=e["padding-"+i];t[i]=k(o)}return t}(r),o=i.left+i.right,s=i.top+i.bottom,a=k(r.width),l=k(r.height);if("border-box"===r.boxSizing&&(Math.round(a+o)!==t&&(a-=D(r,"left","right")+o),Math.round(l+s)!==n&&(l-=D(r,"top","bottom")+s)),!function(e){return e===S(e).document.documentElement}(e)){var c=Math.round(a+o)-t,p=Math.round(l+s)-n;1!==Math.abs(c)&&(a-=c),1!==Math.abs(p)&&(l-=p)}return P(i.left,i.top,a,l)}(e):M}function P(e,t,n,r){return{x:e,y:t,width:n,height:r}}var I=function(){function e(e){this.broadcastWidth=0,this.broadcastHeight=0,this.contentRect_=P(0,0,0,0),this.target=e}return e.prototype.isActive=function(){var e=j(this.target);return this.contentRect_=e,e.width!==this.broadcastWidth||e.height!==this.broadcastHeight},e.prototype.broadcastRect=function(){var e=this.contentRect_;return this.broadcastWidth=e.width,this.broadcastHeight=e.height,e},e}(),Y=function(e,t){var n,r,i,o,s,a,l,c=(r=(n=t).x,i=n.y,o=n.width,s=n.height,a="undefined"!=typeof DOMRectReadOnly?DOMRectReadOnly:Object,l=Object.create(a.prototype),R(l,{x:r,y:i,width:o,height:s,top:i,right:r+o,bottom:s+i,left:r}),l);R(this,{target:e,contentRect:c})},Z=function(){function e(e,t,n){if(this.activeObservations_=[],this.observations_=new w,"function"!=typeof e)throw new TypeError("The callback provided as parameter 1 is not a function.");this.callback_=e,this.controller_=t,this.callbackCtx_=n}return e.prototype.observe=function(e){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(e instanceof S(e).Element))throw new TypeError('parameter 1 is not of type "Element".');var t=this.observations_;t.has(e)||(t.set(e,new I(e)),this.controller_.addObserver(this),this.controller_.refresh())}},e.prototype.unobserve=function(e){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(e instanceof S(e).Element))throw new TypeError('parameter 1 is not of type "Element".');var t=this.observations_;t.has(e)&&(t.delete(e),t.size||this.controller_.removeObserver(this))}},e.prototype.disconnect=function(){this.clearActive(),this.observations_.clear(),this.controller_.removeObserver(this)},e.prototype.gatherActive=function(){var e=this;this.clearActive(),this.observations_.forEach((function(t){t.isActive()&&e.activeObservations_.push(t)}))},e.prototype.broadcastActive=function(){if(this.hasActive()){var e=this.callbackCtx_,t=this.activeObservations_.map((function(e){return new Y(e.target,e.broadcastRect())}));this.callback_.call(e,t,e),this.clearActive()}},e.prototype.clearActive=function(){this.activeObservations_.splice(0)},e.prototype.hasActive=function(){return this.activeObservations_.length>0},e}(),F="undefined"!=typeof WeakMap?new WeakMap:new w,q=function e(t){if(!(this instanceof e))throw new TypeError("Cannot call a class as a function.");if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");var n=T.getInstance(),r=new Z(t,n,this);F.set(this,r)};["observe","unobserve","disconnect"].forEach((function(e){q.prototype[e]=function(){var t;return(t=F.get(this))[e].apply(t,arguments)}}));const N=void 0!==B.ResizeObserver?B.ResizeObserver:q;var L=["client","offset","scroll","bounds","margin"];function H(e){var t=[];return L.forEach((function(n){e[n]&&t.push(n)})),t}function X(e,t){var n={};if(t.indexOf("client")>-1&&(n.client={top:e.clientTop,left:e.clientLeft,width:e.clientWidth,height:e.clientHeight}),t.indexOf("offset")>-1&&(n.offset={top:e.offsetTop,left:e.offsetLeft,width:e.offsetWidth,height:e.offsetHeight}),t.indexOf("scroll")>-1&&(n.scroll={top:e.scrollTop,left:e.scrollLeft,width:e.scrollWidth,height:e.scrollHeight}),t.indexOf("bounds")>-1){var r=e.getBoundingClientRect();n.bounds={top:r.top,right:r.right,bottom:r.bottom,left:r.left,width:r.width,height:r.height}}if(t.indexOf("margin")>-1){var i=getComputedStyle(e);n.margin={top:i?parseInt(i.marginTop):0,right:i?parseInt(i.marginRight):0,bottom:i?parseInt(i.marginBottom):0,left:i?parseInt(i.marginLeft):0}}return n}function U(e){return e&&e.ownerDocument&&e.ownerDocument.defaultView||window}var V=function(t){var n,r;return r=n=function(n){var r,i;function o(){for(var e,t=arguments.length,r=new Array(t),i=0;i<t;i++)r[i]=arguments[i];return(e=n.call.apply(n,[this].concat(r))||this).state={contentRect:{entry:{},client:{},offset:{},scroll:{},bounds:{},margin:{}}},e._animationFrameID=null,e._resizeObserver=null,e._node=null,e._window=null,e.measure=function(t){var n=X(e._node,H(e.props));t&&(n.entry=t[0].contentRect),e._animationFrameID=e._window.requestAnimationFrame((function(){null!==e._resizeObserver&&(e.setState({contentRect:n}),"function"==typeof e.props.onResize&&e.props.onResize(n))}))},e._handleRef=function(t){null!==e._resizeObserver&&null!==e._node&&e._resizeObserver.unobserve(e._node),e._node=t,e._window=U(e._node);var n=e.props.innerRef;n&&("function"==typeof n?n(e._node):n.current=e._node),null!==e._resizeObserver&&null!==e._node&&e._resizeObserver.observe(e._node)},e}i=n,(r=o).prototype=Object.create(i.prototype),r.prototype.constructor=r,y(r,i);var s=o.prototype;return s.componentDidMount=function(){this._resizeObserver=null!==this._window&&this._window.ResizeObserver?new this._window.ResizeObserver(this.measure):new N(this.measure),null!==this._node&&(this._resizeObserver.observe(this._node),"function"==typeof this.props.onResize&&this.props.onResize(X(this._node,H(this.props))))},s.componentWillUnmount=function(){null!==this._window&&this._window.cancelAnimationFrame(this._animationFrameID),null!==this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)},s.render=function(){var n=this.props,r=(n.innerRef,n.onResize,function(e,t){if(null==e)return{};var n,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n=o[r],t.indexOf(n)>=0||(i[n]=e[n]);return i}(n,["innerRef","onResize"]));return(0,e.createElement)(t,b({},r,{measureRef:this._handleRef,measure:this.measure,contentRect:this.state.contentRect}))},o}(e.Component),n.propTypes={client:C().bool,offset:C().bool,scroll:C().bool,bounds:C().bool,margin:C().bool,innerRef:C().oneOfType([C().object,C().func]),onResize:C().func},r}((function(e){var t=e.measure,n=e.measureRef,r=e.contentRect;return(0,e.children)({measure:t,measureRef:n,contentRect:r})}));V.displayName="Measure",V.propTypes.children=C().func;const G=V;var J=r(672),K={};K.styleTagTransform=f(),K.setAttributes=p(),K.insert=l().bind(null,"head"),K.domAPI=s(),K.insertStyleElement=h(),n()(J.Z,K),J.Z&&J.Z.locals&&J.Z.locals;const $=t=>{const{horizontal:n=!1,initialPrimarySize:r="50%",minPrimarySize:i="0px",minSecondarySize:o="0px",splitterSize:s="7px",renderSplitter:a,resetOnDoubleClick:l=!1,defaultSplitterColors:c={color:"silver",hover:"gray",drag:"black"},onSplitChanged:p,onMeasuredSizesChanged:u}=t,[h,d]=e.useState({height:0,width:0}),[f,A]=e.useState({height:0,width:0}),[m,v]=e.useState({height:0,width:0}),b=e.useMemo((()=>n?h.height:h.width),[n,h]),y=e.useMemo((()=>n?f.height:f.width),[n,f]),E=e.useMemo((()=>n?m.height:m.width),[n,m]),[C,w]=e.useState(void 0),[_,B]=e.useState(0),[x,z]=e.useState(0),[O,T]=e.useState(!1);e.useEffect((()=>{p&&p(void 0!==C?`${C}%`:r)}),[C,r]),e.useEffect((()=>{u&&u({primary:y,splitter:E,secondary:b-(y+E)})}),[n,b,y,E]);const R=e=>{e.bounds&&A({height:e.bounds.height,width:e.bounds.width})},S=e=>{e.bounds&&v({height:e.bounds.height,width:e.bounds.width})},M=e=>{e.currentTarget.setPointerCapture(e.pointerId),B(n?e.clientY:e.clientX),z(y),T(!0)},k=e=>{if(e.currentTarget.hasPointerCapture(e.pointerId)){const t=n?e.clientY:e.clientX,r=x+(t-_),i=Math.max(0,Math.min(r,b));w(i/b*100)}},D=e=>{e.currentTarget.releasePointerCapture(e.pointerId),T(!1)},W=()=>{l&&w(void 0)},j=e.Children.toArray(t.children),P=j.length>0?j[0]:e.createElement("div",null),I=j.length>1?j[1]:e.createElement("div",null),Y={primary:void 0!==C?`${C}%`:r,minPrimary:null!=i?i:"0px",minSecondary:null!=o?o:"0px"},Z={pixelSize:E,horizontal:n,dragging:O},F=null!=a?a:()=>e.createElement(g,Object.assign({},Z,{color:O?c.drag:c.color,hoverColor:O?c.drag:c.hover})),q=n?"split-container horizontal":"split-container vertical",N={"--react-split-min-primary":Y.minPrimary,"--react-split-min-secondary":Y.minSecondary,"--react-split-primary":Y.primary,"--react-split-splitter":s};return e.createElement(G,{bounds:!0,onResize:e=>{e.bounds&&d({height:e.bounds.height,width:e.bounds.width})}},(({measureRef:t})=>e.createElement("div",{className:"react-split",ref:t},e.createElement("div",{className:q,style:N},e.createElement("div",{className:"primary"},e.createElement(G,{bounds:!0,onResize:R},(({measureRef:t})=>e.createElement("div",{className:"full-content",ref:t},P)))),e.createElement("div",{className:"splitter",tabIndex:-1,onPointerDown:M,onPointerUp:D,onPointerMove:k,onDoubleClick:W},e.createElement(G,{bounds:!0,onResize:S},(({measureRef:t})=>e.createElement("div",{className:"full-content",ref:t},F(Z))))),e.createElement("div",{className:"secondary"},e.createElement("div",{className:"full-content"},I))))))}})(),i})()));
//# sourceMappingURL=index.js.map