import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/objectWithoutProperties";import i from"@babel/runtime/helpers/slicedToArray";import{useState as n}from"react";import o from"prop-types";import{SizeMe as t}from"react-sizeme";import{Collapse as l,Popover as a}from"@material-ui/core";import{withStyles as c}from"@material-ui/core/styles";import s from"./components/FiltersToggler.js";import d from"./components/PinAppSwitch.js";import{useComonentsWidth as p,useAppFilterTogglerWidth as m,useFilterLayout as u}from"./effects/index.js";import{getStartComponent as h,getMiddleComponent as f,getEndComponents as b}from"./utils.js";import{LARGE_SIZE_LAYOUT as v,MEDIUM_SIZE_LAYOUT as P,SMALL_SIZE_LAYOUT as O}from"./constants.js";import y from"./PinnableFilters.css.js";import{jsxs as j,jsx as g}from"react/jsx-runtime";var w=["children"];function N(e,r){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),i.push.apply(i,n)}return i}function S(r){for(var i=1;i<arguments.length;i++){var n=null!=arguments[i]?arguments[i]:{};i%2?N(Object(n),!0).forEach((function(i){e(r,i,n[i])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(n)):N(Object(n)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(n,e))}))}return r}function k(e){var r=e.children,o=e.classes,t=e.appWidth,c=e.isPinnedInitial,w=e.isShownInitial,N=e.onShowCallback,S=e.onPinCallback,k=n(null),C=i(k,2),M=C[0],T=C[1],W=n(c),B=i(W,2),E=B[0],I=B[1],q=n(w),z=i(q,2),D=z[0],L=z[1],R=n(!1),x=i(R,2),A=x[0],F=x[1],G=function(e){L(e),N&&N(e)},H=p(r),J=H.componentsWidth,K=H.hiddenElements,Q=m(),U=u(r,J,Q,t),V=h(r),X=f(r),Y=b(r),Z=function(e){E?G(!D):T(e.currentTarget)},$=function(){var e,r=!E;r&&(T(null),G(!0)),I(e=r),S&&S(e)};return j("div",{style:{width:"100%"},children:[g(l,{timeout:10,in:U===v,children:j("div",{className:y.containerLarge,children:[g("div",{children:V}),j("div",{className:y.containerLargeTopright,children:[X,Y]})]})}),g(l,{timeout:10,in:U===P,children:j("div",{className:y.containerMedium,children:[j("div",{className:y.containerMediumTop,children:[j("div",{className:y.containerButtonsWrapper,onMouseEnter:function(){return F(!0)},onMouseLeave:function(){return F(!1)},children:[g(s,{onClick:Z}),(A||E||Boolean(M))&&g(d,{isPinned:E,onClick:$})]}),j("div",{className:y.containerMediumTopright,children:[X,Y]})]}),g(l,{timeout:100,in:E&&D,children:g("div",{className:y.containerMediumBottom,children:V})})]})}),g(l,{timeout:10,in:U===O,children:j("div",{className:y.containerSmall,children:[j("div",{className:y.containerSmallTop,children:[j("div",{className:y.containerButtonsWrapper,onMouseEnter:function(){return F(!0)},onMouseLeave:function(){return F(!1)},children:[g(s,{onClick:Z}),(A||E||Boolean(M))&&g(d,{isPinned:E,onClick:$})]}),g("div",{children:Y})]}),g(l,{timeout:100,in:E&&D,children:g("div",{className:y.containerSmallMiddle,children:V})}),g("div",{className:y.containerSmallBottom,children:X})]})}),g(a,{id:"filters-popper",classes:{paper:o.paper},open:Boolean(M),anchorEl:M,onClose:function(){T(null)},anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},children:g("div",{className:y.containerPopper,children:V})}),K]})}k.propTypes={classes:o.shape({}).isRequired,appWidth:o.number.isRequired,children:o.arrayOf(o.node).isRequired,isPinnedInitial:o.bool,isShownInitial:o.bool,onShowCallback:o.func,onPinCallback:o.func},k.defaultProps={isPinnedInitial:!1,isShownInitial:!1,onShowCallback:void 0,onPinCallback:void 0};var C=c({paper:{backgroundColor:"#414141"}})(k);function M(e){var i=e.children,n=r(e,w);return g(t,{monitorWidth:!0,children:function(e){var r=e.size;return g(C,S(S({appWidth:r.width-21},n),{},{children:i}))}})}M.propTypes={children:o.arrayOf(o.node).isRequired};export{M as default};
