@commonsku/styles 1.14.7 → 1.15.1

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 (66) hide show
  1. package/dist/index.d.ts +350 -125
  2. package/dist/index.es.js +907 -316
  3. package/dist/index.es.js.map +1 -1
  4. package/dist/index.js +921 -314
  5. package/dist/index.js.map +1 -1
  6. package/dist/styles/Button.d.ts +18 -3
  7. package/dist/styles/Button.d.ts.map +1 -1
  8. package/dist/styles/CollapsibleV2.d.ts +34 -0
  9. package/dist/styles/CollapsibleV2.d.ts.map +1 -0
  10. package/dist/styles/ConfirmPopup.d.ts +10 -0
  11. package/dist/styles/ConfirmPopup.d.ts.map +1 -0
  12. package/dist/styles/Csku.d.ts +58 -0
  13. package/dist/styles/Csku.d.ts.map +1 -0
  14. package/dist/styles/Dropdown.d.ts +12 -2
  15. package/dist/styles/Dropdown.d.ts.map +1 -1
  16. package/dist/styles/FlexboxGrid.d.ts +0 -1
  17. package/dist/styles/FlexboxGrid.d.ts.map +1 -1
  18. package/dist/styles/Grid.d.ts +17 -0
  19. package/dist/styles/Grid.d.ts.map +1 -0
  20. package/dist/styles/GridTable.d.ts +55 -0
  21. package/dist/styles/GridTable.d.ts.map +1 -0
  22. package/dist/styles/IconShowcase.d.ts.map +1 -1
  23. package/dist/styles/Input.d.ts +16 -8
  24. package/dist/styles/Input.d.ts.map +1 -1
  25. package/dist/styles/InputStepper.d.ts +2 -2
  26. package/dist/styles/InputStepper.d.ts.map +1 -1
  27. package/dist/styles/LightIndicator.d.ts +3 -2
  28. package/dist/styles/LightIndicator.d.ts.map +1 -1
  29. package/dist/styles/MultiProgress.d.ts +1 -1
  30. package/dist/styles/Popup.d.ts +11 -2
  31. package/dist/styles/Popup.d.ts.map +1 -1
  32. package/dist/styles/Tabs.d.ts +1 -0
  33. package/dist/styles/Tabs.d.ts.map +1 -1
  34. package/dist/styles/Text.d.ts +3 -5
  35. package/dist/styles/Text.d.ts.map +1 -1
  36. package/dist/styles/Theme.d.ts +16 -0
  37. package/dist/styles/Theme.d.ts.map +1 -1
  38. package/dist/styles/hooks/useCalendar.d.ts +1 -1
  39. package/dist/styles/hooks/useCalendar.d.ts.map +1 -1
  40. package/dist/styles/hooks/useRandomInterval.d.ts +1 -1
  41. package/dist/styles/hooks/useRandomInterval.d.ts.map +1 -1
  42. package/dist/styles/icons/CheckboxIcon.d.ts +3 -3
  43. package/dist/styles/icons/CheckboxIcon.d.ts.map +1 -1
  44. package/dist/styles/icons/CreditCardIcon.d.ts.map +1 -1
  45. package/dist/styles/icons/DragIcon.d.ts +6 -0
  46. package/dist/styles/icons/DragIcon.d.ts.map +1 -0
  47. package/dist/styles/icons/HandleIcon.d.ts +6 -0
  48. package/dist/styles/icons/HandleIcon.d.ts.map +1 -0
  49. package/dist/styles/icons/HistoryIcon.d.ts.map +1 -1
  50. package/dist/styles/icons/RadioIcon.d.ts +1 -2
  51. package/dist/styles/icons/RadioIcon.d.ts.map +1 -1
  52. package/dist/styles/icons/index.d.ts +2 -0
  53. package/dist/styles/icons/index.d.ts.map +1 -1
  54. package/dist/styles/index.d.ts +6 -0
  55. package/dist/styles/index.d.ts.map +1 -1
  56. package/dist/styles/tables/VirtualTable.d.ts +7 -2
  57. package/dist/styles/tables/VirtualTable.d.ts.map +1 -1
  58. package/dist/utils/index.d.ts +9 -2
  59. package/dist/utils/index.d.ts.map +1 -1
  60. package/dist/utils/sizes.d.ts +16 -1
  61. package/dist/utils/sizes.d.ts.map +1 -1
  62. package/dist/utils/ssr.d.ts +4 -0
  63. package/dist/utils/ssr.d.ts.map +1 -1
  64. package/dist/utils/styled.d.ts +12 -0
  65. package/dist/utils/styled.d.ts.map +1 -0
  66. package/package.json +6 -1
package/dist/index.es.js CHANGED
@@ -1,21 +1,21 @@
1
1
  import _, { map, pick, keys, isUndefined, get, toNumber, partial, uniqueId, debounce } from 'lodash';
2
2
  import styled, { css, createGlobalStyle, ThemeProvider, keyframes } from 'styled-components';
3
- import React__default, { Fragment, useState, useEffect, useRef, Component, createContext, memo, forwardRef, useCallback, useLayoutEffect, useMemo } from 'react';
3
+ import React__default, { Fragment, useState, useEffect, useRef, Component, useCallback, createContext, memo, forwardRef, useLayoutEffect, useMemo } from 'react';
4
4
  import { useDropzone } from 'react-dropzone';
5
5
  import BaseSelect from 'react-select';
6
6
  export { components, createFilter, mergeStyles } from 'react-select';
7
7
  import BaseCreatableSelect from 'react-select/creatable';
8
8
  export { makeCreatableSelect } from 'react-select/creatable';
9
9
  import BaseAsyncSelect from 'react-select/async';
10
+ import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
10
11
  import ReactDOM from 'react-dom';
11
12
  import { format, addDays, getWeek, subWeeks, addWeeks, getMonth, getYear, isSameDay, subMonths, addMonths, startOfWeek, isDate, lastDayOfWeek } from 'date-fns';
12
13
  import BaseDatePicker from 'react-datepicker';
13
14
  import { useTable, useSortBy, usePagination, useColumnOrder, useBlockLayout, useFlexLayout, useExpanded } from 'react-table';
14
15
  import { useSticky } from 'react-table-sticky';
15
16
  import { areEqual, FixedSizeList, VariableSizeList } from 'react-window';
16
- import { Draggable, Droppable, DragDropContext } from 'react-beautiful-dnd';
17
17
 
18
- /*! *****************************************************************************
18
+ /******************************************************************************
19
19
  Copyright (c) Microsoft Corporation.
20
20
 
21
21
  Permission to use, copy, modify, and/or distribute this software for any
@@ -157,6 +157,8 @@ var doc = typeof document !== 'undefined' ? document : {
157
157
  },
158
158
  };
159
159
  var win = typeof window !== 'undefined' ? window : {
160
+ innerWidth: 0,
161
+ innerHeight: 0,
160
162
  document: doc,
161
163
  navigator: {
162
164
  userAgent: '',
@@ -211,13 +213,28 @@ var ssr = {
211
213
  };
212
214
 
213
215
  var media = {
214
- xs: function (styles) { return "\n @media only screen and (min-width: 0px) {\n ".concat(styles, "\n }\n "); },
215
- sm: function (styles) { return "\n @media only screen and (min-width: 640px) {\n ".concat(styles, "\n }\n "); },
216
- md: function (styles) { return "\n @media only screen and (min-width: 768px) {\n ".concat(styles, "\n }\n "); },
217
- lg: function (styles) { return "\n @media only screen and (min-width: 1024px) {\n ".concat(styles, "\n }\n "); },
218
- xl: function (styles) { return "\n @media only screen and (min-width: 1280px) {\n ".concat(styles, "\n }\n "); },
216
+ xs: function (styles) { return "\n @media only screen and (min-width: 0px) {\n ".concat(typeof styles === 'string' ? css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
217
+ sm: function (styles) { return "\n @media only screen and (min-width: 640px) {\n ".concat(typeof styles === 'string' ? css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
218
+ md: function (styles) { return "\n @media only screen and (min-width: 768px) {\n ".concat(typeof styles === 'string' ? css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
219
+ lg: function (styles) { return "\n @media only screen and (min-width: 1024px) {\n ".concat(typeof styles === 'string' ? css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
220
+ xl: function (styles) { return "\n @media only screen and (min-width: 1280px) {\n ".concat(typeof styles === 'string' ? css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["", ""], ["", ""])), styles) : css(styles), "\n }\n "); },
219
221
  };
220
- var sizes = Object.keys(media);
222
+ var sizeMediaWidth = {
223
+ xs: '0px',
224
+ sm: '640px',
225
+ md: '768px',
226
+ lg: '1024px',
227
+ xl: '1280px',
228
+ };
229
+ var sizeMedia = {
230
+ xs: "@media only screen and (min-width: ".concat(sizeMediaWidth.xs, ")"),
231
+ sm: "@media only screen and (min-width: ".concat(sizeMediaWidth.sm, ")"),
232
+ md: "@media only screen and (min-width: ".concat(sizeMediaWidth.md, ")"),
233
+ lg: "@media only screen and (min-width: ".concat(sizeMediaWidth.lg, ")"),
234
+ xl: "@media only screen and (min-width: ".concat(sizeMediaWidth.xl, ")"),
235
+ };
236
+ var sizes = ['xs', 'sm', 'md', 'lg', 'xl'];
237
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
221
238
 
222
239
  function hex(c) {
223
240
  var s = "0123456789abcdef";
@@ -335,9 +352,21 @@ var onChangeNumber = function (value) {
335
352
  return null;
336
353
  }
337
354
  return val;
338
- };
355
+ };
356
+ // (+|-)100(px|em|rem|...) => px|em|rem|...
357
+ var getUnit = function (measurement) {
358
+ if (typeof measurement !== "string") {
359
+ return "px";
360
+ }
361
+ var matchedMeasurement = measurement.match(/^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/);
362
+ return matchedMeasurement ? matchedMeasurement[2] : "px";
363
+ };
364
+ var stripUnit = function (measurement) {
365
+ return (typeof measurement === "number") ? measurement : parseFloat(measurement);
366
+ };
367
+ var parseMeasurement = function (measurement) { return stripUnit(measurement) + getUnit(measurement); };
339
368
 
340
- var SharedStyles = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n box-sizing: border-box;\n ", "\n"], ["\n box-sizing: border-box;\n ", "\n"])), function (p) { return map(pick(p, keys(SHARED_STYLE_MAPS)), function (v, k) {
369
+ var SharedStyles = css(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n box-sizing: border-box;\n ", "\n"], ["\n box-sizing: border-box;\n ", "\n"])), function (p) { return map(pick(p, keys(SHARED_STYLE_MAPS)), function (v, k) {
341
370
  return isUndefined(v) ? '' : SHARED_STYLE_MAPS[k](v);
342
371
  }).join(''); });
343
372
  var SHARED_STYLE_MAPS = {
@@ -379,8 +408,8 @@ var SHARED_STYLE_MAPS = {
379
408
  // Custom Styles
380
409
  custom: function (val) { return "".concat(val); },
381
410
  };
382
- var Wrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["", ""], ["", ""])), SharedStyles);
383
- var templateObject_1, templateObject_2;
411
+ var Wrapper = styled.div(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["", ""], ["", ""])), SharedStyles);
412
+ var templateObject_1$1, templateObject_2$1;
384
413
 
385
414
  var primary1 = {
386
415
  '10': '#F6FEFF',
@@ -787,7 +816,7 @@ var SVG = styled.svg.attrs(function (p) {
787
816
  viewBox: p.viewBox || defaultSize.viewBox,
788
817
  };
789
818
  })(function (p) {
790
- return css(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), SharedStyles);
819
+ return css(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), SharedStyles);
791
820
  }, function (p) {
792
821
  var styles = {};
793
822
  var iconSizes = p.iconSizes || iconSize;
@@ -801,7 +830,7 @@ var SVG = styled.svg.attrs(function (p) {
801
830
  styles['cursor'] = p.pointer ? 'pointer' : undefined;
802
831
  return styles;
803
832
  });
804
- var templateObject_1$1;
833
+ var templateObject_1$2;
805
834
 
806
835
  function TableIcon(_a) {
807
836
  var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Calculate" : _d, props = __rest(_a, ["color", "size", "altText"]);
@@ -1156,7 +1185,7 @@ function createFontStyles(p) {
1156
1185
  return "\n --skufont-".concat(k, ": ").concat(fontFamilies[k], ";\n --font-family-").concat(k, ": ").concat([fontFamilies[k]].concat(fontFamilies['fallbacks']).join(','), ";\n ");
1157
1186
  }).join('');
1158
1187
  }
1159
- var GlobalStyle = createGlobalStyle(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n:root {\n ", "\n ", "\n ", "\n}\n&&& {\n .commonsku-styles-select__input {\n input {\n height: auto;\n }\n }\n ", "\n}\n"], ["\n:root {\n ", "\n ", "\n ", "\n}\n&&& {\n .commonsku-styles-select__input {\n input {\n height: auto;\n }\n }\n ", "\n}\n"])), function (p) { return createFontStyles(p); }, function (p) { return parseColorVars(_.get(p, ['theme', 'colors'], {}), ''); }, function (p) {
1188
+ var GlobalStyle = createGlobalStyle(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n:root {\n ", "\n ", "\n ", "\n}\n&&& {\n .commonsku-styles-select__input {\n input {\n height: auto;\n }\n }\n ", "\n}\n"], ["\n:root {\n ", "\n ", "\n ", "\n}\n&&& {\n .commonsku-styles-select__input {\n input {\n height: auto;\n }\n }\n ", "\n}\n"])), function (p) { return createFontStyles(p); }, function (p) { return parseColorVars(_.get(p, ['theme', 'colors'], {}), ''); }, function (p) {
1160
1189
  if (!p.additionalStyles) {
1161
1190
  return null;
1162
1191
  }
@@ -1170,7 +1199,7 @@ var GlobalStyle = createGlobalStyle(templateObject_1$2 || (templateObject_1$2 =
1170
1199
  return null;
1171
1200
  }
1172
1201
  }, datepickerStyles);
1173
- var templateObject_1$2;
1202
+ var templateObject_1$3;
1174
1203
 
1175
1204
  var fontFamilies = {
1176
1205
  skuFontRegular: "'skufont-regular'",
@@ -1285,6 +1314,10 @@ var themeOptions = {
1285
1314
  '9': '72px',
1286
1315
  '10': '80px',
1287
1316
  },
1317
+ mediaQueries: {
1318
+ sizeMediaWidth: sizeMediaWidth,
1319
+ sizeMedia: sizeMedia,
1320
+ },
1288
1321
  };
1289
1322
  function getColor(color, def) {
1290
1323
  if (!color) {
@@ -1398,8 +1431,8 @@ function CircleProgressIcon(_a) {
1398
1431
  React__default.createElement("text", { className: "circle-text", x: "50%", y: "50%", dy: ".3em", textAnchor: "middle", style: __assign({ fontSize: size === "small" || size === "tiny" ? ".6em" : size === "medium" ? ".8em" : "1em", fontWeight: 'bold', fill: textColor }, textStyle) }, text || "".concat(percentage, "%")));
1399
1432
  }
1400
1433
 
1401
- var SVG$1 = styled.svg(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
1402
- var templateObject_1$3;
1434
+ var SVG$1 = styled.svg(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
1435
+ var templateObject_1$4;
1403
1436
 
1404
1437
  function Loading(_a) {
1405
1438
  var _b = _a.height, height = _b === void 0 ? 50 : _b, width = _a.width, _c = _a.animationDuration, animationDuration = _c === void 0 ? 1000 : _c, _d = _a.barWidth, barWidth = _d === void 0 ? 14 : _d, _e = _a.barRadius, barRadius = _e === void 0 ? 2 : _e, _f = _a.colorful, colorful = _f === void 0 ? false : _f, _g = _a.bars, bars = _g === void 0 ? 4 : _g, _h = _a.viewBox, viewBox = _h === void 0 ? "10 0 51 50" : _h, _j = _a.rotate, startColor = _a.startColor, endColor = _a.endColor, props = __rest(_a, ["height", "width", "animationDuration", "barWidth", "barRadius", "colorful", "bars", "viewBox", "rotate", "startColor", "endColor"]);
@@ -2064,10 +2097,13 @@ function RadioIcon(_a) {
2064
2097
  }
2065
2098
 
2066
2099
  function CheckboxIcon(_a) {
2067
- var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.hoverColor, hoverColor = _c === void 0 ? teal.light : _c, _d = _a.disabledColor, disabledColor = _d === void 0 ? neutrals['60'] : _d, _e = _a.size, size = _e === void 0 ? "medium" : _e, _f = _a.hover, hover = _f === void 0 ? false : _f, _g = _a.selected, selected = _g === void 0 ? false : _g, _h = _a.disabled, disabled = _h === void 0 ? false : _h, _j = _a.altText, altText = _j === void 0 ? "Select" : _j, props = __rest(_a, ["color", "hoverColor", "disabledColor", "size", "hover", "selected", "disabled", "altText"]);
2100
+ var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.hoverColor, hoverColor = _c === void 0 ? teal.light : _c, _d = _a.disabledColor, disabledColor = _d === void 0 ? neutrals['60'] : _d, _e = _a.size, size = _e === void 0 ? "medium" : _e, _f = _a.hover, hover = _f === void 0 ? false : _f, _g = _a.selected, selected = _g === void 0 ? false : _g, _h = _a.disabled, disabled = _h === void 0 ? false : _h, _j = _a.indeterminate, indeterminate = _j === void 0 ? false : _j, _k = _a.altText, altText = _k === void 0 ? "Select" : _k, props = __rest(_a, ["color", "hoverColor", "disabledColor", "size", "hover", "selected", "disabled", "indeterminate", "altText"]);
2068
2101
  selected ? altText = "Unselect" : altText = "Select";
2069
2102
  var renderPath = React__default.useMemo(function () {
2070
- if (selected === true) {
2103
+ if (indeterminate) {
2104
+ return React__default.createElement("path", { d: "M19 3H5C3.9 3 3 3.9 3 5V19C3 20.1 3.9 21 5 21H19C20.1 21 21 20.1 21 19V5C21 3.9 20.1 3 19 3ZM16 13H8C7.45 13 7 12.55 7 12C7 11.45 7.45 11 8 11H16C16.55 11 17 11.45 17 12C17 12.55 16.55 13 16 13Z", fill: disabled ? disabledColor : color });
2105
+ }
2106
+ else if (selected) {
2071
2107
  return React__default.createElement("path", { d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2Zm-8.29 13.29a.996.996 0 0 1-1.41 0L5.71 12.7a.996.996 0 1 1 1.41-1.41L10 14.17l6.88-6.88a.996.996 0 1 1 1.41 1.41l-7.58 7.59Z", fill: disabled ? disabledColor : color });
2072
2108
  }
2073
2109
  else if (hover === true && !disabled) {
@@ -2213,8 +2249,8 @@ var getSizeStyle = function (style, defaults) {
2213
2249
  return defaults;
2214
2250
  };
2215
2251
  };
2216
- var OuterContainer = styled.div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject(["\n display:inline-flex;\n flex-direction: row;\n align-items: top;\n"], ["\n display:inline-flex;\n flex-direction: row;\n align-items: top;\n"])));
2217
- var CommentNumber = styled.p(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n display:block;\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin-top: 0;\n margin-bottom: 0;\n"], ["\n display:block;\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin-top: 0;\n margin-bottom: 0;\n"])), fontStyles.p.small.fontFamily, function (props) { return getSizeStyle('font-size', fontStyles.button.medium.fontSize)({ size: props.size }); }, function (props) { return props.color; });
2252
+ var OuterContainer = styled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n display:inline-flex;\n flex-direction: row;\n align-items: top;\n"], ["\n display:inline-flex;\n flex-direction: row;\n align-items: top;\n"])));
2253
+ var CommentNumber = styled.p(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n display:block;\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin-top: 0;\n margin-bottom: 0;\n"], ["\n display:block;\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin-top: 0;\n margin-bottom: 0;\n"])), fontStyles.p.small.fontFamily, function (props) { return getSizeStyle('font-size', fontStyles.button.medium.fontSize)({ size: props.size }); }, function (props) { return props.color; });
2218
2254
  function CommentIcon(_a) {
2219
2255
  var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Comments" : _d, number = _a.number, props = __rest(_a, ["color", "size", "altText", "number"]);
2220
2256
  var numberToShow = number !== undefined && number <= 99 ? number : '99+';
@@ -2226,7 +2262,7 @@ function CommentIcon(_a) {
2226
2262
  React__default.createElement("path", { d: "M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18ZM20 4v13.17L18.83 16H4V4h16ZM6 12h12v2H6v-2Zm0-3h12v2H6V9Zm0-3h12v2H6V6Z", fill: color })),
2227
2263
  showNumber)));
2228
2264
  }
2229
- var templateObject_1$4, templateObject_2$1;
2265
+ var templateObject_1$5, templateObject_2$2;
2230
2266
 
2231
2267
  function EllipsisIcon(_a) {
2232
2268
  var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "More" : _d, props = __rest(_a, ["color", "size", "altText"]);
@@ -2236,12 +2272,19 @@ function EllipsisIcon(_a) {
2236
2272
  React__default.createElement("path", { d: "M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Z", fill: color }));
2237
2273
  }
2238
2274
 
2275
+ function DragIcon(_a) {
2276
+ var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Drag" : _d, props = __rest(_a, ["color", "size", "altText"]);
2277
+ return React__default.createElement(SVG, __assign({ size: size, "aria-labelledby": "DragIcon" }, props),
2278
+ React__default.createElement("path", { fill: "none", d: "M0 0h24v24H0z" }),
2279
+ React__default.createElement("title", { id: "DragIcon" }, altText),
2280
+ React__default.createElement("path", { d: "M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2Zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2Zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2Z", fill: color }));
2281
+ }
2282
+
2239
2283
  function CreditCardIcon(_a) {
2240
2284
  var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Credit Card" : _d, props = __rest(_a, ["color", "size", "altText"]);
2241
2285
  return React__default.createElement(SVG, __assign({ size: size, "aria-labelledby": "CreditCardIcon" }, props),
2242
- React__default.createElement("path", { fill: "none", d: "M0 0h24v24H0z" }),
2243
2286
  React__default.createElement("title", { id: "CreditCardIcon" }, altText),
2244
- React__default.createElement("path", { d: "M18 0H2C0.89 0 0.00999999 0.89 0.00999999 2L0 14C0 15.11 0.89 16 2 16H18C19.11 16 20 15.11 20 14V2C20 0.89 19.11 0 18 0ZM18 14H2V8H18V14ZM18 4H2V2H18V4Z", fill: color }));
2287
+ React__default.createElement("path", { d: "M20 4H4C2.89 4 2.01 4.89 2.01 6L2 18C2 19.11 2.89 20 4 20H20C21.11 20 22 19.11 22 18V6C22 4.89 21.11 4 20 4ZM20 18H4V12H20V18ZM20 8H4V6H20V8Z", fill: color }));
2245
2288
  }
2246
2289
 
2247
2290
  function ShopIcon(_a) {
@@ -2249,15 +2292,21 @@ function ShopIcon(_a) {
2249
2292
  return React__default.createElement(SVG, __assign({ size: size, "aria-labelledby": "ShopIcon" }, props),
2250
2293
  React__default.createElement("path", { fill: "none", d: "M0 0h24v24H0z" }),
2251
2294
  React__default.createElement("title", { id: "ShopIcon" }, altText),
2252
- React__default.createElement("path", { d: "M19.8978 5.89L18.8478 1.52C18.6278 0.62 17.8478 0 16.9378 0H3.04781C2.14781 0 1.35781 0.63 1.14781 1.52L0.0978093 5.89C-0.142191 6.91 0.0778095 7.95 0.717809 8.77C0.797809 8.88 0.907809 8.96 0.997809 9.06V16C0.997809 17.1 1.89781 18 2.99781 18H16.9978C18.0978 18 18.9978 17.1 18.9978 16V9.06C19.0878 8.97 19.1978 8.88 19.2778 8.78C19.9178 7.96 20.1478 6.91 19.8978 5.89ZM16.9078 1.99L17.9578 6.36C18.0578 6.78 17.9678 7.2 17.7078 7.53C17.5678 7.71 17.2678 8 16.7678 8C16.1578 8 15.6278 7.51 15.5578 6.86L14.9778 2L16.9078 1.99ZM10.9978 2H12.9578L13.4978 6.52C13.5478 6.91 13.4278 7.3 13.1678 7.59C12.9478 7.85 12.6278 8 12.2178 8C11.5478 8 10.9978 7.41 10.9978 6.69V2ZM6.48781 6.52L7.03781 2H8.99781V6.69C8.99781 7.41 8.44781 8 7.70781 8C7.36781 8 7.05781 7.85 6.81781 7.59C6.56781 7.3 6.44781 6.91 6.48781 6.52ZM2.03781 6.36L3.04781 2H5.01781L4.43781 6.86C4.35781 7.51 3.83781 8 3.22781 8C2.73781 8 2.42781 7.71 2.29781 7.53C2.02781 7.21 1.93781 6.78 2.03781 6.36ZM2.99781 16V9.97C3.07781 9.98 3.14781 10 3.22781 10C4.09781 10 4.88781 9.64 5.46781 9.05C6.06781 9.65 6.86781 10 7.77781 10C8.64781 10 9.42781 9.64 10.0078 9.07C10.5978 9.64 11.3978 10 12.2978 10C13.1378 10 13.9378 9.65 14.5378 9.05C15.1178 9.64 15.9078 10 16.7778 10C16.8578 10 16.9278 9.98 17.0078 9.97V16H2.99781Z", fill: color }));
2295
+ React__default.createElement("path", { d: "M21.8978 8.89L20.8478 4.52C20.6278 3.62 19.8478 3 18.9378 3H5.04781C4.14781 3 3.35781 3.63 3.14781 4.52L2.09781 8.89C1.85781 9.91 2.07781 10.95 2.71781 11.77C2.79781 11.88 2.90781 11.96 2.99781 12.06V19C2.99781 20.1 3.89781 21 4.99781 21H18.9978C20.0978 21 20.9978 20.1 20.9978 19V12.06C21.0878 11.97 21.1978 11.88 21.2778 11.78C21.9178 10.96 22.1478 9.91 21.8978 8.89ZM18.9078 4.99L19.9578 9.36C20.0578 9.78 19.9678 10.2 19.7078 10.53C19.5678 10.71 19.2678 11 18.7678 11C18.1578 11 17.6278 10.51 17.5578 9.86L16.9778 5L18.9078 4.99ZM12.9978 5H14.9578L15.4978 9.52C15.5478 9.91 15.4278 10.3 15.1678 10.59C14.9478 10.85 14.6278 11 14.2178 11C13.5478 11 12.9978 10.41 12.9978 9.69V5ZM8.48781 9.52L9.03781 5H10.9978V9.69C10.9978 10.41 10.4478 11 9.70781 11C9.36781 11 9.05781 10.85 8.81781 10.59C8.56781 10.3 8.44781 9.91 8.48781 9.52ZM4.03781 9.36L5.04781 5H7.01781L6.43781 9.86C6.35781 10.51 5.83781 11 5.22781 11C4.73781 11 4.42781 10.71 4.29781 10.53C4.02781 10.21 3.93781 9.78 4.03781 9.36ZM4.99781 19V12.97C5.07781 12.98 5.14781 13 5.22781 13C6.09781 13 6.88781 12.64 7.46781 12.05C8.06781 12.65 8.86781 13 9.77781 13C10.6478 13 11.4278 12.64 12.0078 12.07C12.5978 12.64 13.3978 13 14.2978 13C15.1378 13 15.9378 12.65 16.5378 12.05C17.1178 12.64 17.9078 13 18.7778 13C18.8578 13 18.9278 12.98 19.0078 12.97V19H4.99781Z", fill: color }));
2253
2296
  }
2254
2297
 
2255
2298
  function HistoryIcon(_a) {
2256
2299
  var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Credit Card" : _d, props = __rest(_a, ["color", "size", "altText"]);
2257
2300
  return React__default.createElement(SVG, __assign({ size: size, "aria-labelledby": "HistoryIcon" }, props),
2258
- React__default.createElement("path", { fill: "none", d: "M0 0h24v24H0z" }),
2259
2301
  React__default.createElement("title", { id: "HistoryIcon" }, altText),
2260
- React__default.createElement("path", { d: "M12.5 0C7.53 0 3.5 4.03 3.5 9H0.5L4.39 12.89L4.46 13.03L8.5 9H5.5C5.5 5.13 8.63 2 12.5 2C16.37 2 19.5 5.13 19.5 9C19.5 12.87 16.37 16 12.5 16C10.57 16 8.82 15.21 7.56 13.94L6.14 15.36C7.77 16.99 10.01 18 12.5 18C17.47 18 21.5 13.97 21.5 9C21.5 4.03 17.47 0 12.5 0ZM11.5 5V10L15.75 12.52L16.52 11.24L13 9.15V5H11.5Z", fill: color }));
2302
+ React__default.createElement("path", { d: "M13.5 3C8.53 3 4.5 7.03 4.5 12H1.5L5.39 15.89L5.46 16.03L9.5 12H6.5C6.5 8.13 9.63 5 13.5 5C17.37 5 20.5 8.13 20.5 12C20.5 15.87 17.37 19 13.5 19C11.57 19 9.82 18.21 8.56 16.94L7.14 18.36C8.77 19.99 11.01 21 13.5 21C18.47 21 22.5 16.97 22.5 12C22.5 7.03 18.47 3 13.5 3ZM12.5 8V13L16.75 15.52L17.52 14.24L14 12.15V8H12.5Z", fill: color }));
2303
+ }
2304
+
2305
+ function HandleIcon(_a) {
2306
+ var _b = _a.color, color = _b === void 0 ? teal.main : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.altText, altText = _d === void 0 ? "Credit Card" : _d, props = __rest(_a, ["color", "size", "altText"]);
2307
+ return React__default.createElement(SVG, __assign({ size: size, "aria-labelledby": "HandleIcon" }, props),
2308
+ React__default.createElement("title", { id: "HandleIcon" }, altText),
2309
+ React__default.createElement("path", { d: "M11 18C11 19.1 10.1 20 9 20C7.9 20 7 19.1 7 18C7 16.9 7.9 16 9 16C10.1 16 11 16.9 11 18ZM9 10C7.9 10 7 10.9 7 12C7 13.1 7.9 14 9 14C10.1 14 11 13.1 11 12C11 10.9 10.1 10 9 10ZM9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM15 8C16.1 8 17 7.1 17 6C17 4.9 16.1 4 15 4C13.9 4 13 4.9 13 6C13 7.1 13.9 8 15 8ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM15 16C13.9 16 13 16.9 13 18C13 19.1 13.9 20 15 20C16.1 20 17 19.1 17 18C17 16.9 16.1 16 15 16Z", fill: color }));
2261
2310
  }
2262
2311
 
2263
2312
  var avatarSizes = {
@@ -2308,9 +2357,9 @@ var avatarColors = {
2308
2357
  textColor: secondary1['40']
2309
2358
  }
2310
2359
  };
2311
- var AvatarWrapper = styled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n &&& {\n display: inline-block;\n vertical-align: top;\n overflow: hidden;\n margin: 0;\n ", "\n\n width: ", ";\n height: ", ";\n border-radius: ", ";\n text-align: center;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: inline-block;\n vertical-align: top;\n overflow: hidden;\n margin: 0;\n ", "\n\n width: ", ";\n height: ", ";\n border-radius: ", ";\n text-align: center;\n ", "\n ", "\n }\n"])), SharedStyles, function (props) { return props.size; }, function (props) { return props.size; }, function (props) { return props.shape; }, function (props) { var _a; return props.hasPic ? '' : "background: ".concat(get(avatarColors, [(_a = props.color) !== null && _a !== void 0 ? _a : 'teal', 'backgroundColor'], props.color), ";"); }, function (props) { var _a; return props.hasPic ? '' : "color: ".concat(get(avatarColors, [(_a = props.color) !== null && _a !== void 0 ? _a : 'teal', 'textColor'], props.color), ";"); });
2312
- var AvatarPic = styled.img(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject(["\n &&& {\n width: 100%;\n height: 100%;\n }\n"], ["\n &&& {\n width: 100%;\n height: 100%;\n }\n"])));
2313
- var AvatarInitials = styled.p(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n &&& {\n margin: 0;\n position: relative;\n top: 50%;\n transform: translate(0, -50%);\n font-family: 'skufont-bold', sans-serif;\n font-size: ", "\n"], ["\n &&& {\n margin: 0;\n position: relative;\n top: 50%;\n transform: translate(0, -50%);\n font-family: 'skufont-bold', sans-serif;\n font-size: ", "\n"])), function (props) { var _a; return get(avatarSizes, [(_a = props.size) !== null && _a !== void 0 ? _a : 'small', 'fontSize'], props.size); });
2360
+ var AvatarWrapper = styled.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n &&& {\n display: inline-block;\n vertical-align: top;\n overflow: hidden;\n margin: 0;\n ", "\n\n width: ", ";\n height: ", ";\n border-radius: ", ";\n text-align: center;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: inline-block;\n vertical-align: top;\n overflow: hidden;\n margin: 0;\n ", "\n\n width: ", ";\n height: ", ";\n border-radius: ", ";\n text-align: center;\n ", "\n ", "\n }\n"])), SharedStyles, function (props) { return props.size; }, function (props) { return props.size; }, function (props) { return props.shape; }, function (props) { var _a; return props.hasPic ? '' : "background: ".concat(get(avatarColors, [(_a = props.color) !== null && _a !== void 0 ? _a : 'teal', 'backgroundColor'], props.color), ";"); }, function (props) { var _a; return props.hasPic ? '' : "color: ".concat(get(avatarColors, [(_a = props.color) !== null && _a !== void 0 ? _a : 'teal', 'textColor'], props.color), ";"); });
2361
+ var AvatarPic = styled.img(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n &&& {\n width: 100%;\n height: 100%;\n }\n"], ["\n &&& {\n width: 100%;\n height: 100%;\n }\n"])));
2362
+ var AvatarInitials = styled.p(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n &&& {\n margin: 0;\n position: relative;\n top: 50%;\n transform: translate(0, -50%);\n font-family: 'skufont-bold', sans-serif;\n font-size: ", "\n"], ["\n &&& {\n margin: 0;\n position: relative;\n top: 50%;\n transform: translate(0, -50%);\n font-family: 'skufont-bold', sans-serif;\n font-size: ", "\n"])), function (props) { var _a; return get(avatarSizes, [(_a = props.size) !== null && _a !== void 0 ? _a : 'small', 'fontSize'], props.size); });
2314
2363
  var Avatar = function (_a) {
2315
2364
  var pic = _a.pic, _b = _a.size, size = _b === void 0 ? 'small' : _b, _c = _a.shape, shape = _c === void 0 ? 'square' : _c, color = _a.color, initials = _a.initials, icon = _a.icon, children = _a.children, props = __rest(_a, ["pic", "size", "shape", "color", "initials", "icon", "children"]);
2316
2365
  if (pic) {
@@ -2326,10 +2375,10 @@ var Avatar = function (_a) {
2326
2375
  React__default.createElement(AvatarInitials, { size: size }, initials !== null && initials !== void 0 ? initials : children));
2327
2376
  }
2328
2377
  };
2329
- var templateObject_1$5, templateObject_2$2, templateObject_3;
2378
+ var templateObject_1$6, templateObject_2$3, templateObject_3$1;
2330
2379
 
2331
2380
  var getTotalCols = function (p) { return p.totalCols || 12; };
2332
- var SizerCss = css(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n\n ", "\n ", ";\n ", "\n"], ["\n ", "\n ", "\n ", "\n\n ", "\n ", ";\n ", "\n"])), function (props) { return props.start ? "\n justify-content: flex-start;\n text-align: left;\n " : ''; }, function (props) { return props.center ? "\n justify-content: center;\n text-align: center;\n " : ''; }, function (props) { return props.end ? "\n justify-content: flex-end;\n text-align: right;\n " : ''; }, function (props) { return props.offset && "margin-left: ".concat(props.offset / getTotalCols(props) * 100, "%;"); }, function (props) { return props.collapse && typeof (props.collapse) === 'string' && media[props.collapse]("\n display: none;\n "); }, function (props) {
2381
+ var SizerCss = css(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n\n ", "\n ", ";\n ", "\n"], ["\n ", "\n ", "\n ", "\n\n ", "\n ", ";\n ", "\n"])), function (props) { return props.start ? "\n justify-content: flex-start;\n text-align: left;\n " : ''; }, function (props) { return props.center ? "\n justify-content: center;\n text-align: center;\n " : ''; }, function (props) { return props.end ? "\n justify-content: flex-end;\n text-align: right;\n " : ''; }, function (props) { return props.offset && "margin-left: ".concat(props.offset / getTotalCols(props) * 100, "%;"); }, function (props) { return props.collapse && typeof (props.collapse) === 'string' && media[props.collapse]("\n display: none;\n "); }, function (props) {
2333
2382
  var styles = '';
2334
2383
  if (props.collapse) {
2335
2384
  if (typeof (props.collapse) === 'string') {
@@ -2371,24 +2420,23 @@ var SizerCss = css(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObj
2371
2420
  });
2372
2421
  return styles;
2373
2422
  });
2374
- var SizerWrapper = styled.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SizerCss);
2375
- var templateObject_1$6, templateObject_2$3;
2423
+ var SizerWrapper = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SizerCss);
2424
+ var templateObject_1$7, templateObject_2$4;
2376
2425
 
2377
- var Grid = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
2378
- var Row = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n &&& {\n display: flex;\n box-sizing: border-box;\n flex-direction: row;\n flex: 0 1 auto;\n justify-content: ", ";\n flex-wrap: ", ";\n align-items: ", ";\n padding: ", ";\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n box-sizing: border-box;\n flex-direction: row;\n flex: 0 1 auto;\n justify-content: ", ";\n flex-wrap: ", ";\n align-items: ", ";\n padding: ", ";\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.justify || 'left'; }, function (props) { return props.wrap ? props.wrap : 'wrap'; }, function (props) { return props.align || 'stretch'; }, function (props) { return props.padded ? '0.5rem' : 'initial'; }, function (props) { return props.start ? 'place-content: flex-start;' : ''; }, function (props) { return props.end ? 'place-content: flex-end;' : ''; }, function (props) { return props.middle ? 'align-items: center;' : ''; }, SharedStyles);
2379
- var Col = styled.div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n &&& {\n padding: ", ";\n flex: 12;\n flex-grow: 1;\n box-sizing: border-box;\n ", "\n ", "\n }\n"], ["\n &&& {\n padding: ", ";\n flex: 12;\n flex-grow: 1;\n box-sizing: border-box;\n ", "\n ", "\n }\n"])), function (props) { return props.padded ? '0.5rem' : 'initial'; }, SizerCss, SharedStyles);
2380
- var templateObject_1$7, templateObject_2$4, templateObject_3$1;
2426
+ var Row = styled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n &&& {\n display: flex;\n box-sizing: border-box;\n flex-direction: row;\n flex: 0 1 auto;\n justify-content: ", ";\n flex-wrap: ", ";\n align-items: ", ";\n padding: ", ";\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n box-sizing: border-box;\n flex-direction: row;\n flex: 0 1 auto;\n justify-content: ", ";\n flex-wrap: ", ";\n align-items: ", ";\n padding: ", ";\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.justify || 'left'; }, function (props) { return props.wrap ? props.wrap : 'wrap'; }, function (props) { return props.align || 'stretch'; }, function (props) { return props.padded ? '0.5rem' : 'initial'; }, function (props) { return props.start ? 'place-content: flex-start;' : ''; }, function (props) { return props.end ? 'place-content: flex-end;' : ''; }, function (props) { return props.middle ? 'align-items: center;' : ''; }, SharedStyles);
2427
+ var Col = styled.div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n &&& {\n padding: ", ";\n flex: 12;\n flex-grow: 1;\n box-sizing: border-box;\n ", "\n ", "\n }\n"], ["\n &&& {\n padding: ", ";\n flex: 12;\n flex-grow: 1;\n box-sizing: border-box;\n ", "\n ", "\n }\n"])), function (props) { return props.padded ? '0.5rem' : 'initial'; }, SizerCss, SharedStyles);
2428
+ var templateObject_1$8, templateObject_2$5;
2381
2429
 
2382
- var headingStyle = css(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"], ["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"])), function (props) { return getThemeColor(props, 'texttitle', colors.texttitle); });
2383
- var H1 = styled.h1(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n &&& {\n font-size: 30px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 30px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2430
+ var headingStyle = css(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"], ["\n font-family: \"skufont-demibold\", sans-serif;\n color: ", ";\n font-weight: bold;\n"])), function (props) { return getThemeColor(props, 'texttitle', colors.texttitle); });
2431
+ var H1 = styled.h1(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n &&& {\n font-size: 30px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 30px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2384
2432
  var H2 = styled.h2(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2385
- var H3 = styled.h3(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2386
- var H4 = styled.h4(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n &&& {\n font-size: 23px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 23px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2433
+ var H3 = styled.h3(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 25px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2434
+ var H4 = styled.h4(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n &&& {\n font-size: 23px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 23px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2387
2435
  var H5 = styled.h5(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n &&& {\n font-size: 20px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 20px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2388
2436
  var H6 = styled.h6(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n &&& {\n font-size: 18px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: 18px;\n border-bottom: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.underlined ? "1px solid #ccc" : "none"; }, headingStyle, SharedStyles);
2389
- var templateObject_1$8, templateObject_2$5, templateObject_3$2, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
2437
+ var templateObject_1$9, templateObject_2$6, templateObject_3$2, templateObject_4$1, templateObject_5$1, templateObject_6, templateObject_7;
2390
2438
 
2391
- var StyledBox = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n background: white;\n margin-top: 20px;\n box-shadow: ", ";\n border-radius: 5px;\n padding: 20px ", "px;\n ", "\n"], ["\n background: white;\n margin-top: 20px;\n box-shadow: ", ";\n border-radius: 5px;\n padding: 20px ", "px;\n ", "\n"])), function (props) { return props.borderless ? 0 : "0 2px 4px rgba(0, 0, 0, 0.07)"; }, function (props) { return props.padded ? 20 : 0; }, SharedStyles);
2439
+ var StyledBox = styled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n background: white;\n margin-top: 20px;\n box-shadow: ", ";\n border-radius: 5px;\n padding: 20px ", "px;\n ", "\n"], ["\n background: white;\n margin-top: 20px;\n box-shadow: ", ";\n border-radius: 5px;\n padding: 20px ", "px;\n ", "\n"])), function (props) { return props.borderless ? 0 : "0 2px 4px rgba(0, 0, 0, 0.07)"; }, function (props) { return props.padded ? 20 : 0; }, SharedStyles);
2392
2440
  var Box = function (_a) {
2393
2441
  var title = _a.title, controls = _a.controls, children = _a.children, props = __rest(_a, ["title", "controls", "children"]);
2394
2442
  return (React__default.createElement(StyledBox, __assign({ padded: props.padded, borderless: props.borderless }, props),
@@ -2399,16 +2447,16 @@ var Box = function (_a) {
2399
2447
  : null,
2400
2448
  children));
2401
2449
  };
2402
- var templateObject_1$9;
2403
-
2404
- var Background = styled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"], ["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors.bggray); }, function (props) { return props.padded ? 20 : 0; }, function (props) { return props.fillWindow ? "100vh" : 0; }, SharedStyles);
2405
2450
  var templateObject_1$a;
2406
2451
 
2407
- var StyledDropArea = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"], ["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors.primary); }, function (props) { return getThemeColor(props, 'bgblue', colors.bgblue); }, function (props) { return getColor$1(props); }, SharedStyles);
2408
- var PlaceHolder = styled.label(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"], ["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors.primary); });
2452
+ var Background = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"], ["\n &&& {\n background: ", ";\n padding: 20px ", "px;\n min-height: ", ";\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors.bggray); }, function (props) { return props.padded ? 20 : 0; }, function (props) { return props.fillWindow ? "100vh" : 0; }, SharedStyles);
2453
+ var templateObject_1$b;
2454
+
2455
+ var StyledDropArea = styled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"], ["\n &&& {\n padding: 20px;\n border: 2px dashed ", "; \n cursor: pointer;\n border-radius: 5px;\n &:hover {\n background-color: ", ";\n }\n border-color: ", ";\n outline: none;\n transition: border .24s ease-in-out;\n width: 100%;\n ", "\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors.primary); }, function (props) { return getThemeColor(props, 'bgblue', colors.bgblue); }, function (props) { return getColor$1(props); }, SharedStyles);
2456
+ var PlaceHolder = styled.label(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"], ["\n &&& {\n color: ", ";\n text-align: center;\n width: 100%;\n display: block;\n }\n"])), function (props) { return getThemeColor(props, 'primary', colors.primary); });
2409
2457
  var ThumbsContainer = styled.aside(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n &&& {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin-top: 16px;\n }\n"], ["\n &&& {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin-top: 16px;\n }\n"])));
2410
- var Thumb = styled.div(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n border-radius: 2px;\n border: 1px solid #eaeaea ", ";\n margin-bottom: 8px;\n margin-right: 8px;\n width: 100px;\n height: 100px;\n padding: 4px;\n box-sizing: border-box;\n }\n"], ["\n &&& {\n display: inline-flex;\n border-radius: 2px;\n border: 1px solid #eaeaea ", ";\n margin-bottom: 8px;\n margin-right: 8px;\n width: 100px;\n height: 100px;\n padding: 4px;\n box-sizing: border-box;\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors.bggray); });
2411
- var ThumbInner = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n &&& {\n display: flex;\n min-width: 0px;\n overflow: hidden;\n }\n"], ["\n &&& {\n display: flex;\n min-width: 0px;\n overflow: hidden;\n }\n"])));
2458
+ var Thumb = styled.div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n border-radius: 2px;\n border: 1px solid #eaeaea ", ";\n margin-bottom: 8px;\n margin-right: 8px;\n width: 100px;\n height: 100px;\n padding: 4px;\n box-sizing: border-box;\n }\n"], ["\n &&& {\n display: inline-flex;\n border-radius: 2px;\n border: 1px solid #eaeaea ", ";\n margin-bottom: 8px;\n margin-right: 8px;\n width: 100px;\n height: 100px;\n padding: 4px;\n box-sizing: border-box;\n }\n"])), function (props) { return getThemeColor(props, 'bggray', colors.bggray); });
2459
+ var ThumbInner = styled.div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n &&& {\n display: flex;\n min-width: 0px;\n overflow: hidden;\n }\n"], ["\n &&& {\n display: flex;\n min-width: 0px;\n overflow: hidden;\n }\n"])));
2412
2460
  var ImgPreview = styled.img(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n &&& {\n display: block;\n width: auto;\n height: 100%;\n }\n"], ["\n &&& {\n display: block;\n width: auto;\n height: 100%;\n }\n"])));
2413
2461
  var DropArea = function (_a) {
2414
2462
  var children = _a.children, placeholder = _a.placeholder, props = __rest(_a, ["children", "placeholder"]);
@@ -2466,7 +2514,7 @@ function DropzonedPreviews(_a) {
2466
2514
  ? React__default.createElement(ThumbsContainer, null, thumbs)
2467
2515
  : React__default.createElement(PlaceHolder, null, placeholder))));
2468
2516
  }
2469
- var templateObject_1$b, templateObject_2$6, templateObject_3$3, templateObject_4$1, templateObject_5$1, templateObject_6$1;
2517
+ var templateObject_1$c, templateObject_2$7, templateObject_3$3, templateObject_4$2, templateObject_5$2, templateObject_6$1;
2470
2518
 
2471
2519
  /*
2472
2520
 
@@ -2676,11 +2724,29 @@ var getVariantStyles = function (props, variant) {
2676
2724
  outlineColor: white,
2677
2725
  },
2678
2726
  };
2727
+ case 'text-error':
2728
+ return {
2729
+ borderWidth: 3,
2730
+ borderStyle: 'solid',
2731
+ borderColor: 'transparent',
2732
+ background: 'transparent',
2733
+ color: error,
2734
+ ':hover': {
2735
+ borderWidth: 3,
2736
+ borderStyle: 'solid',
2737
+ borderColor: error,
2738
+ background: error,
2739
+ color: white,
2740
+ },
2741
+ ':focus-visible': {
2742
+ outlineColor: 'transparent',
2743
+ },
2744
+ };
2679
2745
  default:
2680
2746
  return {};
2681
2747
  }
2682
2748
  };
2683
- var Button = styled.button(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n &&& {\n border: 3px solid white;\n border-radius: ", ";\n background: ", ";\n color: ", ";\n border-color: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n font-family: ", ";\n cursor: pointer;\n vertical-align: top;\n /*\n &:focus {\n outline: none;\n opacity: .9;\n box-shadow: 0 0 8px ", ";\n }\n */\n &:disabled {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n cursor: default;\n opacity: 0.5;\n }\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 3px solid white;\n border-radius: ", ";\n background: ", ";\n color: ", ";\n border-color: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n font-family: ", ";\n cursor: pointer;\n vertical-align: top;\n /*\n &:focus {\n outline: none;\n opacity: .9;\n box-shadow: 0 0 8px ", ";\n }\n */\n &:disabled {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n cursor: default;\n opacity: 0.5;\n }\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.size && sizes$1[props.size] ? sizes$1[props.size].borderRadius : '4px'; }, function (_a) {
2749
+ var Button = styled.button(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n &&& {\n border: 3px solid white;\n border-radius: ", ";\n background: ", ";\n color: ", ";\n border-color: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n font-family: ", ";\n cursor: pointer;\n vertical-align: top;\n /*\n &:focus {\n outline: none;\n opacity: .9;\n box-shadow: 0 0 8px ", ";\n }\n */\n &:disabled {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n cursor: default;\n opacity: 0.5;\n }\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 3px solid white;\n border-radius: ", ";\n background: ", ";\n color: ", ";\n border-color: ", ";\n font-size: ", ";\n line-height: ", ";\n padding: ", ";\n font-family: ", ";\n cursor: pointer;\n vertical-align: top;\n /*\n &:focus {\n outline: none;\n opacity: .9;\n box-shadow: 0 0 8px ", ";\n }\n */\n &:disabled {\n background-color: ", ";\n border-color: ", ";\n color: ", ";\n cursor: default;\n opacity: 0.5;\n }\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.size && sizes$1[props.size] ? sizes$1[props.size].borderRadius : '4px'; }, function (_a) {
2684
2750
  var secondary = _a.secondary, cta = _a.cta, props = __rest(_a, ["secondary", "cta"]);
2685
2751
  return secondary ? "transparent" :
2686
2752
  cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.teal.main);
@@ -2689,7 +2755,7 @@ var Button = styled.button(templateObject_1$c || (templateObject_1$c = __makeTem
2689
2755
  return secondary ? getThemeColor(props, 'primary', colors.primary) :
2690
2756
  cta ? getThemeColor(props, 'cta', colors.cta) : getThemeColor(props, 'primary', colors.primary);
2691
2757
  }, function (props) { return getThemeColor(props, 'disabledButton', colors.disabledButton); }, function (props) { return getThemeColor(props, 'disabledButtonBorder', colors.disabledButtonBorder); }, function (props) { return getThemeColor(props, 'primary', colors.primary); }, function (p) { return getVariantStyles(p, p.variant || 'primary'); }, SharedStyles, SizerCss);
2692
- var ButtonsGroup = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n &&& {\n display: inline-block;\n max-width: 100%;\n margin-bottom: 10px;\n margin-right: 100px;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: inline-block;\n max-width: 100%;\n margin-bottom: 10px;\n margin-right: 100px;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
2758
+ var ButtonsGroup = styled.div(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n &&& {\n display: inline-block;\n max-width: 100%;\n margin-bottom: 10px;\n margin-right: 100px;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: inline-block;\n max-width: 100%;\n margin-bottom: 10px;\n margin-right: 100px;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
2693
2759
  var presets = {
2694
2760
  edit: {
2695
2761
  size: "medium",
@@ -2711,52 +2777,64 @@ var presets = {
2711
2777
  close: {
2712
2778
  Icon: XIcon,
2713
2779
  variant: 'secondary'
2780
+ },
2781
+ drag: {
2782
+ Icon: DragIcon,
2783
+ variant: 'text',
2784
+ style: {
2785
+ cursor: 'grab',
2786
+ }
2714
2787
  }
2715
2788
  };
2716
2789
  function getPropsByPresets(props, preset) {
2717
2790
  var presetProps = get(presets, [preset || ""]) || {};
2718
2791
  return __assign(__assign({}, presetProps), props);
2719
2792
  }
2720
- function IconButton(props) {
2793
+ var IconButton = React__default.forwardRef(function (props, ref) {
2721
2794
  var _a = getPropsByPresets(props, props.preset), Icon = _a.Icon, children = _a.children, _b = _a.iconPosition, iconPosition = _b === void 0 ? 'left' : _b, _c = _a.size, size = _c === void 0 ? "medium" : _c, _d = _a.iconProps, iconProps = _d === void 0 ? {} : _d, newProps = __rest(_a, ["Icon", "children", "iconPosition", "size", "iconProps"]);
2722
- var variantStyles = newProps.variant
2723
- ? getVariantStyles(props, newProps.variant)
2724
- : { color: '#fff' };
2725
- var RenderIcon = React__default.useMemo(function () {
2726
- if (!Icon) {
2727
- return null;
2728
- }
2729
- var btnSize = "small";
2730
- if (size !== "tiny" && size !== "small") {
2731
- btnSize = "medium";
2732
- }
2733
- var iconNewProps = __assign(__assign({}, iconProps), { size: btnSize, color: variantStyles.color || '#fff', style: __assign({ verticalAlign: 'top', paddingRight: children && iconPosition === "left" ? '5px' : '0px', paddingLeft: children && iconPosition === "right" ? '5px' : '0px', boxSizing: 'content-box' }, (iconProps.style || {})) });
2734
- if (typeof Icon !== 'function') {
2735
- return React__default.cloneElement(Icon, iconNewProps);
2736
- }
2737
- return (React__default.createElement(Icon, __assign({}, iconNewProps)));
2738
- }, [variantStyles.color, Icon, size, iconPosition, iconProps, children]);
2795
+ var _e = useState(false), hovering = _e[0], setHovering = _e[1];
2796
+ var variantStyles = React__default.useMemo(function () {
2797
+ return newProps.variant
2798
+ ? getVariantStyles(props, newProps.variant)
2799
+ : { color: '#fff' };
2800
+ }, [newProps, props]);
2739
2801
  var hasChildren = ((children && children !== null && children !== undefined)
2740
2802
  || (children && Array.isArray(children) && children.length > 0
2741
2803
  && children[0] !== null && children[0] !== undefined));
2742
2804
  var buttonPadding = !hasChildren
2743
2805
  ? getSizeStyle$1('iconOnlyPadding', '12px')
2744
2806
  : getSizeStyle$1('padding', '12px');
2745
- return (React__default.createElement(Button, __assign({ size: size }, newProps, { style: __assign(__assign(__assign({}, (newProps.style || {})), { padding: buttonPadding(__assign(__assign({}, newProps), { size: size })) }), (iconPosition === "top" || iconPosition === "bottom" ? {
2807
+ return (React__default.createElement(Button, __assign({ ref: ref, size: size }, newProps, { style: __assign(__assign(__assign({}, (newProps.style || {})), { padding: buttonPadding(__assign(__assign({}, newProps), { size: size })) }), (iconPosition === "top" || iconPosition === "bottom" ? {
2746
2808
  display: 'flex',
2747
2809
  flexDirection: 'column',
2748
2810
  alignItems: 'center',
2749
- } : {})) }),
2750
- ['left', 'top'].includes(iconPosition) ? RenderIcon : null,
2811
+ } : {})), onMouseOver: function () { return setHovering(true); }, onMouseLeave: function () { return setHovering(false); } }),
2812
+ ['left', 'top'].includes(iconPosition) && React__default.createElement(ButtonIcon, { Icon: Icon, size: size, variantStyles: variantStyles, iconProps: iconProps, iconPosition: iconPosition, hasChildren: !!hasChildren, isHovering: hovering }),
2751
2813
  children,
2752
- ['right', 'bottom'].includes(iconPosition) ? RenderIcon : null));
2753
- }
2754
- var templateObject_1$c, templateObject_2$7;
2814
+ ['right', 'bottom'].includes(iconPosition) && React__default.createElement(ButtonIcon, { Icon: Icon, size: size, variantStyles: variantStyles, iconProps: iconProps, iconPosition: iconPosition, hasChildren: !!hasChildren, isHovering: hovering })));
2815
+ });
2816
+ var ButtonIcon = React__default.forwardRef(function (props, ref) {
2817
+ var Icon = props.Icon, size = props.size, variantStyles = props.variantStyles, _a = props.iconProps, iconProps = _a === void 0 ? {} : _a, iconPosition = props.iconPosition, hasChildren = props.hasChildren, isHovering = props.isHovering;
2818
+ if (!Icon) {
2819
+ return null;
2820
+ }
2821
+ var btnSize = "small";
2822
+ if (size !== "tiny" && size !== "small") {
2823
+ btnSize = "medium";
2824
+ }
2825
+ var hoverColor = get(variantStyles, [':hover', 'color']) || '';
2826
+ var iconNewProps = __assign(__assign({}, iconProps), { size: btnSize, color: hoverColor && isHovering ? hoverColor : ((iconProps === null || iconProps === void 0 ? void 0 : iconProps.color) || variantStyles.color || '#fff'), style: __assign({ verticalAlign: 'top', paddingRight: hasChildren && iconPosition === "left" ? '5px' : '0px', paddingLeft: hasChildren && iconPosition === "right" ? '5px' : '0px', boxSizing: 'content-box' }, ((iconProps === null || iconProps === void 0 ? void 0 : iconProps.style) || {})) });
2827
+ if (typeof Icon !== 'function') {
2828
+ return React__default.cloneElement(Icon, iconNewProps);
2829
+ }
2830
+ return (React__default.createElement(Icon, __assign({}, iconNewProps, { ref: ref })));
2831
+ });
2832
+ var templateObject_1$d, templateObject_2$8;
2755
2833
 
2756
- var Label = styled.label(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n color: ", ";\n font-size: 1rem;\n font-weight: 400;\n width: 100%;\n ", "\n }\n"], ["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n color: ", ";\n font-size: 1rem;\n font-weight: 400;\n width: 100%;\n ", "\n }\n"])), function (props) { return props.error ? getThemeColor(props, 'special3') : getThemeColor(props, 'textlabel'); }, SharedStyles);
2757
- var templateObject_1$d;
2834
+ var Label = styled.label(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n color: ", ";\n font-size: 1rem;\n font-weight: 400;\n width: 100%;\n ", "\n }\n"], ["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n color: ", ";\n font-size: 1rem;\n font-weight: 400;\n width: 100%;\n ", "\n }\n"])), function (props) { return props.error ? getThemeColor(props, 'special3') : getThemeColor(props, 'textlabel'); }, SharedStyles);
2835
+ var templateObject_1$e;
2758
2836
 
2759
- var InputIconLabel = styled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n&&& {\n box-sizing: border-box;\n width: 40px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: 1rem;\n color: white;\n font-size: 18px;\n text-align: center;\n line-height: 1.5rem;\n padding: 6px;\n\n :hover {\n background: ", ";\n }\n\n ", "\n\n ", "\n\n ", "\n}\n"], ["\n&&& {\n box-sizing: border-box;\n width: 40px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: 1rem;\n color: white;\n font-size: 18px;\n text-align: center;\n line-height: 1.5rem;\n padding: 6px;\n\n :hover {\n background: ", ";\n }\n\n ", "\n\n ", "\n\n ", "\n}\n"])), function (p) { return p.error ? 38 : 36; }, function (p) {
2837
+ var InputIconLabel = styled.div(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n&&& {\n box-sizing: border-box;\n width: 40px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: 1rem;\n color: white;\n font-size: 18px;\n text-align: center;\n line-height: 1.5rem;\n padding: 6px;\n\n :hover {\n background: ", ";\n }\n\n ", "\n\n ", "\n\n ", "\n}\n"], ["\n&&& {\n box-sizing: border-box;\n width: 40px;\n height: ", "px;\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: 1rem;\n color: white;\n font-size: 18px;\n text-align: center;\n line-height: 1.5rem;\n padding: 6px;\n\n :hover {\n background: ", ";\n }\n\n ", "\n\n ", "\n\n ", "\n}\n"])), function (p) { return p.error ? 38 : 36; }, function (p) {
2760
2838
  return p.error
2761
2839
  ? getThemeColor(p, 'errors.main', colors.errors.main)
2762
2840
  : getThemeColor(p, 'input.iconWrapper.background', colors.input.iconWrapper.background);
@@ -2767,7 +2845,7 @@ var InputIconLabel = styled.div(templateObject_1$e || (templateObject_1$e = __ma
2767
2845
  : ''; }, function (p) { return p.isDisabled
2768
2846
  ? "background: ".concat(getThemeColor(p, 'input.iconWrapper.disabled.background'), ";")
2769
2847
  : ''; });
2770
- var InputIconLabelContainer = styled.div(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-start;\n align-items: center;\n\n ", "\n"], ["\n display: flex;\n justify-content: flex-start;\n align-items: center;\n\n ", "\n"])), function (p) {
2848
+ var InputIconLabelContainer = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-start;\n align-items: center;\n\n ", "\n"], ["\n display: flex;\n justify-content: flex-start;\n align-items: center;\n\n ", "\n"])), function (p) {
2771
2849
  return {
2772
2850
  fontSize: '1rem',
2773
2851
  fontFamily: "'skufont-regular', sans-serif",
@@ -2841,8 +2919,8 @@ var Input = styled.input(templateObject_3$4 || (templateObject_3$4 = __makeTempl
2841
2919
  return styles;
2842
2920
  }, SharedStyles);
2843
2921
  var LabeledInput = React__default.forwardRef(function (_a, ref) {
2844
- var label = _a.label, name = _a.name, required = _a.required, _b = _a.labelOnTop, labelOnTop = _b === void 0 ? false : _b, props = __rest(_a, ["label", "name", "required", "labelOnTop"]);
2845
- return (React__default.createElement("div", null,
2922
+ var label = _a.label, name = _a.name, required = _a.required, _b = _a.labelOnTop, labelOnTop = _b === void 0 ? false : _b, _c = _a.wrapperProps, wrapperProps = _c === void 0 ? {} : _c, props = __rest(_a, ["label", "name", "required", "labelOnTop", "wrapperProps"]);
2923
+ return (React__default.createElement("div", __assign({}, wrapperProps),
2846
2924
  React__default.createElement(Label, { htmlFor: name, style: __assign(__assign({}, (!labelOnTop ? {} : { display: 'block' })), { fontFamily: "'skufont-medium', sans-serif", lineHeight: '24px', fontSize: '16px', color: getThemeColor(props, 'neutrals.100') }) },
2847
2925
  label,
2848
2926
  " ",
@@ -2925,8 +3003,8 @@ var LabeledIconInput = React__default.forwardRef(function (_a, ref) {
2925
3003
  React__default.createElement(Input, { hasIcon: true, ref: ref, name: name, value: value, defaultValue: defaultValue, placeholder: placeholder, required: required, style: { marginBottom: 0, }, noMargin: noMargin, error: error, disabled: disabled, onFocus: onFocus, onChange: onChange, onBlur: onBlur }),
2926
3004
  iconPosition === 'right' ? React__default.createElement(InputIconLabel, { style: { marginBottom: 0, padding: 6, }, isActive: isActive, isDisabled: disabled, isHover: isHovering, iconPosition: iconPosition }, NewIcon) : null)));
2927
3005
  });
2928
- var CheckboxLabel = styled.label(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n position: relative;\n margin-bottom: 12px;\n margin-right: 24px;\n cursor: ", ";\n font-size: ", ";\n color: ", ";\n font-family: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-weight: normal;\n line-height: ", ";\n box-sizing: border-box;\n opacity: ", ";\n &:focus {\n outline: 0;\n }\n }\n"], ["\n &&& {\n display: inline-flex;\n position: relative;\n margin-bottom: 12px;\n margin-right: 24px;\n cursor: ", ";\n font-size: ", ";\n color: ", ";\n font-family: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-weight: normal;\n line-height: ", ";\n box-sizing: border-box;\n opacity: ", ";\n &:focus {\n outline: 0;\n }\n }\n"])), function (props) { return props.disabled ? 'default' : 'pointer'; }, fontStyles.label.fontSize, neutrals.darkest, fontStyles.label.fontFamily, fontStyles.label.lineHeight, function (props) { return props.disabled ? 0.7 : 1; });
2929
- var RadioLabel = styled(CheckboxLabel)(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n &&& {\n padding-left: 32px;\n }\n"], ["\n &&& {\n padding-left: 32px;\n }\n"])));
3006
+ var CheckboxLabel = styled.label(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n position: relative;\n margin-bottom: 12px;\n margin-right: 24px;\n cursor: ", ";\n font-size: ", ";\n color: ", ";\n font-family: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-weight: normal;\n line-height: ", ";\n box-sizing: border-box;\n opacity: ", ";\n &:focus {\n outline: 0;\n }\n }\n"], ["\n &&& {\n display: inline-flex;\n position: relative;\n margin-bottom: 12px;\n margin-right: 24px;\n cursor: ", ";\n font-size: ", ";\n color: ", ";\n font-family: ", ";\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n font-weight: normal;\n line-height: ", ";\n box-sizing: border-box;\n opacity: ", ";\n &:focus {\n outline: 0;\n }\n }\n"])), function (props) { return props.disabled ? 'default' : 'pointer'; }, fontStyles.label.fontSize, neutrals.darkest, fontStyles.label.fontFamily, fontStyles.label.lineHeight, function (props) { return props.disabled ? 0.7 : 1; });
3007
+ var RadioLabel = styled(CheckboxLabel)(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n &&& {\n padding-left: 32px;\n }\n"], ["\n &&& {\n padding-left: 32px;\n }\n"])));
2930
3008
  var Radio = styled.input(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n &&& {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:checked {\n background-color: white;\n display: block;\n }\n &:hover {\n background-color: #02c0da;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n position: absolute;\n opacity: 0;\n cursor: pointer;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:checked {\n background-color: white;\n display: block;\n }\n &:hover {\n background-color: #02c0da;\n }\n ", "\n ", "\n }\n"])), function (props) { return props.isHovering && "background-color: #02c0da;"; }, SharedStyles);
2931
3009
  var CheckMark = styled.span(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n height: 23px;\n width: 23px;\n background-color: ", ";\n opacity: ", ";\n filter: ", ";\n border: 2px solid #02c0da;\n border-radius: 4px;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:hover {\n background-color: ", ";\n }\n &::after {\n content: \"\";\n position: absolute;\n left: 9px;\n top: 5px;\n width: 5px;\n height: 10px;\n border: solid white;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n box-sizing: border-box;\n display: ", ";\n }\n ", "\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n height: 23px;\n width: 23px;\n background-color: ", ";\n opacity: ", ";\n filter: ", ";\n border: 2px solid #02c0da;\n border-radius: 4px;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:hover {\n background-color: ", ";\n }\n &::after {\n content: \"\";\n position: absolute;\n left: 9px;\n top: 5px;\n width: 5px;\n height: 10px;\n border: solid white;\n border-width: 0 3px 3px 0;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n box-sizing: border-box;\n display: ", ";\n }\n ", "\n"])), function (props) { return ((props.isHovering || props.checked) && !props.disabled) ? '#02c0da' : 'white'; }, function (props) { return props.disabled ? 0.7 : 1; }, function (props) { return props.disabled ? "grayscale(100%)" : "none"; }, function (props) { return props.disabled ? "white" : "#02c0da"; }, function (props) { return props.checked ? 'block' : 'none'; }, SharedStyles);
2932
3010
  var Dot = styled.span(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n &&& {\n position: absolute;\n top: 0;\n left: 0;\n height: 23px;\n width: 23px;\n opacity: ", ";\n filter: ", ";\n background-color: ", ";\n border: 2px solid #02c0da;\n border-radius: 50%;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:hover {\n background-color: ", ";\n }\n &::after {\n top: 5px;\n left: 5px;\n width: 9px;\n height: 9px;\n border-radius: 50%;\n background: #02c0da;\n content: \"\";\n position: absolute;\n display: none;\n ", "\n }\n ", "\n"], ["\n &&& {\n position: absolute;\n top: 0;\n left: 0;\n height: 23px;\n width: 23px;\n opacity: ", ";\n filter: ", ";\n background-color: ", ";\n border: 2px solid #02c0da;\n border-radius: 50%;\n box-sizing: border-box;\n &:focus {\n outline: 0;\n }\n &:hover {\n background-color: ", ";\n }\n &::after {\n top: 5px;\n left: 5px;\n width: 9px;\n height: 9px;\n border-radius: 50%;\n background: #02c0da;\n content: \"\";\n position: absolute;\n display: none;\n ", "\n }\n ", "\n"])), function (props) { return props.disabled ? 0.7 : 1; }, function (props) { return props.disabled ? "grayscale(100%)" : "none"; }, function (props) { return (props.isHovering && !props.checked && !props.disabled) ? '#02c0da' : 'white'; }, function (props) { return !props.checked && !props.disabled ? '#02c0da' : 'white'; }, function (props) { return props.checked && "display: block;"; }, SharedStyles);
@@ -2937,14 +3015,14 @@ CheckMark.defaultProps = {
2937
3015
  checked: false,
2938
3016
  };
2939
3017
  var LabeledRadio = function (_a) {
2940
- var label = _a.label, name = _a.name, checked = _a.checked, disabled = _a.disabled, labelStyle = _a.labelStyle, radioIconStyle = _a.radioIconStyle, radioColor = _a.radioColor, radioHoverColor = _a.radioHoverColor, onChange = _a.onChange, props = __rest(_a, ["label", "name", "checked", "disabled", "labelStyle", "radioIconStyle", "radioColor", "radioHoverColor", "onChange"]);
2941
- var _b = useState(false), isHovering = _b[0], updateHover = _b[1];
3018
+ var label = _a.label, name = _a.name, checked = _a.checked, disabled = _a.disabled, labelStyle = _a.labelStyle, radioIconStyle = _a.radioIconStyle, radioColor = _a.radioColor, radioHoverColor = _a.radioHoverColor, onChange = _a.onChange, _b = _a.labelProps, labelProps = _b === void 0 ? {} : _b, _c = _a.radioIconProps, radioIconProps = _c === void 0 ? {} : _c, props = __rest(_a, ["label", "name", "checked", "disabled", "labelStyle", "radioIconStyle", "radioColor", "radioHoverColor", "onChange", "labelProps", "radioIconProps"]);
3019
+ var _d = useState(false), isHovering = _d[0], updateHover = _d[1];
2942
3020
  var radio = useRef(null);
2943
- return (React__default.createElement(RadioLabel, { htmlFor: name, onMouseOver: function (e) { return updateHover(true); }, onMouseLeave: function (e) { return updateHover(false); }, disabled: disabled, style: __assign({}, labelStyle), onClick: function () {
3021
+ return (React__default.createElement(RadioLabel, __assign({}, labelProps, { htmlFor: name, onMouseOver: function (e) { return updateHover(true); }, onMouseLeave: function (e) { return updateHover(false); }, disabled: disabled, style: __assign(__assign({}, labelStyle), (labelProps.style || {})), onClick: function () {
2944
3022
  var _a;
2945
3023
  (_a = radio.current) === null || _a === void 0 ? void 0 : _a.click();
2946
- } },
2947
- React__default.createElement(RadioIcon, { selected: checked, hover: isHovering, disabled: disabled, color: radioColor, hoverColor: radioHoverColor, mr: 8, style: radioIconStyle ? __assign({}, radioIconStyle) : { position: 'absolute', left: 0 } }),
3024
+ } }),
3025
+ React__default.createElement(RadioIcon, __assign({}, radioIconProps, { selected: checked, hover: isHovering, disabled: disabled, color: radioColor, hoverColor: radioHoverColor, mr: 8, style: __assign(__assign({}, (radioIconProps.style || {})), (radioIconStyle ? radioIconStyle : { position: 'absolute', left: 0 })) })),
2948
3026
  label,
2949
3027
  React__default.createElement(Radio, __assign({ ref: radio, name: name, type: "radio", checked: checked, isHovering: isHovering, onChange: disabled ? undefined : onChange }, props))));
2950
3028
  };
@@ -2973,37 +3051,37 @@ var LabeledRadioInButtonGroup = function (_a) {
2973
3051
  }));
2974
3052
  };
2975
3053
  var LabeledCheckbox = React__default.forwardRef(function (_a, ref) {
2976
- var label = _a.label, name = _a.name, checked = _a.checked, disabled = _a.disabled, onChange = _a.onChange, checkboxColor = _a.checkboxColor, checkboxHoverColor = _a.checkboxHoverColor, _b = _a.labelStyle, labelStyle = _b === void 0 ? {} : _b, _c = _a.checkboxStyle, checkboxStyle = _c === void 0 ? {} : _c, _d = _a.hoverByLabel, hoverByLabel = _d === void 0 ? true : _d, _e = _a.stopPropagation, props = __rest(_a, ["label", "name", "checked", "disabled", "onChange", "checkboxColor", "checkboxHoverColor", "labelStyle", "checkboxStyle", "hoverByLabel", "stopPropagation"]);
2977
- var _f = useState(false), isHovering = _f[0], updateHover = _f[1];
3054
+ var label = _a.label, name = _a.name, checked = _a.checked, disabled = _a.disabled, indeterminate = _a.indeterminate, onChange = _a.onChange, checkboxColor = _a.checkboxColor, checkboxHoverColor = _a.checkboxHoverColor, _b = _a.labelStyle, labelStyle = _b === void 0 ? {} : _b, _c = _a.checkboxStyle, checkboxStyle = _c === void 0 ? {} : _c, _d = _a.hoverByLabel, hoverByLabel = _d === void 0 ? true : _d, _e = _a.stopPropagation, _f = _a.labelProps, labelProps = _f === void 0 ? {} : _f, _g = _a.checkboxIconProps, checkboxIconProps = _g === void 0 ? {} : _g, props = __rest(_a, ["label", "name", "checked", "disabled", "indeterminate", "onChange", "checkboxColor", "checkboxHoverColor", "labelStyle", "checkboxStyle", "hoverByLabel", "stopPropagation", "labelProps", "checkboxIconProps"]);
3055
+ var _h = useState(false), isHovering = _h[0], updateHover = _h[1];
2978
3056
  var onMouseOver = function (e) { return updateHover(true); };
2979
3057
  var onMouseLeave = function (e) { return updateHover(false); };
2980
- return (React__default.createElement(CheckboxLabel, { htmlFor: name, onMouseOver: hoverByLabel ? onMouseOver : undefined, onMouseLeave: hoverByLabel ? onMouseLeave : undefined, disabled: disabled, style: labelStyle },
2981
- React__default.createElement(CheckboxIcon, { hover: isHovering, selected: checked, disabled: disabled, color: checkboxColor, hoverColor: checkboxHoverColor, mr: 8, style: __assign({}, checkboxStyle) }),
3058
+ return (React__default.createElement(CheckboxLabel, __assign({ htmlFor: name, onMouseOver: hoverByLabel ? onMouseOver : undefined, onMouseLeave: hoverByLabel ? onMouseLeave : undefined, disabled: disabled }, labelProps, { style: labelStyle }),
3059
+ React__default.createElement(CheckboxIcon, __assign({}, checkboxIconProps, { hover: isHovering, selected: checked, disabled: disabled, color: checkboxColor, hoverColor: checkboxHoverColor, indeterminate: indeterminate, mr: 8, style: __assign({}, checkboxStyle) })),
2982
3060
  label,
2983
3061
  React__default.createElement(Radio, __assign({ ref: ref, name: name, type: "checkbox", checked: checked, isHovering: isHovering, onChange: disabled ? undefined : onChange }, props))));
2984
3062
  });
2985
- var templateObject_1$e, templateObject_2$8, templateObject_3$4, templateObject_4$2, templateObject_5$2, templateObject_6$2, templateObject_7$1, templateObject_8;
3063
+ var templateObject_1$f, templateObject_2$9, templateObject_3$4, templateObject_4$3, templateObject_5$3, templateObject_6$2, templateObject_7$1, templateObject_8;
2986
3064
 
2987
- var Padding = styled.div(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n padding: 20px;\n ", "\n"], ["\n padding: 20px;\n ", "\n"])), SharedStyles);
2988
- var templateObject_1$f;
3065
+ var Padding = styled.div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n padding: 20px;\n ", "\n"], ["\n padding: 20px;\n ", "\n"])), SharedStyles);
3066
+ var templateObject_1$g;
2989
3067
 
2990
3068
  /*
2991
3069
 
2992
3070
  Styles common for every commonsku page
2993
3071
 
2994
3072
  */
2995
- var StyledPage = styled.div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n font-family: 'skufont-regular', sans-serif;\n ", "\n"], ["\n font-family: 'skufont-regular', sans-serif;\n ", "\n"])), SharedStyles);
3073
+ var StyledPage = styled.div(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n font-family: 'skufont-regular', sans-serif;\n ", "\n"], ["\n font-family: 'skufont-regular', sans-serif;\n ", "\n"])), SharedStyles);
2996
3074
  function Page(props) {
2997
3075
  return React__default.createElement(StyledPage, __assign({}, props), props.children);
2998
3076
  }
2999
- var templateObject_1$g;
3077
+ var templateObject_1$h;
3000
3078
 
3001
- var Text = styled.span(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n font-family: ", ";\n ", "\n color: ", ";\n background-color: ", ";\n border-radius: ", ";\n padding: ", ";\n ", "\n"], ["\n font-family: ", ";\n ", "\n color: ", ";\n background-color: ", ";\n border-radius: ", ";\n padding: ", ";\n ", "\n"])), fonts.join(', '), function (p) { return p.bold ? ({ fontWeight: 'bold' }) : ({}); }, function (props) { var _a; return getThemeColor(props, (_a = props.color) !== null && _a !== void 0 ? _a : 'textbody', 'textbody') || 'textbody'; }, function (props) { return props.bg ? getThemeColor(props, "".concat(props.color || 'transparent', "Bg"), 'transparent') : 'transparent'; }, function (props) { return props.bg ? '5px' : '0px'; }, function (props) { return props.bg ? '5px' : '0px'; }, SharedStyles);
3079
+ var Text = styled.span(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n font-family: ", ";\n ", "\n color: ", ";\n background-color: ", ";\n border-radius: ", ";\n padding: ", ";\n ", "\n"], ["\n font-family: ", ";\n ", "\n color: ", ";\n background-color: ", ";\n border-radius: ", ";\n padding: ", ";\n ", "\n"])), fonts.join(', '), function (p) { return p.bold ? ({ fontWeight: 'bold' }) : ({}); }, function (props) { var _a; return getThemeColor(props, (_a = props.color) !== null && _a !== void 0 ? _a : 'textbody', 'textbody') || 'textbody'; }, function (props) { return props.bg ? getThemeColor(props, "".concat(props.color || 'transparent', "Bg"), 'transparent') : 'transparent'; }, function (props) { return props.bg ? '5px' : '0px'; }, function (props) { return props.bg ? '5px' : '0px'; }, SharedStyles);
3002
3080
  var _Link = function (_a) {
3003
3081
  var highlight = _a.highlight, props = __rest(_a, ["highlight"]);
3004
3082
  return React__default.createElement(Text, __assign({ color: highlight ? 'special2' : 'primary' }, props));
3005
3083
  };
3006
- var Link = styled(_Link)(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n cursor: pointer;\n ", "\n"], ["\n cursor: pointer;\n ", "\n"])), SharedStyles);
3084
+ var Link = styled(_Link)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n cursor: pointer;\n ", "\n"], ["\n cursor: pointer;\n ", "\n"])), SharedStyles);
3007
3085
  function numberWithCommas(num) {
3008
3086
  return num.replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,');
3009
3087
  }
@@ -3012,10 +3090,10 @@ var Number$1 = function (_a) {
3012
3090
  var fixedNum = (toNumber(num) || 0).toFixed(decimalPoints);
3013
3091
  return React__default.createElement("span", __assign({}, props), commas ? numberWithCommas(fixedNum) : fixedNum);
3014
3092
  };
3015
- var templateObject_1$h, templateObject_2$9;
3093
+ var templateObject_1$i, templateObject_2$a;
3016
3094
 
3017
- var ProgressWrapper = styled.div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n max-width: 100%;\n width: 100%;\n height: 20px;\n background: #ECF4F7;\n ", "\n"], ["\n max-width: 100%;\n width: 100%;\n height: 20px;\n background: #ECF4F7;\n ", "\n"])), SharedStyles);
3018
- var ProgressBar = styled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n max-width: 100%;\n width: ", "%;\n height: 100%;\n background: ", ";\n"], ["\n max-width: 100%;\n width: ", "%;\n height: 100%;\n background: ", ";\n"])), function (props) { return 100 * props.value / props.max; }, function (props) { return props.error ? "#B21154" : "#00d374"; });
3095
+ var ProgressWrapper = styled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n max-width: 100%;\n width: 100%;\n height: 20px;\n background: #ECF4F7;\n ", "\n"], ["\n max-width: 100%;\n width: 100%;\n height: 20px;\n background: #ECF4F7;\n ", "\n"])), SharedStyles);
3096
+ var ProgressBar = styled.div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n max-width: 100%;\n width: ", "%;\n height: 100%;\n background: ", ";\n"], ["\n max-width: 100%;\n width: ", "%;\n height: 100%;\n background: ", ";\n"])), function (props) { return 100 * props.value / props.max; }, function (props) { return props.error ? "#B21154" : "#00d374"; });
3019
3097
  var Progress = function (props) {
3020
3098
  var val = typeof props.value === 'number'
3021
3099
  ? props.value
@@ -3038,7 +3116,7 @@ var LabeledProgress = function (props) {
3038
3116
  React__default.createElement("br", null),
3039
3117
  React__default.createElement(Progress, { value: props.value, max: props.max, error: props.error }));
3040
3118
  };
3041
- var templateObject_1$i, templateObject_2$a;
3119
+ var templateObject_1$j, templateObject_2$b;
3042
3120
 
3043
3121
  var popupStyles = {
3044
3122
  menuPlacement: 'auto',
@@ -3218,8 +3296,8 @@ var LabeledAsyncSelect = React__default.forwardRef(function (_a, ref) {
3218
3296
  React__default.createElement(SKUAsyncSelect, __assign({}, props, { ref: ref }))));
3219
3297
  });
3220
3298
 
3221
- var Backdrop = styled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(67, 83, 91, .3);\n z-index: 100;\n transition: all ", "s ease-in-out;\n -moz-transition: all ", "s ease-in-out;\n -webkit-transition: all ", "s ease-in-out;\n opacity: 0.8;\n"], ["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(67, 83, 91, .3);\n z-index: 100;\n transition: all ", "s ease-in-out;\n -moz-transition: all ", "s ease-in-out;\n -webkit-transition: all ", "s ease-in-out;\n opacity: 0.8;\n"])), function (p) { return ((p.animationDuration || 300) / 1000); }, function (p) { return ((p.animationDuration || 300) / 1000); }, function (p) { return ((p.animationDuration || 300) / 1000); });
3222
- var templateObject_1$j;
3299
+ var Backdrop = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(67, 83, 91, .3);\n z-index: 100;\n transition: all ", "s ease-in-out;\n -moz-transition: all ", "s ease-in-out;\n -webkit-transition: all ", "s ease-in-out;\n opacity: 0.8;\n"], ["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(67, 83, 91, .3);\n z-index: 100;\n transition: all ", "s ease-in-out;\n -moz-transition: all ", "s ease-in-out;\n -webkit-transition: all ", "s ease-in-out;\n opacity: 0.8;\n"])), function (p) { return ((p.animationDuration || 300) / 1000); }, function (p) { return ((p.animationDuration || 300) / 1000); }, function (p) { return ((p.animationDuration || 300) / 1000); });
3300
+ var templateObject_1$k;
3223
3301
 
3224
3302
  function getSlideStyles(from, visible, height) {
3225
3303
  if (from === void 0) { from = "right"; }
@@ -3239,7 +3317,7 @@ function getSlideStyles(from, visible, height) {
3239
3317
  }
3240
3318
  return '';
3241
3319
  }
3242
- var StyledPanel = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n height: ", "vh;\n background: white;\n position: fixed;\n width: ", ";\n z-index: 300;\n box-shadow: 0 0 10px rgba(61, 79, 90, 0.27);\n padding: 1em;\n overflow: scroll;\n @media only screen and (max-width: 640px) {\n width: 100% !important;\n }\n ", "\n transition: transform ", "s ease-out;\n ", "\n ", "\n"], ["\n height: ", "vh;\n background: white;\n position: fixed;\n width: ", ";\n z-index: 300;\n box-shadow: 0 0 10px rgba(61, 79, 90, 0.27);\n padding: 1em;\n overflow: scroll;\n @media only screen and (max-width: 640px) {\n width: 100% !important;\n }\n ", "\n transition: transform ", "s ease-out;\n ", "\n ", "\n"])), function (p) { return valIsValid(p.height) ? p.height : p.from === "bottom" || p.from === "top" ? 50 : 100; }, function (p) { return valIsValid(p.width) ? p.width : p.from === "bottom" || p.from === "top" ? '100%' : '560px'; }, function (p) { return getSlideStyles(p.from, p.visible, p.height); }, function (p) { return (
3320
+ var StyledPanel = styled.div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n height: ", "vh;\n background: white;\n position: fixed;\n width: ", ";\n z-index: 300;\n box-shadow: 0 0 10px rgba(61, 79, 90, 0.27);\n padding: 1em;\n overflow: scroll;\n @media only screen and (max-width: 640px) {\n width: 100% !important;\n }\n ", "\n transition: transform ", "s ease-out;\n ", "\n ", "\n"], ["\n height: ", "vh;\n background: white;\n position: fixed;\n width: ", ";\n z-index: 300;\n box-shadow: 0 0 10px rgba(61, 79, 90, 0.27);\n padding: 1em;\n overflow: scroll;\n @media only screen and (max-width: 640px) {\n width: 100% !important;\n }\n ", "\n transition: transform ", "s ease-out;\n ", "\n ", "\n"])), function (p) { return valIsValid(p.height) ? p.height : p.from === "bottom" || p.from === "top" ? 50 : 100; }, function (p) { return valIsValid(p.width) ? p.width : p.from === "bottom" || p.from === "top" ? '100%' : '560px'; }, function (p) { return getSlideStyles(p.from, p.visible, p.height); }, function (p) { return (
3243
3321
  //@ts-ignore
3244
3322
  (valIsValid(p.animationDuration) ? p.animationDuration : 300) / 1000); }, SharedStyles, SizerCss);
3245
3323
  StyledPanel.defaultProps = {
@@ -3271,10 +3349,10 @@ var SidePanel = function (_a) {
3271
3349
  children),
3272
3350
  backdrop && visible ? React__default.createElement(Backdrop, null) : null);
3273
3351
  };
3274
- var NameAndPosition = styled.div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n display: inline-block;\n width: 90%;\n"], ["\n display: inline-block;\n width: 90%;\n"])));
3352
+ var NameAndPosition = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n display: inline-block;\n width: 90%;\n"], ["\n display: inline-block;\n width: 90%;\n"])));
3275
3353
  var Name = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
3276
- var Position = styled.div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n font-size: .8em;\n"], ["\n font-size: .8em;\n"])));
3277
- var Email = styled.a(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n font-size: .8em;\n overflow-wrap: break-word;\n word-wrap: break-word;\n -ms-word-break: break-all;\n word-break: break-word;\n"], ["\n font-size: .8em;\n overflow-wrap: break-word;\n word-wrap: break-word;\n -ms-word-break: break-all;\n word-break: break-word;\n"])));
3354
+ var Position = styled.div(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n font-size: .8em;\n"], ["\n font-size: .8em;\n"])));
3355
+ var Email = styled.a(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n font-size: .8em;\n overflow-wrap: break-word;\n word-wrap: break-word;\n -ms-word-break: break-all;\n word-break: break-word;\n"], ["\n font-size: .8em;\n overflow-wrap: break-word;\n word-wrap: break-word;\n -ms-word-break: break-all;\n word-break: break-word;\n"])));
3278
3356
  var Contact = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n &&& {\n display: flex;\n flex-basis: 50%;\n margin-bottom: 15px;\n ", "\n }\n"], ["\n &&& {\n display: flex;\n flex-basis: 50%;\n margin-bottom: 15px;\n ", "\n }\n"])), SizerCss);
3279
3357
  var PanelContact = function (_a) {
3280
3358
  var avatar = _a.avatar, name = _a.name, position = _a.position, email = _a.email, props = __rest(_a, ["avatar", "name", "position", "email"]);
@@ -3310,13 +3388,13 @@ var PanelTileContact = function (_a) {
3310
3388
  p.phone_extension && 'x' + p.phone_extension) : '';
3311
3389
  }) : null)));
3312
3390
  };
3313
- var templateObject_1$k, templateObject_2$b, templateObject_3$5, templateObject_4$3, templateObject_5$3, templateObject_6$3;
3391
+ var templateObject_1$l, templateObject_2$c, templateObject_3$5, templateObject_4$4, templateObject_5$4, templateObject_6$3;
3314
3392
 
3315
- var sharedStyle = css(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n line-height: 1.125rem;\n box-sizing: border-box;\n"], ["\n line-height: 1.125rem;\n box-sizing: border-box;\n"])));
3316
- var optionalPadding = css(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n &:first-child {\n padding-left: ", ";\n }\n\n &:last-child {\n padding-right: ", ";\n }\n"], ["\n &:first-child {\n padding-left: ", ";\n }\n\n &:last-child {\n padding-right: ", ";\n }\n"])), function (props) { return props.padded ? "20px" : "inherit"; }, function (props) { return props.padded ? "20px" : "inherit"; });
3393
+ var sharedStyle = css(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n line-height: 1.125rem;\n box-sizing: border-box;\n"], ["\n line-height: 1.125rem;\n box-sizing: border-box;\n"])));
3394
+ var optionalPadding = css(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n &:first-child {\n padding-left: ", ";\n }\n\n &:last-child {\n padding-right: ", ";\n }\n"], ["\n &:first-child {\n padding-left: ", ";\n }\n\n &:last-child {\n padding-right: ", ";\n }\n"])), function (props) { return props.padded ? "20px" : "inherit"; }, function (props) { return props.padded ? "20px" : "inherit"; });
3317
3395
  var Table = styled.table.attrs(function () { return ({ cellPadding: 0, cellSpacing: 0 }); })(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n &&& {\n background-color: white;\n border: none;\n border-spacing: 0;\n width: 100%;\n table-layout: auto;\n display: table;\n font-family: 'skufont-regular', sans-serif;\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n background-color: white;\n border: none;\n border-spacing: 0;\n width: 100%;\n table-layout: auto;\n display: table;\n font-family: 'skufont-regular', sans-serif;\n ", "\n ", "\n ", "\n }\n"])), sharedStyle, SizerCss, SharedStyles);
3318
- var TH = styled.th(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n &&& {\n background-color: #dae9ee;\n border: none;\n border-spacing: 0;\n color: ", ";\n font-size: 1rem;\n padding: 0.5rem 0.625rem 0.625rem;\n display: table-cell;\n text-align: left;\n font-family: \"skufont-demibold\", sans-serif;\n ", "\n &:hover {\n background-color: ", ";\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n background-color: #dae9ee;\n border: none;\n border-spacing: 0;\n color: ", ";\n font-size: 1rem;\n padding: 0.5rem 0.625rem 0.625rem;\n display: table-cell;\n text-align: left;\n font-family: \"skufont-demibold\", sans-serif;\n ", "\n &:hover {\n background-color: ", ";\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.clickable ? "#00889B" : "#123952"; }, function (props) { return props.sticky ? "position: sticky; top: ".concat(props.stickyTop ? props.stickyTop : 0, ";") : null; }, function (props) { return props.clickable ? "#d2e6ec" : "#dae9ee"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, optionalPadding, sharedStyle, SizerCss, SharedStyles);
3319
- var TD = styled.td(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n &&& {\n border: 0;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.clickable ? "pointer" : "normal"; }, optionalPadding, sharedStyle, SizerCss, SharedStyles);
3396
+ var TH = styled.th(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n &&& {\n background-color: #dae9ee;\n border: none;\n border-spacing: 0;\n color: ", ";\n font-size: 1rem;\n padding: 0.5rem 0.625rem 0.625rem;\n display: table-cell;\n text-align: left;\n font-family: \"skufont-demibold\", sans-serif;\n ", "\n &:hover {\n background-color: ", ";\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n background-color: #dae9ee;\n border: none;\n border-spacing: 0;\n color: ", ";\n font-size: 1rem;\n padding: 0.5rem 0.625rem 0.625rem;\n display: table-cell;\n text-align: left;\n font-family: \"skufont-demibold\", sans-serif;\n ", "\n &:hover {\n background-color: ", ";\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.clickable ? "#00889B" : "#123952"; }, function (props) { return props.sticky ? "position: sticky; top: ".concat(props.stickyTop ? props.stickyTop : 0, ";") : null; }, function (props) { return props.clickable ? "#d2e6ec" : "#dae9ee"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, optionalPadding, sharedStyle, SizerCss, SharedStyles);
3397
+ var TD = styled.td(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n &&& {\n border: 0;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) { return props.clickable ? "pointer" : "normal"; }, optionalPadding, sharedStyle, SizerCss, SharedStyles);
3320
3398
  var TR = styled.tr(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n &&& {\n ", "\n &:hover {\n background: #EDF2F4;\n }\n ", "\n }\n"], ["\n &&& {\n ", "\n &:hover {\n background: #EDF2F4;\n }\n ", "\n }\n"])), SizerCss, function (p) { return p.selected && 'background: #EDF2F4;'; });
3321
3399
  var THead = styled.thead(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n &&& {\n ", "\n }\n"], ["\n &&& {\n ", "\n }\n"])), SizerCss);
3322
3400
  var TBody = styled.tbody(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n &&& {\n ", "\n }\n"], ["\n &&& {\n ", "\n }\n"])), SizerCss);
@@ -3337,14 +3415,266 @@ var THSorted = function (_a) {
3337
3415
  " ",
3338
3416
  children));
3339
3417
  };
3340
- var templateObject_1$l, templateObject_2$c, templateObject_3$6, templateObject_4$4, templateObject_5$4, templateObject_6$4, templateObject_7$2, templateObject_8$1, templateObject_9;
3418
+ var templateObject_1$m, templateObject_2$d, templateObject_3$6, templateObject_4$5, templateObject_5$5, templateObject_6$4, templateObject_7$2, templateObject_8$1, templateObject_9;
3419
+
3420
+ var Overlay = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n &&& {\n position: fixed;\n top: 0px;\n bottom: 0px;\n left: 0px;\n right: 0px;\n background: rgba(42, 56, 63, 0.45);\n display: flex;\n z-index: ", ";\n margin-left: auto;\n margin-right: auto;\n }\n"], ["\n &&& {\n position: fixed;\n top: 0px;\n bottom: 0px;\n left: 0px;\n right: 0px;\n background: rgba(42, 56, 63, 0.45);\n display: flex;\n z-index: ", ";\n margin-left: auto;\n margin-right: auto;\n }\n"])), function (p) { return p.zIndex || 999; });
3421
+ var PopupWindow = styled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n &&& {\n width: ", ";\n height: ", "; \n margin: 0 !important;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: fixed;\n ", "\n overflow-y: hidden;\n display: block;\n z-index: ", ";\n\n padding: ", ";\n border: 1px solid #CCD5DA;\n background-color: #fefefe;\n border-radius: 3px;\n\n &:last-child {\n margin-bottom: 0;\n }\n .popup-content {\n overflow-y: auto;\n height: 90%;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n width: ", ";\n height: ", "; \n margin: 0 !important;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: fixed;\n ", "\n overflow-y: hidden;\n display: block;\n z-index: ", ";\n\n padding: ", ";\n border: 1px solid #CCD5DA;\n background-color: #fefefe;\n border-radius: 3px;\n\n &:last-child {\n margin-bottom: 0;\n }\n .popup-content {\n overflow-y: auto;\n height: 90%;\n }\n ", "\n ", "\n }\n"])), function (props) { var _a; return (_a = props.width) !== null && _a !== void 0 ? _a : '90%'; }, function (props) { var _a; return (_a = props.height) !== null && _a !== void 0 ? _a : '75%'; }, function (props) { return props.height ? '' : 'max-height: 700px;'; }, function (p) { return p.zIndex || 1006; }, function (props) { var _a; return (_a = props.padding) !== null && _a !== void 0 ? _a : '1rem'; }, SharedStyles, SizerCss);
3422
+ var PopupHeader = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n &&& {\n position: sticky;\n top: 0;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n background: white;\n padding: 3px;\n z-index: 99;\n .title {\n font-size: 1.8rem;\n font-weight: 500;\n text-align: left;\n align-self: center;\n padding-top: 3px;\n padding-left: 3px;\n border-bottom: none;\n font-family: \"skufont-demibold\",sans-serif;\n color: #123952;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n position: sticky;\n top: 0;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n background: white;\n padding: 3px;\n z-index: 99;\n .title {\n font-size: 1.8rem;\n font-weight: 500;\n text-align: left;\n align-self: center;\n padding-top: 3px;\n padding-left: 3px;\n border-bottom: none;\n font-family: \"skufont-demibold\",sans-serif;\n color: #123952;\n }\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
3423
+ var PopupContainer = function (_a) {
3424
+ var children = _a.children;
3425
+ var ref = React__default.useRef(document$1.createElement('div'));
3426
+ useEffect(function () {
3427
+ var current = ref.current;
3428
+ document$1.body.appendChild(current);
3429
+ return function () {
3430
+ document$1.body.removeChild(current);
3431
+ };
3432
+ }, []);
3433
+ return ReactDOM.createPortal(children, ref.current);
3434
+ };
3435
+ var Popup = function (_a) {
3436
+ var header = _a.header, _b = _a.noHeader, noHeader = _b === void 0 ? false : _b, title = _a.title, controls = _a.controls, children = _a.children, onClose = _a.onClose, _c = _a.noCloseButton, noCloseButton = _c === void 0 ? false : _c, _d = _a.closeOnEsc, closeOnEsc = _d === void 0 ? true : _d, _e = _a.closeOnClickOutside, closeOnClickOutside = _e === void 0 ? false : _e, overlayZIndex = _a.overlayZIndex, props = __rest(_a, ["header", "noHeader", "title", "controls", "children", "onClose", "noCloseButton", "closeOnEsc", "closeOnClickOutside", "overlayZIndex"]);
3437
+ var ref = React__default.useRef(null);
3438
+ /* there is a bug where this closes popup involuntarily
3439
+ const handleClick = (e: Event) => {
3440
+ // @ts-ignore
3441
+ if (ref.current?.contains(e.target)) {
3442
+ return;
3443
+ }
3444
+ onClose && onClose();
3445
+ };
3446
+ */
3447
+ useEffect(function () {
3448
+ var handleKeyDown = function (e) {
3449
+ // @ts-ignore
3450
+ if (e.key === "Escape") {
3451
+ e.stopPropagation();
3452
+ onClose && onClose();
3453
+ }
3454
+ };
3455
+ if (closeOnEsc) {
3456
+ document$1.addEventListener("keyup", handleKeyDown);
3457
+ }
3458
+ return function () {
3459
+ if (closeOnEsc) {
3460
+ document$1.removeEventListener("keyup", handleKeyDown);
3461
+ }
3462
+ };
3463
+ }, [closeOnClickOutside, closeOnEsc, onClose]);
3464
+ return React__default.createElement(PopupContainer, null,
3465
+ React__default.createElement(Overlay, { zIndex: overlayZIndex },
3466
+ React__default.createElement(PopupWindow, __assign({ className: "popup" }, props, { ref: ref }),
3467
+ noHeader ? null :
3468
+ header ? header : (React__default.createElement(PopupHeader, { className: "popup-header", xsStyle: "flex-wrap: wrap-reverse;", smStyle: "flex-wrap: wrap;" },
3469
+ React__default.createElement(Col, { style: { textAlign: 'left', alignSelf: 'center' } },
3470
+ React__default.createElement("span", { className: "title" }, title)),
3471
+ React__default.createElement(Col, { style: { textAlign: 'right', alignSelf: 'center' } }, noCloseButton ? null :
3472
+ controls || React__default.createElement(Button, { onClick: onClose }, "Close")))),
3473
+ React__default.createElement("div", { className: "popup-content" }, children))));
3474
+ };
3475
+ var ShowPopup = function (_a) {
3476
+ var _b = _a.autoOpen, autoOpen = _b === void 0 ? false : _b, PopupComponent = _a.popup, render = _a.render, _c = _a.closeOnEsc, closeOnEsc = _c === void 0 ? true : _c, _d = _a.closeOnClickOutside, closeOnClickOutside = _d === void 0 ? false : _d, props = __rest(_a, ["autoOpen", "popup", "render", "closeOnEsc", "closeOnClickOutside"]);
3477
+ var _e = useState(autoOpen), showPopup = _e[0], setShowPopup = _e[1];
3478
+ return React__default.createElement(React__default.Fragment, null,
3479
+ showPopup && React__default.createElement(PopupComponent, __assign({ onClose: function () { return setShowPopup(false); }, closeOnEsc: closeOnEsc, closeOnClickOutside: closeOnClickOutside }, props)),
3480
+ render && render({ onClick: function () { return setShowPopup(!showPopup); } }));
3481
+ };
3482
+ var templateObject_1$n, templateObject_2$e, templateObject_3$7;
3483
+
3484
+ var GridTableContainer = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n width:", ";\n margin-top: 24px;\n margin-bottom: 24px;\n background: white;\n overflow: scroll;\n .droppable {\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n }\n ", "\n"], ["\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n width:", ";\n margin-top: 24px;\n margin-bottom: 24px;\n background: white;\n overflow: scroll;\n .droppable {\n display:grid;\n grid-template-rows: ", ";\n grid-gap: ", ";\n }\n ", "\n"])), function (props) { return props.gridTemplateRows ? props.gridTemplateRows : 'auto'; }, function (props) { return props.gridRowGap ? props.gridRowGap : "16px"; }, function (props) { return props.width ? props.width : '100%'; }, function (props) { return props.gridTemplateRows ? props.gridTemplateRows : 'auto'; }, function (props) { return props.gridRowGap ? props.gridRowGap : "16px"; }, SharedStyles);
3485
+ var GridRow = styled.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n display:grid;\n grid-template-columns: ", ";\n grid-gap: ", ";\n width:100%;\n background: white;\n ", "\n"], ["\n display:grid;\n grid-template-columns: ", ";\n grid-gap: ", ";\n width:100%;\n background: white;\n ", "\n"])), function (props) { return props.gridTemplateColumns; }, function (props) { return props.gridColumnGap ? props.gridColumnGap : "16px"; }, SharedStyles);
3486
+ var GridCell = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject([" \n background: white;\n width: ", ";\n font-family: ", ";\n color: ", ";\n text-align: ", ";\n"], [" \n background: white;\n width: ", ";\n font-family: ", ";\n color: ", ";\n text-align: ", ";\n"])), function (props) { return props.width ? props.width : 'auto'; }, function (props) { return props.header ? themeOptions.fontFamilies.bold : fontStyles.p.medium; }, function (props) { return props.header ? errors.main : neutrals.bodyText; }, function (props) { return props.centerContent ? 'center' : 'left'; });
3487
+ var FieldError = styled.p(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin:0;\n"], ["\n font-family: ", ";\n font-size: ", ";\n color: ", ";\n margin:0;\n"])), fontStyles.p.small.fontFamily, fontStyles.p.small.fontSize, errors['40']);
3488
+ var defaultTransform = function (v) { return v.target ? v.target.value : v.currentTarget ? v.currentTarget.value : v.value; };
3489
+ var Column = function (_a) {
3490
+ var name = _a.name, title = _a.title, children = _a.children, centerContent = _a.centerContent, _b = _a.transform;
3491
+ return React__default.createElement(GridCell, { centerContent: centerContent }, title);
3492
+ };
3493
+ var Cell = function (_a) {
3494
+ var defaultValue = _a.defaultValue, onUpdate = _a.onUpdate, children = _a.children, validate = _a.validate, centerContent = _a.centerContent, _b = _a.transform, transform = _b === void 0 ? function (v) { return v; } : _b;
3495
+ var _c = useState(defaultValue), value = _c[0], setValue = _c[1];
3496
+ var _d = useState(''), error = _d[0], setError = _d[1];
3497
+ useEffect(function () {
3498
+ setValue(defaultValue);
3499
+ }, [defaultValue]);
3500
+ var handleOnChange = function (newValue) {
3501
+ var errors = validate && validate(transform(newValue));
3502
+ if (errors) {
3503
+ setError(errors);
3504
+ }
3505
+ else {
3506
+ setError('');
3507
+ }
3508
+ setValue(transform(newValue));
3509
+ };
3510
+ var handleOnBlur = function () {
3511
+ if (!onUpdate) {
3512
+ return;
3513
+ }
3514
+ if (error) {
3515
+ setValue(defaultValue);
3516
+ setError('');
3517
+ return;
3518
+ }
3519
+ onUpdate(value);
3520
+ };
3521
+ var cell = React__default.cloneElement(React__default.Children.only(children), {
3522
+ value: value,
3523
+ onChange: handleOnChange,
3524
+ onBlur: handleOnBlur,
3525
+ });
3526
+ return (React__default.createElement(GridCell, { centerContent: centerContent },
3527
+ cell,
3528
+ " ",
3529
+ React__default.createElement(FieldError, null, error)));
3530
+ };
3531
+ function GridTable(_a) {
3532
+ var data = _a.data, _b = _a.idField, idField = _b === void 0 ? "id" : _b, onUpdate = _a.onUpdate, onDelete = _a.onDelete, onAdd = _a.onAdd, onSort = _a.onSort, validate = _a.validate, children = _a.children, gridTemplateRows = _a.gridTemplateRows, gridTemplateColumns = _a.gridTemplateColumns, gridRowGap = _a.gridRowGap, gridColumnGap = _a.gridColumnGap, props = __rest(_a, ["data", "idField", "onUpdate", "onDelete", "onAdd", "onSort", "validate", "children", "gridTemplateRows", "gridTemplateColumns", "gridRowGap", "gridColumnGap"]);
3533
+ var _c = useState({}), NewData = _c[0], setNewData = _c[1];
3534
+ var _d = useState(false), Adding = _d[0], setAdding = _d[1];
3535
+ var _e = useState({}), newRowError = _e[0], setNewRowError = _e[1];
3536
+ var _f = useState(0), showPopupWithRowId = _f[0], setShowPopupWithRowId = _f[1];
3537
+ var hasNewRowError = Object.keys(newRowError).length === 0 || Object.values(newRowError).filter(function (v) { return v; }).length > 0;
3538
+ var handleColumnsDefault = function () {
3539
+ if (gridTemplateColumns) {
3540
+ if (onSort && onDelete) {
3541
+ return "auto ".concat(gridTemplateColumns, " auto");
3542
+ }
3543
+ else if (onSort && !onDelete) {
3544
+ return "auto ".concat(gridTemplateColumns);
3545
+ }
3546
+ else if (onSort && onDelete) {
3547
+ return "".concat(gridTemplateColumns, " auto");
3548
+ }
3549
+ return gridTemplateColumns;
3550
+ }
3551
+ else {
3552
+ var columnsDefault_1 = '';
3553
+ React__default.Children.map(children, function (child, index) {
3554
+ columnsDefault_1 += "minmax(136px, 1fr) ";
3555
+ });
3556
+ if (onSort) {
3557
+ columnsDefault_1 = "auto " + columnsDefault_1;
3558
+ }
3559
+ if (onDelete) {
3560
+ columnsDefault_1 += "auto";
3561
+ }
3562
+ return columnsDefault_1;
3563
+ }
3564
+ };
3565
+ var gridColumns = handleColumnsDefault();
3566
+ var handleAdd = function () {
3567
+ var Errors = (validate && validate(NewData)) || {};
3568
+ console.log(Errors);
3569
+ if (Object.values(Errors).some(function (v) { return v; })) {
3570
+ return;
3571
+ }
3572
+ onAdd && onAdd(NewData);
3573
+ setNewData({});
3574
+ setAdding(false);
3575
+ };
3576
+ function handleOnDragEnd(result, provided) {
3577
+ if (!result.destination)
3578
+ return;
3579
+ if (!onSort)
3580
+ return;
3581
+ var item = data[result.source.index];
3582
+ onSort(item[idField], result.destination.index);
3583
+ }
3584
+ var Header = React__default.createElement(GridRow, { gridTemplateColumns: gridColumns, gridColumnGap: gridColumnGap },
3585
+ onSort && React__default.createElement(GridCell, null,
3586
+ React__default.createElement("div", { style: { width: '24px' } })),
3587
+ React__default.Children.map(children, function (child, child_index) {
3588
+ return (React__default.createElement(GridCell, { key: child.props.name, centerContent: child.props.centerContent }, child.props.title));
3589
+ }),
3590
+ onDelete && React__default.createElement(GridCell, null,
3591
+ React__default.createElement("div", { style: { width: '40px' } })));
3592
+ var Rows = function () {
3593
+ return (React__default.createElement(DragDropContext, { onDragEnd: handleOnDragEnd },
3594
+ React__default.createElement(Droppable, { droppableId: "draggable-rows" }, function (provided) { return (React__default.createElement("div", __assign({ className: "droppable" }, provided.droppableProps, { ref: provided.innerRef }),
3595
+ data.map(function (d, index) {
3596
+ return (React__default.createElement(Draggable, { key: d[idField], draggableId: d[idField].toString(), index: index, isDragDisabled: !onSort }, function (provided) { return (React__default.createElement(GridRow, __assign({}, provided.draggableProps, provided.dragHandleProps, { ref: provided.innerRef, gridTemplateColumns: gridColumns, gridColumnGap: gridColumnGap }),
3597
+ onSort && React__default.createElement(GridCell, { style: { display: "flex", flexDirection: 'column', justifyContent: 'center', height: '40px' } },
3598
+ React__default.createElement(DragIcon, { color: neutrals['60'], style: { cursor: 'grab', verticalAlign: 'middle' } })),
3599
+ React__default.Children.map(children, function (child) {
3600
+ if (!child) {
3601
+ return null;
3602
+ }
3603
+ var validateCell = function (value) {
3604
+ var _a;
3605
+ var _b;
3606
+ return (_b = (validate && validate((_a = {}, _a[child.props.name] = value, _a))[child.props.name])) !== null && _b !== void 0 ? _b : false;
3607
+ };
3608
+ return React__default.createElement(Cell, { key: child.props.name, defaultValue: d[child.props.name], onUpdate: function (value) { return setNewData(function (s) {
3609
+ var _a;
3610
+ return (__assign(__assign({}, s), (_a = {}, _a[child.props.name] = value, _a)));
3611
+ }); }, transform: child.props.transform || defaultTransform, validate: validate && validateCell, centerContent: child.props.centerContent }, child.props.children);
3612
+ }),
3613
+ onDelete && React__default.createElement(GridCell, null,
3614
+ React__default.createElement(IconButton, { preset: "delete", onClick: function () { return setShowPopupWithRowId(d[idField]); } })))); }));
3615
+ }),
3616
+ provided.placeholder)); })));
3617
+ };
3618
+ var NewRow = (React__default.createElement(GridRow, { gridTemplateColumns: gridColumns, gridColumnGap: gridColumnGap },
3619
+ onSort &&
3620
+ React__default.createElement(GridCell, null,
3621
+ React__default.createElement("div", { style: { width: '24px' } })),
3622
+ React__default.Children.map(children, function (child) {
3623
+ if (!child) {
3624
+ return null;
3625
+ }
3626
+ var validateCell = function (value) {
3627
+ var _a;
3628
+ var validation = validate && validate(__assign(__assign({}, NewData), (_a = {}, _a[child.props.name] = value, _a)));
3629
+ if (!validation) {
3630
+ return false;
3631
+ }
3632
+ setNewRowError(validation);
3633
+ return validation[child.props.name];
3634
+ };
3635
+ return React__default.createElement(Cell, { key: child.props.name, defaultValue: NewData[child.props.name], onUpdate: function (value) { return setNewData(function (s) {
3636
+ var _a;
3637
+ return (__assign(__assign({}, s), (_a = {}, _a[child.props.name] = value, _a)));
3638
+ }); }, transform: child.props.transform || defaultTransform, validate: validateCell, centerContent: child.props.centerContent }, child.props.children);
3639
+ }),
3640
+ React__default.createElement(GridCell, null,
3641
+ React__default.createElement(IconButton, { Icon: CheckmarkIcon, iconProps: { color: green.main }, variant: hasNewRowError ? "disabled" : "text", onClick: function () { return handleAdd(); }, disabled: hasNewRowError }))));
3642
+ var AddNew = onAdd ?
3643
+ React__default.createElement(GridRow, { gridTemplateColumns: "auto", gridColumnGap: gridColumnGap },
3644
+ React__default.createElement(GridCell, { centerContent: true },
3645
+ React__default.createElement(IconButton, { Icon: AddIcon, variant: "text", size: "small", onClick: function () { return setAdding(true); } }, "Add New")))
3646
+ : null;
3647
+ return (React__default.createElement(React__default.Fragment, null,
3648
+ showPopupWithRowId !== 0 ?
3649
+ React__default.createElement(Popup, { width: 'auto', height: 'auto', padding: '36px', noHeader: true, noCloseButton: true },
3650
+ React__default.createElement("p", { style: {
3651
+ fontFamily: fontStyles.p.medium.fontFamily,
3652
+ fontSize: fontStyles.p.medium.fontSize,
3653
+ lineHeight: fontStyles.p.medium.lineHeight,
3654
+ color: neutrals.bodyText
3655
+ } }, "Are you sure you want to delete?"),
3656
+ React__default.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
3657
+ React__default.createElement(Button, { size: "medium", variant: 'secondary', mr: 24, onClick: function () {
3658
+ setShowPopupWithRowId(0);
3659
+ } }, "Cancel"),
3660
+ React__default.createElement(Button, { size: "medium", variant: 'error', onClick: function () {
3661
+ onDelete && onDelete(showPopupWithRowId);
3662
+ setShowPopupWithRowId(0);
3663
+ } }, "Delete"))) : null,
3664
+ React__default.createElement(GridTableContainer, __assign({ gridTemplateRows: gridTemplateRows, gridTemplateColumns: gridColumns, gridRowGap: gridRowGap, gridColumnGap: gridColumnGap }, props),
3665
+ Header,
3666
+ Rows(),
3667
+ Adding && NewRow,
3668
+ onAdd && !Adding && AddNew)));
3669
+ }
3670
+ var templateObject_1$o, templateObject_2$f, templateObject_3$8, templateObject_4$6;
3341
3671
 
3342
3672
  var tabSizes = {
3343
- small: css(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n font-size: 0.9rem;\n padding: 0.5rem 5px;\n margin: 0;\n "], ["\n font-size: 0.9rem;\n padding: 0.5rem 5px;\n margin: 0;\n "]))),
3344
- medium: css(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n font-size: inherit;\n padding: 1rem 12px;\n margin: 0 15px 0 0;\n "], ["\n font-size: inherit;\n padding: 1rem 12px;\n margin: 0 15px 0 0;\n "]))),
3673
+ small: css(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n font-size: 0.9rem;\n padding: 0.5rem 5px;\n margin: 0;\n "], ["\n font-size: 0.9rem;\n padding: 0.5rem 5px;\n margin: 0;\n "]))),
3674
+ medium: css(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n font-size: inherit;\n padding: 1rem 12px;\n margin: 0 15px 0 0;\n "], ["\n font-size: inherit;\n padding: 1rem 12px;\n margin: 0 15px 0 0;\n "]))),
3345
3675
  };
3346
- var TabBar = styled.ul(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n &&& {\n display: block;\n font-size: 16px;\n font-family: 'skufont-demibold', sans-serif;\n margin: 0;\n margin-bottom: ", ";\n padding: 0;\n ", "\n }\n"], ["\n &&& {\n display: block;\n font-size: 16px;\n font-family: 'skufont-demibold', sans-serif;\n margin: 0;\n margin-bottom: ", ";\n padding: 0;\n ", "\n }\n"])), function (props) { return props.padded ? "20px" : 0; }, SharedStyles);
3347
- var Tab = styled.li(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n &&& {\n cursor: pointer;\n display: inline-block;\n border-bottom: ", ";\n color: #222222;\n opacity: ", ";\n list-style: none;\n margin-bottom: 0 !important;\n position: relative;\n padding: 1rem 12px;\n margin-right: 15px;\n ", "\n\n ", "\n }\n"], ["\n &&& {\n cursor: pointer;\n display: inline-block;\n border-bottom: ", ";\n color: #222222;\n opacity: ", ";\n list-style: none;\n margin-bottom: 0 !important;\n position: relative;\n padding: 1rem 12px;\n margin-right: 15px;\n ", "\n\n ", "\n }\n"
3676
+ var TabBar = styled.ul(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n &&& {\n display: block;\n font-size: 16px;\n font-family: 'skufont-demibold', sans-serif;\n margin: 0;\n margin-bottom: ", ";\n padding: 0;\n ", "\n }\n"], ["\n &&& {\n display: block;\n font-size: 16px;\n font-family: 'skufont-demibold', sans-serif;\n margin: 0;\n margin-bottom: ", ";\n padding: 0;\n ", "\n }\n"])), function (props) { return props.padded ? "20px" : 0; }, SharedStyles);
3677
+ var Tab = styled.li(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n &&& {\n cursor: pointer;\n display: inline-block;\n border-bottom: ", ";\n color: #222222;\n opacity: ", ";\n list-style: none;\n margin-bottom: 0 !important;\n position: relative;\n padding: 1rem 12px;\n margin-right: 15px;\n ", "\n\n ", "\n }\n"], ["\n &&& {\n cursor: pointer;\n display: inline-block;\n border-bottom: ", ";\n color: #222222;\n opacity: ", ";\n list-style: none;\n margin-bottom: 0 !important;\n position: relative;\n padding: 1rem 12px;\n margin-right: 15px;\n ", "\n\n ", "\n }\n"
3348
3678
  /*
3349
3679
 
3350
3680
  Here's how you use this:
@@ -3373,7 +3703,9 @@ var Tab = styled.li(templateObject_4$5 || (templateObject_4$5 = __makeTemplateOb
3373
3703
  // {tabs[state.selectedTabIndex].content}
3374
3704
  // </div>
3375
3705
  // }
3376
- ])), function (props) { return props.selected ? "5px solid #02c0da" : "none"; }, function (props) { return props.selected ? "1" : ".5"; }, SharedStyles, function (props) { var _a; return tabSizes[(_a = props.size) !== null && _a !== void 0 ? _a : 'medium']; });
3706
+ ])), function (props) { return props.selected
3707
+ ? "5px solid ".concat(props.variant === 'secondary' ? colors.secondary1.main : colors.primary1.main)
3708
+ : "none"; }, function (props) { return props.selected ? "1" : ".5"; }, SharedStyles, function (props) { var _a; return tabSizes[(_a = props.size) !== null && _a !== void 0 ? _a : 'medium']; });
3377
3709
  var Tabs = /** @class */ (function (_super) {
3378
3710
  __extends(Tabs, _super);
3379
3711
  function Tabs(props) {
@@ -3430,7 +3762,7 @@ var Tabs = /** @class */ (function (_super) {
3430
3762
  };
3431
3763
  return Tabs;
3432
3764
  }(Component));
3433
- var templateObject_1$m, templateObject_2$d, templateObject_3$7, templateObject_4$5;
3765
+ var templateObject_1$p, templateObject_2$g, templateObject_3$9, templateObject_4$7;
3434
3766
 
3435
3767
  var toggleSizes = {
3436
3768
  small: {
@@ -3467,9 +3799,9 @@ var getSizeStyle$2 = function (style, defaults) {
3467
3799
  return defaults;
3468
3800
  };
3469
3801
  };
3470
- var Wrapper$1 = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n max-width: 600px;\n justify-content: flex-start;\n width: 100%; \n }"], ["\n &&& {\n display: inline-flex;\n max-width: 600px;\n justify-content: flex-start;\n width: 100%; \n }"])));
3471
- var Container = styled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"], ["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"])), function (props) { return getThemeColor(props, 'teal.20', colors.teal['20']); }, function (props) { return props.stretch ? "100%" : "auto"; }, SharedStyles);
3472
- var ToggleLink = styled.a(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n font-size: ", ";\n border-radius: 30px;\n display: flex;\n align-content: center;\n padding: ", ";\n height: auto;\n line-height: ", ";\n width: ", ";\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n color: ", ";\n ", "\n }"], ["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n font-size: ", ";\n border-radius: 30px;\n display: flex;\n align-content: center;\n padding: ", ";\n height: auto;\n line-height: ", ";\n width: ", ";\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n color: ", ";\n ", "\n }"])), function (props) { return getSizeStyle$2('font-size', '1rem')({ size: props.size }); }, function (props) { return getSizeStyle$2('padding', '8px 16px')({ size: props.size }); }, function (props) { return getSizeStyle$2('line-height', '24px')({ size: props.size }); }, function (props) { return props.stretch ? "50%" : "auto"; }, function (props) { return props.selected ? getThemeColor(props, 'teal.main', colors.teal.main) : getThemeColor(props, 'teal.20', colors.teal['20']); }, function (props) { return props.selected ? "white" : getThemeColor(props, 'teal.main', colors.teal.main); }, SharedStyles);
3802
+ var Wrapper$1 = styled.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n &&& {\n display: inline-flex;\n max-width: 600px;\n justify-content: flex-start;\n width: 100%; \n }"], ["\n &&& {\n display: inline-flex;\n max-width: 600px;\n justify-content: flex-start;\n width: 100%; \n }"])));
3803
+ var Container = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"], ["\n &&& {\n background: ", ";\n border-radius: 50px;\n display: flex;\n justify-content: space-between;\n width: ", ";\n ", "\n }"])), function (props) { return getThemeColor(props, 'teal.20', colors.teal['20']); }, function (props) { return props.stretch ? "100%" : "auto"; }, SharedStyles);
3804
+ var ToggleLink = styled.a(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n font-size: ", ";\n border-radius: 30px;\n display: flex;\n align-content: center;\n padding: ", ";\n height: auto;\n line-height: ", ";\n width: ", ";\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n color: ", ";\n ", "\n }"], ["\n &&& {\n font-family: 'skufont-medium', sans-serif;\n font-size: ", ";\n border-radius: 30px;\n display: flex;\n align-content: center;\n padding: ", ";\n height: auto;\n line-height: ", ";\n width: ", ";\n justify-content: center;\n cursor: pointer;\n background-color: ", ";\n color: ", ";\n ", "\n }"])), function (props) { return getSizeStyle$2('font-size', '1rem')({ size: props.size }); }, function (props) { return getSizeStyle$2('padding', '8px 16px')({ size: props.size }); }, function (props) { return getSizeStyle$2('line-height', '24px')({ size: props.size }); }, function (props) { return props.stretch ? "50%" : "auto"; }, function (props) { return props.selected ? getThemeColor(props, 'teal.main', colors.teal.main) : getThemeColor(props, 'teal.20', colors.teal['20']); }, function (props) { return props.selected ? "white" : getThemeColor(props, 'teal.main', colors.teal.main); }, SharedStyles);
3473
3805
  var Toggle = function (_a) {
3474
3806
  var _b = _a.size, size = _b === void 0 ? 'medium' : _b, props = __rest(_a, ["size"]);
3475
3807
  return React__default.createElement(Wrapper$1, __assign({ size: size }, props),
@@ -3477,9 +3809,9 @@ var Toggle = function (_a) {
3477
3809
  return React__default.cloneElement(child, { size: size });
3478
3810
  })));
3479
3811
  };
3480
- var templateObject_1$n, templateObject_2$e, templateObject_3$8;
3812
+ var templateObject_1$q, templateObject_2$h, templateObject_3$a;
3481
3813
 
3482
- var Textarea = styled.textarea(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), function (p) {
3814
+ var Textarea = styled.textarea(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), function (p) {
3483
3815
  var styles = {
3484
3816
  marginBottom: p.noMargin ? 0 : "1rem",
3485
3817
  fontSize: '1rem',
@@ -3541,34 +3873,34 @@ var LabeledTextarea = React__default.forwardRef(function (_a, ref) {
3541
3873
  React__default.createElement(Label, { htmlFor: name }, label),
3542
3874
  React__default.createElement(Textarea, __assign({ name: name }, props)));
3543
3875
  });
3544
- var templateObject_1$o;
3876
+ var templateObject_1$r;
3545
3877
 
3546
3878
  var img$1 = "data:image/gif;base64,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";
3547
3879
 
3548
3880
  var img$2 = "data:image/gif;base64,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";
3549
3881
 
3550
- var Wrapper$2 = styled.div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n ", "\n"], ["\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n ", "\n"])), SharedStyles);
3882
+ var Wrapper$2 = styled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n ", "\n"], ["\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n ", "\n"])), SharedStyles);
3551
3883
  var Spinner = function (props) {
3552
3884
  return React__default.createElement(Wrapper$2, __assign({}, props),
3553
3885
  React__default.createElement("img", { alt: "Loading...", src: props.small ? img$2 : img$1 }));
3554
3886
  };
3555
- var templateObject_1$p;
3887
+ var templateObject_1$s;
3556
3888
 
3557
3889
  var img$3 = "data:image/svg+xml,%3c%3fxml version='1.0' encoding='UTF-8' standalone='no'%3f%3e%3c!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg width='100%25' height='100%25' viewBox='0 0 101 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd%3bclip-rule:evenodd%3bstroke-linejoin:round%3bstroke-miterlimit:2%3b'%3e %3cg transform='matrix(1%2c0%2c0%2c1%2c-126%2c0)'%3e %3cg id='dark' transform='matrix(0.357231%2c0%2c0%2c0.357231%2c124.961%2c0.10718)'%3e %3crect x='4.308' y='-0.3' width='279.931' height='279.931' style='fill:none%3b'/%3e %3cg transform='matrix(1.69264%2c0%2c0%2c1.69264%2c-1244.22%2c-2149.68)'%3e %3cpath d='M816.161%2c1280.05C816.87%2c1278.39 818.503%2c1277.31 820.31%2c1277.31C822.117%2c1277.31 823.75%2c1278.39 824.459%2c1280.05L844.406%2c1326.83L895.064%2c1331.35C896.864%2c1331.51 898.395%2c1332.73 898.954%2c1334.44C899.512%2c1336.16 898.991%2c1338.05 897.628%2c1339.24L859.299%2c1372.67L870.66%2c1422.24C871.064%2c1424 870.377%2c1425.83 868.914%2c1426.9C867.452%2c1427.96 865.497%2c1428.05 863.946%2c1427.12L820.31%2c1400.99L776.674%2c1427.12C775.123%2c1428.05 773.168%2c1427.96 771.706%2c1426.9C770.243%2c1425.83 769.556%2c1424 769.96%2c1422.24L781.321%2c1372.67L742.992%2c1339.24C741.629%2c1338.05 741.108%2c1336.16 741.666%2c1334.44C742.225%2c1332.73 743.756%2c1331.51 745.556%2c1331.35L796.214%2c1326.83L816.161%2c1280.05Z' style='fill:rgb(18%2c57%2c82)%3b'/%3e %3c/g%3e %3c/g%3e %3c/g%3e%3c/svg%3e";
3558
3890
 
3559
3891
  var img$4 = "data:image/svg+xml,%3c%3fxml version='1.0' encoding='UTF-8' standalone='no'%3f%3e%3c!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg width='100%25' height='100%25' viewBox='0 0 100 101' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd%3bclip-rule:evenodd%3bstroke-linejoin:round%3bstroke-miterlimit:2%3b'%3e %3cg id='light' transform='matrix(0.357231%2c0%2c0%2c0.357231%2c-1.53898%2c1.04263)'%3e %3crect x='4.308' y='-0.3' width='279.931' height='279.931' style='fill:none%3b'/%3e %3cg transform='matrix(1.69264%2c0%2c0%2c1.69264%2c-1244.22%2c-2149.68)'%3e %3cpath d='M816.161%2c1280.05C816.87%2c1278.39 818.503%2c1277.31 820.31%2c1277.31C822.117%2c1277.31 823.75%2c1278.39 824.459%2c1280.05L844.406%2c1326.83L895.064%2c1331.35C896.864%2c1331.51 898.395%2c1332.73 898.954%2c1334.44C899.512%2c1336.16 898.991%2c1338.05 897.628%2c1339.24L859.299%2c1372.67L870.66%2c1422.24C871.064%2c1424 870.377%2c1425.83 868.914%2c1426.9C867.452%2c1427.96 865.497%2c1428.05 863.946%2c1427.12L820.31%2c1400.99L776.674%2c1427.12C775.123%2c1428.05 773.168%2c1427.96 771.706%2c1426.9C770.243%2c1425.83 769.556%2c1424 769.96%2c1422.24L781.321%2c1372.67L742.992%2c1339.24C741.629%2c1338.05 741.108%2c1336.16 741.666%2c1334.44C742.225%2c1332.73 743.756%2c1331.51 745.556%2c1331.35L796.214%2c1326.83L816.161%2c1280.05Z' style='fill:rgb(236%2c248%2c255)%3b'/%3e %3c/g%3e %3c/g%3e%3c/svg%3e";
3560
3892
 
3561
- var StyledStar = styled.img(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n width: 13px;\n height: 13px;\n vertical-align: top;\n"], ["\n width: 13px;\n height: 13px;\n vertical-align: top;\n"])));
3562
- var StyledRating = styled.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
3893
+ var StyledStar = styled.img(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n width: 13px;\n height: 13px;\n vertical-align: top;\n"], ["\n width: 13px;\n height: 13px;\n vertical-align: top;\n"])));
3894
+ var StyledRating = styled.div(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), SharedStyles);
3563
3895
  var StarRating = function (props) {
3564
3896
  return React__default.createElement(StyledRating, __assign({}, props), [1, 2, 3, 4, 5].map(function (x, i) { return i < props.rating ? React__default.createElement(StyledStar, { key: "star".concat(i), src: img$4 }) : React__default.createElement(StyledStar, { key: "star".concat(i), src: img$3 }); }));
3565
3897
  };
3566
- var templateObject_1$q, templateObject_2$f;
3898
+ var templateObject_1$t, templateObject_2$i;
3567
3899
 
3568
- var ProductInfo = styled.div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n width: 100%;\n background: rgba(0, 0, 0, 0.55) !important;\n position: absolute;\n left: 0;\n bottom: 0;\n opacity: 1;\n color: #fff;\n padding: 10px;\n font-size: 14px;\n box-sizing: border-box;\n -moz-box-sizing: border-box;\n height: 110px;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n -moz-text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b0000000',GradientType=0 );\n"], ["\n width: 100%;\n background: rgba(0, 0, 0, 0.55) !important;\n position: absolute;\n left: 0;\n bottom: 0;\n opacity: 1;\n color: #fff;\n padding: 10px;\n font-size: 14px;\n box-sizing: border-box;\n -moz-box-sizing: border-box;\n height: 110px;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n -moz-text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b0000000',GradientType=0 );\n"])));
3569
- var ProductName = styled.div(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n font-size: 1.2rem;\n font-weight: bold;\n display: none;\n"], ["\n font-size: 1.2rem;\n font-weight: bold;\n display: none;\n"])));
3570
- var SupplierName = styled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n font-size: .9rem;\n font-weight: bold;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"], ["\n font-size: .9rem;\n font-weight: bold;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
3571
- var ProductWrapper = styled.div(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n width: 100%;\n height: 17rem;\n overflow: hidden;\n background-image: url(\"", "\");\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n &:hover ", " {\n height: 100%;\n }\n &:hover ", " {\n display: block;\n }\n &:hover ", " {\n overflow: visible;\n white-space: normal;\n }\n ", "\n"], ["\n width: 100%;\n height: 17rem;\n overflow: hidden;\n background-image: url(\"", "\");\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n &:hover ", " {\n height: 100%;\n }\n &:hover ", " {\n display: block;\n }\n &:hover ", " {\n overflow: visible;\n white-space: normal;\n }\n ", "\n"])), function (props) { return props.picture; }, ProductInfo, ProductName, SupplierName, SharedStyles);
3900
+ var ProductInfo = styled.div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n width: 100%;\n background: rgba(0, 0, 0, 0.55) !important;\n position: absolute;\n left: 0;\n bottom: 0;\n opacity: 1;\n color: #fff;\n padding: 10px;\n font-size: 14px;\n box-sizing: border-box;\n -moz-box-sizing: border-box;\n height: 110px;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n -moz-text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b0000000',GradientType=0 );\n"], ["\n width: 100%;\n background: rgba(0, 0, 0, 0.55) !important;\n position: absolute;\n left: 0;\n bottom: 0;\n opacity: 1;\n color: #fff;\n padding: 10px;\n font-size: 14px;\n box-sizing: border-box;\n -moz-box-sizing: border-box;\n height: 110px;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n -moz-text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);\n background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%);\n filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b0000000',GradientType=0 );\n"])));
3901
+ var ProductName = styled.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n font-size: 1.2rem;\n font-weight: bold;\n display: none;\n"], ["\n font-size: 1.2rem;\n font-weight: bold;\n display: none;\n"])));
3902
+ var SupplierName = styled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n font-size: .9rem;\n font-weight: bold;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"], ["\n font-size: .9rem;\n font-weight: bold;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
3903
+ var ProductWrapper = styled.div(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n width: 100%;\n height: 17rem;\n overflow: hidden;\n background-image: url(\"", "\");\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n &:hover ", " {\n height: 100%;\n }\n &:hover ", " {\n display: block;\n }\n &:hover ", " {\n overflow: visible;\n white-space: normal;\n }\n ", "\n"], ["\n width: 100%;\n height: 17rem;\n overflow: hidden;\n background-image: url(\"", "\");\n background-repeat: no-repeat;\n background-position: center top;\n background-size: cover;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n &:hover ", " {\n height: 100%;\n }\n &:hover ", " {\n display: block;\n }\n &:hover ", " {\n overflow: visible;\n white-space: normal;\n }\n ", "\n"])), function (props) { return props.picture; }, ProductInfo, ProductName, SupplierName, SharedStyles);
3572
3904
  var Product = function (props) {
3573
3905
  return React__default.createElement(ProductWrapper, __assign({}, props),
3574
3906
  React__default.createElement(ProductInfo, null,
@@ -3579,7 +3911,7 @@ var Product = function (props) {
3579
3911
  props.price && props.currency ? props.currency + "$" + props.price : null,
3580
3912
  props.rating ? React__default.createElement(StarRating, { rating: props.rating }) : null));
3581
3913
  };
3582
- var templateObject_1$r, templateObject_2$g, templateObject_3$9, templateObject_4$6;
3914
+ var templateObject_1$u, templateObject_2$j, templateObject_3$b, templateObject_4$8;
3583
3915
 
3584
3916
  function _defineProperty(obj, key, value) {
3585
3917
  if (key in obj) {
@@ -3656,11 +3988,10 @@ function _assertThisInitialized(self) {
3656
3988
  }
3657
3989
 
3658
3990
  function _setPrototypeOf(o, p) {
3659
- _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
3991
+ _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
3660
3992
  o.__proto__ = p;
3661
3993
  return o;
3662
3994
  };
3663
-
3664
3995
  return _setPrototypeOf(o, p);
3665
3996
  }
3666
3997
 
@@ -3683,7 +4014,7 @@ function _inherits(subClass, superClass) {
3683
4014
  }
3684
4015
 
3685
4016
  function _getPrototypeOf(o) {
3686
- _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
4017
+ _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
3687
4018
  return o.__proto__ || Object.getPrototypeOf(o);
3688
4019
  };
3689
4020
  return _getPrototypeOf(o);
@@ -3826,11 +4157,11 @@ var Img = /*#__PURE__*/function (_Component) {
3826
4157
  return Img;
3827
4158
  }(Component);
3828
4159
 
3829
- var ArtworkName = styled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n font-size: .9rem;\n font-weight: bold;\n"], ["\n font-size: .9rem;\n font-weight: bold;\n"])));
3830
- var UpdateDate = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n"], ["\n font-size: ", ";\n color: ", ";\n"])), function (props) { return getThemeFontSize(props, 'tiny'); }, function (props) { return getThemeColor(props, 'textbody', colors.textbody); });
3831
- var ArtworkControls = styled.div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n text-align: right;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 2;\n padding: 10px;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: .3s all;\n"], ["\n text-align: right;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 2;\n padding: 10px;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: .3s all;\n"])));
3832
- var ArtworkInfo = styled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n padding-left: ", ";\n width: 100%;\n position: absolute;\n height: 3rem;\n left: 0;\n ", " : 0;\n opacity: 1;\n color: black;\n font-size: 14px;\n box-sizing: border-box;\n word-wrap: break-word;\n -moz-box-sizing: border-box;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n"], ["\n padding-left: ", ";\n width: 100%;\n position: absolute;\n height: 3rem;\n left: 0;\n ", " : 0;\n opacity: 1;\n color: black;\n font-size: 14px;\n box-sizing: border-box;\n word-wrap: break-word;\n -moz-box-sizing: border-box;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n"])), function (props) { return props.withPicture ? 0 : "4vw !important"; }, function (props) { return props.withPicture ? "bottom" : "top"; });
3833
- var ArtworkWrapper = styled.div(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n width: 100%;\n height: ", ";\n min-height: 4rem;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n\n &:hover ", " {\n opacity: 1;\n }\n ", "\n"], ["\n width: 100%;\n height: ", ";\n min-height: 4rem;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n\n &:hover ", " {\n opacity: 1;\n }\n ", "\n"])), function (props) { return props.cssHeight > 0 ? props.cssHeight + "vw" : "auto"; }, ArtworkControls, SharedStyles);
4160
+ var ArtworkName = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n font-size: .9rem;\n font-weight: bold;\n"], ["\n font-size: .9rem;\n font-weight: bold;\n"])));
4161
+ var UpdateDate = styled.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n font-size: ", ";\n color: ", ";\n"], ["\n font-size: ", ";\n color: ", ";\n"])), function (props) { return getThemeFontSize(props, 'tiny'); }, function (props) { return getThemeColor(props, 'textbody', colors.textbody); });
4162
+ var ArtworkControls = styled.div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n text-align: right;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 2;\n padding: 10px;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: .3s all;\n"], ["\n text-align: right;\n position: absolute;\n top: 0;\n left: 0;\n z-index: 2;\n padding: 10px;\n width: 100%;\n box-sizing: border-box;\n opacity: 0;\n transition: .3s all;\n"])));
4163
+ var ArtworkInfo = styled.div(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n padding-left: ", ";\n width: 100%;\n position: absolute;\n height: 3rem;\n left: 0;\n ", " : 0;\n opacity: 1;\n color: black;\n font-size: 14px;\n box-sizing: border-box;\n word-wrap: break-word;\n -moz-box-sizing: border-box;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n"], ["\n padding-left: ", ";\n width: 100%;\n position: absolute;\n height: 3rem;\n left: 0;\n ", " : 0;\n opacity: 1;\n color: black;\n font-size: 14px;\n box-sizing: border-box;\n word-wrap: break-word;\n -moz-box-sizing: border-box;\n -webkit-transition: height .2s ease;\n -moz-transition: height .2s ease;\n transition: height .2s ease;\n z-index: 1;\n"])), function (props) { return props.withPicture ? 0 : "4vw !important"; }, function (props) { return props.withPicture ? "bottom" : "top"; });
4164
+ var ArtworkWrapper = styled.div(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n width: 100%;\n height: ", ";\n min-height: 4rem;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n\n &:hover ", " {\n opacity: 1;\n }\n ", "\n"], ["\n width: 100%;\n height: ", ";\n min-height: 4rem;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n\n &:hover ", " {\n opacity: 1;\n }\n ", "\n"])), function (props) { return props.cssHeight > 0 ? props.cssHeight + "vw" : "auto"; }, ArtworkControls, SharedStyles);
3834
4165
  var ArtworkPicture = styled.div(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n width: 100%;\n height: calc(", "vw - 3.5rem);\n overflow: hidden;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);\n\n &:hover ", " {\n opacity: 1;\n }\n"], ["\n width: 100%;\n height: calc(", "vw - 3.5rem);\n overflow: hidden;\n position: relative;\n line-height: 1.5em;\n cursor: pointer;\n box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);\n\n &:hover ", " {\n opacity: 1;\n }\n"])), function (props) { return props.cssHeight; }, ArtworkControls);
3835
4166
  function truncate$1(filename, max) {
3836
4167
  var extension = filename.substring(filename.lastIndexOf('.') + 1, filename.length);
@@ -3868,74 +4199,12 @@ var Artwork = function (_a) {
3868
4199
  "Updated ",
3869
4200
  props.date) : null));
3870
4201
  };
3871
- var templateObject_1$s, templateObject_2$h, templateObject_3$a, templateObject_4$7, templateObject_5$5, templateObject_6$5;
3872
-
3873
- var Overlay = styled.div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n &&& {\n position: fixed;\n top: 0px;\n bottom: 0px;\n left: 0px;\n right: 0px;\n background: rgba(42, 56, 63, 0.45);\n display: flex;\n z-index: 999;\n margin-left: auto;\n margin-right: auto;\n }\n"], ["\n &&& {\n position: fixed;\n top: 0px;\n bottom: 0px;\n left: 0px;\n right: 0px;\n background: rgba(42, 56, 63, 0.45);\n display: flex;\n z-index: 999;\n margin-left: auto;\n margin-right: auto;\n }\n"])));
3874
- var PopupWindow = styled.div(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n &&& {\n width: ", ";\n height: ", "; \n margin: 0 !important;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: fixed;\n ", "\n overflow-y: hidden;\n display: block;\n z-index: 1006;\n\n padding: 1rem;\n border: 1px solid #CCD5DA;\n background-color: #fefefe;\n border-radius: 3px;\n\n &:last-child {\n margin-bottom: 0;\n }\n .popup-content {\n overflow-y: auto;\n height: 90%;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n width: ", ";\n height: ", "; \n margin: 0 !important;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: fixed;\n ", "\n overflow-y: hidden;\n display: block;\n z-index: 1006;\n\n padding: 1rem;\n border: 1px solid #CCD5DA;\n background-color: #fefefe;\n border-radius: 3px;\n\n &:last-child {\n margin-bottom: 0;\n }\n .popup-content {\n overflow-y: auto;\n height: 90%;\n }\n ", "\n ", "\n }\n"])), function (props) { var _a; return (_a = props.width) !== null && _a !== void 0 ? _a : '90%'; }, function (props) { var _a; return (_a = props.height) !== null && _a !== void 0 ? _a : '75%'; }, function (props) { return props.height ? '' : 'max-height: 700px;'; }, SharedStyles, SizerCss);
3875
- var PopupHeader = styled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n &&& {\n position: sticky;\n top: 0;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n background: white;\n padding: 3px;\n z-index: 99;\n .title {\n font-size: 1.8rem;\n font-weight: 500;\n text-align: left;\n align-self: center;\n padding-top: 3px;\n padding-left: 3px;\n border-bottom: none;\n font-family: \"skufont-demibold\",sans-serif;\n color: #123952;\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n position: sticky;\n top: 0;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n background: white;\n padding: 3px;\n z-index: 99;\n .title {\n font-size: 1.8rem;\n font-weight: 500;\n text-align: left;\n align-self: center;\n padding-top: 3px;\n padding-left: 3px;\n border-bottom: none;\n font-family: \"skufont-demibold\",sans-serif;\n color: #123952;\n }\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
3876
- var PopupContainer = function (_a) {
3877
- var children = _a.children;
3878
- var ref = React__default.useRef(document$1.createElement('div'));
3879
- useEffect(function () {
3880
- var current = ref.current;
3881
- document$1.body.appendChild(current);
3882
- return function () {
3883
- document$1.body.removeChild(current);
3884
- };
3885
- }, []);
3886
- return ReactDOM.createPortal(children, ref.current);
3887
- };
3888
- var Popup = function (_a) {
3889
- var header = _a.header, title = _a.title, controls = _a.controls, children = _a.children, onClose = _a.onClose, _b = _a.closeOnEsc, closeOnEsc = _b === void 0 ? true : _b, _c = _a.closeOnClickOutside, closeOnClickOutside = _c === void 0 ? false : _c, props = __rest(_a, ["header", "title", "controls", "children", "onClose", "closeOnEsc", "closeOnClickOutside"]);
3890
- var ref = React__default.useRef(null);
3891
- /* there is a bug where this closes popup involuntarily
3892
- const handleClick = (e: Event) => {
3893
- // @ts-ignore
3894
- if (ref.current?.contains(e.target)) {
3895
- return;
3896
- }
3897
- onClose && onClose();
3898
- };
3899
- */
3900
- useEffect(function () {
3901
- var handleKeyDown = function (e) {
3902
- // @ts-ignore
3903
- if (e.key === "Escape") {
3904
- e.stopPropagation();
3905
- onClose && onClose();
3906
- }
3907
- };
3908
- if (closeOnEsc) {
3909
- document$1.addEventListener("keyup", handleKeyDown);
3910
- }
3911
- return function () {
3912
- if (closeOnEsc) {
3913
- document$1.removeEventListener("keyup", handleKeyDown);
3914
- }
3915
- };
3916
- }, [closeOnClickOutside, closeOnEsc, onClose]);
3917
- return React__default.createElement(PopupContainer, null,
3918
- React__default.createElement(Overlay, null,
3919
- React__default.createElement(PopupWindow, __assign({ className: "popup" }, props, { ref: ref }),
3920
- header ? header : (React__default.createElement(PopupHeader, { className: "popup-header", xsStyle: "flex-wrap: wrap-reverse;", smStyle: "flex-wrap: wrap;" },
3921
- React__default.createElement(Col, { style: { textAlign: 'left', alignSelf: 'center' } },
3922
- React__default.createElement("span", { className: "title" }, title)),
3923
- React__default.createElement(Col, { style: { textAlign: 'right', alignSelf: 'center' } }, controls || React__default.createElement(Button, { onClick: onClose }, "Close")))),
3924
- React__default.createElement("div", { className: "popup-content" }, children))));
3925
- };
3926
- var ShowPopup = function (_a) {
3927
- var _b = _a.autoOpen, autoOpen = _b === void 0 ? false : _b, PopupComponent = _a.popup, render = _a.render, _c = _a.closeOnEsc, closeOnEsc = _c === void 0 ? true : _c, _d = _a.closeOnClickOutside, closeOnClickOutside = _d === void 0 ? false : _d, props = __rest(_a, ["autoOpen", "popup", "render", "closeOnEsc", "closeOnClickOutside"]);
3928
- var _e = useState(autoOpen), showPopup = _e[0], setShowPopup = _e[1];
3929
- return React__default.createElement(React__default.Fragment, null,
3930
- showPopup && React__default.createElement(PopupComponent, __assign({ onClose: function () { return setShowPopup(false); }, closeOnEsc: closeOnEsc, closeOnClickOutside: closeOnClickOutside }, props)),
3931
- render && render({ onClick: function () { return setShowPopup(!showPopup); } }));
3932
- };
3933
- var templateObject_1$t, templateObject_2$i, templateObject_3$b;
4202
+ var templateObject_1$v, templateObject_2$k, templateObject_3$c, templateObject_4$9, templateObject_5$6, templateObject_6$5;
3934
4203
 
3935
- var TaskLabel = styled.div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["display: flex; min-height: 25px; ", ""], ["display: flex; min-height: 25px; ", ""])), function (p) { return p.hasCheckbox ? "width: calc(100% - 24px);" : ''; });
3936
- var TaskName = styled.div(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["flex-grow: 1; font-size:13px;"], ["flex-grow: 1; font-size:13px;"])));
3937
- var StyledTask = styled.div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["margin-bottom: 1.5em; ", ""], ["margin-bottom: 1.5em; ", ""])), SharedStyles);
3938
- var TaskBody = styled.div(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["margin-left:34px;"], ["margin-left:34px;"])));
4204
+ var TaskLabel = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["display: flex; min-height: 25px; ", ""], ["display: flex; min-height: 25px; ", ""])), function (p) { return p.hasCheckbox ? "width: calc(100% - 24px);" : ''; });
4205
+ var TaskName = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["flex-grow: 1; font-size:13px;"], ["flex-grow: 1; font-size:13px;"])));
4206
+ var StyledTask = styled.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["margin-bottom: 1.5em; ", ""], ["margin-bottom: 1.5em; ", ""])), SharedStyles);
4207
+ var TaskBody = styled.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["margin-left:34px;"], ["margin-left:34px;"])));
3939
4208
  var Task = function (_a) {
3940
4209
  var taskName = _a.taskName, date = _a.date, done = _a.done, assignee = _a.assignee, taskBody = _a.taskBody, _b = _a.initialChecked, initialChecked = _b === void 0 ? false : _b, onClickCheckbox = _a.onClickCheckbox, props = __rest(_a, ["taskName", "date", "done", "assignee", "taskBody", "initialChecked", "onClickCheckbox"]);
3941
4210
  var _c = useState(initialChecked), checked = _c[0], setChecked = _c[1];
@@ -3953,7 +4222,7 @@ var Task = function (_a) {
3953
4222
  typeof assignee !== "undefined" ? "for " + assignee : null,
3954
4223
  typeof assignee !== "undefined" ? "on " : null)));
3955
4224
  };
3956
- var StyledCalendarTaskBody = styled.span(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n font-size: 13px;\n font-family: 'skufont-regular',sans-serif,Roboto;\n"], ["\n font-size: 13px;\n font-family: 'skufont-regular',sans-serif,Roboto;\n"])));
4225
+ var StyledCalendarTaskBody = styled.span(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n font-size: 13px;\n font-family: 'skufont-regular',sans-serif,Roboto;\n"], ["\n font-size: 13px;\n font-family: 'skufont-regular',sans-serif,Roboto;\n"])));
3957
4226
  var StyledCalendarTaskWrapper = styled(StyledTask)(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\nborder-radius: 5px;\n", "\npadding: 5px;\nmargin: 0;\nheight: 100%;\nmargin-bottom: 7px;\n"], ["\nborder-radius: 5px;\n", "\npadding: 5px;\nmargin: 0;\nheight: 100%;\nmargin-bottom: 7px;\n"])), function (p) { return p.backgroundColor ? "background-color: ".concat(p.backgroundColor, ";") : ''; });
3958
4227
  var CalendarTask = React__default.forwardRef(function (_a, ref) {
3959
4228
  var title = _a.title, description = _a.description, date = _a.date, _b = _a.completed, completed = _b === void 0 ? false : _b, assignee = _a.assignee, onClickCheckbox = _a.onClickCheckbox, _c = _a.colorType, colorType = _c === void 0 ? 'light-green' : _c, _d = _a.isDescriptionHtml, isDescriptionHtml = _d === void 0 ? false : _d, _e = _a.hideCheckbox, hideCheckbox = _e === void 0 ? false : _e, _f = _a.Icon, Icon = _f === void 0 ? null : _f, props = __rest(_a, ["title", "description", "date", "completed", "assignee", "onClickCheckbox", "colorType", "isDescriptionHtml", "hideCheckbox", "Icon"]);
@@ -4009,17 +4278,17 @@ var CalendarTask = React__default.forwardRef(function (_a, ref) {
4009
4278
  assignee ? "for " + assignee : null,
4010
4279
  assignee ? "on " : null)));
4011
4280
  });
4012
- var templateObject_1$u, templateObject_2$j, templateObject_3$c, templateObject_4$8, templateObject_5$6, templateObject_6$6;
4281
+ var templateObject_1$w, templateObject_2$l, templateObject_3$d, templateObject_4$a, templateObject_5$7, templateObject_6$6;
4013
4282
 
4014
- var PublisherWrapper = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"], ["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"])), function (props) { return getThemeColor(props, "bgblue", colors.bgblue); });
4283
+ var PublisherWrapper = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"], ["background: ", "; border-radius:5px; padding: 1em; margin-bottom: 1em;"])), function (props) { return getThemeColor(props, "bgblue", colors.bgblue); });
4015
4284
  var Publisher = function (props) {
4016
4285
  return React__default.createElement(PublisherWrapper, null,
4017
4286
  React__default.createElement(Textarea, { placeholder: "Post a note about this project" }));
4018
4287
  };
4019
- var PostWrapper = styled.div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["display:flex; margin-bottom: 1em; line-height: 1.5em; ", ""], ["display:flex; margin-bottom: 1em; line-height: 1.5em; ", ""])), SharedStyles);
4020
- var WidePart = styled.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["flex-grow:1;"], ["flex-grow:1;"])));
4021
- var Date$1 = styled.span(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["color: ", "; display: inline-block;"], ["color: ", "; display: inline-block;"])), function (props) { return getThemeColor(props, "textbody", colors.textbody); });
4022
- var Action = styled.a(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["display: inline-block; margin-left: 10px;"], ["display: inline-block; margin-left: 10px;"])));
4288
+ var PostWrapper = styled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["display:flex; margin-bottom: 1em; line-height: 1.5em; ", ""], ["display:flex; margin-bottom: 1em; line-height: 1.5em; ", ""])), SharedStyles);
4289
+ var WidePart = styled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["flex-grow:1;"], ["flex-grow:1;"])));
4290
+ var Date$1 = styled.span(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["color: ", "; display: inline-block;"], ["color: ", "; display: inline-block;"])), function (props) { return getThemeColor(props, "textbody", colors.textbody); });
4291
+ var Action = styled.a(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["display: inline-block; margin-left: 10px;"], ["display: inline-block; margin-left: 10px;"])));
4023
4292
  var Author = styled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["flex-grow: 1; color: ", "; font-size: 18px; font-family: \"skufont-medium\", sans-serif; "], ["flex-grow: 1; color: ", "; font-size: 18px; font-family: \"skufont-medium\", sans-serif; "])), function (props) { return getThemeColor(props, "texttitle", colors.texttitle); });
4024
4293
  var Subject = styled.div(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["color:", "; font-size: 14px; font-family: \"skufont-medium\", sans-serif; "], ["color:", "; font-size: 14px; font-family: \"skufont-medium\", sans-serif; "])), function (props) { return getThemeColor(props, "textbody", colors.textbody); });
4025
4294
  var TopLine = styled.div(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["display:flex;"], ["display:flex;"])));
@@ -4039,12 +4308,12 @@ var FeedPost = function (props) {
4039
4308
  props.comments && props.comments.length > 0 ?
4040
4309
  React__default.createElement(Comments, null, props.comments) : null));
4041
4310
  };
4042
- var templateObject_1$v, templateObject_2$k, templateObject_3$d, templateObject_4$9, templateObject_5$7, templateObject_6$7, templateObject_7$3, templateObject_8$2, templateObject_9$1, templateObject_10;
4311
+ var templateObject_1$x, templateObject_2$m, templateObject_3$e, templateObject_4$b, templateObject_5$8, templateObject_6$7, templateObject_7$3, templateObject_8$2, templateObject_9$1, templateObject_10;
4043
4312
 
4044
- var Wrapper$3 = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n background: ", ";\n text-align: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) { return getThemeColor(props, 'bgblue', colors.bgblue); }, SharedStyles);
4045
- var ErrorTextContainer = styled.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n background: white;\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n margin-left: auto;\n padding: 100px 50px;\n margin-top: auto;\n margin-bottom: auto;\n\n @media only screen and (max-width: 700px) {\n margin-right: auto;\n }\n\n @media only screen and (min-width: 701px) {\n margin-right: 10px;\n }\n"], ["\n background: white;\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n margin-left: auto;\n padding: 100px 50px;\n margin-top: auto;\n margin-bottom: auto;\n\n @media only screen and (max-width: 700px) {\n margin-right: auto;\n }\n\n @media only screen and (min-width: 701px) {\n margin-right: 10px;\n }\n"])));
4046
- var BotContainer = styled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n padding: 40px;\n\n margin-right: auto;\n @media only screen and (max-width: 700px) {\n margin-left: auto;\n margin-top: 20px;\n }\n\n @media only screen and (min-width: 701px) {\n margin-left: 5px;\n }\n"], ["\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n padding: 40px;\n\n margin-right: auto;\n @media only screen and (max-width: 700px) {\n margin-left: auto;\n margin-top: 20px;\n }\n\n @media only screen and (min-width: 701px) {\n margin-left: 5px;\n }\n"])));
4047
- var BotImg = styled.img(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n margin-top: 20px;\n padding: 0;\n margin: 0;\n max-width: 450px;\n"], ["\n margin-top: 20px;\n padding: 0;\n margin: 0;\n max-width: 450px;\n"])));
4313
+ var Wrapper$3 = styled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n background: ", ";\n text-align: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ", "\n"], ["\n background: ", ";\n text-align: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n ", "\n"])), function (props) { return getThemeColor(props, 'bgblue', colors.bgblue); }, SharedStyles);
4314
+ var ErrorTextContainer = styled.div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n background: white;\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n margin-left: auto;\n padding: 100px 50px;\n margin-top: auto;\n margin-bottom: auto;\n\n @media only screen and (max-width: 700px) {\n margin-right: auto;\n }\n\n @media only screen and (min-width: 701px) {\n margin-right: 10px;\n }\n"], ["\n background: white;\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n margin-left: auto;\n padding: 100px 50px;\n margin-top: auto;\n margin-bottom: auto;\n\n @media only screen and (max-width: 700px) {\n margin-right: auto;\n }\n\n @media only screen and (min-width: 701px) {\n margin-right: 10px;\n }\n"])));
4315
+ var BotContainer = styled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n padding: 40px;\n\n margin-right: auto;\n @media only screen and (max-width: 700px) {\n margin-left: auto;\n margin-top: 20px;\n }\n\n @media only screen and (min-width: 701px) {\n margin-left: 5px;\n }\n"], ["\n max-width: 450px;\n text-align: center;\n border-radius: 10px;\n font-size: 2em;\n padding: 40px;\n\n margin-right: auto;\n @media only screen and (max-width: 700px) {\n margin-left: auto;\n margin-top: 20px;\n }\n\n @media only screen and (min-width: 701px) {\n margin-left: 5px;\n }\n"])));
4316
+ var BotImg = styled.img(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n margin-top: 20px;\n padding: 0;\n margin: 0;\n max-width: 450px;\n"], ["\n margin-top: 20px;\n padding: 0;\n margin: 0;\n max-width: 450px;\n"])));
4048
4317
  var ErrorBoundary = /** @class */ (function (_super) {
4049
4318
  __extends(ErrorBoundary, _super);
4050
4319
  function ErrorBoundary(props) {
@@ -4072,7 +4341,7 @@ var ErrorBoundary = /** @class */ (function (_super) {
4072
4341
  };
4073
4342
  return ErrorBoundary;
4074
4343
  }(Component));
4075
- var templateObject_1$w, templateObject_2$l, templateObject_3$e, templateObject_4$a;
4344
+ var templateObject_1$y, templateObject_2$n, templateObject_3$f, templateObject_4$c;
4076
4345
 
4077
4346
  var CustomDateInput = React__default.forwardRef(function (_a, ref) {
4078
4347
  var error = _a.error, noMargin = _a.noMargin, onClick = _a.onClick, isClearable = _a.isClearable, props = __rest(_a, ["error", "noMargin", "onClick", "isClearable"]);
@@ -4085,27 +4354,49 @@ var Datepicker = React__default.forwardRef(function (_a, ref) {
4085
4354
  return (React__default.createElement(BaseDatePicker, __assign({ locale: locale, selected: value || props.selected, todayButton: todayButton, customInput: customInput || React__default.createElement(CustomDateInput, { noMargin: true, error: error, isClearable: isClearable }), dateFormat: dateFormat, placeholderText: placeholder || placeholderText, isClearable: isClearable, showMonthDropdown: showMonthDropdown, showYearDropdown: showYearDropdown, nextMonthButtonLabel: nextMonthButtonLabel, nextYearButtonLabel: nextYearButtonLabel, previousMonthButtonLabel: previousMonthButtonLabel, previousYearButtonLabel: previousYearButtonLabel, dropdownMode: dropdownMode, peekNextMonth: peekNextMonth, popperClassName: "commonsku-styles-datepicker ".concat(popperClassName || ''), wrapperClassName: "commonsku-styles-datepicker ".concat(wrapperClassName || ''), showPopperArrow: showPopperArrow }, props, { ref: ref })));
4086
4355
  });
4087
4356
 
4088
- var StyledDropdown = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n&&& {\n position: relative;\n display: inline-block;\n}\n"], ["\n&&& {\n position: relative;\n display: inline-block;\n}\n"])));
4089
- var DropdownItem = styled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n&&& {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n}\n"], ["\n&&& {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n}\n"])), function (p) { return getColor('primary'); }, function (p) { return p.underlined &&
4357
+ var StyledDropdown = styled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n&&& {\n position: relative;\n display: inline-block;\n}\n"], ["\n&&& {\n position: relative;\n display: inline-block;\n}\n"])));
4358
+ var DropdownItem = styled.div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n&&& {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n}\n"], ["\n&&& {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n}\n"])), function (p) { return getColor('primary'); }, function (p) { return p.underlined &&
4090
4359
  "border-bottom: 1px solid ".concat(getColor(p.primary ? 'primary' : 'white'), ";"); }, function (p) { return getColor('bgblue'); });
4091
- var DropDownContent = styled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n&&& {\n display: block;\n position: absolute;\n background-color: ", ";\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n padding: 8px 8px;\n border-radius: 5px;\n text-align: left;\n z-index: 105;\n/*\n a {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n font-weight: bold;\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n }\n*/\n}\n"], ["\n&&& {\n display: block;\n position: absolute;\n background-color: ", ";\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n padding: 8px 8px;\n border-radius: 5px;\n text-align: left;\n z-index: 105;\n/*\n a {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n font-weight: bold;\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n }\n*/\n}\n"])), function (p) { return getColor(p.primary ? 'white' : 'white'); }, function (p) { return getColor(p.primary ? 'primary' : 'cta'); }, function (p) { return p.underlined &&
4360
+ var DropDownContent = styled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n&&& {\n display: block;\n position: absolute;\n background-color: ", ";\n min-width: ", ";\n ", "\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n padding: 8px 8px;\n border-radius: 5px;\n text-align: left;\n z-index: 105;\n/*\n a {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n font-weight: bold;\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n }\n*/\n}\n"], ["\n&&& {\n display: block;\n position: absolute;\n background-color: ", ";\n min-width: ", ";\n ", "\n box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n padding: 8px 8px;\n border-radius: 5px;\n text-align: left;\n z-index: 105;\n/*\n a {\n color: ", ";\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n ", "\n font-weight: bold;\n :last-child {\n border-bottom: none;\n }\n\n &:hover {\n background-color: ", ";\n color: ", ";\n border-radius: 5px;\n cursor: pointer;\n }\n }\n*/\n}\n"])), function (p) { return getColor('white'); }, function (p) { return typeof p.width === 'number' ? p.width + 'px' : p.width || '160px'; }, function (p) { return p.bordered ? "border: 2px solid ".concat(getColor(!p.primary || p.primary ? 'teal.main' : 'pink.main'), ";") : ''; }, function (p) { return getColor(p.primary ? 'primary' : 'cta'); }, function (p) { return p.underlined &&
4092
4361
  "border-bottom: 1px solid ".concat(getColor(p.primary ? 'primary' : 'white'), ";"); }, function (p) { return getColor(p.primary ? 'primary0' : 'cta'); }, function (p) { return getColor(p.primary ? 'texttitle' : 'white'); });
4362
+ var getContentStyle = function (width, rootElem, buttonElem) {
4363
+ if (!rootElem || !buttonElem) {
4364
+ return {};
4365
+ }
4366
+ var rect = rootElem.getBoundingClientRect();
4367
+ var buttonRect = buttonElem.getBoundingClientRect();
4368
+ var offset = window$1.innerWidth - (rect.x + rect.width);
4369
+ if (offset < stripUnit(width)) {
4370
+ return {
4371
+ marginLeft: '-' + Math.abs(stripUnit(width) - buttonRect.width) + 'px',
4372
+ };
4373
+ }
4374
+ return {};
4375
+ };
4093
4376
  var Dropdown = function (_a) {
4094
- var items = _a.items, _b = _a.children, children = _b === void 0 ? undefined : _b, underlined = _a.underlined, primary = _a.primary, text = _a.text, icon = _a.icon, _c = _a.openMenu, openMenu = _c === void 0 ? false : _c, mouseLeaveCallback = _a.mouseLeaveCallback, size = _a.size, _d = _a.style, style = _d === void 0 ? {} : _d, buttonVariant = _a.buttonVariant, props = __rest(_a, ["items", "children", "underlined", "primary", "text", "icon", "openMenu", "mouseLeaveCallback", "size", "style", "buttonVariant"]);
4377
+ var items = _a.items, _b = _a.children, children = _b === void 0 ? undefined : _b, underlined = _a.underlined, primary = _a.primary, text = _a.text, icon = _a.icon, _c = _a.openMenu, openMenu = _c === void 0 ? false : _c, onToggleMenu = _a.onToggleMenu, mouseLeaveCallback = _a.mouseLeaveCallback, size = _a.size, _d = _a.style, style = _d === void 0 ? {} : _d, buttonVariant = _a.buttonVariant, _e = _a.width, width = _e === void 0 ? 160 : _e, _f = _a.bordered, bordered = _f === void 0 ? false : _f, _g = _a.hideOnMouseLeave, hideOnMouseLeave = _g === void 0 ? true : _g, props = __rest(_a, ["items", "children", "underlined", "primary", "text", "icon", "openMenu", "onToggleMenu", "mouseLeaveCallback", "size", "style", "buttonVariant", "width", "bordered", "hideOnMouseLeave"]);
4095
4378
  var rootRef = useRef(null);
4096
- var _e = useState(openMenu), showMenu = _e[0], setShowMenu = _e[1];
4379
+ var buttonRef = useRef(null);
4380
+ var _h = useState(openMenu), showMenu = _h[0], setShowMenu = _h[1];
4097
4381
  var iconProps = {
4098
- // width: '10px',
4099
4382
  color: getColor(primary ? 'primary100' : 'white'),
4100
4383
  style: { verticalAlign: 'middle', transitionDuration: '.3s', transform: 'rotate(' + (showMenu ? 0 : 180) + 'deg)' },
4101
4384
  };
4102
- var handleClick = function (e) {
4385
+ var handleToggleMenu = useCallback(function (value) {
4386
+ if (value === void 0) { value = null; }
4387
+ setShowMenu(function (s) {
4388
+ var newValue = value !== null ? value : !s;
4389
+ onToggleMenu && onToggleMenu(newValue);
4390
+ return newValue;
4391
+ });
4392
+ }, [onToggleMenu]);
4393
+ var handleClick = useCallback(function (e) {
4103
4394
  var _a;
4104
4395
  if ((_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target)) {
4105
4396
  return;
4106
4397
  }
4107
- setShowMenu(false);
4108
- };
4398
+ handleToggleMenu(false);
4399
+ }, [handleToggleMenu]);
4109
4400
  useEffect(function () {
4110
4401
  if (items) {
4111
4402
  document$1.addEventListener("mousedown", handleClick);
@@ -4113,22 +4404,26 @@ var Dropdown = function (_a) {
4113
4404
  document$1.removeEventListener("mousedown", handleClick);
4114
4405
  };
4115
4406
  }
4116
- }, [items]);
4407
+ }, [items, handleClick]);
4408
+ var contentStyle = getContentStyle(width, rootRef.current, buttonRef.current);
4117
4409
  return (React__default.createElement("span", __assign({ ref: rootRef }, props, { style: style, onMouseLeave: function () {
4118
- setShowMenu(false);
4410
+ if (!hideOnMouseLeave) {
4411
+ return;
4412
+ }
4413
+ handleToggleMenu(false);
4119
4414
  if (mouseLeaveCallback) {
4120
4415
  mouseLeaveCallback();
4121
4416
  }
4122
4417
  } }),
4123
4418
  React__default.createElement(StyledDropdown, null,
4124
4419
  icon ?
4125
- React__default.createElement("span", { onClick: function () { return setShowMenu(!showMenu); } }, icon)
4420
+ React__default.createElement("span", { onClick: function () { return handleToggleMenu(!showMenu); } }, icon)
4126
4421
  :
4127
- React__default.createElement(Button, { size: size, cta: Boolean(!primary), variant: buttonVariant, onClick: function () { return setShowMenu(!showMenu); } },
4422
+ React__default.createElement(Button, { size: size, cta: Boolean(!primary), variant: buttonVariant, onClick: function () { return handleToggleMenu(!showMenu); }, ref: buttonRef },
4128
4423
  text ? text : "Actions",
4129
4424
  " ",
4130
4425
  React__default.createElement(ChevronIcon, __assign({ direction: "up" }, iconProps))),
4131
- showMenu && React__default.createElement(DropDownContent, { underlined: underlined, primary: primary },
4426
+ showMenu && React__default.createElement(DropDownContent, { style: contentStyle, underlined: underlined, primary: primary, width: width, bordered: bordered },
4132
4427
  items && items.map(function (item, i) {
4133
4428
  return item && React__default.createElement(DropdownItem, __assign({ key: 'dropdown-item-' + i }, item.props, { primary: primary, underlined: item.props && item.props.underlined ? item.props.underlined : underlined, onClick: function () {
4134
4429
  setShowMenu(false);
@@ -4137,10 +4432,10 @@ var Dropdown = function (_a) {
4137
4432
  }),
4138
4433
  children ? children : null))));
4139
4434
  };
4140
- var templateObject_1$x, templateObject_2$m, templateObject_3$f;
4435
+ var templateObject_1$z, templateObject_2$o, templateObject_3$g;
4141
4436
 
4142
- var Badge = styled.span(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"], ["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"])), function (p) { return p.color === 'cta' ? colors.cta : p.color === 'grey' ? colors.primary0 : colors.primary; }, function (p) { return p.color === 'grey' ? colors.primary100 : colors.white; }, SharedStyles);
4143
- var templateObject_1$y;
4437
+ var Badge = styled.span(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"], ["\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: 12px;\n font-weight: 700;\n line-height: 1;\n color: #fff;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n background-color: ", ";\n color: ", ";\n border-radius: 10px;\n ", "\n"])), function (p) { return p.color === 'cta' ? colors.cta : p.color === 'grey' ? colors.primary0 : colors.primary; }, function (p) { return p.color === 'grey' ? colors.primary100 : colors.white; }, SharedStyles);
4438
+ var templateObject_1$A;
4144
4439
 
4145
4440
  var verticalScrollbarWidth = function verticalScrollbarWidth() {
4146
4441
  // thanks too https://davidwalsh.name/detect-scrollbar-width
@@ -4153,9 +4448,9 @@ var verticalScrollbarWidth = function verticalScrollbarWidth() {
4153
4448
  };
4154
4449
 
4155
4450
  var PADDING_SIZE = 60;
4156
- var Styles = styled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n overflow-x: ", ";\n min-height: ", "px;\n /* -ms-overflow-style: none;\n ::-webkit-scrollbar {\n display: none;\n }\n .headless-table-list::-webkit-scrollbar {\n display: none;\n } */\n\n .th,\n .td {\n padding: 5px;\n background-color: #fff;\n overflow: hidden;\n border: none !important;\n text-align: center;\n }\n .react-table {\n .th,\n .td {\n background: '#fff'\n }\n &.react-table-sticky {\n overflow: scroll;\n .header,\n .footer {\n position: sticky;\n z-index: 1;\n width: fit-content;\n }\n .header {\n top: 0;\n //box-shadow: 0px 3px 3px #ccc;\n }\n .footer {\n bottom: 0;\n box-shadow: 0px -3px 3px #ccc;\n }\n .body {\n position: relative;\n z-index: 0;\n }\n [data-sticky-td] {\n position: sticky;\n }\n [data-sticky-last-left-td] {\n box-shadow: 2px 0px 0px #ccc;\n }\n [data-sticky-first-right-td] {\n box-shadow: -2px 0px 0px #ccc;\n }\n }\n\n .sticky {\n position: sticky !important;\n position: -webkit-sticky !important;\n z-index: 100 !important;\n }\n\n .row,\n .sticky {\n display: flex;\n align-items: center;\n background-color: white;\n border-bottom: 1px solid #eee;\n box-sizing: border-box;\n }\n }\n .react-table-wrapper {\n margin-top: 15px;\n position: absolute;\n text-align: center;\n width: 100%;\n left: 0;\n }\n .react-table-pagination {\n padding: 0.5rem;\n margin: auto;\n button {\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n border-radius: 4px;\n background: transparent; \n text-align: center;\n border: 2px solid #02c0da;\n color: #02c0da;\n cursor: pointer;\n }\n button:hover {\n color: #02c0da;\n background: #E6EFF2;\n }\n button:focus {\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n input {\n border: 1px solid #ABC7D1;\n border-radius: 5px;\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n color: #52585c;\n background-color: white;\n width: 40px;\n text-align: center;\n margin-right: 5px;\n }\n input:focus{\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n .page-select {\n margin: 0 20px;\n }\n }\n"], ["\n overflow-x: ", ";\n min-height: ", "px;\n /* -ms-overflow-style: none;\n ::-webkit-scrollbar {\n display: none;\n }\n .headless-table-list::-webkit-scrollbar {\n display: none;\n } */\n\n .th,\n .td {\n padding: 5px;\n background-color: #fff;\n overflow: hidden;\n border: none !important;\n text-align: center;\n }\n .react-table {\n .th,\n .td {\n background: '#fff'\n }\n &.react-table-sticky {\n overflow: scroll;\n .header,\n .footer {\n position: sticky;\n z-index: 1;\n width: fit-content;\n }\n .header {\n top: 0;\n //box-shadow: 0px 3px 3px #ccc;\n }\n .footer {\n bottom: 0;\n box-shadow: 0px -3px 3px #ccc;\n }\n .body {\n position: relative;\n z-index: 0;\n }\n [data-sticky-td] {\n position: sticky;\n }\n [data-sticky-last-left-td] {\n box-shadow: 2px 0px 0px #ccc;\n }\n [data-sticky-first-right-td] {\n box-shadow: -2px 0px 0px #ccc;\n }\n }\n\n .sticky {\n position: sticky !important;\n position: -webkit-sticky !important;\n z-index: 100 !important;\n }\n\n .row,\n .sticky {\n display: flex;\n align-items: center;\n background-color: white;\n border-bottom: 1px solid #eee;\n box-sizing: border-box;\n }\n }\n .react-table-wrapper {\n margin-top: 15px;\n position: absolute;\n text-align: center;\n width: 100%;\n left: 0;\n }\n .react-table-pagination {\n padding: 0.5rem;\n margin: auto;\n button {\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n border-radius: 4px;\n background: transparent; \n text-align: center;\n border: 2px solid #02c0da;\n color: #02c0da;\n cursor: pointer;\n }\n button:hover {\n color: #02c0da;\n background: #E6EFF2;\n }\n button:focus {\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n input {\n border: 1px solid #ABC7D1;\n border-radius: 5px;\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n color: #52585c;\n background-color: white;\n width: 40px;\n text-align: center;\n margin-right: 5px;\n }\n input:focus{\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n .page-select {\n margin: 0 20px;\n }\n }\n"])), function (props) { return props.pagination ? 'scroll' : 'hidden'; }, function (props) { return props.minHeight ? props.minHeight : "600"; });
4157
- var TD$1 = styled.td(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"])), function (props) { return props.backgroundColor ? props.backgroundColor : "#fff"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, SizerCss, SharedStyles);
4158
- var TABLEDIV = styled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"])), function (props) { return props.backgroundColor ? props.backgroundColor : "#fff"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, SizerCss, SharedStyles);
4451
+ var Styles = styled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n overflow-x: ", ";\n min-height: ", "px;\n /* -ms-overflow-style: none;\n ::-webkit-scrollbar {\n display: none;\n }\n .headless-table-list::-webkit-scrollbar {\n display: none;\n } */\n\n .th,\n .td {\n padding: 5px;\n background-color: #fff;\n overflow: hidden;\n border: none !important;\n text-align: center;\n }\n .react-table {\n .th,\n .td {\n background: '#fff'\n }\n &.react-table-sticky {\n overflow: scroll;\n .header,\n .footer {\n position: sticky;\n z-index: 1;\n width: fit-content;\n }\n .header {\n top: 0;\n //box-shadow: 0px 3px 3px #ccc;\n }\n .footer {\n bottom: 0;\n box-shadow: 0px -3px 3px #ccc;\n }\n .body {\n position: relative;\n z-index: 0;\n }\n [data-sticky-td] {\n position: sticky;\n }\n [data-sticky-last-left-td] {\n box-shadow: 2px 0px 0px #ccc;\n }\n [data-sticky-first-right-td] {\n box-shadow: -2px 0px 0px #ccc;\n }\n }\n\n .sticky {\n position: sticky !important;\n position: -webkit-sticky !important;\n z-index: 100 !important;\n }\n\n .row,\n .sticky {\n display: flex;\n align-items: center;\n background-color: white;\n border-bottom: 1px solid #eee;\n box-sizing: border-box;\n }\n }\n .react-table-wrapper {\n margin-top: 15px;\n position: absolute;\n text-align: center;\n width: 100%;\n left: 0;\n }\n .react-table-pagination {\n padding: 0.5rem;\n margin: auto;\n button {\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n border-radius: 4px;\n background: transparent; \n text-align: center;\n border: 2px solid #02c0da;\n color: #02c0da;\n cursor: pointer;\n }\n button:hover {\n color: #02c0da;\n background: #E6EFF2;\n }\n button:focus {\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n input {\n border: 1px solid #ABC7D1;\n border-radius: 5px;\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n color: #52585c;\n background-color: white;\n width: 40px;\n text-align: center;\n margin-right: 5px;\n }\n input:focus{\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n .page-select {\n margin: 0 20px;\n }\n }\n"], ["\n overflow-x: ", ";\n min-height: ", "px;\n /* -ms-overflow-style: none;\n ::-webkit-scrollbar {\n display: none;\n }\n .headless-table-list::-webkit-scrollbar {\n display: none;\n } */\n\n .th,\n .td {\n padding: 5px;\n background-color: #fff;\n overflow: hidden;\n border: none !important;\n text-align: center;\n }\n .react-table {\n .th,\n .td {\n background: '#fff'\n }\n &.react-table-sticky {\n overflow: scroll;\n .header,\n .footer {\n position: sticky;\n z-index: 1;\n width: fit-content;\n }\n .header {\n top: 0;\n //box-shadow: 0px 3px 3px #ccc;\n }\n .footer {\n bottom: 0;\n box-shadow: 0px -3px 3px #ccc;\n }\n .body {\n position: relative;\n z-index: 0;\n }\n [data-sticky-td] {\n position: sticky;\n }\n [data-sticky-last-left-td] {\n box-shadow: 2px 0px 0px #ccc;\n }\n [data-sticky-first-right-td] {\n box-shadow: -2px 0px 0px #ccc;\n }\n }\n\n .sticky {\n position: sticky !important;\n position: -webkit-sticky !important;\n z-index: 100 !important;\n }\n\n .row,\n .sticky {\n display: flex;\n align-items: center;\n background-color: white;\n border-bottom: 1px solid #eee;\n box-sizing: border-box;\n }\n }\n .react-table-wrapper {\n margin-top: 15px;\n position: absolute;\n text-align: center;\n width: 100%;\n left: 0;\n }\n .react-table-pagination {\n padding: 0.5rem;\n margin: auto;\n button {\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n border-radius: 4px;\n background: transparent; \n text-align: center;\n border: 2px solid #02c0da;\n color: #02c0da;\n cursor: pointer;\n }\n button:hover {\n color: #02c0da;\n background: #E6EFF2;\n }\n button:focus {\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n input {\n border: 1px solid #ABC7D1;\n border-radius: 5px;\n font-family: 'skufont-regular', sans-serif;\n font-size: 18px;\n padding: 5px 15px;\n color: #52585c;\n background-color: white;\n width: 40px;\n text-align: center;\n margin-right: 5px;\n }\n input:focus{\n border: 2px solid #02c0da;\n outline-color: #02c0da;\n }\n .page-select {\n margin: 0 20px;\n }\n }\n"])), function (props) { return props.pagination ? 'scroll' : 'hidden'; }, function (props) { return props.minHeight ? props.minHeight : "600"; });
4452
+ var TD$1 = styled.td(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"])), function (props) { return props.backgroundColor ? props.backgroundColor : "#fff"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, SizerCss, SharedStyles);
4453
+ var TABLEDIV = styled.div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"], ["\n &&& {\n border: 0 !important;\n color: #52585c;\n font-size: .875rem;\n line-height: 1.75rem;\n display: table-cell;\n padding: 0.5625rem 0.625rem;\n overflow: visible !important;\n background-color: ", ";\n &:hover {\n cursor: ", ";\n }\n ", "\n ", "\n }\n"])), function (props) { return props.backgroundColor ? props.backgroundColor : "#fff"; }, function (props) { return props.clickable ? "pointer" : "normal"; }, SizerCss, SharedStyles);
4159
4454
  var StickyListContext = createContext({});
4160
4455
  StickyListContext.displayName = "StickyListContext";
4161
4456
  var DivCell = function (_a) {
@@ -4514,7 +4809,7 @@ function HeadlessTable(_a) {
4514
4809
  ' '))
4515
4810
  : null)));
4516
4811
  }
4517
- var templateObject_1$z, templateObject_2$n, templateObject_3$g;
4812
+ var templateObject_1$B, templateObject_2$p, templateObject_3$h;
4518
4813
 
4519
4814
  var QUERY = '(prefers-reduced-motion: no-preference)';
4520
4815
  var isRenderingOnServer = typeof window$1 === 'undefined';
@@ -4772,17 +5067,17 @@ var Sparkle = function (_a) {
4772
5067
  React__default.createElement(SparkleSvg, { width: size, height: size, viewBox: "0 0 68 68", fill: "none" },
4773
5068
  React__default.createElement("path", { d: path, fill: color }))));
4774
5069
  };
4775
- var comeInOut = keyframes(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n 0% {\n transform: scale(0);\n }\n 50% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0);\n }\n"], ["\n 0% {\n transform: scale(0);\n }\n 50% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0);\n }\n"])));
4776
- var spin = keyframes(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(180deg);\n }\n"], ["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(180deg);\n }\n"])));
4777
- var Wrapper$4 = styled.span(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n display: inline-block;\n position: relative;\n"], ["\n display: inline-block;\n position: relative;\n"])));
4778
- var SparkleWrapper = styled.span(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n position: absolute;\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 700ms forwards;\n }\n"], ["\n position: absolute;\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 700ms forwards;\n }\n"])), comeInOut);
4779
- var SparkleSvg = styled.svg(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 1000ms linear;\n }\n"], ["\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 1000ms linear;\n }\n"])), spin);
5070
+ var comeInOut = keyframes(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n 0% {\n transform: scale(0);\n }\n 50% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0);\n }\n"], ["\n 0% {\n transform: scale(0);\n }\n 50% {\n transform: scale(1);\n }\n 100% {\n transform: scale(0);\n }\n"])));
5071
+ var spin = keyframes(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(180deg);\n }\n"], ["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(180deg);\n }\n"])));
5072
+ var Wrapper$4 = styled.span(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n display: inline-block;\n position: relative;\n"], ["\n display: inline-block;\n position: relative;\n"])));
5073
+ var SparkleWrapper = styled.span(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n position: absolute;\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 700ms forwards;\n }\n"], ["\n position: absolute;\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 700ms forwards;\n }\n"])), comeInOut);
5074
+ var SparkleSvg = styled.svg(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 1000ms linear;\n }\n"], ["\n display: block;\n @media (prefers-reduced-motion: no-preference) {\n animation: ", " 1000ms linear;\n }\n"])), spin);
4780
5075
  var ChildWrapper = styled.strong(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n position: relative;\n z-index: 1;\n font-weight: bold;\n"], ["\n position: relative;\n z-index: 1;\n font-weight: bold;\n"])));
4781
- var templateObject_1$A, templateObject_2$o, templateObject_3$h, templateObject_4$b, templateObject_5$8, templateObject_6$8;
5076
+ var templateObject_1$C, templateObject_2$q, templateObject_3$i, templateObject_4$d, templateObject_5$9, templateObject_6$8;
4782
5077
 
4783
- var StyledDropdown$1 = styled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n position: relative;\n display: block;\n width: 100%;\n"], ["\n position: relative;\n display: block;\n width: 100%;\n"])));
4784
- var DropdownItem$1 = styled.div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n color: white;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"], ["\n color: white;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"])), function (p) { return p.color ? p.color : "#F4F7FF"; }, function (p) { return p.rounded ? "100px" : 0; }, function (p) { return p.active ? 0.85 : 1; });
4785
- var DropDownContent$1 = styled.div(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n display: block;\n position: absolute;\n background-color: ", ";\n width: 100%;\n box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.5);\n z-index: 4;\n border-radius: 10px;\n text-align: left;\n overflow: hidden;\n"], ["\n display: block;\n position: absolute;\n background-color: ", ";\n width: 100%;\n box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.5);\n z-index: 4;\n border-radius: 10px;\n text-align: left;\n overflow: hidden;\n"])), function (p) { return getColor('white'); });
5078
+ var StyledDropdown$1 = styled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n position: relative;\n display: block;\n width: 100%;\n"], ["\n position: relative;\n display: block;\n width: 100%;\n"])));
5079
+ var DropdownItem$1 = styled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n color: white;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"], ["\n color: white;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"])), function (p) { return p.color ? p.color : "#F4F7FF"; }, function (p) { return p.rounded ? "100px" : 0; }, function (p) { return p.active ? 0.85 : 1; });
5080
+ var DropDownContent$1 = styled.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n display: block;\n position: absolute;\n background-color: ", ";\n width: 100%;\n box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.5);\n z-index: 4;\n border-radius: 10px;\n text-align: left;\n overflow: hidden;\n"], ["\n display: block;\n position: absolute;\n background-color: ", ";\n width: 100%;\n box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.5);\n z-index: 4;\n border-radius: 10px;\n text-align: left;\n overflow: hidden;\n"])), function (p) { return getColor('white'); });
4786
5081
  var StatusDropdown = function (_a) {
4787
5082
  var items = _a.items, text = _a.text, value = _a.value, row = _a.row, setMenuIsOpen = _a.setMenuIsOpen, _b = _a.disabled, disabled = _b === void 0 ? false : _b, props = __rest(_a, ["items", "text", "value", "row", "setMenuIsOpen", "disabled"]);
4788
5083
  var node = useRef();
@@ -4823,13 +5118,13 @@ var StatusDropdown = function (_a) {
4823
5118
  } }), item.content);
4824
5119
  }))));
4825
5120
  };
4826
- var templateObject_1$B, templateObject_2$p, templateObject_3$i;
5121
+ var templateObject_1$D, templateObject_2$r, templateObject_3$j;
4827
5122
 
4828
- var StyledCircles = styled.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n line-height: 0;\n margin-bottom: 9px;\n"], ["\n line-height: 0;\n margin-bottom: 9px;\n"])));
4829
- var Circle = styled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n background: #005B8C;\n opacity: ", ";\n width: 5px;\n height: 5px;\n border-radius: 10px;\n margin-right: 2px;\n display: inline-block;\n"], ["\n background: #005B8C;\n opacity: ", ";\n width: 5px;\n height: 5px;\n border-radius: 10px;\n margin-right: 2px;\n display: inline-block;\n"])), function (p) { return p.disabled ? 0.1 : 1; });
4830
- var StyledDropdown$2 = styled.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n position: relative;\n display: block;\n width: 100%;\n"], ["\n position: relative;\n display: block;\n width: 100%;\n"])));
4831
- var DropdownDisplay = styled.div(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 28px;\n display: ", ";\n justify-content: center;\n align-items: center;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"], ["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 28px;\n display: ", ";\n justify-content: center;\n align-items: center;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"])), function (p) { return p.background || '#F4F7FF'; }, function (p) { return p.showCircles ? "inherit" : "flex"; }, function (p) { return p.rounded ? "100px" : 0; }, function (p) { return p.active ? 0.85 : 1; });
4832
- var DropdownItem$2 = styled.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 30px;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n word-wrap: break-word;\n"], ["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 30px;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n word-wrap: break-word;\n"])), function (p) { return p.background || '#F4F7FF'; }, function (p) { return p.rounded ? "100px" : 0; }, function (p) { return p.active ? 0.85 : 1; });
5123
+ var StyledCircles = styled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n line-height: 0;\n margin-bottom: 9px;\n"], ["\n line-height: 0;\n margin-bottom: 9px;\n"])));
5124
+ var Circle = styled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n background: #005B8C;\n opacity: ", ";\n width: 5px;\n height: 5px;\n border-radius: 10px;\n margin-right: 2px;\n display: inline-block;\n"], ["\n background: #005B8C;\n opacity: ", ";\n width: 5px;\n height: 5px;\n border-radius: 10px;\n margin-right: 2px;\n display: inline-block;\n"])), function (p) { return p.disabled ? 0.1 : 1; });
5125
+ var StyledDropdown$2 = styled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n position: relative;\n display: block;\n width: 100%;\n"], ["\n position: relative;\n display: block;\n width: 100%;\n"])));
5126
+ var DropdownDisplay = styled.div(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 28px;\n display: ", ";\n justify-content: center;\n align-items: center;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"], ["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 28px;\n display: ", ";\n justify-content: center;\n align-items: center;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n"])), function (p) { return p.background || '#F4F7FF'; }, function (p) { return p.showCircles ? "inherit" : "flex"; }, function (p) { return p.rounded ? "100px" : 0; }, function (p) { return p.active ? 0.85 : 1; });
5127
+ var DropdownItem$2 = styled.div(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 30px;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n word-wrap: break-word;\n"], ["\n color: black;\n padding: 8px 8px;\n text-decoration: none;\n display: block;\n text-align: center;\n background-color: ", ";\n line-height: 1em;\n min-height: 30px;\n border-radius: ", ";\n opacity: ", ";\n &:hover {\n opacity: .85;\n cursor: pointer;\n }\n word-wrap: break-word;\n"])), function (p) { return p.background || '#F4F7FF'; }, function (p) { return p.rounded ? "100px" : 0; }, function (p) { return p.active ? 0.85 : 1; });
4833
5128
  var DropDownContent$2 = styled.div(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n display: block;\n position: absolute;\n background-color: ", ";\n width: 100%;\n box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.5);\n z-index: 10;\n border-radius: 10px;\n text-align: left;\n overflow: hidden;\n ", "\n"], ["\n display: block;\n position: absolute;\n background-color: ", ";\n width: 100%;\n box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.5);\n z-index: 10;\n border-radius: 10px;\n text-align: left;\n overflow: hidden;\n ", "\n"])), function (p) { return getColor('white'); }, function (p) { return p.scrollContentHeight ? "max-height: ".concat(p.scrollContentHeight, "; overflow-y: auto;") : ''; });
4834
5129
  var Circles = function (_a) {
4835
5130
  var val = _a.val, max = _a.max;
@@ -4880,7 +5175,7 @@ var StateDropdown = function (_a) {
4880
5175
  " ");
4881
5176
  }))));
4882
5177
  };
4883
- var templateObject_1$C, templateObject_2$q, templateObject_3$j, templateObject_4$c, templateObject_5$9, templateObject_6$9;
5178
+ var templateObject_1$E, templateObject_2$s, templateObject_3$k, templateObject_4$e, templateObject_5$a, templateObject_6$9;
4884
5179
 
4885
5180
  function _objectWithoutPropertiesLoose(source, excluded) {
4886
5181
  if (source == null) return {};
@@ -4909,6 +5204,10 @@ var config = {
4909
5204
 
4910
5205
  var TransitionGroupContext = React__default.createContext(null);
4911
5206
 
5207
+ var forceReflow = function forceReflow(node) {
5208
+ return node.scrollTop;
5209
+ };
5210
+
4912
5211
  var UNMOUNTED = 'unmounted';
4913
5212
  var EXITED = 'exited';
4914
5213
  var ENTERING = 'entering';
@@ -5128,6 +5427,14 @@ var Transition = /*#__PURE__*/function (_React$Component) {
5128
5427
  this.cancelNextCallback();
5129
5428
 
5130
5429
  if (nextStatus === ENTERING) {
5430
+ if (this.props.unmountOnExit || this.props.mountOnEnter) {
5431
+ var node = this.props.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this); // https://github.com/reactjs/react-transition-group/pull/749
5432
+ // With unmountOnExit or mountOnEnter, the enter animation should happen at the transition between `exited` and `entering`.
5433
+ // To make the animation happen, we have to separate each rendering and avoid being processed as batched.
5434
+
5435
+ if (node) forceReflow(node);
5436
+ }
5437
+
5131
5438
  this.performEnter(mounting);
5132
5439
  } else {
5133
5440
  this.performExit();
@@ -5331,9 +5638,9 @@ Transition.ENTERING = ENTERING;
5331
5638
  Transition.ENTERED = ENTERED;
5332
5639
  Transition.EXITING = EXITING;
5333
5640
 
5334
- var CollapseStyled = styled.div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n&&& {\n .collapsed:not(.show) {\n display: none;\n }\n\n .collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n transition: height ", "s ease;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .collapsing {\n transition: none;\n }\n }\n}\n"], ["\n&&& {\n .collapsed:not(.show) {\n display: none;\n }\n\n .collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n transition: height ", "s ease;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .collapsing {\n transition: none;\n }\n }\n}\n"])), function (p) { return p.duration ? p.duration / 1000 : '0.35'; });
5335
- var CollapseWrapper = styled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"], ["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"])), colors.primary0);
5336
- var CollapsiblePanelTitle = styled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"], ["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"])), colors.primary0, colors.primary);
5641
+ var CollapseStyled = styled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n&&& {\n .collapsed:not(.show) {\n display: none;\n }\n\n .collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n transition: height ", "s ease;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .collapsing {\n transition: none;\n }\n }\n}\n"], ["\n&&& {\n .collapsed:not(.show) {\n display: none;\n }\n\n .collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n transition: height ", "s ease;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .collapsing {\n transition: none;\n }\n }\n}\n"])), function (p) { return p.duration ? p.duration / 1000 : '0.35'; });
5642
+ var CollapseWrapper = styled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"], ["\n&&& {\n border: 1px solid ", ";\n border-radius: 5px;\n}\n"])), colors.primary0);
5643
+ var CollapsiblePanelTitle = styled.div(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"], ["\n&&& {\n background: #f3f6f7;\n border-bottom: 1px solid ", ";\n color: ", ";\n padding: 20px;\n cursor: pointer;\n}\n"])), colors.primary0, colors.primary);
5337
5644
  var transitionStatusToClass = {
5338
5645
  entering: 'collapsing',
5339
5646
  entered: 'collapsed show',
@@ -5426,10 +5733,10 @@ function CollapsiblePanels(_a) {
5426
5733
  React__default.createElement(Collapsible, __assign({}, panelProps, { duration: duration, isOpen: _titleProps.isOpen }), children)));
5427
5734
  })));
5428
5735
  }
5429
- var templateObject_1$D, templateObject_2$r, templateObject_3$k;
5736
+ var templateObject_1$F, templateObject_2$t, templateObject_3$l;
5430
5737
 
5431
- var ProgressWrapper$1 = styled.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n max-width: 100%;\n width: 100%;\n height: 48px;\n background: linear-gradient(180deg, rgba(1, 211, 116, 0.051) 0%, rgba(1, 211, 116, 0.1) 100%);\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n \n ", "\n"], ["\n max-width: 100%;\n width: 100%;\n height: 48px;\n background: linear-gradient(180deg, rgba(1, 211, 116, 0.051) 0%, rgba(1, 211, 116, 0.1) 100%);\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n \n ", "\n"])), SharedStyles);
5432
- var ProgressBar$1 = styled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"], ["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"])), function (p) { return "calc(".concat(100 * (!p.max ? 1 : (p.value / p.max)), "% - (").concat(p.left || 0, "px + 17px))"); }, function (props) { return props.error ? "#B21154" : (props.color || "#00d374"); });
5738
+ var ProgressWrapper$1 = styled.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n max-width: 100%;\n width: 100%;\n height: 48px;\n background: linear-gradient(180deg, rgba(1, 211, 116, 0.051) 0%, rgba(1, 211, 116, 0.1) 100%);\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n \n ", "\n"], ["\n max-width: 100%;\n width: 100%;\n height: 48px;\n background: linear-gradient(180deg, rgba(1, 211, 116, 0.051) 0%, rgba(1, 211, 116, 0.1) 100%);\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n \n ", "\n"])), SharedStyles);
5739
+ var ProgressBar$1 = styled.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"], ["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"])), function (p) { return "calc(".concat(100 * (!p.max ? 1 : (p.value / p.max)), "% - (").concat(p.left || 0, "px + 17px))"); }, function (props) { return props.error ? "#B21154" : (props.color || "#00d374"); });
5433
5740
  var LabeledBar = function (props) {
5434
5741
  var width = useWindowSize()[0];
5435
5742
  var _a = useState({ height: 0, width: 0, x: 0, y: 0, }), size = _a[0], setSize = _a[1];
@@ -5477,10 +5784,10 @@ var LabeledMultiProgress = function (_a) {
5477
5784
  React__default.createElement(Number$1, { commas: true, decimalPoints: 0, num: props.max })),
5478
5785
  React__default.createElement(MultiProgress, __assign({}, props, { labeled: true, style: __assign({ marginTop: 40 }, (props.style || {})) })));
5479
5786
  };
5480
- var templateObject_1$E, templateObject_2$s;
5787
+ var templateObject_1$G, templateObject_2$u;
5481
5788
 
5482
- var ProgressWrapper$2 = styled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n max-width: 100%;\n width: 100%;\n height: 48px;\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n\n ", "\n"], ["\n max-width: 100%;\n width: 100%;\n height: 48px;\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n\n ", "\n"])), SharedStyles);
5483
- var ProgressBar$2 = styled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"], ["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"])), function (p) {
5789
+ var ProgressWrapper$2 = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n max-width: 100%;\n width: 100%;\n height: 48px;\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n\n ", "\n"], ["\n max-width: 100%;\n width: 100%;\n height: 48px;\n box-shadow: 0px 4px 5px rgba(72, 78, 86, 0.1);\n border-radius: 50px;\n\n ", "\n"])), SharedStyles);
5790
+ var ProgressBar$2 = styled.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"], ["\n max-width: 100%;\n width: ", ";\n height: 48px;\n background: ", ";\n border-radius: 50px;\n display: inline-block;\n position: absolute;\n"])), function (p) {
5484
5791
  if (p.offset) {
5485
5792
  return "".concat(p.offset, "px");
5486
5793
  }
@@ -5537,7 +5844,7 @@ function Thermometer(_a) {
5537
5844
  React__default.createElement(ProgressWrapper$2, { style: { marginTop: 10, background: isSecondary ? '#FFF9C5' : '#C9FDE5' } },
5538
5845
  React__default.createElement(ProgressBar$2, { target: target, value: value1, color: barColor || colors.secondary3.main, offset: calcVal1Width(), elementWidth: value1Width })))));
5539
5846
  }
5540
- var templateObject_1$F, templateObject_2$t;
5847
+ var templateObject_1$H, templateObject_2$v;
5541
5848
 
5542
5849
  function LightIndicatorLight(_a) {
5543
5850
  var _b = _a.width, _c = _a.height, _d = _a.lit, lit = _d === void 0 ? false : _d, _e = _a.large, large = _e === void 0 ? false : _e, props = __rest(_a, ["width", "height", "lit", "large"]);
@@ -5557,18 +5864,18 @@ function LightIndicatorLight(_a) {
5557
5864
  React__default.createElement("defs", null,
5558
5865
  React__default.createElement("radialGradient", { id: lightID, cx: 0, cy: 0, r: 1, gradientUnits: "userSpaceOnUse", gradientTransform: gradientTransform }, litOrNot)));
5559
5866
  }
5560
- var LightIndicatorText = styled.p(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.large ? themeOptions.fontStyles.p.medium.fontSize : themeOptions.fontStyles.p.small.fontSize; }, themeOptions.fontStyles.p.small.fontFamily, themeOptions.fontStyles.p.small.lineHeight, function (props) { return props.LightIndicatorTextColor ? colors.neutrals.bodyText : colors.neutrals[70]; });
5561
- var LightIndicatorContainer = styled.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n max-width: 100%;\n margin-bottom: 8px;\n margin-right: 16px;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n max-width: 100%;\n margin-bottom: 8px;\n margin-right: 16px;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
5867
+ var LightIndicatorText = styled.p(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.large ? themeOptions.fontStyles.p.medium.fontSize : themeOptions.fontStyles.p.small.fontSize; }, themeOptions.fontStyles.p.small.fontFamily, themeOptions.fontStyles.p.small.lineHeight, function (props) { return props.LightIndicatorTextColor ? colors.neutrals.bodyText : colors.neutrals[70]; });
5868
+ var LightIndicatorContainer = styled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n max-width: 100%;\n margin-bottom: 8px;\n margin-right: 16px;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n max-width: 100%;\n margin-bottom: 8px;\n margin-right: 16px;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
5562
5869
  function LightIndicator(_a) {
5563
- var _b = _a.name, name = _b === void 0 ? "Name this Indicator" : _b, _c = _a.on, on = _c === void 0 ? false : _c, _d = _a.large, large = _d === void 0 ? false : _d, props = __rest(_a, ["name", "on", "large"]);
5870
+ var _b = _a.name, name = _b === void 0 ? "Name this Indicator" : _b, _c = _a.on, on = _c === void 0 ? false : _c, _d = _a.large, large = _d === void 0 ? false : _d, _e = _a.textProps, textProps = _e === void 0 ? {} : _e, props = __rest(_a, ["name", "on", "large", "textProps"]);
5564
5871
  return (React__default.createElement(LightIndicatorContainer, __assign({}, props),
5565
5872
  React__default.createElement(LightIndicatorLight, { large: large, lit: on, mr: 8, mt: 8 }),
5566
- React__default.createElement(LightIndicatorText, { large: large, LightIndicatorTextColor: on }, name)));
5873
+ React__default.createElement(LightIndicatorText, __assign({}, textProps, { large: large, LightIndicatorTextColor: on }), name)));
5567
5874
  }
5568
- var templateObject_1$G, templateObject_2$u;
5875
+ var templateObject_1$I, templateObject_2$w;
5569
5876
 
5570
- var DefaultStarText = styled.p(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.clicked ? 1 : props.hover ? 0.8 : 0; }, themeOptions.fontStyles.p.medium.fontSize, themeOptions.fontStyles.p.medium.fontFamily, themeOptions.fontStyles.p.medium.lineHeight, function (props) { return props.clicked ? props.color : colors.neutrals[60]; });
5571
- var DefaultStarContainer = styled.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n width: ", ";\n margin-bottom: 16px;\n margin-right: 16px;\n cursor: pointer;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n width: ", ";\n margin-bottom: 16px;\n margin-right: 16px;\n cursor: pointer;\n ", "\n ", "\n }\n"])), function (props) { return props.width ? props.width : props.noText ? '24px' : '128px'; }, SharedStyles, SizerCss);
5877
+ var DefaultStarText = styled.p(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"], ["\n &&& {\n opacity: ", ";\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n max-width: 180px;\n margin-top:0;\n margin-bottom:0;\n };\n"])), function (props) { return props.clicked ? 1 : props.hover ? 0.8 : 0; }, themeOptions.fontStyles.p.medium.fontSize, themeOptions.fontStyles.p.medium.fontFamily, themeOptions.fontStyles.p.medium.lineHeight, function (props) { return props.clicked ? props.color : colors.neutrals[60]; });
5878
+ var DefaultStarContainer = styled.div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n width: ", ";\n margin-bottom: 16px;\n margin-right: 16px;\n cursor: pointer;\n ", "\n ", "\n }\n"], ["\n &&& {\n display: flex;\n vertical-align: middle;\n align-items: top;\n width: ", ";\n margin-bottom: 16px;\n margin-right: 16px;\n cursor: pointer;\n ", "\n ", "\n }\n"])), function (props) { return props.width ? props.width : props.noText ? '24px' : '128px'; }, SharedStyles, SizerCss);
5572
5879
  function DefaultStar(_a) {
5573
5880
  var _b = _a.initialSelected, initialSelected = _b === void 0 ? false : _b, _c = _a.forceSelected, forceSelected = _c === void 0 ? false : _c, hoverText = _a.hoverText, _d = _a.noText, noText = _d === void 0 ? false : _d, _e = _a.children, children = _e === void 0 ? "Default" : _e, width = _a.width, _f = _a.color, color = _f === void 0 ? teal.main : _f, props = __rest(_a, ["initialSelected", "forceSelected", "hoverText", "noText", "children", "width", "color"]);
5574
5881
  if (!hoverText) {
@@ -5581,7 +5888,7 @@ function DefaultStar(_a) {
5581
5888
  noText ? null :
5582
5889
  React__default.createElement(DefaultStarText, { hoverText: hoverText, hover: isHover, clicked: isClicked || forceSelected, color: color }, !isClicked && isHover ? hoverText : children)));
5583
5890
  }
5584
- var templateObject_1$H, templateObject_2$v;
5891
+ var templateObject_1$J, templateObject_2$x;
5585
5892
 
5586
5893
  function CancelButton(_a) {
5587
5894
  var _b = _a.size, size = _b === void 0 ? "medium" : _b, _c = _a.variant, variant = _c === void 0 ? "error" : _c, _d = _a.style, Props = __rest(_a, ["size", "variant", "style"]);
@@ -5593,7 +5900,7 @@ function DoneButton(_a) {
5593
5900
  return (React__default.createElement(Button, __assign({ variant: variant, size: size }, Props), "Done"));
5594
5901
  }
5595
5902
 
5596
- var StyledLink = styled.a(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"])), fontStyles.p.medium.fontSize, fontStyles.p.medium.fontFamily, fontStyles.p.medium.lineHeight, function (props) { return props.color || colors.teal.main; }, function (props) { return props.flexShrink ? "flex-shrink: 0;" : null; }, SharedStyles, SizerCss, function (props) { return props.hoverColor ? props.hoverColor : colors.teal.dark; });
5903
+ var StyledLink = styled.a(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n text-decoration: none;\n cursor: pointer;\n display: flex;\n ", ";\n ", "\n ", "\n &:hover {\n color: ", ";\n }\n } \n"])), fontStyles.p.medium.fontSize, fontStyles.p.medium.fontFamily, fontStyles.p.medium.lineHeight, function (props) { return props.color || colors.teal.main; }, function (props) { return props.flexShrink ? "flex-shrink: 0;" : null; }, SharedStyles, SizerCss, function (props) { return props.hoverColor ? props.hoverColor : colors.teal.dark; });
5597
5904
  function LinkWithIcon(_a) {
5598
5905
  var Icon = _a.Icon, href = _a.href, children = _a.children, _b = _a.color, color = _b === void 0 ? colors.teal.main : _b, _c = _a.hoverColor, hoverColor = _c === void 0 ? colors.teal.dark : _c, _d = _a.flexShrink, flexShrink = _d === void 0 ? false : _d, iconProps = _a.iconProps, _e = _a.style, style = _e === void 0 ? {} : _e, props = __rest(_a, ["Icon", "href", "children", "color", "hoverColor", "flexShrink", "iconProps", "style"]);
5599
5906
  var _f = useState(false), isHover = _f[0], setHover = _f[1];
@@ -5610,7 +5917,7 @@ function LinkWithIcon(_a) {
5610
5917
  RenderIcon,
5611
5918
  children));
5612
5919
  }
5613
- var templateObject_1$I;
5920
+ var templateObject_1$K;
5614
5921
 
5615
5922
  var NotificationVariantStyles = function (alertType) {
5616
5923
  switch (alertType) {
@@ -5633,7 +5940,7 @@ var NotificationVariantStyles = function (alertType) {
5633
5940
  return {};
5634
5941
  }
5635
5942
  };
5636
- var StyledNotification = styled.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n width: fit-container;\n border-radius: 5px;\n padding: 24px 16px;\n display:flex;\n flex-direction: row;\n ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n width: fit-container;\n border-radius: 5px;\n padding: 24px 16px;\n display:flex;\n flex-direction: row;\n ", ";\n ", "\n ", "\n }\n"])), fontStyles.p.medium.fontSize, fontStyles.p.medium.fontFamily, fontStyles.p.medium.lineHeight, function (props) { return props.alertType ? NotificationVariantStyles(props.alertType) : {}; }, SharedStyles, SizerCss);
5943
+ var StyledNotification = styled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n width: fit-container;\n border-radius: 5px;\n padding: 24px 16px;\n display:flex;\n flex-direction: row;\n ", ";\n ", "\n ", "\n }\n"], ["\n &&& {\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n width: fit-container;\n border-radius: 5px;\n padding: 24px 16px;\n display:flex;\n flex-direction: row;\n ", ";\n ", "\n ", "\n }\n"])), fontStyles.p.medium.fontSize, fontStyles.p.medium.fontFamily, fontStyles.p.medium.lineHeight, function (props) { return props.alertType ? NotificationVariantStyles(props.alertType) : {}; }, SharedStyles, SizerCss);
5637
5944
  function AlertNotification(_a) {
5638
5945
  var _b = _a.alertType, alertType = _b === void 0 ? "neutral" : _b, _c = _a.learnMore, learnMore = _c === void 0 ? false : _c, href = _a.href, linkText = _a.linkText, children = _a.children, _d = _a.style, props = __rest(_a, ["alertType", "learnMore", "href", "linkText", "children", "style"]);
5639
5946
  function notificationIcon() {
@@ -5658,7 +5965,7 @@ function AlertNotification(_a) {
5658
5965
  React__default.createElement(LinkWithIcon, { href: href, style: { marginLeft: "auto" }, pl: 24, flexShrink: true }, linkText)
5659
5966
  : null));
5660
5967
  }
5661
- var templateObject_1$J;
5968
+ var templateObject_1$L;
5662
5969
 
5663
5970
  function useNumberInput(props) {
5664
5971
  var _a = props.defaultValue, defaultValue = _a === void 0 ? "" : _a, onChange = props.onChange, onFocus = props.onFocus, onBlur = props.onBlur, inputMode = props.inputMode, _b = props.localeOptions, localeOptions = _b === void 0 ? {} : _b;
@@ -5751,10 +6058,10 @@ function NumberInput(props) {
5751
6058
  : null));
5752
6059
  }
5753
6060
 
5754
- var InputStepperOuterContainer = styled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n &&&{\n width: ", ";\n ", "\n ", "\n }\n"], ["\n &&&{\n width: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.width ? props.width : "160px"; }, SharedStyles, SizerCss);
5755
- var InputStepperInnerContainer = styled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n &&&{\n display: flex;\n width: 100%;\n flex-direction: row;\n justify-content: space-between;\n border-radius: 5px;\n background-color: white;\n ", "\n ", "\n }\n"], ["\n &&&{\n display: flex;\n width: 100%;\n flex-direction: row;\n justify-content: space-between;\n border-radius: 5px;\n background-color: white;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
5756
- var InputStepperLabel = styled.label(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n &&&{\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n margin-bottom: 8px;\n color: ", "\n ", "\n ", "\n }\n"], ["\n &&&{\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n margin-bottom: 8px;\n color: ", "\n ", "\n ", "\n }\n"])), fontStyles.label.fontSize, fontStyles.label.fontFamily, fontStyles.label.lineHeight, neutrals.bodyText, SharedStyles, SizerCss);
5757
- var CurrentNumber = styled.div(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &&&{\n display:flex;\n justify-content: center;\n align-items: center;\n height:38px;\n width:100%;\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n color: ", ";\n text-align:center;\n vertical-align:middle;\n }\n"], ["\n &&&{\n display:flex;\n justify-content: center;\n align-items: center;\n height:38px;\n width:100%;\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n color: ", ";\n text-align:center;\n vertical-align:middle;\n }\n"])), neutrals['60'], neutrals['60'], neutrals.bodyText);
6061
+ var InputStepperOuterContainer = styled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n &&&{\n width: ", ";\n ", "\n ", "\n }\n"], ["\n &&&{\n width: ", ";\n ", "\n ", "\n }\n"])), function (props) { return props.width ? props.width : "160px"; }, SharedStyles, SizerCss);
6062
+ var InputStepperInnerContainer = styled.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n &&&{\n display: flex;\n width: 100%;\n flex-direction: row;\n justify-content: space-between;\n border-radius: 5px;\n background-color: white;\n ", "\n ", "\n }\n"], ["\n &&&{\n display: flex;\n width: 100%;\n flex-direction: row;\n justify-content: space-between;\n border-radius: 5px;\n background-color: white;\n ", "\n ", "\n }\n"])), SharedStyles, SizerCss);
6063
+ var InputStepperLabel = styled.label(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n &&&{\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n margin-bottom: 8px;\n color: ", "\n ", "\n ", "\n }\n"], ["\n &&&{\n font-size: ", ";\n font-family: ", ";\n line-height: ", ";\n margin-bottom: 8px;\n color: ", "\n ", "\n ", "\n }\n"])), fontStyles.label.fontSize, fontStyles.label.fontFamily, fontStyles.label.lineHeight, neutrals.bodyText, SharedStyles, SizerCss);
6064
+ var CurrentNumber = styled.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n &&&{\n display:flex;\n justify-content: center;\n align-items: center;\n height:38px;\n width:100%;\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n color: ", ";\n text-align:center;\n vertical-align:middle;\n }\n"], ["\n &&&{\n display:flex;\n justify-content: center;\n align-items: center;\n height:38px;\n width:100%;\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n color: ", ";\n text-align:center;\n vertical-align:middle;\n }\n"])), neutrals['60'], neutrals['60'], neutrals.bodyText);
5758
6065
  var canIncrement = function (value, max) {
5759
6066
  return (max !== undefined && value < max) || max === undefined;
5760
6067
  };
@@ -5813,11 +6120,21 @@ function InputStepper(props) {
5813
6120
  return (React__default.createElement(InputStepperOuterContainer, { width: width },
5814
6121
  React__default.createElement(InputStepperLabel, { style: labelStyle }, label),
5815
6122
  React__default.createElement(InputStepperInnerContainer, { style: style },
5816
- React__default.createElement(IconButton, { Icon: SubtractIcon, variant: decrementButtonVariant, onClick: handleDecrement, style: { borderRadius: "5px 0 0 5px" }, onMouseDown: onDecrementMouseDown, onMouseLeave: onDecrementMouseLeave, onMouseUp: onDecrementMouseUp, onTouchEnd: onDecrementTouchEnd, onTouchStart: onDecrementTouchStart }),
6123
+ React__default.createElement(IconButton, { Icon: SubtractIcon, variant: decrementButtonVariant, onClick: handleDecrement, style: { borderRadius: "5px 0 0 5px" }, onMouseDown: function (e) {
6124
+ if (e.button !== 0) {
6125
+ return;
6126
+ }
6127
+ onDecrementMouseDown();
6128
+ }, onMouseOut: onDecrementMouseLeave, onMouseUp: onDecrementMouseUp, onTouchEnd: onDecrementTouchEnd, onTouchStart: onDecrementTouchStart }),
5817
6129
  React__default.createElement(Input, __assign({}, rest, { style: { width: '100%', margin: 0, borderRadius: 0, textAlign: "center" }, value: value, inputMode: inputMode, onChange: onChange, onBlur: onBlur, onFocus: onFocus, disabled: inputDisabled, ref: ref, onKeyUp: delayChange })),
5818
- React__default.createElement(IconButton, { Icon: AddIcon, variant: incrementButtonVariant, onClick: handleIncrement, style: { borderRadius: "0 5px 5px 0" }, onMouseDown: onIncrementMouseDown, onMouseLeave: onIncrementMouseLeave, onMouseUp: onIncrementMouseUp, onTouchEnd: onIncrementTouchEnd, onTouchStart: onIncrementTouchStart }))));
6130
+ React__default.createElement(IconButton, { Icon: AddIcon, variant: incrementButtonVariant, onClick: handleIncrement, style: { borderRadius: "0 5px 5px 0" }, onMouseDown: function (e) {
6131
+ if (e.button !== 0) {
6132
+ return;
6133
+ }
6134
+ onIncrementMouseDown();
6135
+ }, onMouseOut: onIncrementMouseLeave, onMouseUp: onIncrementMouseUp, onTouchEnd: onIncrementTouchEnd, onTouchStart: onIncrementTouchStart }))));
5819
6136
  }
5820
- var templateObject_1$K, templateObject_2$w, templateObject_3$l, templateObject_4$d;
6137
+ var templateObject_1$M, templateObject_2$y, templateObject_3$m, templateObject_4$f;
5821
6138
 
5822
6139
  var VirtualTable = function (props) {
5823
6140
  var columns = props.columns, data = props.data, itemSize = props.itemSize, _a = props.height, height = _a === void 0 ? 500 : _a, _b = props.minWidth, minWidth = _b === void 0 ? 140 : _b, _c = props.maxWidth, maxWidth = _c === void 0 ? 500 : _c, defaultSort = props.defaultSort, onClickRow = props.onClickRow, onScroll = props.onScroll, onUpdateData = props.onUpdateData, _d = props.useTableProps, useTableProps = _d === void 0 ? {} : _d, _e = props.tableHeaderProps, tableHeaderProps = _e === void 0 ? {} : _e, _f = props.tableFooterProps, tableFooterProps = _f === void 0 ? {} : _f, _g = props.hideFooter, hideFooter = _g === void 0 ? true : _g, _h = props.hideHeader, hideHeader = _h === void 0 ? false : _h, _j = props.className, className = _j === void 0 ? '' : _j, NoRowsFound = props.NoRowsFound, renderRowSubComponent = props.renderRowSubComponent, onSort = props.onSort, onResize = props.onResize, rowGroupStyles = props.rowGroupStyles, rowStyles = props.rowStyles, _k = props.gutterSize, gutterSize = _k === void 0 ? 0 : _k, _l = props.customTableFooterProps, customTableFooterProps = _l === void 0 ? {} : _l, TableFooter = props.TableFooter;
@@ -5877,7 +6194,7 @@ var VirtualTable = function (props) {
5877
6194
  return (React__default.createElement("div", __assign({ className: "tr-group" }, row.getRowProps(), { style: __assign(__assign(__assign({}, style), (rowGroupStyles ? rowGroupStyles({ row: row, style: style }) : {})), { minWidth: totalColumnsWidth, width: '100%' }) }),
5878
6195
  React__default.createElement("div", { className: "tr", style: rowStyles ? rowStyles({ row: row, style: style }) : {} }, row.cells.map(function (cell) {
5879
6196
  var cellProps = cell.getCellProps();
5880
- return (React__default.createElement("div", __assign({}, __assign({}, cellProps), { onClick: function () { return (onClickRow ? onClickRow(cell.row.original, index) : null); }, className: "td" }), cell.render("Cell", { isScrolling: isScrolling, resetList: resetList, toggleAllRowsExpanded: toggleAllRowsExpanded })));
6197
+ return (React__default.createElement("div", __assign({}, __assign({}, cellProps), { onClick: function () { return (onClickRow ? onClickRow(cell.row.original, index, { cell: cell, isScrolling: isScrolling, resetList: resetList, toggleAllRowsExpanded: toggleAllRowsExpanded }) : null); }, className: "td" }), cell.render("Cell", { isScrolling: isScrolling, resetList: resetList, toggleAllRowsExpanded: toggleAllRowsExpanded })));
5881
6198
  })),
5882
6199
  row.isExpanded && renderRowSubComponent
5883
6200
  ? React__default.createElement("div", { className: 'tr-sub' }, renderRowSubComponent({ row: row, resetList: resetList, }))
@@ -5940,11 +6257,285 @@ function sortDirection(col) {
5940
6257
  return "updown";
5941
6258
  }
5942
6259
 
5943
- var VirtualTableStyles = styled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\npadding: 1rem;\n\n.table-list-rows {\n ", "\n}\n\n.table {\n display: inline-flex;\n flex-direction: column;\n ", "\n width: 100% !important;\n min-width: 100% !important;\n ", "\n\n .thead {\n padding-right: 15px;\n ", "\n\n .tr {\n overflow-x: hidden;\n min-width: 100%;\n }\n }\n\n .tbody {\n flex: 1 1 auto;\n height: 80vh;\n }\n\n .tr-group {\n display: flex;\n flex-direction: column;\n\n .tr, .tr-sub {\n width: 99%;\n }\n }\n\n .tr {\n display: flex;\n\n ", "\n }\n\n .tr.header {\n position: sticky;\n }\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n ", "\n }\n}"], ["\npadding: 1rem;\n\n.table-list-rows {\n ", "\n}\n\n.table {\n display: inline-flex;\n flex-direction: column;\n ", "\n width: 100% !important;\n min-width: 100% !important;\n ", "\n\n .thead {\n padding-right: 15px;\n ", "\n\n .tr {\n overflow-x: hidden;\n min-width: 100%;\n }\n }\n\n .tbody {\n flex: 1 1 auto;\n height: 80vh;\n }\n\n .tr-group {\n display: flex;\n flex-direction: column;\n\n .tr, .tr-sub {\n width: 99%;\n }\n }\n\n .tr {\n display: flex;\n\n ", "\n }\n\n .tr.header {\n position: sticky;\n }\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n ", "\n }\n}"])), function (p) { return p.rowClickable ? "\n .tr {\n cursor: pointer;\n }\n " : ''; }, function (p) { return p.bordered ? "\n border-spacing: 0;\n border: 1px solid black;\n " : ''; }, function (p) { return p.tableHeight ? "height: ".concat(p.tableHeight).concat(typeof p.tableHeight === 'number' ? 'px' : '', ";") : ''; }, function (p) { return p.bordered ? 'border-bottom: 1px solid #000;' : ''; }, function (p) { return p.bordered ? "\n :last-child {\n .td {\n border-bottom: 0;\n }\n }\n " : ''; }, function (p) { return p.bordered ? "\n border-bottom: 1px solid black;\n border-right: 1px solid black;\n :last-child {\n border-right: 0;\n }\n " : ''; });
5944
- var templateObject_1$L;
6260
+ var VirtualTableStyles = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\npadding: 1rem;\n\n.table-list-rows {\n ", "\n}\n\n.table {\n display: inline-flex;\n flex-direction: column;\n ", "\n width: 100% !important;\n min-width: 100% !important;\n ", "\n\n .thead {\n padding-right: 15px;\n ", "\n\n .tr {\n overflow-x: hidden;\n min-width: 100%;\n }\n }\n\n .tbody {\n flex: 1 1 auto;\n height: 80vh;\n }\n\n .tr-group {\n display: flex;\n flex-direction: column;\n\n .tr, .tr-sub {\n width: 99%;\n }\n }\n\n .tr {\n display: flex;\n\n ", "\n }\n\n .tr.header {\n position: sticky;\n }\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n ", "\n }\n}"], ["\npadding: 1rem;\n\n.table-list-rows {\n ", "\n}\n\n.table {\n display: inline-flex;\n flex-direction: column;\n ", "\n width: 100% !important;\n min-width: 100% !important;\n ", "\n\n .thead {\n padding-right: 15px;\n ", "\n\n .tr {\n overflow-x: hidden;\n min-width: 100%;\n }\n }\n\n .tbody {\n flex: 1 1 auto;\n height: 80vh;\n }\n\n .tr-group {\n display: flex;\n flex-direction: column;\n\n .tr, .tr-sub {\n width: 99%;\n }\n }\n\n .tr {\n display: flex;\n\n ", "\n }\n\n .tr.header {\n position: sticky;\n }\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n ", "\n }\n}"])), function (p) { return p.rowClickable ? "\n .tr {\n cursor: pointer;\n }\n " : ''; }, function (p) { return p.bordered ? "\n border-spacing: 0;\n border: 1px solid black;\n " : ''; }, function (p) { return p.tableHeight ? "height: ".concat(p.tableHeight).concat(typeof p.tableHeight === 'number' ? 'px' : '', ";") : ''; }, function (p) { return p.bordered ? 'border-bottom: 1px solid #000;' : ''; }, function (p) { return p.bordered ? "\n :last-child {\n .td {\n border-bottom: 0;\n }\n }\n " : ''; }, function (p) { return p.bordered ? "\n border-bottom: 1px solid black;\n border-right: 1px solid black;\n :last-child {\n border-right: 0;\n }\n " : ''; });
6261
+ var templateObject_1$N;
6262
+
6263
+ var isSizeObj = function (val) { return typeof val === 'object' && (val['xs'] || val['sm'] || val['md'] || val['lg'] || val['xl']); };
6264
+ var parseResponsiveValue = function (value, transform) {
6265
+ if (typeof value === 'number' || typeof value === 'string' || typeof value === 'boolean') {
6266
+ return transform(value);
6267
+ }
6268
+ else if (Array.isArray(value)) {
6269
+ return value.map(function (v, i) {
6270
+ var _a;
6271
+ if (i >= sizes.length) {
6272
+ return {};
6273
+ }
6274
+ var size = sizes[i];
6275
+ if (v === null || v === undefined) {
6276
+ return {};
6277
+ }
6278
+ return _a = {}, _a[sizeMedia[size]] = transform(v), _a;
6279
+ }).reduce(function (acc, v) { return (__assign(__assign({}, acc), v)); }, {});
6280
+ }
6281
+ else if (typeof value === 'object') {
6282
+ if (!isSizeObj(value)) {
6283
+ return value;
6284
+ }
6285
+ return Object.keys(value)
6286
+ .filter(function (k) { return sizes.includes(k); })
6287
+ .map(function (k) {
6288
+ var _a;
6289
+ return (_a = {}, _a[sizeMedia[k]] = transform(value[k]), _a);
6290
+ })
6291
+ .reduce(function (acc, v) { return (__assign(__assign({}, acc), v)); }, {});
6292
+ }
6293
+ return {};
6294
+ };
6295
+
6296
+ var createMeasurementStyle = function (v, keys) {
6297
+ var value = typeof v === 'string' && ['auto', 'none'].includes(v)
6298
+ ? v
6299
+ : parseMeasurement(v);
6300
+ return keys.reduce(function (acc, k) {
6301
+ var _a;
6302
+ return (__assign(__assign({}, acc), (_a = {}, _a[k] = value, _a)));
6303
+ }, {});
6304
+ };
6305
+ var styleKeys = [
6306
+ 'pr', 'pl', 'pt', 'pb', 'px', 'py',
6307
+ 'mr', 'ml', 'mt', 'mb', 'mx', 'my',
6308
+ 'width', 'height',
6309
+ 'color', 'bg', 'background', 'backgroundColor',
6310
+ 'colSpan',
6311
+ 'style', 'sx',
6312
+ ];
6313
+ var stylesTransformMap = {
6314
+ mr: function (v) { return createMeasurementStyle(v, ['marginRight']); },
6315
+ ml: function (v) { return createMeasurementStyle(v, ['marginLeft']); },
6316
+ mt: function (v) { return createMeasurementStyle(v, ['marginTop']); },
6317
+ mb: function (v) { return createMeasurementStyle(v, ['marginBottom']); },
6318
+ mx: function (v) { return createMeasurementStyle(v, ['marginLeft', 'marginRight']); },
6319
+ my: function (v) { return createMeasurementStyle(v, ['marginTop', 'marginBottom']); },
6320
+ pr: function (v) { return createMeasurementStyle(v, ['paddingRight']); },
6321
+ pl: function (v) { return createMeasurementStyle(v, ['paddingLeft']); },
6322
+ pt: function (v) { return createMeasurementStyle(v, ['paddingTop']); },
6323
+ pb: function (v) { return createMeasurementStyle(v, ['paddingBottom']); },
6324
+ px: function (v) { return createMeasurementStyle(v, ['paddingLeft', 'paddingRight']); },
6325
+ py: function (v) { return createMeasurementStyle(v, ['paddingTop', 'paddingBottom']); },
6326
+ width: function (v) { return createMeasurementStyle(v, ['width']); },
6327
+ height: function (v) { return createMeasurementStyle(v, ['height']); },
6328
+ color: function (v) { return ({ color: v }); },
6329
+ bg: function (v) { return ({ background: v }); },
6330
+ background: function (v) { return ({ background: v }); },
6331
+ backgroundColor: function (v) { return ({ backgroundColor: v }); },
6332
+ hidden: function (v) { return (v ? { display: 'none' } : {}); },
6333
+ block: function (v) { return (v ? { display: 'block' } : {}); },
6334
+ inline_block: function (v) { return (v ? { display: 'inline-block' } : {}); },
6335
+ flex: function (v) { return (v ? { display: 'flex' } : {}); },
6336
+ inline_flex: function (v) { return (v ? { display: 'inline-flex' } : {}); },
6337
+ grid: function (v) { return (v ? { display: 'grid' } : {}); },
6338
+ float: function (v) { return (v === 'clearfix'
6339
+ ? { '&::after': {
6340
+ content: '',
6341
+ display: 'table',
6342
+ clear: 'both',
6343
+ } }
6344
+ : { float: v }); },
6345
+ colSpan: function (v) {
6346
+ if (v === 'auto' || v === true) {
6347
+ return { gridColumn: 'auto' };
6348
+ }
6349
+ else if (v === false) {
6350
+ return { display: 'none' };
6351
+ }
6352
+ var colSpan = stripUnit(v);
6353
+ return { gridColumn: "span ".concat(colSpan, " / span ").concat(colSpan) };
6354
+ },
6355
+ style: function (v) { return v; },
6356
+ sx: function (v) { return v; },
6357
+ };
6358
+ var parseCskuStyles = function (p) {
6359
+ var sizeStylesObj = {};
6360
+ var stylesObj = {};
6361
+ var stylesArr = [];
6362
+ Object.keys(p)
6363
+ .filter(function (k) { return styleKeys.includes(k); })
6364
+ .forEach(function (k) {
6365
+ var parsedStyles = parseResponsiveValue(p[k], stylesTransformMap[k]);
6366
+ if (Array.isArray(parsedStyles)) {
6367
+ parsedStyles.forEach(function (v) {
6368
+ stylesArr.push(v);
6369
+ });
6370
+ }
6371
+ else {
6372
+ if (isSizeObj(p[k]) || Array.isArray(p[k])) {
6373
+ Object.keys(parsedStyles).forEach(function (sk) {
6374
+ sizeStylesObj[sk] = __assign(__assign({}, (sizeStylesObj[sk] || {})), parsedStyles[sk]);
6375
+ });
6376
+ }
6377
+ else {
6378
+ stylesObj = __assign(__assign({}, stylesObj), parsedStyles);
6379
+ }
6380
+ }
6381
+ });
6382
+ return __spreadArray([stylesObj, sizeStylesObj], stylesArr, true);
6383
+ };
6384
+ var Csku = styled.div(parseCskuStyles);
6385
+
6386
+ var Grid = styled.div(function (p) {
6387
+ var params = {
6388
+ display: 'grid',
6389
+ gridTemplateColumns: "repeat(".concat(p.columns || 12, ", minmax(0px, 1fr))"),
6390
+ };
6391
+ if (p.gap) {
6392
+ params['gap'] = parseMeasurement(p.gap);
6393
+ }
6394
+ return params;
6395
+ });
6396
+ var GridItem = styled.div(function (p) {
6397
+ var params = { gridColumn: 'auto' };
6398
+ var styles = [];
6399
+ if (p.colSpan) {
6400
+ var colStyles = parseResponsiveValue(p.colSpan, function (v) {
6401
+ if (v === 'auto') {
6402
+ return { gridColumn: 'auto' };
6403
+ }
6404
+ var colSpan = stripUnit(v);
6405
+ return { gridColumn: "span ".concat(colSpan, " / span ").concat(colSpan) };
6406
+ });
6407
+ if (Array.isArray(colStyles)) {
6408
+ colStyles.forEach(function (v) { styles.push(v); });
6409
+ }
6410
+ else {
6411
+ params = __assign(__assign({}, params), colStyles);
6412
+ }
6413
+ }
6414
+ return __spreadArray(__spreadArray([], styles, true), [params], false);
6415
+ });
6416
+
6417
+ var BaseCollapsible = function (props) {
6418
+ var children = props.children, style = props.style, label = props.label, controls = props.controls, _a = props.isOpen, isOpen = _a === void 0 ? false : _a, handleToggle = props.handleToggle;
6419
+ var _b = useState(isOpen ? undefined : 0), height = _b[0], setHeight = _b[1];
6420
+ var ref = useRef(null);
6421
+ useEffect(function () {
6422
+ if (!height || !isOpen || !ref.current)
6423
+ return undefined;
6424
+ var resizeObserver = new ResizeObserver(function (el) {
6425
+ setHeight(el[0].contentRect.height);
6426
+ });
6427
+ resizeObserver.observe(ref.current);
6428
+ return function () {
6429
+ resizeObserver.disconnect();
6430
+ };
6431
+ }, [height, isOpen]);
6432
+ useEffect(function () {
6433
+ var _a;
6434
+ if (isOpen)
6435
+ setHeight((_a = ref.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height);
6436
+ else
6437
+ setHeight(0);
6438
+ }, [isOpen]);
6439
+ return (React__default.createElement("div", { style: style },
6440
+ React__default.createElement(Row, { style: __assign({ alignItems: 'center', padding: 10, paddingTop: 12, paddingBottom: 8, background: isOpen ? colors.white : colors.teal[20], borderRadius: isOpen ? 25 : 2000, flex: 'none', order: 1, flexGrow: 0 }, (isOpen
6441
+ ? { border: "3px solid ".concat(colors.teal.main) }
6442
+ : {})) },
6443
+ React__default.createElement(Col, { xs: true, sm: 5.9, style: { cursor: 'pointer', }, onClick: handleToggle },
6444
+ React__default.createElement(CollapsibleLabel, { isOpen: isOpen }, label)),
6445
+ React__default.createElement(Col, { xs: true, sm: 5.9, style: { cursor: 'pointer', }, smStyle: "text-align: right;", xsStyle: "text-align: center;", onClick: handleToggle },
6446
+ React__default.createElement(CollapsibleControls, { isOpen: isOpen }, controls)),
6447
+ React__default.createElement(Col, { xs: true, style: {
6448
+ overflow: 'hidden',
6449
+ transition: 'height 0.2s ease-in-out',
6450
+ height: height,
6451
+ } },
6452
+ React__default.createElement("div", { ref: ref }, children)))));
6453
+ };
6454
+ var Collapsible$1 = function (props) {
6455
+ var children = props.children, open = props.open, onToggleOpen = props.onToggleOpen, rest = __rest(props, ["children", "open", "onToggleOpen"]);
6456
+ var _a = useState(open), isOpen = _a[0], setIsOpen = _a[1];
6457
+ var handleToggle = function () {
6458
+ setIsOpen(function (prev) {
6459
+ var val = !prev;
6460
+ onToggleOpen && onToggleOpen(val);
6461
+ return val;
6462
+ });
6463
+ };
6464
+ return (React__default.createElement(BaseCollapsible, __assign({ isOpen: isOpen, handleToggle: handleToggle }, rest), children));
6465
+ };
6466
+ var CollapsibleLabel = function (props) {
6467
+ var children = props.children, isOpen = props.isOpen;
6468
+ if (children === undefined || children === null) {
6469
+ return null;
6470
+ }
6471
+ if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
6472
+ return React__default.createElement("span", { style: {
6473
+ color: colors.teal.main,
6474
+ fontFamily: fontFamilies.bold,
6475
+ fontStyle: 'normal',
6476
+ fontWeight: 500,
6477
+ fontSize: 16,
6478
+ } }, children);
6479
+ }
6480
+ return React__default.cloneElement(children, { isOpen: isOpen });
6481
+ };
6482
+ var CollapsibleArrowIcon = function (props) {
6483
+ var isOpen = props.isOpen;
6484
+ return React__default.createElement(ChevronIcon, { size: 'medium', direction: 'down', altText: isOpen ? 'Close' : 'Open', style: __assign({ transition: 'all 0.2s linear', MozTransition: 'all 0.2s linear', WebkitTransition: 'all 0.2s linear' }, (isOpen ? {
6485
+ transform: 'rotate(180deg)',
6486
+ MozTransform: 'rotate(180deg)',
6487
+ WebkitTransform: 'rotate(180deg)',
6488
+ } : {
6489
+ transform: 'rotate(360deg)',
6490
+ MozTransform: 'rotate(360deg)',
6491
+ WebkitTransform: 'rotate(360deg)',
6492
+ })) });
6493
+ };
6494
+ var CollapsibleControls = function (props) {
6495
+ var children = props.children, _a = props.isOpen, isOpen = _a === void 0 ? false : _a;
6496
+ if (children === undefined || children === null) {
6497
+ return React__default.createElement(CollapsibleArrowIcon, { isOpen: isOpen });
6498
+ }
6499
+ if (typeof children === 'string' || typeof children === 'number' || typeof children === 'boolean') {
6500
+ return React__default.createElement("span", { style: {
6501
+ color: colors.teal.main,
6502
+ fontFamily: fontFamilies.bold,
6503
+ fontStyle: 'normal',
6504
+ fontWeight: 500,
6505
+ fontSize: 16,
6506
+ } }, children);
6507
+ }
6508
+ return React__default.cloneElement(children, { isOpen: isOpen });
6509
+ };
6510
+ function Collapsibles(props) {
6511
+ var list = props.list, controls = props.controls;
6512
+ var _a = useState(-1), open = _a[0], setOpen = _a[1];
6513
+ var handleOpen = function (i) { return setOpen(function (s) { return s === i ? -1 : i; }); };
6514
+ return (React__default.createElement("div", null, list.map(function (v, i) { return (React__default.createElement(BaseCollapsible, { key: "Collapsible-key-".concat(i), label: v.label, style: __assign({ paddingBottom: 10 }, v.style), controls: controls || v.controls, isOpen: open === i, handleToggle: function () {
6515
+ handleOpen(i);
6516
+ } }, v.children)); })));
6517
+ }
6518
+
6519
+ var ConfirmPopup = function (props) {
6520
+ var _a = props.confirmText, confirmText = _a === void 0 ? 'Are you sure you want to delete?' : _a, _b = props.disableDelete, disableDelete = _b === void 0 ? false : _b, onDelete = props.onDelete, onClose = props.onClose;
6521
+ return (React__default.createElement(Popup, { width: 'auto', height: 'auto', padding: '36px', noHeader: true, noCloseButton: true },
6522
+ React__default.createElement("p", { style: {
6523
+ fontFamily: fontStyles.p.medium.fontFamily,
6524
+ fontSize: fontStyles.p.medium.fontSize,
6525
+ lineHeight: fontStyles.p.medium.lineHeight,
6526
+ color: colors.neutrals.bodyText
6527
+ } }, confirmText),
6528
+ React__default.createElement("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } },
6529
+ React__default.createElement(Button, { size: "medium", variant: 'secondary', mr: 24, onClick: function () {
6530
+ onClose && onClose();
6531
+ } }, "Cancel"),
6532
+ React__default.createElement(Button, { size: "medium", variant: disableDelete ? 'disabled' : 'error', onClick: function () {
6533
+ onDelete && onDelete();
6534
+ }, disabled: disableDelete }, "Delete"))));
6535
+ };
5945
6536
 
5946
- var StyledDayBody = styled(Col)(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n position: relative;\n height: auto;\n border-right: 1px solid #eee;\n overflow: hidden;\n cursor: pointer;\n background: #fff;\n transition: 0.25s ease-out;\n font-size: 1em;\n overflow-y: auto;\n\n &:last-child {\n border-right: none;\n }\n\n &:hover {\n background: #f9f9f9;\n transition: 0.5s ease-out;\n }\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"], ["\n position: relative;\n height: auto;\n border-right: 1px solid #eee;\n overflow: hidden;\n cursor: pointer;\n background: #fff;\n transition: 0.25s ease-out;\n font-size: 1em;\n overflow-y: auto;\n\n &:last-child {\n border-right: none;\n }\n\n &:hover {\n background: #f9f9f9;\n transition: 0.5s ease-out;\n }\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (p) { return p.selected ? "\n background: #f9f9f9;\n " : ''; }, function (p) { return p.today ? "\n background: #f9f9f9;\n " : ''; }, function (p) { return p.row ? "\n border-bottom: 1px solid #eee;\n " : ''; }, function (p) { return p.disabled ? "\n color: #ccc;\n pointer-events: none;\n " : ''; });
5947
- var templateObject_1$M;
6537
+ var StyledDayBody = styled(Col)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n position: relative;\n height: auto;\n border-right: 1px solid #eee;\n overflow: hidden;\n cursor: pointer;\n background: #fff;\n transition: 0.25s ease-out;\n font-size: 1em;\n overflow-y: auto;\n\n &:last-child {\n border-right: none;\n }\n\n &:hover {\n background: #f9f9f9;\n transition: 0.5s ease-out;\n }\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"], ["\n position: relative;\n height: auto;\n border-right: 1px solid #eee;\n overflow: hidden;\n cursor: pointer;\n background: #fff;\n transition: 0.25s ease-out;\n font-size: 1em;\n overflow-y: auto;\n\n &:last-child {\n border-right: none;\n }\n\n &:hover {\n background: #f9f9f9;\n transition: 0.5s ease-out;\n }\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (p) { return p.selected ? "\n background: #f9f9f9;\n " : ''; }, function (p) { return p.today ? "\n background: #f9f9f9;\n " : ''; }, function (p) { return p.row ? "\n border-bottom: 1px solid #eee;\n " : ''; }, function (p) { return p.disabled ? "\n color: #ccc;\n pointer-events: none;\n " : ''; });
6538
+ var templateObject_1$O;
5948
6539
 
5949
6540
  var CalendarDayBody = function (_a) {
5950
6541
  var day = _a.day, selectedDate = _a.selectedDate, onClick = _a.onClick, children = _a.children, weekend = _a.weekend, props = __rest(_a, ["day", "selectedDate", "onClick", "children", "weekend"]);
@@ -5959,8 +6550,8 @@ var CalendarDayBody = function (_a) {
5959
6550
  return (React__default.createElement(StyledDayBody, __assign({ padded: true, totalCols: weekend ? 7 : 5, xs: 1, selected: isSelected, today: isToday, onClick: onClick, className: classNames }, props), children || React__default.createElement("span", { style: { padding: 10, } }, formattedDay)));
5960
6551
  };
5961
6552
 
5962
- var DaysBodyWrapper = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n font-size: 1em;\n font-weight: 300;\n line-height: 1;\n color: #777;\n background: #f9f9f9;\n position: relative;\n border-bottom: 1px solid #eee;\n"], ["\n font-size: 1em;\n font-weight: 300;\n line-height: 1;\n color: #777;\n background: #f9f9f9;\n position: relative;\n border-bottom: 1px solid #eee;\n"])));
5963
- var templateObject_1$N;
6553
+ var DaysBodyWrapper = styled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n font-size: 1em;\n font-weight: 300;\n line-height: 1;\n color: #777;\n background: #f9f9f9;\n position: relative;\n border-bottom: 1px solid #eee;\n"], ["\n font-size: 1em;\n font-weight: 300;\n line-height: 1;\n color: #777;\n background: #f9f9f9;\n position: relative;\n border-bottom: 1px solid #eee;\n"])));
6554
+ var templateObject_1$P;
5964
6555
 
5965
6556
  var CalendarDaysBody = function (_a) {
5966
6557
  var _b = _a.days, days = _b === void 0 ? [] : _b, currentMonth = _a.currentMonth, selectedDate = _a.selectedDate, onClickDay = _a.onClickDay, components = _a.components, _c = _a.dayBodyProps, dayBodyProps = _c === void 0 ? {} : _c, _d = _a.weekend, weekend = _d === void 0 ? true : _d, props = __rest(_a, ["days", "currentMonth", "selectedDate", "onClickDay", "components", "dayBodyProps", "weekend"]);
@@ -5972,11 +6563,11 @@ var CalendarDaysBody = function (_a) {
5972
6563
  }))));
5973
6564
  };
5974
6565
 
5975
- var DaysHeaderWrapper = styled(Row)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n text-transform: uppercase;\n font-weight: 400;\n color: #ccc;\n font-size: 70%;\n padding: 0.75em 0 !important;\n border-bottom: 1px solid #eee;\n"], ["\n text-transform: uppercase;\n font-weight: 400;\n color: #ccc;\n font-size: 70%;\n padding: 0.75em 0 !important;\n border-bottom: 1px solid #eee;\n"])));
5976
- var templateObject_1$O;
6566
+ var DaysHeaderWrapper = styled(Row)(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n text-transform: uppercase;\n font-weight: 400;\n color: #ccc;\n font-size: 70%;\n padding: 0.75em 0 !important;\n border-bottom: 1px solid #eee;\n"], ["\n text-transform: uppercase;\n font-weight: 400;\n color: #ccc;\n font-size: 70%;\n padding: 0.75em 0 !important;\n border-bottom: 1px solid #eee;\n"])));
6567
+ var templateObject_1$Q;
5977
6568
 
5978
- var StyledDayText = styled(Text)(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) { return props.selected ? "\n border-radius: 15px;\n background: ".concat(colors.cta, ";\n color: white;\n font-weight: bold;\n padding: 0 5px;\n ") : ''; });
5979
- var templateObject_1$P;
6569
+ var StyledDayText = styled(Text)(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) { return props.selected ? "\n border-radius: 15px;\n background: ".concat(colors.cta, ";\n color: white;\n font-weight: bold;\n padding: 0 5px;\n ") : ''; });
6570
+ var templateObject_1$R;
5980
6571
 
5981
6572
  var CalendarDaysHeader = function (_a) {
5982
6573
  var currentMonth = _a.currentMonth, selectedDate = _a.selectedDate, weekend = _a.weekend;
@@ -5991,11 +6582,11 @@ var CalendarDaysHeader = function (_a) {
5991
6582
  })));
5992
6583
  };
5993
6584
 
5994
- var CalendarWrapper = styled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n display: block;\n position: relative;\n width: 100%;\n background: #fff;\n .calendar-scroll {\n overflow-x: scroll;\n }\n .days-body-wrapper, .days-header-wrapper {\n min-width: 900px;\n }\n"], ["\n display: block;\n position: relative;\n width: 100%;\n background: #fff;\n .calendar-scroll {\n overflow-x: scroll;\n }\n .days-body-wrapper, .days-header-wrapper {\n min-width: 900px;\n }\n"])));
5995
- var templateObject_1$Q;
6585
+ var CalendarWrapper = styled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n display: block;\n position: relative;\n width: 100%;\n background: #fff;\n .calendar-scroll {\n overflow-x: scroll;\n }\n .days-body-wrapper, .days-header-wrapper {\n min-width: 900px;\n }\n"], ["\n display: block;\n position: relative;\n width: 100%;\n background: #fff;\n .calendar-scroll {\n overflow-x: scroll;\n }\n .days-body-wrapper, .days-header-wrapper {\n min-width: 900px;\n }\n"])));
6586
+ var templateObject_1$S;
5996
6587
 
5997
- var HeaderWrapper = styled(Row)(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n width: 100%;\n padding: 1.75em 0 !important;\n border-bottom: 1px solid #eee;\n background: #fff;\n font-weight: 700;\n font-size: 100%;\n"], ["\n width: 100%;\n padding: 1.75em 0 !important;\n border-bottom: 1px solid #eee;\n background: #fff;\n font-weight: 700;\n font-size: 100%;\n"])));
5998
- var templateObject_1$R;
6588
+ var HeaderWrapper = styled(Row)(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n width: 100%;\n padding: 1.75em 0 !important;\n border-bottom: 1px solid #eee;\n background: #fff;\n font-weight: 700;\n font-size: 100%;\n"], ["\n width: 100%;\n padding: 1.75em 0 !important;\n border-bottom: 1px solid #eee;\n background: #fff;\n font-weight: 700;\n font-size: 100%;\n"])));
6589
+ var templateObject_1$T;
5999
6590
 
6000
6591
  var DefaultCalendarFooter = function (_a) {
6001
6592
  var currentWeek = _a.currentWeek;
@@ -6028,7 +6619,7 @@ var TasksCalendarDayBody = function (_a) {
6028
6619
  React__default.createElement(CalendarTask, __assign({}, t, { date: undefined })))); })));
6029
6620
  };
6030
6621
 
6031
- var WeekNav = styled(Text)(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n display: inline-block;\n padding: 0;\n"], ["\n display: inline-block;\n padding: 0;\n"])));
6622
+ var WeekNav = styled(Text)(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n display: inline-block;\n padding: 0;\n"], ["\n display: inline-block;\n padding: 0;\n"])));
6032
6623
  var CalendarIconDatePicker = React__default.forwardRef(function (_a, ref) {
6033
6624
  var value = _a.value, onClick = _a.onClick;
6034
6625
  return (React__default.createElement("span", { ref: ref, onClick: onClick },
@@ -6101,7 +6692,7 @@ var TasksCalendarHeader = function (_a) {
6101
6692
  } }, "+ Add Task")
6102
6693
  : null)));
6103
6694
  };
6104
- var templateObject_1$S;
6695
+ var templateObject_1$U;
6105
6696
 
6106
6697
  var TasksCalendarFooter = function (_a) {
6107
6698
  var currentWeek = _a.currentWeek, _b = _a.tasks, tasks = _b === void 0 ? [] : _b;
@@ -6453,7 +7044,7 @@ var scrollbarWidth = function () {
6453
7044
  return scrollbarWidth;
6454
7045
  };
6455
7046
 
6456
- var SimpleWindowedTableStyles = styled.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\npadding: 1rem;\n\n.table-list-rows {\n width: 100% !important;\n\n ", "\n}\n\n.table {\n display: inline-block;\n border-spacing: 0;\n width: 100%;\n min-width: 100% !important;\n\n ", "\n\n .header.tr, .table-footer.tr {\n width: 100% !important;\n min-width: 100% !important;\n overflow-x: hidden;\n }\n\n .tr {\n :last-child {\n .td {\n border-bottom: 0;\n }\n }\n }\n\n .th {\n border-bottom: 2px solid ", ";\n\n div {\n display: inline-block;\n }\n }\n\n .td {\n border-bottom: 1px solid ", ";\n }\n\n /* set hover styles */\n ", "\n\n /* row selected => if selectedRowStyle === true then set background color else set given styles */\n ", "\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n }\n}\n"], ["\npadding: 1rem;\n\n.table-list-rows {\n width: 100% !important;\n\n ", "\n}\n\n.table {\n display: inline-block;\n border-spacing: 0;\n width: 100%;\n min-width: 100% !important;\n\n ", "\n\n .header.tr, .table-footer.tr {\n width: 100% !important;\n min-width: 100% !important;\n overflow-x: hidden;\n }\n\n .tr {\n :last-child {\n .td {\n border-bottom: 0;\n }\n }\n }\n\n .th {\n border-bottom: 2px solid ", ";\n\n div {\n display: inline-block;\n }\n }\n\n .td {\n border-bottom: 1px solid ", ";\n }\n\n /* set hover styles */\n ", "\n\n /* row selected => if selectedRowStyle === true then set background color else set given styles */\n ", "\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n }\n}\n"])), function (p) { return p.rowClickable ? "\n .tr {\n cursor: pointer;\n }\n " : ''; }, function (p) { return p.bordered ?
7047
+ var SimpleWindowedTableStyles = styled.div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\npadding: 1rem;\n\n.table-list-rows {\n width: 100% !important;\n\n ", "\n}\n\n.table {\n display: inline-block;\n border-spacing: 0;\n width: 100%;\n min-width: 100% !important;\n\n ", "\n\n .header.tr, .table-footer.tr {\n width: 100% !important;\n min-width: 100% !important;\n overflow-x: hidden;\n }\n\n .tr {\n :last-child {\n .td {\n border-bottom: 0;\n }\n }\n }\n\n .th {\n border-bottom: 2px solid ", ";\n\n div {\n display: inline-block;\n }\n }\n\n .td {\n border-bottom: 1px solid ", ";\n }\n\n /* set hover styles */\n ", "\n\n /* row selected => if selectedRowStyle === true then set background color else set given styles */\n ", "\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n }\n}\n"], ["\npadding: 1rem;\n\n.table-list-rows {\n width: 100% !important;\n\n ", "\n}\n\n.table {\n display: inline-block;\n border-spacing: 0;\n width: 100%;\n min-width: 100% !important;\n\n ", "\n\n .header.tr, .table-footer.tr {\n width: 100% !important;\n min-width: 100% !important;\n overflow-x: hidden;\n }\n\n .tr {\n :last-child {\n .td {\n border-bottom: 0;\n }\n }\n }\n\n .th {\n border-bottom: 2px solid ", ";\n\n div {\n display: inline-block;\n }\n }\n\n .td {\n border-bottom: 1px solid ", ";\n }\n\n /* set hover styles */\n ", "\n\n /* row selected => if selectedRowStyle === true then set background color else set given styles */\n ", "\n\n .th,\n .td {\n margin: 0;\n padding: 0.5rem;\n }\n}\n"])), function (p) { return p.rowClickable ? "\n .tr {\n cursor: pointer;\n }\n " : ''; }, function (p) { return p.bordered ?
6457
7048
  "border: ".concat(typeof p.bordered === 'string'
6458
7049
  ? p.bordered
6459
7050
  : "1px solid ".concat(getThemeColor(p, 'tableBorder', '#edf2f5')), ";")
@@ -6534,7 +7125,7 @@ function SimpleWindowedTable(_a) {
6534
7125
  React__default.createElement("div", __assign({}, getTableBodyProps()), rows.length === 0 && NoRowsFound ? React__default.createElement(NoRowsFound, null) : React__default.createElement(FixedSizeList, { height: height, itemCount: rows.length, itemSize: itemSize, width: totalColumnsWidth + scrollBarSize, className: "table-list-rows", outerRef: rowsRef, onScroll: onScroll, useIsScrolling: true }, RenderRow)),
6535
7126
  !hideFooter ? React__default.createElement("div", __assign({}, tableFooterProps, { className: "table-footer-wrapper ".concat(tableFooterProps.className || '') }), footerGroups.map(function (footerGroup) { return (React__default.createElement("div", __assign({}, getHeaderGroupProps(footerGroup, true), { className: "table-footer tr", ref: footerRef }), footerGroup.headers.map(function (column) { return (React__default.createElement("div", __assign({}, getHeaderProps(column, true)), column.render("Footer"))); }))); })) : null));
6536
7127
  }
6537
- var templateObject_1$T;
7128
+ var templateObject_1$V;
6538
7129
 
6539
- export { AddIcon, AddNoteIcon, AddTaskIcon, AlertIcon, AlertNotification, ArrowIcon, Artwork, SKUAsyncSelect as AsyncSelect, Avatar, AwaitingProofIcon, Backdrop, Background, Badge, BotIcon, Box, BulletIcon, Button, ButtonsGroup, Calendar, CalendarDayBody, CalendarDaysBody, CalendarDaysHeader, CalendarIcon, CalendarTask, CalendarWrapper, CancelButton, ChangeRequestedIcon, ChatIcon, CheckMark, CheckboxIcon, CheckboxLabel, CheckmarkIcon, ChevronIcon, CircleProgressIcon, ClientApprovedIcon, ClipboardIcon, ClockIcon, Col, CollapseStyled, CollapseWrapper, Collapsible, CollapsiblePanel, CollapsiblePanelTitle, CollapsiblePanels, ColumnSelectIcon, CommentIcon, CompletedCheckmarkIcon, CouponIcon, SKUCreatableSelect as CreatableSelect, CreditCardIcon, CustomDateInput, Datepicker, DaysBodyWrapper, DaysHeaderWrapper, DefaultCalendarFooter, DefaultCalendarHeader, DefaultStar, DollarIcon, DoneButton, Dot, DownloadIcon, DraggableTasksCalendar, DropArea, DropDownContent, Dropdown, DropdownItem, Dropzoned, DropzonedPreviews, EditIcon, EllipsisIcon, EpsIcon, ErrorBoundary, EstimateCircleIcon, EyeIcon, FeedPost, FilledChevronIcon, FolderIcon, GalleryIcon, GearIcon, GlobalStyle, Grid, GridIcon, H1, H2, H3, H4, H5, H6, HeaderWrapper, HeadlessTable, HistoryIcon, IconButton, IconDoc, InfoIcon, Input, InputIconLabel, InputIconLabelContainer, InputStepper, IntegrationsIcon, Label, LabeledAsyncSelect, LabeledCheckbox, LabeledCreatableSelect, LabeledIconInput, LabeledInput, LabeledMultiProgress, LabeledProgress, LabeledRadio, LabeledRadioGroup, LabeledRadioInButton, LabeledRadioInButtonGroup, LabeledSelect, LabeledTextarea, LightIndicator, Link, LinkWithIcon, ListIcon, Loading, LockIcon, MailIcon, MarketingStatusIcon, MenuIcon, MultiProgress, NavConnectIcon, NavFinanceIcon, NavManagementIcon, NavProdIcon, NavResourcesIcon, NavSalesIcon, NoteIcon, Number$1 as Number, NumberInput, OpportunityCircleIcon, Overlay, Padding, Page, PanelContact, PanelTileContact, PendingApprovalIcon, PercentIcon, PinIcon, Popup, PopupHeader, PresentationCircleIcon, Product, Progress, PromostandardsIcon, ProofReceivedIcon, ProofingCompleteIcon, Publisher, Radio, RadioIcon, RadioLabel, ReceiptLongIcon, ResponsiveTable, Row, SHARED_STYLE_MAPS, SalesArrowIcon, SalesOrderCircleIcon, SearchIcon, SKUSelect as Select, SharedStyles, ShopIcon, ShowPopup, SidePanel, SimpleWindowedTable, SimpleWindowedTableStyles, SizerCss, SizerWrapper, Sparkles, Spinner, StarIcon, StarRating, StateDropdown, StatusDropdown, StyledCalendarTaskBody, StyledDayBody, StyledDayText, StyledDropArea, StyledDropdown, StyledPanel, StyledTask, SubtractIcon, SVG as SvgIcon, TBody, TD, TH, THSorted, THead, TR, Tab, TabBar, Table, TableIcon, Tabs, TargetIcon, Task, TaskBody, TaskIcon, TaskLabel, TaskName, TasksCalendar, TasksCalendarDayBody, TasksCalendarFooter, TasksCalendarHeader, TemplateIcon, Text, Textarea, Theme, Thermometer, TilesIcon, Toggle, ToggleLink, TrashIcon, UserIcon, UsersIcon, VirtualTable, VirtualTableStyles, Wrapper, XIcon, colors, datepickerStyles, fontFamilies, fontStyles, fonts, getColor, getFontStyle, getThemeColor, getThemeFontFamily, getThemeFontSize, getThemeFontStyle, getThemeProperty, sizes$1 as sizes, themeOptions, toggleSizes };
7130
+ export { AddIcon, AddNoteIcon, AddTaskIcon, AlertIcon, AlertNotification, ArrowIcon, Artwork, SKUAsyncSelect as AsyncSelect, Avatar, AwaitingProofIcon, Backdrop, Background, Badge, BotIcon, Box, BulletIcon, Button, ButtonsGroup, Calendar, CalendarDayBody, CalendarDaysBody, CalendarDaysHeader, CalendarIcon, CalendarTask, CalendarWrapper, CancelButton, ChangeRequestedIcon, ChatIcon, CheckMark, CheckboxIcon, CheckboxLabel, CheckmarkIcon, ChevronIcon, CircleProgressIcon, ClientApprovedIcon, ClipboardIcon, ClockIcon, Col, CollapseStyled, CollapseWrapper, Collapsible, CollapsibleArrowIcon, CollapsibleLabel, CollapsiblePanel, CollapsiblePanelTitle, CollapsiblePanels, Collapsible$1 as CollapsibleV2, Collapsibles, Column, ColumnSelectIcon, CommentIcon, CompletedCheckmarkIcon, ConfirmPopup, CouponIcon, SKUCreatableSelect as CreatableSelect, CreditCardIcon, Csku, CustomDateInput, Datepicker, DaysBodyWrapper, DaysHeaderWrapper, DefaultCalendarFooter, DefaultCalendarHeader, DefaultStar, DollarIcon, DoneButton, Dot, DownloadIcon, DragIcon, DraggableTasksCalendar, DropArea, DropDownContent, Dropdown, DropdownItem, Dropzoned, DropzonedPreviews, EditIcon, EllipsisIcon, EpsIcon, ErrorBoundary, EstimateCircleIcon, EyeIcon, FeedPost, FilledChevronIcon, FolderIcon, GalleryIcon, GearIcon, GlobalStyle, Grid, GridCell, GridIcon, GridItem, GridRow, GridTable, GridTableContainer, H1, H2, H3, H4, H5, H6, HandleIcon, HeaderWrapper, HeadlessTable, HistoryIcon, IconButton, IconDoc, InfoIcon, Input, InputIconLabel, InputIconLabelContainer, InputStepper, IntegrationsIcon, Label, LabeledAsyncSelect, LabeledCheckbox, LabeledCreatableSelect, LabeledIconInput, LabeledInput, LabeledMultiProgress, LabeledProgress, LabeledRadio, LabeledRadioGroup, LabeledRadioInButton, LabeledRadioInButtonGroup, LabeledSelect, LabeledTextarea, LightIndicator, Link, LinkWithIcon, ListIcon, Loading, LockIcon, MailIcon, MarketingStatusIcon, MenuIcon, MultiProgress, NavConnectIcon, NavFinanceIcon, NavManagementIcon, NavProdIcon, NavResourcesIcon, NavSalesIcon, NoteIcon, Number$1 as Number, NumberInput, OpportunityCircleIcon, Overlay, Padding, Page, PanelContact, PanelTileContact, PendingApprovalIcon, PercentIcon, PinIcon, Popup, PopupHeader, PresentationCircleIcon, Product, Progress, PromostandardsIcon, ProofReceivedIcon, ProofingCompleteIcon, Publisher, Radio, RadioIcon, RadioLabel, ReceiptLongIcon, ResponsiveTable, Row, SHARED_STYLE_MAPS, SalesArrowIcon, SalesOrderCircleIcon, SearchIcon, SKUSelect as Select, SharedStyles, ShopIcon, ShowPopup, SidePanel, SimpleWindowedTable, SimpleWindowedTableStyles, SizerCss, SizerWrapper, Sparkles, Spinner, StarIcon, StarRating, StateDropdown, StatusDropdown, StyledCalendarTaskBody, StyledDayBody, StyledDayText, StyledDropArea, StyledDropdown, StyledPanel, StyledTask, SubtractIcon, SVG as SvgIcon, TBody, TD, TH, THSorted, THead, TR, Tab, TabBar, Table, TableIcon, Tabs, TargetIcon, Task, TaskBody, TaskIcon, TaskLabel, TaskName, TasksCalendar, TasksCalendarDayBody, TasksCalendarFooter, TasksCalendarHeader, TemplateIcon, Text, Textarea, Theme, Thermometer, TilesIcon, Toggle, ToggleLink, TrashIcon, UserIcon, UsersIcon, VirtualTable, VirtualTableStyles, Wrapper, XIcon, colors, createMeasurementStyle, datepickerStyles, fontFamilies, fontStyles, fonts, getColor, getFontStyle, getThemeColor, getThemeFontFamily, getThemeFontSize, getThemeFontStyle, getThemeProperty, parseCskuStyles, sizes$1 as sizes, themeOptions, toggleSizes };
6540
7131
  //# sourceMappingURL=index.es.js.map