react-collapse-pane - npm Package Compare versions

Comparing version 2.0.1 to 3.0.0

dist/components/Resizer/hooks/useTransition.d.ts

 import { CollapseOptions } from '../../SplitPane';
-import { Fade, Grow, Zoom } from '@material-ui/core';
+import { Fade, Grow, Zoom } from '@mui/material';
 declare type TransitionComponent = typeof Fade | typeof Grow | typeof Zoom;
 export declare const useTransition: (collapseOptions?: CollapseOptions | undefined) => TransitionComponent;
 export {};

dist/react-collapse-pane.cjs.development.js

@@ -11,3 +11,3 @@ 'use strict';
 var styled__default = _interopDefault(styled);
-var core = require('@material-ui/core');
+var material = require('@mui/material');
 var ReactDOM = require('react-dom');
@@ -181,6 +181,6 @@
 var transitionComponentMap = {
-  fade: core.Fade,
-  grow: core.Grow,
-  zoom: core.Zoom,
-  none: core.Fade
+  fade: material.Fade,
+  grow: material.Grow,
+  zoom: material.Zoom,
+  none: material.Fade
 };
@@ -486,3 +486,3 @@ var useTransition = function useTransition(collapseOptions) {
     onMouseLeave: handleMouseLeaveGrabber
-  }, collapseButton), React__default.createElement(core.Fade, {
+  }, collapseButton), React__default.createElement(material.Fade, {
     key: "resize.presentation.fadein",
@@ -493,3 +493,3 @@ "in": !isHovered
     style: _extends({}, getWidthOrHeight(1), css)
-  })), React__default.createElement(core.Fade, {
+  })), React__default.createElement(material.Fade, {
     key: "resize.presentation.fadeout",
@@ -496,0 +496,0 @@ "in": isHovered

dist/react-collapse-pane.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react"),i=e(n),t=require("styled-components"),s=e(t),l=require("@material-ui/core"),r=require("react-dom");function o(){return(o=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var i=arguments[n];for(var t in i)Object.prototype.hasOwnProperty.call(i,t)&&(e[t]=i[t])}return e}).apply(this,arguments)}function a(e,n){return n||(n=e.slice(0)),e.raw=n,e}var u,c,d,f,p,v,m,z,S=function(e){return n.useMemo((function(){return e.filter((function(e){return e})).join(" ")}),[e])},g=t.css(u||(u=a(["\n  width: 0;\n  height: 100%;\n"]))),h=t.css(c||(c=a(["\n  width: 100%;\n  height: 0;\n"]))),b=t.css(d||(d=a(["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n"]))),C=s.div(f||(f=a(["\n  position: relative;\n  outline: none;\n  border: 0;\n  overflow: hidden;\n  display: flex;\n  flex-grow: 1;\n  flex-shrink: 1;\n  ","\n  ","\n"])),(function(e){return e.$isVertical?g:h}),(function(e){return e.$shouldAnimate&&"transition: flex-basis "+e.$timeout+"ms ease-in-out"})),x=s.div(p||(p=a(["\n  ","\n  ","\n"])),b,(function(e){return e.$isCollapsed&&t.css(v||(v=a(["\n      * {\n        z-index: 0;\n      }\n      z-index: 0;\n    "])))})),y=s.div(m||(m=a(["\n  ","\n  ",";\n  opacity: ",";\n  transition: opacity ","ms ease-in-out;\n"])),(function(e){return e.$isCollapsed&&b}),(function(e){return e.$isCollapsed&&t.css(z||(z=a(["\n      z-index: 1;\n    "])))}),(function(e){return e.$isCollapsed?1:0}),(function(e){return e.$timeout})),k=function(e){var i=e.size,t=e.minSize,s=e.isCollapsed,l=e.collapseOverlayCss,r=void 0===l?{background:"rgba(220,220,220, 0.1)"}:l,a=e.isVertical,u=e.children,c=e.forwardRef,d=e.collapsedIndices,f=e.transitionTimeout,p=S(["Pane",e.split,e.className]),v=n.useMemo((function(){return null!=f?f:500}),[f]),m=n.useState(!1),z=m[0],g=m[1],h=n.useRef(!1);n.useEffect((function(){h.current?0!==v&&(g(!0),setTimeout((function(){return g(!1)}),500)):h.current=!0}),[g,d,v]);var b=n.useMemo((function(){return a?{minWidth:t}:{minHeight:t}}),[t,a]),k=s?o({},b,{userSelect:"none"}):b;return n.createElement(C,{$isVertical:a,$shouldAnimate:0!==v&&z,$timeout:v,className:p,ref:c,style:{flexBasis:i}},n.createElement(y,{$isCollapsed:s,$timeout:v,style:r}),n.createElement(x,{$isCollapsed:s,style:k},u))};k.displayName="Pane";var M,w,E,I,$,O,T,V,R,L=n.memo(k),D=t.css(M||(M=a(["\n  top: 0;\n  bottom: 0;\n"]))),P=t.css(w||(w=a(["\n  right: 0;\n  left: 0;\n"]))),N=s.div(E||(E=a(["\n  cursor: pointer;\n  position: absolute;\n"]))),j=s.div(I||(I=a(["\n  z-index: 3;\n  position: absolute;\n  overflow: initial;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  ",";\n  ","\n"])),(function(e){return(e.$isVertical?"width":"height")+": "+e.$grabberSize}),(function(e){return e.$isVertical?D:P})),A=s.div($||($=a(["\n  position: absolute;\n  z-index: 3;\n  transform: ",";\n  cursor: ",";\n  ","\n"])),(function(e){return e.$isVertical?"translateX("+(e.$isLtr?"-":"")+"50%)":"translateY(-50%)"}),(function(e){return!e.$isCollapsed&&(e.$isVertical?"col-resize":"row-resize")}),(function(e){return e.$isVertical?D:P})),B=s.div(O||(O=a(["\n  z-index: 2;\n  position: absolute;\n  ","\n"])),(function(e){return e.$isVertical?D:P})),F={fade:l.Fade,grow:l.Grow,zoom:l.Zoom,none:l.Fade},U=function(e,n){if("number"==typeof n){if(n>0)return n}else if(n instanceof Array){var i=n[e];if(i>0)return i}return 50},_=function e(n){var i=n.index,t=n.minSizes,s=n.offset,l=n.sizes,r=n.collapsedIndices,o=n.collapsedSize;if(!s||i<0||i+1>=l.length)return 0;var a=function(e){return r.includes(e)},u=a(i)?o:U(i,t),c=a(i+1)?o:U(i+1,t),d=l[i]+s,f=l[i+1]-s;if(s<0&&d<u){var p=d-u;s-=p-e({sizes:l,index:i-1,offset:p,minSizes:t,collapsedIndices:r,collapsedSize:o})}else if(s>0&&f<c){var v=c-f;s-=v-e({sizes:l,index:i+1,offset:v,minSizes:t,collapsedIndices:r,collapsedSize:o})}return l[i]+=s,l[i+1]-=s,s},q=function(e){var n=e.offset,i=e.isReversed,t=e.collapsedIndices,s=e.minSizes,l=e.sizes,r=e.index,o=e.collapsedSize;if(i?n>0:n<0)for(var a=i?r:r+1;i?a>0:a<l.length-1;i?a--:a++)t.includes(a)&&_({sizes:l,index:i?a-1:a,offset:n,minSizes:s,collapsedIndices:t,collapsedSize:o})},X=t.css(T||(T=a(["\n  left: 0;\n  right: 0;\n  flex-direction: row;\n"]))),Y=t.css(V||(V=a(["\n  bottom: 0;\n  top: 0;\n  flex-direction: column;\n  min-height: 100%;\n  width: 100%;\n"]))),G=s.div(R||(R=a(["\n  display: flex;\n  flex: 1;\n  height: 100%;\n  position: absolute;\n  outline: none;\n  overflow: hidden;\n  ","\n"])),(function(e){return"vertical"===e.split?X:Y})),H=function(e){return e.reduce((function(e,n){return e+n}),0)},W=function(e,n){var i=null;return function(){for(var t=arguments.length,s=new Array(t),l=0;l<t;l++)s[l]=arguments[l];null!==i&&(clearTimeout(i),i=null),i=setTimeout((function(){return e.apply(void 0,s)}),n)}},Z={grabberSize:"1rem",css:{backgroundColor:"rgba(120, 120, 120, 0.3)"},hoverCss:{backgroundColor:"rgba(120, 120, 120, 0.6)"}},J=function(e){var t=e.isVertical,s=e.split,r=e.className,a=e.paneIndex,u=e.onDragStarted,c=e.collapseOptions,d=e.onCollapseToggle,f=e.isLtr,p=e.isCollapsed,v=o({},Z,e.resizerOptions),m=v.grabberSize,z=v.css,g=v.hoverCss,h=S(["Resizer",s,r]),b=n.useMemo((function(){return e=m,isNaN(e)?e.toString():e+"px";var e}),[m]),C=function(e){return n.useMemo((function(){var n;return F[null!=(n=null==e?void 0:e.buttonTransition)?n:"fade"]}),[e])}(c),x=n.useState(!1),y=x[0],k=x[1],M=n.useCallback((function(e){e.preventDefault(),p||u({index:a,position:e})}),[a,p,u]),w=n.useCallback((function(e){e.preventDefault(),p||u({index:a,position:e.touches[0]})}),[a,p,u]),E=n.useCallback((function(e){e.stopPropagation(),d(a)}),[a,d]),I=n.useCallback((function(e){e.stopPropagation()}),[]),$=n.useCallback(W((function(){return k(!0)}),50),[k]),O=n.useCallback((function(){$()}),[$]),T=n.useCallback(W((function(){return k(!1)}),100),[k]),V=n.useCallback((function(){return T()}),[T]),R=n.useCallback((function(e){return t?{width:e}:{height:e}}),[t]),L=n.useMemo((function(){var e;return Math.max(100-(null!=(e=null==c?void 0:c.buttonPositionOffset)?e:0),0)}),[c]),D=n.useMemo((function(){var e;return Math.max(100+(null!=(e=null==c?void 0:c.buttonPositionOffset)?e:0),0)}),[c]),P="none"!==(null==c?void 0:c.buttonTransition),U=c?i.createElement(j,{$isVertical:t,$grabberSize:b,$isLtr:f},i.createElement("div",{style:{flex:"1 1 "+L}}),i.createElement(C,{in:!P||y,timeout:P?c.buttonTransitionTimeout:0,style:{flex:"0 0 0",position:"relative"}},i.createElement(N,{$isVertical:t,onClick:E,onMouseDown:I},p?c.afterToggleButton:c.beforeToggleButton)),i.createElement("div",{style:{flex:"1 1 "+D}})):null;return i.createElement("div",{key:"grabber.root",style:{position:"relative"}},i.createElement(A,{key:"grabber",$isVertical:t,$isCollapsed:p,$isLtr:f,style:R(m),role:"presentation",className:h,onMouseDown:M,onTouchStart:w,onMouseEnter:O,onMouseLeave:V},U),i.createElement(l.Fade,{key:"resize.presentation.fadein",in:!y},i.createElement(B,{$isVertical:t,style:o({},R(1),z)})),i.createElement(l.Fade,{key:"resize.presentation.fadeout",in:y},i.createElement(B,{$isVertical:t,style:o({},R(1),g)})))};J.displayName="Resizer";var K,Q,ee,ne=function(e,i){return n.useEffect((function(){var n=new AbortController;if(i)return window.addEventListener(e,i),function(){window.removeEventListener(e,i),n.abort()}}),[e,i])},ie=function(e){return n.useMemo((function(){return function(e){return"boolean"!=typeof e&&!(null==e||!e.collapseDirection)&&["right","down"].includes(e.collapseDirection)}(e)}),[e])},te=s.div(K||(K=a(["\n  width: 1.8rem;\n  height: 1.8rem;\n  border-radius: 300px;\n  background: #0092d1;\n  cursor: pointer;\n  user-select: none;\n  text-align: center;\n  color: white;\n  border: 2px rgba(200, 200, 200, 0.5) solid;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  svg {\n    width: 100%;\n    height: 100%;\n  }\n"])));!function(e){e[e.left=0]="left",e[e.right=1]="right",e[e.up=2]="up",e[e.down=3]="down"}(ee||(ee={}));var se=((Q={})[ee.left]="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z",Q[ee.right]="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z",Q[ee.up]="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z",Q[ee.down]="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z",Q),le=function(e){return i.createElement("svg",Object.assign({},e,{focusable:"false",fill:"white",viewBox:"0 0 24 24","aria-hidden":"true"}),i.createElement("path",{d:se[e.dir]}))},re=function(e){var n=e.isVertical?[ee.left,ee.right]:[ee.up,ee.down],t=e.isReversed?n.reverse():n,s=t[0],l=t[1];return i.createElement(te,null,i.createElement(le,{dir:e.isBefore?e.isLtr?s:l:e.isLtr?l:s}))},oe=function(e){return{beforeToggleButton:i.createElement(re,Object.assign({},e,{isBefore:!0})),afterToggleButton:i.createElement(re,Object.assign({},e,{isBefore:!1})),collapseDirection:e.isVertical?"left":"up",overlayCss:{backgroundColor:"rgba(0, 0, 0, 0.4)"},buttonTransitionTimeout:200,buttonTransition:"grow",collapsedSize:50,collapseTransitionTimeout:500,buttonPositionOffset:0}},ae=function(e){var t,s,l,a,u,c=function(e){var i=e.collapsedSizes,t=e.children,s=e.collapse;return n.useMemo((function(){return(null==i?void 0:i.length)===t.length&&s?i:new Array(t.length).fill(null)}),[t.length,s,i])}(e),d=n.useMemo((function(){return"vertical"!==s||"rtl"!==l}),[s=(t=e).split,l=t.dir]),f="vertical"===e.split,p=ie(e.collapse),v=function(e){var n=e.originalValue,i=function(e,n){if(null==e)return{};var i,t,s={},l=Object.keys(e);for(t=0;t<l.length;t++)n.indexOf(i=l[t])>=0||(s[i]=e[i]);return s}(e,["originalValue"]);if(void 0!==n&&!1!==n)return!0===n?oe(i):o({},oe(i),n)}({isVertical:f,isLtr:d,originalValue:e.collapse,isReversed:p}),m=n.useState(null!=(u=null==(a=c)?void 0:a.reduce((function(e,n,i){return null!==n?[].concat(e,[i]):[].concat(e)}),[]))?u:[]),z=m[0],g=m[1],h=function(e){var i,t=e.children,s=e.split,l=e.initialSizes,a=e.minSizes,u=e.hooks,c=e.collapsedIndices,d=e.collapsedSizes,f=e.collapseOptions,p=e.isVertical,v=e.isLtr,m=Array.isArray(t)?t:[t],z=n.useRef(new Map),S=function(e){var i=e.minSizes,t=e.numSizes,s=e.collapsedIndices,l=e.collapseOptions;return n.useMemo((function(){return Array.from({length:t}).map((function(e,n){var t;return s.includes(n)?null!=(t=null==l?void 0:l.collapsedSize)?t:50:U(n,i)}))}),[t,l,s,i])}({minSizes:a,numSizes:m.length,collapseOptions:f,collapsedIndices:c}),g=function(e){var i=e.collapseOptions;return n.useMemo((function(){var e;return null!=(e=null==i?void 0:i.collapsedSize)?e:50}),[i])}({collapseOptions:f}),h=function(e){var i=e.paneRefs,t=e.children,s=e.minSizes;return n.useMemo((function(){var e=i.current;return i.current=new Map,t.map((function(t,l){var r="index."+l,o=e.get(r)||n.createRef();return i.current.set(r,o),{key:r,node:t,ref:o,minSize:s[l]}}))}),[t,s,i])}({minSizes:S,children:m,paneRefs:z}),b=ie(f),C=n.useMemo((function(){return m.map((function(e,n){var i;return null!=(i=null==l?void 0:l[n])?i:1}))}),[m,l]),x=n.useState(C),y=x[0],k=x[1],M=n.useState(y),w=M[0],E=M[1],I=n.useState(null!=d?d:new Array(m.length).fill(null)),$=I[0],O=I[1],T=function(e){var i=e.sizes,t=e.isLtr,s=e.minSizes,l=e.collapsedIndices,r=e.isReversed,o=e.collapsedSize;return n.useCallback((function(e){var n=[].concat(i),a=e.index,u=t?e.offset:-e.offset;return _({sizes:n,index:a,offset:u,minSizes:s,collapsedIndices:l,collapsedSize:o}),q({collapsedSize:o,sizes:n,minSizes:s,collapsedIndices:l,isReversed:r,index:a,offset:u}),n}),[l,o,t,r,s,i])}({minSizes:S,sizes:y,isLtr:v,collapsedSize:g,collapsedIndices:c,isReversed:b}),V=function(e){var i=e.childPanes,t=e.split;return n.useCallback((function(){return i.map((function(e){return function(e){var n,i,t="vertical"===e.split?"width":"height";return null!=(n=null==(i=e.ref.current)?void 0:i.getBoundingClientRect()[t])?n:0}({split:t,ref:e.ref})}))}),[i,t])}({childPanes:h,split:s}),R=function(e){var i=e.setSizes,t=e.hooks,s=e.movedSizes;return n.useCallback((function(){i(s),null==t||null==t.onSaveSizes||t.onSaveSizes(s)}),[s,t,i])}({movedSizes:w,children:m,hooks:u,setSizes:k}),L=function(e){var i=e.getCurrentPaneSizes,t=e.collapsedSize,s=e.collapsedIndices,l=e.setMovedSizes,r=e.setSizes;return n.useCallback((function(e){var n=i(),o=e&&e.length>0?H(n)/H(e):1,a=e?e.map((function(e){return e*o})):n,u=a.map((function(e,n){return s.includes(n)?t:s.includes(n-1)?e+H(s.filter((function(e,i){return i<=n})).map((function(e,n){return a[n]-t}))):e}));l(u),r(u)}),[s,t,i,l,r])}({setMovedSizes:E,minSizes:S,collapsedIndices:c,collapsedSize:g,getCurrentPaneSizes:V,setSizes:k,originalMinSizes:a}),D=function(e,i){var t=function(e,i){var t=n.useState(!1),s=t[0],l=t[1],o=n.useState(null),a=o[0],u=o[1],c=n.useState(null),d=c[0],f=c[1],p=n.useState(null),v=p[0],m=p[1],z=n.useCallback((function(n){var i=n.position,t=n.index,s=e?i.clientX:i.clientY;r.unstable_batchedUpdates((function(){m(t),l(!0),u(s),f(s)}))}),[e]),S=n.useMemo((function(){return s&&null!==d&&null!==a&&null!==v?{offset:d-a,index:v}:null}),[d,a,v,s]),g=n.useCallback((function(){s&&S&&r.unstable_batchedUpdates((function(){l(!1),i(S)}))}),[s,S,i]),h=n.useCallback((function(n){f(s?e?n.clientX:n.clientY:null)}),[s,e]),b=n.useCallback((function(e){s&&h(e.touches[0])}),[s,h]),C=n.useCallback((function(e){s&&(1==(1&e.buttons)||g())}),[s,g]);return{beginDrag:z,dragState:S,onMouseMove:h,onTouchMove:b,onMouseUp:g,onMouseEnter:C}}(e,i),s=t.beginDrag,l=t.dragState,o=t.onTouchMove,a=t.onMouseUp,u=t.onMouseEnter;return ne("mousemove",t.onMouseMove),ne("touchmove",o),ne("mouseup",a),ne("mouseenter",u),{dragState:l,beginDrag:s}}(p,R),P=D.dragState,N=D.beginDrag,j=function(e){var i=e.isReversed,t=e.movedSizes,s=e.minSizes,l=e.collapsedIndices,o=e.setSizes,a=e.setMovedSizes,u=e.collapsedSize;return n.useCallback((function(e){var n=e.size,c=e.idx,d=i?-(u-n):u-n,f=i?c-1:c,p=[].concat(t);_({sizes:p,index:f,offset:d,minSizes:s,collapsedIndices:l,collapsedSize:u}),q({offset:d,index:f,isReversed:i,collapsedIndices:l,minSizes:s,sizes:p,collapsedSize:u}),r.unstable_batchedUpdates((function(){a(p),o(p)}))}),[i,u,t,s,l,a,o])}({setMovedSizes:E,setSizes:k,minSizes:S,movedSizes:w,isReversed:b,collapsedIndices:c,collapsedSize:g}),A=function(e){var i=e.isReversed,t=e.movedSizes,s=e.minSizes,l=e.setMovedSizes,o=e.setSizes,a=e.collapsedSize,u=e.collapsedIndices;return n.useCallback((function(e){var n=e.size,c=e.idx,d=i?-(n-50):n-50,f=i?c-1:c,p=[].concat(t);_({sizes:p,index:f,offset:d,minSizes:s,collapsedSize:a,collapsedIndices:u}),r.unstable_batchedUpdates((function(){l(p),o(p)}))}),[u,a,i,s,t,l,o])}({isReversed:b,movedSizes:w,minSizes:S,setMovedSizes:E,setSizes:k,collapsedSize:g,collapsedIndices:c}),B=function(e){var i=e.movedSizes,t=e.setCollapsedSizes,s=e.collapsedSizes,l=e.collapseSize,r=e.sizes,o=e.hooks,a=e.unCollapseSize;return n.useCallback((function(e){t(s.map((function(n,t){var s=e.includes(t);return s&&null===n?(l({size:r[t],idx:t}),null==o||null==o.onChange||o.onChange(r),i[t]):s||null===n?n:(a({idx:t,size:n}),null==o||null==o.onChange||o.onChange(r),null)})))}),[l,s,o,i,t,r,a])}({sizes:y,collapsedSizes:$,setCollapsedSizes:O,movedSizes:w,collapseSize:j,unCollapseSize:A,hooks:u});n.useEffect((function(){null!==P&&E(T(P))}),[P]),n.useEffect((function(){null!==P&&(null==u||null==u.onChange||u.onChange(w))}),[P,w,u]),n.useEffect((function(){null==u||null==u.onCollapse||u.onCollapse($)}),[$,u]),n.useEffect((function(){B(c)}),[c]);var F=n.useCallback(W((function(){return L()}),100),[L]);ne("resize",F),n.useEffect((function(){return L(C)}),[]);var X=n.useMemo((function(){return h.map((function(e,n){return o({},e,{size:w[n]})}))}),[h,w]),Y=function(e){var i=e.isReversed,t=e.hooks,s=e.beginDrag;return n.useCallback((function(e){var n=e.index,l=e.position;null==t||null==t.onDragStarted||t.onDragStarted(),s({position:l,index:i?n-1:n})}),[s,t,i])}({isReversed:b,hooks:u,beginDrag:N});return{childPanes:X,resizingIndex:null!=(i=null==P?void 0:P.index)?i:null,handleDragStart:Y}}(o({},e,{isLtr:d,isVertical:f,collapsedIndices:z,collapsedSizes:c,collapseOptions:v})),b=h.childPanes,C=h.handleDragStart,x=h.resizingIndex,y=S(["SplitPane",e.split,e.className]),k=S(["Resizing",e.className]),M=function(e){var i=e.collapsedIndices,t=e.setCollapsed;return n.useCallback((function(e){i.includes(e)?t(i.filter((function(n){return n!==e}))):t([].concat(i,[e]))}),[i,t])}({setCollapsed:g,collapsedIndices:z}),w=function(e){var i=e.collapsedIndices;return n.useCallback((function(e){return i.length>0&&i.includes(e)}),[i])}({collapsedIndices:z});if(b.length<=1)return i.createElement(i.Fragment,null,e.children);var E=b.map((function(n,t){var s=p?t:t-1;return i.createElement(i.Fragment,{key:t},t-1>=0?i.createElement(J,{key:"resizer."+s,isCollapsed:w(s),isVertical:f,isLtr:d,split:e.split,className:x===s?k:e.className,paneIndex:s,resizerOptions:e.resizerOptions,collapseOptions:v,onDragStarted:C,onCollapseToggle:M}):null,i.createElement(L,{key:"pane."+t,forwardRef:n.ref,size:n.size,isCollapsed:w(t),collapsedIndices:z,split:e.split,isVertical:f,minSize:U(t,e.minSizes),className:e.className,transitionTimeout:null==v?void 0:v.collapseTransitionTimeout,collapseOverlayCss:null==v?void 0:v.overlayCss},n.node))}));return i.createElement(G,{key:"splitpanewrapper",className:y,split:e.split},E)};ae.displayName="SplitPane",exports.SplitPane=ae;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react"),i=e(n),t=require("styled-components"),s=e(t),l=require("@mui/material"),r=require("react-dom");function o(){return(o=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var i=arguments[n];for(var t in i)Object.prototype.hasOwnProperty.call(i,t)&&(e[t]=i[t])}return e}).apply(this,arguments)}function a(e,n){return n||(n=e.slice(0)),e.raw=n,e}var u,c,d,f,p,m,v,z,S=function(e){return n.useMemo((function(){return e.filter((function(e){return e})).join(" ")}),[e])},g=t.css(u||(u=a(["\n  width: 0;\n  height: 100%;\n"]))),h=t.css(c||(c=a(["\n  width: 100%;\n  height: 0;\n"]))),b=t.css(d||(d=a(["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n"]))),C=s.div(f||(f=a(["\n  position: relative;\n  outline: none;\n  border: 0;\n  overflow: hidden;\n  display: flex;\n  flex-grow: 1;\n  flex-shrink: 1;\n  ","\n  ","\n"])),(function(e){return e.$isVertical?g:h}),(function(e){return e.$shouldAnimate&&"transition: flex-basis "+e.$timeout+"ms ease-in-out"})),x=s.div(p||(p=a(["\n  ","\n  ","\n"])),b,(function(e){return e.$isCollapsed&&t.css(m||(m=a(["\n      * {\n        z-index: 0;\n      }\n      z-index: 0;\n    "])))})),y=s.div(v||(v=a(["\n  ","\n  ",";\n  opacity: ",";\n  transition: opacity ","ms ease-in-out;\n"])),(function(e){return e.$isCollapsed&&b}),(function(e){return e.$isCollapsed&&t.css(z||(z=a(["\n      z-index: 1;\n    "])))}),(function(e){return e.$isCollapsed?1:0}),(function(e){return e.$timeout})),k=function(e){var i=e.size,t=e.minSize,s=e.isCollapsed,l=e.collapseOverlayCss,r=void 0===l?{background:"rgba(220,220,220, 0.1)"}:l,a=e.isVertical,u=e.children,c=e.forwardRef,d=e.collapsedIndices,f=e.transitionTimeout,p=S(["Pane",e.split,e.className]),m=n.useMemo((function(){return null!=f?f:500}),[f]),v=n.useState(!1),z=v[0],g=v[1],h=n.useRef(!1);n.useEffect((function(){h.current?0!==m&&(g(!0),setTimeout((function(){return g(!1)}),500)):h.current=!0}),[g,d,m]);var b=n.useMemo((function(){return a?{minWidth:t}:{minHeight:t}}),[t,a]),k=s?o({},b,{userSelect:"none"}):b;return n.createElement(C,{$isVertical:a,$shouldAnimate:0!==m&&z,$timeout:m,className:p,ref:c,style:{flexBasis:i}},n.createElement(y,{$isCollapsed:s,$timeout:m,style:r}),n.createElement(x,{$isCollapsed:s,style:k},u))};k.displayName="Pane";var M,w,E,I,$,O,T,V,R,L=n.memo(k),D=t.css(M||(M=a(["\n  top: 0;\n  bottom: 0;\n"]))),P=t.css(w||(w=a(["\n  right: 0;\n  left: 0;\n"]))),N=s.div(E||(E=a(["\n  cursor: pointer;\n  position: absolute;\n"]))),j=s.div(I||(I=a(["\n  z-index: 3;\n  position: absolute;\n  overflow: initial;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  ",";\n  ","\n"])),(function(e){return(e.$isVertical?"width":"height")+": "+e.$grabberSize}),(function(e){return e.$isVertical?D:P})),A=s.div($||($=a(["\n  position: absolute;\n  z-index: 3;\n  transform: ",";\n  cursor: ",";\n  ","\n"])),(function(e){return e.$isVertical?"translateX("+(e.$isLtr?"-":"")+"50%)":"translateY(-50%)"}),(function(e){return!e.$isCollapsed&&(e.$isVertical?"col-resize":"row-resize")}),(function(e){return e.$isVertical?D:P})),B=s.div(O||(O=a(["\n  z-index: 2;\n  position: absolute;\n  ","\n"])),(function(e){return e.$isVertical?D:P})),F={fade:l.Fade,grow:l.Grow,zoom:l.Zoom,none:l.Fade},U=function(e,n){if("number"==typeof n){if(n>0)return n}else if(n instanceof Array){var i=n[e];if(i>0)return i}return 50},_=function e(n){var i=n.index,t=n.minSizes,s=n.offset,l=n.sizes,r=n.collapsedIndices,o=n.collapsedSize;if(!s||i<0||i+1>=l.length)return 0;var a=function(e){return r.includes(e)},u=a(i)?o:U(i,t),c=a(i+1)?o:U(i+1,t),d=l[i]+s,f=l[i+1]-s;if(s<0&&d<u){var p=d-u;s-=p-e({sizes:l,index:i-1,offset:p,minSizes:t,collapsedIndices:r,collapsedSize:o})}else if(s>0&&f<c){var m=c-f;s-=m-e({sizes:l,index:i+1,offset:m,minSizes:t,collapsedIndices:r,collapsedSize:o})}return l[i]+=s,l[i+1]-=s,s},q=function(e){var n=e.offset,i=e.isReversed,t=e.collapsedIndices,s=e.minSizes,l=e.sizes,r=e.index,o=e.collapsedSize;if(i?n>0:n<0)for(var a=i?r:r+1;i?a>0:a<l.length-1;i?a--:a++)t.includes(a)&&_({sizes:l,index:i?a-1:a,offset:n,minSizes:s,collapsedIndices:t,collapsedSize:o})},X=t.css(T||(T=a(["\n  left: 0;\n  right: 0;\n  flex-direction: row;\n"]))),Y=t.css(V||(V=a(["\n  bottom: 0;\n  top: 0;\n  flex-direction: column;\n  min-height: 100%;\n  width: 100%;\n"]))),G=s.div(R||(R=a(["\n  display: flex;\n  flex: 1;\n  height: 100%;\n  position: absolute;\n  outline: none;\n  overflow: hidden;\n  ","\n"])),(function(e){return"vertical"===e.split?X:Y})),H=function(e){return e.reduce((function(e,n){return e+n}),0)},W=function(e,n){var i=null;return function(){for(var t=arguments.length,s=new Array(t),l=0;l<t;l++)s[l]=arguments[l];null!==i&&(clearTimeout(i),i=null),i=setTimeout((function(){return e.apply(void 0,s)}),n)}},Z={grabberSize:"1rem",css:{backgroundColor:"rgba(120, 120, 120, 0.3)"},hoverCss:{backgroundColor:"rgba(120, 120, 120, 0.6)"}},J=function(e){var t=e.isVertical,s=e.split,r=e.className,a=e.paneIndex,u=e.onDragStarted,c=e.collapseOptions,d=e.onCollapseToggle,f=e.isLtr,p=e.isCollapsed,m=o({},Z,e.resizerOptions),v=m.grabberSize,z=m.css,g=m.hoverCss,h=S(["Resizer",s,r]),b=n.useMemo((function(){return e=v,isNaN(e)?e.toString():e+"px";var e}),[v]),C=function(e){return n.useMemo((function(){var n;return F[null!=(n=null==e?void 0:e.buttonTransition)?n:"fade"]}),[e])}(c),x=n.useState(!1),y=x[0],k=x[1],M=n.useCallback((function(e){e.preventDefault(),p||u({index:a,position:e})}),[a,p,u]),w=n.useCallback((function(e){e.preventDefault(),p||u({index:a,position:e.touches[0]})}),[a,p,u]),E=n.useCallback((function(e){e.stopPropagation(),d(a)}),[a,d]),I=n.useCallback((function(e){e.stopPropagation()}),[]),$=n.useCallback(W((function(){return k(!0)}),50),[k]),O=n.useCallback((function(){$()}),[$]),T=n.useCallback(W((function(){return k(!1)}),100),[k]),V=n.useCallback((function(){return T()}),[T]),R=n.useCallback((function(e){return t?{width:e}:{height:e}}),[t]),L=n.useMemo((function(){var e;return Math.max(100-(null!=(e=null==c?void 0:c.buttonPositionOffset)?e:0),0)}),[c]),D=n.useMemo((function(){var e;return Math.max(100+(null!=(e=null==c?void 0:c.buttonPositionOffset)?e:0),0)}),[c]),P="none"!==(null==c?void 0:c.buttonTransition),U=c?i.createElement(j,{$isVertical:t,$grabberSize:b,$isLtr:f},i.createElement("div",{style:{flex:"1 1 "+L}}),i.createElement(C,{in:!P||y,timeout:P?c.buttonTransitionTimeout:0,style:{flex:"0 0 0",position:"relative"}},i.createElement(N,{$isVertical:t,onClick:E,onMouseDown:I},p?c.afterToggleButton:c.beforeToggleButton)),i.createElement("div",{style:{flex:"1 1 "+D}})):null;return i.createElement("div",{key:"grabber.root",style:{position:"relative"}},i.createElement(A,{key:"grabber",$isVertical:t,$isCollapsed:p,$isLtr:f,style:R(v),role:"presentation",className:h,onMouseDown:M,onTouchStart:w,onMouseEnter:O,onMouseLeave:V},U),i.createElement(l.Fade,{key:"resize.presentation.fadein",in:!y},i.createElement(B,{$isVertical:t,style:o({},R(1),z)})),i.createElement(l.Fade,{key:"resize.presentation.fadeout",in:y},i.createElement(B,{$isVertical:t,style:o({},R(1),g)})))};J.displayName="Resizer";var K,Q,ee,ne=function(e,i){return n.useEffect((function(){var n=new AbortController;if(i)return window.addEventListener(e,i),function(){window.removeEventListener(e,i),n.abort()}}),[e,i])},ie=function(e){return n.useMemo((function(){return function(e){return"boolean"!=typeof e&&!(null==e||!e.collapseDirection)&&["right","down"].includes(e.collapseDirection)}(e)}),[e])},te=s.div(K||(K=a(["\n  width: 1.8rem;\n  height: 1.8rem;\n  border-radius: 300px;\n  background: #0092d1;\n  cursor: pointer;\n  user-select: none;\n  text-align: center;\n  color: white;\n  border: 2px rgba(200, 200, 200, 0.5) solid;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  svg {\n    width: 100%;\n    height: 100%;\n  }\n"])));!function(e){e[e.left=0]="left",e[e.right=1]="right",e[e.up=2]="up",e[e.down=3]="down"}(ee||(ee={}));var se=((Q={})[ee.left]="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z",Q[ee.right]="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z",Q[ee.up]="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z",Q[ee.down]="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z",Q),le=function(e){return i.createElement("svg",Object.assign({},e,{focusable:"false",fill:"white",viewBox:"0 0 24 24","aria-hidden":"true"}),i.createElement("path",{d:se[e.dir]}))},re=function(e){var n=e.isVertical?[ee.left,ee.right]:[ee.up,ee.down],t=e.isReversed?n.reverse():n,s=t[0],l=t[1];return i.createElement(te,null,i.createElement(le,{dir:e.isBefore?e.isLtr?s:l:e.isLtr?l:s}))},oe=function(e){return{beforeToggleButton:i.createElement(re,Object.assign({},e,{isBefore:!0})),afterToggleButton:i.createElement(re,Object.assign({},e,{isBefore:!1})),collapseDirection:e.isVertical?"left":"up",overlayCss:{backgroundColor:"rgba(0, 0, 0, 0.4)"},buttonTransitionTimeout:200,buttonTransition:"grow",collapsedSize:50,collapseTransitionTimeout:500,buttonPositionOffset:0}},ae=function(e){var t,s,l,a,u,c=function(e){var i=e.collapsedSizes,t=e.children,s=e.collapse;return n.useMemo((function(){return(null==i?void 0:i.length)===t.length&&s?i:new Array(t.length).fill(null)}),[t.length,s,i])}(e),d=n.useMemo((function(){return"vertical"!==s||"rtl"!==l}),[s=(t=e).split,l=t.dir]),f="vertical"===e.split,p=ie(e.collapse),m=function(e){var n=e.originalValue,i=function(e,n){if(null==e)return{};var i,t,s={},l=Object.keys(e);for(t=0;t<l.length;t++)n.indexOf(i=l[t])>=0||(s[i]=e[i]);return s}(e,["originalValue"]);if(void 0!==n&&!1!==n)return!0===n?oe(i):o({},oe(i),n)}({isVertical:f,isLtr:d,originalValue:e.collapse,isReversed:p}),v=n.useState(null!=(u=null==(a=c)?void 0:a.reduce((function(e,n,i){return null!==n?[].concat(e,[i]):[].concat(e)}),[]))?u:[]),z=v[0],g=v[1],h=function(e){var i,t=e.children,s=e.split,l=e.initialSizes,a=e.minSizes,u=e.hooks,c=e.collapsedIndices,d=e.collapsedSizes,f=e.collapseOptions,p=e.isVertical,m=e.isLtr,v=Array.isArray(t)?t:[t],z=n.useRef(new Map),S=function(e){var i=e.minSizes,t=e.numSizes,s=e.collapsedIndices,l=e.collapseOptions;return n.useMemo((function(){return Array.from({length:t}).map((function(e,n){var t;return s.includes(n)?null!=(t=null==l?void 0:l.collapsedSize)?t:50:U(n,i)}))}),[t,l,s,i])}({minSizes:a,numSizes:v.length,collapseOptions:f,collapsedIndices:c}),g=function(e){var i=e.collapseOptions;return n.useMemo((function(){var e;return null!=(e=null==i?void 0:i.collapsedSize)?e:50}),[i])}({collapseOptions:f}),h=function(e){var i=e.paneRefs,t=e.children,s=e.minSizes;return n.useMemo((function(){var e=i.current;return i.current=new Map,t.map((function(t,l){var r="index."+l,o=e.get(r)||n.createRef();return i.current.set(r,o),{key:r,node:t,ref:o,minSize:s[l]}}))}),[t,s,i])}({minSizes:S,children:v,paneRefs:z}),b=ie(f),C=n.useMemo((function(){return v.map((function(e,n){var i;return null!=(i=null==l?void 0:l[n])?i:1}))}),[v,l]),x=n.useState(C),y=x[0],k=x[1],M=n.useState(y),w=M[0],E=M[1],I=n.useState(null!=d?d:new Array(v.length).fill(null)),$=I[0],O=I[1],T=function(e){var i=e.sizes,t=e.isLtr,s=e.minSizes,l=e.collapsedIndices,r=e.isReversed,o=e.collapsedSize;return n.useCallback((function(e){var n=[].concat(i),a=e.index,u=t?e.offset:-e.offset;return _({sizes:n,index:a,offset:u,minSizes:s,collapsedIndices:l,collapsedSize:o}),q({collapsedSize:o,sizes:n,minSizes:s,collapsedIndices:l,isReversed:r,index:a,offset:u}),n}),[l,o,t,r,s,i])}({minSizes:S,sizes:y,isLtr:m,collapsedSize:g,collapsedIndices:c,isReversed:b}),V=function(e){var i=e.childPanes,t=e.split;return n.useCallback((function(){return i.map((function(e){return function(e){var n,i,t="vertical"===e.split?"width":"height";return null!=(n=null==(i=e.ref.current)?void 0:i.getBoundingClientRect()[t])?n:0}({split:t,ref:e.ref})}))}),[i,t])}({childPanes:h,split:s}),R=function(e){var i=e.setSizes,t=e.hooks,s=e.movedSizes;return n.useCallback((function(){i(s),null==t||null==t.onSaveSizes||t.onSaveSizes(s)}),[s,t,i])}({movedSizes:w,children:v,hooks:u,setSizes:k}),L=function(e){var i=e.getCurrentPaneSizes,t=e.collapsedSize,s=e.collapsedIndices,l=e.setMovedSizes,r=e.setSizes;return n.useCallback((function(e){var n=i(),o=e&&e.length>0?H(n)/H(e):1,a=e?e.map((function(e){return e*o})):n,u=a.map((function(e,n){return s.includes(n)?t:s.includes(n-1)?e+H(s.filter((function(e,i){return i<=n})).map((function(e,n){return a[n]-t}))):e}));l(u),r(u)}),[s,t,i,l,r])}({setMovedSizes:E,minSizes:S,collapsedIndices:c,collapsedSize:g,getCurrentPaneSizes:V,setSizes:k,originalMinSizes:a}),D=function(e,i){var t=function(e,i){var t=n.useState(!1),s=t[0],l=t[1],o=n.useState(null),a=o[0],u=o[1],c=n.useState(null),d=c[0],f=c[1],p=n.useState(null),m=p[0],v=p[1],z=n.useCallback((function(n){var i=n.position,t=n.index,s=e?i.clientX:i.clientY;r.unstable_batchedUpdates((function(){v(t),l(!0),u(s),f(s)}))}),[e]),S=n.useMemo((function(){return s&&null!==d&&null!==a&&null!==m?{offset:d-a,index:m}:null}),[d,a,m,s]),g=n.useCallback((function(){s&&S&&r.unstable_batchedUpdates((function(){l(!1),i(S)}))}),[s,S,i]),h=n.useCallback((function(n){f(s?e?n.clientX:n.clientY:null)}),[s,e]),b=n.useCallback((function(e){s&&h(e.touches[0])}),[s,h]),C=n.useCallback((function(e){s&&(1==(1&e.buttons)||g())}),[s,g]);return{beginDrag:z,dragState:S,onMouseMove:h,onTouchMove:b,onMouseUp:g,onMouseEnter:C}}(e,i),s=t.beginDrag,l=t.dragState,o=t.onTouchMove,a=t.onMouseUp,u=t.onMouseEnter;return ne("mousemove",t.onMouseMove),ne("touchmove",o),ne("mouseup",a),ne("mouseenter",u),{dragState:l,beginDrag:s}}(p,R),P=D.dragState,N=D.beginDrag,j=function(e){var i=e.isReversed,t=e.movedSizes,s=e.minSizes,l=e.collapsedIndices,o=e.setSizes,a=e.setMovedSizes,u=e.collapsedSize;return n.useCallback((function(e){var n=e.size,c=e.idx,d=i?-(u-n):u-n,f=i?c-1:c,p=[].concat(t);_({sizes:p,index:f,offset:d,minSizes:s,collapsedIndices:l,collapsedSize:u}),q({offset:d,index:f,isReversed:i,collapsedIndices:l,minSizes:s,sizes:p,collapsedSize:u}),r.unstable_batchedUpdates((function(){a(p),o(p)}))}),[i,u,t,s,l,a,o])}({setMovedSizes:E,setSizes:k,minSizes:S,movedSizes:w,isReversed:b,collapsedIndices:c,collapsedSize:g}),A=function(e){var i=e.isReversed,t=e.movedSizes,s=e.minSizes,l=e.setMovedSizes,o=e.setSizes,a=e.collapsedSize,u=e.collapsedIndices;return n.useCallback((function(e){var n=e.size,c=e.idx,d=i?-(n-50):n-50,f=i?c-1:c,p=[].concat(t);_({sizes:p,index:f,offset:d,minSizes:s,collapsedSize:a,collapsedIndices:u}),r.unstable_batchedUpdates((function(){l(p),o(p)}))}),[u,a,i,s,t,l,o])}({isReversed:b,movedSizes:w,minSizes:S,setMovedSizes:E,setSizes:k,collapsedSize:g,collapsedIndices:c}),B=function(e){var i=e.movedSizes,t=e.setCollapsedSizes,s=e.collapsedSizes,l=e.collapseSize,r=e.sizes,o=e.hooks,a=e.unCollapseSize;return n.useCallback((function(e){t(s.map((function(n,t){var s=e.includes(t);return s&&null===n?(l({size:r[t],idx:t}),null==o||null==o.onChange||o.onChange(r),i[t]):s||null===n?n:(a({idx:t,size:n}),null==o||null==o.onChange||o.onChange(r),null)})))}),[l,s,o,i,t,r,a])}({sizes:y,collapsedSizes:$,setCollapsedSizes:O,movedSizes:w,collapseSize:j,unCollapseSize:A,hooks:u});n.useEffect((function(){null!==P&&E(T(P))}),[P]),n.useEffect((function(){null!==P&&(null==u||null==u.onChange||u.onChange(w))}),[P,w,u]),n.useEffect((function(){null==u||null==u.onCollapse||u.onCollapse($)}),[$,u]),n.useEffect((function(){B(c)}),[c]);var F=n.useCallback(W((function(){return L()}),100),[L]);ne("resize",F),n.useEffect((function(){return L(C)}),[]);var X=n.useMemo((function(){return h.map((function(e,n){return o({},e,{size:w[n]})}))}),[h,w]),Y=function(e){var i=e.isReversed,t=e.hooks,s=e.beginDrag;return n.useCallback((function(e){var n=e.index,l=e.position;null==t||null==t.onDragStarted||t.onDragStarted(),s({position:l,index:i?n-1:n})}),[s,t,i])}({isReversed:b,hooks:u,beginDrag:N});return{childPanes:X,resizingIndex:null!=(i=null==P?void 0:P.index)?i:null,handleDragStart:Y}}(o({},e,{isLtr:d,isVertical:f,collapsedIndices:z,collapsedSizes:c,collapseOptions:m})),b=h.childPanes,C=h.handleDragStart,x=h.resizingIndex,y=S(["SplitPane",e.split,e.className]),k=S(["Resizing",e.className]),M=function(e){var i=e.collapsedIndices,t=e.setCollapsed;return n.useCallback((function(e){i.includes(e)?t(i.filter((function(n){return n!==e}))):t([].concat(i,[e]))}),[i,t])}({setCollapsed:g,collapsedIndices:z}),w=function(e){var i=e.collapsedIndices;return n.useCallback((function(e){return i.length>0&&i.includes(e)}),[i])}({collapsedIndices:z});if(b.length<=1)return i.createElement(i.Fragment,null,e.children);var E=b.map((function(n,t){var s=p?t:t-1;return i.createElement(i.Fragment,{key:t},t-1>=0?i.createElement(J,{key:"resizer."+s,isCollapsed:w(s),isVertical:f,isLtr:d,split:e.split,className:x===s?k:e.className,paneIndex:s,resizerOptions:e.resizerOptions,collapseOptions:m,onDragStarted:C,onCollapseToggle:M}):null,i.createElement(L,{key:"pane."+t,forwardRef:n.ref,size:n.size,isCollapsed:w(t),collapsedIndices:z,split:e.split,isVertical:f,minSize:U(t,e.minSizes),className:e.className,transitionTimeout:null==m?void 0:m.collapseTransitionTimeout,collapseOverlayCss:null==m?void 0:m.overlayCss},n.node))}));return i.createElement(G,{key:"splitpanewrapper",className:y,split:e.split},E)};ae.displayName="SplitPane",exports.SplitPane=ae;
 //# sourceMappingURL=react-collapse-pane.cjs.production.min.js.map

dist/react-collapse-pane.esm.js

 import React__default, { useMemo, memo, useState, useRef, useEffect, createElement, useCallback, createRef } from 'react';
 import styled, { css } from 'styled-components';
-import { Fade, Grow, Zoom } from '@material-ui/core';
+import { Fade, Grow, Zoom } from '@mui/material';
 import { unstable_batchedUpdates } from 'react-dom';
@@ -5,0 +5,0 @@

package.json

 {
-  "version": "2.0.1",
+  "version": "3.0.0",
   "license": "MIT",
   "name": "react-collapse-pane",
   "repository": "https://github.com/b-zurg/react-collapse-pane",
-  "homepage": "https://collapse-pane.zurg.dev",
+  "homepage": "https://b-zurg.github.io/react-collapse-pane/",
   "bugs": "https://github.com/b-zurg/react-collapse-pane/issues",
@@ -58,29 +58,30 @@ "description": "The splittable, draggable and collapsible react layout library.",
   },
-  "dependencies": {
-    "@material-ui/core": "^4.11.4",
-    "styled-components": "^5.3.0"
-  },
+  "dependencies": {},
   "devDependencies": {
-    "@babel/core": "^7.12.10",
-    "@storybook/addon-actions": "^6.2.9",
-    "@storybook/addon-essentials": "^6.2.9",
-    "@storybook/addon-links": "^6.2.9",
-    "@storybook/react": "^6.2.9",
-    "@types/react": "^17.0.5",
-    "@types/react-dom": "^17.0.4",
-    "@types/styled-components": "^5.1.9",
-    "babel-loader": "^8.2.2",
+    "@babel/core": "^7.18.0",
+    "@mui/material": "^5.8.0",
+    "@storybook/addon-actions": "^6.5.3",
+    "@storybook/addon-essentials": "^6.5.3",
+    "@storybook/addon-links": "^6.5.3",
+    "@storybook/react": "^6.5.3",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.4",
+    "@types/styled-components": "^5.1.25",
+    "babel-loader": "^8.2.5",
+    "html-webpack-plugin": "^5.5.0",
     "husky": "^6.0.0",
-    "react": "^17.0.0",
+    "react": "^18.1.0",
     "react-docgen-typescript-loader": "^3.7.2",
-    "react-dom": "^17.0.0",
-    "react-is": "^17.0.2",
-    "ts-loader": "^9.1.2",
+    "react-dom": "^18.1.0",
+    "react-is": "^18.1.0",
+    "styled-components": "^5.3.5",
+    "ts-loader": "^9.3.0",
     "tsdx": "^0.14.1",
-    "tslib": "^2.2.0",
-    "typescript": "^4.2.4"
+    "tslib": "^2.4.0",
+    "typescript": "^4.6.4"
   },
   "peerDependencies": {
-    "react": ">=16"
+    "react": ">=16",
+    "@mui/material": "^5.8.0"
   }
 }

README.md

@@ -5,3 +5,3 @@ # react-collapse-pane
 
-<a href="https://collapse-pane.zurg.dev" target="_blank"><img src="logo.svg" alt="logo" style="width:100%"/></a>
+<a href="https://storybook-collapse-pane.netlify.app/" target="_blank"><img src="logo.svg" alt="logo" style="width:100%"/></a>
 <p align="center">
@@ -30,3 +30,3 @@ <a href="https://github.com/b-zurg/react-collapse-pane/pulls">
   </a>
-  <a href="https://react-collapse-pane.zurg.dev/?path=/story/*">
+  <a href="https://storybook-collapse-pane.netlify.app/?path=/story/*">
     <img alt="storybook" src="https://cdn.jsdelivr.net/gh/storybookjs/brand@master/badge/badge-storybook.svg">
@@ -40,4 +40,4 @@ </a>
 
-## [[click for storybook demo]](https://storybook.collapse-pane.zurg.dev/)
-## [[click for documentation site]](https://collapse-pane.zurg.dev/)
+## [[click for storybook demo]](https://storybook-collapse-pane.netlify.app/)
+## [[click for documentation site]](https://b-zurg.github.io/react-collapse-pane/)
 
@@ -94,7 +94,7 @@ # Getting Started :rocket:
 
-For more details check out [the documentation](https://collapse-pane.zurg.dev/)
+For more details check out [the documentation](https://b-zurg.github.io/react-collapse-pane/)
 
 # Documentation
 
-Documentation can be found at https://collapse-pane.zurg.dev 
+Documentation can be found at https://b-zurg.github.io/react-collapse-pane/ 
 
@@ -101,0 +101,0 @@ If you notice an issue then please make an issue or a PR!  All docs are generated from the `docs` folder in the master branch.

src/components/Resizer/hooks/useTransition.ts

 import { CollapseOptions, TransitionType } from '../../SplitPane';
 import { useMemo } from 'react';
-import { Fade, Grow, Zoom } from '@material-ui/core';
+import { Fade, Grow, Zoom } from '@mui/material';
 type TransitionComponent = typeof Fade | typeof Grow | typeof Zoom;
@@ -5,0 +5,0 @@ const transitionComponentMap: {

Fixed alerts

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Dependency count

2

decreased by-33.33%

Number of low quality alerts

1

decreased by-50%

Worsened metrics

Total package byte prevSize

428915

decreased by-1.19%

Dev dependency count

21

increased by16.67%

Dependency changes

• + Added@emotion/cache@11.11.0(transitive)

• + Added@emotion/sheet@1.2.2(transitive)

• + Added@emotion/utils@1.2.1(transitive)

• + Added@emotion/weak-memoize@0.3.1(transitive)

• + Added@floating-ui/core@1.6.1(transitive)

• + Added@floating-ui/dom@1.6.5(transitive)

• + Added@floating-ui/react-dom@2.0.9(transitive)

• + Added@floating-ui/utils@0.2.2(transitive)

• + Added@mui/base@5.0.0-beta.40(transitive)

• + Added@mui/core-downloads-tracker@5.15.17(transitive)

• + Added@mui/material@5.15.17(transitive)

• + Added@mui/private-theming@5.15.14(transitive)

• + Added@mui/styled-engine@5.15.14(transitive)

• + Added@mui/system@5.15.15(transitive)

• + Added@mui/types@7.2.14(transitive)

• + Added@mui/utils@5.15.14(transitive)

• + Added@popperjs/core@2.11.8(transitive)

• + Addedclsx@2.1.1(transitive)

• + Addedreact-dom@18.3.1(transitive)

• + Addedreact-is@18.3.1(transitive)

• + Addedscheduler@0.23.2(transitive)

• + Addedstylis@4.2.0(transitive)

• - Removed@material-ui/core@^4.11.4

• - Removedstyled-components@^5.3.0

• - Removed@ampproject/remapping@2.3.0(transitive)

• - Removed@babel/code-frame@7.24.2(transitive)

• - Removed@babel/compat-data@7.24.4(transitive)

• - Removed@babel/core@7.24.5(transitive)

• - Removed@babel/generator@7.24.5(transitive)

• - Removed@babel/helper-annotate-as-pure@7.22.5(transitive)

• - Removed@babel/helper-compilation-targets@7.23.6(transitive)

• - Removed@babel/helper-environment-visitor@7.22.20(transitive)

• - Removed@babel/helper-function-name@7.23.0(transitive)

• - Removed@babel/helper-hoist-variables@7.22.5(transitive)

• - Removed@babel/helper-module-imports@7.24.3(transitive)

• - Removed@babel/helper-module-transforms@7.24.5(transitive)

• - Removed@babel/helper-plugin-utils@7.24.5(transitive)

• - Removed@babel/helper-simple-access@7.24.5(transitive)

• - Removed@babel/helper-split-export-declaration@7.24.5(transitive)

• - Removed@babel/helper-string-parser@7.24.1(transitive)

• - Removed@babel/helper-validator-identifier@7.24.5(transitive)

• - Removed@babel/helper-validator-option@7.23.5(transitive)

• - Removed@babel/helpers@7.24.5(transitive)

• - Removed@babel/highlight@7.24.5(transitive)

• - Removed@babel/parser@7.24.5(transitive)

• - Removed@babel/plugin-syntax-jsx@7.24.1(transitive)

• - Removed@babel/template@7.24.0(transitive)

• - Removed@babel/traverse@7.24.5(transitive)

• - Removed@babel/types@7.24.5(transitive)

• - Removed@emotion/hash@0.8.0(transitive)

• - Removed@emotion/is-prop-valid@1.2.2(transitive)

• - Removed@emotion/stylis@0.8.5(transitive)

• - Removed@emotion/unitless@0.7.5(transitive)

• - Removed@jridgewell/gen-mapping@0.3.5(transitive)

• - Removed@jridgewell/resolve-uri@3.1.2(transitive)

• - Removed@jridgewell/set-array@1.2.1(transitive)

• - Removed@jridgewell/sourcemap-codec@1.4.15(transitive)

• - Removed@jridgewell/trace-mapping@0.3.25(transitive)

• - Removed@material-ui/core@4.12.4(transitive)

• - Removed@material-ui/styles@4.11.5(transitive)

• - Removed@material-ui/system@4.12.2(transitive)

• - Removed@material-ui/types@5.1.0(transitive)

• - Removed@material-ui/utils@4.11.3(transitive)

• - Removedansi-styles@3.2.1(transitive)

• - Removedbabel-plugin-styled-components@2.1.4(transitive)

• - Removedbrowserslist@4.23.0(transitive)

• - Removedcamelize@1.0.1(transitive)

• - Removedcaniuse-lite@1.0.30001616(transitive)

• - Removedchalk@2.4.2(transitive)

• - Removedclsx@1.2.1(transitive)

• - Removedcolor-convert@1.9.3(transitive)

• - Removedcolor-name@1.1.3(transitive)

• - Removedconvert-source-map@2.0.0(transitive)

• - Removedcss-color-keywords@1.0.0(transitive)

• - Removedcss-to-react-native@3.2.0(transitive)

• - Removedcss-vendor@2.0.8(transitive)

• - Removedcsstype@2.6.21(transitive)

• - Removeddebug@4.3.4(transitive)

• - Removedelectron-to-chromium@1.4.761(transitive)

• - Removedescalade@3.1.2(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• - Removedgensync@1.0.0-beta.2(transitive)

• - Removedglobals@11.12.0(transitive)

• - Removedhas-flag@3.0.0(transitive)

• - Removedhoist-non-react-statics@3.3.2(transitive)

• - Removedhyphenate-style-name@1.0.4(transitive)

• - Removedis-in-browser@1.1.3(transitive)

• - Removedjsesc@2.5.2(transitive)

• - Removedjson5@2.2.3(transitive)

• - Removedjss@10.10.0(transitive)

• - Removedjss-plugin-camel-case@10.10.0(transitive)

• - Removedjss-plugin-default-unit@10.10.0(transitive)

• - Removedjss-plugin-global@10.10.0(transitive)

• - Removedjss-plugin-nested@10.10.0(transitive)

• - Removedjss-plugin-props-sort@10.10.0(transitive)

• - Removedjss-plugin-rule-value-function@10.10.0(transitive)

• - Removedjss-plugin-vendor-prefixer@10.10.0(transitive)

• - Removedlodash@4.17.21(transitive)

• - Removedlru-cache@5.1.1(transitive)

• - Removedms@2.1.2(transitive)

• - Removednode-releases@2.0.14(transitive)

• - Removedpicocolors@1.0.0(transitive)

• - Removedpicomatch@2.3.1(transitive)

• - Removedpopper.js@1.16.1-lts(transitive)

• - Removedpostcss-value-parser@4.2.0(transitive)

• - Removedreact@17.0.2(transitive)

• - Removedreact-dom@17.0.2(transitive)

• - Removedreact-is@17.0.2(transitive)

• - Removedscheduler@0.20.2(transitive)

• - Removedsemver@6.3.1(transitive)

• - Removedshallowequal@1.1.0(transitive)

• - Removedstyled-components@5.3.11(transitive)

• - Removedsupports-color@5.5.0(transitive)

• - Removedtiny-warning@1.0.3(transitive)

• - Removedto-fast-properties@2.0.0(transitive)

• - Removedupdate-browserslist-db@1.0.15(transitive)

• - Removedyallist@3.1.1(transitive)