@fattureincloud/fic-design-system 0.3.23-alpha.0 → 0.3.23

Sign up to get free protection for your applications and to get access to all the features.
Files changed (5) hide show
  1. package/dist/components/layout/sidebarItem/SidebarItem.d.ts +1 -0
  2. package/dist/components/layout/sidebarItem/sidebarItem.stories.d.ts +1 -0
  3. package/dist/index.esm.js +3716 -15
  4. package/dist/index.js +3771 -1
  5. package/package.json +19 -19
package/dist/index.esm.js CHANGED
@@ -1,15 +1,3716 @@
1
- import{faChevronDown as n,faTimes as e,faTimesCircle as t,faExclamationTriangle as r,faInfoCircle as o,faCheckCircle as i,faCheck as a,faMinus as l,faCaretDown as c,faEllipsisH as s,faCaretRight as p,faSortUp as d,faSortDown as u,faSort as f,faEquals as m,faInfoSquare as g}from"@fortawesome/pro-solid-svg-icons";import h,{useMemo as x,Component as b,useCallback as y,useRef as v,useState as w,useEffect as _}from"react";import k,{css as E,useTheme as T,createGlobalStyle as C,ThemeProvider as z}from"styled-components";import{FontAwesomeIcon as F}from"@fortawesome/react-fontawesome";import{faCircleNotch as D,faCircle as A}from"@fortawesome/pro-regular-svg-icons";import{usePopper as P}from"react-popper";import{CSSTransition as S}from"react-transition-group";import{useClickAway as O,useMeasure as N,useDebounce as I}from"react-use";import B,{components as R}from"react-select";import L from"react-select/async";import j from"react-select/async-creatable";import H from"react-select/creatable";import{faTimes as M,faSearch as U,faEllipsisH as W}from"@fortawesome/pro-light-svg-icons";import V from"react-modal";import X from"lodash/range";import q from"lodash";import{DragDropContext as K,Droppable as J,Draggable as G}from"react-beautiful-dnd";import{faRocket as Q}from"@fortawesome/pro-duotone-svg-icons";import{toast as Y,ToastContainer as Z}from"react-toastify";
2
- /*! *****************************************************************************
3
- Copyright (c) Microsoft Corporation.
4
-
5
- Permission to use, copy, modify, and/or distribute this software for any
6
- purpose with or without fee is hereby granted.
7
-
8
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
9
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
10
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
11
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
12
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
13
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
14
- PERFORMANCE OF THIS SOFTWARE.
15
- ***************************************************************************** */var $=function(n,e){return $=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(n,e){n.__proto__=e}||function(n,e){for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&(n[t]=e[t])},$(n,e)};function nn(n,e){if("function"!=typeof e&&null!==e)throw new TypeError("Class extends value "+String(e)+" is not a constructor or null");function t(){this.constructor=n}$(n,e),n.prototype=null===e?Object.create(e):(t.prototype=e.prototype,new t)}var en=function(){return en=Object.assign||function(n){for(var e,t=1,r=arguments.length;t<r;t++)for(var o in e=arguments[t])Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n},en.apply(this,arguments)};function tn(n,e){var t={};for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&e.indexOf(r)<0&&(t[r]=n[r]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(n);o<r.length;o++)e.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(n,r[o])&&(t[r[o]]=n[r[o]])}return t}function rn(){for(var n=0,e=0,t=arguments.length;e<t;e++)n+=arguments[e].length;var r=Array(n),o=0;for(e=0;e<t;e++)for(var i=arguments[e],a=0,l=i.length;a<l;a++,o++)r[o]=i[a];return r}function on(n,e){return Object.defineProperty?Object.defineProperty(n,"raw",{value:e}):n.raw=e,n}var an,ln,cn,sn,pn,dn,un,fn,mn,gn,hn,xn,bn,yn,vn,wn,_n,kn,En,Tn,Cn,zn,Fn,Dn,An,Pn,Sn,On,Nn,In,Bn,Rn,Ln,jn,Hn,Mn,Un,Wn,Vn,Xn,qn,Kn,Jn,Gn,Qn,Yn,Zn,$n,ne,ee,te,re,oe,ie,ae,le,ce,se,pe,de,ue,fe,me,ge,he,xe,be,ye,ve,we,_e,ke,Ee,Te,Ce,ze,Fe,De,Ae,Pe,Se,Oe,Ne,Ie,Be,Re,Le,je,He,Me,Ue,We,Ve,Xe,qe,Ke,Je,Ge,Qe,Ye,Ze,$e,nt,et,tt,rt,ot,it,at,lt,ct,st,pt,dt,ut,ft,mt,gt,ht,xt,bt,yt,vt,wt,_t,kt,Et,Tt,Ct,zt,Ft,Dt,At,Pt,St,Ot,Nt,It,Bt,Rt,Lt,jt,Ht,Mt,Ut,Wt,Vt={xs:".75em",sm:".875em",lg:"1.33em","1x":"1em","2x":"2em","3x":"3em","4x":"4em","5x":"5em","6x":"6em","7x":"7em","8x":"8em","9x":"9em","10x":"10em"},Xt=function(n){var e=n.children,t=tn(n,["children"]);return h.createElement(qt,en({},t),e)},qt=k.div(an||(an=on(["\n background-color: ",";\n border-radius: 50%;\n\n min-width: calc("," * ",");\n min-height: calc("," * ",");\n\n display: inline-flex;\n justify-content: center;\n align-items: center;\n"],["\n background-color: ",";\n border-radius: 50%;\n\n min-width: calc("," * ",");\n min-height: calc("," * ",");\n\n display: inline-flex;\n justify-content: center;\n align-items: center;\n"])),(function(n){var e=n.theme,t=n.color;return n.backgroundColor||e.components.iconBackground[t]||"transparent"}),1.5,(function(n){var e=n.size;return Vt[e]}),1.5,(function(n){var e=n.size;return Vt[e]})),Kt={900:"#0028AD",800:"#0038B9",700:"#0041C0",600:"#004BC7",500:"#0052CC",400:"#266CD4",300:"#4D86DB",200:"#80A9E6",100:"#B3CBF0",50:"#E0EAF9"},Jt={black:{8:"rgba(51, 51, 51, 0.08)",16:"rgba(51, 51, 51, 0.16)",48:"rgba(51, 51, 51, 0.48)",80:"rgba(51, 51, 51, 0.8)",100:"#333333"},white:{8:"rgba(255, 255, 255, 0.08)",16:"rgba(255, 255, 255, 0.16)",48:"rgba(255, 255, 255, 0.48)",80:"rgba(255, 255, 255, 0.8)",100:"#FFFFFF"},grey:{900:"#091E42",800:"#253858",700:"#505F79",600:"#5E6C84",500:"#6B778C",400:"#7A869A",300:"#A5ADBA",200:"#C1C7D0",100:"#EBECF0",50:"#FAFBFC"},blue:Kt,indigo:{900:"#05175E",800:"#082188",700:"#0A29A6",600:"#0B2FBF",500:"#0D35D5",400:"#637CE3",300:"#90A3EB",200:"#B3BFF1",100:"#D0D7F6",50:"#E8ECFB"},yellow:{900:"#FF6B0A",800:"#FF7C12",700:"#FF8617",600:"#FF911B",500:"#FF991F",400:"#FFA841",300:"#FFB862",200:"#FFCC8F",100:"#FFE0BC",50:"#FFF3E4"},orange:{900:"#783722",800:"#A74D2F",700:"#CA5D39",600:"#E66A42",500:"#FF7649",400:"#FF9978",300:"#FFB49B",200:"#FFCAB9",100:"#FFDED3",50:"#FFEFEA"},red:{900:"#C81603",800:"#D12206",700:"#D52808",600:"#DA300A",500:"#DE350B",400:"#E35330",300:"#E87254",200:"#EF9A85",100:"#F5C2B6",50:"#FBE7E2"},green:{900:"#00572E",800:"#006A3F",700:"#007448",600:"#007F52",500:"#00875A",400:"#269973",300:"#4DAB8C",200:"#80C3AD",100:"#B3DBCE",50:"#E0F1EB"},fuchsia:{900:"#500663",800:"#71088B",700:"#880AA8",600:"#9C0BC0",500:"#AD0DD5",400:"#CB67E4",300:"#DB94EC",200:"#E6B6F2",100:"#EFD2F7",50:"#F7E9FB"},pink:{900:"#640648",800:"#8C0864",700:"#A80A79",600:"#C00B8A",500:"#D50D99",400:"#E569BF",300:"#EC96D2",200:"#F2B7E0",100:"#F7D2EC",50:"#FBEAF6"},cyan:{900:"#066552",800:"#088C72",700:"#0AA989",600:"#0BC09C",500:"#0DD5AD",400:"#4DE0C2",300:"#7DE8D3",200:"#A4EFE0",100:"#C6F5EB",50:"#E4FAF5"},primary:Kt},Gt=(Jt.blue[50],Jt.indigo[50],Jt.yellow[50],Jt.orange[50],Jt.red[50],Jt.green[50],Jt.fuchsia[50],Jt.pink[50],Jt.cyan[50],Jt.primary[50],Jt.grey[100],Jt.white[16],Jt.black[16],function(n){var e=n.onClick,t=n.isDisabled,r=tn(n,["onClick","isDisabled"]),o=x((function(){return t||!e?void 0:function(n){return e(n)}}),[t,e]);return h.createElement(Qt,en({},r,{onClick:o}))}),Qt=k(F).attrs((function(n){var e=n.theme,t=n.color;return t?e.components.icon[t]:{primary:"inherit",secondary:"inherit"}}))(ln||(ln=on(["\n cursor: ",";\n color: ",";\n --fa-secondary-color: ",";\n"],["\n cursor: ",";\n color: ",";\n --fa-secondary-color: ",";\n"])),(function(n){return n.onClick?"pointer":"inherit"}),(function(n){return n.primary}),(function(n){return n.secondary})),Yt=function(n){return{primary:Jt[n][500],secondary:Jt[n][200]}},Zt=(Yt("blue"),Yt("red"),Yt("green"),Yt("yellow"),Yt("orange"),Yt("primary"),Yt("cyan"),Yt("fuchsia"),Yt("indigo"),Yt("pink"),Yt("grey"),Jt.white[100],Jt.white[48],Jt.black[100],Jt.black[48],"4px"),$t="8px",nr="12px",er="16px",tr="24px",rr="32px",or="64px",ir=k.div(cn||(cn=on(["\n color: ",";\n .header {\n border-top: 1px solid ",";\n display: flex;\n align-items: center;\n width: 100%;\n height: ",";\n .header__element {\n padding: 0 ",";\n &:hover {\n &.pointer {\n cursor: pointer;\n }\n }\n }\n\n .action_icon {\n cursor: pointer;\n display: none;\n width: ",";\n height: ",";\n &.visibile {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n }\n &:hover {\n background: ",";\n border-radius: 4px;\n }\n }\n\n .chevron {\n }\n .chevron__closed {\n transform: rotate(-90deg);\n }\n\n .title {\n flex: 1;\n padding: 0;\n user-select: none;\n p {\n margin: 0;\n font-size: 20px;\n line-height: 30px;\n }\n }\n }\n\n .body {\n padding: 0 ",";\n height: auto;\n\n &.closed {\n overflow: hidden;\n height: 0;\n }\n }\n"],["\n color: ",";\n .header {\n border-top: 1px solid ",";\n display: flex;\n align-items: center;\n width: 100%;\n height: ",";\n .header__element {\n padding: 0 ",";\n &:hover {\n &.pointer {\n cursor: pointer;\n }\n }\n }\n\n .action_icon {\n cursor: pointer;\n display: none;\n width: ",";\n height: ",";\n &.visibile {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n }\n &:hover {\n background: ",";\n border-radius: 4px;\n }\n }\n\n .chevron {\n }\n .chevron__closed {\n transform: rotate(-90deg);\n }\n\n .title {\n flex: 1;\n padding: 0;\n user-select: none;\n p {\n margin: 0;\n font-size: 20px;\n line-height: 30px;\n }\n }\n }\n\n .body {\n padding: 0 ",";\n height: auto;\n\n &.closed {\n overflow: hidden;\n height: 0;\n }\n }\n"])),(function(n){return n.theme.palette.black[100]}),(function(n){return n.theme.palette.grey[100]}),or,tr,rr,rr,(function(n){return n.theme.palette.grey[100]}),tr),ar=function(e){function t(n){var t=e.call(this,n)||this;t.handleOpenAccordion=function(){var n=t.state.show;t.setState({show:!n})};var r=t.props.showBodyAtFirstRender;return t.state={show:Boolean(r)},t}return nn(t,e),t.prototype.render=function(){var e=this.props,t=e.lateralActions,r=e.renderBody,o=e.renderLateralActions,i=e.renderTitle,a=e.title,l=this.state.show;return h.createElement(h.Fragment,null,h.createElement("div",{className:"header"},h.createElement("div",{onClick:this.handleOpenAccordion,className:"header__element pointer chevron"+(l?"":"__closed")},h.createElement(Gt,{icon:n})),h.createElement("div",{onClick:this.handleOpenAccordion,className:"header__element title pointer"},i?h.createElement(h.Fragment,null,i()):h.createElement("p",null,a)),h.createElement("div",{className:"header__element"},o||(null==t?void 0:t.map((function(n,e){return h.createElement("span",{className:"action_icon "+(l?"visibile":""),key:e,onClick:n.action},n.icon)}))))),l&&h.createElement("div",{className:"body"},r()))},t}(b),lr=function(n){return h.createElement(ir,en({},n),h.createElement(ar,en({},n)))},cr={xs:16,s:24,m:32,l:40},sr={xs:10,s:12,m:14,l:20},pr=k((function(n){return h.createElement("span",{className:n.className})})).attrs((function(n){return{initials:n.initials?["m","l"].includes(n.size)?n.initials.slice(0,2):n.initials[0]:""}}))(sn||(sn=on(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n -webkit-box-pack: center;\n height: ","px;\n width: ","px;\n line-height: 0;\n border-radius: 100%;\n -webkit-box-align: center;\n background-size: cover;\n color: white;\n background-color: ",";\n ","\n\n &:after {\n content: '","';\n line-height: 40px;\n font-weight: 500;\n font-style: normal;\n font-size: ","px;\n text-transform: uppercase;\n }\n"],["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n -webkit-box-pack: center;\n height: ","px;\n width: ","px;\n line-height: 0;\n border-radius: 100%;\n -webkit-box-align: center;\n background-size: cover;\n color: white;\n background-color: ",";\n ","\n\n &:after {\n content: '","';\n line-height: 40px;\n font-weight: 500;\n font-style: normal;\n font-size: ","px;\n text-transform: uppercase;\n }\n"])),(function(n){return cr[n.size||"m"]}),(function(n){return cr[n.size||"m"]}),(function(n){return n.theme.palette.primary[500]}),(function(n){return function(n){var e=n.image,t=n.initials,r=n.placeholder;if(!e&&!r)return{};var o=[];return e&&o.push("url("+e+")"),r&&!t&&o.push("url("+r+")"),{backgroundImage:o.join()}}(n)}),(function(n){return n.image?"":n.initials}),(function(n){return sr[n.size||"m"]})),dr=k.div(pn||(pn=on(["\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n border-radius: 4px;\n margin: 3px 0;\n max-height: 24px;\n\n padding-left: ",";\n padding-right: ",";\n\n color: ",";\n background-color: ",";\n\n &.red {\n background-color: ",";\n color: ",";\n }\n\n &.green {\n background-color: ",";\n color: ",";\n }\n"],["\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n border-radius: 4px;\n margin: 3px 0;\n max-height: 24px;\n\n padding-left: ",";\n padding-right: ",";\n\n color: ",";\n background-color: ",";\n\n &.red {\n background-color: ",";\n color: ",";\n }\n\n &.green {\n background-color: ",";\n color: ",";\n }\n"])),(function(n){var e=n.imageUrl;return n.leftIcon||e?"8px":"0"}),(function(n){return n.rightIcon?"8px":"0"}),(function(n){return n.theme.palette.grey[700]}),(function(n){return n.theme.palette.grey[50]}),(function(n){return n.theme.palette.red[50]}),(function(n){return n.theme.palette.red[900]}),(function(n){return n.theme.palette.green[50]}),(function(n){return n.theme.palette.green[900]})),ur=function(n){var e=n.color,t=n.handleRightIconClick,r=n.imageUrl,o=n.leftIcon,i=n.rightIcon,a=n.text;return h.createElement(dr,en({className:e||""},n),r&&h.createElement(pr,{size:"xs",image:r}),o&&h.createElement(Gt,en({},o)),h.createElement(fr,null,a),i&&h.createElement(Gt,en({},i,{onClick:t})))},fr=k.div(dn||(dn=on(["\n padding: "," ",";\n"],["\n padding: "," ",";\n"])),Zt,$t),mr=function(n){var t=n.color,r=n.content,o=n.icon,i=n.onClose;return h.createElement(gr,{color:t},o&&h.createElement(Gt,en({},o)),h.createElement(hr,null,r),i&&h.createElement(Gt,{icon:e,color:"grey",onClick:i}))},gr=k.div(fn||(fn=on(["\n ","\n padding: 10px 20px 10px 20px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 10px;\n"],["\n ","\n padding: 10px 20px 10px 20px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 10px;\n"])),(function(n){var e=n.color,t=function(n,e){switch(e){case"red":case"blue":case"yellow":case"green":return{bgColor:n.palette[e][500],textColor:n.palette.white[100]};case"grey":return{bgColor:n.palette.grey[200],textColor:n.palette.black[100]};default:return{bgColor:n.palette.grey[900],textColor:n.palette.white[100]}}}(n.theme,e),r=t.bgColor,o=t.textColor;return E(un||(un=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),r,o)})),hr=k.div(mn||(mn=on(["\n flex-grow: 1;\n"],["\n flex-grow: 1;\n"]))),xr=function(n){var e=n.manualLock,t=void 0!==e&&e,r=n.onClick,o=n.timeMs,i=void 0===o?250:o,a=v(!0);return y((function(n){a.current&&!t&&(a.current=!1,setTimeout((function(){return a.current=!0}),i),null==r||r(n))}),[r,t,i])},br={large:40,medium:32},yr=function(n){var e=n.color,t=n.isDisabled,r=n.size,o=n.theme,i=n.type,a=o.components.button,l=a.defaultColor,c=a.defaultSize,s=a.defaultType,p=i||s,d=r||c,u=t?"disabled":e||l,f="primary"===p?"1px solid rgba(9, 30, 66, 0.16)":"",m=t?"default":"pointer",g=o.components.button[p][u];return en({height:br[d],border:f,cursor:m},g)},vr=k(Gt)(gn||(gn=on(["\n display: inline-block;\n"],["\n display: inline-block;\n"]))),wr=k(vr)(hn||(hn=on([""],[""]))),_r=k(vr)(xn||(xn=on([""],[""]))),kr=k((function(n){var e=n.className;return h.createElement("div",{className:e},h.createElement(Gt,{icon:D,spin:!0}))}))(bn||(bn=on(["\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n"],["\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n"]))),Er=k.div(yn||(yn=on(["\n display: inline-block;\n line-height: initial;\n"],["\n display: inline-block;\n line-height: initial;\n"]))),Tr=k.div(vn||(vn=on(["\n opacity: ",";\n display: inline-flex;\n align-items: center;\n justify-content: center;\n"],["\n opacity: ",";\n display: inline-flex;\n align-items: center;\n justify-content: center;\n"])),(function(n){return n.isLoading?0:1})),Cr=E(wn||(wn=on(["\n border-radius: 4px;\n user-select: none;\n position: relative;\n text-align: center;\n\n width: ",";\n\n font-weight: 500;\n\n cursor: ",";\n border: ",";\n\n "," {\n height: ","px;\n }\n\n "," + * {\n margin-left: 8px;\n }\n\n "," + * {\n margin-left: 8px;\n }\n\n color: ",";\n background-color: ",";\n\n &:hover {\n color: ",";\n background-color: ",";\n }\n\n &:active {\n background-color: ",";\n }\n\n padding: 0 12px;\n\n display: inline-block;\n"],["\n border-radius: 4px;\n user-select: none;\n position: relative;\n text-align: center;\n\n width: ",";\n\n font-weight: 500;\n\n cursor: ",";\n border: ",";\n\n "," {\n height: ","px;\n }\n\n "," + * {\n margin-left: 8px;\n }\n\n "," + * {\n margin-left: 8px;\n }\n\n color: ",";\n background-color: ",";\n\n &:hover {\n color: ",";\n background-color: ",";\n }\n\n &:active {\n background-color: ",";\n }\n\n padding: 0 12px;\n\n display: inline-block;\n"])),(function(n){return n.fullWidth?"100%":"initial"}),(function(n){return n.cursor}),(function(n){return n.border}),Tr,(function(n){return n.height}),wr,Er,(function(n){return n.text}),(function(n){return n.normal}),(function(n){return n.textHover}),(function(n){return n.hover}),(function(n){return n.active})),zr=k.a.attrs(yr)(_n||(_n=on(["\n ",";\n\n text-decoration: none;\n"],["\n ",";\n\n text-decoration: none;\n"])),Cr),Fr=k.div.attrs(yr)(kn||(kn=on(["\n ",";\n"],["\n ",";\n"])),Cr),Dr=function(n){var e=n.className,t=n.color,r=n.fullWidth,o=void 0!==r&&r,i=n.href,a=n.iconLeft,l=n.iconRight,c=n.isDisabled,s=void 0!==c&&c,p=n.isLoading,d=void 0!==p&&p,u=n.onClick,f=n.size,m=n.target,g=n.text,x=n.type,b=xr({onClick:u,manualLock:d||s}),v=!s&&d,w=y((function(n){return i?h.createElement(zr,en({},n)):h.createElement(Fr,en({},n))}),[i]);return h.createElement(w,{className:e,size:f,color:t,onClick:b,href:i,type:x,isDisabled:s,fullWidth:o,target:m},h.createElement(Tr,{isLoading:v},a&&h.createElement(wr,en({},a)),g&&h.createElement(Er,null,g),l&&h.createElement(_r,en({},l))),v&&h.createElement(kr,null))},Ar=(Jt.blue[500],Jt.blue[700],Jt.blue[900],Jt.white[100],Jt.grey[100],Jt.red[500],Jt.red[700],Jt.red[900],Jt.white[100],Jt.grey[100],Jt.green[500],Jt.green[700],Jt.green[900],Jt.white[100],Jt.grey[100],Jt.white[100],Jt.grey[100],Jt.grey[200],Jt.black[100],Jt.black[100],Jt.yellow[500],Jt.yellow[700],Jt.yellow[900],Jt.white[100],Jt.grey[100],Jt.grey[50],Jt.grey[50],Jt.grey[50],Jt.grey[200],Jt.grey[200],Jt.blue[50],Jt.blue[100],Jt.blue[200],Jt.blue[900],Jt.blue[900],Jt.red[50],Jt.red[100],Jt.red[200],Jt.red[900],Jt.red[900],Jt.green[50],Jt.green[100],Jt.green[200],Jt.green[900],Jt.green[900],Jt.yellow[50],Jt.yellow[100],Jt.yellow[200],Jt.yellow[900],Jt.yellow[900],Jt.grey[50],Jt.grey[100],Jt.grey[200],Jt.black[100],Jt.black[100],Jt.grey[50],Jt.grey[50],Jt.grey[50],Jt.grey[200],Jt.grey[200],Jt.blue[50],Jt.blue[100],Jt.blue[500],Jt.blue[500],Jt.red[50],Jt.red[100],Jt.red[500],Jt.red[500],Jt.green[50],Jt.green[100],Jt.green[500],Jt.green[500],Jt.grey[50],Jt.grey[100],Jt.grey[500],Jt.grey[500],Jt.yellow[50],Jt.yellow[100],Jt.yellow[500],Jt.yellow[500],Jt.grey[200],Jt.grey[200],function(n){var e=n.className,t=n.color,r=n.icon,o=n.isDisabled,i=void 0!==o&&o,a=n.onClick,l=n.type,c=xr({onClick:a,manualLock:i});return h.createElement(Pr,{color:t,className:e,type:l,onClick:c,isDisabled:i},h.createElement(Gt,en({},r)))}),Pr=k.div.attrs((function(n){var e=n.color,t=n.isDisabled,r=n.theme,o=n.type,i=r.components.iconButton,a=i.defaultColor,l=i.defaultType,c=t?"disabled":e||a,s=o||l;return r.components.iconButton[s][c]}))(En||(En=on(["\n display: inline-flex;\n font-size: 20px;\n text-decoration: none;\n padding: 0 8px;\n height: 32px;\n align-items: center;\n\n cursor: ",";\n color: ",";\n\n :hover {\n color: ",";\n text-decoration: none;\n }\n"],["\n display: inline-flex;\n font-size: 20px;\n text-decoration: none;\n padding: 0 8px;\n height: 32px;\n align-items: center;\n\n cursor: ",";\n color: ",";\n\n :hover {\n color: ",";\n text-decoration: none;\n }\n"])),(function(n){return n.isDisabled?"default":"pointer"}),(function(n){return n.normal}),(function(n){return n.hover})),Sr=(Jt.blue[200],Jt.blue[500],Jt.red[200],Jt.red[500],Jt.green[200],Jt.green[500],Jt.yellow[200],Jt.yellow[500],Jt.grey[200],Jt.grey[200],Jt.blue[200],Jt.white[100],Jt.red[200],Jt.white[100],Jt.green[200],Jt.white[100],Jt.yellow[200],Jt.white[100],Jt.grey[200],Jt.grey[200],k.div(zn||(zn=on(["\n border-radius: 100px;\n display: inline-flex;\n align-items: center;\n font-size: 14px;\n line-height: 1em;\n white-space: nowrap;\n padding: 5px ",";\n\n ","\n\n ","\n"],["\n border-radius: 100px;\n display: inline-flex;\n align-items: center;\n font-size: 14px;\n line-height: 1em;\n white-space: nowrap;\n padding: 5px ",";\n\n ","\n\n ","\n"])),$t,(function(n){var e=n.theme.palette;return E(Tn||(Tn=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.grey[100],e.black[100])}),(function(n){var e=n.statusEdit,t=n.theme.palette;if(e)return E(Cn||(Cn=on(["\n &:hover {\n background-color: ",";\n }\n &:active {\n background-color: ",";\n }\n "],["\n &:hover {\n background-color: ",";\n }\n &:active {\n background-color: ",";\n }\n "])),t.grey[200],t.grey[300])}))),Or=k(Gt)(Fn||(Fn=on(["\n cursor: pointer;\n margin-left: ",";\n &:hover {\n cursor: pointer;\n }\n"],["\n cursor: pointer;\n margin-left: ",";\n &:hover {\n cursor: pointer;\n }\n"])),$t),Nr=function(n){function t(){return null!==n&&n.apply(this,arguments)||this}return nn(t,n),t.prototype.render=function(){var n=this.props,t=n.closeAction,r=n.statusEdit,o=n.text;return h.createElement(h.Fragment,null,o," ",r?h.createElement("div",null,h.createElement(Or,{icon:e,onClick:function(){t&&t()}})):null)},t}(b),Ir=function(n){return h.createElement(Sr,en({},n),h.createElement(Nr,en({},n)))},Br=k.div(Pn||(Pn=on(["\n ","\n"],["\n ","\n"])),(function(n){var e=n.show,t=n.theme.palette;return E(An||(An=on(["\n .drawer {\n position: fixed;\n right: 0;\n top: 0;\n height: 100vh;\n width: 500px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px 0 0 8px;\n transform: translateX(110%);\n transition: transform 0.4s ease-in-out;\n z-index: 5;\n background-color: ",";\n display: flex;\n flex-direction: column;\n\n ","\n\n .drawer__header {\n padding-right: calc("," + ",");\n padding-left: ",";\n display: flex;\n align-items: center;\n background-color: ",";\n border-bottom: 1px solid ",";\n\n .drawer__header__title {\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n display: flex;\n align-items: center;\n height: calc("," + ",");\n }\n\n .drawer__header__actions {\n position: absolute;\n right: ",";\n top: ",";\n font-size: 24px;\n }\n }\n\n .drawer__body {\n height: 100%;\n overflow-y: scroll;\n }\n\n .drawer__footer {\n height: 80px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding: 0 ",";\n border-top: 1px solid ",";\n }\n }\n "],["\n .drawer {\n position: fixed;\n right: 0;\n top: 0;\n height: 100vh;\n width: 500px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px 0 0 8px;\n transform: translateX(110%);\n transition: transform 0.4s ease-in-out;\n z-index: 5;\n background-color: ",";\n display: flex;\n flex-direction: column;\n\n ","\n\n .drawer__header {\n padding-right: calc("," + ",");\n padding-left: ",";\n display: flex;\n align-items: center;\n background-color: ",";\n border-bottom: 1px solid ",";\n\n .drawer__header__title {\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n display: flex;\n align-items: center;\n height: calc("," + ",");\n }\n\n .drawer__header__actions {\n position: absolute;\n right: ",";\n top: ",";\n font-size: 24px;\n }\n }\n\n .drawer__body {\n height: 100%;\n overflow-y: scroll;\n }\n\n .drawer__footer {\n height: 80px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding: 0 ",";\n border-top: 1px solid ",";\n }\n }\n "])),t.white[100],function(n){return n?E(Dn||(Dn=on(["\n transform: translateX(0);\n "],["\n transform: translateX(0);\n "]))):void 0}(e),or,er,tr,t.grey[50],t.grey[100],or,er,tr,tr,tr,t.grey[100])})),Rr=k(Gt)(Sn||(Sn=on(["\n cursor: pointer;\n &:hover {\n color: ",";\n"],["\n cursor: pointer;\n &:hover {\n color: ",";\n"])),(function(n){return n.theme.palette.grey[800]})),Lr=function(n){function t(e){var t=n.call(this,e)||this;return t.state={},t}return nn(t,n),t.prototype.render=function(){var n=this.props,t=n.actionClose,r=n.renderFooter,o=n.renderHeader,i=n.title;return h.createElement("div",{className:"drawer"},h.createElement("div",{className:"drawer__header"},o?o():h.createElement("div",{className:"drawer__header__title"},i),h.createElement("div",{className:"drawer__header__actions"},h.createElement("span",{onClick:t},h.createElement(Rr,{icon:e})))),h.createElement("div",{className:"drawer__body"},this.props.children),r?h.createElement("div",{className:"drawer__footer"},r()):null)},t}(b),jr=function(n){return h.createElement(Br,en({},n),h.createElement(Lr,en({},n)))},Hr=k.span(On||(On=on(["\n background-color: transparent;\n color: ",";\n padding: 0 2px 0 2px;\n white-space: nowrap;\n font-size: 12px;\n"],["\n background-color: transparent;\n color: ",";\n padding: 0 2px 0 2px;\n white-space: nowrap;\n font-size: 12px;\n"])),(function(n){return n.theme.palette.grey[500]})),Mr=function(n){var e=n.active,t=n.className,r=n.icon,o=n.onClick,i=n.shortcut,a=n.text,l=n.isDisabled,c=tn(n,["active","className","icon","onClick","shortcut","text","isDisabled"]),s=y((function(n){return!l&&(null==o?void 0:o(n))}),[l,o]);return h.createElement(Wr,en({className:t||"",onClick:s,active:!!e,hasAction:!!o,isDisabled:l},c),h.createElement(Vr,null,r&&h.createElement(Gt,en({},r)),h.createElement(Xr,null,a),i&&h.createElement(Hr,null,i)))},Ur=E(Nn||(Nn=on(["\n &:hover {\n background-color: ",";\n }\n"],["\n &:hover {\n background-color: ",";\n }\n"])),(function(n){return n.theme.palette.grey[100]})),Wr=k.div.attrs((function(n){var e=n.theme,t=n.isDisabled,r=n.active,o=n.hasAction,i=n.type,a=void 0===i?"default":i,l=e.components.dropdown.items.notActive[a],c=e.components.dropdown.items.active,s=r?c:l;return{opacity:t?.5:1,background:s.background,color:s.color,cursor:o?"pointer":"default",hoverBackground:s.hoverBackground}}))(In||(In=on(["\n text-align: left;\n line-height: 21px !important;\n padding: 5px 16px;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n\n opacity: ",";\n color: ",";\n background-color: ",";\n cursor: ",";\n\n ",";\n"],["\n text-align: left;\n line-height: 21px !important;\n padding: 5px 16px;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n\n opacity: ",";\n color: ",";\n background-color: ",";\n cursor: ",";\n\n ",";\n"])),(function(n){return n.opacity}),(function(n){return n.color}),(function(n){return n.background}),(function(n){return n.cursor}),(function(n){return n.hasAction?Ur:null})),Vr=k.div(Bn||(Bn=on(["\n display: flex;\n align-items: center;\n\n & > * {\n display: inline;\n }\n\n & > svg {\n margin-right: 10px;\n }\n"],["\n display: flex;\n align-items: center;\n\n & > * {\n display: inline;\n }\n\n & > svg {\n margin-right: 10px;\n }\n"]))),Xr=k.div(Rn||(Rn=on(["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1 1 auto;\n"],["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1 1 auto;\n"]))),qr=k.div(Ln||(Ln=on(["\n margin: 8px 0 8px 0;\n display: block;\n height: 1px;\n border: 0;\n border-top: 1px solid ",";\n padding: 0;\n cursor: initial;\n"],["\n margin: 8px 0 8px 0;\n display: block;\n height: 1px;\n border: 0;\n border-top: 1px solid ",";\n padding: 0;\n cursor: initial;\n"])),(function(n){return n.theme.palette.grey[100]})),Kr=function(){return h.createElement(qr,null)},Jr=k.div(jn||(jn=on(["\n cursor: initial;\n text-align: left;\n padding: 4px 16px;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-transform: uppercase;\n color: ",";\n"],["\n cursor: initial;\n text-align: left;\n padding: 4px 16px;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-transform: uppercase;\n color: ",";\n"])),(function(n){return n.theme.palette.grey[700]})),Gr=function(n){var e=n.avatarSize,t=n.img,r=n.noText,o=n.onClick,i=n.placeholder,a=n.renderText,l=n.text,c=x((function(){if(l)return l.split(" ").map((function(n){return n[0]})).join("")}),[l]);return h.createElement(Qr,{clickable:!!o,onClick:o},h.createElement(pr,{image:t,placeholder:i,size:e||"s",initials:c}),h.createElement(Yr,null,a||(l||r)))},Qr=k.div(Mn||(Mn=on(["\n ",";\n\n display: flex;\n padding: 4px 16px;\n align-items: center;\n"],["\n ",";\n\n display: flex;\n padding: 4px 16px;\n align-items: center;\n"])),(function(n){return n.clickable&&E(Hn||(Hn=on(["\n &:hover {\n background-color: ",";\n cursor: pointer;\n }\n "],["\n &:hover {\n background-color: ",";\n cursor: pointer;\n }\n "])),(function(n){return n.theme.palette.grey[100]}))})),Yr=k.div(Un||(Un=on(["\n width: 50px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle;\n flex-grow: 1;\n padding-left: 10px;\n"],["\n width: 50px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle;\n flex-grow: 1;\n padding-left: 10px;\n"]))),Zr=function(n){var e=n.closeDropdown,t=n.content,r=n.fullWidth,o=n.maxWidth,i=x((function(){return t.map((function(n,t){var i=n.onClick,a=tn(n,["onClick"]);return h.createElement(Mr,en({fullWidth:r,maxWidth:o,key:t,onClick:function(n){n.stopPropagation(),null==i||i(n),e()}},a))}))}),[e,t,r,o]);return h.createElement(h.Fragment,null,i)},$r=function(e){var t=e.title;return h.createElement(Dr,{text:t,iconRight:{icon:n}})},no=function(n){var e=n.className,t=n.content,r=n.fullWidth,o=n.maxWidth,i=n.minWidthAsTrigger,a=void 0!==i&&i,l=n.placement,c=void 0===l?"bottom-start":l,s=n.renderContent,p=n.renderTrigger,d=n.triggerStyles,u=n.title,f=n.forceOpen,m=void 0!==f&&f,g=w(!1),b=g[0],k=g[1],E=y((function(n){k((function(n){return!n})),n.stopPropagation()}),[]),T=y((function(){return k(!1)}),[]);_((function(){k(m)}),[m]);var C=v(null);O(C,(function(){return T()}));var z=v(null),F=v(null),D=w(null),A=D[0],N=D[1],I=P(F.current,z.current,{placement:c,strategy:"fixed",modifiers:x((function(){return[{name:"arrow",options:{element:A}},{name:"offset",enabled:!0,options:{offset:[0,4]}},{name:"minWidthAsTrigger",enabled:a,phase:"beforeWrite",requires:["computeStyles"],fn:function(n){var e=n.state;e.styles.popper.minWidth=e.rects.reference.width+"px"},effect:function(n){var e=n.state,t=e.elements.reference.getBoundingClientRect().width;e.elements.popper.style.minWidth=t+"px"}}]}),[a,A])}),B=I.attributes,R=I.styles;return h.createElement(eo,{className:e,ref:C},h.createElement("div",{style:d,ref:F,onClick:E},u&&h.createElement($r,{title:u}),!u&&p&&p()),h.createElement(S,{in:m||b,timeout:200,unmountOnExit:!0,appear:!0},h.createElement(io,null,h.createElement(oo,en({ref:z,style:R.popper},B.popper),h.createElement("div",{ref:N,style:R.arrow}),h.createElement("div",{style:R.offset},t?h.createElement(to,{fullWidth:r,maxWidth:o},h.createElement(Zr,{content:t,fullWidth:r,maxWidth:o,closeDropdown:T})):h.createElement(ro,{maxWidth:o},null==s?void 0:s(T)))))))},eo=k.div(Wn||(Wn=on(["\n display: flex;\n"],["\n display: flex;\n"]))),to=k.div(qn||(qn=on(["\n ",";\n"],["\n ",";\n"])),(function(n){var e=n.fullWidth,t=n.maxWidth;return t?E(Vn||(Vn=on(["\n max-width: ",";\n "],["\n max-width: ",";\n "])),t):E(Xn||(Xn=on(["\n width: ",";\n "],["\n width: ",";\n "])),e?"auto":"200px")})),ro=k.div(Jn||(Jn=on(["\n ","\n"],["\n ","\n"])),(function(n){var e=n.maxWidth;return e&&E(Kn||(Kn=on(["\n max-width: ",";\n "],["\n max-width: ",";\n "])),e)})),oo=k.div(Gn||(Gn=on(["\n overflow-y: hidden;\n padding: 8px 0;\n color: ",";\n background-color: ",";\n border-radius: 3px;\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n z-index: 9;\n"],["\n overflow-y: hidden;\n padding: 8px 0;\n color: ",";\n background-color: ",";\n border-radius: 3px;\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n z-index: 9;\n"])),(function(n){return n.theme.palette.grey[900]}),(function(n){return n.theme.palette.white[100]})),io=k.div(Qn||(Qn=on(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"],["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"]))),ao=function(n){function e(){return null!==n&&n.apply(this,arguments)||this}return nn(e,n),e.prototype.render=function(){return h.createElement(no,en({},this.props))},e.Item=Mr,e.Title=function(n){return e=n,h.createElement(Jr,null,e.text);var e},e.Separator=Kr,e.UserListItem=Gr,e}(b),lo=(Jt.black[100],Jt.blue[50],Jt.grey[100],Jt.black[100],Jt.grey[100],Jt.red[500],Jt.red[50],Jt.green[500],Jt.green[50],Jt.yellow[500],Jt.yellow[50],Jt.blue[500],Jt.blue[50],k.span(re||(re=on(["\n background-color: #de350b;\n border-radius: 12px;\n position: absolute;\n ",";\n top: ",";\n right: ",";\n\n &:after {\n content: '","';\n color: white;\n white-space: nowrap;\n\n font-style: normal;\n font-weight: 500;\n ",";\n\n position: static;\n margin: 1px 2px;\n display: block;\n text-align: center;\n }\n"],["\n background-color: #de350b;\n border-radius: 12px;\n position: absolute;\n ",";\n top: ",";\n right: ",";\n\n &:after {\n content: '","';\n color: white;\n white-space: nowrap;\n\n font-style: normal;\n font-weight: 500;\n ",";\n\n position: static;\n margin: 1px 2px;\n display: block;\n text-align: center;\n }\n"])),(function(n){return function(n){switch(n){case"small":return E(Yn||(Yn=on(["\n height: 16px;\n min-width: 16px;\n top: 3px;\n right: 3px;\n "],["\n height: 16px;\n min-width: 16px;\n top: 3px;\n right: 3px;\n "])));case"large":return E(Zn||(Zn=on(["\n height: 23px;\n min-width: 23px;\n top: -1px;\n right: -1px;\n "],["\n height: 23px;\n min-width: 23px;\n top: -1px;\n right: -1px;\n "])));default:return E($n||($n=on(["\n height: 20px;\n min-width: 20px;\n top: 1px;\n right: 1px;\n "],["\n height: 20px;\n min-width: 20px;\n top: 1px;\n right: 1px;\n "])))}}(n.size)}),(function(n){var e=n.top;return void 0!==e?e+"px":void 0}),(function(n){var e=n.right;return void 0!==e?e+"px":void 0}),(function(n){return n.counter}),(function(n){return function(n){switch(n){case"small":return E(ne||(ne=on(["\n font-size: 12px;\n line-height: 15px;\n "],["\n font-size: 12px;\n line-height: 15px;\n "])));case"large":return E(ee||(ee=on(["\n font-size: 14px;\n line-height: 20px;\n "],["\n font-size: 14px;\n line-height: 20px;\n "])));default:return E(te||(te=on(["\n font-size: 12px;\n line-height: 18px;\n "],["\n font-size: 12px;\n line-height: 18px;\n "])))}}(n.size)}))),co=function(n){var e=n.children,t=tn(n,["children"]);return h.createElement(so,null,e,!t.isDisabled&&h.createElement(lo,en({},t)))},so=k.div(oe||(oe=on(["\n display: inline-block;\n position: relative;\n"],["\n display: inline-block;\n position: relative;\n"]))),po=k.div(ie||(ie=on(["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"],["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"]))),uo=function(n){var e=n.status,t=n.message,r=function(n,e){var t=T();return e||null===e?e:t.components.inputHelper[n].defaultIcon}(e,n.icon);return h.createElement(mo,{status:e},r&&h.createElement(fo,en({},r)),t)},fo=k(Gt)(ae||(ae=on(["\n margin-top: 2px;\n"],["\n margin-top: 2px;\n"]))),mo=k.div(le||(le=on(["\n color: ",";\n background: ",";\n border-radius: 4px;\n\n padding: 4px 8px;\n\n display: flex;\n align-items: flex-start;\n gap: 8px;\n\n font-size: 12px;\n line-height: 18px;\n\n "," {\n color: ",";\n }\n"],["\n color: ",";\n background: ",";\n border-radius: 4px;\n\n padding: 4px 8px;\n\n display: flex;\n align-items: flex-start;\n gap: 8px;\n\n font-size: 12px;\n line-height: 18px;\n\n "," {\n color: ",";\n }\n"])),(function(n){var e=n.theme,t=n.status;return e.components.inputHelper[t].color}),(function(n){var e=n.theme,t=n.status;return e.components.inputHelper[t].background}),fo,(function(n){var e=n.theme,t=n.status;return e.components.inputHelper[t].color})),go=(Jt.black[100],Jt.grey[100],Jt.red[900],Jt.red[50],Jt.yellow[900],Jt.yellow[50],Jt.blue[900],Jt.blue[50],Jt.green[900],Jt.green[50],{checked:a,indeterminate:l,unchecked:null}),ho=function(n){return"boolean"==typeof n?n?"checked":"unchecked":n},xo=k.span.attrs((function(n){var e=n.theme,t=n.value,r=n.isDisabled,o=n.large,i=n.hasError,a=e.components.checkbox.input,l=a.normal,c=a.error,s=o?"20px":"16px",p=(i?c:l)[t],d=p.borderColor,u=p.tickColor;return{backgroundColor:p.backgroundColor,tickColor:u,borderColor:d,cursor:r?"not-allowed":"pointer",height:s,width:s,opacity:r?.3:1}}))(ce||(ce=on(["\n border-radius: 4px;\n font-size: 10px;\n text-align: center;\n\n width: ",";\n height: ",";\n background-color: ",";\n color: ",";\n border: ",";\n cursor: ",";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n opacity: ",";\n"],["\n border-radius: 4px;\n font-size: 10px;\n text-align: center;\n\n width: ",";\n height: ",";\n background-color: ",";\n color: ",";\n border: ",";\n cursor: ",";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n opacity: ",";\n"])),(function(n){return n.width}),(function(n){return n.height}),(function(n){return n.backgroundColor}),(function(n){return n.tickColor}),(function(n){return"1px solid "+n.borderColor}),(function(n){return n.cursor}),(function(n){return n.opacity})),bo=k.span.attrs((function(n){var e=n.isDisabled,t=n.large,r=n.theme,o=n.hasError,i=r.components.checkbox.label,a=i.normal,l=i.error;return{fontSize:t?"16px":"14px",cursor:e?"not-allowed":"pointer",opacity:e?.1:1,color:o?l:a}}))(se||(se=on(["\n flex: 1;\n text-align: left;\n font-size: ",";\n cursor: ",";\n color: ",";\n opacity: ",";\n"],["\n flex: 1;\n text-align: left;\n font-size: ",";\n cursor: ",";\n color: ",";\n opacity: ",";\n"])),(function(n){return n.fontSize}),(function(n){return n.cursor}),(function(n){return n.color}),(function(n){return n.opacity})),yo=function(n){var e=n.isDisabled,t=n.className,r=n.onClick,o=n.large,i=n.text,a=n.value,l=n.helper,c=n.onChange,s=y((function(){var n;return null===(n=u.current)||void 0===n?void 0:n.click()}),[]),p=y((function(n){return!e&&r&&r(n)}),[e,r]),d=go[a],u=v(null);_((function(){if(u.current)switch(a){case"checked":u.current.checked=!0,u.current.indeterminate=!1;break;case"indeterminate":u.current.checked=!1,u.current.indeterminate=!0;break;case"unchecked":u.current.checked=!1,u.current.indeterminate=!1}}),[a]);var f="error"===(null==l?void 0:l.status);return h.createElement(po,null,h.createElement(vo,{className:t,onClick:s},h.createElement(xo,{value:a,large:o,isDisabled:e,hasError:f},d&&h.createElement(Gt,{icon:d})),h.createElement(wo,{ref:u,type:"checkbox",value:a,onClick:p,onChange:c,disabled:e}),h.createElement(bo,{large:o,isDisabled:e,hasError:f},i)),l&&h.createElement(uo,en({},l)))},vo=k.div(pe||(pe=on(["\n display: flex;\n gap: 8px;\n"],["\n display: flex;\n gap: 8px;\n"]))),wo=k.input(de||(de=on(["\n display: none;\n"],["\n display: none;\n"]))),_o=function(n){var e=n.value,t=tn(n,["value"]);return h.createElement(yo,en({},t,{value:ho(e)}))},ko={tickColor:Jt.white[100],backgroundColor:Jt.blue[500],borderColor:Jt.blue[500]},Eo={tickColor:Jt.white[100],backgroundColor:Jt.red[500],borderColor:Jt.red[500]},To=(Jt.white[100],Jt.grey[500],Jt.white[100],Jt.red[500],Jt.black[100],Jt.red[500],function(n){void 0===n&&(n="unchecked");var e=w((function(){return ho(n)})),t=e[0],r=e[1],o="checked"===t,i=y((function(){return r("checked")}),[]),a=y((function(){return r("unchecked")}),[]),l=y((function(){return r("indeterminate")}),[]),c=y((function(){return r((function(n){return"unchecked"===n?"checked":"unchecked"}))}),[]);return{status:t,value:o,setCheck:i,setUncheck:a,setIndeterminate:l,toggleCheckbox:c}}),Co=E(ue||(ue=on(["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"],["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"]))),zo=function(n){var e=n.label,t=n.isDisabled,r=n.required;return e?h.createElement(Do,{isDisabled:t,required:r},e):null},Fo=E(fe||(fe=on(["\n &:after {\n color: ",";\n content: '*';\n display: inline;\n }\n"],["\n &:after {\n color: ",";\n content: '*';\n display: inline;\n }\n"])),(function(n){return n.theme.palette.red[500]})),Do=k.label(me||(me=on(["\n font-size: 12px;\n line-height: 18px;\n\n color: ",";\n ","\n\n /* Bootstrap Fixes */\n ","\n"],["\n font-size: 12px;\n line-height: 18px;\n\n color: ",";\n ","\n\n /* Bootstrap Fixes */\n ","\n"])),(function(n){var e=n.theme.palette;return n.isDisabled?e.grey[300]:e.black[100]}),(function(n){return n.required&&Fo}),Co),Ao=E(xe||(xe=on(["\n background: ",";\n color: ",";\n border: 1px solid ",";\n\n border-radius: 4px;\n\n transition: box-shadow 0.3s ease-in-out;\n\n &:focus-within {\n ","\n }\n"],["\n background: ",";\n color: ",";\n border: 1px solid ",";\n\n border-radius: 4px;\n\n transition: box-shadow 0.3s ease-in-out;\n\n &:focus-within {\n ","\n }\n"])),(function(n){return n.background}),(function(n){return n.color}),(function(n){return n.borderColor}),(function(n){var e=n.status,t=n.normalFocused,r=n.borderColor;return"normal"===e?E(ge||(ge=on(["\n box-shadow: 0 0 0 3px ",";\n border-color: ",";\n "],["\n box-shadow: 0 0 0 3px ",";\n border-color: ",";\n "])),t.borderColor+"85",t.borderColor):E(he||(he=on(["\n box-shadow: 0 0 0 3px ",";\n "],["\n box-shadow: 0 0 0 3px ",";\n "])),r+"85")})),Po={icon:r,fixedWidth:!0},So={icon:t,fixedWidth:!0},Oo={icon:i,fixedWidth:!0},No={normal:void 0,warning:Po,error:So,success:Oo},Io=function(n){var e=n.status,t=No[e];return t?h.createElement(Bo,en({},t,{status:e})):null},Bo=k(Gt)(be||(be=on(["\n color: ",";\n"],["\n color: ",";\n"])),(function(n){var e=n.theme,t=n.status;return e.components.inputText[t].iconColor})),Ro=E(ye||(ye=on(["\n font-weight: 400 !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n font-size: 14px !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n height: ","px !important;\n padding: 1px 2px !important;\n margin: 0 !important;\n color: black !important;\n"],["\n font-weight: 400 !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n font-size: 14px !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n height: ","px !important;\n padding: 1px 2px !important;\n margin: 0 !important;\n color: black !important;\n"])),(function(n){return"large"===n.inputSize?40:30})),Lo=k.input(we||(we=on(["\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n\n height: ","px;\n\n border: 0;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ",";\n }\n\n ","\n\n outline: none;\n\n /* Bootstrap Fixes */\n ","\n"],["\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n\n height: ","px;\n\n border: 0;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ",";\n }\n\n ","\n\n outline: none;\n\n /* Bootstrap Fixes */\n ","\n"])),(function(n){return"large"===n.inputSize?40:30}),(function(n){return n.theme.palette.grey[200]}),(function(n){return"password"===n.type&&E(ve||(ve=on(["\n letter-spacing: 1px;\n "],["\n letter-spacing: 1px;\n "])))}),Ro),jo=function(n){var e=n.autoFocus,t=n.onBlur,r=n.onChange,o=n.value,i=void 0===o?"":o,a=n.placeholder,l=void 0===a?"":a,c=n.isDisabled,s=n.name,p=n.inputSize,d=n.leadingIcon,u=n.onKeyPress,f=n.status,m=void 0===f?"normal":f,g=n.onKeyDown,x=n.onKeyUp,b=n.inputType,w=n.onFocus,_=n.className,k=n.actionIcon,E=n.setValue,T=v(null),C=y((function(){var n;return null===(n=T.current)||void 0===n?void 0:n.focus()}),[]),z=(null==i?void 0:i.toString())||"",F=y((function(n){null==E||E(n.currentTarget.value),null==r||r(n)}),[r,E]),D=y((function(n){null==E||E(n.target.value.trim()),null==t||t(n)}),[t,E]);return h.createElement(Ho,{onClick:C,isDisabled:c,status:m,className:_},d&&h.createElement(Mo,en({},d,{isDisabled:c})),h.createElement(Lo,{ref:T,type:b,autoFocus:e,value:z,placeholder:""+l,disabled:c,name:s,inputSize:p,onChange:F,onFocus:w,onBlur:D,onKeyPress:u,onKeyDown:g,onKeyUp:x}),h.createElement(Io,{status:m}),k&&h.createElement(Mo,en({},k,{isDisabled:c})))},Ho=k.div.attrs((function(n){var e=n.theme,t=n.isDisabled,r=n.status,o=t?"disabled":void 0===r?"normal":r,i=e.components.inputText[o];return en(en({},i),{normalFocused:e.components.inputText.normalFocused})}))(_e||(_e=on(["\n ",";\n\n display: flex;\n justify-content: space-evenly;\n align-items: center;\n gap: 8px;\n padding: 0 8px;\n"],["\n ",";\n\n display: flex;\n justify-content: space-evenly;\n align-items: center;\n gap: 8px;\n padding: 0 8px;\n"])),Ao),Mo=k(Gt)(ke||(ke=on(["\n color: ",";\n font-size: 14px;\n"],["\n color: ",";\n font-size: 14px;\n"])),(function(n){return n.theme.palette.black[100]})),Uo=function(n){var e=n.label,t=n.className,r=tn(n,["label","className"]),o=n.isDisabled,i=n.required,a=n.helper;return h.createElement(po,{className:t},h.createElement(zo,{label:e,isDisabled:o,required:i}),h.createElement(jo,en({},r)),a&&h.createElement(uo,en({},a)))},Wo=(Jt.white[100],Jt.black[100],Jt.black[100],Jt.grey[500],Jt.white[100],Jt.black[100],Jt.blue[300],Jt.black[100],Jt.green[50],Jt.black[100],Jt.green[900],Jt.green[300],Jt.yellow[50],Jt.black[100],Jt.yellow[900],Jt.yellow[300],Jt.red[50],Jt.black[100],Jt.red[900],Jt.red[300],Jt.grey[100],Jt.black[16],Jt.black[16],function(n){return void 0===n&&(n=null),w(n)}),Vo=function(n){return w(n)},Xo=function(n){var e=n.isDisabled,t=n.clearValue,r=y((function(){return!e&&t()}),[t,e]);return h.createElement(qo,{icon:M,onClick:r})},qo=k(Gt)(Ee||(Ee=on(["\n margin: 0.5em;\n"],["\n margin: 0.5em;\n"]))),Ko=function(n){var e=n.innerProps.onMouseDown,t=n.children;return h.createElement(Jo,{onMouseDown:e},t)},Jo=k.div(Te||(Te=on(["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"],["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"]))),Go=function(n){var e=n.selectProps;return h.createElement(Qo,{isRotated:e.menuIsOpen},h.createElement(Gt,{icon:c}))},Qo=k.div(Ce||(Ce=on(["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(","deg);\n"],["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(","deg);\n"])),(function(n){return n.isRotated?180:0})),Yo=function(n){var e=n.actions,t=n.triggerClose,r=x((function(){return e.map((function(n,e){var r=n.onClick,o=n.closeOnClick,i=tn(n,["onClick","closeOnClick"]);return h.createElement($o,en({key:e,onClick:function(n){n.stopPropagation(),null==r||r(n),o&&t()}},i))}))}),[e]);return h.createElement(Zo,null,r)},Zo=k.div(ze||(ze=on(["\n border-top: 1px solid ",";\n"],["\n border-top: 1px solid ",";\n"])),(function(n){return n.theme.palette.grey[100]})),$o=k(Mr)(Fe||(Fe=on(["\n padding: 5px 10px;\n"],["\n padding: 5px 10px;\n"]))),ni=function(n){var e=n.setValue,t=n.getValue,r=n.selectProps,o=n.children,i=tn(n,["children"]),a=null==r?void 0:r.footerActions,l=y((function(){return e(t(),"select-option")}),[t,e]);return h.createElement(ei,null,h.createElement(R.MenuList,en({},i),o,a&&h.createElement(Yo,{actions:a,triggerClose:l})))},ei=k.div(De||(De=on([""],[""]))),ti=function(n){var e=n.innerProps.onClick,t=n.data,r=t.label,o=t.icon;return h.createElement(ri,{onClick:e},o&&h.createElement(Gt,en({},o)),h.createElement("div",null,r))},ri=k.div(Ae||(Ae=on(["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ",";\n }\n"],["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ",";\n }\n"])),(function(n){return n.theme.palette.grey[100]})),oi=function(n){var e=n.children;return h.createElement(ii,null,e)},ii=k.div(Pe||(Pe=on(["\n font-size: 14px;\n color: ",";\n"],["\n font-size: 14px;\n color: ",";\n"])),(function(n){return n.theme.palette.grey[200]})),ai=function(){return{Option:ti,DropdownIndicator:Go,ClearIndicator:Xo,Placeholder:oi,Control:Ko,MenuList:ni}},li=function(n){var e=n.theme,t=n.isDisabled,r=n.status,o=t?"disabled":void 0===r?"normal":r,i=e.components.select[o];return en(en({},i),{normalFocused:e.components.select.normalFocused})},ci=function(n){var e=n.status,t=n.isDisabled,r=T(),o=li({theme:r,status:e,isDisabled:t}).color;return{singleValue:function(n){return en(en({},n),{color:o,fontSize:"14px"})},noOptionsMessage:function(n){return en(en({},n),{fontSize:"14px"})},valueContainer:function(n){return en(en({},n),{padding:"0 8px"})}}},si=E(Se||(Se=on(["\n input {\n margin-bottom: 0 !important;\n box-shadow: none !important;\n }\n"],["\n input {\n margin-bottom: 0 !important;\n box-shadow: none !important;\n }\n"]))),pi=k.span.attrs(li)(Oe||(Oe=on(["\n & > div:first-child {\n ",";\n & > div:nth-child(2) {\n height: ","px;\n min-height: ","px;\n }\n }\n\n ","\n"],["\n & > div:first-child {\n ",";\n & > div:nth-child(2) {\n height: ","px;\n min-height: ","px;\n }\n }\n\n ","\n"])),Ao,(function(n){return"large"===n.inputSize?40:30}),(function(n){return"large"===n.inputSize?40:30}),si),di=function(n){var e=n.children,t=tn(n,["children"]),r=t.label,o=t.isDisabled,i=t.required,a=t.helper,l=t.status,c=void 0===l?"normal":l,s=t.inputSize;return h.createElement(po,null,h.createElement(zo,{label:r,isDisabled:o,required:i}),h.createElement(pi,{isDisabled:o,status:c,inputSize:s},e),a&&h.createElement(uo,en({},a)))},ui=function(n){var e=n.status,t=void 0===e?"normal":e,r=n.components,o=ci({status:t}),i=x((function(){return en(en({},ai()),r)}),[r]);return h.createElement(di,en({},n),h.createElement(B,en({},n,{components:i,backspaceRemoves:!0,styles:o})))},fi=function(n){var e=n.status,t=void 0===e?"normal":e,r=n.components,o=ci({status:t}),i=x((function(){return en(en({},ai()),r)}),[r]);return h.createElement(di,en({},n),h.createElement(H,en({},n,{components:i,backspaceRemoves:!0,styles:o})))},mi=function(n){var e=n.status,t=void 0===e?"normal":e,r=n.components,o=ci({status:t}),i=x((function(){return en(en({},ai()),r)}),[r]);return h.createElement(di,en({},n),h.createElement(L,en({},n,{components:i,backspaceRemoves:!0,styles:o})))},gi=function(n){var e=n.status,t=void 0===e?"normal":e,r=n.components,o=ci({status:t}),i=x((function(){return en(en({},ai()),r)}),[r]);return h.createElement(di,en({},n),h.createElement(j,en({},n,{components:i,backspaceRemoves:!0,styles:o})))},hi=(Jt.white[100],Jt.black[100],Jt.black[100],Jt.grey[500],Jt.white[100],Jt.black[100],Jt.black[100],Jt.blue[300],Jt.green[50],Jt.black[100],Jt.green[900],Jt.green[300],Jt.yellow[50],Jt.black[100],Jt.yellow[900],Jt.yellow[300],Jt.red[50],Jt.black[100],Jt.red[900],Jt.red[300],Jt.grey[100],Jt.black[16],Jt.black[16],function(n){var e=n.length,t=n.maxLength;return h.createElement(xi,null,e,t&&"/"+t)}),xi=k.div(Ne||(Ne=on(["\n text-align: right;\n color: ",";\n padding: 0.3em;\n"],["\n text-align: right;\n color: ",";\n padding: 0.3em;\n"])),(function(n){return n.theme.palette.grey[500]})),bi=E(Ie||(Ie=on(["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px 0 0 8px !important;\n height: 100% !important;\n"],["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px 0 0 8px !important;\n height: 100% !important;\n"]))),yi=k.textarea(Be||(Be=on(["\n resize: none;\n\n margin: 0;\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n border: 0;\n padding: 8px 0 0 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ",";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ","\n"],["\n resize: none;\n\n margin: 0;\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n border: 0;\n padding: 8px 0 0 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ",";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ","\n"])),(function(n){return n.theme.palette.grey[200]}),bi),vi=function(n){var e=n.autoFocus,t=n.onBlur,r=n.onChange,o=n.value,i=void 0===o?"":o,a=n.placeholder,l=n.isDisabled,c=n.name,s=n.onKeyPress,p=n.status,d=void 0===p?"normal":p,u=n.onKeyDown,f=n.onKeyUp,m=n.onFocus,g=n.className,x=n.setValue,b=n.initialHeight,w=void 0===b?"10rem":b,k=n.maxLength,E=n.isResizable,T=void 0!==E&&E,C=n.showCounter,z=void 0!==C&&C,F=v(null),D=y((function(){var n;return null===(n=F.current)||void 0===n?void 0:n.focus()}),[]),A=(null==i?void 0:i.toString())||"",P=y((function(n){null==x||x(n.currentTarget.value.slice(0,k||1/0)),null==r||r(n)}),[k,r,x]);_((function(){null==x||x((i||"").slice(0,k||1/0))}),[k,x,i]);var S=y((function(n){null==x||x(n.target.value.trim()),null==t||t(n)}),[t,x]);return h.createElement(_i,{onClick:D,isDisabled:l,status:d,className:g,initialHeight:w,isResizable:T},h.createElement(wi,null,h.createElement(yi,{ref:F,autoFocus:e,value:A,placeholder:a,disabled:l,name:c,onChange:P,onFocus:m,onBlur:S,onKeyPress:s,onKeyDown:u,onKeyUp:f}),(z||k)&&h.createElement(hi,{length:A.length,maxLength:k})))},wi=k.div(Re||(Re=on(["\n display: flex;\n flex-flow: column;\n height: 100%;\n"],["\n display: flex;\n flex-flow: column;\n height: 100%;\n"]))),_i=k.div.attrs((function(n){var e=n.theme,t=n.isDisabled,r=n.status,o=t?"disabled":void 0===r?"normal":r,i=e.components.textArea[o];return en(en({},i),{normalFocused:e.components.textArea.normalFocused})}))(Le||(Le=on(["\n ",";\n\n resize: ",";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ",";\n"],["\n ",";\n\n resize: ",";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ",";\n"])),Ao,(function(n){return n.isResizable?"vertical":"none"}),(function(n){return n.initialHeight})),ki=function(n){var e=n.label,t=n.className,r=tn(n,["label","className"]),o=n.isDisabled,i=n.required,a=n.helper;return h.createElement(po,{className:t},h.createElement(zo,{label:e,isDisabled:o,required:i}),h.createElement(vi,en({},r)),a&&h.createElement(uo,en({},a)))},Ei=(Jt.white[100],Jt.black[100],Jt.grey[500],Jt.white[100],Jt.black[100],Jt.blue[300],Jt.green[50],Jt.black[100],Jt.green[300],Jt.yellow[50],Jt.black[100],Jt.yellow[300],Jt.red[50],Jt.black[100],Jt.red[300],Jt.grey[100],Jt.black[16],function(n){var e=n.action,t=n.active,r=n.icon,o=n.index,i=n.mouseBlockedProps,a=n.navigable,l=n.onClick,c=n.onMouseHover,s=n.onMouseOut,p=n.placeholder,d=n.showActionOnHover,u=n.title,f=n.wrapperRef,m=i.mouseBlocked,g=i.setMouseBlocked,x=v(null),b=y((function(n){var e;if(a&&(g(!0),"Enter"===n.key&&(n.preventDefault(),null===(e=x.current)||void 0===e||e.click()),["ArrowUp","ArrowDown"].includes(n.key))){n.preventDefault();var t=document.querySelectorAll("[data-grouped-list-item]"),r="ArrowUp"===n.key?"[data-grouped-list-item='"+(o-1)+"']":"[data-grouped-list-item='"+(o+1)+"']",i=document.querySelector(r),l=void 0;if(l=i||("ArrowUp"===n.key?t[t.length-1]:document.querySelector("[data-grouped-list-item='1']")),f.current){var c=f.current;"ArrowUp"===n.key?l.offsetTop<=c.scrollTop&&(c.scrollTop=l.offsetTop):l.offsetTop-(c.offsetHeight-l.offsetHeight)>=c.scrollTop&&(c.scrollTop=l.offsetTop-(c.offsetHeight-l.offsetHeight)),l.focus()}}}),[a,g,o,f]),w=y((function(){var n,e=x.current,t=f.current;e&&t&&e.offsetTop<t.offsetHeight+t.scrollTop&&e.offsetTop+e.offsetHeight>t.scrollTop&&(null===(n=x.current)||void 0===n||n.focus())}),[f]),k=y((function(){a&&m||(null==c||c(),w())}),[w,m,a,c]),E=y((function(){var n;a&&m||(null==s||s(),null===(n=x.current)||void 0===n||n.blur())}),[m,a,s]);return _((function(){return function(){return removeEventListener("keydown",b)}}),[b]),h.createElement(Di,{ref:x,tabIndex:l?0:-1,onClick:l,active:t,key:u,onMouseLeave:E,onMouseOver:k,onFocus:function(){addEventListener("keydown",b)},onBlur:function(){removeEventListener("keydown",b)},showActionOnHover:d,"data-grouped-list-item":o},r&&h.createElement(zi,en({},r,{fixedWidth:!0})),u?h.createElement(Ti,null,u):h.createElement(Ci,null,p),e&&h.createElement(Fi,null,e))}),Ti=k.div(je||(je=on(["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"],["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"]))),Ci=k(Ti)(He||(He=on(["\n color: ",";\n"],["\n color: ",";\n"])),(function(n){return n.theme.palette.grey[500]})),zi=k(Gt)(Me||(Me=on(["\n margin-right: 8px;\n display: inline-flex;\n align-self: center;\n"],["\n margin-right: 8px;\n display: inline-flex;\n align-self: center;\n"]))),Fi=k.div(Ue||(Ue=on([""],[""]))),Di=k.div(Xe||(Xe=on(["\n &:focus {\n outline: none !important;\n background-color: ",";\n color: ",";\n cursor: ",";\n }\n\n color: ",";\n font-weight: ",";\n\n line-height: 32px;\n height: 32px;\n left: 0;\n display: flex;\n\n ",";\n"],["\n &:focus {\n outline: none !important;\n background-color: ",";\n color: ",";\n cursor: ",";\n }\n\n color: ",";\n font-weight: ",";\n\n line-height: 32px;\n height: 32px;\n left: 0;\n display: flex;\n\n ",";\n"])),(function(n){return n.theme.palette.blue[50]}),(function(n){return n.theme.palette.blue[500]}),(function(n){return n.onClick?"pointer":"initial"}),(function(n){var e=n.active,t=n.theme;return e?t.palette.blue[500]:"initial"}),(function(n){return n.active?500:"initial"}),(function(n){return n.showActionOnHover?E(We||(We=on(["\n "," {\n display: none;\n }\n\n &:focus {\n "," {\n display: inherit;\n }\n }\n "],["\n "," {\n display: none;\n }\n\n &:focus {\n "," {\n display: inherit;\n }\n }\n "])),Fi,Fi):E(Ve||(Ve=on([""],[""])))})),Ai=function(n){var e=n.noResults,t=n.title;return h.createElement(Pi,{noResults:e,key:t},t.toUpperCase(),e&&h.createElement(Si,null,"(nessun risultato)"))},Pi=k.div(Ke||(Ke=on(["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ",";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ",";\n font-weight: 500;\n cursor: initial;\n"],["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ",";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ",";\n font-weight: 500;\n cursor: initial;\n"])),(function(n){var e=n.noResults,t=n.theme;return!0===e?E(qe||(qe=on(["\n background-color: ",";\n "],["\n background-color: ",";\n "])),t.palette.grey[50]):void 0}),(function(n){return n.theme.palette.grey[700]})),Si=k.span(Je||(Je=on(["\n margin-left: 3px;\n color: ",";\n font-weight: 400;\n font-size: 13px;\n"],["\n margin-left: 3px;\n color: ",";\n font-weight: 400;\n font-size: 13px;\n"])),(function(n){return n.theme.palette.grey[700]})),Oi=function(n){var e=n.index,t=n.items,r=n.title,o=tn(n,["index","items","title"]);return h.createElement(h.Fragment,null,h.createElement(Ai,{title:r,noResults:!t.length}),t.map((function(n,t){return h.createElement(Ei,en({key:t,index:e+t},n,o))})))},Ni=function(n){var e=n.className,t=n.groups,r=n.navigable,o=n.placeholder,i=n.wrapperStyle,a=w(!1),l=a[0],c=a[1],s=x((function(){return t.reduce((function(n,e){return n+e.items.length}),0)}),[t]),p=y((function(n){var e,t,o,i,a=null===(t=null===(e=document.activeElement)||void 0===e?void 0:e.dataset)||void 0===t?void 0:t.groupedListItem;r&&!a&&["ArrowUp","ArrowDown"].includes(n.key)&&(n.preventDefault(),"ArrowUp"===n.key?null===(o=document.querySelector("div[data-grouped-list-item='"+s+"']"))||void 0===o||o.focus():null===(i=document.querySelector("div[data-grouped-list-item='1']"))||void 0===i||i.focus(),c(!0))}),[s,r]),d=function(n){var e=n.target,t=null==e?void 0:e.closest("[data-grouped-list-item]");null==t||t.focus(),c(!1)};_((function(){return l?(removeEventListener("keydown",p),addEventListener("mousemove",d)):(addEventListener("keydown",p),removeEventListener("mousemove",d)),function(){removeEventListener("keydown",p),removeEventListener("mousemove",d)}}),[p,l]);var u=x((function(){return{mouseBlocked:l,setMouseBlocked:c}}),[l,c]),f=v(null),m=1;return h.createElement(Ii,{style:i,ref:f,className:e},t.map((function(n,e){var t=m;return m+=n.items.length,h.createElement(Oi,en({key:e},n,{mouseBlockedProps:u,navigable:r,index:t,wrapperRef:f,placeholder:o}))})))},Ii=k.div(Ge||(Ge=on(["\n cursor: pointer;\n"],["\n cursor: pointer;\n"]))),Bi=k.span(Ye||(Ye=on(["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ","\n"],["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ","\n"])),(function(n){var e=n.isDisabled,t=n.theme.palette;return e&&E(Qe||(Qe=on(["\n color: ",";\n cursor: not-allowed;\n "],["\n color: ",";\n cursor: not-allowed;\n "])),t.grey[500])})),Ri=k.span(tt||(tt=on(["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ","\n ","\n ","\n"],["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ","\n ","\n ","\n"])),(function(n){var e=n.theme;return E(Ze||(Ze=on(["\n background-color: ",";\n border: 1px solid ",";\n "],["\n background-color: ",";\n border: 1px solid ",";\n "])),e.palette.white[100],e.palette.grey[500])}),(function(n){var e=n.isChecked,t=n.theme;return e&&E($e||($e=on(["\n border: 5px solid ",";\n "],["\n border: 5px solid ",";\n "])),t.palette.blue[500])}),(function(n){var e=n.isChecked,t=n.isDisabled,r=n.theme;return t&&E(et||(et=on(["\n background-color: ",";\n border-color: ",";\n cursor: not-allowed;\n ","\n "],["\n background-color: ",";\n border-color: ",";\n cursor: not-allowed;\n ","\n "])),r.palette.grey[100],r.palette.grey[100],e&&E(nt||(nt=on(["\n background-color: ",";\n border-color: ",";\n "],["\n background-color: ",";\n border-color: ",";\n "])),r.palette.white[100],r.palette.grey[50]))})),Li=k((function(n){var e=n.isChecked,t=n.isDisabled,r=n.label;return h.createElement("div",{className:n.className,onClick:function(){return n.isDisabled?void 0:n.onClick()}},n.renderOption?n.renderOption({isDisabled:t,isChecked:e,label:r}):h.createElement(h.Fragment,null,h.createElement(Ri,{isChecked:n.isChecked,isDisabled:n.isDisabled}),h.createElement(Bi,{isDisabled:n.isDisabled},n.label)))}))(ot||(ot=on(["\n & + & {\n margin-top: ","px;\n }\n ","\n"],["\n & + & {\n margin-top: ","px;\n }\n ","\n"])),(function(n){return n.optionsSpacing?n.optionsSpacing:0}),(function(n){return n.inline&&E(rt||(rt=on(["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "],["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "])))})),ji=function(n){return h.createElement(Li,en({},n))},Hi=function(n){return h.createElement("div",{style:n.style},n.options.map((function(e){return h.createElement(ji,{key:e.key,label:e.label,onClick:function(){n.onClick&&n.onClick(e)},isChecked:n.value===e.key,isDisabled:n.isDisabled,renderOption:n.renderOption,optionsSpacing:n.optionsSpacing,inline:n.inline})})))},Mi=k.div(dt||(dt=on(["\n margin-top: 0;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n margin-bottom: ",";\n"],["\n margin-top: 0;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n margin-bottom: ",";\n"])),Zt),Ui=k.div(ut||(ut=on(["\n font-weight: normal;\n font-size: 12px;\n line-height: 18px;\n"],["\n font-weight: normal;\n font-size: 12px;\n line-height: 18px;\n"]))),Wi=k.div(xt||(xt=on(["\n ","\n"],["\n ","\n"])),(function(n){var e=n.size,t=n.theme,r=n.type;return E(ht||(ht=on(["\n display: flex;\n border: 1px solid rgba(51, 51, 51, 0.08);\n border-radius: 4px;\n color: ",";\n\n ","\n\n ","\n "],["\n display: flex;\n border: 1px solid rgba(51, 51, 51, 0.08);\n border-radius: 4px;\n color: ",";\n\n ","\n\n ","\n "])),t.palette.black[100],function(n,e){switch(n){case"standard":return E(it||(it=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.palette.grey[100],e.palette.black[100]);case"info":return E(at||(at=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.palette.blue[50],e.palette.blue[500]);case"error":return E(lt||(lt=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.palette.red[50],e.palette.red[500]);case"warning":return E(ct||(ct=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.palette.yellow[50],e.palette.yellow[500]);case"success":return E(st||(st=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.palette.green[50],e.palette.green[500]);default:return E(pt||(pt=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),e.palette.grey[100],e.palette.black[100])}}(r,t),function(n){switch(n){case"medium":return E(ft||(ft=on(["\n padding: ",";\n "],["\n padding: ",";\n "])),nr);case"large":return E(mt||(mt=on(["\n padding: ",";\n "," {\n font-size: 16px;\n line-height: 18px;\n margin-bottom: ",";\n }\n "," {\n font-size: 14px;\n line-height: 21px;\n }\n "],["\n padding: ",";\n "," {\n font-size: 16px;\n line-height: 18px;\n margin-bottom: ",";\n }\n "," {\n font-size: 14px;\n line-height: 21px;\n }\n "])),er,Mi,$t,Ui);default:return E(gt||(gt=on(["\n padding: ",";\n "],["\n padding: ",";\n "])),er)}}(e))})),Vi=k.div(bt||(bt=on(["\n margin-left: ",";\n width: 100%;\n"],["\n margin-left: ",";\n width: 100%;\n"])),(function(n){return n.margin?nr:"0px"})),Xi=k.div(yt||(yt=on(["\n line-height: 20px;\n"],["\n line-height: 20px;\n"]))),qi=k(Gt)(vt||(vt=on(["\n cursor: pointer;\n color: ",";\n"],["\n cursor: pointer;\n color: ",";\n"])),(function(n){return n.theme.palette.blue[700]})),Ki={icon:e},Ji=function(n){var e,t,r,o,i,a,l,c,s=n.closeIcon,p=n.content,d=n.icon,u=n.onClose,f=n.renderCloseIcon,m=n.renderContent,g=n.renderIcon,x=n.renderTitle,b=n.title,y=x?x():b;return h.createElement(h.Fragment,null,h.createElement("div",{style:null!==(t=null===(e=null==n?void 0:n.componentStyle)||void 0===e?void 0:e.icon)&&void 0!==t?t:{}},g?g():d?h.createElement(Gt,en({},d)):null),h.createElement(Vi,{style:null!==(o=null===(r=null==n?void 0:n.componentStyle)||void 0===r?void 0:r.contentWrapper)&&void 0!==o?o:{},margin:void 0!==g||void 0!==d},y?h.createElement(Mi,{style:null!==(a=null===(i=null==n?void 0:n.componentStyle)||void 0===i?void 0:i.title)&&void 0!==a?a:{}},y):null,h.createElement(Ui,{style:null!==(c=null===(l=null==n?void 0:n.componentStyle)||void 0===l?void 0:l.content)&&void 0!==c?c:{}},m?m():p)),u&&h.createElement(Xi,{onClick:u},f?f():h.createElement(qi,en({},s||Ki,{fixedWidth:!0}))))},Gi=function(n){var e,t;return h.createElement(Wi,en({},n,{style:null!==(t=null===(e=null==n?void 0:n.componentStyle)||void 0===e?void 0:e.root)&&void 0!==t?t:{}}),h.createElement(Ji,en({},n)))},Qi=function(){return h.createElement(Yi,{tabIndex:0},h.createElement(Gt,{icon:s,fixedWidth:!0}))},Yi=k.div(wt||(wt=on(["\n display: flex;\n"],["\n display: flex;\n"]))),Zi={margin:"auto",width:"100%",height:"100%",display:"flex",justifyContent:"center",alignItems:"center"},$i=k.div(_t||(_t=on(["\n transition: transform 250ms ease;\n transform: ",";\n\n visibility: ",";\n"],["\n transition: transform 250ms ease;\n transform: ",";\n\n visibility: ",";\n"])),(function(n){return n.isOpen?"rotate(90deg)":"rotate(0deg)"}),(function(n){return n.isVisible?"visible":"hidden"})),na=44,ea=function(n){var e,t=n.caretVisible,r=void 0!==t&&t,o=n.className,i=n.dropdownContent,a=n.icon,l=n.isActive,c=void 0!==l&&l,s=n.isDisabled,d=void 0!==s&&s,u=n.isHidden,f=void 0!==u&&u,m=n.isOpen,g=void 0!==m&&m,x=n.onClick,b=n.title,y=n.forceOpenDropdown,v=n.customProps;if(f)return null;var w=(null===(e=null==v?void 0:v.renderContent)||void 0===e?void 0:e.call(v,n))||b;return h.createElement(ra,{customColor:null==v?void 0:v.color,isActive:c,isDisabled:d,className:o,onClick:x},h.createElement($i,{isOpen:g,isVisible:r},h.createElement(Gt,{icon:p})),a?h.createElement(Gt,en({},a,{fixedWidth:!0})):h.createElement(ia,{icon:A,fixedWidth:!0}),h.createElement(oa,null,w),!d&&i&&h.createElement(ta,{content:i,forceOpen:y}))},ta=k((function(n){var e=n.className,t=n.content,r=n.forceOpen,o=void 0!==r&&r;return h.createElement(ao,{triggerStyles:Zi,className:e,placement:"right-start",renderTrigger:Qi,content:t,forceOpen:o})}))(kt||(kt=on(["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"],["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"]))),ra=k.div.attrs((function(n){var e=n.isActive,t=n.isDisabled,r=n.theme.components.sidebarItem,o=r.normal,i=r.active,a=r.disabled;return t?a:e?i:o}))(Et||(Et=on(["\n height: ","px;\n padding: 0 8px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ",";\n background-color: ",";\n\n "," {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n color: ",";\n background-color: ",";\n\n "," {\n display: inherit;\n\n &:hover {\n background: ",";\n }\n\n &:focus-within {\n background: ",";\n }\n }\n }\n"],["\n height: ","px;\n padding: 0 8px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ",";\n background-color: ",";\n\n "," {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n color: ",";\n background-color: ",";\n\n "," {\n display: inherit;\n\n &:hover {\n background: ",";\n }\n\n &:focus-within {\n background: ",";\n }\n }\n }\n"])),44,(function(n){var e=n.color;return n.customColor||e}),(function(n){return n.background}),ta,(function(n){return n.hoverColor}),(function(n){return n.hoverBackground}),ta,(function(n){return n.dropdownHover}),(function(n){return n.dropdownActive})),oa=k.div(Tt||(Tt=on(["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"],["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"]))),ia=k(Gt)(Ct||(Ct=on(["\n visibility: hidden;\n"],["\n visibility: hidden;\n"]))),aa=(Jt.black[100],Jt.black[100],Jt.grey[100],Jt.grey[400],Jt.grey[600],Jt.white[100],Jt.blue[500],Jt.white[100],Jt.blue[500],Jt.blue[700],Jt.grey[300],Jt.grey[100],Jt.grey[300],Jt.grey[100],k.div.attrs((function(n){var e=n.theme,t=n.type;return e.components.microTag[t]}))(zt||(zt=on(["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ",";\n background-color: ",";\n"],["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ",";\n background-color: ",";\n"])),(function(n){return n.color}),(function(n){return n.backgroundColor}))),la=function(n){var e=n.text,t=n.type;return h.createElement(aa,{type:t},e)},ca=(Jt.red[50],Jt.red[500],Jt.blue[50],Jt.blue[500],Jt.grey[50],Jt.grey[500],Jt.green[50],Jt.green[500],Jt.yellow[50],Jt.yellow[500],h.createElement(Gt,{icon:a,fixedWidth:!0})),sa=function(n){var e=n.text,t=void 0===e?"":e,r=n.number,o=n.status,i="completed"===o?ca:r+1;return h.createElement(ua,{status:o},h.createElement(pa,null,i),h.createElement(da,null,t))},pa=k.div(Ft||(Ft=on(["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"],["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"]))),da=k.div(Dt||(Dt=on([""],[""]))),ua=k.div.attrs((function(n){var e=n.theme,t=n.status;return e.components.stepper.item[t]}))(At||(At=on(["\n "," {\n color: ",";\n background: ",";\n }\n\n "," {\n color: ",";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"],["\n "," {\n color: ",";\n background: ",";\n }\n\n "," {\n color: ",";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"])),pa,(function(n){return n.circleTextColor}),(function(n){return n.circleBackground}),da,(function(n){return n.color})),fa=k.div(Pt||(Pt=on(["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"],["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"]))),ma=function(n,e){return n<e?"completed":n===e?"active":"normal"},ga=function(n){var e=n.steps,t=n.currentStep,r=x((function(){return e.reduce((function(n,e,r){return 0===r?[h.createElement(sa,{key:r,number:r,status:ma(r,t),text:e})]:rn(n,[h.createElement(fa,{key:"divider_"+r}),h.createElement(sa,{key:r,number:r,status:ma(r,t),text:e})])}),[])}),[e,t]);return h.createElement(ha,null,r)},ha=k.div(St||(St=on(["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"],["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"]))),xa=(Jt.grey[500],Jt.grey[500],Jt.white[100],Jt.blue[500],Jt.blue[500],Jt.white[100],Jt.grey[500],Jt.green[500],Jt.white[100],k(Gt)(Ot||(Ot=on([""],[""])))),ba=k(Gt)(Nt||(Nt=on([""],[""]))),ya=k.div(It||(It=on([""],[""]))),va=k.div.attrs((function(n){var e=n.tagStyle,t=n.theme,r=n.type;return t.components.tag[e][r]}))(Bt||(Bt=on(["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ",";\n background-color: ",";\n\n "," + "," {\n padding-left: 4px;\n }\n\n "," + "," {\n padding-right: 12px;\n }\n"],["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ",";\n background-color: ",";\n\n "," + "," {\n padding-left: 4px;\n }\n\n "," + "," {\n padding-right: 12px;\n }\n"])),(function(n){return n.color}),(function(n){return n.backgroundColor}),xa,ya,ya,ba),wa=function(n){var e=n.leftIcon,t=n.rightIcon,r=n.tagStyle,o=n.text,i=n.type,a=n.className;return h.createElement(va,{className:a,type:i,tagStyle:r},e&&h.createElement(xa,en({},e)),h.createElement(ya,null,o),t&&h.createElement(ba,en({},t)))},_a=(Jt.white[100],Jt.grey[600],Jt.white[100],Jt.yellow[500],Jt.white[100],Jt.green[500],Jt.white[100],Jt.blue[500],Jt.white[100],Jt.red[500],Jt.grey[900],Jt.grey[100],Jt.yellow[900],Jt.yellow[50],Jt.green[900],Jt.green[50],Jt.blue[900],Jt.blue[50],Jt.red[900],Jt.red[50],Jt.grey[800],Jt.yellow[500],Jt.green[500],Jt.indigo[500],Jt.red[500],k.div(Rt||(Rt=on(["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ",";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"],["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ",";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"])),(function(n){var e=n.theme,t=n.type;return e.components.tooltip[t].background}))),ka=E(Lt||(Lt=on(["\n &[data-popper-placement^='top'] > "," {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > "," {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > "," {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > "," {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"],["\n &[data-popper-placement^='top'] > "," {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > "," {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > "," {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > "," {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"])),_a,_a,_a,_a),Ea=k.div.attrs((function(n){var e=n.theme,t=n.type;return e.components.tooltip[t]}))(jt||(jt=on(["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ",";\n background: ",";\n"],["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ",";\n background: ",";\n"])),(function(n){return n.color}),(function(n){return n.background})),Ta=k.div(Ht||(Ht=on(["\n ",";\n\n max-width: min(calc(100vw - 5%), 300px);\n"],["\n ",";\n\n max-width: min(calc(100vw - 5%), 300px);\n"])),ka),Ca=function(n){var e=n.message,t=n.placement,r=n.className,o=n.children,i=n.type,a=n.onMouseEnter,l=n.onMouseLeave,c=v(null),s=v(null),p=v(null),d=w(null),u=d[0],f=d[1],m=w(!1),g=m[0],b=m[1],k=y((function(){return b(!0)}),[]),E=y((function(){return b(!1)}),[]);O(c,E),_((function(){if(g)return window.addEventListener("touchmove",E),function(){window.removeEventListener("touchmove",E)}}),[E,g]);var T=y((function(n){k(),null==a||a(n)}),[a,k]),C=y((function(n){E(),null==l||l(n)}),[E,l]),z=P(p.current,s.current,{placement:t,strategy:"fixed",modifiers:x((function(){return[{name:"arrow",options:{element:u}},{name:"offset",options:{offset:[0,10]}}]}),[u])}),F=z.attributes,D=z.styles;return h.createElement(za,{className:r,ref:c},h.createElement("div",{ref:p,onClick:k,onMouseEnter:T,onMouseLeave:C},o),h.createElement(S,{in:g,timeout:200,unmountOnExit:!0,appear:!0},h.createElement(Fa,null,h.createElement(Ta,en({ref:s,style:D.popper},F.popper),h.createElement(_a,{type:i,ref:f,style:D.arrow}),h.createElement(Ea,{type:i,style:D.offset},e)))))},za=k.div(Mt||(Mt=on(["\n display: flex;\n"],["\n display: flex;\n"]))),Fa=k.div(Ut||(Ut=on(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"],["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"]))),Da=(Jt.black[100],Jt.white[100],Jt.white[100],Jt.grey[900],Jt),Aa=C(Wt||(Wt=on(["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"],["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"]))),Pa=k(V)(Ra||(Ra=on(["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ","ms ease-in-out;\n"],["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ","ms ease-in-out;\n"])),200),Sa=k.div(Ha||(Ha=on(["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ","\n\n box-shadow: ",";\n\n border: ",";\n border-radius: ","px;\n width: ","vw;\n\n @media screen and (min-width: 992px) {\n width: ",";\n }\n"],["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ","\n\n box-shadow: ",";\n\n border: ",";\n border-radius: ","px;\n width: ","vw;\n\n @media screen and (min-width: 992px) {\n width: ",";\n }\n"])),(function(n){var e=n.fullScreenHeight;return n.isFullscreen?E(La||(La=on(["\n height: ","px;\n "],["\n height: ","px;\n "])),e):E(ja||(ja=on(["\n min-height: 200px;\n "],["\n min-height: 200px;\n "])))}),(function(n){return n.isFullscreen?"none":"rgba(23, 43, 77, 0.24) 0px 16px 24px, rgba(9, 30, 66, 0.08) 0px 0px 0px"}),(function(n){return n.isFullscreen?0:"1px solid rgb(204, 204, 204)"}),(function(n){return n.isFullscreen?0:8}),(function(n){return n.isFullscreen?100:96}),(function(n){var e=n.isFullscreen;return function(n,e){return e?"100vw":n?"342px":"736px"}(n.isSmall,e)})),Oa=k.div(Va||(Va=on(["\n min-height: ",";\n height: ",";\n padding: 1rem ",";\n overflow-y: auto;\n\n ","\n"],["\n min-height: ",";\n height: ",";\n padding: 1rem ",";\n overflow-y: auto;\n\n ","\n"])),(function(n){var e=n.minHeight;return e?e+"px":"auto"}),(function(n){var e=n.height;return e?e+"px":"auto"}),tr,(function(n){var e=n.footer,t=n.header,r=n.isFullscreen,o=n.title;return r?E(Ma||(Ma=on(["\n height: calc(100% - ("," * 2));\n "],["\n height: calc(100% - ("," * 2));\n "])),"80px"):t||o||e?E(Ua||(Ua=on(["\n max-height: calc(100vh - ("," * 4));\n "],["\n max-height: calc(100vh - ("," * 4));\n "])),"80px"):E(Wa||(Wa=on(["\n max-height: 100%;\n "],["\n max-height: 100%;\n "])))})),Na=k.div(Xa||(Xa=on(["\n margin-left: 5px;\n .icon {\n cursor: pointer;\n &:hover {\n color: ",";\n }\n }\n"],["\n margin-left: 5px;\n .icon {\n cursor: pointer;\n &:hover {\n color: ",";\n }\n }\n"])),(function(n){return n.theme.palette.grey[800]})),Ia=k.div(Ka||(Ka=on(["\n padding: 0 ",";\n border-top-left-radius: ",";\n border-top-right-radius: ",";\n ",";\n\n height: ",";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n h3 {\n font-size: 20px;\n line-height: 30px;\n margin: 0;\n font-weight: 500;\n }\n"],["\n padding: 0 ",";\n border-top-left-radius: ",";\n border-top-right-radius: ",";\n ",";\n\n height: ",";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n h3 {\n font-size: 20px;\n line-height: 30px;\n margin: 0;\n font-weight: 500;\n }\n"])),tr,$t,$t,(function(n){var e=n.theme.palette;return E(qa||(qa=on(["\n border-bottom: 2px solid ",";\n background-color: ",";\n "],["\n border-bottom: 2px solid ",";\n background-color: ",";\n "])),e.grey[100],e.grey[50])}),"80px"),Ba=k.div(Ja||(Ja=on(["\n padding: 0 ",";\n height: ",";\n border-top: 2px solid ",";\n align-items: center;\n justify-content: flex-end;\n display: flex;\n margin: 0 auto;\n & > div:not(:first-of-type) {\n margin-left: 16px;\n }\n"],["\n padding: 0 ",";\n height: ",";\n border-top: 2px solid ",";\n align-items: center;\n justify-content: flex-end;\n display: flex;\n margin: 0 auto;\n & > div:not(:first-of-type) {\n margin-left: 16px;\n }\n"])),tr,"80px",(function(n){return n.theme.palette.grey[100]}));k.div(Ga||(Ga=on([""],[""])));var Ra,La,ja,Ha,Ma,Ua,Wa,Va,Xa,qa,Ka,Ja,Ga,Qa,Ya,Za,$a,nl,el,tl,rl,ol,il,al,ll,cl,sl,pl,dl,ul,fl,ml,gl,hl,xl,bl,yl,vl,wl,_l,kl,El,Tl,Cl,zl,Fl,Dl,Al,Pl,Sl,Ol,Nl,Il,Bl,Rl,Ll,jl,Hl,Ml,Ul,Wl,Vl,Xl,ql,Kl,Jl,Gl,Ql,Yl,Zl,$l,nc,ec,tc,rc,oc,ic,ac=k.div(Qa||(Qa=on(["\n position: absolute;\n width: 100%;\n top: ",";\n"],["\n position: absolute;\n width: 100%;\n top: ",";\n"])),(function(n){var e=n.height;return e&&-(e+16)+"px"})),lc=k.div(Ya||(Ya=on(["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"],["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"]))),cc=k(Gt)(Za||(Za=on(["\n font-size: 24px;\n font-weight: 500;\n"],["\n font-size: 24px;\n font-weight: 500;\n"]))),sc={overlay:{backgroundColor:Da.black[48],zIndex:1e4}},pc=function(n){function e(e){var t=n.call(this,e)||this;return t.updateHeight=function(){t.setState({fullScreenHeight:window.innerHeight})},t.hasFooter=function(){return!!t.props.footerButtons||"function"==typeof t.props.footer},t.renderFooter=function(){var n=t.props,e=n.footer,r=n.footerButtons;return r?h.createElement(h.Fragment,null,r.map((function(n,e){return h.createElement("div",{key:e},h.createElement(Dr,en({},n)))}))):e?e():void 0},t.handleModalClose=function(){t.props.onActionClose&&t.props.onActionClose()},t.contentRefCallback=function(){var n=document.getElementById("top-attachment");n&&t.setState({topAttachmentHeight:n.clientHeight})},t.state={topAttachmentHeight:0,fullScreenHeight:0},t}return nn(e,n),e.prototype.componentDidMount=function(){this.props.isFullscreen&&(this.updateHeight(),window.addEventListener("resize",this.updateHeight))},e.prototype.componentWillUnmount=function(){this.props.isFullscreen&&window.removeEventListener("resize",this.updateHeight)},e.prototype.render=function(){var n=this.props,e=n.allowClose,t=n.className,r=n.header,o=n.isFullscreen,i=n.isOpen,a=n.onActionClose,l=n.title,c=this.props,s=c.bottomAttachment,p=c.height,d=c.isSmall,u=c.minHeight,f=c.topAttachment,m=this.state.fullScreenHeight,g=null==e||e;return h.createElement(h.Fragment,null,h.createElement(Aa,null),h.createElement(Pa,{closeTimeoutMS:200,shouldCloseOnOverlayClick:g,onRequestClose:g?this.handleModalClose:void 0,shouldCloseOnEsc:g,style:sc,isOpen:null==i||i,isFullscreen:o,isSmall:d,contentRef:this.contentRefCallback,ariaHideApp:!1},h.createElement(h.Fragment,null,f&&h.createElement(ac,{id:"top-attachment",height:this.state.topAttachmentHeight},f()),h.createElement(Sa,{className:t,isFullscreen:o,isSmall:d,fullScreenHeight:m},(r||l)&&h.createElement(Ia,null,r?r():h.createElement("h3",null,l),a?h.createElement(Na,null,h.createElement(Gt,{icon:M,size:"1x",type:"light",fixedWidth:!0,onClick:this.handleModalClose,className:"icon"})):null),h.createElement(Oa,{height:p,minHeight:u,isFullscreen:o,header:r,title:l,footer:this.props.footer},this.props.children),this.hasFooter()&&h.createElement(Ba,null,this.renderFooter())),s&&h.createElement(lc,null,s()))))},e}(b),dc=function(n){var e=n.children,t=n.className,r=n.handleChangeValue,o=n.placeholder,i=n.value,a=h.createElement(fc,null,h.createElement(cc,{icon:U,color:"black"}),h.createElement("input",{autoFocus:!0,className:"inputSearchable",type:"text",onChange:function(n){r(n.currentTarget.value)},value:i,placeholder:o}),h.createElement(uc,{visible:!!i,onClick:function(){r("")}},"Cancella"));return h.createElement(pc,en({className:t,header:function(){return a}},n),e)},uc=k.div($a||($a=on(["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ",";\n color: ",";\n &:hover {\n color: ",";\n }\n display: ",";\n"],["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ",";\n color: ",";\n &:hover {\n color: ",";\n }\n display: ",";\n"])),(function(n){return n.theme.palette.grey[200]}),(function(n){return n.theme.palette.grey[500]}),(function(n){return n.theme.palette.grey[700]}),(function(n){return n.visible?"inherit":"none"})),fc=k.div(nl||(nl=on(["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ",";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: "," !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"],["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ",";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: "," !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"])),(function(n){return n.theme.palette.blue[300]}),(function(n){return n.theme.palette.grey[50]})),mc=k(pc)(el||(el=on(["\n width: 432px;\n max-width: 90vw;\n"],["\n width: 432px;\n max-width: 90vw;\n"]))),gc=k.div(tl||(tl=on(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"],["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"]))),hc=k.div(rl||(rl=on(["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"],["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"]))),xc=k.div(ol||(ol=on(["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"],["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"]))),bc=k.div(il||(il=on(["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"],["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"]))),yc={error:"error",info:"info",warning:"warning",success:"success"},vc={error:r,info:o,warning:r,success:i},wc={error:"red",info:"blue",warning:"yellow",success:"green"},_c=function(n){var e=yc[n.type],t=vc[e],r=wc[e];return h.createElement(mc,{isOpen:n.isOpen,onActionClose:function(){return n.setIsOpen(!1)},isSmall:!0},h.createElement(gc,null,h.createElement(Gt,{icon:t,size:"1x",color:r}),h.createElement("span",{style:{marginLeft:"10px"}},n.title)),h.createElement(hc,null,n.description),h.createElement(xc,null,n.question),h.createElement(bc,null,h.createElement(Dr,{text:"Annulla",color:"grey",onClick:function(){n.setIsOpen(!1)}}),h.createElement(kc,{text:n.actionText,color:r,onClick:function(){n.setIsOpen(!1),n.onAction()}})))},kc=k(Dr)(al||(al=on(["\n margin-left: 16px;\n"],["\n margin-left: 16px;\n"]))),Ec=k.div(ll||(ll=on(["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ",";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ",";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ",";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ",";\n }\n"],["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ",";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ",";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ",";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ",";\n }\n"])),(function(n){return n.theme.palette.red[50]}),(function(n){return n.theme.palette.red[500]}),(function(n){return n.theme.palette.black[100]}),(function(n){return n.theme.palette.black[80]})),Tc=function(n){var e=n.action,t=n.icon,r=n.text,o=n.title,i=x((function(){return e?h.createElement(Dr,{onClick:function(){return e.action()},iconLeft:e.icon?e.icon:void 0,text:e.text,color:"green"}):null}),[e]);return h.createElement(Ec,null,t&&h.createElement("div",{className:"icon"},h.createElement(Gt,en({},t))),o&&h.createElement("h5",null,o),r&&h.createElement("p",null,r),i)},Cc=k.div(sl||(sl=on(["\n ","\n"],["\n ","\n"])),(function(n){var e=n.theme.palette;return E(cl||(cl=on(["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ",";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ",";\n background-color: ",";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "],["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ",";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ",";\n background-color: ",";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "])),e.grey[700],e.white[100],e.grey[700])})),zc=function(n){var e=Math.ceil(n.listSize/n.pageSize),t=Math.min(n.currentPage,e),r=X(t-3,t+4).filter((function(n){return n>0&&n<=e})),o=!1;return n.currentPage>1&&Boolean(n.prevPageAction)&&n.listSize&&(o=!0),h.createElement("div",{className:"pagination"},h.createElement("div",{onClick:function(){n.prevPageAction&&o&&n.prevPageAction()},className:"pagination__element "+(o?"":"deactivated")},n.prevText),r.includes(1)?null:h.createElement(h.Fragment,null,h.createElement("div",{onClick:function(){n.changePageAction(1)},className:"pagination__element "+(1===n.currentPage?"selected":"")},"1"),r[0]-1!=1?h.createElement("div",{className:"pagination__element"},"..."):null),r.map((function(e,r){return h.createElement("div",{key:r,onClick:function(){n.changePageAction(e)},className:"pagination__element "+(e===t?"selected":"")},e)})),r.includes(e)?null:h.createElement(h.Fragment,null,e-r[r.length-1]!=1?h.createElement("div",{className:"pagination__element"},"..."):null,h.createElement("div",{onClick:function(){n.changePageAction(e)},className:"pagination__element "+(n.currentPage===e?"selected":"")},e)),h.createElement("div",{onClick:function(){n.nextPageAction&&n.currentPage<e&&n.nextPageAction()},className:"pagination__element "+(n.nextPageAction&&n.currentPage>=e?"deactivated":"")},n.nextText))},Fc=function(n){return h.createElement(Cc,null,h.createElement(zc,en({},n)))},Dc=k.div(dl||(dl=on(["\n ","\n"],["\n ","\n"])),(function(n){var e=n.color,t=n.percentage,r=n.theme.palette;return E(pl||(pl=on(["\n .progression__container {\n height: ",";\n background-color: ",";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ",";\n width: ","%;\n }\n "],["\n .progression__container {\n height: ",";\n background-color: ",";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ",";\n width: ","%;\n }\n "])),nr,r.grey[100],r[e||"blue"][500],t)})),Ac=function(n){function e(e){var t=n.call(this,e)||this;return t.state={},t}return nn(e,n),e.prototype.render=function(){return h.createElement("div",{className:"progression__container"},h.createElement("div",{className:"progression__bar"}))},e}(b),Pc=function(n){return h.createElement(Dc,en({},n),h.createElement(Ac,en({},n)))},Sc=991,Oc="fic-design-system",Nc="tableConfigs",Ic=function(n){if(n){var e=localStorage.getItem(Oc);if(e){var t=JSON.parse(e);if(t[Nc][n])return function(n){var e=["id","label","active","position"];if(Array.isArray(n))for(var t=0,r=n;t<r.length;t++)for(var o=r[t],i=0;i<e.length;i++)if(!o.hasOwnProperty(e[i]))return!1;return!0}(t[Nc][n])?t[Nc][n]:void 0}}},Bc={asc:d,desc:u,default:f},Rc=k.div(fl||(fl=on(["\n margin-left: 0.5rem;\n"],["\n margin-left: 0.5rem;\n"]))),Lc=k(Gt)(ml||(ml=on(["\n cursor: pointer;\n"],["\n cursor: pointer;\n"]))),jc=function(n){var e=q.find(n.propertiesFilter,["id",n.property]),t="";t=e?"boolean"==typeof e.type?"default":e.type:"default";var r="asc";return r=e?"boolean"==typeof e.type?"asc":"desc":"asc",h.createElement(Rc,null,h.createElement(Lc,{icon:Bc[t],onClick:function(){n.handleSortOnProperty(n.property,r)}}))},Hc={icon:s},Mc=function(n){var e=n.actions,t=n.allChecked,r=n.controlledProperties,o=n.disableSelection,i=n.handleSelectAll,a=n.handleSortOnProperty,l=n.isLoading,c=n.propertiesFilter,s=n.setShowModalCustomizeTrue;return h.createElement("thead",null,h.createElement("tr",null,o?null:h.createElement("th",null,h.createElement("input",{disabled:l,type:"checkbox",checked:t,onChange:i})),r.map((function(n,e){return n.active?h.createElement("th",{key:e,style:n.columnStyle},h.createElement("div",null,h.createElement("div",null,n.label),n.sortable?h.createElement(jc,{propertiesFilter:c,property:n.id,handleSortOnProperty:a}):null)):null})),e&&e.length?h.createElement("th",null,"Azioni"):null,h.createElement("th",{onClick:function(){s()}},h.createElement(Gt,en({},Hc)))))},Uc=k.div(gl||(gl=on([""],[""]))),Wc=function(n){var e=n.data,t=n.isLoading,r=n.listSize,o=n.renderMobileRow;return h.createElement("div",null,r&&!t?e.map((function(n,e){return h.createElement(Uc,{key:e},o?o(n):void 0)})):void 0)},Vc=k.a(xl||(xl=on(["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ","\n"],["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ","\n"])),(function(n){return E(hl||(hl=on(["\n color: ",";\n "],["\n color: ",";\n "])),n.color)})),Xc=k.div(bl||(bl=on(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"],["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"]))),qc=k.div(vl||(vl=on(["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ",";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ","\n\n .link_container {\n margin: 0.5rem 0;\n }\n"],["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ",";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ","\n\n .link_container {\n margin: 0.5rem 0;\n }\n"])),(function(n){return n.theme.palette.white[100]}),(function(n){if(n.active)return E(yl||(yl=on(["\n display: block;\n "],["\n display: block;\n "])))})),Kc=k.p(_l||(_l=on(["\n cursor: pointer;\n user-select: none;\n ","\n"],["\n cursor: pointer;\n user-select: none;\n ","\n"])),(function(n){if(n.color)return E(wl||(wl=on(["\n color: ",";\n "],["\n color: ",";\n "])),n.color)})),Jc=function(n){return h.createElement(qc,{active:n.active},n.actions.map((function(e,t){return h.createElement("div",{key:t,className:"link_container"},h.createElement(Kc,{className:"action",key:t,onClick:function(t){t.preventDefault(),e.action(n.element,n.selectedRows),n.handlePopUpVisibility(void 0)},color:e.color},e.label))})))},Gc=k.div(Tl||(Tl=on(["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ","\n"],["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ","\n"])),(function(n){var e=n.active,t=n.theme.palette;return E(El||(El=on(["\n ","\n &:hover {\n background-color: ",";\n }\n "],["\n ","\n &:hover {\n background-color: ",";\n }\n "])),e&&E(kl||(kl=on(["\n background-color: ",";\n color: ",";\n "],["\n background-color: ",";\n color: ",";\n "])),t.blue[50],t.blue[500]),t.blue[50])})),Qc=function(n){return h.createElement(Gc,{active:n.active,onClick:function(){return n.handlePopUpVisibility(n.rowId)}},h.createElement(Gt,{icon:s}))},Yc=k.div(zl||(zl=on(["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ","\n"],["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ","\n"])),(function(n){return n.active&&E(Cl||(Cl=on(["\n display: block;\n "],["\n display: block;\n "])))})),Zc=function(n){var e=n.actions,t=n.controlledProperties,r=n.currentActionsPopUp,o=n.disableSelection,i=n.element,a=n.handlePopUpVisibility,l=n.handleSelection,c=n.index,s=n.selectedList;return h.createElement("tr",{className:s&&s.includes(i.id)?"selected":""},o?null:h.createElement("td",null,h.createElement("div",null,h.createElement("input",{type:"checkbox",checked:s&&s.includes(i.id),onChange:function(){l(i.id)}}))),t.map((function(n,e){return n.active?h.createElement("td",{key:e},h.createElement("div",{className:"table__value"},n.render?n.render(i[n.id],i.id):h.createElement("span",null,i[n.id]))):null})),e&&e.length?h.createElement("td",null,h.createElement(Xc,null,e[0]?h.createElement(Vc,{onClick:function(n){n.preventDefault(),e[0].action(i,s||[])},color:e[0].color},e[0].label):null,h.createElement(Yc,{onClick:function(){a(void 0)},active:Boolean(r===c)}),e&&e.length>1&&h.createElement(Qc,{active:Boolean(r===c),rowId:c,handlePopUpVisibility:a}),h.createElement(Jc,{active:Boolean(r===c),actions:e.slice(1),selectedRows:s||[],element:i,handlePopUpVisibility:a}))):null,h.createElement("td",null))},$c=k.div(Al||(Al=on(["\n ","\n"],["\n ","\n"])),(function(n){var e=n.show,t=n.theme.palette;return E(Dl||(Dl=on(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ","\n .link {\n color: ",";\n cursor: pointer;\n }\n .modal__container {\n background-color: ",";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ",";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ",";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ",";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ",";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "],["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ","\n .link {\n color: ",";\n cursor: pointer;\n }\n .modal__container {\n background-color: ",";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ",";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ",";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ",";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ",";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "])),e&&E(Fl||(Fl=on(["\n display: flex;\n align-items: center;\n justify-content: center;\n "],["\n display: flex;\n align-items: center;\n justify-content: center;\n "]))),t.blue[500],t.white[100],t.white[100],t.grey[50],t.grey[150],t.grey[100])})),ns=function(n){var e=n.localProperties,t=n.onDragEnd,r=n.propertiesDisplayHandler;return h.createElement(K,{onDragEnd:t},h.createElement(J,{droppableId:"droppable"},(function(n,t){return h.createElement("div",en({},n.droppableProps,{ref:n.innerRef,style:(o=t.isDraggingOver,{position:"relative",backgroundColor:o?Da.grey[50]:""})}),e.map((function(n,e){return h.createElement(G,{key:n.id,draggableId:n.id,index:e,isDragDisabled:0===e},(function(t,o){return h.createElement("div",en({className:"draggable_element",ref:t.innerRef},t.draggableProps,t.dragHandleProps,{style:(i=t.draggableProps.style,en({userSelect:"none",padding:"0.5rem 0 0.5rem 0",outline:"none"},i))}),h.createElement("div",{className:"draggable__handle"},h.createElement(Gt,{icon:m,className:"icon"})),h.createElement("div",{className:"draggable__checkbox"},h.createElement(_o,{isDisabled:Boolean(n.deactivateActive)||0===e,text:n.label,value:n.active,onClick:function(){r(n.id)}})));var i}))})),n.placeholder);var o})))},es=function(n){function t(e){var t=n.call(this,e)||this;t.propertiesDisplayHandler=function(n){var e=t.state.localProperties.map((function(e){return e.id===n?en(en({},e),{active:"checked"===e.active?"unchecked":"checked"}):e}));t.setState({localProperties:e})},t.onDragEnd=function(n,e){var r=t.state.localProperties,o=n.destination,i=n.source;if(n.destination&&o){var a=function(n,e,t){var r=Array.from(n),o=r.splice(e,1)[0];return r.splice(t,0,o),r}(r,i.index,o.index);t.setState({localProperties:a})}},t.resetProperties=function(){var n=t.props.properties.map((function(n){return en(en({},n),{active:"checked"})}));n=q.orderBy(n,"position","asc"),t.setState({localProperties:n})};var r=t.props.properties;return t.state={localProperties:rn(r)},t}return nn(t,n),t.prototype.render=function(){var n=this,t=this.props,r=t.close,o=t.modifyControlledPropertiesHandler,i=t.properties,a=t.show,l=t.title,c=this.state.localProperties;return h.createElement($c,{show:a},h.createElement("div",{className:"modal__container"},h.createElement("div",{className:"modal__header"},h.createElement("div",null,l),h.createElement("div",null,h.createElement("p",{onClick:r},h.createElement(Gt,{icon:e})))),h.createElement("div",{className:"modal__body"},h.createElement(ns,{onDragEnd:this.onDragEnd,localProperties:this.state.localProperties,propertiesDisplayHandler:this.propertiesDisplayHandler})),h.createElement("div",{className:"modal__footer"},h.createElement("div",null,h.createElement("p",{className:"link",onClick:this.resetProperties},"Reimposta")),h.createElement("div",{className:"buttons__container"},h.createElement(Dr,{text:"Annulla",color:"grey",size:"large",onClick:function(){n.setState({localProperties:i}),r()}}),h.createElement(Dr,{text:"Applica",size:"large",onClick:function(){o(c),r()}})))))},t}(b),ts=k.tr(Pl||(Pl=on(["\n height: 49px;\n"],["\n height: 49px;\n"]))),rs=function(n){return h.createElement(h.Fragment,null,function(){for(var e=[],t=[],r=0;r<n.elmentsNumber;r++){t.splice(0,t.length),t.push(h.createElement("td",{key:"tr-"+r+"-td-0"}));for(var o=0;o<n.propsNumber;o++)t.push(h.createElement("td",{key:"tr-"+r+"-td-"+(o+1)},h.createElement("div",{className:"linear-background"})));t.push(h.createElement("td",{key:"tr-"+r+"-td-"+t.length})),e.push(h.createElement(ts,{key:"tr-"+r},t))}return e}())},os=function(n){var e=n.currentPage,t=Math.ceil(n.listSize/n.pageSize);e>t&&(e=t);var r=q.range(e-3,e+4),o=!1;return n.currentPage>1&&Boolean(n.prevPageAction)&&n.listSize&&(o=!0),h.createElement("div",{className:"pagination"},h.createElement("div",{onClick:function(){n.prevPageAction&&o&&n.prevPageAction()},className:"pagination__element "+(o?"":"deactivated")},"Indietro"),r.includes(1)?null:h.createElement(h.Fragment,null,h.createElement("div",{onClick:function(){n.changePageAction(1)},className:"pagination__element "+(1===n.currentPage?"selected":null)},"1"),r[0]-1!=1?h.createElement("div",{className:"pagination__element"},"..."):null),r.map((function(r,o){return r>0&&r<=t?h.createElement("div",{key:o,onClick:function(){n.changePageAction(r)},className:"pagination__element "+(r===e?"selected":null)},r):null})),r.includes(t)?null:h.createElement(h.Fragment,null,t-r[r.length-1]!=1?h.createElement("div",{className:"pagination__element"},"..."):null,h.createElement("div",{onClick:function(){n.changePageAction(t)},className:"pagination__element "+(n.currentPage===t?"selected":null)},t)),h.createElement("div",{onClick:function(){n.nextPageAction&&n.currentPage<t&&n.nextPageAction()},className:"pagination__element "+(n.nextPageAction&&n.currentPage>=t?"deactivated":"")},"Avanti"))},is=k(function(n){function e(e){var t=n.call(this,e)||this;t.handleSelection=function(n){var e=t.props,r=e.selectedList,o=e.selectionCallback;r&&o&&(r.includes(n)?o(r.filter((function(e){return e!==n}))):o(rn(r,[n])))},t.handleSelectAll=function(n){var e=t.props,r=e.data,o=e.selectedList,i=e.selectionCallback;if(o){var a=rn(o);n.target.checked?r.forEach((function(n){o.includes(n.id)||a.push(n.id)})):r.forEach((function(n){a=a.filter((function(e){return e!==n.id}))})),i&&i(a)}},t.handleSortOnProperty=function(n,e){var r=t.state.propertiesFilter;if(q.find(r,{id:n})){var o=r.map((function(t){return t.id===n?en(en({},t),{type:t.type!==e&&e}):t}));t.setState({propertiesFilter:rn(o)})}else{var i={id:n,type:e};t.setState({propertiesFilter:rn(r,[i])})}},t.modifyControlledPropertiesHandler=function(n){!function(n,e){var t,r,o,i;if(e){var a=localStorage.getItem(Oc);if(a){var l=JSON.parse(a),c=en(en({},l),((t={})[Nc]=en(en({},l[Nc]),((r={})[e]=n,r)),t));localStorage.setItem(Oc,JSON.stringify(c))}else(o={})[Nc]=((i={})[e]=n,i),c=o,localStorage.setItem(Oc,JSON.stringify(c))}}(n,t.props.persistencyId),t.setState({controlledProperties:n})},t.handlePopUpVisibility=function(n){t.setState({currentActionsPopUp:n})};var r=Ic(e.persistencyId),o=r?function(n,e){return e.map((function(e){return en(en({},e),n.find((function(n){return n.id===e.id})))}))}(e.properties,r):e.properties.map((function(n,e){return en(en({},n),{active:"checked",position:e})}));return t.state={propertiesFilter:[],showModalCustomize:!1,controlledProperties:o},t}return nn(e,n),e.prototype.render=function(){var n=this,e=this.state,t=e.controlledProperties,r=e.propertiesFilter,o=e.showModalCustomize,i=this.state.currentActionsPopUp,a=this.props,l=a.actions,c=a.className,s=a.customizeModalTitle,p=a.data,d=a.listSize,u=a.pageSize,f=this.props,m=f.nextPageAction,g=f.prevPageAction,x=this.props,b=x.changePageAction,y=x.currentPage,v=this.props,w=v.disableSelection,_=v.isLoading,k=v.renderMobileRow,E=v.selectedList,T=this.props,C=T.emptySetAction,z=T.emptySetIcon,F=T.emptySetText,D=T.emptySetTitle,A=r.filter((function(n){return n.type})),P=A.map((function(n){return n.id})),S=A.map((function(n){return n.type})),O=!_;return E&&d>0?p.forEach((function(n){E.includes(n.id)||(O=!1)})):O=!1,h.createElement("div",{className:c},window.innerWidth<=Sc?h.createElement(Wc,{listSize:d,isLoading:_,data:p,renderMobileRow:k}):void 0,window.innerWidth>Sc?h.createElement(h.Fragment,null,h.createElement("table",null,h.createElement(Mc,{isLoading:_,allChecked:O,setShowModalCustomizeTrue:function(){return n.setState({showModalCustomize:!0})},handleSelectAll:this.handleSelectAll,controlledProperties:t,propertiesFilter:r,handleSortOnProperty:this.handleSortOnProperty,actions:l,disableSelection:w}),h.createElement("tbody",null,d&&!_?q.orderBy(p,P,S).map((function(e,r){return h.createElement(Zc,{key:r,selectedList:E,element:e,index:r,handleSelection:n.handleSelection,controlledProperties:t,actions:l,handlePopUpVisibility:n.handlePopUpVisibility,currentActionsPopUp:i,disableSelection:w})})):null,_?h.createElement(rs,{elmentsNumber:u,propsNumber:t.length}):null)),d<=0&&!_&&D?h.createElement("div",{className:"pageEmptySet__container"},h.createElement(Tc,{icon:z,title:D,text:F,action:C})):null,d?h.createElement(os,{changePageAction:b,nextPageAction:m,prevPageAction:g,currentPage:y,pageSize:u,listSize:d}):null,h.createElement(es,{show:o,close:function(){n.setState({showModalCustomize:!1})},title:s,properties:t,modifyControlledPropertiesHandler:this.modifyControlledPropertiesHandler})):null)},e}(b))(Ll||(Ll=on(["\n table {\n overflow-x: scroll;\n width: 100%;\n white-space: nowrap;\n border-spacing: 0;\n table-layout: auto;\n position: relative;\n }\n\n td,\n th {\n text-align: left;\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n td {\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n }\n }\n\n ","\n\n input[type='checkbox'] {\n cursor: pointer;\n }\n\n .table__value {\n white-space: normal;\n a {\n color: ",";\n text-decoration: none;\n cursor: pointer;\n }\n }\n\n .filter__active {\n }\n .filter__disabled {\n opacity: 0.5;\n }\n\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n ","\n\n .pageEmptySet__container {\n margin-top: calc("," * 2);\n }\n"],["\n table {\n overflow-x: scroll;\n width: 100%;\n white-space: nowrap;\n border-spacing: 0;\n table-layout: auto;\n position: relative;\n }\n\n td,\n th {\n text-align: left;\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n td {\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n }\n }\n\n ","\n\n input[type='checkbox'] {\n cursor: pointer;\n }\n\n .table__value {\n white-space: normal;\n a {\n color: ",";\n text-decoration: none;\n cursor: pointer;\n }\n }\n\n .filter__active {\n }\n .filter__disabled {\n opacity: 0.5;\n }\n\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n ","\n\n .pageEmptySet__container {\n margin-top: calc("," * 2);\n }\n"])),(function(n){var e=n.disableSelection,t=n.isHeaderFixed,r=n.isLoading,o=n.theme.palette;return E(Bl||(Bl=on(["\n thead {\n th {\n ","\n z-index: 3;\n border-bottom: 2px solid ",";\n background-color: ",";\n color: ",";\n font-weight: 500;\n border-right: 2px solid ",";\n\n ","\n &:last-child {\n cursor: pointer;\n color: ",";\n }\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n padding: 0 1rem;\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n }\n }\n\n tbody {\n tr {\n &.selected {\n background-color: ",";\n &:hover {\n background-color: ",";\n }\n }\n ","\n ","\n }\n }\n "],["\n thead {\n th {\n ","\n z-index: 3;\n border-bottom: 2px solid ",";\n background-color: ",";\n color: ",";\n font-weight: 500;\n border-right: 2px solid ",";\n\n ","\n &:last-child {\n cursor: pointer;\n color: ",";\n }\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n padding: 0 1rem;\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n }\n }\n\n tbody {\n tr {\n &.selected {\n background-color: ",";\n &:hover {\n background-color: ",";\n }\n }\n ","\n ","\n }\n }\n "])),t&&E(Sl||(Sl=on(["\n position: sticky;\n top: 0;\n "],["\n position: sticky;\n top: 0;\n "]))),o.grey[200],o.grey[50],o.grey[500],o.grey[100],!e&&E(Ol||(Ol=on(["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "],["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "]))),o.black,o.yellow[50],o.yellow[100],!r&&E(Nl||(Nl=on(["\n &:hover {\n background-color: ",";\n }\n "],["\n &:hover {\n background-color: ",";\n }\n "])),o.grey[100]),!e&&E(Il||(Il=on(["\n &:first-child {\n width: 20px;\n }\n "],["\n &:first-child {\n width: 20px;\n }\n "]))))}),(function(n){return n.theme.palette.blue[500]}),(function(n){var e=n.theme.palette;return E(Rl||(Rl=on(["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ",";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ",";\n background-color: ",";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ","\n "],["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ",";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ",";\n background-color: ",";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ","\n "])),e.grey[700],e.white[100],e.grey[700],E(ul||(ul=on(["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ",";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n "," 46%,\n "," 50%,\n "," 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"],["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ",";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n "," 46%,\n "," 50%,\n "," 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"])),(function(n){return n.theme.palette.grey[100]}),(function(n){return n.theme.palette.grey[100]}),(function(n){return n.theme.palette.white[100]}),(function(n){return n.theme.palette.grey[100]})))}),or),as=function(n){return h.createElement(is,en({},n))},ls=k.span(jl||(jl=on(["\n background: ",";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ",";\n\n &:hover {\n color: ",";\n }\n"],["\n background: ",";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ",";\n\n &:hover {\n color: ",";\n }\n"])),(function(n){var e=n.active,t=n.theme;return e?t.palette.primary[500]:"transparent"}),(function(n){var e=n.active,t=n.theme;return e?t.palette.primary[500]:t.palette.grey[500]}),(function(n){var e=n.active,t=n.theme;return e?t.palette.primary[500]:t.palette.grey[900]})),cs=k.span(Hl||(Hl=on(["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ",";\n\n &:hover {\n color: ",";\n }\n"],["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ",";\n\n &:hover {\n color: ",";\n }\n"])),(function(n){var e=n.active,t=n.theme;return e?t.palette.primary[500]:t.palette.grey[500]}),(function(n){var e=n.active,t=n.theme;return e?t.palette.primary[500]:t.palette.grey[900]})),ss=function(n){var e=n.active,t=n.handleClick,r=n.tabRef,o=n.text;return h.createElement(ps,{ref:null==r?void 0:r(),onClick:t},h.createElement(cs,{active:e},o),h.createElement(ls,{active:e}))},ps=k.div(Ml||(Ml=on(["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"],["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"]))),ds=k.div(Wl||(Wl=on(["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ",";\n\n & > *:first-child {\n padding-left: ","px;\n }\n\n & > *:last-child {\n padding-right: ","px;\n }\n\n & > * + * {\n margin-left: ","px;\n }\n"],["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ",";\n\n & > *:first-child {\n padding-left: ","px;\n }\n\n & > *:last-child {\n padding-right: ","px;\n }\n\n & > * + * {\n margin-left: ","px;\n }\n"])),(function(n){return n.hidden&&E(Ul||(Ul=on(["\n visibility: hidden;\n position: absolute;\n "],["\n visibility: hidden;\n position: absolute;\n "])))}),(function(n){return n.lateralPadding}),(function(n){return n.lateralPadding}),(function(n){return n.distance})),us=k(ds)(Vl||(Vl=on(["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"],["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"]))),fs=function(n){var e=n.active;return h.createElement(ss,{active:e,text:h.createElement(ms,{icon:W,fixedWidth:!0})})},ms=k(Gt)(Xl||(Xl=on(["\n height: 21px;\n"],["\n height: 21px;\n"]))),gs=function(n){var e=n.active,t=n.tabs,r=y((function(){return h.createElement(fs,{active:e})}),[e]),o=y((function(n){return h.createElement(h.Fragment,null,t.map((function(e,t){var r=e.active,o=e.handleClick,i=e.text;return h.createElement(ao.Item,{key:t,text:i,active:r,onClick:function(){o&&o(),n()}})})))}),[t]);return h.createElement(hs,{placement:"bottom-end",fullWidth:!0,renderTrigger:r,renderContent:o})},hs=k(ao)(ql||(ql=on(["\n display: block;\n"],["\n display: block;\n"]))),xs=function(n){var e=n.className,t=n.distance,r=void 0===t?15:t,o=n.lateralPadding,i=void 0===o?23:o,a=n.tabs,l=function(){var n=N(),e=n[0],t=n[1].width,r=w(0),o=r[0],i=r[1];return I((function(){return i(t)}),250,[t]),{elementsWrapperRef:e,wrapperWidth:o}}(),c=l.elementsWrapperRef,s=l.wrapperWidth,p=w(0)[1],d=a.length,u=x((function(){return Array.from(Array(d),(function(){return h.createRef()}))}),[d]),f=x((function(){return u.map((function(n){return function(){return p((function(n){return n+1})),n}}))}),[u]),m=function(n){var e=n.distance,t=n.lateralPadding,r=n.tabsLength,o=n.tabsRefs,i=n.wrapperWidth;return x((function(){for(var n,a=0,l=i-2*t;a!==r&&l>0;){var c=null===(n=o[a].current)||void 0===n?void 0:n.offsetWidth;c&&l-(c+e)>0?(a++,l-=c+e):l=-1}return{visibleCount:a}}),[e,t,r,o,i])}({distance:r,tabsLength:d,wrapperWidth:s,tabsRefs:u,lateralPadding:i}).visibleCount,g=x((function(){return a.map((function(n,e){return h.createElement(ss,en({key:e,tabRef:f[e]},n))}))}),[a,u]),b=x((function(){return a.slice(0,m).map((function(n,e){return h.createElement(ss,en({key:e},n))}))}),[a,m]),y=x((function(){return a.slice(m)}),[a,m]),v=0!==y.length,_=y.some((function(n){return n.active})),k=0===s;return h.createElement(h.Fragment,null,h.createElement(bs,{className:e,distance:r,lateralPadding:i,hidden:!k},g),h.createElement(ds,{className:e,distance:r,lateralPadding:i,hidden:k,ref:c},b,v&&h.createElement(gs,{active:_,tabs:y})))},bs=k(us)(Kl||(Kl=on(["\n overflow-x: hidden;\n"],["\n overflow-x: hidden;\n"]))),ys=function(n){var e=n.className,t=n.distance,r=void 0===t?15:t,o=n.lateralPadding,i=void 0===o?23:o,a=n.tabs,l=x((function(){return a.map((function(n,e){return h.createElement(ss,en({key:e},n))}))}),[a]);return h.createElement(us,{className:e,distance:r,lateralPadding:i},l)},vs=function(n){var e=n.children,t=n.theme;return h.createElement(z,{theme:t},h.createElement(h.Fragment,null,e))},ws=k.div(Jl||(Jl=on(["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ",";\n background-color: ",";\n border-radius: 100px;\n"],["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ",";\n background-color: ",";\n border-radius: 100px;\n"])),(function(n){return n.theme.palette.white[100]}),(function(n){return n.theme.palette.primary[400]})),_s=k.span(Gl||(Gl=on(["\n margin-right: 8px;\n font-size: 20px;\n"],["\n margin-right: 8px;\n font-size: 20px;\n"]))),ks=k.span(Ql||(Ql=on(["\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 21px;\n white-space: nowrap;\n"],["\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 21px;\n white-space: nowrap;\n"]))),Es=k.div(Yl||(Yl=on(["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ",";\n }\n"],["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ",";\n }\n"])),(function(n){return n.theme.palette.white[100]})),Ts={icon:e},Cs=function(n){var e=n.className,t=n.closeIcon,r=n.leftIcon,o=n.onClose,i=n.renderCloseIcon,a=n.text;return h.createElement(ws,{className:e},r&&h.createElement(_s,null,h.createElement(Gt,en({},r))),h.createElement(ks,null,a),o&&h.createElement(Es,{onClick:o},i?i():h.createElement(Gt,en({},t||Ts,{fixedWidth:!0}))))},zs={icon:Q},Fs=function(n){var e=n.shortcut,t=n.text,r=tn(n,["shortcut","text"]);return h.createElement(Cs,en({text:h.createElement(h.Fragment,null,t," ",h.createElement("b",null,e)),leftIcon:zs},r))},Ds=k.div(Zl||(Zl=on(["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"],["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"]))),As=k(Gt)($l||($l=on(["\n vertical-align: sub;\n"],["\n vertical-align: sub;\n"]))),Ps=k.div(nc||(nc=on(["\n display: inline-block;\n height: 24px;\n margin-left: 8px;\n margin-right: 16px;\n margin-top: 16px;\n font-weight: 500;\n width: 256px;\n"],["\n display: inline-block;\n height: 24px;\n margin-left: 8px;\n margin-right: 16px;\n margin-top: 16px;\n font-weight: 500;\n width: 256px;\n"]))),Ss=k.div(ec||(ec=on(["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"],["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"]))),Os=k.div(tc||(tc=on(["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"],["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"]))),Ns=k.div(rc||(rc=on(["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"],["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"]))),Is=k.label(oc||(oc=on(["\n cursor: pointer;\n"],["\n cursor: pointer;\n"]))),Bs={standard:"dark",error:"error",info:"info",warning:"warning",success:"success"},Rs={dark:g,error:r,info:o,warning:r,success:i},Ls=function(n){return h.createElement(Ns,null,h.createElement(Ds,null,h.createElement(As,en({},n.icon,{fixedWidth:!0}))),h.createElement(Ps,null,n.title,h.createElement(Os,null,h.createElement(Is,{onClick:n.onActionClick},n.actionLabel))),h.createElement(Ss,null,n.content))},js=function(n,e){var t,r=e.type?Bs[e.type]:"dark",o=void 0===e.autoClose?3e3:e.autoClose,i=e.icon||{icon:Rs[r]},a=(null===(t=e.icon)||void 0===t?void 0:t.size)||"1x",l=en(en({},i),{size:a}),c=Y[r](h.createElement(Ls,{title:n,content:e.content,icon:l,actionLabel:e.actionLabel,onActionClick:e.onActionClick}),{autoClose:o,closeButton:!1});if(c)return String(c)},Hs={Container:k(Z).attrs({hideProgressBar:!0,newestOnTop:!0,closeOnClick:!1,draggable:!1,rtl:!1})(ic||(ic=on(["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"],["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"]))),show:js,dismiss:function(n){Y.dismiss(n)},success:function(n,e){return js(n,en(en({},e),{type:"success"}))},error:function(n,e){return js(n,en(en({},e),{type:"error"}))},info:function(n,e){return js(n,en(en({},e),{type:"info"}))},warning:function(n,e){return js(n,en(en({},e),{type:"warning"}))},standard:function(n,e){return js(n,en(en({},e),{type:"standard"}))}};export{lr as Accordion,gi as AsyncCreatableSelect,mi as AsyncSelect,pr as Avatar,ur as Badge,mr as Banner,Dr as Button,_o as Checkbox,Ir as Chip,_c as ConfirmationModal,fi as CreatableSelect,jr as Drawer,ao as Dropdown,xs as DropdownTabs,Ni as GroupedList,Gt as Icon,Xt as IconBackground,Ar as IconButton,Gi as InlineMessage,uo as InputHelper,Uo as InputText,la as MicroTag,pc as Modal,Oa as ModalBody,dc as ModalSearchable,Tc as PageEmptySet,Fc as Pagination,Pc as Progressbar,ji as RadioButton,Hi as RadioButtonGroup,ys as ScrollableTabs,ui as Select,Fs as ShortcutTip,ea as SidebarItem,ga as Stepper,as as Table,wa as Tag,ki as TextArea,vs as ThemeProvider,Cs as Tip,Hs as Toast,Ca as Tooltip,co as WithBadge,na as sidebarItemHeight,To as useCheckboxValue,Vo as useSelectMultiValues,Wo as useSelectValue};
1
+ import { faChevronDown, faTimes, faCheck, faMinus, faExclamationTriangle, faTimesCircle, faCheckCircle, faCaretDown, faEllipsisH, faCaretRight, faInfoCircle, faSortUp, faSortDown, faSort, faEquals, faInfoSquare } from '@fortawesome/pro-solid-svg-icons';
2
+ import React, { useMemo, Component, useCallback, useRef, useEffect, useState } from 'react';
3
+ import styled, { css, useTheme, createGlobalStyle, ThemeProvider as ThemeProvider$1 } from 'styled-components';
4
+ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
5
+ import { faCircleNotch, faCircle } from '@fortawesome/pro-regular-svg-icons';
6
+ import { usePopper } from 'react-popper';
7
+ import { CSSTransition } from 'react-transition-group';
8
+ import { useClickAway, useMeasure, useDebounce } from 'react-use';
9
+ import ReactSelect, { components as components$1 } from 'react-select';
10
+ import Async from 'react-select/async';
11
+ import AsyncCreatable from 'react-select/async-creatable';
12
+ import Creatable from 'react-select/creatable';
13
+ import { faTimes as faTimes$1, faSearch, faEllipsisH as faEllipsisH$1 } from '@fortawesome/pro-light-svg-icons';
14
+ import { isMacOs } from 'react-device-detect';
15
+ import ReactModal from 'react-modal';
16
+ import range from 'lodash/range';
17
+ import _ from 'lodash';
18
+ import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
19
+ import { faRocket } from '@fortawesome/pro-duotone-svg-icons';
20
+ import { toast, ToastContainer as ToastContainer$1 } from 'react-toastify';
21
+
22
+ /*! *****************************************************************************
23
+ Copyright (c) Microsoft Corporation. All rights reserved.
24
+ Licensed under the Apache License, Version 2.0 (the "License"); you may not use
25
+ this file except in compliance with the License. You may obtain a copy of the
26
+ License at http://www.apache.org/licenses/LICENSE-2.0
27
+
28
+ THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
29
+ KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
30
+ WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
31
+ MERCHANTABLITY OR NON-INFRINGEMENT.
32
+
33
+ See the Apache Version 2.0 License for specific language governing permissions
34
+ and limitations under the License.
35
+ ***************************************************************************** */
36
+ /* global Reflect, Promise */
37
+
38
+ var extendStatics = function(d, b) {
39
+ extendStatics = Object.setPrototypeOf ||
40
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
41
+ function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
42
+ return extendStatics(d, b);
43
+ };
44
+
45
+ function __extends(d, b) {
46
+ extendStatics(d, b);
47
+ function __() { this.constructor = d; }
48
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
49
+ }
50
+
51
+ var __assign = function() {
52
+ __assign = Object.assign || function __assign(t) {
53
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
54
+ s = arguments[i];
55
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
56
+ }
57
+ return t;
58
+ };
59
+ return __assign.apply(this, arguments);
60
+ };
61
+
62
+ function __rest(s, e) {
63
+ var t = {};
64
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
65
+ t[p] = s[p];
66
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
67
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
68
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
69
+ t[p[i]] = s[p[i]];
70
+ }
71
+ return t;
72
+ }
73
+
74
+ function __spreadArrays() {
75
+ for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
76
+ for (var r = Array(s), k = 0, i = 0; i < il; i++)
77
+ for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
78
+ r[k] = a[j];
79
+ return r;
80
+ }
81
+ function __makeTemplateObject(cooked, raw) {
82
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
83
+ return cooked;
84
+ }
85
+
86
+ var iconSizeMap = {
87
+ xs: '.75em',
88
+ sm: '.875em',
89
+ lg: '1.33em',
90
+ '1x': '1em',
91
+ '2x': '2em',
92
+ '3x': '3em',
93
+ '4x': '4em',
94
+ '5x': '5em',
95
+ '6x': '6em',
96
+ '7x': '7em',
97
+ '8x': '8em',
98
+ '9x': '9em',
99
+ '10x': '10em',
100
+ };
101
+
102
+ var IconBackground = function (_a) {
103
+ var children = _a.children, rest = __rest(_a, ["children"]);
104
+ return React.createElement(Wrapper, __assign({}, rest), children);
105
+ };
106
+ var circleBackgroundScaleFactor = 1.5;
107
+ var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 50%;\n\n min-width: calc(", " * ", ");\n min-height: calc(", " * ", ");\n\n display: inline-flex;\n justify-content: center;\n align-items: center;\n"], ["\n background-color: ",
108
+ ";\n border-radius: 50%;\n\n min-width: calc(", " * ", ");\n min-height: calc(", " * ", ");\n\n display: inline-flex;\n justify-content: center;\n align-items: center;\n"])), function (_a) {
109
+ var theme = _a.theme, color = _a.color, backgroundColor = _a.backgroundColor;
110
+ return backgroundColor || theme.components.iconBackground[color] || 'transparent';
111
+ }, circleBackgroundScaleFactor, function (_a) {
112
+ var size = _a.size;
113
+ return iconSizeMap[size];
114
+ }, circleBackgroundScaleFactor, function (_a) {
115
+ var size = _a.size;
116
+ return iconSizeMap[size];
117
+ });
118
+ var templateObject_1;
119
+
120
+ var black = {
121
+ 8: 'rgba(51, 51, 51, 0.08)',
122
+ 16: 'rgba(51, 51, 51, 0.16)',
123
+ 48: 'rgba(51, 51, 51, 0.48)',
124
+ 80: 'rgba(51, 51, 51, 0.8)',
125
+ 100: '#333333',
126
+ };
127
+
128
+ var blue = {
129
+ 900: '#0028AD',
130
+ 800: '#0038B9',
131
+ 700: '#0041C0',
132
+ 600: '#004BC7',
133
+ 500: '#0052CC',
134
+ 400: '#266CD4',
135
+ 300: '#4D86DB',
136
+ 200: '#80A9E6',
137
+ 100: '#B3CBF0',
138
+ 50: '#E0EAF9',
139
+ };
140
+
141
+ var cyan = {
142
+ 900: '#066552',
143
+ 800: '#088C72',
144
+ 700: '#0AA989',
145
+ 600: '#0BC09C',
146
+ 500: '#0DD5AD',
147
+ 400: '#4DE0C2',
148
+ 300: '#7DE8D3',
149
+ 200: '#A4EFE0',
150
+ 100: '#C6F5EB',
151
+ 50: '#E4FAF5',
152
+ };
153
+
154
+ var fuchsia = {
155
+ 900: '#500663',
156
+ 800: '#71088B',
157
+ 700: '#880AA8',
158
+ 600: '#9C0BC0',
159
+ 500: '#AD0DD5',
160
+ 400: '#CB67E4',
161
+ 300: '#DB94EC',
162
+ 200: '#E6B6F2',
163
+ 100: '#EFD2F7',
164
+ 50: '#F7E9FB',
165
+ };
166
+
167
+ var green = {
168
+ 900: '#00572E',
169
+ 800: '#006A3F',
170
+ 700: '#007448',
171
+ 600: '#007F52',
172
+ 500: '#00875A',
173
+ 400: '#269973',
174
+ 300: '#4DAB8C',
175
+ 200: '#80C3AD',
176
+ 100: '#B3DBCE',
177
+ 50: '#E0F1EB',
178
+ };
179
+
180
+ var grey = {
181
+ 900: '#091E42',
182
+ 800: '#253858',
183
+ 700: '#505F79',
184
+ 600: '#5E6C84',
185
+ 500: '#6B778C',
186
+ 400: '#7A869A',
187
+ 300: '#A5ADBA',
188
+ 200: '#C1C7D0',
189
+ 100: '#EBECF0',
190
+ 50: '#FAFBFC',
191
+ };
192
+
193
+ var indigo = {
194
+ 900: '#05175E',
195
+ 800: '#082188',
196
+ 700: '#0A29A6',
197
+ 600: '#0B2FBF',
198
+ 500: '#0D35D5',
199
+ 400: '#637CE3',
200
+ 300: '#90A3EB',
201
+ 200: '#B3BFF1',
202
+ 100: '#D0D7F6',
203
+ 50: '#E8ECFB',
204
+ };
205
+
206
+ var orange = {
207
+ 900: '#783722',
208
+ 800: '#A74D2F',
209
+ 700: '#CA5D39',
210
+ 600: '#E66A42',
211
+ 500: '#FF7649',
212
+ 400: '#FF9978',
213
+ 300: '#FFB49B',
214
+ 200: '#FFCAB9',
215
+ 100: '#FFDED3',
216
+ 50: '#FFEFEA',
217
+ };
218
+
219
+ var pink = {
220
+ 900: '#640648',
221
+ 800: '#8C0864',
222
+ 700: '#A80A79',
223
+ 600: '#C00B8A',
224
+ 500: '#D50D99',
225
+ 400: '#E569BF',
226
+ 300: '#EC96D2',
227
+ 200: '#F2B7E0',
228
+ 100: '#F7D2EC',
229
+ 50: '#FBEAF6',
230
+ };
231
+
232
+ var red = {
233
+ 900: '#C81603',
234
+ 800: '#D12206',
235
+ 700: '#D52808',
236
+ 600: '#DA300A',
237
+ 500: '#DE350B',
238
+ 400: '#E35330',
239
+ 300: '#E87254',
240
+ 200: '#EF9A85',
241
+ 100: '#F5C2B6',
242
+ 50: '#FBE7E2',
243
+ };
244
+
245
+ var white = {
246
+ 8: 'rgba(255, 255, 255, 0.08)',
247
+ 16: 'rgba(255, 255, 255, 0.16)',
248
+ 48: 'rgba(255, 255, 255, 0.48)',
249
+ 80: 'rgba(255, 255, 255, 0.8)',
250
+ 100: '#FFFFFF',
251
+ };
252
+
253
+ var yellow = {
254
+ 900: '#FF6B0A',
255
+ 800: '#FF7C12',
256
+ 700: '#FF8617',
257
+ 600: '#FF911B',
258
+ 500: '#FF991F',
259
+ 400: '#FFA841',
260
+ 300: '#FFB862',
261
+ 200: '#FFCC8F',
262
+ 100: '#FFE0BC',
263
+ 50: '#FFF3E4',
264
+ };
265
+
266
+ var defaultPalette = {
267
+ black: black,
268
+ white: white,
269
+ grey: grey,
270
+ blue: blue,
271
+ indigo: indigo,
272
+ yellow: yellow,
273
+ orange: orange,
274
+ red: red,
275
+ green: green,
276
+ fuchsia: fuchsia,
277
+ pink: pink,
278
+ cyan: cyan,
279
+ primary: blue,
280
+ };
281
+
282
+ var iconBackgroundPalette = {
283
+ blue: defaultPalette.blue[50],
284
+ indigo: defaultPalette.indigo[50],
285
+ yellow: defaultPalette.yellow[50],
286
+ orange: defaultPalette.orange[50],
287
+ red: defaultPalette.red[50],
288
+ green: defaultPalette.green[50],
289
+ fuchsia: defaultPalette.fuchsia[50],
290
+ pink: defaultPalette.pink[50],
291
+ cyan: defaultPalette.cyan[50],
292
+ primary: defaultPalette.primary[50],
293
+ grey: defaultPalette.grey[100],
294
+ white: defaultPalette.white[16],
295
+ black: defaultPalette.black[16],
296
+ };
297
+
298
+ var getIconStyles = function (_a) {
299
+ var theme = _a.theme, color = _a.color;
300
+ return color
301
+ ? theme.components.icon[color]
302
+ : {
303
+ primary: 'inherit',
304
+ secondary: 'inherit',
305
+ };
306
+ };
307
+
308
+ var Icon = function (_a) {
309
+ var onClick = _a.onClick, isDisabled = _a.isDisabled, props = __rest(_a, ["onClick", "isDisabled"]);
310
+ var handleClick = useMemo(function () { return (isDisabled || !onClick ? undefined : function (e) { return onClick(e); }); }, [isDisabled, onClick]);
311
+ return React.createElement(StyledIcon, __assign({}, props, { onClick: handleClick }));
312
+ };
313
+ var StyledIcon = styled(FontAwesomeIcon).attrs(getIconStyles)(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n cursor: ", ";\n color: ", ";\n --fa-secondary-color: ", ";\n"], ["\n cursor: ", ";\n color: ", ";\n --fa-secondary-color: ", ";\n"])), function (_a) {
314
+ var onClick = _a.onClick;
315
+ return (onClick ? 'pointer' : 'inherit');
316
+ }, function (_a) {
317
+ var primary = _a.primary;
318
+ return primary;
319
+ }, function (_a) {
320
+ var secondary = _a.secondary;
321
+ return secondary;
322
+ });
323
+ var templateObject_1$1;
324
+
325
+ var getColoredIcon = function (color) { return ({
326
+ primary: defaultPalette[color][500],
327
+ secondary: defaultPalette[color][200],
328
+ }); };
329
+ var iconPalette = {
330
+ blue: getColoredIcon('blue'),
331
+ red: getColoredIcon('red'),
332
+ green: getColoredIcon('green'),
333
+ yellow: getColoredIcon('yellow'),
334
+ orange: getColoredIcon('orange'),
335
+ primary: getColoredIcon('primary'),
336
+ cyan: getColoredIcon('cyan'),
337
+ fuchsia: getColoredIcon('fuchsia'),
338
+ indigo: getColoredIcon('indigo'),
339
+ pink: getColoredIcon('pink'),
340
+ grey: getColoredIcon('grey'),
341
+ white: {
342
+ primary: defaultPalette.white[100],
343
+ secondary: defaultPalette.white[48],
344
+ },
345
+ black: {
346
+ primary: defaultPalette.black[100],
347
+ secondary: defaultPalette.black[48],
348
+ },
349
+ };
350
+
351
+ var spacing = {
352
+ xxs: '4px',
353
+ xs: '8px',
354
+ s: '12px',
355
+ m: '16px',
356
+ l: '24px',
357
+ xl: '32px',
358
+ xxl: '48px',
359
+ xxxl: '64px',
360
+ };
361
+
362
+ var StyledAccordionWrapper = styled.div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n color: ", ";\n .header {\n border-top: 1px solid ", ";\n display: flex;\n align-items: center;\n width: 100%;\n height: ", ";\n .header__element {\n padding: 0 ", ";\n &:hover {\n &.pointer {\n cursor: pointer;\n }\n }\n }\n\n .action_icon {\n cursor: pointer;\n display: none;\n width: ", ";\n height: ", ";\n &.visibile {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n }\n &:hover {\n background: ", ";\n border-radius: 4px;\n }\n }\n\n .chevron {\n }\n .chevron__closed {\n transform: rotate(-90deg);\n }\n\n .title {\n flex: 1;\n padding: 0;\n user-select: none;\n p {\n margin: 0;\n font-size: 20px;\n line-height: 30px;\n }\n }\n }\n\n .body {\n padding: 0 ", ";\n height: auto;\n\n &.closed {\n overflow: hidden;\n height: 0;\n }\n }\n"], ["\n color: ", ";\n .header {\n border-top: 1px solid ", ";\n display: flex;\n align-items: center;\n width: 100%;\n height: ", ";\n .header__element {\n padding: 0 ", ";\n &:hover {\n &.pointer {\n cursor: pointer;\n }\n }\n }\n\n .action_icon {\n cursor: pointer;\n display: none;\n width: ", ";\n height: ", ";\n &.visibile {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n }\n &:hover {\n background: ", ";\n border-radius: 4px;\n }\n }\n\n .chevron {\n }\n .chevron__closed {\n transform: rotate(-90deg);\n }\n\n .title {\n flex: 1;\n padding: 0;\n user-select: none;\n p {\n margin: 0;\n font-size: 20px;\n line-height: 30px;\n }\n }\n }\n\n .body {\n padding: 0 ", ";\n height: auto;\n\n &.closed {\n overflow: hidden;\n height: 0;\n }\n }\n"])), function (_a) {
363
+ var theme = _a.theme;
364
+ return theme.palette.black[100];
365
+ }, function (_a) {
366
+ var theme = _a.theme;
367
+ return theme.palette.grey[100];
368
+ }, spacing.xxxl, spacing.l, spacing.xl, spacing.xl, function (_a) {
369
+ var theme = _a.theme;
370
+ return theme.palette.grey[100];
371
+ }, spacing.l);
372
+ var templateObject_1$2;
373
+
374
+ var UnstyledAccordion = /** @class */ (function (_super) {
375
+ __extends(UnstyledAccordion, _super);
376
+ function UnstyledAccordion(props) {
377
+ var _this = _super.call(this, props) || this;
378
+ _this.handleOpenAccordion = function () {
379
+ var show = _this.state.show;
380
+ _this.setState({ show: !show });
381
+ };
382
+ var showBodyAtFirstRender = _this.props.showBodyAtFirstRender;
383
+ _this.state = {
384
+ show: Boolean(showBodyAtFirstRender),
385
+ };
386
+ return _this;
387
+ }
388
+ UnstyledAccordion.prototype.render = function () {
389
+ var _a = this.props, lateralActions = _a.lateralActions, renderBody = _a.renderBody, renderLateralActions = _a.renderLateralActions, renderTitle = _a.renderTitle, title = _a.title;
390
+ var show = this.state.show;
391
+ return (React.createElement(React.Fragment, null,
392
+ React.createElement("div", { className: 'header' },
393
+ React.createElement("div", { onClick: this.handleOpenAccordion, className: "header__element pointer chevron" + (show ? "" : "__closed") },
394
+ React.createElement(Icon, { icon: faChevronDown })),
395
+ React.createElement("div", { onClick: this.handleOpenAccordion, className: 'header__element title pointer' }, renderTitle ? React.createElement(React.Fragment, null, renderTitle()) : React.createElement("p", null, title)),
396
+ React.createElement("div", { className: 'header__element' }, renderLateralActions
397
+ ? renderLateralActions
398
+ : lateralActions === null || lateralActions === void 0 ? void 0 : lateralActions.map(function (o, i) { return (React.createElement("span", { className: "action_icon " + (show ? "visibile" : ""), key: i, onClick: o.action }, o.icon)); }))),
399
+ show && React.createElement("div", { className: "body" }, renderBody())));
400
+ };
401
+ return UnstyledAccordion;
402
+ }(Component));
403
+ var Accordion = function (props) { return (React.createElement(StyledAccordionWrapper, __assign({}, props),
404
+ React.createElement(UnstyledAccordion, __assign({}, props)))); };
405
+
406
+ var avatarSizes = { xs: 16, s: 24, m: 32, l: 40 };
407
+ var textSizes = { xs: 10, s: 12, m: 14, l: 20 };
408
+ var getBackGroundImageStyle = function (_a) {
409
+ var image = _a.image, initials = _a.initials, placeholder = _a.placeholder;
410
+ if (!image && !placeholder)
411
+ return {};
412
+ var urls = [];
413
+ if (image) {
414
+ urls.push("url(" + image + ")");
415
+ }
416
+ if (placeholder && !initials) {
417
+ urls.push("url(" + placeholder + ")");
418
+ }
419
+ return { backgroundImage: urls.join() };
420
+ };
421
+ var BaseAvatar = function (props) { return React.createElement("span", { className: props.className }); };
422
+ var Avatar = styled(BaseAvatar).attrs(function (props) { return ({
423
+ initials: props.initials ? (['m', 'l'].includes(props.size) ? props.initials.slice(0, 2) : props.initials[0]) : '',
424
+ }); })(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n -webkit-box-pack: center;\n height: ", "px;\n width: ", "px;\n line-height: 0;\n border-radius: 100%;\n -webkit-box-align: center;\n background-size: cover;\n color: white;\n background-color: ", ";\n ", "\n\n &:after {\n content: '", "';\n line-height: 40px;\n font-weight: 500;\n font-style: normal;\n font-size: ", "px;\n text-transform: uppercase;\n }\n"], ["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n -webkit-box-pack: center;\n height: ", "px;\n width: ", "px;\n line-height: 0;\n border-radius: 100%;\n -webkit-box-align: center;\n background-size: cover;\n color: white;\n background-color: ", ";\n ", "\n\n &:after {\n content: '", "';\n line-height: 40px;\n font-weight: 500;\n font-style: normal;\n font-size: ", "px;\n text-transform: uppercase;\n }\n"])), function (props) { return avatarSizes[props.size || 'm']; }, function (props) { return avatarSizes[props.size || 'm']; }, function (_a) {
425
+ var theme = _a.theme;
426
+ return theme.palette.primary[500];
427
+ }, function (props) { return getBackGroundImageStyle(props); }, function (props) { return (props.image ? '' : props.initials); }, function (props) { return textSizes[props.size || 'm']; });
428
+ var templateObject_1$3;
429
+
430
+ var Body = styled.div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n border-radius: 4px;\n margin: 3px 0;\n max-height: 24px;\n\n padding-left: ", ";\n padding-right: ", ";\n\n color: ", ";\n background-color: ", ";\n\n &.red {\n background-color: ", ";\n color: ", ";\n }\n\n &.green {\n background-color: ", ";\n color: ", ";\n }\n"], ["\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n border-radius: 4px;\n margin: 3px 0;\n max-height: 24px;\n\n padding-left: ", ";\n padding-right: ", ";\n\n color: ", ";\n background-color: ", ";\n\n &.red {\n background-color: ", ";\n color: ", ";\n }\n\n &.green {\n background-color: ", ";\n color: ", ";\n }\n"])), function (_a) {
431
+ var imageUrl = _a.imageUrl, leftIcon = _a.leftIcon;
432
+ return (leftIcon || imageUrl ? '8px' : '0');
433
+ }, function (_a) {
434
+ var rightIcon = _a.rightIcon;
435
+ return (rightIcon ? '8px' : '0');
436
+ }, function (_a) {
437
+ var theme = _a.theme;
438
+ return theme.palette.grey[700];
439
+ }, function (_a) {
440
+ var theme = _a.theme;
441
+ return theme.palette.grey[50];
442
+ }, function (_a) {
443
+ var theme = _a.theme;
444
+ return theme.palette.red[50];
445
+ }, function (_a) {
446
+ var theme = _a.theme;
447
+ return theme.palette.red[900];
448
+ }, function (_a) {
449
+ var theme = _a.theme;
450
+ return theme.palette.green[50];
451
+ }, function (_a) {
452
+ var theme = _a.theme;
453
+ return theme.palette.green[900];
454
+ });
455
+ var templateObject_1$4;
456
+
457
+ var Badge = function (props) {
458
+ var color = props.color, handleRightIconClick = props.handleRightIconClick, imageUrl = props.imageUrl, leftIcon = props.leftIcon, rightIcon = props.rightIcon, text = props.text;
459
+ return (React.createElement(Body, __assign({ className: color || '' }, props),
460
+ imageUrl && React.createElement(Avatar, { size: 'xs', image: imageUrl }),
461
+ leftIcon && React.createElement(Icon, __assign({}, leftIcon)),
462
+ React.createElement(Text, null, text),
463
+ rightIcon && React.createElement(Icon, __assign({}, rightIcon, { onClick: handleRightIconClick }))));
464
+ };
465
+ var Text = styled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n padding: ", " ", ";\n"], ["\n padding: ", " ", ";\n"])), spacing.xxs, spacing.xs);
466
+ var templateObject_1$5;
467
+
468
+ var mapColors = function (theme, color) {
469
+ switch (color) {
470
+ case 'red':
471
+ case 'blue':
472
+ case 'yellow':
473
+ case 'green':
474
+ return {
475
+ bgColor: theme.palette[color]['500'],
476
+ textColor: theme.palette.white['100'],
477
+ };
478
+ case 'grey':
479
+ return {
480
+ bgColor: theme.palette.grey['200'],
481
+ textColor: theme.palette.black['100'],
482
+ };
483
+ default:
484
+ return {
485
+ bgColor: theme.palette.grey['900'],
486
+ textColor: theme.palette.white['100'],
487
+ };
488
+ }
489
+ };
490
+
491
+ var Banner = function (_a) {
492
+ var color = _a.color, content = _a.content, icon = _a.icon, onClose = _a.onClose;
493
+ return (React.createElement(Wrapper$1, { color: color },
494
+ icon && React.createElement(Icon, __assign({}, icon)),
495
+ React.createElement(Content, null, content),
496
+ onClose && React.createElement(Icon, { icon: faTimes, color: 'grey', onClick: onClose })));
497
+ };
498
+ var Wrapper$1 = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n padding: 10px 20px 10px 20px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 10px;\n"], ["\n ",
499
+ "\n padding: 10px 20px 10px 20px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 10px;\n"])), function (_a) {
500
+ var color = _a.color, theme = _a.theme;
501
+ var _b = mapColors(theme, color), bgColor = _b.bgColor, textColor = _b.textColor;
502
+ return css(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), bgColor, textColor);
503
+ });
504
+ var Content = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n flex-grow: 1;\n"], ["\n flex-grow: 1;\n"])));
505
+ var templateObject_1$6, templateObject_2, templateObject_3;
506
+
507
+ var useDebounceClick = function (_a) {
508
+ var _b = _a.manualLock, manualLock = _b === void 0 ? false : _b, onClick = _a.onClick, _c = _a.timeMs, timeMs = _c === void 0 ? 250 : _c;
509
+ var clickable = useRef(true);
510
+ return useCallback(function (e) {
511
+ if (clickable.current && !manualLock) {
512
+ clickable.current = false;
513
+ setTimeout(function () { return (clickable.current = true); }, timeMs);
514
+ onClick === null || onClick === void 0 ? void 0 : onClick(e);
515
+ }
516
+ }, [onClick, manualLock, timeMs]);
517
+ };
518
+
519
+ var Spinner = function (_a) {
520
+ var className = _a.className;
521
+ return (React.createElement("div", { className: className },
522
+ React.createElement(Icon, { icon: faCircleNotch, spin: true })));
523
+ };
524
+
525
+ var heightMap = {
526
+ large: 40,
527
+ medium: 32,
528
+ };
529
+ var getButtonStyles = function (_a) {
530
+ var color = _a.color, isDisabled = _a.isDisabled, size = _a.size, theme = _a.theme, type = _a.type;
531
+ var _b = theme.components.button, defaultColor = _b.defaultColor, defaultSize = _b.defaultSize, defaultType = _b.defaultType;
532
+ var actualType = type || defaultType;
533
+ var actualSize = size || defaultSize;
534
+ var actualColor = isDisabled ? 'disabled' : color || defaultColor;
535
+ var border = actualType === 'primary' ? '1px solid rgba(9, 30, 66, 0.16)' : '';
536
+ var cursor = isDisabled ? 'default' : 'pointer';
537
+ var buttonParts = theme.components.button[actualType][actualColor];
538
+ return __assign({ height: heightMap[actualSize], border: border,
539
+ cursor: cursor }, buttonParts);
540
+ };
541
+
542
+ var StyledIcon$1 = styled(Icon)(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n display: inline-block;\n"], ["\n display: inline-block;\n"])));
543
+ var LeftIcon = styled(StyledIcon$1)(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject([""], [""])));
544
+ var RightIcon = styled(StyledIcon$1)(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject([""], [""])));
545
+ var ButtonSpinner = styled(Spinner)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n"], ["\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n"])));
546
+ var Text$1 = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: inline-block;\n line-height: initial;\n"], ["\n display: inline-block;\n line-height: initial;\n"])));
547
+ var Content$1 = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n opacity: ", ";\n display: inline-flex;\n align-items: center;\n justify-content: center;\n"], ["\n opacity: ", ";\n display: inline-flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
548
+ var isLoading = _a.isLoading;
549
+ return (isLoading ? 0 : 1);
550
+ });
551
+ var WrapperStyle = css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n border-radius: 4px;\n user-select: none;\n position: relative;\n text-align: center;\n\n width: ", ";\n\n font-weight: 500;\n\n cursor: ", ";\n border: ", ";\n\n ", " {\n height: ", "px;\n }\n\n ", " + * {\n margin-left: 8px;\n }\n\n ", " + * {\n margin-left: 8px;\n }\n\n color: ", ";\n background-color: ", ";\n\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n padding: 0 12px;\n\n display: inline-block;\n"], ["\n border-radius: 4px;\n user-select: none;\n position: relative;\n text-align: center;\n\n width: ", ";\n\n font-weight: 500;\n\n cursor: ", ";\n border: ", ";\n\n ", " {\n height: ", "px;\n }\n\n ", " + * {\n margin-left: 8px;\n }\n\n ", " + * {\n margin-left: 8px;\n }\n\n color: ", ";\n background-color: ", ";\n\n &:hover {\n color: ", ";\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n padding: 0 12px;\n\n display: inline-block;\n"])), function (_a) {
552
+ var fullWidth = _a.fullWidth;
553
+ return (fullWidth ? '100%' : 'initial');
554
+ }, function (_a) {
555
+ var cursor = _a.cursor;
556
+ return cursor;
557
+ }, function (_a) {
558
+ var border = _a.border;
559
+ return border;
560
+ }, Content$1, function (_a) {
561
+ var height = _a.height;
562
+ return height;
563
+ }, LeftIcon, Text$1, function (_a) {
564
+ var text = _a.text;
565
+ return text;
566
+ }, function (_a) {
567
+ var normal = _a.normal;
568
+ return normal;
569
+ }, function (_a) {
570
+ var textHover = _a.textHover;
571
+ return textHover;
572
+ }, function (_a) {
573
+ var hover = _a.hover;
574
+ return hover;
575
+ }, function (_a) {
576
+ var active = _a.active;
577
+ return active;
578
+ });
579
+ var HrefWrapper = styled.a.attrs(getButtonStyles)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n ", ";\n\n text-decoration: none;\n"], ["\n ", ";\n\n text-decoration: none;\n"])), WrapperStyle);
580
+ var OnClickWrapper = styled.div.attrs(getButtonStyles)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", ";\n"], ["\n ", ";\n"])), WrapperStyle);
581
+ var templateObject_1$7, templateObject_2$1, templateObject_3$1, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
582
+
583
+ var Button = function (_a) {
584
+ var className = _a.className, color = _a.color, _b = _a.fullWidth, fullWidth = _b === void 0 ? false : _b, href = _a.href, iconLeft = _a.iconLeft, iconRight = _a.iconRight, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isLoading, isLoading = _d === void 0 ? false : _d, onClick = _a.onClick, size = _a.size, target = _a.target, text = _a.text, type = _a.type;
585
+ var debounceClick = useDebounceClick({ onClick: onClick, manualLock: isLoading || isDisabled });
586
+ var showLoading = !isDisabled && isLoading;
587
+ var Wrapper = useCallback(function (props) { return (href ? React.createElement(HrefWrapper, __assign({}, props)) : React.createElement(OnClickWrapper, __assign({}, props))); }, [href]);
588
+ return (React.createElement(Wrapper, { className: className, size: size, color: color, onClick: debounceClick, href: href, type: type, isDisabled: isDisabled, fullWidth: fullWidth, target: target },
589
+ React.createElement(Content$1, { isLoading: showLoading },
590
+ iconLeft && React.createElement(LeftIcon, __assign({}, iconLeft)),
591
+ text && React.createElement(Text$1, null, text),
592
+ iconRight && React.createElement(RightIcon, __assign({}, iconRight))),
593
+ showLoading && React.createElement(ButtonSpinner, null)));
594
+ };
595
+
596
+ var buttonPalette = {
597
+ primary: {
598
+ blue: {
599
+ normal: defaultPalette.blue[500],
600
+ hover: defaultPalette.blue[700],
601
+ active: defaultPalette.blue[900],
602
+ text: defaultPalette.white[100],
603
+ textHover: defaultPalette.grey[100],
604
+ },
605
+ red: {
606
+ normal: defaultPalette.red[500],
607
+ hover: defaultPalette.red[700],
608
+ active: defaultPalette.red[900],
609
+ text: defaultPalette.white[100],
610
+ textHover: defaultPalette.grey[100],
611
+ },
612
+ green: {
613
+ normal: defaultPalette.green[500],
614
+ hover: defaultPalette.green[700],
615
+ active: defaultPalette.green[900],
616
+ text: defaultPalette.white[100],
617
+ textHover: defaultPalette.grey[100],
618
+ },
619
+ grey: {
620
+ normal: defaultPalette.white[100],
621
+ hover: defaultPalette.grey[100],
622
+ active: defaultPalette.grey[200],
623
+ text: defaultPalette.black[100],
624
+ textHover: defaultPalette.black[100],
625
+ },
626
+ yellow: {
627
+ normal: defaultPalette.yellow[500],
628
+ hover: defaultPalette.yellow[700],
629
+ active: defaultPalette.yellow[900],
630
+ text: defaultPalette.white[100],
631
+ textHover: defaultPalette.grey[100],
632
+ },
633
+ disabled: {
634
+ normal: defaultPalette.grey[50],
635
+ hover: defaultPalette.grey[50],
636
+ active: defaultPalette.grey[50],
637
+ text: defaultPalette.grey[200],
638
+ textHover: defaultPalette.grey[200],
639
+ },
640
+ },
641
+ secondary: {
642
+ blue: {
643
+ normal: defaultPalette.blue[50],
644
+ hover: defaultPalette.blue[100],
645
+ active: defaultPalette.blue[200],
646
+ text: defaultPalette.blue[900],
647
+ textHover: defaultPalette.blue[900],
648
+ },
649
+ red: {
650
+ normal: defaultPalette.red[50],
651
+ hover: defaultPalette.red[100],
652
+ active: defaultPalette.red[200],
653
+ text: defaultPalette.red[900],
654
+ textHover: defaultPalette.red[900],
655
+ },
656
+ green: {
657
+ normal: defaultPalette.green[50],
658
+ hover: defaultPalette.green[100],
659
+ active: defaultPalette.green[200],
660
+ text: defaultPalette.green[900],
661
+ textHover: defaultPalette.green[900],
662
+ },
663
+ yellow: {
664
+ normal: defaultPalette.yellow[50],
665
+ hover: defaultPalette.yellow[100],
666
+ active: defaultPalette.yellow[200],
667
+ text: defaultPalette.yellow[900],
668
+ textHover: defaultPalette.yellow[900],
669
+ },
670
+ grey: {
671
+ normal: defaultPalette.grey[50],
672
+ hover: defaultPalette.grey[100],
673
+ active: defaultPalette.grey[200],
674
+ text: defaultPalette.black[100],
675
+ textHover: defaultPalette.black[100],
676
+ },
677
+ disabled: {
678
+ normal: defaultPalette.grey[50],
679
+ hover: defaultPalette.grey[50],
680
+ active: defaultPalette.grey[50],
681
+ text: defaultPalette.grey[200],
682
+ textHover: defaultPalette.grey[200],
683
+ },
684
+ },
685
+ text: {
686
+ blue: {
687
+ normal: 'transparent',
688
+ hover: defaultPalette.blue[50],
689
+ active: defaultPalette.blue[100],
690
+ text: defaultPalette.blue[500],
691
+ textHover: defaultPalette.blue[500],
692
+ },
693
+ red: {
694
+ normal: 'transparent',
695
+ hover: defaultPalette.red[50],
696
+ active: defaultPalette.red[100],
697
+ text: defaultPalette.red[500],
698
+ textHover: defaultPalette.red[500],
699
+ },
700
+ green: {
701
+ normal: 'transparent',
702
+ hover: defaultPalette.green[50],
703
+ active: defaultPalette.green[100],
704
+ text: defaultPalette.green[500],
705
+ textHover: defaultPalette.green[500],
706
+ },
707
+ grey: {
708
+ normal: 'transparent',
709
+ hover: defaultPalette.grey[50],
710
+ active: defaultPalette.grey[100],
711
+ text: defaultPalette.grey[500],
712
+ textHover: defaultPalette.grey[500],
713
+ },
714
+ yellow: {
715
+ normal: 'transparent',
716
+ hover: defaultPalette.yellow[50],
717
+ active: defaultPalette.yellow[100],
718
+ text: defaultPalette.yellow[500],
719
+ textHover: defaultPalette.yellow[500],
720
+ },
721
+ disabled: {
722
+ normal: 'transparent',
723
+ hover: 'transparent',
724
+ active: 'transparent',
725
+ text: defaultPalette.grey[200],
726
+ textHover: defaultPalette.grey[200],
727
+ },
728
+ },
729
+ defaultType: 'primary',
730
+ defaultColor: 'blue',
731
+ defaultSize: 'medium',
732
+ };
733
+
734
+ var getIconButtonColors = function (_a) {
735
+ var color = _a.color, isDisabled = _a.isDisabled, theme = _a.theme, type = _a.type;
736
+ var _b = theme.components.iconButton, defaultColor = _b.defaultColor, defaultType = _b.defaultType;
737
+ var actualColor = isDisabled ? 'disabled' : color || defaultColor;
738
+ var actualType = type || defaultType;
739
+ return theme.components.iconButton[actualType][actualColor];
740
+ };
741
+
742
+ var IconButton = function (_a) {
743
+ var className = _a.className, color = _a.color, icon = _a.icon, _b = _a.isDisabled, isDisabled = _b === void 0 ? false : _b, onClick = _a.onClick, type = _a.type;
744
+ var handleClick = useDebounceClick({ onClick: onClick, manualLock: isDisabled });
745
+ return (React.createElement(Wrapper$2, { color: color, className: className, type: type, onClick: handleClick, isDisabled: isDisabled },
746
+ React.createElement(Icon, __assign({}, icon))));
747
+ };
748
+ var Wrapper$2 = styled.div.attrs(getIconButtonColors)(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n display: inline-flex;\n font-size: 20px;\n text-decoration: none;\n padding: 0 8px;\n height: 32px;\n align-items: center;\n\n cursor: ", ";\n color: ", ";\n\n :hover {\n color: ", ";\n text-decoration: none;\n }\n"], ["\n display: inline-flex;\n font-size: 20px;\n text-decoration: none;\n padding: 0 8px;\n height: 32px;\n align-items: center;\n\n cursor: ", ";\n color: ", ";\n\n :hover {\n color: ", ";\n text-decoration: none;\n }\n"])), function (_a) {
749
+ var isDisabled = _a.isDisabled;
750
+ return (isDisabled ? 'default' : 'pointer');
751
+ }, function (_a) {
752
+ var normal = _a.normal;
753
+ return normal;
754
+ }, function (_a) {
755
+ var hover = _a.hover;
756
+ return hover;
757
+ });
758
+ var templateObject_1$8;
759
+
760
+ var iconButtonPalette = {
761
+ primary: {
762
+ blue: {
763
+ normal: defaultPalette.blue[200],
764
+ hover: defaultPalette.blue[500],
765
+ },
766
+ red: {
767
+ normal: defaultPalette.red[200],
768
+ hover: defaultPalette.red[500],
769
+ },
770
+ green: {
771
+ normal: defaultPalette.green[200],
772
+ hover: defaultPalette.green[500],
773
+ },
774
+ yellow: {
775
+ normal: defaultPalette.yellow[200],
776
+ hover: defaultPalette.yellow[500],
777
+ },
778
+ disabled: {
779
+ normal: defaultPalette.grey[200],
780
+ hover: defaultPalette.grey[200],
781
+ },
782
+ },
783
+ secondary: {
784
+ blue: {
785
+ normal: defaultPalette.blue[200],
786
+ hover: defaultPalette.white[100],
787
+ },
788
+ red: {
789
+ normal: defaultPalette.red[200],
790
+ hover: defaultPalette.white[100],
791
+ },
792
+ green: {
793
+ normal: defaultPalette.green[200],
794
+ hover: defaultPalette.white[100],
795
+ },
796
+ yellow: {
797
+ normal: defaultPalette.yellow[200],
798
+ hover: defaultPalette.white[100],
799
+ },
800
+ disabled: {
801
+ normal: defaultPalette.grey[200],
802
+ hover: defaultPalette.grey[200],
803
+ },
804
+ },
805
+ defaultType: 'primary',
806
+ defaultColor: 'blue',
807
+ };
808
+
809
+ var getInputStyle = function (_a) {
810
+ var theme = _a.theme, value = _a.value, isDisabled = _a.isDisabled, large = _a.large, hasError = _a.hasError;
811
+ var _b = theme.components.checkbox.input, normal = _b.normal, error = _b.error;
812
+ var size = large ? '20px' : '16px';
813
+ var currentStatus = hasError ? error : normal;
814
+ var _c = currentStatus[value], borderColor = _c.borderColor, tickColor = _c.tickColor, backgroundColor = _c.backgroundColor;
815
+ return {
816
+ backgroundColor: backgroundColor,
817
+ tickColor: tickColor,
818
+ borderColor: borderColor,
819
+ cursor: isDisabled ? 'not-allowed' : 'pointer',
820
+ height: size,
821
+ width: size,
822
+ opacity: isDisabled ? 0.3 : 1,
823
+ };
824
+ };
825
+ var getLabelStyle = function (_a) {
826
+ var isDisabled = _a.isDisabled, large = _a.large, theme = _a.theme, hasError = _a.hasError;
827
+ var _b = theme.components.checkbox.label, normal = _b.normal, error = _b.error;
828
+ var color = hasError ? error : normal;
829
+ return {
830
+ fontSize: large ? '16px' : '14px',
831
+ cursor: isDisabled ? 'not-allowed' : 'pointer',
832
+ opacity: isDisabled ? 0.1 : 1,
833
+ color: color,
834
+ };
835
+ };
836
+ var statusIcon = {
837
+ checked: faCheck,
838
+ indeterminate: faMinus,
839
+ unchecked: null,
840
+ };
841
+ var convertToStatus = function (value) {
842
+ return typeof value === 'boolean' ? (value ? 'checked' : 'unchecked') : value;
843
+ };
844
+
845
+ var Input = styled.span.attrs(getInputStyle)(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n border-radius: 4px;\n font-size: 10px;\n text-align: center;\n\n width: ", ";\n height: ", ";\n background-color: ", ";\n color: ", ";\n border: ", ";\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n opacity: ", ";\n"], ["\n border-radius: 4px;\n font-size: 10px;\n text-align: center;\n\n width: ", ";\n height: ", ";\n background-color: ", ";\n color: ", ";\n border: ", ";\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n opacity: ", ";\n"])), function (_a) {
846
+ var width = _a.width;
847
+ return width;
848
+ }, function (_a) {
849
+ var height = _a.height;
850
+ return height;
851
+ }, function (_a) {
852
+ var backgroundColor = _a.backgroundColor;
853
+ return backgroundColor;
854
+ }, function (_a) {
855
+ var tickColor = _a.tickColor;
856
+ return tickColor;
857
+ }, function (_a) {
858
+ var borderColor = _a.borderColor;
859
+ return "1px solid " + borderColor;
860
+ }, function (_a) {
861
+ var cursor = _a.cursor;
862
+ return cursor;
863
+ }, function (_a) {
864
+ var opacity = _a.opacity;
865
+ return opacity;
866
+ });
867
+ var templateObject_1$9;
868
+
869
+ var Label = styled.span.attrs(getLabelStyle)(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n flex: 1;\n text-align: left;\n font-size: ", ";\n cursor: ", ";\n color: ", ";\n opacity: ", ";\n"], ["\n flex: 1;\n text-align: left;\n font-size: ", ";\n cursor: ", ";\n color: ", ";\n opacity: ", ";\n"])), function (_a) {
870
+ var fontSize = _a.fontSize;
871
+ return fontSize;
872
+ }, function (_a) {
873
+ var cursor = _a.cursor;
874
+ return cursor;
875
+ }, function (_a) {
876
+ var color = _a.color;
877
+ return color;
878
+ }, function (_a) {
879
+ var opacity = _a.opacity;
880
+ return opacity;
881
+ });
882
+ var templateObject_1$a;
883
+
884
+ var CheckboxImpl = function (_a) {
885
+ var isDisabled = _a.isDisabled, className = _a.className, onClick = _a.onClick, large = _a.large, text = _a.text, value = _a.value, error = _a.error, onChange = _a.onChange;
886
+ var wrapperClick = useCallback(function () { var _a; return (_a = ref.current) === null || _a === void 0 ? void 0 : _a.click(); }, []);
887
+ var handleClick = useCallback(function (e) { return !isDisabled && onClick && onClick(e); }, [isDisabled, onClick]);
888
+ var icon = statusIcon[value];
889
+ var ref = useRef(null);
890
+ useEffect(function () {
891
+ if (ref.current) {
892
+ switch (value) {
893
+ case 'checked':
894
+ ref.current.checked = true;
895
+ ref.current.indeterminate = false;
896
+ break;
897
+ case 'indeterminate':
898
+ ref.current.checked = false;
899
+ ref.current.indeterminate = true;
900
+ break;
901
+ case 'unchecked':
902
+ ref.current.checked = false;
903
+ ref.current.indeterminate = false;
904
+ break;
905
+ }
906
+ }
907
+ }, [value]);
908
+ return (React.createElement(ClickableWrapper, { className: className, onClick: wrapperClick },
909
+ React.createElement(Input, { value: value, large: large, isDisabled: isDisabled, hasError: !!error }, icon && React.createElement(Icon, { icon: icon })),
910
+ React.createElement(HiddenInput, { ref: ref, type: 'checkbox', value: value, onClick: handleClick, onChange: onChange, disabled: isDisabled }),
911
+ React.createElement(Label, { large: large, isDisabled: isDisabled, hasError: !!error }, text)));
912
+ };
913
+ var ClickableWrapper = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: flex;\n gap: 8px;\n"], ["\n display: flex;\n gap: 8px;\n"])));
914
+ var HiddenInput = styled.input(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n display: none;\n"], ["\n display: none;\n"])));
915
+ var Checkbox = function (_a) {
916
+ var value = _a.value, rest = __rest(_a, ["value"]);
917
+ return (React.createElement(CheckboxImpl, __assign({}, rest, { value: convertToStatus(value) })));
918
+ };
919
+ var templateObject_1$b, templateObject_2$2;
920
+
921
+ var normalChecked = {
922
+ tickColor: defaultPalette.white[100],
923
+ backgroundColor: defaultPalette.blue[500],
924
+ borderColor: defaultPalette.blue[500],
925
+ };
926
+ var errorChecked = {
927
+ tickColor: defaultPalette.white[100],
928
+ backgroundColor: defaultPalette.red[500],
929
+ borderColor: defaultPalette.red[500],
930
+ };
931
+ var checkboxPalette = {
932
+ input: {
933
+ normal: {
934
+ checked: normalChecked,
935
+ indeterminate: normalChecked,
936
+ unchecked: {
937
+ tickColor: defaultPalette.white[100],
938
+ backgroundColor: 'transparent',
939
+ borderColor: defaultPalette.grey[500],
940
+ },
941
+ },
942
+ error: {
943
+ checked: errorChecked,
944
+ indeterminate: errorChecked,
945
+ unchecked: {
946
+ tickColor: defaultPalette.white[100],
947
+ backgroundColor: 'transparent',
948
+ borderColor: defaultPalette.red[500],
949
+ },
950
+ },
951
+ },
952
+ label: {
953
+ normal: defaultPalette.black[100],
954
+ error: defaultPalette.red[500],
955
+ },
956
+ };
957
+
958
+ var useCheckboxValue = function (initialValue) {
959
+ if (initialValue === void 0) { initialValue = 'unchecked'; }
960
+ var _a = useState(function () { return convertToStatus(initialValue); }), status = _a[0], setStatus = _a[1];
961
+ var value = status === 'checked';
962
+ var setCheck = useCallback(function () { return setStatus('checked'); }, []);
963
+ var setUncheck = useCallback(function () { return setStatus('unchecked'); }, []);
964
+ var setIndeterminate = useCallback(function () { return setStatus('indeterminate'); }, []);
965
+ var toggleCheckbox = useCallback(function () { return setStatus(function (status) { return (status === 'unchecked' ? 'checked' : 'unchecked'); }); }, []);
966
+ return {
967
+ status: status,
968
+ value: value,
969
+ setCheck: setCheck,
970
+ setUncheck: setUncheck,
971
+ setIndeterminate: setIndeterminate,
972
+ toggleCheckbox: toggleCheckbox,
973
+ };
974
+ };
975
+
976
+ var StyledChipWrapper = styled.div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n border-radius: 100px;\n display: inline-flex;\n align-items: center;\n font-size: 14px;\n line-height: 1em;\n white-space: nowrap;\n padding: 5px ", ";\n\n ", "\n\n ", "\n"], ["\n border-radius: 100px;\n display: inline-flex;\n align-items: center;\n font-size: 14px;\n line-height: 1em;\n white-space: nowrap;\n padding: 5px ", ";\n\n ",
977
+ "\n\n ",
978
+ "\n"])), spacing.xs, function (_a) {
979
+ var palette = _a.theme.palette;
980
+ return css(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), palette.grey[100], palette.black[100]);
981
+ }, function (_a) {
982
+ var statusEdit = _a.statusEdit, palette = _a.theme.palette;
983
+ if (statusEdit) {
984
+ return css(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n &:active {\n background-color: ", ";\n }\n "], ["\n &:hover {\n background-color: ", ";\n }\n &:active {\n background-color: ", ";\n }\n "])), palette.grey[200], palette.grey[300]);
985
+ }
986
+ return undefined;
987
+ });
988
+ var StyledIcon$2 = styled(Icon)(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n cursor: pointer;\n margin-left: ", ";\n &:hover {\n cursor: pointer;\n }\n"], ["\n cursor: pointer;\n margin-left: ", ";\n &:hover {\n cursor: pointer;\n }\n"])), spacing.xs);
989
+ var templateObject_1$c, templateObject_2$3, templateObject_3$2, templateObject_4$1;
990
+
991
+ var UnstyledChip = /** @class */ (function (_super) {
992
+ __extends(UnstyledChip, _super);
993
+ function UnstyledChip() {
994
+ return _super !== null && _super.apply(this, arguments) || this;
995
+ }
996
+ UnstyledChip.prototype.render = function () {
997
+ var _a = this.props, closeAction = _a.closeAction, statusEdit = _a.statusEdit, text = _a.text;
998
+ return (React.createElement(React.Fragment, null,
999
+ text,
1000
+ ' ',
1001
+ statusEdit ? (React.createElement("div", null,
1002
+ React.createElement(StyledIcon$2, { icon: faTimes, onClick: function () {
1003
+ closeAction ? closeAction() : null;
1004
+ } }))) : null));
1005
+ };
1006
+ return UnstyledChip;
1007
+ }(Component));
1008
+ var Chip = function (props) { return (React.createElement(StyledChipWrapper, __assign({}, props),
1009
+ React.createElement(UnstyledChip, __assign({}, props)))); };
1010
+
1011
+ var showHandler = function (show) {
1012
+ return show
1013
+ ? css(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n transform: translateX(0);\n "], ["\n transform: translateX(0);\n "]))) : undefined;
1014
+ };
1015
+ var templateObject_1$d;
1016
+
1017
+ var StyledDrawerWrapper = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n ", "\n"], ["\n ",
1018
+ "\n"])), function (_a) {
1019
+ var show = _a.show, palette = _a.theme.palette;
1020
+ return css(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n .drawer {\n position: fixed;\n right: 0;\n top: 0;\n height: 100vh;\n width: 500px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px 0 0 8px;\n transform: translateX(110%);\n transition: transform 0.4s ease-in-out;\n z-index: 5;\n background-color: ", ";\n display: flex;\n flex-direction: column;\n\n ", "\n\n .drawer__header {\n padding-right: calc(", " + ", ");\n padding-left: ", ";\n display: flex;\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n\n .drawer__header__title {\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n display: flex;\n align-items: center;\n height: calc(", " + ", ");\n }\n\n .drawer__header__actions {\n position: absolute;\n right: ", ";\n top: ", ";\n font-size: 24px;\n }\n }\n\n .drawer__body {\n height: 100%;\n overflow-y: scroll;\n }\n\n .drawer__footer {\n height: 80px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding: 0 ", ";\n border-top: 1px solid ", ";\n }\n }\n "], ["\n .drawer {\n position: fixed;\n right: 0;\n top: 0;\n height: 100vh;\n width: 500px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px 0 0 8px;\n transform: translateX(110%);\n transition: transform 0.4s ease-in-out;\n z-index: 5;\n background-color: ", ";\n display: flex;\n flex-direction: column;\n\n ", "\n\n .drawer__header {\n padding-right: calc(", " + ", ");\n padding-left: ", ";\n display: flex;\n align-items: center;\n background-color: ", ";\n border-bottom: 1px solid ", ";\n\n .drawer__header__title {\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n display: flex;\n align-items: center;\n height: calc(", " + ", ");\n }\n\n .drawer__header__actions {\n position: absolute;\n right: ", ";\n top: ", ";\n font-size: 24px;\n }\n }\n\n .drawer__body {\n height: 100%;\n overflow-y: scroll;\n }\n\n .drawer__footer {\n height: 80px;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding: 0 ", ";\n border-top: 1px solid ", ";\n }\n }\n "])), palette.white[100], showHandler(show), spacing.xxxl, spacing.m, spacing.l, palette.grey[50], palette.grey[100], spacing.xxxl, spacing.m, spacing.l, spacing.l, spacing.l, palette.grey[100]);
1021
+ });
1022
+ var StyledIcon$3 = styled(Icon)(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n cursor: pointer;\n &:hover {\n color: ", ";\n"], ["\n cursor: pointer;\n &:hover {\n color: ", ";\n"])), function (_a) {
1023
+ var palette = _a.theme.palette;
1024
+ return palette.grey[800];
1025
+ });
1026
+ var templateObject_1$e, templateObject_2$4, templateObject_3$3;
1027
+
1028
+ var UnstyledDrawer = /** @class */ (function (_super) {
1029
+ __extends(UnstyledDrawer, _super);
1030
+ function UnstyledDrawer(props) {
1031
+ var _this = _super.call(this, props) || this;
1032
+ _this.state = {};
1033
+ return _this;
1034
+ }
1035
+ UnstyledDrawer.prototype.render = function () {
1036
+ var _a = this.props, actionClose = _a.actionClose, renderFooter = _a.renderFooter, renderHeader = _a.renderHeader, title = _a.title;
1037
+ return (React.createElement("div", { className: 'drawer' },
1038
+ React.createElement("div", { className: 'drawer__header' },
1039
+ renderHeader ? renderHeader() : React.createElement("div", { className: 'drawer__header__title' }, title),
1040
+ React.createElement("div", { className: 'drawer__header__actions' },
1041
+ React.createElement("span", { onClick: actionClose },
1042
+ React.createElement(StyledIcon$3, { icon: faTimes })))),
1043
+ React.createElement("div", { className: 'drawer__body' }, this.props.children),
1044
+ renderFooter ? React.createElement("div", { className: 'drawer__footer' }, renderFooter()) : null));
1045
+ };
1046
+ return UnstyledDrawer;
1047
+ }(Component));
1048
+ var Drawer = function (props) { return (React.createElement(StyledDrawerWrapper, __assign({}, props),
1049
+ React.createElement(UnstyledDrawer, __assign({}, props)))); };
1050
+
1051
+ var getDropdownItemStyles = function (_a) {
1052
+ var theme = _a.theme, isDisabled = _a.isDisabled, active = _a.active, hasAction = _a.hasAction, _b = _a.type, type = _b === void 0 ? 'default' : _b;
1053
+ var typeStyle = theme.components.dropdown.items.notActive[type];
1054
+ var activeStyle = theme.components.dropdown.items.active;
1055
+ var _c = active ? activeStyle : typeStyle, background = _c.background, color = _c.color, hoverBackground = _c.hoverBackground;
1056
+ var opacity = isDisabled ? 0.5 : 1;
1057
+ var cursor = hasAction ? 'pointer' : 'default';
1058
+ return {
1059
+ opacity: opacity,
1060
+ background: background,
1061
+ color: color,
1062
+ cursor: cursor,
1063
+ hoverBackground: hoverBackground,
1064
+ };
1065
+ };
1066
+
1067
+ var ShortcutText = styled.span(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n background-color: transparent;\n color: ", ";\n padding: 0 2px 0 2px;\n white-space: nowrap;\n font-size: 12px;\n"], ["\n background-color: transparent;\n color: ", ";\n padding: 0 2px 0 2px;\n white-space: nowrap;\n font-size: 12px;\n"])), function (_a) {
1068
+ var theme = _a.theme;
1069
+ return theme.palette.grey[500];
1070
+ });
1071
+ var templateObject_1$f;
1072
+
1073
+ var Item = function (_a) {
1074
+ var active = _a.active, className = _a.className, icon = _a.icon, onClick = _a.onClick, shortcut = _a.shortcut, text = _a.text, isDisabled = _a.isDisabled, rest = __rest(_a, ["active", "className", "icon", "onClick", "shortcut", "text", "isDisabled"]);
1075
+ var handleClick = useCallback(function (e) { return !isDisabled && (onClick === null || onClick === void 0 ? void 0 : onClick(e)); }, [isDisabled, onClick]);
1076
+ return (React.createElement(StyledItem, __assign({ className: className || '', onClick: handleClick, active: !!active, hasAction: !!onClick, isDisabled: isDisabled }, rest),
1077
+ React.createElement(InnerWrapper, null,
1078
+ icon && React.createElement(Icon, __assign({}, icon)),
1079
+ React.createElement(TextWrapper, null, text),
1080
+ shortcut && React.createElement(ShortcutText, null, shortcut))));
1081
+ };
1082
+ var hasActionCss = css(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n"], ["\n &:hover {\n background-color: ", ";\n }\n"])), function (_a) {
1083
+ var theme = _a.theme;
1084
+ return theme.palette.grey[100];
1085
+ });
1086
+ var StyledItem = styled.div.attrs(getDropdownItemStyles)(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n text-align: left;\n line-height: 21px !important;\n padding: 5px 16px;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n\n opacity: ", ";\n color: ", ";\n background-color: ", ";\n cursor: ", ";\n\n ", ";\n"], ["\n text-align: left;\n line-height: 21px !important;\n padding: 5px 16px;\n font-size: 14px;\n font-style: normal;\n font-weight: normal;\n\n opacity: ", ";\n color: ", ";\n background-color: ", ";\n cursor: ", ";\n\n ", ";\n"])), function (_a) {
1087
+ var opacity = _a.opacity;
1088
+ return opacity;
1089
+ }, function (_a) {
1090
+ var color = _a.color;
1091
+ return color;
1092
+ }, function (_a) {
1093
+ var background = _a.background;
1094
+ return background;
1095
+ }, function (_a) {
1096
+ var cursor = _a.cursor;
1097
+ return cursor;
1098
+ }, function (_a) {
1099
+ var hasAction = _a.hasAction;
1100
+ return (hasAction ? hasActionCss : null);
1101
+ });
1102
+ var InnerWrapper = styled.div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n\n & > * {\n display: inline;\n }\n\n & > svg {\n margin-right: 10px;\n }\n"], ["\n display: flex;\n align-items: center;\n\n & > * {\n display: inline;\n }\n\n & > svg {\n margin-right: 10px;\n }\n"])));
1103
+ var TextWrapper = styled.div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1 1 auto;\n"], ["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex: 1 1 auto;\n"])));
1104
+ var templateObject_1$g, templateObject_2$5, templateObject_3$4, templateObject_4$2;
1105
+
1106
+ var StyledDiv = styled.div(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n margin: 8px 0 8px 0;\n display: block;\n height: 1px;\n border: 0;\n border-top: 1px solid ", ";\n padding: 0;\n cursor: initial;\n"], ["\n margin: 8px 0 8px 0;\n display: block;\n height: 1px;\n border: 0;\n border-top: 1px solid ", ";\n padding: 0;\n cursor: initial;\n"])), function (_a) {
1107
+ var theme = _a.theme;
1108
+ return theme.palette.grey[100];
1109
+ });
1110
+ var Separator = function () { return React.createElement(StyledDiv, null); };
1111
+ var templateObject_1$h;
1112
+
1113
+ var Title = function (props) { return React.createElement(StyledTitle, null, props.text); };
1114
+ var StyledTitle = styled.div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n cursor: initial;\n text-align: left;\n padding: 4px 16px;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-transform: uppercase;\n color: ", ";\n"], ["\n cursor: initial;\n text-align: left;\n padding: 4px 16px;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-transform: uppercase;\n color: ", ";\n"])), function (_a) {
1115
+ var theme = _a.theme;
1116
+ return theme.palette.grey[700];
1117
+ });
1118
+ var templateObject_1$i;
1119
+
1120
+ var UserListItem = function (props) {
1121
+ var avatarSize = props.avatarSize, img = props.img, noText = props.noText, onClick = props.onClick, placeholder = props.placeholder, renderText = props.renderText, text = props.text;
1122
+ var initials = useMemo(function () {
1123
+ if (text) {
1124
+ return text
1125
+ .split(' ')
1126
+ .map(function (w) { return w[0]; })
1127
+ .join('');
1128
+ }
1129
+ return undefined;
1130
+ }, [text]);
1131
+ return (React.createElement(UserListWrapper, { clickable: !!onClick, onClick: onClick },
1132
+ React.createElement(Avatar, { image: img, placeholder: placeholder, size: avatarSize || 's', initials: initials }),
1133
+ React.createElement(NameWrapper, null, renderText ? renderText : text ? text : noText)));
1134
+ };
1135
+ var UserListWrapper = styled.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n ", ";\n\n display: flex;\n padding: 4px 16px;\n align-items: center;\n"], ["\n ",
1136
+ ";\n\n display: flex;\n padding: 4px 16px;\n align-items: center;\n"])), function (_a) {
1137
+ var clickable = _a.clickable;
1138
+ return clickable && css(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n cursor: pointer;\n }\n "], ["\n &:hover {\n background-color: ", ";\n cursor: pointer;\n }\n "])), function (_a) {
1139
+ var theme = _a.theme;
1140
+ return theme.palette.grey[100];
1141
+ });
1142
+ });
1143
+ var NameWrapper = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n width: 50px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle;\n flex-grow: 1;\n padding-left: 10px;\n"], ["\n width: 50px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle;\n flex-grow: 1;\n padding-left: 10px;\n"])));
1144
+ var templateObject_1$j, templateObject_2$6, templateObject_3$5;
1145
+
1146
+ var DefaultDropdown = function (_a) {
1147
+ var closeDropdown = _a.closeDropdown, content = _a.content, fullWidth = _a.fullWidth, maxWidth = _a.maxWidth;
1148
+ var mappedItems = useMemo(function () {
1149
+ return content.map(function (_a, id) {
1150
+ var onClick = _a.onClick, rest = __rest(_a, ["onClick"]);
1151
+ return (React.createElement(Item, __assign({ fullWidth: fullWidth, maxWidth: maxWidth, key: id, onClick: function (e) {
1152
+ e.stopPropagation();
1153
+ onClick === null || onClick === void 0 ? void 0 : onClick(e);
1154
+ closeDropdown();
1155
+ } }, rest)));
1156
+ });
1157
+ }, [closeDropdown, content, fullWidth, maxWidth]);
1158
+ return React.createElement(React.Fragment, null, mappedItems);
1159
+ };
1160
+
1161
+ var DefaultTrigger = function (_a) {
1162
+ var title = _a.title;
1163
+ return React.createElement(Button, { text: title, iconRight: { icon: faChevronDown } });
1164
+ };
1165
+
1166
+ var DropdownImpl = function (props) {
1167
+ var className = props.className, content = props.content, fullWidth = props.fullWidth, maxWidth = props.maxWidth, _a = props.minWidthAsTrigger, minWidthAsTrigger = _a === void 0 ? false : _a, _b = props.placement, placement = _b === void 0 ? 'bottom-start' : _b, renderContent = props.renderContent, renderTrigger = props.renderTrigger, triggerStyles = props.triggerStyles, title = props.title, _c = props.forceOpen, forceOpen = _c === void 0 ? false : _c;
1168
+ var _d = useState(false), isOpen = _d[0], setIsOpen = _d[1];
1169
+ var toggleDropdown = useCallback(function (e) {
1170
+ setIsOpen(function (isOpen) { return !isOpen; });
1171
+ e.stopPropagation();
1172
+ }, []);
1173
+ var closeDropdown = useCallback(function () { return setIsOpen(false); }, []);
1174
+ useEffect(function () {
1175
+ setIsOpen(forceOpen);
1176
+ }, [forceOpen]);
1177
+ // Close Dropdown on click outside
1178
+ var wrapperRef = useRef(null);
1179
+ useClickAway(wrapperRef, function () { return closeDropdown(); });
1180
+ var popperRef = useRef(null);
1181
+ var buttonRef = useRef(null);
1182
+ var _e = useState(null), arrowRef = _e[0], setArrowRef = _e[1];
1183
+ var _f = usePopper(buttonRef.current, popperRef.current, {
1184
+ placement: placement,
1185
+ strategy: 'fixed',
1186
+ modifiers: useMemo(function () { return [
1187
+ {
1188
+ name: 'arrow',
1189
+ options: {
1190
+ element: arrowRef,
1191
+ },
1192
+ },
1193
+ {
1194
+ name: 'offset',
1195
+ enabled: true,
1196
+ options: {
1197
+ offset: [0, 4],
1198
+ },
1199
+ },
1200
+ {
1201
+ name: 'minWidthAsTrigger',
1202
+ enabled: minWidthAsTrigger,
1203
+ phase: 'beforeWrite',
1204
+ requires: ['computeStyles'],
1205
+ fn: function (_a) {
1206
+ var state = _a.state;
1207
+ state.styles.popper.minWidth = state.rects.reference.width + "px";
1208
+ },
1209
+ effect: function (_a) {
1210
+ var state = _a.state;
1211
+ var width = state.elements.reference.getBoundingClientRect().width;
1212
+ state.elements.popper.style.minWidth = width + "px";
1213
+ },
1214
+ },
1215
+ ]; }, [minWidthAsTrigger, arrowRef]),
1216
+ }), attributes = _f.attributes, styles = _f.styles;
1217
+ return (React.createElement(Wrapper$3, { className: className, ref: wrapperRef },
1218
+ React.createElement("div", { style: triggerStyles, ref: buttonRef, onClick: toggleDropdown },
1219
+ title && React.createElement(DefaultTrigger, { title: title }),
1220
+ !title && renderTrigger && renderTrigger()),
1221
+ React.createElement(CSSTransition, { in: forceOpen || isOpen, timeout: 200, unmountOnExit: true, appear: true },
1222
+ React.createElement(BodyAnimationWrapper, null,
1223
+ React.createElement(PopperContainer, __assign({ ref: popperRef, style: styles.popper }, attributes.popper),
1224
+ React.createElement("div", { ref: setArrowRef, style: styles.arrow }),
1225
+ React.createElement("div", { style: styles.offset }, content ? (React.createElement(DefaultWrapper, { fullWidth: fullWidth, maxWidth: maxWidth },
1226
+ React.createElement(DefaultDropdown, { content: content, fullWidth: fullWidth, maxWidth: maxWidth, closeDropdown: closeDropdown }))) : (React.createElement(CustomWrapper, { maxWidth: maxWidth }, renderContent === null || renderContent === void 0 ? void 0 : renderContent(closeDropdown)))))))));
1227
+ };
1228
+ var Wrapper$3 = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
1229
+ var DefaultWrapper = styled.div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n ", ";\n"], ["\n ",
1230
+ ";\n"])), function (_a) {
1231
+ var fullWidth = _a.fullWidth, maxWidth = _a.maxWidth;
1232
+ return maxWidth
1233
+ ? css(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n max-width: ", ";\n "], ["\n max-width: ", ";\n "])), maxWidth) : css(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), fullWidth ? 'auto' : '200px');
1234
+ });
1235
+ var CustomWrapper = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n ", "\n"], ["\n ",
1236
+ "\n"])), function (_a) {
1237
+ var maxWidth = _a.maxWidth;
1238
+ return maxWidth && css(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n max-width: ", ";\n "], ["\n max-width: ", ";\n "])), maxWidth);
1239
+ });
1240
+ var PopperContainer = styled.div(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n overflow-y: hidden;\n padding: 8px 0;\n color: ", ";\n background-color: ", ";\n border-radius: 3px;\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n z-index: 9;\n"], ["\n overflow-y: hidden;\n padding: 8px 0;\n color: ", ";\n background-color: ", ";\n border-radius: 3px;\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n z-index: 9;\n"])), function (_a) {
1241
+ var theme = _a.theme;
1242
+ return theme.palette.grey[900];
1243
+ }, function (_a) {
1244
+ var theme = _a.theme;
1245
+ return theme.palette.white[100];
1246
+ });
1247
+ var BodyAnimationWrapper = styled.div(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"], ["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"])));
1248
+ var templateObject_1$k, templateObject_2$7, templateObject_3$6, templateObject_4$3, templateObject_5$1, templateObject_6$1, templateObject_7$1, templateObject_8$1;
1249
+
1250
+ var Dropdown = /** @class */ (function (_super) {
1251
+ __extends(Dropdown, _super);
1252
+ function Dropdown() {
1253
+ return _super !== null && _super.apply(this, arguments) || this;
1254
+ }
1255
+ Dropdown.prototype.render = function () {
1256
+ return React.createElement(DropdownImpl, __assign({}, this.props));
1257
+ };
1258
+ Dropdown.Item = Item;
1259
+ Dropdown.Title = function (localProps) { return Title(localProps); };
1260
+ Dropdown.Separator = Separator;
1261
+ Dropdown.UserListItem = UserListItem;
1262
+ return Dropdown;
1263
+ }(Component));
1264
+
1265
+ var dropdownPalette = {
1266
+ items: {
1267
+ active: {
1268
+ color: defaultPalette.black[100],
1269
+ background: defaultPalette.blue[50],
1270
+ hoverBackground: defaultPalette.grey[100],
1271
+ },
1272
+ notActive: {
1273
+ default: {
1274
+ color: defaultPalette.black[100],
1275
+ background: 'transparent',
1276
+ hoverBackground: defaultPalette.grey[100],
1277
+ },
1278
+ danger: {
1279
+ color: defaultPalette.red[500],
1280
+ background: 'transparent',
1281
+ hoverBackground: defaultPalette.red[50],
1282
+ },
1283
+ success: {
1284
+ color: defaultPalette.green[500],
1285
+ background: 'transparent',
1286
+ hoverBackground: defaultPalette.green[50],
1287
+ },
1288
+ warning: {
1289
+ color: defaultPalette.yellow[500],
1290
+ background: 'transparent',
1291
+ hoverBackground: defaultPalette.yellow[50],
1292
+ },
1293
+ link: {
1294
+ color: defaultPalette.blue[500],
1295
+ background: 'transparent',
1296
+ hoverBackground: defaultPalette.blue[50],
1297
+ },
1298
+ },
1299
+ },
1300
+ };
1301
+
1302
+ var sizeSetter = function (size) {
1303
+ switch (size) {
1304
+ case 'small':
1305
+ return css(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n height: 16px;\n min-width: 16px;\n top: 3px;\n right: 3px;\n "], ["\n height: 16px;\n min-width: 16px;\n top: 3px;\n right: 3px;\n "])));
1306
+ case 'large':
1307
+ return css(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n height: 23px;\n min-width: 23px;\n top: -1px;\n right: -1px;\n "], ["\n height: 23px;\n min-width: 23px;\n top: -1px;\n right: -1px;\n "])));
1308
+ case 'medium':
1309
+ default:
1310
+ return css(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n height: 20px;\n min-width: 20px;\n top: 1px;\n right: 1px;\n "], ["\n height: 20px;\n min-width: 20px;\n top: 1px;\n right: 1px;\n "])));
1311
+ }
1312
+ };
1313
+ var fontSetter = function (size) {
1314
+ switch (size) {
1315
+ case 'small':
1316
+ return css(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n font-size: 12px;\n line-height: 15px;\n "], ["\n font-size: 12px;\n line-height: 15px;\n "])));
1317
+ case 'large':
1318
+ return css(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n font-size: 14px;\n line-height: 20px;\n "], ["\n font-size: 14px;\n line-height: 20px;\n "])));
1319
+ case 'medium':
1320
+ default:
1321
+ return css(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n font-size: 12px;\n line-height: 18px;\n "], ["\n font-size: 12px;\n line-height: 18px;\n "])));
1322
+ }
1323
+ };
1324
+ var FloatingBadge = styled.span(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n background-color: #de350b;\n border-radius: 12px;\n position: absolute;\n ", ";\n top: ", ";\n right: ", ";\n\n &:after {\n content: '", "';\n color: white;\n white-space: nowrap;\n\n font-style: normal;\n font-weight: 500;\n ", ";\n\n position: static;\n margin: 1px 2px;\n display: block;\n text-align: center;\n }\n"], ["\n background-color: #de350b;\n border-radius: 12px;\n position: absolute;\n ", ";\n top: ", ";\n right: ", ";\n\n &:after {\n content: '", "';\n color: white;\n white-space: nowrap;\n\n font-style: normal;\n font-weight: 500;\n ", ";\n\n position: static;\n margin: 1px 2px;\n display: block;\n text-align: center;\n }\n"])), function (_a) {
1325
+ var size = _a.size;
1326
+ return sizeSetter(size);
1327
+ }, function (_a) {
1328
+ var top = _a.top;
1329
+ return (top !== undefined ? top + "px" : undefined);
1330
+ }, function (_a) {
1331
+ var right = _a.right;
1332
+ return (right !== undefined ? right + "px" : undefined);
1333
+ }, function (_a) {
1334
+ var counter = _a.counter;
1335
+ return counter;
1336
+ }, function (_a) {
1337
+ var size = _a.size;
1338
+ return fontSetter(size);
1339
+ });
1340
+ var templateObject_1$l, templateObject_2$8, templateObject_3$7, templateObject_4$4, templateObject_5$2, templateObject_6$2, templateObject_7$2;
1341
+
1342
+ var WithBadge = function (props) {
1343
+ var children = props.children, rest = __rest(props, ["children"]);
1344
+ return (React.createElement(WithBadgeWrapper, null,
1345
+ children,
1346
+ !rest.isDisabled && React.createElement(FloatingBadge, __assign({}, rest))));
1347
+ };
1348
+ var WithBadgeWrapper = styled.div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n display: inline-block;\n position: relative;\n"], ["\n display: inline-block;\n position: relative;\n"])));
1349
+ var templateObject_1$m;
1350
+
1351
+ var InputHelper = function (_a) {
1352
+ var status = _a.status, message = _a.message, icon = _a.icon;
1353
+ return (React.createElement(Wrapper$4, { status: status },
1354
+ icon && React.createElement(StyledIcon$4, __assign({}, icon)),
1355
+ message));
1356
+ };
1357
+ var StyledIcon$4 = styled(Icon)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n margin-top: 2px;\n"], ["\n margin-top: 2px;\n"])));
1358
+ var Wrapper$4 = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n color: ", ";\n background: ", ";\n border-radius: 4px;\n\n padding: 4px 8px;\n\n display: flex;\n align-items: flex-start;\n gap: 8px;\n\n font-size: 12px;\n line-height: 18px;\n\n ", " {\n color: ", ";\n }\n"], ["\n color: ", ";\n background: ", ";\n border-radius: 4px;\n\n padding: 4px 8px;\n\n display: flex;\n align-items: flex-start;\n gap: 8px;\n\n font-size: 12px;\n line-height: 18px;\n\n ", " {\n color: ", ";\n }\n"])), function (_a) {
1359
+ var theme = _a.theme, status = _a.status;
1360
+ return theme.components.inputHelper[status].color;
1361
+ }, function (_a) {
1362
+ var theme = _a.theme, status = _a.status;
1363
+ return theme.components.inputHelper[status].background;
1364
+ }, StyledIcon$4, function (_a) {
1365
+ var theme = _a.theme, status = _a.status;
1366
+ return theme.components.inputHelper[status].color;
1367
+ });
1368
+ var templateObject_1$n, templateObject_2$9;
1369
+
1370
+ var inputHelperPalette = {
1371
+ normal: {
1372
+ color: defaultPalette.black[100],
1373
+ background: defaultPalette.grey[100],
1374
+ },
1375
+ error: {
1376
+ color: defaultPalette.red[900],
1377
+ background: defaultPalette.red[50],
1378
+ },
1379
+ warning: {
1380
+ color: defaultPalette.yellow[900],
1381
+ background: defaultPalette.yellow[50],
1382
+ },
1383
+ info: {
1384
+ color: defaultPalette.blue[900],
1385
+ background: defaultPalette.blue[50],
1386
+ },
1387
+ success: {
1388
+ color: defaultPalette.green[900],
1389
+ background: defaultPalette.green[50],
1390
+ },
1391
+ };
1392
+
1393
+ var ComplexInputWrapper = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"], ["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"])));
1394
+ var templateObject_1$o;
1395
+
1396
+ var inputTextHTMLLabelBootstrapFixes = css(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"], ["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"])));
1397
+ var templateObject_1$p;
1398
+
1399
+ var Label$1 = function (_a) {
1400
+ var label = _a.label, isDisabled = _a.isDisabled, required = _a.required;
1401
+ if (!label) {
1402
+ return null;
1403
+ }
1404
+ return (React.createElement(Wrapper$5, { isDisabled: isDisabled, required: required }, label));
1405
+ };
1406
+ var requiredCss = css(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n &:after {\n color: ", ";\n content: '*';\n display: inline;\n }\n"], ["\n &:after {\n color: ", ";\n content: '*';\n display: inline;\n }\n"])), function (_a) {
1407
+ var theme = _a.theme;
1408
+ return theme.palette.red[500];
1409
+ });
1410
+ var Wrapper$5 = styled.label(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n font-size: 12px;\n line-height: 18px;\n\n color: ", ";\n ", "\n\n /* Bootstrap Fixes */\n ", "\n"], ["\n font-size: 12px;\n line-height: 18px;\n\n color: ", ";\n ", "\n\n /* Bootstrap Fixes */\n ", "\n"])), function (_a) {
1411
+ var palette = _a.theme.palette, isDisabled = _a.isDisabled;
1412
+ return (isDisabled ? palette.grey[300] : palette.black[100]);
1413
+ }, function (_a) {
1414
+ var required = _a.required;
1415
+ return required && requiredCss;
1416
+ }, inputTextHTMLLabelBootstrapFixes);
1417
+ var templateObject_1$q, templateObject_2$a;
1418
+
1419
+ var boxedInputWrapperStyle = css(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n background: ", ";\n color: ", ";\n border: 1px solid ", ";\n\n border-radius: 4px;\n\n transition: box-shadow 0.3s ease-in-out;\n\n &:focus-within {\n ", "\n }\n"], ["\n background: ", ";\n color: ", ";\n border: 1px solid ", ";\n\n border-radius: 4px;\n\n transition: box-shadow 0.3s ease-in-out;\n\n &:focus-within {\n ",
1420
+ "\n }\n"])), function (_a) {
1421
+ var background = _a.background;
1422
+ return background;
1423
+ }, function (_a) {
1424
+ var color = _a.color;
1425
+ return color;
1426
+ }, function (_a) {
1427
+ var borderColor = _a.borderColor;
1428
+ return borderColor;
1429
+ }, function (_a) {
1430
+ var status = _a.status, normalFocused = _a.normalFocused, borderColor = _a.borderColor;
1431
+ return status === 'normal'
1432
+ ? css(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n box-shadow: 0 0 0 3px ", ";\n border-color: ", ";\n "], ["\n box-shadow: 0 0 0 3px ", ";\n border-color: ", ";\n "])), normalFocused.borderColor + '85', normalFocused.borderColor) : css(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n box-shadow: 0 0 0 3px ", ";\n "], ["\n box-shadow: 0 0 0 3px ", ";\n "])), borderColor + '85');
1433
+ });
1434
+ var templateObject_1$r, templateObject_2$b, templateObject_3$8;
1435
+
1436
+ var warningIcon = {
1437
+ icon: faExclamationTriangle,
1438
+ fixedWidth: true,
1439
+ };
1440
+ var errorIcon = {
1441
+ icon: faTimesCircle,
1442
+ fixedWidth: true,
1443
+ };
1444
+ var successIcon = {
1445
+ icon: faCheckCircle,
1446
+ fixedWidth: true,
1447
+ };
1448
+ var iconMap = {
1449
+ normal: undefined,
1450
+ warning: warningIcon,
1451
+ error: errorIcon,
1452
+ success: successIcon,
1453
+ };
1454
+ var StatusIcon = function (_a) {
1455
+ var status = _a.status;
1456
+ var icon = iconMap[status];
1457
+ if (!icon) {
1458
+ return null;
1459
+ }
1460
+ return React.createElement(StyledIcon$5, __assign({}, icon, { status: status }));
1461
+ };
1462
+ var StyledIcon$5 = styled(Icon)(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
1463
+ var theme = _a.theme, status = _a.status;
1464
+ return theme.components.inputText[status].iconColor;
1465
+ });
1466
+ var templateObject_1$s;
1467
+
1468
+ var inputTextHTMLInputBootstrapFixes = css(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n font-weight: 400 !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n font-size: 14px !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n height: ", "px !important;\n padding: 1px 2px !important;\n margin: 0 !important;\n color: black !important;\n"], ["\n font-weight: 400 !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n font-size: 14px !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n height: ", "px !important;\n padding: 1px 2px !important;\n margin: 0 !important;\n color: black !important;\n"])), function (_a) {
1469
+ var inputSize = _a.inputSize;
1470
+ return (inputSize === 'large' ? 40 : 30);
1471
+ });
1472
+ var templateObject_1$t;
1473
+
1474
+ var StyledInput = styled.input(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n\n height: ", "px;\n\n border: 0;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n ", "\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"], ["\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n\n height: ", "px;\n\n border: 0;\n width: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n ",
1475
+ "\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"])), function (_a) {
1476
+ var inputSize = _a.inputSize;
1477
+ return (inputSize === 'large' ? 40 : 30);
1478
+ }, function (_a) {
1479
+ var theme = _a.theme;
1480
+ return theme.palette.grey[200];
1481
+ }, function (_a) {
1482
+ var type = _a.type;
1483
+ return type === 'password' && css(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n letter-spacing: 1px;\n "], ["\n letter-spacing: 1px;\n "])));
1484
+ }, inputTextHTMLInputBootstrapFixes);
1485
+ var templateObject_1$u, templateObject_2$c;
1486
+
1487
+ var getInputTextStyles = function (_a) {
1488
+ var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
1489
+ var actualStatus = isDisabled ? 'disabled' : status;
1490
+ var styles = theme.components.inputText[actualStatus];
1491
+ return __assign(__assign({}, styles), { normalFocused: theme.components.inputText['normalFocused'] });
1492
+ };
1493
+
1494
+ var InputElement = function (_a) {
1495
+ var autoFocus = _a.autoFocus, onBlur = _a.onBlur, onChange = _a.onChange, _b = _a.value, value = _b === void 0 ? '' : _b, _c = _a.placeholder, placeholder = _c === void 0 ? '' : _c, isDisabled = _a.isDisabled, name = _a.name, inputSize = _a.inputSize, leadingIcon = _a.leadingIcon, onKeyPress = _a.onKeyPress, _d = _a.status, status = _d === void 0 ? 'normal' : _d, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, inputType = _a.inputType, onFocus = _a.onFocus, className = _a.className, actionIcon = _a.actionIcon, setValue = _a.setValue;
1496
+ var ref = useRef(null);
1497
+ var onClick = useCallback(function () { var _a; return (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
1498
+ var actualValue = (value === null || value === void 0 ? void 0 : value.toString()) || '';
1499
+ var handleChange = useCallback(function (e) {
1500
+ setValue === null || setValue === void 0 ? void 0 : setValue(e.currentTarget.value);
1501
+ onChange === null || onChange === void 0 ? void 0 : onChange(e);
1502
+ }, [onChange, setValue]);
1503
+ var handleBlur = useCallback(function (e) {
1504
+ setValue === null || setValue === void 0 ? void 0 : setValue(e.target.value.trim());
1505
+ onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
1506
+ }, [onBlur, setValue]);
1507
+ return (React.createElement(Wrapper$6, { onClick: onClick, isDisabled: isDisabled, status: status, className: className },
1508
+ leadingIcon && React.createElement(InputIcon, __assign({}, leadingIcon, { isDisabled: isDisabled })),
1509
+ React.createElement(StyledInput, { ref: ref, type: inputType, autoFocus: autoFocus, value: actualValue, placeholder: "" + placeholder, disabled: isDisabled, name: name, inputSize: inputSize, onChange: handleChange, onFocus: onFocus, onBlur: handleBlur, onKeyPress: onKeyPress, onKeyDown: onKeyDown, onKeyUp: onKeyUp }),
1510
+ React.createElement(StatusIcon, { status: status }),
1511
+ actionIcon && React.createElement(InputIcon, __assign({}, actionIcon, { isDisabled: isDisabled }))));
1512
+ };
1513
+ var Wrapper$6 = styled.div.attrs(getInputTextStyles)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n ", ";\n\n display: flex;\n justify-content: space-evenly;\n align-items: center;\n gap: 8px;\n padding: 0 8px;\n"], ["\n ", ";\n\n display: flex;\n justify-content: space-evenly;\n align-items: center;\n gap: 8px;\n padding: 0 8px;\n"])), boxedInputWrapperStyle);
1514
+ var InputIcon = styled(Icon)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n color: ", ";\n font-size: 14px;\n"], ["\n color: ", ";\n font-size: 14px;\n"])), function (_a) {
1515
+ var theme = _a.theme;
1516
+ return theme.palette.black[100];
1517
+ });
1518
+ var templateObject_1$v, templateObject_2$d;
1519
+
1520
+ var InputText = function (props) {
1521
+ var label = props.label, className = props.className, inputProps = __rest(props, ["label", "className"]);
1522
+ var isDisabled = props.isDisabled, required = props.required, helper = props.helper;
1523
+ return (React.createElement(ComplexInputWrapper, { className: className },
1524
+ React.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
1525
+ React.createElement(InputElement, __assign({}, inputProps)),
1526
+ helper && React.createElement(InputHelper, __assign({}, helper))));
1527
+ };
1528
+
1529
+ var inputTextPalette = {
1530
+ normal: {
1531
+ background: defaultPalette.white[100],
1532
+ color: defaultPalette.black[100],
1533
+ iconColor: defaultPalette.black[100],
1534
+ borderColor: defaultPalette.grey[500],
1535
+ },
1536
+ normalFocused: {
1537
+ background: defaultPalette.white[100],
1538
+ color: defaultPalette.black[100],
1539
+ borderColor: defaultPalette.blue[300],
1540
+ },
1541
+ success: {
1542
+ background: defaultPalette.green[50],
1543
+ color: defaultPalette.black[100],
1544
+ iconColor: defaultPalette.green[900],
1545
+ borderColor: defaultPalette.green[300],
1546
+ },
1547
+ warning: {
1548
+ background: defaultPalette.yellow[50],
1549
+ color: defaultPalette.black[100],
1550
+ iconColor: defaultPalette.yellow[900],
1551
+ borderColor: defaultPalette.yellow[300],
1552
+ },
1553
+ error: {
1554
+ background: defaultPalette.red[50],
1555
+ color: defaultPalette.black[100],
1556
+ iconColor: defaultPalette.red[900],
1557
+ borderColor: defaultPalette.red[300],
1558
+ },
1559
+ disabled: {
1560
+ background: defaultPalette.grey[100],
1561
+ color: defaultPalette.black[16],
1562
+ iconColor: defaultPalette.black[16],
1563
+ borderColor: 'transparent',
1564
+ },
1565
+ };
1566
+
1567
+ var useSelectValue = function (initialValue) { return useState(initialValue); };
1568
+ var useSelectMultiValues = function (initialValue) {
1569
+ return useState(initialValue);
1570
+ };
1571
+
1572
+ var ClearIndicator = function (_a) {
1573
+ var isDisabled = _a.isDisabled, clearValue = _a.clearValue;
1574
+ var onClick = useCallback(function () { return !isDisabled && clearValue(); }, [clearValue, isDisabled]);
1575
+ return React.createElement(CaretIcon, { icon: faTimes$1, onClick: onClick });
1576
+ };
1577
+ var CaretIcon = styled(Icon)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n margin: 0.5em;\n"], ["\n margin: 0.5em;\n"])));
1578
+ var templateObject_1$w;
1579
+
1580
+ var Control = function (_a) {
1581
+ var onMouseDown = _a.innerProps.onMouseDown, children = _a.children;
1582
+ return React.createElement(Wrapper$7, { onMouseDown: onMouseDown }, children);
1583
+ };
1584
+ var Wrapper$7 = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"], ["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"])));
1585
+ var templateObject_1$x;
1586
+
1587
+ var DropdownIndicator = function (_a) {
1588
+ var selectProps = _a.selectProps;
1589
+ return (React.createElement(Wrapper$8, { isRotated: selectProps.menuIsOpen },
1590
+ React.createElement(Icon, { icon: faCaretDown })));
1591
+ };
1592
+ var Wrapper$8 = styled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(", "deg);\n"], ["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(", "deg);\n"])), function (_a) {
1593
+ var isRotated = _a.isRotated;
1594
+ return (isRotated ? 180 : 0);
1595
+ });
1596
+ var templateObject_1$y;
1597
+
1598
+ var FooterActions = function (_a) {
1599
+ var actions = _a.actions, triggerClose = _a.triggerClose;
1600
+ var mappedActions = useMemo(function () {
1601
+ return actions.map(function (_a, id) {
1602
+ var onClick = _a.onClick, closeOnClick = _a.closeOnClick, rest = __rest(_a, ["onClick", "closeOnClick"]);
1603
+ return (React.createElement(FooterItem, __assign({ key: id, onClick: function (e) {
1604
+ e.stopPropagation();
1605
+ onClick === null || onClick === void 0 ? void 0 : onClick(e);
1606
+ closeOnClick && triggerClose();
1607
+ } }, rest)));
1608
+ });
1609
+ }, [actions]);
1610
+ return React.createElement(Wrapper$9, null, mappedActions);
1611
+ };
1612
+ var Wrapper$9 = styled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n border-top: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n"])), function (_a) {
1613
+ var theme = _a.theme;
1614
+ return theme.palette.grey[100];
1615
+ });
1616
+ var FooterItem = styled(Item)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n padding: 5px 10px;\n"], ["\n padding: 5px 10px;\n"])));
1617
+ var templateObject_1$z, templateObject_2$e;
1618
+
1619
+ var MenuList = function (props) {
1620
+ var setValue = props.setValue, getValue = props.getValue, selectProps = props.selectProps;
1621
+ var children = props.children, rest = __rest(props, ["children"]);
1622
+ var footerActions = selectProps === null || selectProps === void 0 ? void 0 : selectProps.footerActions;
1623
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
1624
+ // @ts-ignore
1625
+ var triggerClose = useCallback(function () { return setValue(getValue(), 'select-option'); }, [getValue, setValue]);
1626
+ return (React.createElement(Wrapper$a, null,
1627
+ React.createElement(components$1.MenuList, __assign({}, rest),
1628
+ children,
1629
+ footerActions && React.createElement(FooterActions, { actions: footerActions, triggerClose: triggerClose }))));
1630
+ };
1631
+ var Wrapper$a = styled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject([""], [""])));
1632
+ var templateObject_1$A;
1633
+
1634
+ var Option = function (_a) {
1635
+ var onClick = _a.innerProps.onClick, _b = _a.data, label = _b.label, icon = _b.icon;
1636
+ return (React.createElement(Wrapper$b, { onClick: onClick },
1637
+ icon && React.createElement(Icon, __assign({}, icon)),
1638
+ React.createElement("div", null, label)));
1639
+ };
1640
+ var Wrapper$b = styled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ", ";\n }\n"], ["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ", ";\n }\n"])), function (_a) {
1641
+ var theme = _a.theme;
1642
+ return theme.palette.grey[100];
1643
+ });
1644
+ var templateObject_1$B;
1645
+
1646
+ var Placeholder = function (_a) {
1647
+ var children = _a.children;
1648
+ return (React.createElement(Wrapper$c, null, children));
1649
+ };
1650
+ var Wrapper$c = styled.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n font-size: 14px;\n color: ", ";\n"], ["\n font-size: 14px;\n color: ", ";\n"])), function (_a) {
1651
+ var theme = _a.theme;
1652
+ return theme.palette.grey[200];
1653
+ });
1654
+ var templateObject_1$C;
1655
+
1656
+ var getCustomComponents = function () { return ({
1657
+ Option: Option,
1658
+ DropdownIndicator: DropdownIndicator,
1659
+ ClearIndicator: ClearIndicator,
1660
+ Placeholder: Placeholder,
1661
+ Control: Control,
1662
+ MenuList: MenuList,
1663
+ }); };
1664
+
1665
+ var getSelectStyles = function (_a) {
1666
+ var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
1667
+ var actualStatus = isDisabled ? 'disabled' : status;
1668
+ var styles = theme.components.select[actualStatus];
1669
+ return __assign(__assign({}, styles), { normalFocused: theme.components.select['normalFocused'] });
1670
+ };
1671
+
1672
+ var useSelectThemeStyles = function (_a) {
1673
+ var status = _a.status, isDisabled = _a.isDisabled;
1674
+ var theme = useTheme();
1675
+ var color = getSelectStyles({ theme: theme, status: status, isDisabled: isDisabled }).color;
1676
+ return {
1677
+ singleValue: function (provided) { return (__assign(__assign({}, provided), { color: color, fontSize: '14px' })); },
1678
+ noOptionsMessage: function (base) { return (__assign(__assign({}, base), { fontSize: '14px' })); },
1679
+ valueContainer: function (base) { return (__assign(__assign({}, base), { padding: '0 8px' })); },
1680
+ };
1681
+ };
1682
+
1683
+ var selectBootstrapFixes = css(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n input {\n margin-bottom: 0 !important;\n box-shadow: none !important;\n }\n"], ["\n input {\n margin-bottom: 0 !important;\n box-shadow: none !important;\n }\n"])));
1684
+ var templateObject_1$D;
1685
+
1686
+ var SelectWrapper = styled.span.attrs(getSelectStyles)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n & > div:first-child {\n ", ";\n & > div:nth-child(2) {\n height: ", "px;\n min-height: ", "px;\n }\n }\n\n ", "\n"], ["\n & > div:first-child {\n ", ";\n & > div:nth-child(2) {\n height: ", "px;\n min-height: ", "px;\n }\n }\n\n ", "\n"])), boxedInputWrapperStyle, function (_a) {
1687
+ var inputSize = _a.inputSize;
1688
+ return (inputSize === 'large' ? 40 : 30);
1689
+ }, function (_a) {
1690
+ var inputSize = _a.inputSize;
1691
+ return (inputSize === 'large' ? 40 : 30);
1692
+ }, selectBootstrapFixes);
1693
+ var templateObject_1$E;
1694
+
1695
+ var SelectsWrapper = function (_a) {
1696
+ var children = _a.children, rest = __rest(_a, ["children"]);
1697
+ var label = rest.label, isDisabled = rest.isDisabled, required = rest.required, helper = rest.helper, _b = rest.status, status = _b === void 0 ? 'normal' : _b, inputSize = rest.inputSize;
1698
+ return (React.createElement(ComplexInputWrapper, null,
1699
+ React.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
1700
+ React.createElement(SelectWrapper, { isDisabled: isDisabled, status: status, inputSize: inputSize }, children),
1701
+ helper && React.createElement(InputHelper, __assign({}, helper))));
1702
+ };
1703
+ var Select = function (props) {
1704
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1705
+ var styles = useSelectThemeStyles({ status: status });
1706
+ var customComponents = useMemo(function () { return (__assign(__assign({}, getCustomComponents()), components)); }, [components]);
1707
+ return (React.createElement(SelectsWrapper, __assign({}, props),
1708
+ React.createElement(ReactSelect, __assign({}, props, { components: customComponents, backspaceRemoves: true, styles: styles }))));
1709
+ };
1710
+ var CreatableSelect = function (props) {
1711
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1712
+ var styles = useSelectThemeStyles({ status: status });
1713
+ var customComponents = useMemo(function () { return (__assign(__assign({}, getCustomComponents()), components)); }, [components]);
1714
+ return (React.createElement(SelectsWrapper, __assign({}, props),
1715
+ React.createElement(Creatable, __assign({}, props, { components: customComponents, backspaceRemoves: true, styles: styles }))));
1716
+ };
1717
+ var AsyncSelect = function (props) {
1718
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1719
+ var styles = useSelectThemeStyles({ status: status });
1720
+ var customComponents = useMemo(function () { return (__assign(__assign({}, getCustomComponents()), components)); }, [components]);
1721
+ return (React.createElement(SelectsWrapper, __assign({}, props),
1722
+ React.createElement(Async, __assign({}, props, { components: customComponents, backspaceRemoves: true, styles: styles }))));
1723
+ };
1724
+ var AsyncCreatableSelect = function (props) {
1725
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1726
+ var styles = useSelectThemeStyles({ status: status });
1727
+ var customComponents = useMemo(function () { return (__assign(__assign({}, getCustomComponents()), components)); }, [components]);
1728
+ return (React.createElement(SelectsWrapper, __assign({}, props),
1729
+ React.createElement(AsyncCreatable, __assign({}, props, { components: customComponents, backspaceRemoves: true, styles: styles }))));
1730
+ };
1731
+
1732
+ var selectPalette = {
1733
+ normal: {
1734
+ background: defaultPalette.white[100],
1735
+ color: defaultPalette.black[100],
1736
+ iconColor: defaultPalette.black[100],
1737
+ borderColor: defaultPalette.grey[500],
1738
+ },
1739
+ normalFocused: {
1740
+ background: defaultPalette.white[100],
1741
+ color: defaultPalette.black[100],
1742
+ iconColor: defaultPalette.black[100],
1743
+ borderColor: defaultPalette.blue[300],
1744
+ },
1745
+ success: {
1746
+ background: defaultPalette.green[50],
1747
+ color: defaultPalette.black[100],
1748
+ iconColor: defaultPalette.green[900],
1749
+ borderColor: defaultPalette.green[300],
1750
+ },
1751
+ warning: {
1752
+ background: defaultPalette.yellow[50],
1753
+ color: defaultPalette.black[100],
1754
+ iconColor: defaultPalette.yellow[900],
1755
+ borderColor: defaultPalette.yellow[300],
1756
+ },
1757
+ error: {
1758
+ background: defaultPalette.red[50],
1759
+ color: defaultPalette.black[100],
1760
+ iconColor: defaultPalette.red[900],
1761
+ borderColor: defaultPalette.red[300],
1762
+ },
1763
+ disabled: {
1764
+ background: defaultPalette.grey[100],
1765
+ color: defaultPalette.black[16],
1766
+ iconColor: defaultPalette.black[16],
1767
+ borderColor: 'transparent',
1768
+ },
1769
+ };
1770
+
1771
+ var CharCounter = function (_a) {
1772
+ var length = _a.length, maxLength = _a.maxLength;
1773
+ return (React.createElement(Wrapper$d, null,
1774
+ length,
1775
+ maxLength && "/" + maxLength));
1776
+ };
1777
+ var Wrapper$d = styled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n text-align: right;\n color: ", ";\n padding: 0.3em;\n"], ["\n text-align: right;\n color: ", ";\n padding: 0.3em;\n"])), function (_a) {
1778
+ var theme = _a.theme;
1779
+ return theme.palette.grey[500];
1780
+ });
1781
+ var templateObject_1$F;
1782
+
1783
+ var inputTextHTMLTextAreaBootstrapFixes = css(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px 0 0 8px !important;\n height: 100% !important;\n"], ["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px 0 0 8px !important;\n height: 100% !important;\n"])));
1784
+ var templateObject_1$G;
1785
+
1786
+ var StyledTextArea = styled.textarea(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n resize: none;\n\n margin: 0;\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n border: 0;\n padding: 8px 0 0 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"], ["\n resize: none;\n\n margin: 0;\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n border: 0;\n padding: 8px 0 0 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"])), function (_a) {
1787
+ var theme = _a.theme;
1788
+ return theme.palette.grey[200];
1789
+ }, inputTextHTMLTextAreaBootstrapFixes);
1790
+ var templateObject_1$H;
1791
+
1792
+ var getTextAreaStyles = function (_a) {
1793
+ var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
1794
+ var actualStatus = isDisabled ? 'disabled' : status;
1795
+ var styles = theme.components.textArea[actualStatus];
1796
+ return __assign(__assign({}, styles), { normalFocused: theme.components.textArea['normalFocused'] });
1797
+ };
1798
+
1799
+ var TextAreaElement = function (_a) {
1800
+ var autoFocus = _a.autoFocus, onBlur = _a.onBlur, onChange = _a.onChange, _b = _a.value, value = _b === void 0 ? '' : _b, placeholder = _a.placeholder, isDisabled = _a.isDisabled, name = _a.name, onKeyPress = _a.onKeyPress, _c = _a.status, status = _c === void 0 ? 'normal' : _c, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, onFocus = _a.onFocus, className = _a.className, setValue = _a.setValue, _d = _a.initialHeight, initialHeight = _d === void 0 ? '10rem' : _d, maxLength = _a.maxLength, _e = _a.isResizable, isResizable = _e === void 0 ? false : _e, _f = _a.showCounter, showCounter = _f === void 0 ? false : _f;
1801
+ var ref = useRef(null);
1802
+ var onClick = useCallback(function () { var _a; return (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
1803
+ var actualValue = (value === null || value === void 0 ? void 0 : value.toString()) || '';
1804
+ var handleChange = useCallback(function (e) {
1805
+ setValue === null || setValue === void 0 ? void 0 : setValue(e.currentTarget.value.slice(0, maxLength || Infinity));
1806
+ onChange === null || onChange === void 0 ? void 0 : onChange(e);
1807
+ }, [maxLength, onChange, setValue]);
1808
+ useEffect(function () {
1809
+ setValue === null || setValue === void 0 ? void 0 : setValue(value === null || value === void 0 ? void 0 : value.slice(0, maxLength || Infinity));
1810
+ }, [maxLength, setValue, value]);
1811
+ var handleBlur = useCallback(function (e) {
1812
+ setValue === null || setValue === void 0 ? void 0 : setValue(e.target.value.trim());
1813
+ onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
1814
+ }, [onBlur, setValue]);
1815
+ return (React.createElement(Wrapper$e, { onClick: onClick, isDisabled: isDisabled, status: status, className: className, initialHeight: initialHeight, isResizable: isResizable },
1816
+ React.createElement(FlexWrapper, null,
1817
+ React.createElement(StyledTextArea, { ref: ref, autoFocus: autoFocus, value: actualValue, placeholder: placeholder, disabled: isDisabled, name: name, onChange: handleChange, onFocus: onFocus, onBlur: handleBlur, onKeyPress: onKeyPress, onKeyDown: onKeyDown, onKeyUp: onKeyUp }),
1818
+ (showCounter || maxLength) && React.createElement(CharCounter, { length: actualValue.length, maxLength: maxLength }))));
1819
+ };
1820
+ var FlexWrapper = styled.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n height: 100%;\n"], ["\n display: flex;\n flex-flow: column;\n height: 100%;\n"])));
1821
+ var Wrapper$e = styled.div.attrs(getTextAreaStyles)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n ", ";\n\n resize: ", ";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ", ";\n"], ["\n ", ";\n\n resize: ", ";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ", ";\n"])), boxedInputWrapperStyle, function (_a) {
1822
+ var isResizable = _a.isResizable;
1823
+ return (isResizable ? 'vertical' : 'none');
1824
+ }, function (_a) {
1825
+ var initialHeight = _a.initialHeight;
1826
+ return initialHeight;
1827
+ });
1828
+ var templateObject_1$I, templateObject_2$f;
1829
+
1830
+ var TextArea = function (props) {
1831
+ var label = props.label, className = props.className, inputProps = __rest(props, ["label", "className"]);
1832
+ var isDisabled = props.isDisabled, required = props.required, helper = props.helper;
1833
+ return (React.createElement(ComplexInputWrapper, { className: className },
1834
+ React.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
1835
+ React.createElement(TextAreaElement, __assign({}, inputProps)),
1836
+ helper && React.createElement(InputHelper, __assign({}, helper))));
1837
+ };
1838
+
1839
+ var textAreaPalette = {
1840
+ normal: {
1841
+ background: defaultPalette.white[100],
1842
+ color: defaultPalette.black[100],
1843
+ borderColor: defaultPalette.grey[500],
1844
+ },
1845
+ normalFocused: {
1846
+ background: defaultPalette.white[100],
1847
+ color: defaultPalette.black[100],
1848
+ borderColor: defaultPalette.blue[300],
1849
+ },
1850
+ success: {
1851
+ background: defaultPalette.green[50],
1852
+ color: defaultPalette.black[100],
1853
+ borderColor: defaultPalette.green[300],
1854
+ },
1855
+ warning: {
1856
+ background: defaultPalette.yellow[50],
1857
+ color: defaultPalette.black[100],
1858
+ borderColor: defaultPalette.yellow[300],
1859
+ },
1860
+ error: {
1861
+ background: defaultPalette.red[50],
1862
+ color: defaultPalette.black[100],
1863
+ borderColor: defaultPalette.red[300],
1864
+ },
1865
+ disabled: {
1866
+ background: defaultPalette.grey[100],
1867
+ color: defaultPalette.black[16],
1868
+ borderColor: 'transparent',
1869
+ },
1870
+ };
1871
+
1872
+ var ItemElement = function (props) {
1873
+ var action = props.action, active = props.active, icon = props.icon, index = props.index, mouseBlockedProps = props.mouseBlockedProps, navigable = props.navigable, onClick = props.onClick, onMouseHover = props.onMouseHover, onMouseOut = props.onMouseOut, placeholder = props.placeholder, showActionOnHover = props.showActionOnHover, title = props.title, wrapperRef = props.wrapperRef;
1874
+ var mouseBlocked = mouseBlockedProps.mouseBlocked, setMouseBlocked = mouseBlockedProps.setMouseBlocked;
1875
+ var elemRef = useRef(null);
1876
+ var handleKeyDown = useCallback(function (e) {
1877
+ var _a;
1878
+ if (navigable) {
1879
+ setMouseBlocked(true);
1880
+ if (e.key === 'Enter') {
1881
+ e.preventDefault();
1882
+ (_a = elemRef.current) === null || _a === void 0 ? void 0 : _a.click();
1883
+ }
1884
+ if (['ArrowUp', 'ArrowDown'].includes(e.key)) {
1885
+ e.preventDefault();
1886
+ var allItems = document.querySelectorAll("[data-grouped-list-item]");
1887
+ var targetSelector = e.key === 'ArrowUp' ? "[data-grouped-list-item='" + (index - 1) + "']" : "[data-grouped-list-item='" + (index + 1) + "']";
1888
+ var possibleTarget = document.querySelector(targetSelector);
1889
+ var target = void 0;
1890
+ if (possibleTarget) {
1891
+ target = possibleTarget;
1892
+ }
1893
+ else if (e.key === 'ArrowUp') {
1894
+ target = allItems[allItems.length - 1];
1895
+ }
1896
+ else {
1897
+ target = document.querySelector("[data-grouped-list-item='1']");
1898
+ }
1899
+ if (wrapperRef.current) {
1900
+ var wrapper = wrapperRef.current;
1901
+ if (e.key === 'ArrowUp') {
1902
+ if (target.offsetTop <= wrapper.scrollTop) {
1903
+ wrapper.scrollTop = target.offsetTop;
1904
+ }
1905
+ }
1906
+ else {
1907
+ if (target.offsetTop - (wrapper.offsetHeight - target.offsetHeight) >= wrapper.scrollTop) {
1908
+ wrapper.scrollTop = target.offsetTop - (wrapper.offsetHeight - target.offsetHeight);
1909
+ }
1910
+ }
1911
+ target.focus();
1912
+ }
1913
+ }
1914
+ }
1915
+ }, [navigable, setMouseBlocked, index, wrapperRef]);
1916
+ var avoidOutOfBoundFocus = useCallback(function () {
1917
+ var _a;
1918
+ var elem = elemRef.current;
1919
+ var wrapper = wrapperRef.current;
1920
+ if (elem && wrapper) {
1921
+ if (elem.offsetTop < wrapper.offsetHeight + wrapper.scrollTop &&
1922
+ elem.offsetTop + elem.offsetHeight > wrapper.scrollTop) {
1923
+ (_a = elemRef.current) === null || _a === void 0 ? void 0 : _a.focus();
1924
+ }
1925
+ }
1926
+ }, [wrapperRef]);
1927
+ var handleMouseOver = useCallback(function () {
1928
+ if (!(navigable && mouseBlocked)) {
1929
+ onMouseHover === null || onMouseHover === void 0 ? void 0 : onMouseHover();
1930
+ avoidOutOfBoundFocus();
1931
+ }
1932
+ }, [avoidOutOfBoundFocus, mouseBlocked, navigable, onMouseHover]);
1933
+ var handleMouseLeave = useCallback(function () {
1934
+ var _a;
1935
+ if (!(navigable && mouseBlocked)) {
1936
+ onMouseOut === null || onMouseOut === void 0 ? void 0 : onMouseOut();
1937
+ (_a = elemRef.current) === null || _a === void 0 ? void 0 : _a.blur();
1938
+ }
1939
+ }, [mouseBlocked, navigable, onMouseOut]);
1940
+ useEffect(function () { return function () { return removeEventListener('keydown', handleKeyDown); }; }, [handleKeyDown]);
1941
+ return (React.createElement(SingleElement, { ref: elemRef, tabIndex: onClick ? 0 : -1, onClick: onClick, active: active, key: title, onMouseLeave: handleMouseLeave, onMouseOver: handleMouseOver, onFocus: function () {
1942
+ addEventListener('keydown', handleKeyDown);
1943
+ }, onBlur: function () {
1944
+ removeEventListener('keydown', handleKeyDown);
1945
+ }, showActionOnHover: showActionOnHover, "data-grouped-list-item": index },
1946
+ icon && React.createElement(LeftIcon$1, __assign({}, icon, { fixedWidth: true })),
1947
+ title ? React.createElement(Title$1, null, title) : React.createElement(Placeholder$1, null, placeholder),
1948
+ action && React.createElement(RightElement, null, action)));
1949
+ };
1950
+ var Title$1 = styled.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"], ["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"])));
1951
+ var Placeholder$1 = styled(Title$1)(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
1952
+ var theme = _a.theme;
1953
+ return theme.palette.grey[500];
1954
+ });
1955
+ var LeftIcon$1 = styled(Icon)(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n margin-right: 8px;\n display: inline-flex;\n align-self: center;\n"], ["\n margin-right: 8px;\n display: inline-flex;\n align-self: center;\n"])));
1956
+ var RightElement = styled.div(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject([""], [""])));
1957
+ var SingleElement = styled.div(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n &:focus {\n outline: none !important;\n background-color: ", ";\n color: ", ";\n cursor: ", ";\n }\n\n color: ", ";\n font-weight: ", ";\n\n line-height: 32px;\n height: 32px;\n left: 0;\n display: flex;\n\n ", ";\n"], ["\n &:focus {\n outline: none !important;\n background-color: ", ";\n color: ", ";\n cursor: ", ";\n }\n\n color: ", ";\n font-weight: ", ";\n\n line-height: 32px;\n height: 32px;\n left: 0;\n display: flex;\n\n ",
1958
+ ";\n"])), function (_a) {
1959
+ var theme = _a.theme;
1960
+ return theme.palette.blue[50];
1961
+ }, function (_a) {
1962
+ var theme = _a.theme;
1963
+ return theme.palette.blue[500];
1964
+ }, function (_a) {
1965
+ var onClick = _a.onClick;
1966
+ return (onClick ? 'pointer' : 'initial');
1967
+ }, function (_a) {
1968
+ var active = _a.active, theme = _a.theme;
1969
+ return (active ? theme.palette.blue[500] : 'initial');
1970
+ }, function (_a) {
1971
+ var active = _a.active;
1972
+ return (active ? 500 : 'initial');
1973
+ }, function (_a) {
1974
+ var showActionOnHover = _a.showActionOnHover;
1975
+ return showActionOnHover
1976
+ ? css(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n ", " {\n display: none;\n }\n\n &:focus {\n ", " {\n display: inherit;\n }\n }\n "], ["\n ", " {\n display: none;\n }\n\n &:focus {\n ", " {\n display: inherit;\n }\n }\n "])), RightElement, RightElement) : css(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject([""], [""])));
1977
+ });
1978
+ var templateObject_1$J, templateObject_2$g, templateObject_3$9, templateObject_4$5, templateObject_5$3, templateObject_6$3, templateObject_7$3;
1979
+
1980
+ var TitleElement = function (props) {
1981
+ var noResults = props.noResults, title = props.title;
1982
+ return (React.createElement(TitleElementWrapper, { noResults: noResults, key: title },
1983
+ title.toUpperCase(),
1984
+ noResults && React.createElement(NoResultsWrapper, null, "(nessun risultato)")));
1985
+ };
1986
+ var TitleElementWrapper = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ", ";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ", ";\n font-weight: 500;\n cursor: initial;\n"], ["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ",
1987
+ ";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ", ";\n font-weight: 500;\n cursor: initial;\n"])), function (_a) {
1988
+ var noResults = _a.noResults, theme = _a.theme;
1989
+ return noResults === true
1990
+ ? css(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), theme.palette.grey[50]) : undefined;
1991
+ }, function (_a) {
1992
+ var theme = _a.theme;
1993
+ return theme.palette.grey[700];
1994
+ });
1995
+ var NoResultsWrapper = styled.span(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n margin-left: 3px;\n color: ", ";\n font-weight: 400;\n font-size: 13px;\n"], ["\n margin-left: 3px;\n color: ", ";\n font-weight: 400;\n font-size: 13px;\n"])), function (_a) {
1996
+ var theme = _a.theme;
1997
+ return theme.palette.grey[700];
1998
+ });
1999
+ var templateObject_1$K, templateObject_2$h, templateObject_3$a;
2000
+
2001
+ var GroupElement = function (_a) {
2002
+ var index = _a.index, items = _a.items, title = _a.title, rest = __rest(_a, ["index", "items", "title"]);
2003
+ return (React.createElement(React.Fragment, null,
2004
+ React.createElement(TitleElement, { title: title, noResults: !items.length }),
2005
+ items.map(function (item, idx) { return (React.createElement(ItemElement, __assign({ key: idx, index: index + idx }, item, rest))); })));
2006
+ };
2007
+
2008
+ var GroupedList = function (props) {
2009
+ var className = props.className, groups = props.groups, navigable = props.navigable, placeholder = props.placeholder, wrapperStyle = props.wrapperStyle;
2010
+ var _a = useState(false), mouseBlocked = _a[0], setMouseBlocked = _a[1];
2011
+ // The elements indices will range from 1 to n
2012
+ var itemsNumber = useMemo(function () { return groups.reduce(function (sum, g) { return sum + g.items.length; }, 0); }, [groups]);
2013
+ var handleKeyDown = useCallback(function (e) {
2014
+ var _a, _b, _c, _d;
2015
+ var alreadySelected = (_b = (_a = document.activeElement) === null || _a === void 0 ? void 0 : _a.dataset) === null || _b === void 0 ? void 0 : _b.groupedListItem;
2016
+ if (navigable && !alreadySelected && ['ArrowUp', 'ArrowDown'].includes(e.key)) {
2017
+ e.preventDefault();
2018
+ e.key === 'ArrowUp'
2019
+ ? (_c = document.querySelector("div[data-grouped-list-item='" + itemsNumber + "']")) === null || _c === void 0 ? void 0 : _c.focus() : (_d = document.querySelector("div[data-grouped-list-item='1']")) === null || _d === void 0 ? void 0 : _d.focus();
2020
+ setMouseBlocked(true);
2021
+ }
2022
+ }, [itemsNumber, navigable]);
2023
+ var unlockMouse = function (e) {
2024
+ var target = e.target;
2025
+ var item = target === null || target === void 0 ? void 0 : target.closest('[data-grouped-list-item]');
2026
+ item === null || item === void 0 ? void 0 : item.focus();
2027
+ setMouseBlocked(false);
2028
+ };
2029
+ useEffect(function () {
2030
+ if (mouseBlocked) {
2031
+ removeEventListener('keydown', handleKeyDown);
2032
+ addEventListener('mousemove', unlockMouse);
2033
+ }
2034
+ else {
2035
+ addEventListener('keydown', handleKeyDown);
2036
+ removeEventListener('mousemove', unlockMouse);
2037
+ }
2038
+ return function () {
2039
+ removeEventListener('keydown', handleKeyDown);
2040
+ removeEventListener('mousemove', unlockMouse);
2041
+ };
2042
+ }, [handleKeyDown, mouseBlocked]);
2043
+ var mouseBlockedProps = useMemo(function () { return ({
2044
+ mouseBlocked: mouseBlocked,
2045
+ setMouseBlocked: setMouseBlocked,
2046
+ }); }, [mouseBlocked, setMouseBlocked]);
2047
+ var wrapperRef = useRef(null);
2048
+ var i = 1;
2049
+ return (React.createElement(Wrapper$f, { style: wrapperStyle, ref: wrapperRef, className: className }, groups.map(function (group, index) {
2050
+ var oldI = i;
2051
+ i += group.items.length;
2052
+ return (React.createElement(GroupElement, __assign({ key: index }, group, { mouseBlockedProps: mouseBlockedProps, navigable: navigable, index: oldI, wrapperRef: wrapperRef, placeholder: placeholder })));
2053
+ })));
2054
+ };
2055
+ var Wrapper$f = styled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
2056
+ var templateObject_1$L;
2057
+
2058
+ var Label$2 = styled.span(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ", "\n"], ["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ",
2059
+ "\n"])), function (_a) {
2060
+ var isDisabled = _a.isDisabled, palette = _a.theme.palette;
2061
+ return isDisabled && css(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n color: ", ";\n cursor: not-allowed;\n "], ["\n color: ", ";\n cursor: not-allowed;\n "])), palette.grey[500]);
2062
+ });
2063
+ var templateObject_1$M, templateObject_2$i;
2064
+
2065
+ var Radio = styled.span(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ", "\n ", "\n ", "\n"], ["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ",
2066
+ "\n ",
2067
+ "\n ",
2068
+ "\n"])), function (_a) {
2069
+ var theme = _a.theme;
2070
+ return css(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n "], ["\n background-color: ", ";\n border: 1px solid ", ";\n "])), theme.palette.white[100], theme.palette.grey[500]);
2071
+ }, function (_a) {
2072
+ var isChecked = _a.isChecked, theme = _a.theme;
2073
+ return isChecked && css(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n border: 5px solid ", ";\n "], ["\n border: 5px solid ", ";\n "])), theme.palette.blue[500]);
2074
+ }, function (_a) {
2075
+ var isChecked = _a.isChecked, isDisabled = _a.isDisabled, theme = _a.theme;
2076
+ return isDisabled && css(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n cursor: not-allowed;\n ", "\n "], ["\n background-color: ", ";\n border-color: ", ";\n cursor: not-allowed;\n ",
2077
+ "\n "])), theme.palette.grey[100], theme.palette.grey[100], isChecked && css(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n "], ["\n background-color: ", ";\n border-color: ", ";\n "])), theme.palette.white[100], theme.palette.grey['50']));
2078
+ });
2079
+ var templateObject_1$N, templateObject_2$j, templateObject_3$b, templateObject_4$6, templateObject_5$4;
2080
+
2081
+ var WrapperRadioButton = function (props) {
2082
+ var isChecked = props.isChecked, isDisabled = props.isDisabled, label = props.label;
2083
+ return (React.createElement("div", { className: props.className, onClick: function () { return (!props.isDisabled ? props.onClick() : undefined); } }, props.renderOption ? (props.renderOption({ isDisabled: isDisabled, isChecked: isChecked, label: label })) : (React.createElement(React.Fragment, null,
2084
+ React.createElement(Radio, { isChecked: props.isChecked, isDisabled: props.isDisabled }),
2085
+ React.createElement(Label$2, { isDisabled: props.isDisabled }, props.label)))));
2086
+ };
2087
+ var Wrapper$g = styled(WrapperRadioButton)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n & + & {\n margin-top: ", "px;\n }\n ", "\n"], ["\n & + & {\n margin-top: ", "px;\n }\n ",
2088
+ "\n"])), function (props) { return (props.optionsSpacing ? props.optionsSpacing : 0); }, function (props) {
2089
+ return props.inline && css(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "], ["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "])));
2090
+ });
2091
+ var RadioButton = function (props) {
2092
+ return React.createElement(Wrapper$g, __assign({}, props));
2093
+ };
2094
+ var templateObject_1$O, templateObject_2$k;
2095
+
2096
+ var RadioButtonGroup = function (props) { return (React.createElement("div", { style: props.style }, props.options.map(function (o) { return (React.createElement(RadioButton, { key: o.key, label: o.label, onClick: function () {
2097
+ if (props.onClick) {
2098
+ props.onClick(o);
2099
+ }
2100
+ }, isChecked: props.value === o.key, isDisabled: props.isDisabled, renderOption: props.renderOption, optionsSpacing: props.optionsSpacing, inline: props.inline })); }))); };
2101
+
2102
+ var colorSetter = function (type, theme) {
2103
+ switch (type) {
2104
+ case 'standard': {
2105
+ return css(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.grey[100], theme.palette.black[100]);
2106
+ }
2107
+ case 'info': {
2108
+ return css(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.blue[50], theme.palette.blue[500]);
2109
+ }
2110
+ case 'error': {
2111
+ return css(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.red[50], theme.palette.red[500]);
2112
+ }
2113
+ case 'warning': {
2114
+ return css(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.yellow[50], theme.palette.yellow[500]);
2115
+ }
2116
+ case 'success': {
2117
+ return css(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.green[50], theme.palette.green[500]);
2118
+ }
2119
+ default: {
2120
+ return css(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.grey[100], theme.palette.black[100]);
2121
+ }
2122
+ }
2123
+ };
2124
+ var StyledIconTitle = styled.div(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n margin-top: 0;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n margin-bottom: ", ";\n"], ["\n margin-top: 0;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n margin-bottom: ", ";\n"])), spacing.xxs);
2125
+ var StyledContent = styled.div(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n font-weight: normal;\n font-size: 12px;\n line-height: 18px;\n"], ["\n font-weight: normal;\n font-size: 12px;\n line-height: 18px;\n"])));
2126
+ var spacingSetter = function (size) {
2127
+ switch (size) {
2128
+ case 'medium':
2129
+ return css(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n padding: ", ";\n "], ["\n padding: ", ";\n "])), spacing.s);
2130
+ case 'large':
2131
+ return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n padding: ", ";\n ", " {\n font-size: 16px;\n line-height: 18px;\n margin-bottom: ", ";\n }\n ", " {\n font-size: 14px;\n line-height: 21px;\n }\n "], ["\n padding: ", ";\n ", " {\n font-size: 16px;\n line-height: 18px;\n margin-bottom: ", ";\n }\n ", " {\n font-size: 14px;\n line-height: 21px;\n }\n "])), spacing.m, StyledIconTitle, spacing.xs, StyledContent);
2132
+ default:
2133
+ return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n padding: ", ";\n "], ["\n padding: ", ";\n "])), spacing.m);
2134
+ }
2135
+ };
2136
+ var StyledInlineMessageWrapper = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ",
2137
+ "\n"])), function (_a) {
2138
+ var size = _a.size, theme = _a.theme, type = _a.type;
2139
+ return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n display: flex;\n border: 1px solid rgba(51, 51, 51, 0.08);\n border-radius: 4px;\n color: ", ";\n\n ", "\n\n ", "\n "], ["\n display: flex;\n border: 1px solid rgba(51, 51, 51, 0.08);\n border-radius: 4px;\n color: ", ";\n\n ", "\n\n ", "\n "])), theme.palette.black[100], colorSetter(type, theme), spacingSetter(size));
2140
+ });
2141
+ var StyledIconContent = styled.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n margin-left: ", ";\n width: 100%;\n"], ["\n margin-left: ", ";\n width: 100%;\n"])), function (_a) {
2142
+ var margin = _a.margin;
2143
+ return (margin ? spacing.s : '0px');
2144
+ });
2145
+ var StyledCloseIconWrapper = styled.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n line-height: 20px;\n"], ["\n line-height: 20px;\n"])));
2146
+ var StyledCloseIcon = styled(Icon)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n cursor: pointer;\n color: ", ";\n"], ["\n cursor: pointer;\n color: ", ";\n"])), function (_a) {
2147
+ var palette = _a.theme.palette;
2148
+ return palette.blue[700];
2149
+ });
2150
+ var templateObject_1$P, templateObject_2$l, templateObject_3$c, templateObject_4$7, templateObject_5$5, templateObject_6$4, templateObject_7$4, templateObject_8$2, templateObject_9$1, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16;
2151
+
2152
+ var defaultCloseIcon = {
2153
+ icon: faTimes,
2154
+ };
2155
+ var UnstyledInlineMessage = function (props) {
2156
+ var _a, _b, _c, _d, _e, _f, _g, _h;
2157
+ var closeIcon = props.closeIcon, content = props.content, icon = props.icon, onClose = props.onClose, renderCloseIcon = props.renderCloseIcon, renderContent = props.renderContent, renderIcon = props.renderIcon, renderTitle = props.renderTitle, title = props.title;
2158
+ var titleComp = renderTitle ? renderTitle() : title;
2159
+ return (React.createElement(React.Fragment, null,
2160
+ React.createElement("div", { style: (_b = (_a = props === null || props === void 0 ? void 0 : props.componentStyle) === null || _a === void 0 ? void 0 : _a.icon) !== null && _b !== void 0 ? _b : {} }, renderIcon ? renderIcon() : icon ? React.createElement(Icon, __assign({}, icon)) : null),
2161
+ React.createElement(StyledIconContent, { style: (_d = (_c = props === null || props === void 0 ? void 0 : props.componentStyle) === null || _c === void 0 ? void 0 : _c.contentWrapper) !== null && _d !== void 0 ? _d : {}, margin: renderIcon !== undefined || icon !== undefined },
2162
+ titleComp ? React.createElement(StyledIconTitle, { style: (_f = (_e = props === null || props === void 0 ? void 0 : props.componentStyle) === null || _e === void 0 ? void 0 : _e.title) !== null && _f !== void 0 ? _f : {} }, titleComp) : null,
2163
+ React.createElement(StyledContent, { style: (_h = (_g = props === null || props === void 0 ? void 0 : props.componentStyle) === null || _g === void 0 ? void 0 : _g.content) !== null && _h !== void 0 ? _h : {} }, renderContent ? renderContent() : content)),
2164
+ onClose && (React.createElement(StyledCloseIconWrapper, { onClick: onClose }, renderCloseIcon ? renderCloseIcon() : React.createElement(StyledCloseIcon, __assign({}, (closeIcon || defaultCloseIcon), { fixedWidth: true }))))));
2165
+ };
2166
+ var InlineMessage = function (props) {
2167
+ var _a, _b;
2168
+ return (React.createElement(StyledInlineMessageWrapper, __assign({}, props, { style: (_b = (_a = props === null || props === void 0 ? void 0 : props.componentStyle) === null || _a === void 0 ? void 0 : _a.root) !== null && _b !== void 0 ? _b : {} }),
2169
+ React.createElement(UnstyledInlineMessage, __assign({}, props))));
2170
+ };
2171
+
2172
+ var renderTrigger = function () { return (React.createElement(IconWrapper, { tabIndex: 0 },
2173
+ React.createElement(Icon, { icon: faEllipsisH, fixedWidth: true }))); };
2174
+ var IconWrapper = styled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
2175
+ var triggerStyles = {
2176
+ margin: 'auto',
2177
+ width: '100%',
2178
+ height: '100%',
2179
+ display: 'flex',
2180
+ justifyContent: 'center',
2181
+ alignItems: 'center',
2182
+ };
2183
+ var SidebarItemDropdown = function (_a) {
2184
+ var className = _a.className, content = _a.content, _b = _a.forceOpen, forceOpen = _b === void 0 ? false : _b;
2185
+ return (React.createElement(Dropdown, { triggerStyles: triggerStyles, className: className, placement: 'right-start', renderTrigger: renderTrigger, content: content, forceOpen: forceOpen }));
2186
+ };
2187
+ var templateObject_1$Q;
2188
+
2189
+ var SidebarItemCaret = styled.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n transition: transform 250ms ease;\n transform: ", ";\n\n visibility: ", ";\n"], ["\n transition: transform 250ms ease;\n transform: ", ";\n\n visibility: ", ";\n"])), function (_a) {
2190
+ var isOpen = _a.isOpen;
2191
+ return (isOpen ? 'rotate(90deg)' : 'rotate(0deg)');
2192
+ }, function (_a) {
2193
+ var isVisible = _a.isVisible;
2194
+ return (isVisible ? 'visible' : 'hidden');
2195
+ });
2196
+ var templateObject_1$R;
2197
+
2198
+ var getSidebarItemStyles = function (_a) {
2199
+ var isActive = _a.isActive, isDisabled = _a.isDisabled, theme = _a.theme;
2200
+ var _b = theme.components.sidebarItem, normal = _b.normal, active = _b.active, disabled = _b.disabled;
2201
+ return isDisabled ? disabled : isActive ? active : normal;
2202
+ };
2203
+
2204
+ var sidebarItemHeight = 44;
2205
+ var SidebarItem = function (props) {
2206
+ var _a;
2207
+ var _b = props.caretVisible, caretVisible = _b === void 0 ? false : _b, className = props.className, dropdownContent = props.dropdownContent, icon = props.icon, _c = props.isActive, isActive = _c === void 0 ? false : _c, _d = props.isDisabled, isDisabled = _d === void 0 ? false : _d, _e = props.isHidden, isHidden = _e === void 0 ? false : _e, _f = props.isOpen, isOpen = _f === void 0 ? false : _f, onClick = props.onClick, title = props.title, forceOpenDropdown = props.forceOpenDropdown, customProps = props.customProps, href = props.href;
2208
+ var handleClick = useCallback(function (e) {
2209
+ if (onClick && ((isMacOs && !e.metaKey) || (!isMacOs && !e.ctrlKey))) {
2210
+ e.preventDefault();
2211
+ onClick(e);
2212
+ }
2213
+ }, [onClick]);
2214
+ if (isHidden) {
2215
+ return null;
2216
+ }
2217
+ var content = ((_a = customProps === null || customProps === void 0 ? void 0 : customProps.renderContent) === null || _a === void 0 ? void 0 : _a.call(customProps, props)) || title;
2218
+ return (React.createElement(SidebarItemWrapper, { href: href, customColor: customProps === null || customProps === void 0 ? void 0 : customProps.color, isActive: isActive, isDisabled: isDisabled, className: className, onClick: handleClick },
2219
+ React.createElement(SidebarItemCaret, { isOpen: isOpen, isVisible: caretVisible },
2220
+ React.createElement(Icon, { icon: faCaretRight })),
2221
+ icon ? React.createElement(Icon, __assign({}, icon, { fixedWidth: true })) : React.createElement(NoIcon, { icon: faCircle, fixedWidth: true }),
2222
+ React.createElement(Title$2, null, content),
2223
+ !isDisabled && dropdownContent && React.createElement(Dropdown$1, { content: dropdownContent, forceOpen: forceOpenDropdown })));
2224
+ };
2225
+ var Dropdown$1 = styled(SidebarItemDropdown)(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"], ["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"])));
2226
+ var SidebarItemWrapper = styled.a.attrs(getSidebarItemStyles)(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n height: ", "px;\n padding: 0 8px;\n text-decoration: none;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n text-decoration: none;\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: inherit;\n\n &:hover {\n background: ", ";\n }\n\n &:focus-within {\n background: ", ";\n }\n }\n }\n"], ["\n height: ", "px;\n padding: 0 8px;\n text-decoration: none;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n text-decoration: none;\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: inherit;\n\n &:hover {\n background: ", ";\n }\n\n &:focus-within {\n background: ", ";\n }\n }\n }\n"])), sidebarItemHeight, function (_a) {
2227
+ var color = _a.color, customColor = _a.customColor;
2228
+ return customColor || color;
2229
+ }, function (_a) {
2230
+ var background = _a.background;
2231
+ return background;
2232
+ }, Dropdown$1, function (_a) {
2233
+ var hoverColor = _a.hoverColor;
2234
+ return hoverColor;
2235
+ }, function (_a) {
2236
+ var hoverBackground = _a.hoverBackground;
2237
+ return hoverBackground;
2238
+ }, Dropdown$1, function (_a) {
2239
+ var dropdownHover = _a.dropdownHover;
2240
+ return dropdownHover;
2241
+ }, function (_a) {
2242
+ var dropdownActive = _a.dropdownActive;
2243
+ return dropdownActive;
2244
+ });
2245
+ var Title$2 = styled.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"], ["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
2246
+ var NoIcon = styled(Icon)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n visibility: hidden;\n"], ["\n visibility: hidden;\n"])));
2247
+ var templateObject_1$S, templateObject_2$m, templateObject_3$d, templateObject_4$8;
2248
+
2249
+ var sidebarItemPalette = {
2250
+ normal: {
2251
+ color: defaultPalette.black[100],
2252
+ background: 'transparent',
2253
+ hoverColor: defaultPalette.black[100],
2254
+ hoverBackground: defaultPalette.grey[100],
2255
+ dropdownHover: defaultPalette.grey[400],
2256
+ dropdownActive: defaultPalette.grey[600],
2257
+ },
2258
+ active: {
2259
+ color: defaultPalette.white[100],
2260
+ background: defaultPalette.blue[500],
2261
+ hoverColor: defaultPalette.white[100],
2262
+ hoverBackground: defaultPalette.blue[500],
2263
+ dropdownHover: 'rgba(255,255,255,0.16)',
2264
+ dropdownActive: defaultPalette.blue[700],
2265
+ },
2266
+ disabled: {
2267
+ color: defaultPalette.grey[300],
2268
+ background: defaultPalette.grey[100],
2269
+ hoverColor: defaultPalette.grey[300],
2270
+ hoverBackground: defaultPalette.grey[100],
2271
+ dropdownHover: 'transparent',
2272
+ dropdownActive: 'transparent',
2273
+ },
2274
+ };
2275
+
2276
+ var getMicroTagStyles = function (_a) {
2277
+ var theme = _a.theme, type = _a.type;
2278
+ return theme.components.microTag[type];
2279
+ };
2280
+
2281
+ var MicroTagBody = styled.div.attrs(getMicroTagStyles)(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ", ";\n background-color: ", ";\n"], ["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ", ";\n background-color: ", ";\n"])), function (_a) {
2282
+ var color = _a.color;
2283
+ return color;
2284
+ }, function (_a) {
2285
+ var backgroundColor = _a.backgroundColor;
2286
+ return backgroundColor;
2287
+ });
2288
+ var templateObject_1$T;
2289
+
2290
+ var MicroTag = function (_a) {
2291
+ var text = _a.text, type = _a.type;
2292
+ return React.createElement(MicroTagBody, { type: type }, text);
2293
+ };
2294
+
2295
+ var microTagPalette = {
2296
+ error: {
2297
+ backgroundColor: defaultPalette.red[50],
2298
+ color: defaultPalette.red[500],
2299
+ },
2300
+ info: {
2301
+ backgroundColor: defaultPalette.blue[50],
2302
+ color: defaultPalette.blue[500],
2303
+ },
2304
+ standard: {
2305
+ backgroundColor: defaultPalette.grey[50],
2306
+ color: defaultPalette.grey[500],
2307
+ },
2308
+ success: {
2309
+ backgroundColor: defaultPalette.green[50],
2310
+ color: defaultPalette.green[500],
2311
+ },
2312
+ warning: {
2313
+ backgroundColor: defaultPalette.yellow[50],
2314
+ color: defaultPalette.yellow[500],
2315
+ },
2316
+ };
2317
+
2318
+ var getStepItemStyles = function (_a) {
2319
+ var theme = _a.theme, status = _a.status;
2320
+ return theme.components.stepper.item[status];
2321
+ };
2322
+
2323
+ var checkIcon = React.createElement(Icon, { icon: faCheck, fixedWidth: true });
2324
+ var StepItem = function (_a) {
2325
+ var _b = _a.text, text = _b === void 0 ? '' : _b, number = _a.number, status = _a.status;
2326
+ var content = status === 'completed' ? checkIcon : number + 1;
2327
+ return (React.createElement(Wrapper$h, { status: status },
2328
+ React.createElement(Circle, null, content),
2329
+ React.createElement(Text$2, null, text)));
2330
+ };
2331
+ var Circle = styled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
2332
+ var Text$2 = styled.div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject([""], [""])));
2333
+ var Wrapper$h = styled.div.attrs(getStepItemStyles)(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"], ["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"])), Circle, function (_a) {
2334
+ var circleTextColor = _a.circleTextColor;
2335
+ return circleTextColor;
2336
+ }, function (_a) {
2337
+ var circleBackground = _a.circleBackground;
2338
+ return circleBackground;
2339
+ }, Text$2, function (_a) {
2340
+ var color = _a.color;
2341
+ return color;
2342
+ });
2343
+ var templateObject_1$U, templateObject_2$n, templateObject_3$e;
2344
+
2345
+ var StepperDivider = styled.div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"], ["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"])));
2346
+ var templateObject_1$V;
2347
+
2348
+ var getItemStatus = function (itemStep, currentStep) {
2349
+ if (itemStep < currentStep) {
2350
+ return 'completed';
2351
+ }
2352
+ else if (itemStep === currentStep) {
2353
+ return 'active';
2354
+ }
2355
+ else {
2356
+ return 'normal';
2357
+ }
2358
+ };
2359
+
2360
+ var Stepper = function (_a) {
2361
+ var steps = _a.steps, currentStep = _a.currentStep;
2362
+ var mappedSteps = useMemo(function () {
2363
+ return steps.reduce(function (r, step, i) {
2364
+ if (i === 0) {
2365
+ return [React.createElement(StepItem, { key: i, number: i, status: getItemStatus(i, currentStep), text: step })];
2366
+ }
2367
+ else {
2368
+ return __spreadArrays(r, [
2369
+ React.createElement(StepperDivider, { key: "divider_" + i }),
2370
+ React.createElement(StepItem, { key: i, number: i, status: getItemStatus(i, currentStep), text: step }),
2371
+ ]);
2372
+ }
2373
+ }, []);
2374
+ }, [steps, currentStep]);
2375
+ return React.createElement(Wrapper$i, null, mappedSteps);
2376
+ };
2377
+ var Wrapper$i = styled.div(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"], ["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"])));
2378
+ var templateObject_1$W;
2379
+
2380
+ var stepperPalette = {
2381
+ item: {
2382
+ normal: {
2383
+ color: defaultPalette.grey[500],
2384
+ circleBackground: defaultPalette.grey[500],
2385
+ circleTextColor: defaultPalette.white[100],
2386
+ },
2387
+ active: {
2388
+ color: defaultPalette.blue[500],
2389
+ circleBackground: defaultPalette.blue[500],
2390
+ circleTextColor: defaultPalette.white[100],
2391
+ },
2392
+ completed: {
2393
+ color: defaultPalette.grey[500],
2394
+ circleBackground: defaultPalette.green[500],
2395
+ circleTextColor: defaultPalette.white[100],
2396
+ },
2397
+ },
2398
+ };
2399
+
2400
+ var getTagColors = function (_a) {
2401
+ var tagStyle = _a.tagStyle, theme = _a.theme, type = _a.type;
2402
+ return theme.components.tag[tagStyle][type];
2403
+ };
2404
+
2405
+ var LeftIcon$2 = styled(Icon)(templateObject_1$X || (templateObject_1$X = __makeTemplateObject([""], [""])));
2406
+ var RightIcon$1 = styled(Icon)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject([""], [""])));
2407
+ var Text$3 = styled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject([""], [""])));
2408
+ var StyledTag = styled.div.attrs(getTagColors)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ", ";\n background-color: ", ";\n\n ", " + ", " {\n padding-left: 4px;\n }\n\n ", " + ", " {\n padding-right: 12px;\n }\n"], ["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ", ";\n background-color: ", ";\n\n ", " + ", " {\n padding-left: 4px;\n }\n\n ", " + ", " {\n padding-right: 12px;\n }\n"])), function (_a) {
2409
+ var color = _a.color;
2410
+ return color;
2411
+ }, function (_a) {
2412
+ var backgroundColor = _a.backgroundColor;
2413
+ return backgroundColor;
2414
+ }, LeftIcon$2, Text$3, Text$3, RightIcon$1);
2415
+ var templateObject_1$X, templateObject_2$o, templateObject_3$f, templateObject_4$9;
2416
+
2417
+ var Tag = function (_a) {
2418
+ var leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, tagStyle = _a.tagStyle, text = _a.text, type = _a.type, className = _a.className;
2419
+ return (React.createElement(StyledTag, { className: className, type: type, tagStyle: tagStyle },
2420
+ leftIcon && React.createElement(LeftIcon$2, __assign({}, leftIcon)),
2421
+ React.createElement(Text$3, null, text),
2422
+ rightIcon && React.createElement(RightIcon$1, __assign({}, rightIcon))));
2423
+ };
2424
+
2425
+ var tagPalette = {
2426
+ full: {
2427
+ standard: {
2428
+ color: defaultPalette.white[100],
2429
+ backgroundColor: defaultPalette.grey[600],
2430
+ },
2431
+ warning: {
2432
+ color: defaultPalette.white[100],
2433
+ backgroundColor: defaultPalette.yellow[500],
2434
+ },
2435
+ success: {
2436
+ color: defaultPalette.white[100],
2437
+ backgroundColor: defaultPalette.green[500],
2438
+ },
2439
+ info: {
2440
+ color: defaultPalette.white[100],
2441
+ backgroundColor: defaultPalette.blue[500],
2442
+ },
2443
+ error: {
2444
+ color: defaultPalette.white[100],
2445
+ backgroundColor: defaultPalette.red[500],
2446
+ },
2447
+ },
2448
+ soft: {
2449
+ standard: {
2450
+ color: defaultPalette.grey[900],
2451
+ backgroundColor: defaultPalette.grey[100],
2452
+ },
2453
+ warning: {
2454
+ color: defaultPalette.yellow[900],
2455
+ backgroundColor: defaultPalette.yellow[50],
2456
+ },
2457
+ success: {
2458
+ color: defaultPalette.green[900],
2459
+ backgroundColor: defaultPalette.green[50],
2460
+ },
2461
+ info: {
2462
+ color: defaultPalette.blue[900],
2463
+ backgroundColor: defaultPalette.blue[50],
2464
+ },
2465
+ error: {
2466
+ color: defaultPalette.red[900],
2467
+ backgroundColor: defaultPalette.red[50],
2468
+ },
2469
+ },
2470
+ text: {
2471
+ standard: {
2472
+ backgroundColor: 'transparent',
2473
+ color: defaultPalette.grey[800],
2474
+ },
2475
+ warning: {
2476
+ backgroundColor: 'transparent',
2477
+ color: defaultPalette.yellow[500],
2478
+ },
2479
+ success: {
2480
+ backgroundColor: 'transparent',
2481
+ color: defaultPalette.green[500],
2482
+ },
2483
+ info: {
2484
+ backgroundColor: 'transparent',
2485
+ color: defaultPalette.indigo[500],
2486
+ },
2487
+ error: {
2488
+ backgroundColor: 'transparent',
2489
+ color: defaultPalette.red[500],
2490
+ },
2491
+ },
2492
+ };
2493
+
2494
+ var Arrow = styled.div(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ", ";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"], ["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ", ";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"])), function (_a) {
2495
+ var theme = _a.theme, type = _a.type;
2496
+ return theme.components.tooltip[type].background;
2497
+ });
2498
+ var arrowStyle = css(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"], ["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"])), Arrow, Arrow, Arrow, Arrow);
2499
+ var templateObject_1$Y, templateObject_2$p;
2500
+
2501
+ var getMessageStyles = function (_a) {
2502
+ var theme = _a.theme, type = _a.type;
2503
+ return theme.components.tooltip[type];
2504
+ };
2505
+ var Message = styled.div.attrs(getMessageStyles)(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ", ";\n background: ", ";\n"], ["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ", ";\n background: ", ";\n"])), function (_a) {
2506
+ var color = _a.color;
2507
+ return color;
2508
+ }, function (_a) {
2509
+ var background = _a.background;
2510
+ return background;
2511
+ });
2512
+ var templateObject_1$Z;
2513
+
2514
+ var TooltipContainer = styled.div(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", ";\n\n max-width: min(calc(100vw - 5%), 300px);\n"], ["\n ", ";\n\n max-width: min(calc(100vw - 5%), 300px);\n"])), arrowStyle);
2515
+ var templateObject_1$_;
2516
+
2517
+ var Tooltip = function (_a) {
2518
+ var message = _a.message, placement = _a.placement, className = _a.className, children = _a.children, type = _a.type, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave;
2519
+ var wrapperRef = useRef(null);
2520
+ var popperRef = useRef(null);
2521
+ var buttonRef = useRef(null);
2522
+ var _b = useState(null), arrowRef = _b[0], setArrowRef = _b[1];
2523
+ var _c = useState(false), isOpen = _c[0], setIsOpen = _c[1];
2524
+ var show = useCallback(function () { return setIsOpen(true); }, []);
2525
+ var hide = useCallback(function () { return setIsOpen(false); }, []);
2526
+ useClickAway(wrapperRef, hide);
2527
+ useEffect(function () {
2528
+ if (isOpen) {
2529
+ window.addEventListener('touchmove', hide);
2530
+ return function () {
2531
+ window.removeEventListener('touchmove', hide);
2532
+ };
2533
+ }
2534
+ return;
2535
+ }, [hide, isOpen]);
2536
+ var _onMouseEnter = useCallback(function (e) {
2537
+ show();
2538
+ onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(e);
2539
+ }, [onMouseEnter, show]);
2540
+ var _onMouseLeave = useCallback(function (e) {
2541
+ hide();
2542
+ onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(e);
2543
+ }, [hide, onMouseLeave]);
2544
+ var _d = usePopper(buttonRef.current, popperRef.current, {
2545
+ placement: placement,
2546
+ strategy: 'fixed',
2547
+ modifiers: useMemo(function () { return [
2548
+ {
2549
+ name: 'arrow',
2550
+ options: {
2551
+ element: arrowRef,
2552
+ },
2553
+ },
2554
+ {
2555
+ name: 'offset',
2556
+ options: {
2557
+ offset: [0, 10],
2558
+ },
2559
+ },
2560
+ ]; }, [arrowRef]),
2561
+ }), attributes = _d.attributes, styles = _d.styles;
2562
+ return (React.createElement(Wrapper$j, { className: className, ref: wrapperRef },
2563
+ React.createElement("div", { ref: buttonRef, onClick: show, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave }, children),
2564
+ React.createElement(CSSTransition, { in: isOpen, timeout: 200, unmountOnExit: true, appear: true },
2565
+ React.createElement(BodyAnimationWrapper$1, null,
2566
+ React.createElement(TooltipContainer, __assign({ ref: popperRef, style: styles.popper }, attributes.popper),
2567
+ React.createElement(Arrow, { type: type, ref: setArrowRef, style: styles.arrow }),
2568
+ React.createElement(Message, { type: type, style: styles.offset }, message))))));
2569
+ };
2570
+ var Wrapper$j = styled.div(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
2571
+ var BodyAnimationWrapper$1 = styled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"], ["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"])));
2572
+ var templateObject_1$$, templateObject_2$q;
2573
+
2574
+ var tooltipPalette = {
2575
+ light: {
2576
+ color: defaultPalette.black[100],
2577
+ background: defaultPalette.white[100],
2578
+ },
2579
+ dark: {
2580
+ color: defaultPalette.white[100],
2581
+ background: defaultPalette.grey[900],
2582
+ },
2583
+ };
2584
+
2585
+ var components = {
2586
+ tag: tagPalette,
2587
+ tooltip: tooltipPalette,
2588
+ button: buttonPalette,
2589
+ iconButton: iconButtonPalette,
2590
+ microTag: microTagPalette,
2591
+ checkbox: checkboxPalette,
2592
+ icon: iconPalette,
2593
+ iconBackground: iconBackgroundPalette,
2594
+ dropdown: dropdownPalette,
2595
+ sidebarItem: sidebarItemPalette,
2596
+ stepper: stepperPalette,
2597
+ inputText: inputTextPalette,
2598
+ textArea: textAreaPalette,
2599
+ inputHelper: inputHelperPalette,
2600
+ select: selectPalette,
2601
+ };
2602
+ var defaultTheme = {
2603
+ palette: defaultPalette,
2604
+ components: components,
2605
+ };
2606
+
2607
+ var ModalAnimation = createGlobalStyle(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"], ["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"])));
2608
+ var templateObject_1$10;
2609
+
2610
+ var styledModalBoxWidth = function (isSmall, isFullscreen) {
2611
+ if (isFullscreen) {
2612
+ return '100vw';
2613
+ }
2614
+ if (isSmall) {
2615
+ return '342px';
2616
+ }
2617
+ return '736px';
2618
+ };
2619
+
2620
+ var headerFooterHeight = '80px';
2621
+ var closeTimeoutMS = 200;
2622
+ var StyledReactModalContainer = styled(ReactModal)(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ", "ms ease-in-out;\n"], ["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ", "ms ease-in-out;\n"])), closeTimeoutMS);
2623
+ var StyledModalBox = styled.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ", "\n\n box-shadow: ", ";\n\n border: ", ";\n border-radius: ", "px;\n width: ", "vw;\n\n @media screen and (min-width: 992px) {\n width: ", ";\n }\n"], ["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ",
2624
+ "\n\n box-shadow: ",
2625
+ ";\n\n border: ", ";\n border-radius: ", "px;\n width: ", "vw;\n\n @media screen and (min-width: 992px) {\n width: ", ";\n }\n"])), function (_a) {
2626
+ var fullScreenHeight = _a.fullScreenHeight, isFullscreen = _a.isFullscreen;
2627
+ return isFullscreen
2628
+ ? css(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n height: ", "px;\n "], ["\n height: ", "px;\n "])), fullScreenHeight) : css(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n min-height: 200px;\n "], ["\n min-height: 200px;\n "])));
2629
+ }, function (props) {
2630
+ return props.isFullscreen ? 'none' : 'rgba(23, 43, 77, 0.24) 0px 16px 24px, rgba(9, 30, 66, 0.08) 0px 0px 0px';
2631
+ }, function (props) { return (props.isFullscreen ? 0 : '1px solid rgb(204, 204, 204)'); }, function (props) { return (props.isFullscreen ? 0 : 8); }, function (props) { return (props.isFullscreen ? 100 : 96); }, function (_a) {
2632
+ var isFullscreen = _a.isFullscreen, isSmall = _a.isSmall;
2633
+ return styledModalBoxWidth(isSmall, isFullscreen);
2634
+ });
2635
+ var ModalBody = styled.div(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n min-height: ", ";\n height: ", ";\n padding: 1rem ", ";\n overflow-y: auto;\n\n ", "\n"], ["\n min-height: ", ";\n height: ", ";\n padding: 1rem ", ";\n overflow-y: auto;\n\n ",
2636
+ "\n"])), function (_a) {
2637
+ var minHeight = _a.minHeight;
2638
+ return (minHeight ? minHeight + "px" : 'auto');
2639
+ }, function (_a) {
2640
+ var height = _a.height;
2641
+ return (height ? height + "px" : 'auto');
2642
+ }, spacing.l, function (_a) {
2643
+ var footer = _a.footer, header = _a.header, isFullscreen = _a.isFullscreen, title = _a.title;
2644
+ if (isFullscreen) {
2645
+ return css(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n height: calc(100% - (", " * 2));\n "], ["\n height: calc(100% - (", " * 2));\n "])), headerFooterHeight);
2646
+ }
2647
+ else {
2648
+ if (header || title || footer) {
2649
+ return css(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n max-height: calc(100vh - (", " * 4));\n "], ["\n max-height: calc(100vh - (", " * 4));\n "])), headerFooterHeight);
2650
+ }
2651
+ return css(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n max-height: 100%;\n "], ["\n max-height: 100%;\n "])));
2652
+ }
2653
+ });
2654
+ var ModalHeaderClose = styled.div(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n margin-left: 5px;\n .icon {\n cursor: pointer;\n &:hover {\n color: ", ";\n }\n }\n"], ["\n margin-left: 5px;\n .icon {\n cursor: pointer;\n &:hover {\n color: ", ";\n }\n }\n"])), function (_a) {
2655
+ var palette = _a.theme.palette;
2656
+ return palette.grey[800];
2657
+ });
2658
+ var ModalHeader = styled.div(templateObject_11$1 || (templateObject_11$1 = __makeTemplateObject(["\n padding: 0 ", ";\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n ", ";\n\n height: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n h3 {\n font-size: 20px;\n line-height: 30px;\n margin: 0;\n font-weight: 500;\n }\n"], ["\n padding: 0 ", ";\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n ",
2659
+ ";\n\n height: ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n h3 {\n font-size: 20px;\n line-height: 30px;\n margin: 0;\n font-weight: 500;\n }\n"])), spacing.l, spacing.xs, spacing.xs, function (_a) {
2660
+ var palette = _a.theme.palette;
2661
+ return css(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n border-bottom: 2px solid ", ";\n background-color: ", ";\n "], ["\n border-bottom: 2px solid ", ";\n background-color: ", ";\n "])), palette.grey[100], palette.grey[50]);
2662
+ }, headerFooterHeight);
2663
+ var ModalFooter = styled.div(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n padding: 0 ", ";\n height: ", ";\n border-top: 2px solid ", ";\n align-items: center;\n justify-content: flex-end;\n display: flex;\n margin: 0 auto;\n & > div:not(:first-of-type) {\n margin-left: 16px;\n }\n"], ["\n padding: 0 ", ";\n height: ", ";\n border-top: 2px solid ", ";\n align-items: center;\n justify-content: flex-end;\n display: flex;\n margin: 0 auto;\n & > div:not(:first-of-type) {\n margin-left: 16px;\n }\n"])), spacing.l, headerFooterHeight, function (_a) {
2664
+ var palette = _a.theme.palette;
2665
+ return palette.grey[100];
2666
+ });
2667
+ var Wrapper$k = styled.div(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject([""], [""])));
2668
+ var TopAttachment = styled.div(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n top: ", ";\n"], ["\n position: absolute;\n width: 100%;\n top: ", ";\n"])), function (_a) {
2669
+ var height = _a.height;
2670
+ return height && -(height + 16) + "px";
2671
+ });
2672
+ var BottomAttachment = styled.div(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"], ["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"])));
2673
+ var StyledIcon$6 = styled(Icon)(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n font-size: 24px;\n font-weight: 500;\n"], ["\n font-size: 24px;\n font-weight: 500;\n"])));
2674
+ var templateObject_1$11, templateObject_2$r, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$5, templateObject_8$3, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1;
2675
+
2676
+ var closeTimeoutMS$1 = 200;
2677
+ var modalStyle = {
2678
+ overlay: {
2679
+ // to set the color of background overlay
2680
+ backgroundColor: defaultTheme.palette.black[48],
2681
+ zIndex: 10000,
2682
+ },
2683
+ };
2684
+ var Modal = /** @class */ (function (_super) {
2685
+ __extends(Modal, _super);
2686
+ function Modal(props) {
2687
+ var _this = _super.call(this, props) || this;
2688
+ _this.updateHeight = function () {
2689
+ _this.setState({ fullScreenHeight: window.innerHeight });
2690
+ };
2691
+ _this.hasFooter = function () { return !!_this.props.footerButtons || typeof _this.props.footer === 'function'; };
2692
+ _this.renderFooter = function () {
2693
+ var _a = _this.props, footer = _a.footer, footerButtons = _a.footerButtons;
2694
+ if (footerButtons) {
2695
+ return (React.createElement(React.Fragment, null, footerButtons.map(function (elem, i) { return (React.createElement("div", { key: i },
2696
+ React.createElement(Button, __assign({}, elem)))); })));
2697
+ }
2698
+ else {
2699
+ return footer ? footer() : undefined;
2700
+ }
2701
+ };
2702
+ _this.handleModalClose = function () {
2703
+ if (_this.props.onActionClose)
2704
+ _this.props.onActionClose();
2705
+ };
2706
+ _this.contentRefCallback = function () {
2707
+ var topAttachment = document.getElementById('top-attachment');
2708
+ if (topAttachment) {
2709
+ _this.setState({ topAttachmentHeight: topAttachment.clientHeight });
2710
+ }
2711
+ };
2712
+ _this.state = { topAttachmentHeight: 0, fullScreenHeight: 0 };
2713
+ return _this;
2714
+ }
2715
+ Modal.prototype.componentDidMount = function () {
2716
+ var isFullscreen = this.props.isFullscreen;
2717
+ if (isFullscreen) {
2718
+ this.updateHeight();
2719
+ window.addEventListener('resize', this.updateHeight);
2720
+ }
2721
+ };
2722
+ Modal.prototype.componentWillUnmount = function () {
2723
+ var isFullscreen = this.props.isFullscreen;
2724
+ if (isFullscreen) {
2725
+ window.removeEventListener('resize', this.updateHeight);
2726
+ }
2727
+ };
2728
+ Modal.prototype.render = function () {
2729
+ var _a = this.props, allowClose = _a.allowClose, className = _a.className, header = _a.header, isFullscreen = _a.isFullscreen, isOpen = _a.isOpen, onActionClose = _a.onActionClose, title = _a.title;
2730
+ var _b = this.props, bottomAttachment = _b.bottomAttachment, height = _b.height, isSmall = _b.isSmall, minHeight = _b.minHeight, topAttachment = _b.topAttachment;
2731
+ var fullScreenHeight = this.state.fullScreenHeight;
2732
+ var allowOverlayClose = allowClose !== null && allowClose !== void 0 ? allowClose : true;
2733
+ return (React.createElement(React.Fragment, null,
2734
+ React.createElement(ModalAnimation, null),
2735
+ React.createElement(StyledReactModalContainer, { closeTimeoutMS: closeTimeoutMS$1, shouldCloseOnOverlayClick: allowOverlayClose, onRequestClose: allowOverlayClose ? this.handleModalClose : undefined, shouldCloseOnEsc: allowOverlayClose, style: modalStyle, isOpen: isOpen !== null && isOpen !== void 0 ? isOpen : true, isFullscreen: isFullscreen, isSmall: isSmall, contentRef: this.contentRefCallback, ariaHideApp: false },
2736
+ React.createElement(React.Fragment, null,
2737
+ topAttachment && (React.createElement(TopAttachment, { id: 'top-attachment', height: this.state.topAttachmentHeight }, topAttachment())),
2738
+ React.createElement(StyledModalBox, { className: className, isFullscreen: isFullscreen, isSmall: isSmall, fullScreenHeight: fullScreenHeight },
2739
+ (header || title) && (React.createElement(ModalHeader, null,
2740
+ header ? header() : React.createElement("h3", null, title),
2741
+ onActionClose ? (React.createElement(ModalHeaderClose, null,
2742
+ React.createElement(Icon, { icon: faTimes$1, size: '1x', type: 'light', fixedWidth: true, onClick: this.handleModalClose, className: 'icon' }))) : null)),
2743
+ React.createElement(ModalBody, { height: height, minHeight: minHeight, isFullscreen: isFullscreen, header: header, title: title, footer: this.props.footer }, this.props.children),
2744
+ this.hasFooter() && React.createElement(ModalFooter, null, this.renderFooter())),
2745
+ bottomAttachment && React.createElement(BottomAttachment, null, bottomAttachment())))));
2746
+ };
2747
+ return Modal;
2748
+ }(Component));
2749
+
2750
+ var ModalSearchable = function (props) {
2751
+ var children = props.children, className = props.className, handleChangeValue = props.handleChangeValue, placeholder = props.placeholder, value = props.value;
2752
+ var handleChange = function (e) {
2753
+ handleChangeValue(e.currentTarget.value);
2754
+ };
2755
+ var clearInput = function () {
2756
+ handleChangeValue('');
2757
+ };
2758
+ var Header = (React.createElement(WrapperInput, null,
2759
+ React.createElement(StyledIcon$6, { icon: faSearch, color: 'black' }),
2760
+ React.createElement("input", { autoFocus: true, className: 'inputSearchable', type: 'text', onChange: handleChange, value: value, placeholder: placeholder }),
2761
+ React.createElement(ClearButton, { visible: !!value, onClick: clearInput }, "Cancella")));
2762
+ return (React.createElement(Modal, __assign({ className: className, header: function () { return Header; } }, props), children));
2763
+ };
2764
+ var ClearButton = styled.div(templateObject_1$12 || (templateObject_1$12 = __makeTemplateObject(["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ", ";\n color: ", ";\n &:hover {\n color: ", ";\n }\n display: ", ";\n"], ["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ", ";\n color: ", ";\n &:hover {\n color: ", ";\n }\n display: ", ";\n"])), function (_a) {
2765
+ var theme = _a.theme;
2766
+ return theme.palette.grey[200];
2767
+ }, function (_a) {
2768
+ var theme = _a.theme;
2769
+ return theme.palette.grey[500];
2770
+ }, function (_a) {
2771
+ var theme = _a.theme;
2772
+ return theme.palette.grey[700];
2773
+ }, function (_a) {
2774
+ var visible = _a.visible;
2775
+ return (visible ? 'inherit' : 'none');
2776
+ });
2777
+ var WrapperInput = styled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"])), function (_a) {
2778
+ var theme = _a.theme;
2779
+ return theme.palette.blue[300];
2780
+ }, function (_a) {
2781
+ var theme = _a.theme;
2782
+ return theme.palette.grey[50];
2783
+ });
2784
+ var templateObject_1$12, templateObject_2$s;
2785
+
2786
+ var CustomSizeModal = styled(Modal)(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n width: 432px;\n max-width: 90vw;\n"], ["\n width: 432px;\n max-width: 90vw;\n"])));
2787
+ var TitleContent = styled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"], ["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"])));
2788
+ var BodyContent = styled.div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"], ["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"])));
2789
+ var Question = styled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"], ["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"])));
2790
+ var Buttons = styled.div(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"], ["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"])));
2791
+ var templateObject_1$13, templateObject_2$t, templateObject_3$h, templateObject_4$b, templateObject_5$7;
2792
+
2793
+ var typeMap = {
2794
+ error: 'error',
2795
+ info: 'info',
2796
+ warning: 'warning',
2797
+ success: 'success',
2798
+ };
2799
+ var iconMap$1 = {
2800
+ error: faExclamationTriangle,
2801
+ info: faInfoCircle,
2802
+ warning: faExclamationTriangle,
2803
+ success: faCheckCircle,
2804
+ };
2805
+ var iconColor = {
2806
+ error: 'red',
2807
+ info: 'blue',
2808
+ warning: 'yellow',
2809
+ success: 'green',
2810
+ };
2811
+ var ConfirmationModal = function (props) {
2812
+ var type = typeMap[props.type];
2813
+ var icon = iconMap$1[type];
2814
+ var color = iconColor[type];
2815
+ return (React.createElement(CustomSizeModal, { isOpen: props.isOpen, onActionClose: function () { return props.setIsOpen(false); }, isSmall: true },
2816
+ React.createElement(TitleContent, null,
2817
+ React.createElement(Icon, { icon: icon, size: '1x', color: color }),
2818
+ React.createElement("span", { style: { marginLeft: '10px' } }, props.title)),
2819
+ React.createElement(BodyContent, null, props.description),
2820
+ React.createElement(Question, null, props.question),
2821
+ React.createElement(Buttons, null,
2822
+ React.createElement(Button, { text: 'Annulla', color: 'grey', onClick: function () {
2823
+ props.setIsOpen(false);
2824
+ } }),
2825
+ React.createElement(StyledButton, { text: props.actionText, color: color, onClick: function () {
2826
+ props.setIsOpen(false);
2827
+ props.onAction();
2828
+ } }))));
2829
+ };
2830
+ var StyledButton = styled(Button)(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n margin-left: 16px;\n"], ["\n margin-left: 16px;\n"])));
2831
+ var templateObject_1$14;
2832
+
2833
+ var StyledWrapper = styled.div(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ", ";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ", ";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ", ";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n }\n"], ["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ", ";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ", ";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ", ";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n }\n"])), function (_a) {
2834
+ var palette = _a.theme.palette;
2835
+ return palette.red[50];
2836
+ }, function (_a) {
2837
+ var palette = _a.theme.palette;
2838
+ return palette.red[500];
2839
+ }, function (_a) {
2840
+ var palette = _a.theme.palette;
2841
+ return palette.black[100];
2842
+ }, function (_a) {
2843
+ var palette = _a.theme.palette;
2844
+ return palette.black[80];
2845
+ });
2846
+ var PageEmptySet = function (_a) {
2847
+ var action = _a.action, icon = _a.icon, text = _a.text, title = _a.title;
2848
+ var button = useMemo(function () {
2849
+ return action ? (React.createElement(Button, { onClick: function () { return action.action(); }, iconLeft: action.icon ? action.icon : undefined, text: action.text, color: 'green' })) : null;
2850
+ }, [action]);
2851
+ return (React.createElement(StyledWrapper, null,
2852
+ icon && (React.createElement("div", { className: 'icon' },
2853
+ React.createElement(Icon, __assign({}, icon)))),
2854
+ title && React.createElement("h5", null, title),
2855
+ text && React.createElement("p", null, text),
2856
+ button));
2857
+ };
2858
+ var templateObject_1$15;
2859
+
2860
+ var StyledWrapper$1 = styled.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n ", "\n"], ["\n ",
2861
+ "\n"])), function (_a) {
2862
+ var palette = _a.theme.palette;
2863
+ return css(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "], ["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "])), palette.grey[700], palette.white[100], palette.grey[700]);
2864
+ });
2865
+ var templateObject_1$16, templateObject_2$u;
2866
+
2867
+ var PaginationComponent = function (props) {
2868
+ var numberOfPages = Math.ceil(props.listSize / props.pageSize);
2869
+ var managedCurrentPage = Math.min(props.currentPage, numberOfPages);
2870
+ var pageRange = range(managedCurrentPage - 3, managedCurrentPage + 4).filter(function (page) { return page > 0 && page <= numberOfPages; });
2871
+ var backActive = false;
2872
+ if (props.currentPage > 1 && Boolean(props.prevPageAction) && props.listSize) {
2873
+ backActive = true;
2874
+ }
2875
+ return (React.createElement("div", { className: 'pagination' },
2876
+ React.createElement("div", { onClick: function () {
2877
+ if (props.prevPageAction && backActive) {
2878
+ props.prevPageAction();
2879
+ }
2880
+ }, className: 'pagination__element' + " " + (backActive ? '' : 'deactivated') }, props.prevText),
2881
+ !pageRange.includes(1) ? (React.createElement(React.Fragment, null,
2882
+ React.createElement("div", { onClick: function () {
2883
+ props.changePageAction(1);
2884
+ }, className: "pagination__element " + (props.currentPage === 1 ? 'selected' : '') }, "1"),
2885
+ pageRange[0] - 1 !== 1 ? React.createElement("div", { className: 'pagination__element' }, "...") : null)) : null,
2886
+ pageRange.map(function (o, i) { return (React.createElement("div", { key: i, onClick: function () {
2887
+ props.changePageAction(o);
2888
+ }, className: "pagination__element " + (o === managedCurrentPage ? 'selected' : '') }, o)); }),
2889
+ !pageRange.includes(numberOfPages) ? (React.createElement(React.Fragment, null,
2890
+ numberOfPages - pageRange[pageRange.length - 1] !== 1 ? (React.createElement("div", { className: 'pagination__element' }, "...")) : null,
2891
+ React.createElement("div", { onClick: function () {
2892
+ props.changePageAction(numberOfPages);
2893
+ }, className: "pagination__element " + (props.currentPage === numberOfPages ? 'selected' : '') }, numberOfPages))) : null,
2894
+ React.createElement("div", { onClick: function () {
2895
+ if (props.nextPageAction && props.currentPage < numberOfPages) {
2896
+ props.nextPageAction();
2897
+ }
2898
+ }, className: 'pagination__element' + " " + (props.nextPageAction && props.currentPage >= numberOfPages ? 'deactivated' : '') }, props.nextText)));
2899
+ };
2900
+ var Pagination = function (props) { return (React.createElement(StyledWrapper$1, null,
2901
+ React.createElement(PaginationComponent, __assign({}, props)))); };
2902
+
2903
+ var StyledProgressbarWrapper = styled.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n ", "\n"], ["\n ",
2904
+ "\n"])), function (_a) {
2905
+ var color = _a.color, percentage = _a.percentage, palette = _a.theme.palette;
2906
+ return css(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n .progression__container {\n height: ", ";\n background-color: ", ";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ", ";\n width: ", "%;\n }\n "], ["\n .progression__container {\n height: ", ";\n background-color: ", ";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ", ";\n width: ", "%;\n }\n "])), spacing.s, palette.grey[100], palette[color ? color : 'blue'][500], percentage);
2907
+ });
2908
+ var templateObject_1$17, templateObject_2$v;
2909
+
2910
+ var UnstyledProgressbar = /** @class */ (function (_super) {
2911
+ __extends(UnstyledProgressbar, _super);
2912
+ function UnstyledProgressbar(props) {
2913
+ var _this = _super.call(this, props) || this;
2914
+ _this.state = {};
2915
+ return _this;
2916
+ }
2917
+ UnstyledProgressbar.prototype.render = function () {
2918
+ return (React.createElement("div", { className: 'progression__container' },
2919
+ React.createElement("div", { className: 'progression__bar' })));
2920
+ };
2921
+ return UnstyledProgressbar;
2922
+ }(Component));
2923
+ var Progressbar = function (props) { return (React.createElement(StyledProgressbarWrapper, __assign({}, props),
2924
+ React.createElement(UnstyledProgressbar, __assign({}, props)))); };
2925
+
2926
+ var linearBackground = function () { return css(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ", ";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n ", " 46%,\n ", " 50%,\n ", " 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"], ["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ", ";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n ", " 46%,\n ", " 50%,\n ", " 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"])), function (_a) {
2927
+ var theme = _a.theme;
2928
+ return theme.palette.grey[100];
2929
+ }, function (_a) {
2930
+ var theme = _a.theme;
2931
+ return theme.palette.grey[100];
2932
+ }, function (_a) {
2933
+ var theme = _a.theme;
2934
+ return theme.palette.white[100];
2935
+ }, function (_a) {
2936
+ var theme = _a.theme;
2937
+ return theme.palette.grey[100];
2938
+ }); };
2939
+ var templateObject_1$18;
2940
+
2941
+ var tabletLandscape = 991;
2942
+ var responsiveThresholds = {
2943
+ tabletLandscape: tabletLandscape,
2944
+ };
2945
+
2946
+ var localStorageKeys = {
2947
+ main: 'fic-design-system',
2948
+ tableConfigs: 'tableConfigs',
2949
+ };
2950
+
2951
+ var verifyPersistencyStructure = function (persistency) {
2952
+ var requiredProperties = ['id', 'label', 'active', 'position'];
2953
+ if (Array.isArray(persistency)) {
2954
+ for (var _i = 0, persistency_1 = persistency; _i < persistency_1.length; _i++) {
2955
+ var property = persistency_1[_i];
2956
+ for (var i = 0; i < requiredProperties.length; i++) {
2957
+ var hasProperty = property.hasOwnProperty(requiredProperties[i]);
2958
+ if (!hasProperty) {
2959
+ return false;
2960
+ }
2961
+ }
2962
+ }
2963
+ }
2964
+ return true;
2965
+ };
2966
+ var getConfig = function (persistencyId) {
2967
+ if (persistencyId) {
2968
+ var persistencyString = localStorage.getItem(localStorageKeys.main);
2969
+ if (persistencyString) {
2970
+ var persistency = JSON.parse(persistencyString);
2971
+ if (persistency[localStorageKeys.tableConfigs][persistencyId]) {
2972
+ if (verifyPersistencyStructure(persistency[localStorageKeys.tableConfigs][persistencyId])) {
2973
+ return persistency[localStorageKeys.tableConfigs][persistencyId];
2974
+ }
2975
+ return undefined;
2976
+ }
2977
+ }
2978
+ }
2979
+ return undefined;
2980
+ };
2981
+ var modifyConfig = function (properties, persistencyId) {
2982
+ var _a, _b, _c, _d;
2983
+ if (persistencyId) {
2984
+ // Get data from localStorage
2985
+ var persistencyString = localStorage.getItem(localStorageKeys.main);
2986
+ if (persistencyString) {
2987
+ var persistency = JSON.parse(persistencyString);
2988
+ // Create new persistency data
2989
+ var newPersistency = __assign(__assign({}, persistency), (_a = {}, _a[localStorageKeys.tableConfigs] = __assign(__assign({}, persistency[localStorageKeys.tableConfigs]), (_b = {}, _b[persistencyId] = properties, _b)), _a));
2990
+ // Save in localStorage
2991
+ localStorage.setItem(localStorageKeys.main, JSON.stringify(newPersistency));
2992
+ }
2993
+ else {
2994
+ var newPersistency = (_c = {},
2995
+ _c[localStorageKeys.tableConfigs] = (_d = {},
2996
+ _d[persistencyId] = properties,
2997
+ _d),
2998
+ _c);
2999
+ localStorage.setItem(localStorageKeys.main, JSON.stringify(newPersistency));
3000
+ }
3001
+ }
3002
+ };
3003
+ var mergePropertiesPersistency = function (properties, persistency) {
3004
+ return persistency.map(function (p) { return (__assign(__assign({}, p), properties.find(function (itmInner) { return itmInner.id === p.id; }))); });
3005
+ };
3006
+
3007
+ var typeMap$1 = {
3008
+ asc: faSortUp,
3009
+ desc: faSortDown,
3010
+ default: faSort,
3011
+ };
3012
+ var StyledWrapper$2 = styled.div(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject(["\n margin-left: 0.5rem;\n"], ["\n margin-left: 0.5rem;\n"])));
3013
+ var StyledIcon$7 = styled(Icon)(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
3014
+ var SortIcon = function (props) {
3015
+ var filter = _.find(props.propertiesFilter, ['id', props.property]);
3016
+ var type = '';
3017
+ if (!filter) {
3018
+ type = 'default';
3019
+ }
3020
+ else {
3021
+ if (typeof filter.type === 'boolean') {
3022
+ type = 'default';
3023
+ }
3024
+ else {
3025
+ type = filter.type;
3026
+ }
3027
+ }
3028
+ var nextType = 'asc';
3029
+ if (!filter) {
3030
+ nextType = 'asc';
3031
+ }
3032
+ else {
3033
+ if (typeof filter.type === 'boolean') {
3034
+ nextType = 'asc';
3035
+ }
3036
+ else {
3037
+ nextType = 'desc';
3038
+ }
3039
+ }
3040
+ return (React.createElement(StyledWrapper$2, null,
3041
+ React.createElement(StyledIcon$7, { icon: typeMap$1[type], onClick: function () {
3042
+ props.handleSortOnProperty(props.property, nextType);
3043
+ } })));
3044
+ };
3045
+ var templateObject_1$19, templateObject_2$w;
3046
+
3047
+ var ellipsisIcon = {
3048
+ icon: faEllipsisH,
3049
+ };
3050
+ var HeadDesktop = function (_a) {
3051
+ var actions = _a.actions, allChecked = _a.allChecked, controlledProperties = _a.controlledProperties, disableSelection = _a.disableSelection, handleSelectAll = _a.handleSelectAll, handleSortOnProperty = _a.handleSortOnProperty, isLoading = _a.isLoading, propertiesFilter = _a.propertiesFilter, setShowModalCustomizeTrue = _a.setShowModalCustomizeTrue;
3052
+ return (React.createElement("thead", null,
3053
+ React.createElement("tr", null,
3054
+ disableSelection ? null : (React.createElement("th", null,
3055
+ React.createElement("input", { disabled: isLoading, type: 'checkbox', checked: allChecked, onChange: handleSelectAll }))),
3056
+ controlledProperties.map(function (o, i) {
3057
+ if (!o.active) {
3058
+ return null;
3059
+ }
3060
+ return (React.createElement("th", { key: i, style: o.columnStyle },
3061
+ React.createElement("div", null,
3062
+ React.createElement("div", null, o.label),
3063
+ o.sortable ? (React.createElement(SortIcon, { propertiesFilter: propertiesFilter, property: o.id, handleSortOnProperty: handleSortOnProperty })) : null)));
3064
+ }),
3065
+ actions && actions.length ? React.createElement("th", null, "Azioni") : null,
3066
+ React.createElement("th", { onClick: function () {
3067
+ setShowModalCustomizeTrue();
3068
+ } },
3069
+ React.createElement(Icon, __assign({}, ellipsisIcon))))));
3070
+ };
3071
+
3072
+ var Row = styled.div(templateObject_1$1a || (templateObject_1$1a = __makeTemplateObject([""], [""])));
3073
+ var ListMobile = function (_a) {
3074
+ var data = _a.data, isLoading = _a.isLoading, listSize = _a.listSize, renderMobileRow = _a.renderMobileRow;
3075
+ return (React.createElement("div", null, listSize && !isLoading
3076
+ ? data.map(function (o, i) { return React.createElement(Row, { key: i }, renderMobileRow ? renderMobileRow(o) : undefined); })
3077
+ : undefined));
3078
+ };
3079
+ var templateObject_1$1a;
3080
+
3081
+ var ActionLink = styled.a(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ", "\n"], ["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ",
3082
+ "\n"])), function (props) { return css(templateObject_1$1b || (templateObject_1$1b = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), props.color); });
3083
+ var templateObject_1$1b, templateObject_2$x;
3084
+
3085
+ var ActionsContainer = styled.div(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
3086
+ var templateObject_1$1c;
3087
+
3088
+ var StyledWrapper$3 = styled.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ", "\n\n .link_container {\n margin: 0.5rem 0;\n }\n"], ["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ",
3089
+ "\n\n .link_container {\n margin: 0.5rem 0;\n }\n"])), function (_a) {
3090
+ var palette = _a.theme.palette;
3091
+ return palette.white[100];
3092
+ }, function (props) {
3093
+ if (props.active) {
3094
+ return css(templateObject_1$1d || (templateObject_1$1d = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
3095
+ }
3096
+ return undefined;
3097
+ });
3098
+ var Action = styled.p(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n cursor: pointer;\n user-select: none;\n ", "\n"], ["\n cursor: pointer;\n user-select: none;\n ",
3099
+ "\n"])), function (props) {
3100
+ if (props.color) {
3101
+ return css(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), props.color);
3102
+ }
3103
+ return undefined;
3104
+ });
3105
+ var ActionsPopUp = function (props) { return (React.createElement(StyledWrapper$3, { active: props.active }, props.actions.map(function (a, ai) { return (React.createElement("div", { key: ai, className: 'link_container' },
3106
+ React.createElement(Action, { className: 'action', key: ai, onClick: function (e) {
3107
+ e.preventDefault();
3108
+ a.action(props.element, props.selectedRows);
3109
+ props.handlePopUpVisibility(undefined);
3110
+ }, color: a.color }, a.label))); }))); };
3111
+ var templateObject_1$1d, templateObject_2$y, templateObject_3$i, templateObject_4$c;
3112
+
3113
+ var StyledWrapper$4 = styled.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ", "\n"], ["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ",
3114
+ "\n"])), function (_a) {
3115
+ var active = _a.active, palette = _a.theme.palette;
3116
+ return css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n ", "\n &:hover {\n background-color: ", ";\n }\n "], ["\n ",
3117
+ "\n &:hover {\n background-color: ", ";\n }\n "])), active && css(templateObject_1$1e || (templateObject_1$1e = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), palette.blue[50], palette.blue[500]), palette.blue[50]);
3118
+ });
3119
+ var ActionsPopUpButton = function (props) { return (React.createElement(StyledWrapper$4, { active: props.active, onClick: function () { return props.handlePopUpVisibility(props.rowId); } },
3120
+ React.createElement(Icon, { icon: faEllipsisH }))); };
3121
+ var templateObject_1$1e, templateObject_2$z, templateObject_3$j;
3122
+
3123
+ var ActionsPopUpUnderlay = styled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ", "\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ",
3124
+ "\n"])), function (_a) {
3125
+ var active = _a.active;
3126
+ return active && css(templateObject_1$1f || (templateObject_1$1f = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
3127
+ });
3128
+ var templateObject_1$1f, templateObject_2$A;
3129
+
3130
+ var RowDesktop = function (_a) {
3131
+ var actions = _a.actions, controlledProperties = _a.controlledProperties, currentActionsPopUp = _a.currentActionsPopUp, disableSelection = _a.disableSelection, element = _a.element, handlePopUpVisibility = _a.handlePopUpVisibility, handleSelection = _a.handleSelection, index = _a.index, selectedList = _a.selectedList;
3132
+ return (React.createElement("tr", { className: "" + (selectedList && selectedList.includes(element.id) ? "selected" : "") },
3133
+ disableSelection ? null : (React.createElement("td", null,
3134
+ React.createElement("div", null,
3135
+ React.createElement("input", { type: 'checkbox', checked: selectedList && selectedList.includes(element.id), onChange: function () {
3136
+ handleSelection(element.id);
3137
+ } })))),
3138
+ controlledProperties.map(function (p, pi) {
3139
+ if (p.active) {
3140
+ return (React.createElement("td", { key: pi },
3141
+ React.createElement("div", { className: 'table__value' }, p.render ? p.render(element[p.id], element.id) : React.createElement("span", null, element[p.id]))));
3142
+ }
3143
+ return null;
3144
+ }),
3145
+ actions && actions.length ? (React.createElement("td", null,
3146
+ React.createElement(ActionsContainer, null,
3147
+ actions[0] ? (React.createElement(ActionLink, { onClick: function (e) {
3148
+ e.preventDefault();
3149
+ actions[0].action(element, selectedList ? selectedList : []);
3150
+ }, color: actions[0].color }, actions[0].label)) : null,
3151
+ React.createElement(ActionsPopUpUnderlay, { onClick: function () {
3152
+ handlePopUpVisibility(undefined);
3153
+ }, active: Boolean(currentActionsPopUp === index) }),
3154
+ actions && actions.length > 1 && (React.createElement(ActionsPopUpButton, { active: Boolean(currentActionsPopUp === index), rowId: index, handlePopUpVisibility: handlePopUpVisibility })),
3155
+ React.createElement(ActionsPopUp, { active: Boolean(currentActionsPopUp === index), actions: actions.slice(1), selectedRows: selectedList ? selectedList : [], element: element, handlePopUpVisibility: handlePopUpVisibility })))) : null,
3156
+ React.createElement("td", null)));
3157
+ };
3158
+
3159
+ var StyledWrapper$5 = styled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n ", "\n"], ["\n ",
3160
+ "\n"])), function (_a) {
3161
+ var show = _a.show, palette = _a.theme.palette;
3162
+ return css(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ", "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "], ["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ",
3163
+ "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "])), show && css(templateObject_1$1g || (templateObject_1$1g = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n "], ["\n display: flex;\n align-items: center;\n justify-content: center;\n "]))), palette.blue[500], palette.white[100], palette.white[100], palette.grey[50], palette.grey[150], palette.grey[100]);
3164
+ });
3165
+ var templateObject_1$1g, templateObject_2$B, templateObject_3$k;
3166
+
3167
+ var getItemStyle = function (snapshot, draggableStyle) {
3168
+ return __assign({ userSelect: 'none', padding: '0.5rem 0 0.5rem 0', outline: "none" }, draggableStyle);
3169
+ };
3170
+ var getListStyle = function (isDraggingOver) { return ({
3171
+ position: 'relative',
3172
+ backgroundColor: isDraggingOver ? defaultTheme.palette.grey[50] : '',
3173
+ }); };
3174
+ var reorder = function (list, startIndex, endIndex) {
3175
+ var result = Array.from(list);
3176
+ var removed = result.splice(startIndex, 1)[0];
3177
+ result.splice(endIndex, 0, removed);
3178
+ return result;
3179
+ };
3180
+
3181
+ var UseDnd = function (_a) {
3182
+ var localProperties = _a.localProperties, onDragEnd = _a.onDragEnd, propertiesDisplayHandler = _a.propertiesDisplayHandler;
3183
+ return (React.createElement(DragDropContext, { onDragEnd: onDragEnd },
3184
+ React.createElement(Droppable, { droppableId: 'droppable' }, function (provided, snapshot) { return (React.createElement("div", __assign({}, provided.droppableProps, { ref: provided.innerRef, style: getListStyle(snapshot.isDraggingOver) }),
3185
+ localProperties.map(function (o, i) { return (React.createElement(Draggable, { key: o.id, draggableId: o.id, index: i, isDragDisabled: i === 0 }, function (provided, snapshot) { return (React.createElement("div", __assign({ className: 'draggable_element', ref: provided.innerRef }, provided.draggableProps, provided.dragHandleProps, { style: getItemStyle(snapshot, provided.draggableProps.style) }),
3186
+ React.createElement("div", { className: 'draggable__handle' },
3187
+ React.createElement(Icon, { icon: faEquals, className: 'icon' })),
3188
+ React.createElement("div", { className: 'draggable__checkbox' },
3189
+ React.createElement(Checkbox, { isDisabled: Boolean(o.deactivateActive) || i === 0, text: o.label, value: o.active, onClick: function () {
3190
+ propertiesDisplayHandler(o.id);
3191
+ } })))); })); }),
3192
+ provided.placeholder)); })));
3193
+ };
3194
+
3195
+ var CustomizationsModal = /** @class */ (function (_super) {
3196
+ __extends(CustomizationsModal, _super);
3197
+ function CustomizationsModal(props) {
3198
+ var _this = _super.call(this, props) || this;
3199
+ _this.propertiesDisplayHandler = function (id) {
3200
+ var localProperties = _this.state.localProperties;
3201
+ var newlocalProperties = localProperties.map(function (o) {
3202
+ if (o.id === id) {
3203
+ return __assign(__assign({}, o), { active: o.active === 'checked' ? 'unchecked' : 'checked' });
3204
+ }
3205
+ return o;
3206
+ });
3207
+ _this.setState({ localProperties: newlocalProperties });
3208
+ };
3209
+ _this.onDragEnd = function (result, provided) {
3210
+ var localProperties = _this.state.localProperties;
3211
+ var destination = result.destination, source = result.source;
3212
+ if (!result.destination) {
3213
+ return;
3214
+ }
3215
+ if (destination) {
3216
+ var newLocalProperties = reorder(localProperties, source.index, destination.index);
3217
+ _this.setState({
3218
+ localProperties: newLocalProperties,
3219
+ });
3220
+ }
3221
+ };
3222
+ _this.resetProperties = function () {
3223
+ var properties = _this.props.properties;
3224
+ var resettedProperties = properties.map(function (o) { return (__assign(__assign({}, o), { active: 'checked' })); });
3225
+ resettedProperties = _.orderBy(resettedProperties, 'position', 'asc');
3226
+ _this.setState({ localProperties: resettedProperties });
3227
+ };
3228
+ var properties = _this.props.properties;
3229
+ _this.state = {
3230
+ localProperties: __spreadArrays(properties),
3231
+ };
3232
+ return _this;
3233
+ }
3234
+ CustomizationsModal.prototype.render = function () {
3235
+ var _this = this;
3236
+ var _a = this.props, close = _a.close, modifyControlledPropertiesHandler = _a.modifyControlledPropertiesHandler, properties = _a.properties, show = _a.show, title = _a.title;
3237
+ var localProperties = this.state.localProperties;
3238
+ return (React.createElement(StyledWrapper$5, { show: show },
3239
+ React.createElement("div", { className: 'modal__container' },
3240
+ React.createElement("div", { className: 'modal__header' },
3241
+ React.createElement("div", null, title),
3242
+ React.createElement("div", null,
3243
+ React.createElement("p", { onClick: close },
3244
+ React.createElement(Icon, { icon: faTimes })))),
3245
+ React.createElement("div", { className: 'modal__body' },
3246
+ React.createElement(UseDnd, { onDragEnd: this.onDragEnd, localProperties: this.state.localProperties, propertiesDisplayHandler: this.propertiesDisplayHandler })),
3247
+ React.createElement("div", { className: 'modal__footer' },
3248
+ React.createElement("div", null,
3249
+ React.createElement("p", { className: 'link', onClick: this.resetProperties }, "Reimposta")),
3250
+ React.createElement("div", { className: 'buttons__container' },
3251
+ React.createElement(Button, { text: 'Annulla', color: 'grey', size: 'large', onClick: function () {
3252
+ _this.setState({ localProperties: properties });
3253
+ close();
3254
+ } }),
3255
+ React.createElement(Button, { text: 'Applica', size: 'large', onClick: function () {
3256
+ modifyControlledPropertiesHandler(localProperties);
3257
+ close();
3258
+ } }))))));
3259
+ };
3260
+ return CustomizationsModal;
3261
+ }(Component));
3262
+
3263
+ var LoadingTableRow = styled.tr(templateObject_1$1h || (templateObject_1$1h = __makeTemplateObject(["\n height: 49px;\n"], ["\n height: 49px;\n"])));
3264
+ var LoadingContent = function (props) {
3265
+ // Loading elments for the table
3266
+ var renderElements = function () {
3267
+ var rows = [];
3268
+ var cells = [];
3269
+ for (var tri = 0; tri < props.elmentsNumber; tri++) {
3270
+ cells.splice(0, cells.length);
3271
+ cells.push(React.createElement("td", { key: "tr-" + tri + "-td-" + 0 }));
3272
+ for (var tdi = 0; tdi < props.propsNumber; tdi++) {
3273
+ cells.push(React.createElement("td", { key: "tr-" + tri + "-td-" + (tdi + 1) },
3274
+ React.createElement("div", { className: 'linear-background' })));
3275
+ }
3276
+ cells.push(React.createElement("td", { key: "tr-" + tri + "-td-" + cells.length }));
3277
+ rows.push(React.createElement(LoadingTableRow, { key: "tr-" + tri }, cells));
3278
+ }
3279
+ return rows;
3280
+ };
3281
+ return React.createElement(React.Fragment, null, renderElements());
3282
+ };
3283
+ var templateObject_1$1h;
3284
+
3285
+ var Pagination$1 = function (props) {
3286
+ var managedCurrentPage = props.currentPage;
3287
+ var numberOfPages = Math.ceil(props.listSize / props.pageSize);
3288
+ if (managedCurrentPage > numberOfPages) {
3289
+ managedCurrentPage = numberOfPages;
3290
+ }
3291
+ var pageRage = _.range(managedCurrentPage - 3, managedCurrentPage + 4);
3292
+ var backActive = false;
3293
+ if (props.currentPage > 1 && Boolean(props.prevPageAction) && props.listSize) {
3294
+ backActive = true;
3295
+ }
3296
+ return (React.createElement("div", { className: 'pagination' },
3297
+ React.createElement("div", { onClick: function () {
3298
+ if (props.prevPageAction && backActive) {
3299
+ props.prevPageAction();
3300
+ }
3301
+ }, className: "pagination__element " + (backActive ? '' : 'deactivated') }, "Indietro"),
3302
+ !pageRage.includes(1) ? (React.createElement(React.Fragment, null,
3303
+ React.createElement("div", { onClick: function () {
3304
+ props.changePageAction(1);
3305
+ }, className: "pagination__element " + (props.currentPage === 1 ? "selected" : null) }, "1"),
3306
+ pageRage[0] - 1 !== 1 ? React.createElement("div", { className: "pagination__element" }, "...") : null)) : null,
3307
+ pageRage.map(function (o, i) {
3308
+ if (o > 0 && o <= numberOfPages) {
3309
+ return (React.createElement("div", { key: i, onClick: function () {
3310
+ props.changePageAction(o);
3311
+ }, className: "pagination__element " + (o === managedCurrentPage ? "selected" : null) }, o));
3312
+ }
3313
+ return null;
3314
+ }),
3315
+ !pageRage.includes(numberOfPages) ? (React.createElement(React.Fragment, null,
3316
+ numberOfPages - pageRage[pageRage.length - 1] !== 1 ? (React.createElement("div", { className: "pagination__element" }, "...")) : null,
3317
+ React.createElement("div", { onClick: function () {
3318
+ props.changePageAction(numberOfPages);
3319
+ }, className: "pagination__element " + (props.currentPage === numberOfPages ? "selected" : null) }, numberOfPages))) : null,
3320
+ React.createElement("div", { onClick: function () {
3321
+ if (props.nextPageAction && props.currentPage < numberOfPages) {
3322
+ props.nextPageAction();
3323
+ }
3324
+ }, className: "pagination__element " + (props.nextPageAction && props.currentPage >= numberOfPages ? 'deactivated' : '') }, "Avanti")));
3325
+ };
3326
+
3327
+ var UnstyledTable = /** @class */ (function (_super) {
3328
+ __extends(UnstyledTable, _super);
3329
+ function UnstyledTable(props) {
3330
+ var _this = _super.call(this, props) || this;
3331
+ _this.handleSelection = function (id) {
3332
+ var _a = _this.props, selectedList = _a.selectedList, selectionCallback = _a.selectionCallback;
3333
+ if (selectedList && selectionCallback) {
3334
+ if (selectedList.includes(id)) {
3335
+ var filtered = selectedList.filter(function (value) { return value !== id; });
3336
+ selectionCallback(filtered);
3337
+ }
3338
+ else {
3339
+ selectionCallback(__spreadArrays(selectedList, [id]));
3340
+ }
3341
+ }
3342
+ };
3343
+ _this.handleSelectAll = function (e) {
3344
+ var _a = _this.props, data = _a.data, selectedList = _a.selectedList, selectionCallback = _a.selectionCallback;
3345
+ if (selectedList) {
3346
+ var elementsIds_1 = __spreadArrays(selectedList);
3347
+ if (e.target.checked) {
3348
+ data.forEach(function (o) {
3349
+ if (!selectedList.includes(o.id)) {
3350
+ elementsIds_1.push(o.id);
3351
+ }
3352
+ });
3353
+ }
3354
+ else {
3355
+ data.forEach(function (o) {
3356
+ elementsIds_1 = elementsIds_1.filter(function (val) { return val !== o.id; });
3357
+ });
3358
+ }
3359
+ if (selectionCallback) {
3360
+ selectionCallback(elementsIds_1);
3361
+ }
3362
+ }
3363
+ };
3364
+ _this.handleSortOnProperty = function (id, type) {
3365
+ var propertiesFilter = _this.state.propertiesFilter;
3366
+ if (_.find(propertiesFilter, { id: id })) {
3367
+ var newPropertiesFilter = propertiesFilter.map(function (o) {
3368
+ if (o.id === id) {
3369
+ return __assign(__assign({}, o), { type: o.type === type ? false : type });
3370
+ }
3371
+ return o;
3372
+ });
3373
+ _this.setState({ propertiesFilter: __spreadArrays(newPropertiesFilter) });
3374
+ }
3375
+ else {
3376
+ var newPropertyFilter = { id: id, type: type };
3377
+ _this.setState({ propertiesFilter: __spreadArrays(propertiesFilter, [newPropertyFilter]) });
3378
+ }
3379
+ };
3380
+ _this.modifyControlledPropertiesHandler = function (properties) {
3381
+ var persistencyId = _this.props.persistencyId;
3382
+ modifyConfig(properties, persistencyId);
3383
+ _this.setState({ controlledProperties: properties });
3384
+ };
3385
+ _this.handlePopUpVisibility = function (rowId) {
3386
+ _this.setState({ currentActionsPopUp: rowId });
3387
+ };
3388
+ var persistency = getConfig(props.persistencyId);
3389
+ var controlledProperties = persistency
3390
+ ? mergePropertiesPersistency(props.properties, persistency)
3391
+ : props.properties.map(function (o, i) { return (__assign(__assign({}, o), { active: 'checked', position: i })); });
3392
+ _this.state = {
3393
+ propertiesFilter: [],
3394
+ showModalCustomize: false,
3395
+ controlledProperties: controlledProperties,
3396
+ };
3397
+ return _this;
3398
+ }
3399
+ UnstyledTable.prototype.render = function () {
3400
+ var _this = this;
3401
+ var _a = this.state, controlledProperties = _a.controlledProperties, propertiesFilter = _a.propertiesFilter, showModalCustomize = _a.showModalCustomize;
3402
+ var currentActionsPopUp = this.state.currentActionsPopUp;
3403
+ var _b = this.props, actions = _b.actions, className = _b.className, customizeModalTitle = _b.customizeModalTitle, data = _b.data, listSize = _b.listSize, pageSize = _b.pageSize;
3404
+ var _c = this.props, nextPageAction = _c.nextPageAction, prevPageAction = _c.prevPageAction;
3405
+ var _d = this.props, changePageAction = _d.changePageAction, currentPage = _d.currentPage;
3406
+ var _e = this.props, disableSelection = _e.disableSelection, isLoading = _e.isLoading, renderMobileRow = _e.renderMobileRow, selectedList = _e.selectedList;
3407
+ var _f = this.props, emptySetAction = _f.emptySetAction, emptySetIcon = _f.emptySetIcon, emptySetText = _f.emptySetText, emptySetTitle = _f.emptySetTitle;
3408
+ var filterPropertiesWithType = propertiesFilter.filter(function (o) { return o.type; });
3409
+ var filterPropertiesIds = filterPropertiesWithType.map(function (o) { return o.id; });
3410
+ var filterPropertiesTypes = filterPropertiesWithType.map(function (o) { return o.type; });
3411
+ var allChecked = isLoading ? false : true;
3412
+ if (selectedList && listSize > 0) {
3413
+ data.forEach(function (o) {
3414
+ if (!selectedList.includes(o.id)) {
3415
+ allChecked = false;
3416
+ }
3417
+ });
3418
+ }
3419
+ else {
3420
+ allChecked = false;
3421
+ }
3422
+ return (React.createElement("div", { className: className },
3423
+ window.innerWidth <= responsiveThresholds.tabletLandscape ? (React.createElement(ListMobile, { listSize: listSize, isLoading: isLoading, data: data, renderMobileRow: renderMobileRow })) : undefined,
3424
+ window.innerWidth > responsiveThresholds.tabletLandscape ? (React.createElement(React.Fragment, null,
3425
+ React.createElement("table", null,
3426
+ React.createElement(HeadDesktop, { isLoading: isLoading, allChecked: allChecked, setShowModalCustomizeTrue: function () { return _this.setState({ showModalCustomize: true }); }, handleSelectAll: this.handleSelectAll, controlledProperties: controlledProperties, propertiesFilter: propertiesFilter, handleSortOnProperty: this.handleSortOnProperty, actions: actions, disableSelection: disableSelection }),
3427
+ React.createElement("tbody", null,
3428
+ listSize && !isLoading
3429
+ ? _.orderBy(data, filterPropertiesIds, filterPropertiesTypes).map(function (o, i) { return (React.createElement(RowDesktop, { key: i, selectedList: selectedList, element: o, index: i, handleSelection: _this.handleSelection, controlledProperties: controlledProperties, actions: actions, handlePopUpVisibility: _this.handlePopUpVisibility, currentActionsPopUp: currentActionsPopUp, disableSelection: disableSelection })); })
3430
+ : null,
3431
+ isLoading ? (React.createElement(LoadingContent, { elmentsNumber: pageSize, propsNumber: controlledProperties.length })) : null)),
3432
+ listSize <= 0 && !isLoading && emptySetTitle ? (React.createElement("div", { className: 'pageEmptySet__container' },
3433
+ React.createElement(PageEmptySet, { icon: emptySetIcon, title: emptySetTitle, text: emptySetText, action: emptySetAction }))) : null,
3434
+ listSize ? (React.createElement(Pagination$1, { changePageAction: changePageAction, nextPageAction: nextPageAction, prevPageAction: prevPageAction, currentPage: currentPage, pageSize: pageSize, listSize: listSize })) : null,
3435
+ React.createElement(CustomizationsModal, { show: showModalCustomize, close: function () {
3436
+ _this.setState({ showModalCustomize: false });
3437
+ }, title: customizeModalTitle, properties: controlledProperties, modifyControlledPropertiesHandler: this.modifyControlledPropertiesHandler }))) : null));
3438
+ };
3439
+ return UnstyledTable;
3440
+ }(Component));
3441
+
3442
+ var StyledTableWrapper = styled(UnstyledTable)(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n table {\n overflow-x: scroll;\n width: 100%;\n white-space: nowrap;\n border-spacing: 0;\n table-layout: auto;\n position: relative;\n }\n\n td,\n th {\n text-align: left;\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n td {\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n }\n }\n\n ", "\n\n input[type='checkbox'] {\n cursor: pointer;\n }\n\n .table__value {\n white-space: normal;\n a {\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n }\n }\n\n .filter__active {\n }\n .filter__disabled {\n opacity: 0.5;\n }\n\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n ", "\n\n .pageEmptySet__container {\n margin-top: calc(", " * 2);\n }\n"], ["\n table {\n overflow-x: scroll;\n width: 100%;\n white-space: nowrap;\n border-spacing: 0;\n table-layout: auto;\n position: relative;\n }\n\n td,\n th {\n text-align: left;\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n td {\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n }\n }\n\n ",
3443
+ "\n\n input[type='checkbox'] {\n cursor: pointer;\n }\n\n .table__value {\n white-space: normal;\n a {\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n }\n }\n\n .filter__active {\n }\n .filter__disabled {\n opacity: 0.5;\n }\n\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n ",
3444
+ "\n\n .pageEmptySet__container {\n margin-top: calc(", " * 2);\n }\n"])), function (_a) {
3445
+ var disableSelection = _a.disableSelection, isHeaderFixed = _a.isHeaderFixed, isLoading = _a.isLoading, palette = _a.theme.palette;
3446
+ return css(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n thead {\n th {\n ", "\n z-index: 3;\n border-bottom: 2px solid ", ";\n background-color: ", ";\n color: ", ";\n font-weight: 500;\n border-right: 2px solid ", ";\n\n ", "\n &:last-child {\n cursor: pointer;\n color: ", ";\n }\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n padding: 0 1rem;\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n }\n }\n\n tbody {\n tr {\n &.selected {\n background-color: ", ";\n &:hover {\n background-color: ", ";\n }\n }\n ", "\n ", "\n }\n }\n "], ["\n thead {\n th {\n ",
3447
+ "\n z-index: 3;\n border-bottom: 2px solid ", ";\n background-color: ", ";\n color: ", ";\n font-weight: 500;\n border-right: 2px solid ", ";\n\n ",
3448
+ "\n &:last-child {\n cursor: pointer;\n color: ", ";\n }\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n padding: 0 1rem;\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n }\n }\n\n tbody {\n tr {\n &.selected {\n background-color: ", ";\n &:hover {\n background-color: ", ";\n }\n }\n ",
3449
+ "\n ",
3450
+ "\n }\n }\n "])), isHeaderFixed && css(templateObject_1$1i || (templateObject_1$1i = __makeTemplateObject(["\n position: sticky;\n top: 0;\n "], ["\n position: sticky;\n top: 0;\n "]))), palette.grey[200], palette.grey[50], palette.grey[500], palette.grey[100], !disableSelection && css(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "], ["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "]))), palette.black, palette.yellow[50], palette.yellow[100], !isLoading && css(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n "], ["\n &:hover {\n background-color: ", ";\n }\n "])), palette.grey[100]), !disableSelection && css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n }\n "], ["\n &:first-child {\n width: 20px;\n }\n "]))));
3451
+ }, function (_a) {
3452
+ var palette = _a.theme.palette;
3453
+ return palette.blue[500];
3454
+ }, function (_a) {
3455
+ var palette = _a.theme.palette;
3456
+ return css(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ", "\n "], ["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ", "\n "])), palette.grey[700], palette.white[100], palette.grey[700], linearBackground());
3457
+ }, spacing.xxxl);
3458
+ var templateObject_1$1i, templateObject_2$C, templateObject_3$l, templateObject_4$d, templateObject_5$8, templateObject_6$6, templateObject_7$6;
3459
+
3460
+ var Table = function (props) { return React.createElement(StyledTableWrapper, __assign({}, props)); };
3461
+
3462
+ var ActiveTag = styled.span(templateObject_1$1j || (templateObject_1$1j = __makeTemplateObject(["\n background: ", ";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"], ["\n background: ", ";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"])), function (_a) {
3463
+ var active = _a.active, theme = _a.theme;
3464
+ return (active ? theme.palette.primary[500] : 'transparent');
3465
+ }, function (_a) {
3466
+ var active = _a.active, theme = _a.theme;
3467
+ return (active ? theme.palette.primary[500] : theme.palette.grey[500]);
3468
+ }, function (_a) {
3469
+ var active = _a.active, theme = _a.theme;
3470
+ return (active ? theme.palette.primary[500] : theme.palette.grey[900]);
3471
+ });
3472
+ var templateObject_1$1j;
3473
+
3474
+ var Tab = styled.span(templateObject_1$1k || (templateObject_1$1k = __makeTemplateObject(["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"], ["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"])), function (_a) {
3475
+ var active = _a.active, theme = _a.theme;
3476
+ return (active ? theme.palette.primary[500] : theme.palette.grey[500]);
3477
+ }, function (_a) {
3478
+ var active = _a.active, theme = _a.theme;
3479
+ return (active ? theme.palette.primary[500] : theme.palette.grey[900]);
3480
+ });
3481
+ var templateObject_1$1k;
3482
+
3483
+ var Item$1 = function (_a) {
3484
+ var active = _a.active, handleClick = _a.handleClick, tabRef = _a.tabRef, text = _a.text;
3485
+ return (React.createElement(ItemWrapper, { ref: tabRef === null || tabRef === void 0 ? void 0 : tabRef(), onClick: handleClick },
3486
+ React.createElement(Tab, { active: active }, text),
3487
+ React.createElement(ActiveTag, { active: active })));
3488
+ };
3489
+ var ItemWrapper = styled.div(templateObject_1$1l || (templateObject_1$1l = __makeTemplateObject(["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"], ["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"])));
3490
+ var templateObject_1$1l;
3491
+
3492
+ var TabsWrapper = styled.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ", ";\n\n & > *:first-child {\n padding-left: ", "px;\n }\n\n & > *:last-child {\n padding-right: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"], ["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ",
3493
+ ";\n\n & > *:first-child {\n padding-left: ", "px;\n }\n\n & > *:last-child {\n padding-right: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"])), function (_a) {
3494
+ var hidden = _a.hidden;
3495
+ return hidden && css(templateObject_1$1m || (templateObject_1$1m = __makeTemplateObject(["\n visibility: hidden;\n position: absolute;\n "], ["\n visibility: hidden;\n position: absolute;\n "])));
3496
+ }, function (_a) {
3497
+ var lateralPadding = _a.lateralPadding;
3498
+ return lateralPadding;
3499
+ }, function (_a) {
3500
+ var lateralPadding = _a.lateralPadding;
3501
+ return lateralPadding;
3502
+ }, function (_a) {
3503
+ var distance = _a.distance;
3504
+ return distance;
3505
+ });
3506
+ var ScrollableTabsWrapper = styled(TabsWrapper)(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"], ["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"])));
3507
+ var templateObject_1$1m, templateObject_2$D, templateObject_3$m;
3508
+
3509
+ var useResizedWidth = function () {
3510
+ var _a = useMeasure(), elementsWrapperRef = _a[0], wrapperTmpWidth = _a[1].width;
3511
+ var _b = useState(0), wrapperWidth = _b[0], setWrapperWidth = _b[1];
3512
+ useDebounce(function () { return setWrapperWidth(wrapperTmpWidth); }, 250, [wrapperTmpWidth]);
3513
+ return { elementsWrapperRef: elementsWrapperRef, wrapperWidth: wrapperWidth };
3514
+ };
3515
+
3516
+ var useTabItemsCount = function (_a) {
3517
+ var distance = _a.distance, lateralPadding = _a.lateralPadding, tabsLength = _a.tabsLength, tabsRefs = _a.tabsRefs, wrapperWidth = _a.wrapperWidth;
3518
+ return useMemo(function () {
3519
+ var _a;
3520
+ var visibleCount = 0;
3521
+ var remainingSpace = wrapperWidth - 2 * lateralPadding;
3522
+ while (visibleCount !== tabsLength && remainingSpace > 0) {
3523
+ var nextTabWidth = (_a = tabsRefs[visibleCount].current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
3524
+ if (nextTabWidth && remainingSpace - (nextTabWidth + distance) > 0) {
3525
+ visibleCount++;
3526
+ remainingSpace -= nextTabWidth + distance;
3527
+ }
3528
+ else {
3529
+ remainingSpace = -1;
3530
+ }
3531
+ }
3532
+ return { visibleCount: visibleCount };
3533
+ }, [distance, lateralPadding, tabsLength, tabsRefs, wrapperWidth]);
3534
+ };
3535
+
3536
+ var TabsDropdownTrigger = function (_a) {
3537
+ var active = _a.active;
3538
+ return (React.createElement(Item$1, { active: active, text: React.createElement(DropdownIcon, { icon: faEllipsisH$1, fixedWidth: true }) }));
3539
+ };
3540
+ var DropdownIcon = styled(Icon)(templateObject_1$1n || (templateObject_1$1n = __makeTemplateObject(["\n height: 21px;\n"], ["\n height: 21px;\n"])));
3541
+ var templateObject_1$1n;
3542
+
3543
+ var TabsDropdown = function (_a) {
3544
+ var active = _a.active, tabs = _a.tabs;
3545
+ var renderTrigger = useCallback(function () { return React.createElement(TabsDropdownTrigger, { active: active }); }, [active]);
3546
+ var renderContent = useCallback(function (closeDropdown) { return (React.createElement(React.Fragment, null, tabs.map(function (_a, i) {
3547
+ var active = _a.active, handleClick = _a.handleClick, text = _a.text;
3548
+ return (React.createElement(Dropdown.Item, { key: i, text: text, active: active, onClick: function () {
3549
+ handleClick && handleClick();
3550
+ closeDropdown();
3551
+ } }));
3552
+ }))); }, [tabs]);
3553
+ return React.createElement(Dropdown$2, { placement: 'bottom-end', fullWidth: true, renderTrigger: renderTrigger, renderContent: renderContent });
3554
+ };
3555
+ var Dropdown$2 = styled(Dropdown)(templateObject_1$1o || (templateObject_1$1o = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
3556
+ var templateObject_1$1o;
3557
+
3558
+ var DropdownTabs = function (_a) {
3559
+ var className = _a.className, _b = _a.distance, distance = _b === void 0 ? 15 : _b, _c = _a.lateralPadding, lateralPadding = _c === void 0 ? 23 : _c, tabs = _a.tabs;
3560
+ var _d = useResizedWidth(), elementsWrapperRef = _d.elementsWrapperRef, wrapperWidth = _d.wrapperWidth;
3561
+ var _e = useState(0), refresh = _e[1];
3562
+ var tabsLength = tabs.length;
3563
+ var tabsRefs = useMemo(function () { return Array.from(Array(tabsLength), function () { return React.createRef(); }); }, [tabsLength]);
3564
+ var cbRef = useMemo(function () {
3565
+ return tabsRefs.map(function (ref) { return function () {
3566
+ refresh(function (n) { return n + 1; });
3567
+ return ref;
3568
+ }; });
3569
+ }, [tabsRefs]);
3570
+ var visibleCount = useTabItemsCount({
3571
+ distance: distance,
3572
+ tabsLength: tabsLength,
3573
+ wrapperWidth: wrapperWidth,
3574
+ tabsRefs: tabsRefs,
3575
+ lateralPadding: lateralPadding,
3576
+ }).visibleCount;
3577
+ var tabsItems = useMemo(function () { return tabs.map(function (attrs, i) { return React.createElement(Item$1, __assign({ key: i, tabRef: cbRef[i] }, attrs)); }); }, [tabs, tabsRefs]);
3578
+ var visibleItems = useMemo(function () { return tabs.slice(0, visibleCount).map(function (attrs, i) { return React.createElement(Item$1, __assign({ key: i }, attrs)); }); }, [tabs, visibleCount]);
3579
+ var dropdownItems = useMemo(function () { return tabs.slice(visibleCount); }, [tabs, visibleCount]);
3580
+ var dropdownVisible = dropdownItems.length !== 0;
3581
+ var dropdownActive = dropdownItems.some(function (e) { return e.active; });
3582
+ var isCalculatingSpace = wrapperWidth === 0;
3583
+ return (React.createElement(React.Fragment, null,
3584
+ React.createElement(StyledScrollableWrapper, { className: className, distance: distance, lateralPadding: lateralPadding, hidden: !isCalculatingSpace }, tabsItems),
3585
+ React.createElement(TabsWrapper, { className: className, distance: distance, lateralPadding: lateralPadding, hidden: isCalculatingSpace, ref: elementsWrapperRef },
3586
+ visibleItems,
3587
+ dropdownVisible && React.createElement(TabsDropdown, { active: dropdownActive, tabs: dropdownItems }))));
3588
+ };
3589
+ // Remove scrollbar on ScrollableWrapper used until real DropdownTabs is loaded
3590
+ var StyledScrollableWrapper = styled(ScrollableTabsWrapper)(templateObject_1$1p || (templateObject_1$1p = __makeTemplateObject(["\n overflow-x: hidden;\n"], ["\n overflow-x: hidden;\n"])));
3591
+ var templateObject_1$1p;
3592
+
3593
+ var ScrollableTabs = function (_a) {
3594
+ var className = _a.className, _b = _a.distance, distance = _b === void 0 ? 15 : _b, _c = _a.lateralPadding, lateralPadding = _c === void 0 ? 23 : _c, tabs = _a.tabs;
3595
+ var tabsItems = useMemo(function () { return tabs.map(function (attrs, i) { return React.createElement(Item$1, __assign({ key: i }, attrs)); }); }, [tabs]);
3596
+ return (React.createElement(ScrollableTabsWrapper, { className: className, distance: distance, lateralPadding: lateralPadding }, tabsItems));
3597
+ };
3598
+
3599
+ var ThemeProvider = function (_a) {
3600
+ var children = _a.children, theme = _a.theme;
3601
+ return (React.createElement(ThemeProvider$1, { theme: theme },
3602
+ React.createElement(React.Fragment, null, children)));
3603
+ };
3604
+
3605
+ var StyledTip = styled.div(templateObject_1$1q || (templateObject_1$1q = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"], ["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"])), function (_a) {
3606
+ var palette = _a.theme.palette;
3607
+ return palette.white[100];
3608
+ }, function (_a) {
3609
+ var palette = _a.theme.palette;
3610
+ return palette.primary[400];
3611
+ });
3612
+ var StyledLeftIcon = styled.span(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n margin-right: 8px;\n font-size: 20px;\n"], ["\n margin-right: 8px;\n font-size: 20px;\n"])));
3613
+ var StyledText = styled.span(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 21px;\n white-space: nowrap;\n"], ["\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 21px;\n white-space: nowrap;\n"])));
3614
+ var StyledCloseIcon$1 = styled.div(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ", ";\n }\n"], ["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ", ";\n }\n"])), function (_a) {
3615
+ var palette = _a.theme.palette;
3616
+ return palette.white[100];
3617
+ });
3618
+ var templateObject_1$1q, templateObject_2$E, templateObject_3$n, templateObject_4$e;
3619
+
3620
+ var defaultCloseIcon$1 = {
3621
+ icon: faTimes,
3622
+ };
3623
+ var Tip = function (props) {
3624
+ var className = props.className, closeIcon = props.closeIcon, leftIcon = props.leftIcon, onClose = props.onClose, renderCloseIcon = props.renderCloseIcon, text = props.text;
3625
+ return (React.createElement(StyledTip, { className: className },
3626
+ leftIcon && (React.createElement(StyledLeftIcon, null,
3627
+ React.createElement(Icon, __assign({}, leftIcon)))),
3628
+ React.createElement(StyledText, null, text),
3629
+ onClose && (React.createElement(StyledCloseIcon$1, { onClick: onClose }, renderCloseIcon ? renderCloseIcon() : React.createElement(Icon, __assign({}, (closeIcon || defaultCloseIcon$1), { fixedWidth: true }))))));
3630
+ };
3631
+
3632
+ var rocketIcon = {
3633
+ icon: faRocket,
3634
+ };
3635
+ var ShortcutTip = function (props) {
3636
+ var shortcut = props.shortcut, text = props.text, rest = __rest(props, ["shortcut", "text"]);
3637
+ return (React.createElement(Tip, __assign({ text: React.createElement(React.Fragment, null,
3638
+ text,
3639
+ " ",
3640
+ React.createElement("b", null, shortcut)), leftIcon: rocketIcon }, rest)));
3641
+ };
3642
+
3643
+ var StyledIconDiv = styled.div(templateObject_1$1r || (templateObject_1$1r = __makeTemplateObject(["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"], ["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"])));
3644
+ var StyledIcon$8 = styled(Icon)(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n vertical-align: sub;\n"], ["\n vertical-align: sub;\n"])));
3645
+ var StyledTitle$1 = styled.div(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n display: inline-block;\n height: 24px;\n margin-left: 8px;\n margin-right: 16px;\n margin-top: 16px;\n font-weight: 500;\n width: 256px;\n"], ["\n display: inline-block;\n height: 24px;\n margin-left: 8px;\n margin-right: 16px;\n margin-top: 16px;\n font-weight: 500;\n width: 256px;\n"])));
3646
+ var StyledContent$1 = styled.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"], ["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"])));
3647
+ var StyledAction = styled.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"], ["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"])));
3648
+ var StyledToast = styled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"], ["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"])));
3649
+ var StyledActionLabel = styled.label(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
3650
+ var templateObject_1$1r, templateObject_2$F, templateObject_3$o, templateObject_4$f, templateObject_5$9, templateObject_6$7, templateObject_7$7;
3651
+
3652
+ var typeMap$2 = {
3653
+ standard: 'dark',
3654
+ error: 'error',
3655
+ info: 'info',
3656
+ warning: 'warning',
3657
+ success: 'success',
3658
+ };
3659
+ var iconMap$2 = {
3660
+ dark: faInfoSquare,
3661
+ error: faExclamationTriangle,
3662
+ info: faInfoCircle,
3663
+ warning: faExclamationTriangle,
3664
+ success: faCheckCircle,
3665
+ };
3666
+ var ToastContent = function (props) { return (React.createElement(StyledToast, null,
3667
+ React.createElement(StyledIconDiv, null,
3668
+ React.createElement(StyledIcon$8, __assign({}, props.icon, { fixedWidth: true }))),
3669
+ React.createElement(StyledTitle$1, null,
3670
+ props.title,
3671
+ React.createElement(StyledAction, null,
3672
+ React.createElement(StyledActionLabel, { onClick: props.onActionClick }, props.actionLabel))),
3673
+ React.createElement(StyledContent$1, null, props.content))); };
3674
+ var show = function (title, options) {
3675
+ var _a;
3676
+ var type = options.type ? typeMap$2[options.type] : 'dark';
3677
+ var autoClose = options.autoClose === undefined ? 3000 : options.autoClose;
3678
+ var icon = options.icon || { icon: iconMap$2[type] };
3679
+ var size = ((_a = options.icon) === null || _a === void 0 ? void 0 : _a.size) || '1x';
3680
+ var newIcon = __assign(__assign({}, icon), { size: size });
3681
+ var toastId = toast[type](React.createElement(ToastContent, { title: title, content: options.content, icon: newIcon, actionLabel: options.actionLabel, onActionClick: options.onActionClick }), {
3682
+ autoClose: autoClose,
3683
+ closeButton: false,
3684
+ });
3685
+ return toastId && String(toastId);
3686
+ };
3687
+ var dismiss = function (toastId) {
3688
+ toast.dismiss(toastId);
3689
+ };
3690
+ var success = function (title, options) { return show(title, __assign(__assign({}, options), { type: 'success' })); };
3691
+ var error = function (title, options) { return show(title, __assign(__assign({}, options), { type: 'error' })); };
3692
+ var warning = function (title, options) { return show(title, __assign(__assign({}, options), { type: 'warning' })); };
3693
+ var standard = function (title, options) { return show(title, __assign(__assign({}, options), { type: 'standard' })); };
3694
+ var info = function (title, options) { return show(title, __assign(__assign({}, options), { type: 'info' })); };
3695
+
3696
+ var ToastContainer = styled(ToastContainer$1).attrs({
3697
+ hideProgressBar: true,
3698
+ newestOnTop: true,
3699
+ closeOnClick: false,
3700
+ draggable: false,
3701
+ rtl: false,
3702
+ })(templateObject_1$1s || (templateObject_1$1s = __makeTemplateObject(["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"], ["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"])));
3703
+ var templateObject_1$1s;
3704
+
3705
+ var Toast = {
3706
+ Container: ToastContainer,
3707
+ show: show,
3708
+ dismiss: dismiss,
3709
+ success: success,
3710
+ error: error,
3711
+ info: info,
3712
+ warning: warning,
3713
+ standard: standard,
3714
+ };
3715
+
3716
+ export { Accordion, AsyncCreatableSelect, AsyncSelect, Avatar, Badge, Banner, Button, Checkbox, Chip, ConfirmationModal, CreatableSelect, Drawer, Dropdown, DropdownTabs, GroupedList, Icon, IconBackground, IconButton, InlineMessage, InputHelper, InputText, MicroTag, Modal, ModalBody, ModalSearchable, PageEmptySet, Pagination, Progressbar, RadioButton, RadioButtonGroup, ScrollableTabs, Select, ShortcutTip, SidebarItem, Stepper, Table, Tag, TextArea, ThemeProvider, Tip, Toast, Tooltip, WithBadge, sidebarItemHeight, useCheckboxValue, useSelectMultiValues, useSelectValue };