quicksnack 3.32.0 → 3.34.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/dist/bundle.min.js +909 -0
  2. package/dist/index.d.ts +4 -3
  3. package/package.json +7 -3
  4. package/dist/UiProvider.js +0 -18
  5. package/dist/UiStateProvider.js +0 -47
  6. package/dist/UiWrapper.js +0 -23
  7. package/dist/animation/SlideInFromTop/SlideInFromTop.js +0 -38
  8. package/dist/animation/SlideOpen/SlideOpen.js +0 -52
  9. package/dist/components/Alert/Alert.js +0 -27
  10. package/dist/components/AnimatedCheckmark/AnimatedCheckmark.js +0 -50
  11. package/dist/components/Box/Box.js +0 -57
  12. package/dist/components/BreadCrumbs/BreadCrumbs.js +0 -14
  13. package/dist/components/CollapsiblePanel/CollapsiblePanel.js +0 -73
  14. package/dist/components/ConfirmButton/ConfirmButton.js +0 -44
  15. package/dist/components/ConfirmModal/ConfirmModal.js +0 -16
  16. package/dist/components/ConfirmModal/hooks/useConfirmModal.js +0 -26
  17. package/dist/components/Details/Details.js +0 -49
  18. package/dist/components/Dropdown/Dropdown.js +0 -79
  19. package/dist/components/Dropzone/Dropzone.js +0 -102
  20. package/dist/components/Feedback/Feedback.js +0 -31
  21. package/dist/components/Floater/Floater.js +0 -48
  22. package/dist/components/Floater/FloaterItem.js +0 -39
  23. package/dist/components/Footer/Footer.js +0 -21
  24. package/dist/components/HorizontalScroller/HorizontalScroller.js +0 -20
  25. package/dist/components/Menu/HamburgerButton.js +0 -15
  26. package/dist/components/Menu/Menu.js +0 -48
  27. package/dist/components/Menu/MenuCloseButton.js +0 -15
  28. package/dist/components/Menu/MenuSlideOpenIndicator.js +0 -22
  29. package/dist/components/Menu/SideBar.js +0 -59
  30. package/dist/components/Menu/SideBarHeader.js +0 -48
  31. package/dist/components/Menu/useCloseSidebarOnNavigate.js +0 -15
  32. package/dist/components/Menu/useToggleMobileMenu.js +0 -30
  33. package/dist/components/Modal/Modal.js +0 -51
  34. package/dist/components/Overlay/Overlay.js +0 -34
  35. package/dist/components/Paginator/Paginator.js +0 -41
  36. package/dist/components/Panel/Panel.js +0 -54
  37. package/dist/components/Section/Section.js +0 -22
  38. package/dist/components/Statistic/Statistic.js +0 -28
  39. package/dist/components/Table/Table.js +0 -83
  40. package/dist/components/Tabs/Tab.js +0 -70
  41. package/dist/components/Tabs/TabContent.js +0 -28
  42. package/dist/components/Tabs/Tabs.js +0 -14
  43. package/dist/components/Timeline/Timeline.js +0 -39
  44. package/dist/components/TopBar/TopBar.js +0 -24
  45. package/dist/fonts.js +0 -17
  46. package/dist/form/Button/Button.js +0 -85
  47. package/dist/form/Checkbox/Checkbox.js +0 -73
  48. package/dist/form/FileField/FileField.js +0 -98
  49. package/dist/form/PasswordStrengthField/PasswordStrenghField.js +0 -86
  50. package/dist/form/ScaffoldForm/FormGrid/FormGrid.js +0 -42
  51. package/dist/form/ScaffoldForm/FormGrid/FormGridCell.js +0 -69
  52. package/dist/form/ScaffoldForm/FormGrid/FormGridWrapper.js +0 -38
  53. package/dist/form/ScaffoldForm/ScaffoldField.js +0 -67
  54. package/dist/form/ScaffoldForm/ScaffoldForm.js +0 -44
  55. package/dist/form/ScaffoldForm/ScaffoldFormProvider.js +0 -13
  56. package/dist/form/ScaffoldForm/hooks/useScaffoldFormContext.js +0 -7
  57. package/dist/form/ScaffoldForm/scaffoldFormProps.js +0 -91
  58. package/dist/form/ScaffoldForm/scaffoldPasswordProps.js +0 -22
  59. package/dist/form/ScaffoldForm/types.js +0 -2
  60. package/dist/form/ScaffoldForm/utils/FormPositioner.js +0 -102
  61. package/dist/form/ScaffoldForm/utils/Grid.js +0 -64
  62. package/dist/form/ScaffoldForm/utils/Grid.test.js +0 -40
  63. package/dist/form/ScaffoldForm/utils/assertGridIsValid.js +0 -37
  64. package/dist/form/ScaffoldForm/utils/assertGridIsValid.test.js +0 -55
  65. package/dist/form/ScaffoldForm/utils/equalColumns.js +0 -20
  66. package/dist/form/Select/Select.js +0 -51
  67. package/dist/form/TextField/TextField.js +0 -68
  68. package/dist/index.js +0 -74
  69. package/dist/layouts/BasicLayout/BasicLayout.js +0 -47
  70. package/dist/layouts/FloatingPanelLayout/FloatingPanelLayout.js +0 -45
  71. package/dist/layouts/constants.js +0 -5
  72. package/dist/responsiveness/responsiveProps.js +0 -87
  73. package/dist/responsiveness/useResponsiveBreakpoints.js +0 -24
  74. package/dist/theme.js +0 -164
  75. package/dist/typography/Fonts.js +0 -19
  76. package/dist/typography/Header/Header.js +0 -79
  77. package/dist/typography/Paragraph/Paragraph.js +0 -13
@@ -0,0 +1,909 @@
1
+ var version=function(e,t,r,o,n,a,i,l,s){"use strict";
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
+ ***************************************************************************** */function c(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(r[o[n]]=e[o[n]])}return r}const d="rgba(0,0,0,.87)",p="#fff",m=(e,t,r)=>Object.entries(t).reduce(((t,[n,a])=>Object.assign(Object.assign({},t),{[n]:r.includes(n)?o.shade(e,a):a})),t),u=e=>{var{colorsToDarken:t}=e,r=c(e,["colorsToDarken"]);return{idle:r,hover:m(.1,r,t),active:m(.2,r,t)}},h=e=>({main:{idle:e,hover:m(.05,e,["background"])},alternate:{idle:m(.02,e,["background"]),hover:m(.05,e,["background"])}}),g={spacing:(...e)=>e.map((e=>4*e+"px")).join(" "),palette:{common:{black:d,white:p},colors:{blue:"#007bff",indigo:"#6610f2",purple:"#6f42c1",pink:"#e83e8c",red:"#e83e3e",orange:"#fd7e14",yellow:"#ffc107",green:"#23B294",teal:"#20c997",cyan:"#17a2b8",gray:"#6c757d",grayDark:"#343a40",light:"#f8f9fa",dark:"#343a40"},form:{hint:"#C7C7C7",error:"#9f3a38"},button:{basic:u({colorsToDarken:["background","text"],background:p,text:d}),default:u({colorsToDarken:["background","text"],background:"#e0e1e2",text:d}),text:{idle:{text:"#999c9e",background:"transparent"},active:{text:d,background:"transparent"},hover:{text:d,background:"transparent"}},danger:u({colorsToDarken:["background"],background:"#EC5969",text:p}),primary:u({colorsToDarken:["background"],background:"#2284C4",text:p}),secondary:u({colorsToDarken:["background"],background:"#23B294",text:p})},pane:{basic:h({text:d,background:p,border:"#ddd"}),emphasized:h({text:d,background:"#f3f3f3",border:"#ddd"}),info:h({text:"#0c5460",background:"#d1ecf1",border:"#bee5eb"}),negative:h({text:"#721c24",background:"#f8d7da",border:"#f5c6cb"}),positive:h({text:"#155724",background:"#d4edda",border:"#c3e6cb"}),warning:h({text:"#856404",background:"#fff3cd",border:"#ffeeba"})}}},f=r.ThemeProvider,b=({children:e,theme:r})=>t.createElement(f,{theme:r||g},e),x=()=>{},v=t.createContext({isSideMenuOpen:!1,closeSideMenu:x,openSideMenu:x}),w=()=>t.useContext(v),k=({children:e})=>{const[r,o]=t.useState(!1),n=t.useCallback((()=>o(!1)),[]),a=t.useCallback((()=>o(!0)),[]);return t.createElement(v.Provider,{value:{isSideMenuOpen:r,closeSideMenu:n,openSideMenu:a}},e)},$=r.div`
16
+ display: flex;
17
+ flex-direction: column;
18
+ height: 100%;
19
+ font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
20
+ color: ${e=>e.theme.palette.common.black};
21
+ font-size: 14px;
22
+ `,E=r.keyframes`
23
+ 0% {
24
+ opacity: 0;
25
+ transform: translateY(-5px);
26
+ }
27
+ 100% {
28
+ opacity: 1;
29
+ transform: translateY(0);
30
+ }
31
+ `,y=r.div.withConfig({shouldForwardProp:n})`
32
+ animation: ${E} ${e=>e.speed||".3s"} ease-in 0s 1;
33
+ `,C=r.css`
34
+ margin: 0 0;
35
+ padding: 0 0;
36
+ font-weight: 700;
37
+ line-height: 1.28571429em;
38
+ `,F={1:r.h1.withConfig({shouldForwardProp:n})`
39
+ font-size: 2rem;
40
+ min-height: 1rem;
41
+ ${C}
42
+ `,2:r.h2.withConfig({shouldForwardProp:n})`
43
+ font-size: 1.71428571rem;
44
+ ${C}
45
+ `,3:r.h3.withConfig({shouldForwardProp:n})`
46
+ font-size: 1.28571429rem;
47
+ ${C}
48
+ `,4:r.h4.withConfig({shouldForwardProp:n})`
49
+ font-size: 1.07142857rem;
50
+ ${C}
51
+ `,5:r.h5.withConfig({shouldForwardProp:n})`
52
+ font-size: 1rem;
53
+ ${C}
54
+ `},O=e=>{var{level:r=1}=e,o=c(e,["level"]);const n=F[r];return t.createElement(n,Object.assign({},o))},P=r.p`
55
+ font-size: 14px;
56
+ line-height: 20px;
57
+ // margin: 0 0 1em;
58
+ margin: 0;
59
+ `,j=["mobile","tablet","laptop","desktop"],S={mobile:0,tablet:768,laptop:1024,desktop:1430},D=(e,t)=>r.css`
60
+ @media screen and (min-width: ${S[e]}px) {
61
+ ${t}
62
+ }
63
+ `,M=e=>{if("object"!=typeof e)return!1;const t=Object.keys(e);for(const e of j)if(t.includes(e))return!0;return!1},z=(e,t)=>{const r=Object.entries(t).filter((([t])=>void 0!==e[t]&&!M(e[t]))).map((([t,r])=>r(e[t])));return[j.map((r=>{const o=Object.entries(t).filter((([t])=>{var o;return void 0!==(null===(o=null==e?void 0:e[t])||void 0===o?void 0:o[r])})).map((([t,o])=>o(e[t][r])));return o.length>0?D(r,o):void 0})).filter((e=>void 0!==e)),...r]},A=r.div.withConfig({shouldForwardProp:n})`
64
+ box-sizing: border-box;
65
+
66
+ ${e=>z(e,{p:t=>r.css`padding: ${e.theme.spacing(t)};`,pt:t=>r.css`padding-top: ${e.theme.spacing(t)};`,pr:t=>r.css`padding-right: ${e.theme.spacing(t)};`,pb:t=>r.css`padding-bottom: ${e.theme.spacing(t)};`,pl:t=>r.css`padding-left: ${e.theme.spacing(t)};`,m:t=>r.css`margin: ${e.theme.spacing(t)};`,mt:t=>r.css`margin-top: ${e.theme.spacing(t)};`,mr:t=>r.css`margin-right: ${e.theme.spacing(t)};`,mb:t=>r.css`margin-bottom: ${e.theme.spacing(t)};`,ml:t=>r.css`margin-left: ${e.theme.spacing(t)};`,display:e=>r.css`display: ${e};`,flexGrow:e=>r.css`flex-grow: ${e};`,flexShrink:e=>r.css`flex-shrink: ${e};`,flexDirection:e=>r.css`flex-direction: ${e};`,alignItems:e=>r.css`align-items: ${e};`,textAlign:e=>r.css`text-align: ${e};`,justifyContent:e=>r.css`justify-content: ${e};`,width:t=>r.css`width: ${"number"==typeof t?e.theme.spacing(t):t};`})}
67
+ `,L=r.div.withConfig({shouldForwardProp:n})`
68
+ border-radius: 4px;
69
+ border: 1px solid ${e=>e.theme.palette.pane[e.variant].main.idle.border};
70
+ background-color: ${e=>e.theme.palette.pane[e.variant].main.idle.background};
71
+ color: ${e=>e.theme.palette.pane[e.variant].main.idle.text};
72
+ `,R="#20c997",T=r.g`
73
+ fill: none;
74
+ stroke: ${R};
75
+ stroke-width: 10;
76
+ `,N=r.keyframes`
77
+ 0% {
78
+ stroke-dashoffset: 100px
79
+ }
80
+ 100% {
81
+ stroke-dashoffset: 0px
82
+ }
83
+ `,H=r.polyline`
84
+ stroke-dasharray: 100px, 100px;
85
+ stroke-dashoffset: 200px;
86
+ animation: ${N} 0.42s ease-in-out 0.8s backwards;
87
+ stroke: ${R};
88
+ stroke-width: 10;
89
+ `,B=r.keyframes`
90
+ 0% {
91
+ stroke-dashoffset: 480px
92
+ }
93
+ 100% {
94
+ stroke-dashoffset: 960px
95
+ }
96
+ `,G=r.circle`
97
+ stroke-dasharray: 480px, 480px;
98
+ stroke-dashoffset: 960px;
99
+ animation: ${B} 0.6s ease-in-out backwards;
100
+ stroke: ${R};
101
+ stroke-width: 10;
102
+ `,I=r.keyframes`
103
+ 0% {
104
+ opacity:0;
105
+ }
106
+ 100% {
107
+ opacity:100;
108
+ }
109
+ `,V=r.circle`
110
+ stroke-dasharray: 480px, 480px;
111
+ stroke-dashoffset: 960px;
112
+ animation: ${I} 1.2s ease-in-out 1.4s backwards;
113
+ fill: #effaf8;
114
+ `,W=()=>t.createElement("svg",{viewBox:"0 0 154 154"},t.createElement(T,null,t.createElement(G,{cx:"77",cy:"77",r:"72"}),t.createElement(V,{cx:"77",cy:"77",r:"72"}),t.createElement(H,{points:"43.5,77.8 63.7,97.9 112.2,49.4"}))),q=r.ul`
115
+ list-style: none;
116
+ padding: 0;
117
+ margin: 0;
118
+ display:flex;
119
+ `,U=r.li`
120
+ display: flex;
121
+
122
+ &:not(:last-of-type):after {
123
+ content: "/";
124
+ color: ${e=>e.theme.palette.colors.gray};
125
+ line-height: 1em;
126
+ content: "/";
127
+ margin: auto auto;
128
+ padding: ${e=>e.theme.spacing(0,2,0,0)};
129
+ }
130
+ `,Y=r.div`
131
+ background-color: ${e=>e.theme.palette.common.white};
132
+ border-radius: 4px;
133
+ border: 1px solid #DEDEDF;
134
+ box-shadow: 0px 2px 3px rgb(0 0 0 / 6%);
135
+ `,_=r(A)`
136
+ font-size: 12px;
137
+ font-style: italic;
138
+ `,X=r(A)`
139
+ ${e=>e.panelHasChildren&&r.css`
140
+ border-radius: 4px;
141
+ border-bottom: 1px solid rgba(34,36,38,.15);
142
+ `}
143
+
144
+ ${e=>!!e.onClick&&r.css`
145
+ cursor: pointer;
146
+ user-select: none;
147
+ `}
148
+ `,J=r(A)`
149
+ border-radius: 4px;
150
+ background-color: #FFF;
151
+ border-top: 1px solid rgba(34,36,38,.15);
152
+ `,Z=({children:e,className:r,title:o,titleAction:n,titleMeta:a,onClickTitle:i,footer:l,p:s=3,titleLevel:c=5})=>t.createElement(Y,{className:r},o&&t.createElement(X,{p:3,panelHasChildren:!!e,display:"flex",alignItems:"center",onClick:i},t.createElement(A,{flexGrow:1},t.createElement(O,{level:c},o)),a&&t.createElement(_,null,a),n&&t.createElement(A,{pl:5},n)),e&&t.createElement(A,{p:s},e),l&&t.createElement(J,{p:3},l)),K=r.div.withConfig({shouldForwardProp:n})`
153
+ transform: ${e=>e.isOpen?"translate(0)":"translateY(-101%)"};
154
+ transition-duration: ${e=>e.duration||.25}s;
155
+ transition-property: transform;
156
+ }
157
+ `,Q=r.div`
158
+ overflow: hidden;
159
+ `,ee=r.div.withConfig({shouldForwardProp:n})`
160
+ display: ${e=>e.isHidden?"none":"block"};
161
+ `,te=({isOpen:e,children:r,duration:o,onChange:n})=>{const a=(e=>{const[r,o]=t.useState(e);return t.useEffect((()=>{const t=setTimeout((()=>o(e)),0);return()=>clearTimeout(t)}),[e,o]),r})(e),[i,l]=t.useState(!e),s=t.useCallback((()=>{e||(l(!0),null==n||n(!1))}),[e,n]);return t.useEffect((()=>{e&&(l(!1),null==n||n(!0))}),[e,n]),t.createElement(Q,null,t.createElement(K,{isOpen:a,onTransitionEndCapture:s,duration:o},t.createElement(ee,{isHidden:i},r)))},re=r.div.withConfig({shouldForwardProp:n})`
162
+ transform: scaleY( ${e=>e.isOpen?"-1":"1"} );
163
+ `,oe=r(Z)`
164
+ ${e=>!e.isOpen&&r.css`border-bottom: 0;`}
165
+ `,ne=e=>{var{isInitiallyOpen:r,children:o,titleAction:n}=e,a=c(e,["isInitiallyOpen","children","titleAction"]);const[i,l]=t.useState(r),s=t.useCallback((()=>l(!i)),[l,i]);return t.createElement(oe,Object.assign({},a,{isOpen:i,onClickTitle:s,p:0,titleAction:t.createElement(re,{isOpen:i},n)}),t.createElement(te,{isOpen:i},t.createElement(A,{p:3},o)))},ae=r.keyframes`
166
+ 0% {
167
+ opacity: 0;
168
+ }
169
+ 100% {
170
+ opacity: 1;
171
+ }
172
+ `,ie=r.div`
173
+ position: fixed;
174
+ top: 0;
175
+ left: 0;
176
+ right: 0;
177
+ bottom: 0;
178
+ z-index: 10;
179
+ opacity: 0;
180
+ background-color: rgba(0,0,0,0.6);
181
+ animation: ${ae} 0.2s forwards;
182
+ `,le=r.div`
183
+ position: fixed;
184
+ top: 0;
185
+ left: 0;
186
+ right: 0;
187
+ bottom: 0;
188
+
189
+ display: flex;
190
+ align-items: center;
191
+ justify-content: center;
192
+
193
+ z-index: 50;
194
+ `,se=r(Z)`
195
+ box-shadow: 0 8px 8px 0 rgba(34,36,38,.15);
196
+ `,ce=r.div`
197
+ line-height: ${e=>e.theme.spacing(6)};
198
+ font-size: 15px;
199
+ `,de=e=>{var{children:r,handleClickOverlay:o,buttons:n}=e,a=c(e,["children","handleClickOverlay","buttons"]);return t.createElement(t.Fragment,null,t.createElement(ie,{onClick:o}),t.createElement(le,null,t.createElement(y,null,t.createElement(se,Object.assign({footer:n?t.createElement(A,{display:"flex",justifyContent:"flex-end"},n):void 0},a),r&&t.createElement(ce,null,r)))))},pe=r.div.withConfig({shouldForwardProp:n})`
200
+ ${e=>e.stretch&&"width: 100%;"}
201
+ ${e=>e.actionButton||e.stretch?r.css`margin: 0;`:r.css`margin: ${e=>e.theme.spacing(0,2,0,0)};`}
202
+ `,me=r.button.withConfig({shouldForwardProp:n})`
203
+ font-size: 14px;
204
+ font-weight: bold;
205
+ letter-spacing: 1px;
206
+ line-height: 1em;
207
+ outline: 0;
208
+ border: none;
209
+ border-radius: 4px;
210
+ cursor: pointer;
211
+ text-decoration: none;
212
+ font-family: "Open Sans", Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
213
+ transition: background-color .1s ease, color .1s ease;
214
+ display: flex;
215
+ flex-direction: row;
216
+ align-items: center;
217
+ user-select: none;
218
+ min-height: ${e=>e.inline?"auto":"38px"};
219
+
220
+ ${e=>e.stretch&&r.css`
221
+ width: 100%;
222
+ display: block;
223
+ `}
224
+
225
+ ${e=>e.actionButton&&r.css`
226
+ width: 100%;
227
+ ${D("laptop","width: auto")}
228
+ `}
229
+
230
+
231
+ ${e=>"text"!==e.variant?e.icon?e.hasChildren&&r.css`position: relative; padding: ${e.theme.spacing(3,5,3,13)};`:r.css`padding: ${e.theme.spacing(3,5)}; min-width: ${e=>e.theme.spacing(10)};`:r.css`font-weight: 700; padding: 0;`}
232
+
233
+ &:disabled {
234
+ opacity: .5;
235
+ cursor: default;
236
+ }
237
+
238
+ &:focus {
239
+ background-blend-mode: darken;
240
+ }
241
+
242
+ ${e=>{if("basic"===e.variant)return"\n border: 1px solid rgba(34,36,38,.15);\n "}}
243
+
244
+ ${e=>{var t;const{idle:r,hover:o,active:n}=g.palette.button[null!==(t=e.variant)&&void 0!==t?t:"default"];return`\n color: ${r.text};\n background-color: ${r.background}; \n \n &:not(:disabled) {\n &:hover, &:focus {\n color: ${o.text};\n background-color: ${o.background}; \n } \n \n &:active {\n color: ${n.text};\n background-color: ${n.background}; \n } \n }\n \n `}}
245
+ `,ue=r.span.withConfig({shouldForwardProp:n})`
246
+ ${e=>"text"!==e.variant&&r.css`
247
+ min-width: ${e.theme.spacing(10)};
248
+ `}
249
+
250
+ ${e=>"text"===e.variant?e.hasChildren&&r.css`
251
+ padding-right: ${e.theme.spacing(2)};
252
+ `:e.hasChildren&&r.css`
253
+ position: absolute;
254
+ left: 0;
255
+ top: 0;
256
+ width: ${e=>e.theme.spacing(10)};
257
+ height: 100%;
258
+ background-color: rgba(0,0,0,.05);
259
+
260
+ & > svg {
261
+ transform: translate(-50%, -50%);
262
+ position: absolute;
263
+ top: 50%;
264
+ left: 50%;
265
+ }
266
+ `}
267
+ `,he=t.forwardRef(((e,r)=>{var{children:o,icon:n,stretch:a}=e,i=c(e,["children","icon","stretch"]);return t.createElement(pe,{actionButton:i.actionButton,stretch:a},t.createElement(me,Object.assign({ref:r,icon:n,hasChildren:!!o,stretch:a},i),n&&t.createElement(ue,{variant:i.variant,hasChildren:!!o},n),o))})),ge=({title:e,children:r,cancelLabel:o="Nee, annuleren",confirmLabel:n="Ja",confirmVariant:a="secondary",confirmIcon:i,cancelIcon:l,isOpen:s,onCancel:c,onConfirm:d})=>s?t.createElement(de,{title:e,handleClickOverlay:c,buttons:t.createElement(t.Fragment,null,t.createElement(he,{"data-testid":"btn-cancel",onClick:c,variant:"basic",icon:l},o),t.createElement(he,{"data-testid":"btn-confirm",onClick:d,variant:a,icon:i},n))},r):null,fe=()=>{},be=r.table.withConfig({shouldForwardProp:n})`
268
+ border-radius: 4px;
269
+ width: 100%;
270
+ border-collapse: separate;
271
+ border-spacing: 0;
272
+
273
+ ${e=>z(e,{tableLayout:e=>r.css`table-layout: ${e};`})}
274
+ `,xe=r.tr.withConfig({shouldForwardProp:n})`
275
+ & > td {
276
+ transition: background-color .1s ease, color .1s ease;
277
+ }
278
+
279
+ ${e=>Object.entries(e.theme.palette.pane).map((([t,r])=>`\n &:nth-child(odd) > td.${t} { \n color: ${r.main.idle.text};\n background-color: ${r.main.idle.background}; \n } \n &:nth-child(even) > td.${t} { \n color: ${r.alternate.idle.text};\n background-color: ${r.alternate.idle.background}; \n } \n \n \n ${!e.disableHover&&`\n &:nth-child(odd):hover > td.${t} {\n color: ${r.main.hover.text};\n background-color: ${r.main.hover.background}; \n }\n &:nth-child(even):hover > td.${t} {\n color: ${r.alternate.hover.text};\n background-color: ${r.alternate.hover.background}; \n }\n `} \n `))}
280
+ `,ve=r.td.withConfig({shouldForwardProp:n})`
281
+ border-top: 1px solid rgba(34,36,38,.1);
282
+ border-right: 1px solid rgba(34,36,38,.1);
283
+ padding: ${e=>e.theme.spacing(2,3)};
284
+
285
+ &:last-of-type {
286
+ border-right: 0;
287
+ }
288
+
289
+ ${e=>z(e,{width:e=>r.css`width: ${e};`})}
290
+ `,we=r.th.withConfig({shouldForwardProp:n})`
291
+ border-right: 1px solid rgba(34,36,38,.1);
292
+ text-align: left;
293
+ padding: ${e=>e.theme.spacing(2,3)};
294
+ font-weight: 700;
295
+ transition: background-color .1s ease, color .1s ease;
296
+
297
+ &:last-of-type {
298
+ border-right: 0;
299
+ }
300
+
301
+ ${e=>!!e.variant&&r.css`
302
+ color: ${e.theme.palette.pane[e.variant].main.idle.text};
303
+ background-color: ${e.theme.palette.pane[e.variant].main.idle.background};
304
+
305
+ &:hover {
306
+ color: ${e.theme.palette.pane[e.variant].main.hover.text};
307
+ background-color: ${e.theme.palette.pane[e.variant].main.hover.background};
308
+ }
309
+ `}
310
+
311
+ ${e=>e.width?`width: ${e.width};`:""}
312
+
313
+ ${e=>e.sortable&&`\n cursor: pointer;\n user-select: none;\n \n &:hover { \n background-color: ${e.theme.palette.pane.basic.main.hover.background}; \n } \n `}
314
+
315
+ ${e=>e.sortDirection&&` \n position:relative;\n \n &:after {\n content: " ";\n position: absolute; \n right: 15px;\n top: 50%;\n \n height: 0;\n width: 0;\n border: 5px solid transparent;\n \n ${"asc"===e.sortDirection?"\n border-top-color: #000;\n transform: translateY(-25%);\n ":"\n border-bottom-color: #000;\n transform: translateY(-75%);\n "} \n } \n `}
316
+ `,ke=e=>t.createElement(be,Object.assign({},e));ke.Row=xe,ke.HeadCell=we;const $e=r(ke.Cell=e=>{var{variant:r,className:o}=e,n=c(e,["variant","className"]);return t.createElement(ve,Object.assign({className:`${o||""} ${r||"basic"}`},n))})`
317
+ ${e=>e.firstRow&&r.css` border-top: 0px !important;`}
318
+ ${e=>e.width&&r.css` width: ${e.width};`}
319
+ vertical-align: top;
320
+ `,Ee=r.div`
321
+ position: relative;
322
+ `,ye=r.span.withConfig({shouldForwardProp:n})`
323
+ border-radius: 4px;
324
+ border: 1px solid rgba(34,36,38,.15);
325
+ position: absolute;
326
+ box-shadow: 0 8px 8px 0 rgba(34,36,38,.15);
327
+ background-color: ${e=>e.theme.palette.common.white};
328
+ z-index: 100;
329
+
330
+ ${e=>"right"===e.align?r.css`right: 0;`:r.css`left: 0;`}
331
+ `,Ce=r.ul`
332
+ list-style: none;
333
+ margin: 0;
334
+ padding: ${e=>e.theme.spacing(2,0)};
335
+ `,Fe=r.li`
336
+ cursor: pointer;
337
+ padding: ${e=>e.theme.spacing(0,3)};
338
+ &:hover {
339
+ background-color: #ddd;
340
+ }
341
+ `,Oe=r.input`
342
+ display: none;
343
+ `,Pe=r.div.withConfig({shouldForwardProp:n})`
344
+ display: flex;
345
+ flex-direction: column;
346
+ align-items: center;
347
+ justify-content: center;
348
+ border-radius: 4px;
349
+ height: ${e=>e.theme.spacing(25)};
350
+
351
+ border-radius: 4px;
352
+ border: 1px solid rgba(34,36,38,.15);
353
+
354
+ & > * {
355
+ pointerEvents: none;
356
+ }
357
+
358
+ ${e=>e.isReadyToDrop&&r.css`
359
+ background-color: #FAFAFA;
360
+ `}
361
+ `,je=r(A)`
362
+ width: 300px;
363
+ `,Se={laptop:1},De={mobile:1,laptop:0},Me={laptop:1},ze=e=>{var{stretch:r,laptopWidth:o}=e,n=c(e,["stretch","laptopWidth"]);const a=t.useMemo((()=>({laptop:o})),[o]);return t.createElement(A,Object.assign({flexGrow:r?Me:void 0,width:a,pt:De,pb:De,pl:Se,pr:Se},n))},Ae={laptop:-1},Le={mobile:-1,laptop:0},Re={mobile:"block",laptop:"flex"},Te=r(A)`
364
+ float: left;
365
+
366
+ height: 100%;
367
+ width: 100%;
368
+
369
+ background-color: #243646;
370
+
371
+ position: fixed;
372
+ top: 0;
373
+ left: 0;
374
+ right: 0;
375
+ bottom: 0;
376
+
377
+ z-index: 900;
378
+
379
+ display: ${e=>e.isMobileMenuOpen?"block":"none"};
380
+ pointer-events: auto;
381
+
382
+ ${D("laptop",r.css`
383
+ position: static;
384
+ display: block;
385
+ width: auto;
386
+ min-width: ${e=>{var t;return e.theme.spacing(null!==(t=e.minWidth)&&void 0!==t?t:75)}};
387
+ box-shadow: 2px 0px 6px -1px rgba(0,0,0,0.74);
388
+
389
+ transition: transform .1s ease-out;
390
+ transform: ${e=>e.isDesktopMenuOpen?"transform: translateX(0);":r.css`translateX(calc(-100% + ${e=>e.theme.spacing(15)}));`};
391
+
392
+ & ul {
393
+ opacity: ${e=>e.isDesktopMenuOpen?"1":"0"};
394
+ }
395
+ `)}
396
+ `,Ne=e=>{const{closeSideMenu:r,openSideMenu:o,isSideMenuOpen:n}=w();return t.createElement(Te,Object.assign({isDesktopMenuOpen:n},e,{onMouseEnter:o,onMouseLeave:r}))},He=r(A)`
397
+ background-color: ${e=>e.theme.palette.common.white};
398
+ border-top: 1px solid #DDDDDD;
399
+ box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.04);
400
+ box-sizing: border-box;
401
+ `,Be=({children:e})=>t.createElement(He,{pt:2,pb:2,pr:5,pl:{mobile:5,laptop:20}},e),Ge=r(A)`
402
+ overflow-x: auto;
403
+ overflow-y: hidden;
404
+ `,Ie=r(he)`
405
+ margin-right: ${e=>e.theme.spacing(3)};
406
+ ${D("laptop","display: none;")}
407
+ `,Ve=r.ul`
408
+ padding: 0;
409
+ margin: 0;
410
+ list-style: none;
411
+ `,We=r.li.withConfig({shouldForwardProp:n})`
412
+ padding: ${e=>e.theme.spacing(.5,5)};
413
+
414
+ ${e=>e.isOpen&&r.css`
415
+ border-left: ${e.theme.spacing(1)} solid ${e.theme.palette.colors.blue};
416
+ background: #293846;
417
+
418
+ & > * {
419
+ margin-left: ${e.theme.spacing(-1)};
420
+ }
421
+ `}
422
+
423
+ & button:hover, & button:active, & button:focus {
424
+ color: ${e=>e.theme.palette.common.white} !important;
425
+ }
426
+
427
+ & button {
428
+ width: 100%;
429
+ }
430
+
431
+ ${e=>e.isActive&&r.css`
432
+ & button {
433
+ color: ${e.theme.palette.common.white};
434
+ }
435
+ `}
436
+ `,qe=r(he)`
437
+ ${D("laptop","display: none;")}
438
+ `,Ue=r(A)`
439
+ display: none;
440
+ ${D("laptop","display: flex;")}
441
+
442
+ height: 100%;
443
+ flex-direction: row;
444
+ align-items: center;
445
+
446
+ width: ${e=>e.theme.spacing(15)};
447
+
448
+ & > svg {
449
+ margin: 0 auto;
450
+ }
451
+
452
+ ${Te}:hover & {
453
+ display:none;
454
+ }
455
+ `,Ye=r(A)`
456
+ box-sizing: border-box;
457
+ color: ${e=>e.theme.palette.button.text.idle.text};
458
+ font-weight: bold;
459
+
460
+ display: flex;
461
+ text-align: center;
462
+
463
+ font-size: 14px;
464
+ font-weight: bold;
465
+ letter-spacing: 1px;
466
+ line-height: 1em;
467
+
468
+ background-color: rgba(0,0,0,.2);
469
+
470
+ ${D("laptop",r.css`
471
+ min-height: ${e=>e.theme.spacing(12)};
472
+ `)}
473
+ `,_e=()=>{const[e,r]=t.useState(window.innerWidth);t.useEffect((()=>{const e=()=>r(window.innerWidth);return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)}),[]);return t.useMemo((()=>({isMobile:e>=S.mobile,isTablet:e>=S.tablet,isLaptop:e>=S.laptop,isDesktop:e>=S.desktop})),[e])},Xe=r.div`
474
+ display: flex;
475
+ `,Je=r.button.withConfig({shouldForwardProp:n})`
476
+ user-select:none;
477
+ cursor: pointer;
478
+
479
+ min-height: ${e=>e.theme.spacing(8)};
480
+ padding: .2em 1.3em .2em;
481
+ margin: 0;
482
+ line-height: 1em;
483
+ outline: 0;
484
+ border: 1px solid rgba(34,36,38,.15);
485
+
486
+ font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
487
+ background-color: ${e=>e.active?"#F2F2F2":"#fff"};
488
+
489
+ &:not(:first-of-type) {
490
+ border-left: 0;
491
+ }
492
+
493
+ ${e=>!e.disabled&&"\n &:hover { \n background-color: #E9E9E9; \n }\n "}
494
+ `,Ze=r.div.withConfig({shouldForwardProp:n})`
495
+ display: flex;
496
+ border-radius: ${e=>e.theme.spacing(1)};
497
+ padding: ${e=>e.theme.spacing(4)};
498
+ background-color: ${e=>e.theme.palette.colors[e.backgroundColor]};
499
+ box-sizing: border-box;
500
+ height: 100%;
501
+ `,Ke=r.div`
502
+ text-transform: uppercase;
503
+ color: ${e=>e.theme.palette.common.white};
504
+ font-size: ${e=>e.theme.spacing(3)};
505
+ `,Qe=r.div.withConfig({shouldForwardProp:n})`
506
+ color: ${e=>e.theme.palette.common.white};
507
+ font-weight: bold;
508
+ font-size: ${e=>e.theme.spacing(e.smallerValue?5.5:7.5)};
509
+ `,et=r.div`
510
+ margin: ${e=>e.theme.spacing(1)} 0 auto 0;
511
+ & svg {
512
+ height: 100%;
513
+ width: ${e=>e.theme.spacing(10)};
514
+ color: white;
515
+ }
516
+ `,tt=r(A)`
517
+
518
+ padding: ${e=>e.theme.spacing(2.5,5)};
519
+
520
+ ${e=>!e.isActive&&r.css`
521
+ cursor: pointer;
522
+ color: #337ab7;
523
+ &:hover,
524
+ &:focus {
525
+ color: #23527c;
526
+ text-decoration: underline;
527
+ }
528
+ `}
529
+
530
+ ${e=>e.isActive&&r.css`
531
+ font-weight: bold;
532
+ border: 1px solid rgba(34,36,38,.15);
533
+ border-bottom: 0px;
534
+ margin-bottom: -1px;
535
+ border-top-left-radius: 4px;
536
+ border-top-right-radius: 4px;
537
+ background-color: ${e=>e.theme.palette.common.white};
538
+ `}
539
+
540
+ ${e=>e.variant&&`\n font-weight: bold;\n color: ${e.theme.palette.form[e.variant]};\n &:hover {\n color: ${e.theme.palette.form[e.variant]};\n }\n `}
541
+
542
+ `,rt=r(A)`
543
+ background-color: ${e=>e.theme.palette.common.white};
544
+ border: 1px solid rgba(34,36,38,.15);
545
+ border-top: 0px;
546
+ `,ot=r(A)`
547
+ display: flex;
548
+ border-bottom: 1px solid rgba(34,36,38,.15);
549
+ `,nt=r(Z)`
550
+ box-shadow: none;
551
+ `,at=r(A)`
552
+ display: flex;
553
+
554
+ &:last-of-type .line:before {
555
+ background: none;
556
+ }
557
+ `,it=r(A)`
558
+ position: relative;
559
+ margin-right: ${e=>e.theme.spacing(4)};
560
+ top: 4px;
561
+
562
+ &:before {
563
+ background: #e7eaec;
564
+ content: '';
565
+ position: absolute;
566
+ top: 0;
567
+ left: ${e=>e.theme.spacing(4.5)};
568
+ height: 100%;
569
+ width: ${e=>e.theme.spacing(1)};
570
+ }
571
+
572
+ `,lt=r.div.withConfig({shouldForwardProp:n})`
573
+ position: relative;
574
+ background-color: ${e=>e.color};
575
+ color: #fff;
576
+
577
+ left: 0;
578
+ width: ${e=>e.theme.spacing(10)};
579
+ height: ${e=>e.theme.spacing(10)};
580
+ border-radius: 50%;
581
+ font-size: ${e=>e.theme.spacing(4)};
582
+
583
+ & > * {
584
+ position: absolute;
585
+ top: 50%;
586
+ left: 50%;
587
+ transform: translate(-50%, -50%);
588
+ }
589
+ `,st=r(A)`
590
+ background-color: #FFFFFF;
591
+ border-bottom: 1px solid #DDDDDD;
592
+ box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.04);
593
+ box-sizing: border-box;
594
+ `,ct=({left:e,right:r})=>t.createElement(st,null,t.createElement(A,{display:"flex",alignItems:"center",pb:1,pt:1,pr:5,pl:{mobile:5,laptop:20}},t.createElement(A,{flexGrow:1,display:"flex",pl:2},e),t.createElement(A,{flexGrow:1,display:"flex",justifyContent:"flex-end"},r))),dt=r.label`
595
+ position: relative;
596
+ `,pt=r.input.withConfig({shouldForwardProp:n})`
597
+ position: absolute;
598
+ top: 0;
599
+ left: 0;
600
+
601
+ width: 17px;
602
+ height: 17px;
603
+
604
+ z-index: 99;
605
+ opacity: 0;
606
+ margin-right: ${e=>e.theme.spacing(2)};
607
+ transform: translateY(1px);
608
+
609
+ &~span {
610
+ user-select: none;
611
+ padding-left: 1.85714em;
612
+ cursor: pointer;
613
+ font-size: .92857143em;
614
+ }
615
+
616
+ &~span:before, &~span:after {
617
+ position: absolute;
618
+ top: 0;
619
+ left: 0;
620
+ width: 17px;
621
+ height: 17px;
622
+ line-height: 17px;
623
+ content: '';
624
+ border-radius: 4px;
625
+ border: 1px solid rgba(34,36,38,.15);
626
+ z-index:0;
627
+ }
628
+
629
+ &:checked~span {
630
+ font-style: italic;
631
+ }
632
+
633
+ &:checked~span:before {
634
+ background: #fff;
635
+ border-color: rgba(34,36,38,.35);
636
+ }
637
+
638
+ &:checked~span:after {
639
+ font-style: normal;
640
+ text-align: center;
641
+ content: '\\2714';
642
+ opacity: 1;
643
+ color: ${e=>e.theme.palette.common.black}
644
+ }
645
+
646
+ &:focus~span:before, &:focus~span:after {
647
+ border-color: #85b7d9;
648
+ border-radius: 4px;
649
+ background: #fff;
650
+ box-shadow: 0 0 0 0 rgba(34,36,38,.35) inset;
651
+ }
652
+
653
+ &.error~span {
654
+ color: ${e=>e.theme.palette.form.error};
655
+ }
656
+
657
+ &.error~span:before, &.error~span:after {
658
+ background: #fff6f6;
659
+ border-color: #e0b4b4;
660
+ color: #9f3a38;
661
+ }
662
+ `,mt=r.span.withConfig({shouldForwardProp:n})`
663
+ ${e=>e.dimmed?r.css`color: #999c9e;`:""}
664
+ `,ut=t.forwardRef(((e,r)=>{var{options:o,spacing:n=1,name:a,dimmed:i}=e,l=c(e,["options","spacing","name","dimmed"]);return t.createElement(t.Fragment,null,Object.entries(o).map((([e,o])=>t.createElement(A,{key:e,mt:n,mb:n},t.createElement(dt,{key:e},t.createElement(pt,Object.assign({type:"checkbox",value:e,name:a,ref:r},l)),t.createElement(mt,{dimmed:i},o))))))})),ht=r.css`
665
+ padding: .67857143em 1em;
666
+ line-height: 1.21428571em;
667
+ border-radius: 4px;
668
+ border: 1px solid rgba(34,36,38,.15);
669
+
670
+ color: ${e=>e.theme.palette.common.black};
671
+ font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
672
+
673
+ font-size: 1em;
674
+ outline: none;
675
+
676
+ &:disabled, &:read-only {
677
+ background-color: #FAFAFA;
678
+ }
679
+
680
+ &:focus {
681
+ color: rgba(0,0,0,.95);
682
+ border-color: #85b7d9;
683
+ background: #fff;
684
+ box-shadow: 0 0 0 0 rgba(34,36,38,.35) inset;
685
+ }
686
+
687
+ &.error {
688
+ background: #fff6f6;
689
+ border-color: #e0b4b4;
690
+ color: #9f3a38;
691
+ }
692
+
693
+ &.error:focus {
694
+ background: #fff6f6;
695
+ }
696
+
697
+ &:focus::placeholder {
698
+ color:rgba(115,115,115,.87)
699
+ }
700
+
701
+ &::placeholder {
702
+ color:rgba(191,191,191,.87);
703
+ }
704
+
705
+ &.error::placeholder {
706
+ color: #e7bdbc;
707
+ }
708
+
709
+ &.error:focus::placeholder {
710
+ color: #da9796;
711
+ }
712
+ `,gt=r.input.withConfig({shouldForwardProp:n})`
713
+ ${ht}
714
+ `,ft=r.textarea.withConfig({shouldForwardProp:n})`
715
+ ${ht}
716
+ height: 100%;
717
+ `,bt=t.forwardRef(((e,r)=>{var{multiline:o=!1}=e,n=c(e,["multiline"]);return o?t.createElement(ft,Object.assign({ref:r},n)):t.createElement(gt,Object.assign({ref:r,type:"text"},n))})),xt=r.div`
718
+ position: relative;
719
+ display: flex;
720
+ `,vt=r.input.withConfig({shouldForwardProp:n})`
721
+ position: absolute;
722
+ left: 0;
723
+ right: 0;
724
+ top: 0;
725
+ bottom: 0;
726
+ width: 100%;
727
+ opacity:0;
728
+ `,wt=r(he)`
729
+ height: 40px;
730
+
731
+ .has-error & {
732
+ background: #fff6f6;
733
+ border-color: #e0b4b4;
734
+ color: #9f3a38;
735
+ }
736
+ `,kt=r(bt)`
737
+ flex: 1;
738
+ padding-right: ${e=>e.theme.spacing(8)}
739
+ `,$t=r.button`
740
+ background-color: transparent;
741
+ border: 0;
742
+ outline: 0;
743
+ padding: 0;
744
+
745
+ position: absolute;
746
+ right: 0;
747
+ height: 100%;
748
+
749
+ cursor: pointer;
750
+
751
+ &:after {
752
+ box-sizing: border-box;
753
+
754
+ color: rgba(0, 0, 0, .3);
755
+ content: "×";
756
+
757
+ text-align: center;
758
+ vertical-align: middle;
759
+ display: table-cell;
760
+
761
+ font-size: 20px;
762
+ height: 38px;
763
+ width: 38px;
764
+ line-height: 38px;
765
+ padding: 0 8px;
766
+ }
767
+ `,Et=t.forwardRef(((e,r)=>{var{className:o,placeholder:n,chooseFileLabel:a="Choose file",changeFileLabel:i="Change file",onClear:l}=e,s=c(e,["className","placeholder","chooseFileLabel","changeFileLabel","onClear"]);const[d,p]=t.useState(),[m,u]=t.useState(""),h=t.useCallback((e=>{var t;const r=(null==e?void 0:e.target).files;u((null===(t=null==r?void 0:r[0])||void 0===t?void 0:t.name)||"")}),[]),g=t.useCallback((()=>{d&&(d.value="",d.files=null,d.dispatchEvent(new Event("change",{bubbles:!0})),l&&l())}),[d,l]),f=t.useMemo((()=>e=>{null==e||e.addEventListener("change",h),p(e),"function"==typeof r&&(null==r||r(e))}),[r,h]);return t.createElement(xt,null,t.createElement(vt,Object.assign({type:"file",ref:f},s)),t.createElement(wt,{variant:"basic"},m?i:a),t.createElement(kt,{placeholder:n,className:o,disabled:!0,value:m}),!!m&&l&&t.createElement($t,{"data-testid":"file-clear",onClick:g}))})),yt=r.div`
768
+ position: relative;
769
+ `,Ct=r.select.withConfig({shouldForwardProp:n})`
770
+ width: 100%;
771
+
772
+ padding: .67857143em 1em;
773
+ line-height: 1.21428571em;
774
+ border-radius: 4px;
775
+ border: 1px solid rgba(34,36,38,.15);
776
+
777
+ color: ${e=>e.theme.palette.common.black};
778
+ font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
779
+
780
+ font-size: 1em;
781
+ outline: none;
782
+
783
+ appearance: none;
784
+
785
+ &.error {
786
+ background: #fff6f6;
787
+ border-color: #e0b4b4;
788
+ color: #9f3a38;
789
+ }
790
+
791
+ &.error~div {
792
+ color: #9f3a38;
793
+ }
794
+ `,Ft=r.div`
795
+ pointer-events: none;
796
+ padding: 0 1em;
797
+ position:absolute;
798
+ height: 100%;
799
+ top: 0;
800
+ right: 0;
801
+ font-size: 17px;
802
+ line-height: 40px;
803
+ `,Ot=t.forwardRef(((e,r)=>{var{options:o}=e,n=c(e,["options"]);const a=Array.isArray(o)?o:Object.entries(o);return t.createElement(yt,null,t.createElement(Ct,Object.assign({ref:r},n),a.map((([e,r])=>t.createElement("option",{key:e,value:e},r)))),t.createElement(Ft,null,"▾"))})),Pt=e=>e.length>=8,jt=e=>/\d/.test(e),St=e=>/[a-z]/.test(e)&&/[A-Z]/.test(e),Dt=e=>/[-’/`~!#*$@_%+=.,^&(){}[\]|;:”<>?\\]/.test(e),Mt=[Pt,jt,St,Dt],zt=Mt.length+1,At=e=>Mt.map((t=>t(e))).reduce(((e,t)=>t?e+1:e),1),Lt=r.div`
804
+ margin-top: ${e=>e.theme.spacing(1)};
805
+ height: 3px;
806
+ background-color: #f5f5f5;
807
+ border-radius: 4px;
808
+ box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
809
+ `,Rt=r.div.withConfig({shouldForwardProp:n})`
810
+ width: ${e=>e.score?e.score/zt*100:0}%;
811
+ height: 100%;
812
+ background-color: ${e=>e.score<=2?"#e90f10":e.score<=3?"#ffad00":"#02b502"} ;
813
+ transition: width .6s ease, background-color .6s ease;
814
+ `,Tt=t.forwardRef(((e,r)=>{const[o,n]=t.useState(0),a=t.useCallback((e=>{const t=e.target;n(t.value?At(t.value):0)}),[]),i=t.useMemo((()=>e=>{null==e||e.addEventListener("keyup",a),"function"==typeof r&&(null==r||r(e))}),[r,a]);return t.createElement(t.Fragment,null,t.createElement(bt,Object.assign({},e,{type:"password",ref:i})),t.createElement(Lt,null,t.createElement(Rt,{score:o})))})),Nt=r.div.withConfig({shouldForwardProp:n})`
815
+ margin: 0px 8px;
816
+
817
+ ${e=>void 0!==e.rowOffset&&r.css`
818
+ display: flex;
819
+ flex-direction: column;
820
+ margin-bottom: 16px;`}
821
+
822
+ align-self: ${e=>void 0===e.rowOffset?"end":"initial"};
823
+ -ms-grid-row-align: ${e=>void 0===e.rowOffset?"end":"initial"};
824
+
825
+ ${e=>z(e,{align:e=>r.css`text-align: ${e};`,position:t=>{var o;return((e,t)=>{const o=[];return void 0===e||(void 0!==e.row&&o.push(r.css`
826
+ grid-row-start: ${2*e.row+1+t};
827
+ -ms-grid-row: ${2*e.row+1+t};
828
+ `),e.rowSpan&&t&&o.push(r.css`
829
+ grid-row-end: span ${2*e.rowSpan-1};
830
+ -ms-grid-row-span: ${2*e.rowSpan-1};
831
+ `),void 0!==e.column&&o.push(r.css`
832
+ grid-column-start: ${e.column+1};
833
+ -ms-grid-column: ${e.column+1};
834
+ `),void 0!==e.columnSpan&&o.push(r.css`
835
+ grid-column-end: span ${e.columnSpan};
836
+ -ms-grid-column-span: ${e.columnSpan};
837
+ `)),o})(t,null!==(o=e.rowOffset)&&void 0!==o?o:0)}})}
838
+ `;Nt.displayName="FormGridCell";const Ht=r.label.withConfig({shouldForwardProp:n})`
839
+ display: block;
840
+ color: ${e=>e.error?e.theme.palette.form.error:e.theme.palette.common.black} ;
841
+ font-weight: bold;
842
+ margin: ${e=>e.theme.spacing(0,0,1,0)};
843
+ line-height: 1.4em;
844
+ font-size: .92857143em;
845
+ `,Bt=r.div.withConfig({shouldForwardProp:n})`
846
+ color: ${e=>e.error?"#da9796;":e.theme.palette.form.hint};
847
+ margin: ${e=>e.theme.spacing(-1,0,1,0)};
848
+ line-height: 1.4em;
849
+ font-size: .92857143em;
850
+ `,Gt=r.span.withConfig({shouldForwardProp:n})`
851
+ color: ${e=>e.theme.palette.form.hint};
852
+ `,It=r.div.withConfig({shouldForwardProp:n})`
853
+ color: ${e=>e.theme.palette.form.error};
854
+ margin: ${e=>e.theme.spacing(1,0,0,0)};
855
+ font-weight: bold;
856
+ font-style: italic;
857
+ line-height: 1.4em;
858
+ font-size: .92857143em;
859
+ `,Vt=({position:e,align:t,label:r,hint:o,error:n,isRequired:a})=>({position:e,align:t,label:r,hint:o,error:n,isRequired:a}),Wt=({position:e,align:r,label:o,hint:n,error:i,isRequired:l,children:s})=>t.createElement(t.Fragment,null,t.createElement(Nt,{position:e,align:r,className:"form-grid-cell__label-hint"},o&&t.createElement(Ht,{error:i},o,l&&t.createElement(Gt,null," *")),n&&t.createElement(Bt,{error:i},n)),t.createElement(Nt,{position:e,align:r,rowOffset:1,className:a({"form-grid-cell__field-error":!0,"has-error":!!i})},s,i&&t.createElement(It,null,i))),qt=r.div.withConfig({shouldForwardProp:n})`
860
+ margin: 0 -8px -16px -8px;
861
+
862
+ display: -ms-grid;
863
+ display: grid;
864
+
865
+ -ms-grid-columns: 1fr;
866
+
867
+ ${e=>z(e,{columns:e=>r.css`
868
+ -ms-grid-columns: ${e};
869
+ grid-template-columns: ${e};
870
+ `})}
871
+ `;qt.displayName="FormGrid";const Ut=r(A)`
872
+ background-color: #F3F3F4;
873
+ `,Yt=r(A)`
874
+ position: relative;
875
+ `,_t=r(A)`
876
+ position: absolute;
877
+ height: 100%;
878
+ z-index: 50;
879
+ pointer-events: none;
880
+ `,Xt=r(A)`
881
+ height: 100%;
882
+ `,Jt=r(A)`
883
+ background-color: ${e=>e.baseColor||"white"};
884
+ position: absolute;
885
+ min-width: 100%;
886
+ min-height: 100%;
887
+ `,Zt=r.div.withConfig({shouldForwardProp:n})`
888
+ position: absolute;
889
+ top: 0;
890
+ left: 0;
891
+ width: 100%;
892
+ height: 100%;
893
+
894
+ opacity: ${e=>{var t;return null!==(t=e.opacity)&&void 0!==t?t:1}} ;
895
+ background: url("${e=>e.imageUrl}");
896
+ background-size: cover;
897
+ `,Kt=r(y)`
898
+ z-index: 10;
899
+ margin: auto auto;
900
+ `,Qt=r(Z)`
901
+ box-shadow: 0 8px 8px 0 rgba(34,36,38,.15);
902
+ min-width: 280px;
903
+ `,er=r.img`
904
+ display:none;
905
+ position: absolute;
906
+ left: 0;
907
+ top: ${e=>e.theme.spacing(8)};
908
+ ${D("tablet","display: block;")}
909
+ `;class tr{constructor(e){this.grid=e}getValues(){return this.grid}getDistinctValues(){const e=[];return this.grid.forEach((t=>{t.forEach((t=>{e.includes(t)||e.push(t)}))})),e}sliceArea(e,t){if(e.x>t.x||e.y>t.y)throw new Error("Coordinates are mixed up. Please ensure topLeft is actually in the top-left corner. And bottomRight is actually in the bottom-right corner");return new tr(this.grid.slice(e.y,t.y+1).map((r=>r.slice(e.x,t.x+1))))}getCoordinatesForValue(e){const t=[],r=[];return this.grid.forEach(((o,n)=>{o.forEach(((o,a)=>{o===e&&(t.push(a),r.push(n))}))})),{topLeft:{x:Math.min(...t),y:Math.min(...r)},bottomRight:{x:Math.max(...t),y:Math.max(...r)}}}}const rr=(e,t)=>{const r=[...Array(e)].map((e=>"1fr"));return t&&r.push("auto"),r.join(" ")};class or{constructor(e,t={}){this.fields=e,this.columns=t}setGrid(e,t,r){"object"==typeof this.columns&&(this.columns[e]=t);const o=new tr(r);((e,t)=>{const r=t.getDistinctValues();if(r.length<e.length)throw new Error(`Not all given fields are present in the grid. Please add these fields ${s(r,e).map((e=>`"${e}"`)).join(", ")}`);r.forEach((r=>{if(!e.includes(r))throw new Error(`${r} is not an existing field. Existing fields are ${e.map((e=>`"${e}"`)).join(", ")}.`);const o=t.getCoordinatesForValue(r),n=t.sliceArea(o.topLeft,o.bottomRight).getDistinctValues();if(1!==n.length||n[0]!==r)throw new Error(`Grid contains an unsupported shape. Please make sure "${r}" has a rectangular shape.`)}))})(Object.keys(this.fields),o);const n=i(this.fields,(t=>{Object.keys(this.fields).forEach((r=>{const n=t[r].props,{topLeft:a,bottomRight:i}=o.getCoordinatesForValue(r);void 0===n.position&&(n.position={}),M(n.position)||(n.position={mobile:n.position}),n.position[e]={column:a.x,columnSpan:i.x-a.x+1,row:a.y,rowSpan:i.y-a.y+1}}))}));return new or(n,this.columns)}setVertical(e,t=1,r){return this.setGrid(e,null!=r?r:rr(t,!1),l(Object.keys(this.fields),t))}setHorizontal(e,t){const r=Object.keys(this.fields);return this.setGrid(e,null!=t?t:rr(r.length,!1),[r])}getColumns(){return this.columns}getFields(){return this.fields}getScaffoldProps(){return{fields:this.fields,columns:this.columns}}}const nr=t.createContext({factory:void 0}),ar=t.forwardRef(((e,r)=>{var{name:o,field:n}=e,i=c(e,["name","field"]);const{factory:l}=t.useContext(nr),s=Vt(n.props),d=(null==l?void 0:l(n))||(e=>{switch(e.type){case"Button":return he;case"Checkbox":return ut;case"Select":return Ot;case"FileField":return Et;case"PasswordStrengthField":return Tt;default:return bt}})(n);return"TextField"===n.type&&"hidden"===n.props.type?t.createElement(d,Object.assign({ref:r,name:o},i,n.props)):t.createElement(Wt,Object.assign({},s),t.createElement(d,Object.assign({ref:r,name:o,placeholder:n.props.placeholder||s.label,className:a(!!s.error&&"error",n.props.className)},i,n.props)))})),ir=t.forwardRef(((e,r)=>{var{children:o,columns:n,fields:a,prefixFieldNames:i}=e,l=c(e,["children","columns","fields","prefixFieldNames"]);return t.createElement(qt,{columns:n},Object.entries(a).map((([e,o])=>t.createElement(ar,Object.assign({name:`${null!=i?i:""}${e}`,key:e,field:o,ref:r},l)))),o)}));return e.Alert=({children:e,title:r,variant:o="basic"})=>t.createElement(L,{variant:o},t.createElement(A,{p:3},r&&t.createElement(A,{pb:e?1:0},t.createElement(O,{level:4},r)),e&&t.createElement(P,null,e))),e.AnimatedCheckmark=W,e.BasicLayout=({sideBarProps:e,topBarProps:r,footerProps:o,isLoading:n,loader:a,children:i})=>t.createElement(Ut,{flexGrow:1,display:"flex",flexDirection:"column"},t.createElement(Yt,{flexGrow:1,flexShrink:0},e&&t.createElement(_t,null,t.createElement(Ne,Object.assign({},e))),t.createElement(Xt,{display:"flex",flexDirection:"column"},t.createElement(ct,Object.assign({},r)),t.createElement(A,{p:{laptop:7,mobile:4},pl:{laptop:22},flexGrow:1},n&&a?a:i),t.createElement(Be,Object.assign({},o))))),e.Box=A,e.BreadCrumbs=q,e.BreakPointValues=S,e.Button=he,e.Checkbox=ut,e.CollapsiblePanel=ne,e.ConfirmButton=e=>{var r,{modalProps:o}=e,n=c(e,["modalProps"]);const[a,i]=(({onConfirm:e})=>{const[r,o]=t.useState(!1);return[{onCancel:()=>o(!1),onConfirm:()=>{e(),o(!1)},isOpen:r},()=>o(!0)]})({onConfirm:null!==(r=o.onConfirm)&&void 0!==r?r:fe});return t.createElement(t.Fragment,null,t.createElement(he,Object.assign({},n,{onClick:i})),t.createElement(ge,Object.assign({title:"Are you sure?"},o,a)))},e.ConfirmModal=ge,e.Crumb=U,e.Details=({details:e,firstColumnWidth:r})=>t.createElement(ke,null,t.createElement("tbody",null,Object.entries(e).map((([e,o],n)=>t.createElement(ke.Row,{key:e,disableHover:!0},t.createElement($e,{width:r,firstRow:0===n},e),t.createElement($e,{firstRow:0===n},o)))))),e.Dropdown=({buttonProps:e,align:r,children:o,stayOpenOnClick:n})=>{const a=t.useRef(null),[i,l]=t.useState(!1),s=t.useCallback((()=>l(!0)),[l]),c=t.useCallback((e=>{var t;n&&(null===(t=a.current)||void 0===t?void 0:t.contains(e.target))||l(!1)}),[l,n]);return t.useEffect((()=>(i&&setTimeout((()=>document.addEventListener("click",c)),1),()=>{document.removeEventListener("click",c)})),[i,c]),t.createElement(Ee,null,t.createElement(he,Object.assign({},e,{onClick:s})),i&&t.createElement(y,{speed:".1s"},t.createElement(ye,{ref:a,align:r||"left"},o)))},e.DropdownMenu=Ce,e.DropdownMenuItem=Fe,e.Dropzone=e=>{var{onChange:r,icon:o,label:n}=e,a=c(e,["onChange","icon","label"]);const i=t.useRef(null),l=t.useRef(null),[s,d]=t.useState(!1),p=t.useCallback((e=>{e&&r&&r(Array.from(e))}),[r]),m=t.useCallback((e=>{e.preventDefault(),d(!0)}),[]),u=t.useCallback((e=>{e.preventDefault(),d(!1)}),[]),h=t.useCallback((e=>{var t;e.preventDefault(),d(!1),p(null===(t=e.dataTransfer)||void 0===t?void 0:t.files)}),[p]),g=t.useCallback((()=>{var e;null===(e=i.current)||void 0===e||e.click()}),[i]),f=t.useCallback((()=>{var e;p(null===(e=null==i?void 0:i.current)||void 0===e?void 0:e.files)}),[i,p]);return t.createElement(Pe,Object.assign({ref:l,onDragOver:m,onDragLeave:u,onDrop:h,onClick:g,isReadyToDrop:s},a),t.createElement(Oe,{"data-testid":"dropzone-file-input",type:"file",ref:i,onChange:f,multiple:!0}),t.createElement(A,null,t.createElement(he,{variant:"text",color:"secondary",type:"button",icon:o},n)))},e.Feedback=({onConfirm:e,buttonLabel:r,buttonIcon:o,title:n,subtitle:a})=>t.createElement(de,{handleClickOverlay:e,buttons:t.createElement(he,{"data-testid":"confirm",stretch:!0,icon:o,variant:"secondary",onClick:e},r)},t.createElement(je,{pt:3,pb:3},t.createElement(A,{pb:5,textAlign:"center"},t.createElement(O,null,n),a&&t.createElement(A,{pt:5},t.createElement(O,{level:5},a))),t.createElement(A,{pt:5,pb:5,pl:7,pr:7},t.createElement(W,null)))),e.FileField=Et,e.Floater=e=>{var{items:r,forceEqualWidth:o=!1,stretch:n=!1}=e,a=c(e,["items","forceEqualWidth","stretch"]);return t.createElement(A,Object.assign({mb:Le,mt:Le,ml:Ae,mr:Ae,display:Re},a),r.filter(Boolean).map(((e,a)=>(e=>!!e.element)(e)?t.createElement(ze,{key:a,laptopWidth:e.forceEqualWidth?100/r.length+"%":void 0,stretch:e.stretch||!1},e.element):t.createElement(ze,{key:a,laptopWidth:o?100/r.length+"%":void 0,stretch:n},e))))},e.FloatingPanelLayout=({panelProps:e,imageUrl:r,alert:o,logoUrl:n,backgroundBaseColor:a,backgroundOpacity:i})=>t.createElement(Jt,{display:"flex",alignItems:"center",baseColor:a},t.createElement(Zt,{imageUrl:r,opacity:i}),n&&t.createElement(er,{src:n,alt:"Logo"}),t.createElement(Kt,null,o&&t.createElement(A,{pb:7},o),t.createElement(Qt,Object.assign({},e)))),e.Footer=Be,e.FormGrid=qt,e.FormGridWrapper=Wt,e.FormPositioner=or,e.HamburgerButton=Ie,e.Header=O,e.HorizontalScroller=({children:e})=>t.createElement(Ge,null,e),e.Menu=Ve,e.MenuCloseButton=qe,e.MenuItem=({item:e,isOpen:r,isActive:o,children:n})=>{const[a,i]=t.useState(!!r);return t.createElement(We,{isOpen:a,isActive:!!o},e,n&&t.createElement(te,{onChange:i,isOpen:!!r,duration:.25},n))},e.MenuSlideOpenIndicator=({children:e})=>t.createElement(Ue,null,e),e.Modal=de,e.Overlay=ie,e.Paginator=e=>{const{isTablet:r}=_e(),{pageCount:o,onChange:n}=e,a=Math.min(Math.max(e.currentPage,0),o),i=r?2:0,l=Math.max(1,a-i),s=Math.min(o,a+i);return t.createElement(Xe,null,t.createElement(Je,{"data-testid":"paginate-prev",disabled:1===a,onClick:()=>n(a-1)},"⟨"),l>1&&t.createElement(Je,{"data-testid":"paginate-page-1",active:1===a,onClick:()=>n(1)},"1"),l>2&&t.createElement(Je,{disabled:!0},"..."),((e,t)=>{let r=[];for(let o=e;o<t;o++)r.push(o);return r})(l,s+1).map((e=>t.createElement(Je,{"data-testid":`paginate-page-${e}`,key:e,active:a===e,onClick:()=>n(e)},e))),s<o-1&&t.createElement(Je,{disabled:!0},"..."),s<o&&t.createElement(Je,{"data-testid":`paginate-page-${o}`,active:a===o,onClick:()=>n(o)},o),t.createElement(Je,{"data-testid":"paginate-next",disabled:a===o,onClick:()=>n(a+1)},"⟩"))},e.Panel=Z,e.Paragraph=P,e.PasswordStrengthField=Tt,e.ScaffoldForm=ir,e.ScaffoldFormContext=nr,e.ScaffoldFormProvider=({factory:e,children:r})=>t.createElement(nr.Provider,{value:{factory:e}},r),e.Section=e=>t.createElement(A,Object.assign({pb:{laptop:7,mobile:4}},e)),e.Select=Ot,e.SideBarHeader=({children:e,right:r})=>t.createElement(Ye,{mb:7},t.createElement(A,{flexGrow:1,display:"flex"},t.createElement(A,{flexGrow:1,display:"flex",flexDirection:"column",justifyContent:"center"},e)),r&&t.createElement(A,null,r)),e.SimpleTimeline=({color:e,icon:r,title:o,titleMeta:n})=>t.createElement(at,null,t.createElement(it,{className:"line"},t.createElement(lt,{color:e},r)),t.createElement(A,{pb:4,flexGrow:1},t.createElement(nt,{titleMeta:n,title:o}))),e.SlideInFromTop=y,e.Statistic=({icon:e,value:r,label:o,backgroundColor:n,smallerValue:a})=>t.createElement(Ze,{backgroundColor:n},t.createElement(et,null,e),t.createElement(A,{flexGrow:1,textAlign:"right"},t.createElement(Ke,null,o),t.createElement(Qe,{smallerValue:a},r))),e.StyledTable=be,e.Tab=e=>{var{id:r,isActive:o,onClick:n}=e,a=c(e,["id","isActive","onClick"]);const i=t.useCallback((()=>{o||null==n||n(r)}),[r,o,n]);return t.createElement(tt,Object.assign({},a,{onClick:i,isActive:o}))},e.TabContent=e=>t.createElement(rt,Object.assign({p:3},e)),e.Table=ke,e.Tabs=ot,e.TextField=bt,e.Timeline=({title:e,icon:r,color:o,isInitiallyOpen:n,titleMeta:a,chevron:i,children:l})=>t.createElement(at,null,t.createElement(it,null,t.createElement(lt,{color:o},r)),t.createElement(A,{pb:4,flexGrow:1},t.createElement(ne,{isInitiallyOpen:n,titleMeta:a,title:e,titleAction:i},l))),e.TopBar=ct,e.UiProvider=b,e.UiWrapper=({theme:e,children:r})=>t.createElement(b,{theme:e},t.createElement(k,null,t.createElement($,null,r))),e.VerticalRhythmLaptop=7,e.VerticalRhythmMobile=4,e.calculatePasswordScore=At,e.getFormGridWrapperProps=Vt,e.isResponsiveObject=M,e.mq=D,e.passwordHasLowerAndUppercase=St,e.passwordHasNumbers=jt,e.passwordHasSpecialChars=Dt,e.passwordMinLength=Pt,e.responsiveProps=z,e.theme=g,e.useCloseSidebarOnNavigate=e=>{const{closeSideMenu:r}=w();t.useEffect((()=>{r()}),[e,r])},e.useResponsiveBreakpoints=_e,e.useToggleMobileMenu=({currentRoute:e})=>{const[r,o]=t.useState(!1),n=t.useCallback((()=>{o((e=>!e))}),[]),a=t.useCallback((()=>{o(!0)}),[]),i=t.useCallback((()=>{o(!1)}),[]);return t.useEffect((()=>{i()}),[e,i]),{isOpen:r,open:a,close:i,toggle:n}},e}({},React,styled,polished,isPropValid,clsx,produce,_chunk,_difference);