@fattureincloud/fic-design-system 0.3.19 → 0.3.20

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 (35) hide show
  1. package/dist/components/buttons/button/styled.d.ts +2 -2
  2. package/dist/components/dropdown/components/Item.d.ts +1 -1
  3. package/dist/components/form/inputHelper/InputHelper.d.ts +2 -2
  4. package/dist/components/form/select/Select.d.ts +6 -0
  5. package/dist/components/form/select/SelectInputParts.d.ts +13 -0
  6. package/dist/components/form/select/SelectWrapper.d.ts +12 -0
  7. package/dist/components/form/select/components/ClearIndicator.d.ts +3 -0
  8. package/dist/components/form/select/components/Control.d.ts +3 -0
  9. package/dist/components/form/select/components/DropdownIndicator.d.ts +3 -0
  10. package/dist/components/form/select/components/FooterActions.d.ts +11 -0
  11. package/dist/components/form/select/components/MenuList.d.ts +3 -0
  12. package/dist/components/form/select/components/Option.d.ts +14 -0
  13. package/dist/components/form/select/components/Placeholder.d.ts +3 -0
  14. package/dist/components/form/select/components/types.d.ts +10 -0
  15. package/dist/components/form/select/components.d.ts +2 -0
  16. package/dist/components/form/select/hooks/useSelectThemeStyles.d.ts +13 -0
  17. package/dist/components/form/select/index.d.ts +5 -0
  18. package/dist/components/form/select/originalComponents.d.ts +6 -0
  19. package/dist/components/form/select/select.stories.d.ts +1 -0
  20. package/dist/components/form/select/selectPalette.d.ts +16 -0
  21. package/dist/components/form/select/types.d.ts +12 -0
  22. package/dist/components/form/select/utils.d.ts +7 -0
  23. package/dist/components/form/textArea/components/CharCounter.d.ts +9 -0
  24. package/dist/components/form/textArea/components/TextAreaElement.d.ts +2 -2
  25. package/dist/components/form/textArea/types.d.ts +6 -3
  26. package/dist/components/icon/Icon.d.ts +1 -0
  27. package/dist/components/icon/utils.d.ts +2 -2
  28. package/dist/components/tabs/common/Item.d.ts +2 -2
  29. package/dist/index.d.ts +2 -2
  30. package/dist/index.esm.js +391 -255
  31. package/dist/index.esm.js.map +1 -0
  32. package/dist/index.js +391 -253
  33. package/dist/index.js.map +1 -0
  34. package/dist/styles/theme.d.ts +2 -0
  35. package/package.json +10 -7
package/dist/index.js CHANGED
@@ -14,12 +14,14 @@ var proRegularSvgIcons = require('@fortawesome/pro-regular-svg-icons');
14
14
  var reactPopper = require('react-popper');
15
15
  var reactTransitionGroup = require('react-transition-group');
16
16
  var reactUse = require('react-use');
17
+ var ReactSelect = require('react-select');
18
+ var ReactSelect__default = _interopDefault(ReactSelect);
19
+ var Async = _interopDefault(require('react-select/async'));
20
+ var AsyncCreatable = _interopDefault(require('react-select/async-creatable'));
21
+ var Creatable = _interopDefault(require('react-select/creatable'));
17
22
  var proLightSvgIcons = require('@fortawesome/pro-light-svg-icons');
18
23
  var ReactModal = _interopDefault(require('react-modal'));
19
24
  var range = _interopDefault(require('lodash/range'));
20
- var ReactSelect = _interopDefault(require('react-select'));
21
- var AsyncSelect = _interopDefault(require('react-select/async'));
22
- var CreatableSelect = _interopDefault(require('react-select/creatable'));
23
25
  var _ = _interopDefault(require('lodash'));
24
26
  var reactBeautifulDnd = require('react-beautiful-dnd');
25
27
  var proDuotoneSvgIcons = require('@fortawesome/pro-duotone-svg-icons');
@@ -313,12 +315,12 @@ var getIconStyles = function (_a) {
313
315
 
314
316
  var Icon = function (_a) {
315
317
  var onClick = _a.onClick, isDisabled = _a.isDisabled, props = __rest(_a, ["onClick", "isDisabled"]);
316
- var handleClick = React.useCallback(function (e) { return !isDisabled && (onClick === null || onClick === void 0 ? void 0 : onClick(e)); }, [isDisabled, onClick]);
318
+ var handleClick = React.useMemo(function () { return (isDisabled || !onClick ? undefined : function (e) { return onClick(e); }); }, [isDisabled, onClick]);
317
319
  return React__default.createElement(StyledIcon, __assign({}, props, { onClick: handleClick }));
318
320
  };
319
321
  var StyledIcon = styled__default(reactFontawesome.FontAwesomeIcon).attrs(getIconStyles)(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n cursor: ", ";\n color: ", ";\n --fa-secondary-color: ", ";\n"], ["\n cursor: ", ";\n color: ", ";\n --fa-secondary-color: ", ";\n"])), function (_a) {
320
- var onClick = _a.onClick, isDisabled = _a.isDisabled;
321
- return (!isDisabled && onClick ? 'pointer' : 'inherit');
322
+ var onClick = _a.onClick;
323
+ return (onClick ? 'pointer' : 'inherit');
322
324
  }, function (_a) {
323
325
  var primary = _a.primary;
324
326
  return primary;
@@ -343,10 +345,7 @@ var iconPalette = {
343
345
  fuchsia: getColoredIcon('fuchsia'),
344
346
  indigo: getColoredIcon('indigo'),
345
347
  pink: getColoredIcon('pink'),
346
- grey: {
347
- primary: defaultPalette.grey[500],
348
- secondary: defaultPalette.grey[200],
349
- },
348
+ grey: getColoredIcon('grey'),
350
349
  white: {
351
350
  primary: defaultPalette.white[100],
352
351
  secondary: defaultPalette.white[48],
@@ -593,7 +592,7 @@ var Button = function (_a) {
593
592
  var className = _a.className, color = _a.color, _b = _a.fullWidth, fullWidth = _b === void 0 ? false : _b, href = _a.href, iconLeft = _a.iconLeft, iconRight = _a.iconRight, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isLoading, isLoading = _d === void 0 ? false : _d, onClick = _a.onClick, size = _a.size, target = _a.target, text = _a.text, type = _a.type;
594
593
  var debounceClick = useDebounceClick({ onClick: onClick, manualLock: isLoading || isDisabled });
595
594
  var showLoading = !isDisabled && isLoading;
596
- var Wrapper = href ? HrefWrapper : OnClickWrapper;
595
+ var Wrapper = React.useCallback(function (props) { return (href ? React__default.createElement(HrefWrapper, __assign({}, props)) : React__default.createElement(OnClickWrapper, __assign({}, props))); }, [href]);
597
596
  return (React__default.createElement(Wrapper, { className: className, size: size, color: color, onClick: debounceClick, href: href, type: type, isDisabled: isDisabled, fullWidth: fullWidth, target: target },
598
597
  React__default.createElement(Content$1, { isLoading: showLoading },
599
598
  iconLeft && React__default.createElement(LeftIcon, __assign({}, iconLeft)),
@@ -1399,7 +1398,7 @@ var inputHelperPalette = {
1399
1398
  },
1400
1399
  };
1401
1400
 
1402
- var ComplexInputWrapper = styled__default.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n margin-bottom: 1em;\n"], ["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n margin-bottom: 1em;\n"])));
1401
+ var ComplexInputWrapper = styled__default.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"], ["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"])));
1403
1402
  var templateObject_1$o;
1404
1403
 
1405
1404
  var inputTextHTMLLabelBootstrapFixes = styled.css(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"], ["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"])));
@@ -1573,14 +1572,220 @@ var inputTextPalette = {
1573
1572
  },
1574
1573
  };
1575
1574
 
1576
- var inputTextHTMLTextAreaBootstrapFixes = styled.css(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px !important;\n"], ["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px !important;\n"])));
1575
+ var ClearIndicator = function (_a) {
1576
+ var isDisabled = _a.isDisabled, clearValue = _a.clearValue;
1577
+ var onClick = React.useCallback(function () { return !isDisabled && clearValue(); }, [clearValue, isDisabled]);
1578
+ return React__default.createElement(CaretIcon, { icon: proLightSvgIcons.faTimes, onClick: onClick });
1579
+ };
1580
+ var CaretIcon = styled__default(Icon)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n margin: 0.5em;\n"], ["\n margin: 0.5em;\n"])));
1577
1581
  var templateObject_1$w;
1578
1582
 
1579
- var StyledTextArea = styled__default.textarea(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n resize: none;\n\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n\n border: 0;\n padding: 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"], ["\n resize: none;\n\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n\n border: 0;\n padding: 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"])), function (_a) {
1583
+ var Control = function (_a) {
1584
+ var onMouseDown = _a.innerProps.onMouseDown, children = _a.children;
1585
+ return (React__default.createElement(Wrapper$7, { onMouseDown: onMouseDown }, children));
1586
+ };
1587
+ var Wrapper$7 = styled__default.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"], ["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"])));
1588
+ var templateObject_1$x;
1589
+
1590
+ var DropdownIndicator = function (_a) {
1591
+ var selectProps = _a.selectProps;
1592
+ return (React__default.createElement(Wrapper$8, { isRotated: selectProps.menuIsOpen },
1593
+ React__default.createElement(Icon, { icon: proSolidSvgIcons.faCaretDown })));
1594
+ };
1595
+ var Wrapper$8 = styled__default.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(", "deg);\n"], ["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(", "deg);\n"])), function (_a) {
1596
+ var isRotated = _a.isRotated;
1597
+ return (isRotated ? 180 : 0);
1598
+ });
1599
+ var templateObject_1$y;
1600
+
1601
+ var FooterActions = function (_a) {
1602
+ var actions = _a.actions, triggerClose = _a.triggerClose;
1603
+ var mappedActions = React.useMemo(function () {
1604
+ return actions.map(function (_a, id) {
1605
+ var onClick = _a.onClick, closeOnClick = _a.closeOnClick, rest = __rest(_a, ["onClick", "closeOnClick"]);
1606
+ return (React__default.createElement(FooterItem, __assign({ key: id, onClick: function (e) {
1607
+ e.stopPropagation();
1608
+ onClick === null || onClick === void 0 ? void 0 : onClick(e);
1609
+ closeOnClick && triggerClose();
1610
+ } }, rest)));
1611
+ });
1612
+ }, [actions]);
1613
+ return React__default.createElement(Wrapper$9, null, mappedActions);
1614
+ };
1615
+ var Wrapper$9 = styled__default.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n border-top: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n"])), function (_a) {
1616
+ var theme = _a.theme;
1617
+ return theme.palette.grey[100];
1618
+ });
1619
+ var FooterItem = styled__default(Item)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n padding: 5px 10px;\n"], ["\n padding: 5px 10px;\n"])));
1620
+ var templateObject_1$z, templateObject_2$e;
1621
+
1622
+ var MenuList = function (props) {
1623
+ var setValue = props.setValue, getValue = props.getValue, selectProps = props.selectProps;
1624
+ var children = props.children, rest = __rest(props, ["children"]);
1625
+ var footerActions = selectProps.footerActions;
1626
+ var List = ReactSelect.components.MenuList;
1627
+ var triggerClose = React.useCallback(function () { return setValue(getValue(), 'select-option'); }, [getValue, setValue]);
1628
+ return (React__default.createElement(Wrapper$a, null,
1629
+ React__default.createElement(List, __assign({}, rest),
1630
+ children,
1631
+ footerActions && React__default.createElement(FooterActions, { actions: footerActions, triggerClose: triggerClose }))));
1632
+ };
1633
+ var Wrapper$a = styled__default.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject([""], [""])));
1634
+ var templateObject_1$A;
1635
+
1636
+ var Option = function (_a) {
1637
+ var onClick = _a.innerProps.onClick, _b = _a.data, label = _b.label, icon = _b.icon;
1638
+ return (React__default.createElement(Wrapper$b, { onClick: onClick },
1639
+ icon && React__default.createElement(Icon, __assign({}, icon)),
1640
+ React__default.createElement("div", null, label)));
1641
+ };
1642
+ var Wrapper$b = styled__default.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ", ";\n }\n"], ["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ", ";\n }\n"])), function (_a) {
1643
+ var theme = _a.theme;
1644
+ return theme.palette.grey[100];
1645
+ });
1646
+ var templateObject_1$B;
1647
+
1648
+ var Placeholder = function (_a) {
1649
+ var children = _a.children;
1650
+ return React__default.createElement(Wrapper$c, null, children);
1651
+ };
1652
+ var Wrapper$c = styled__default.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n font-size: 14px;\n color: ", ";\n"], ["\n font-size: 14px;\n color: ", ";\n"])), function (_a) {
1653
+ var theme = _a.theme;
1654
+ return theme.palette.grey[200];
1655
+ });
1656
+ var templateObject_1$C;
1657
+
1658
+ var customComponents = {
1659
+ Option: Option,
1660
+ DropdownIndicator: DropdownIndicator,
1661
+ ClearIndicator: ClearIndicator,
1662
+ Placeholder: Placeholder,
1663
+ Control: Control,
1664
+ MenuList: MenuList,
1665
+ };
1666
+
1667
+ var getSelectStyles = function (_a) {
1668
+ var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
1669
+ var actualStatus = isDisabled ? 'disabled' : status;
1670
+ var styles = theme.components.select[actualStatus];
1671
+ return __assign(__assign({}, styles), { normalFocused: theme.components.select['normalFocused'] });
1672
+ };
1673
+
1674
+ var useSelectThemeStyles = function (_a) {
1675
+ var status = _a.status, isDisabled = _a.isDisabled;
1676
+ var theme = styled.useTheme();
1677
+ var color = getSelectStyles({ theme: theme, status: status, isDisabled: isDisabled }).color;
1678
+ return {
1679
+ singleValue: function (provided) { return (__assign(__assign({}, provided), { color: color, fontSize: '14px' })); },
1680
+ noOptionsMessage: function (base) { return (__assign(__assign({}, base), { fontSize: '14px' })); },
1681
+ };
1682
+ };
1683
+
1684
+ var SelectWrapper = styled__default.span.attrs(getSelectStyles)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n & > div:first-child {\n ", ";\n & > div:nth-child(2) {\n height: ", "px;\n min-height: ", "px;\n }\n }\n"], ["\n & > div:first-child {\n ", ";\n & > div:nth-child(2) {\n height: ", "px;\n min-height: ", "px;\n }\n }\n"])), boxedInputWrapperStyle, function (_a) {
1685
+ var inputSize = _a.inputSize;
1686
+ return (inputSize === 'large' ? 40 : 30);
1687
+ }, function (_a) {
1688
+ var inputSize = _a.inputSize;
1689
+ return (inputSize === 'large' ? 40 : 30);
1690
+ });
1691
+ var templateObject_1$D;
1692
+
1693
+ var SelectsWrapper = function (_a) {
1694
+ var children = _a.children, rest = __rest(_a, ["children"]);
1695
+ var label = rest.label, isDisabled = rest.isDisabled, required = rest.required, helper = rest.helper, _b = rest.status, status = _b === void 0 ? 'normal' : _b, inputSize = rest.inputSize;
1696
+ return (React__default.createElement(ComplexInputWrapper, null,
1697
+ React__default.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
1698
+ React__default.createElement(SelectWrapper, { isDisabled: isDisabled, status: status, inputSize: inputSize }, children),
1699
+ helper && React__default.createElement(InputHelper, __assign({}, helper))));
1700
+ };
1701
+ var Select = function (props) {
1702
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1703
+ var styles = useSelectThemeStyles({ status: status });
1704
+ var customComponents$1 = React.useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
1705
+ return (React__default.createElement(SelectsWrapper, null,
1706
+ React__default.createElement(ReactSelect__default, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
1707
+ };
1708
+ var CreatableSelect = function (props) {
1709
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1710
+ var styles = useSelectThemeStyles({ status: status });
1711
+ var customComponents$1 = React.useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
1712
+ return (React__default.createElement(SelectsWrapper, null,
1713
+ React__default.createElement(Creatable, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
1714
+ };
1715
+ var AsyncSelect = function (props) {
1716
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1717
+ var styles = useSelectThemeStyles({ status: status });
1718
+ var customComponents$1 = React.useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
1719
+ return (React__default.createElement(SelectsWrapper, null,
1720
+ React__default.createElement(Async, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
1721
+ };
1722
+ var AsyncCreatableSelect = function (props) {
1723
+ var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
1724
+ var styles = useSelectThemeStyles({ status: status });
1725
+ var customComponents$1 = React.useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
1726
+ return (React__default.createElement(SelectsWrapper, null,
1727
+ React__default.createElement(AsyncCreatable, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
1728
+ };
1729
+
1730
+ var selectPalette = {
1731
+ normal: {
1732
+ background: defaultPalette.white[100],
1733
+ color: defaultPalette.black[100],
1734
+ iconColor: defaultPalette.black[100],
1735
+ borderColor: defaultPalette.grey[500],
1736
+ },
1737
+ normalFocused: {
1738
+ background: defaultPalette.white[100],
1739
+ color: defaultPalette.black[100],
1740
+ iconColor: defaultPalette.black[100],
1741
+ borderColor: defaultPalette.blue[300],
1742
+ },
1743
+ success: {
1744
+ background: defaultPalette.green[50],
1745
+ color: defaultPalette.black[100],
1746
+ iconColor: defaultPalette.green[900],
1747
+ borderColor: defaultPalette.green[300],
1748
+ },
1749
+ warning: {
1750
+ background: defaultPalette.yellow[50],
1751
+ color: defaultPalette.black[100],
1752
+ iconColor: defaultPalette.yellow[900],
1753
+ borderColor: defaultPalette.yellow[300],
1754
+ },
1755
+ error: {
1756
+ background: defaultPalette.red[50],
1757
+ color: defaultPalette.black[100],
1758
+ iconColor: defaultPalette.red[900],
1759
+ borderColor: defaultPalette.red[300],
1760
+ },
1761
+ disabled: {
1762
+ background: defaultPalette.grey[100],
1763
+ color: defaultPalette.black[16],
1764
+ iconColor: defaultPalette.black[16],
1765
+ borderColor: 'transparent',
1766
+ },
1767
+ };
1768
+
1769
+ var CharCounter = function (_a) {
1770
+ var length = _a.length, maxLength = _a.maxLength;
1771
+ return (React__default.createElement(Wrapper$d, null,
1772
+ length,
1773
+ maxLength && "/" + maxLength));
1774
+ };
1775
+ var Wrapper$d = styled__default.div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n text-align: right;\n color: ", ";\n padding: 0.3em;\n"], ["\n text-align: right;\n color: ", ";\n padding: 0.3em;\n"])), function (_a) {
1776
+ var theme = _a.theme;
1777
+ return theme.palette.grey[500];
1778
+ });
1779
+ var templateObject_1$E;
1780
+
1781
+ var inputTextHTMLTextAreaBootstrapFixes = styled.css(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px 0 0 8px !important;\n height: 100% !important;\n"], ["\n font-weight: 400 !important;\n margin: 0 !important;\n font-size: 14px !important;\n line-height: normal !important;\n vertical-align: baseline !important;\n background: transparent !important;\n box-shadow: none !important;\n border: 0 !important;\n display: block !important;\n color: black !important;\n padding: 8px 0 0 8px !important;\n height: 100% !important;\n"])));
1782
+ var templateObject_1$F;
1783
+
1784
+ var StyledTextArea = styled__default.textarea(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n resize: none;\n\n margin: 0;\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n border: 0;\n padding: 8px 0 0 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"], ["\n resize: none;\n\n margin: 0;\n background: transparent;\n font-size: 14px;\n font-family: inherit;\n border: 0;\n padding: 8px 0 0 8px;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n &::placeholder {\n color: ", ";\n }\n\n outline: none;\n\n /* Bootstrap Fixes */\n ", "\n"])), function (_a) {
1580
1785
  var theme = _a.theme;
1581
1786
  return theme.palette.grey[200];
1582
1787
  }, inputTextHTMLTextAreaBootstrapFixes);
1583
- var templateObject_1$x;
1788
+ var templateObject_1$G;
1584
1789
 
1585
1790
  var getTextAreaStyles = function (_a) {
1586
1791
  var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
@@ -1590,31 +1795,40 @@ var getTextAreaStyles = function (_a) {
1590
1795
  };
1591
1796
 
1592
1797
  var TextAreaElement = function (_a) {
1593
- var autoFocus = _a.autoFocus, onBlur = _a.onBlur, onChange = _a.onChange, _b = _a.value, value = _b === void 0 ? '' : _b, placeholder = _a.placeholder, isDisabled = _a.isDisabled, name = _a.name, onKeyPress = _a.onKeyPress, _c = _a.status, status = _c === void 0 ? 'normal' : _c, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, onFocus = _a.onFocus, className = _a.className, setValue = _a.setValue, _d = _a.initialHeight, initialHeight = _d === void 0 ? '10rem' : _d;
1798
+ var autoFocus = _a.autoFocus, onBlur = _a.onBlur, onChange = _a.onChange, _b = _a.value, value = _b === void 0 ? '' : _b, placeholder = _a.placeholder, isDisabled = _a.isDisabled, name = _a.name, onKeyPress = _a.onKeyPress, _c = _a.status, status = _c === void 0 ? 'normal' : _c, onKeyDown = _a.onKeyDown, onKeyUp = _a.onKeyUp, onFocus = _a.onFocus, className = _a.className, setValue = _a.setValue, _d = _a.initialHeight, initialHeight = _d === void 0 ? '10rem' : _d, maxLength = _a.maxLength, _e = _a.isResizable, isResizable = _e === void 0 ? false : _e, _f = _a.showCounter, showCounter = _f === void 0 ? false : _f;
1594
1799
  var ref = React.useRef(null);
1595
1800
  var onClick = React.useCallback(function () { var _a; return (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
1596
1801
  var actualValue = (value === null || value === void 0 ? void 0 : value.toString()) || '';
1597
1802
  var handleChange = React.useCallback(function (e) {
1598
- setValue === null || setValue === void 0 ? void 0 : setValue(e.currentTarget.value);
1803
+ setValue === null || setValue === void 0 ? void 0 : setValue(e.currentTarget.value.slice(0, maxLength || Infinity));
1599
1804
  onChange === null || onChange === void 0 ? void 0 : onChange(e);
1600
- }, [onChange, setValue]);
1805
+ }, [maxLength, onChange, setValue]);
1806
+ React.useEffect(function () {
1807
+ setValue === null || setValue === void 0 ? void 0 : setValue(value === null || value === void 0 ? void 0 : value.slice(0, maxLength || Infinity));
1808
+ }, [maxLength, setValue, value]);
1601
1809
  var handleBlur = React.useCallback(function (e) {
1602
1810
  setValue === null || setValue === void 0 ? void 0 : setValue(e.target.value.trim());
1603
1811
  onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
1604
1812
  }, [onBlur, setValue]);
1605
- return (React__default.createElement(Wrapper$7, { onClick: onClick, isDisabled: isDisabled, status: status, className: className, initialHeight: initialHeight },
1606
- React__default.createElement(StyledTextArea, { ref: ref, autoFocus: autoFocus, value: actualValue, placeholder: placeholder, disabled: isDisabled, name: name, onChange: handleChange, onFocus: onFocus, onBlur: handleBlur, onKeyPress: onKeyPress, onKeyDown: onKeyDown, onKeyUp: onKeyUp })));
1813
+ return (React__default.createElement(Wrapper$e, { onClick: onClick, isDisabled: isDisabled, status: status, className: className, initialHeight: initialHeight, isResizable: isResizable },
1814
+ React__default.createElement(FlexWrapper, null,
1815
+ React__default.createElement(StyledTextArea, { ref: ref, autoFocus: autoFocus, value: actualValue, placeholder: placeholder, disabled: isDisabled, name: name, onChange: handleChange, onFocus: onFocus, onBlur: handleBlur, onKeyPress: onKeyPress, onKeyDown: onKeyDown, onKeyUp: onKeyUp }),
1816
+ (showCounter || maxLength) && React__default.createElement(CharCounter, { length: actualValue.length, maxLength: maxLength }))));
1607
1817
  };
1608
- var Wrapper$7 = styled__default.div.attrs(getTextAreaStyles)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n ", ";\n\n resize: vertical;\n overflow: hidden;\n\n min-height: 50px;\n\n height: ", ";\n"], ["\n ", ";\n\n resize: vertical;\n overflow: hidden;\n\n min-height: 50px;\n\n height: ", ";\n"])), boxedInputWrapperStyle, function (_a) {
1818
+ var FlexWrapper = styled__default.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n height: 100%;\n"], ["\n display: flex;\n flex-flow: column;\n height: 100%;\n"])));
1819
+ var Wrapper$e = styled__default.div.attrs(getTextAreaStyles)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n ", ";\n\n resize: ", ";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ", ";\n"], ["\n ", ";\n\n resize: ", ";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ", ";\n"])), boxedInputWrapperStyle, function (_a) {
1820
+ var isResizable = _a.isResizable;
1821
+ return (isResizable ? 'vertical' : 'none');
1822
+ }, function (_a) {
1609
1823
  var initialHeight = _a.initialHeight;
1610
1824
  return initialHeight;
1611
1825
  });
1612
- var templateObject_1$y;
1826
+ var templateObject_1$H, templateObject_2$f;
1613
1827
 
1614
1828
  var TextArea = function (props) {
1615
- var label = props.label, inputProps = __rest(props, ["label"]);
1829
+ var label = props.label, className = props.className, inputProps = __rest(props, ["label", "className"]);
1616
1830
  var isDisabled = props.isDisabled, required = props.required, helper = props.helper;
1617
- return (React__default.createElement(ComplexInputWrapper, null,
1831
+ return (React__default.createElement(ComplexInputWrapper, { className: className },
1618
1832
  React__default.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
1619
1833
  React__default.createElement(TextAreaElement, __assign({}, inputProps)),
1620
1834
  helper && React__default.createElement(InputHelper, __assign({}, helper))));
@@ -1728,11 +1942,11 @@ var ItemElement = function (props) {
1728
1942
  removeEventListener('keydown', handleKeyDown);
1729
1943
  }, showActionOnHover: showActionOnHover, "data-grouped-list-item": index },
1730
1944
  icon && React__default.createElement(LeftIcon$1, __assign({}, icon, { fixedWidth: true })),
1731
- title ? React__default.createElement(Title$1, null, title) : React__default.createElement(Placeholder, null, placeholder),
1945
+ title ? React__default.createElement(Title$1, null, title) : React__default.createElement(Placeholder$1, null, placeholder),
1732
1946
  action && React__default.createElement(RightElement, null, action)));
1733
1947
  };
1734
- var Title$1 = styled__default.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"], ["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"])));
1735
- var Placeholder = styled__default(Title$1)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
1948
+ var Title$1 = styled__default.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"], ["\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n"])));
1949
+ var Placeholder$1 = styled__default(Title$1)(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
1736
1950
  var theme = _a.theme;
1737
1951
  return theme.palette.grey[500];
1738
1952
  });
@@ -1759,7 +1973,7 @@ var SingleElement = styled__default.div(templateObject_7$3 || (templateObject_7$
1759
1973
  return showActionOnHover
1760
1974
  ? styled.css(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n ", " {\n display: none;\n }\n\n &:focus {\n ", " {\n display: inherit;\n }\n }\n "], ["\n ", " {\n display: none;\n }\n\n &:focus {\n ", " {\n display: inherit;\n }\n }\n "])), RightElement, RightElement) : styled.css(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject([""], [""])));
1761
1975
  });
1762
- var templateObject_1$z, templateObject_2$e, templateObject_3$9, templateObject_4$5, templateObject_5$3, templateObject_6$3, templateObject_7$3;
1976
+ var templateObject_1$I, templateObject_2$g, templateObject_3$9, templateObject_4$5, templateObject_5$3, templateObject_6$3, templateObject_7$3;
1763
1977
 
1764
1978
  var TitleElement = function (props) {
1765
1979
  var noResults = props.noResults, title = props.title;
@@ -1767,11 +1981,11 @@ var TitleElement = function (props) {
1767
1981
  title.toUpperCase(),
1768
1982
  noResults && React__default.createElement(NoResultsWrapper, null, "(nessun risultato)")));
1769
1983
  };
1770
- var TitleElementWrapper = styled__default.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ", ";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ", ";\n font-weight: 500;\n cursor: initial;\n"], ["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ",
1984
+ var TitleElementWrapper = styled__default.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ", ";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ", ";\n font-weight: 500;\n cursor: initial;\n"], ["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ",
1771
1985
  ";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ", ";\n font-weight: 500;\n cursor: initial;\n"])), function (_a) {
1772
1986
  var noResults = _a.noResults, theme = _a.theme;
1773
1987
  return noResults === true
1774
- ? styled.css(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), theme.palette.grey[50]) : undefined;
1988
+ ? styled.css(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), theme.palette.grey[50]) : undefined;
1775
1989
  }, function (_a) {
1776
1990
  var theme = _a.theme;
1777
1991
  return theme.palette.grey[700];
@@ -1780,7 +1994,7 @@ var NoResultsWrapper = styled__default.span(templateObject_3$a || (templateObjec
1780
1994
  var theme = _a.theme;
1781
1995
  return theme.palette.grey[700];
1782
1996
  });
1783
- var templateObject_1$A, templateObject_2$f, templateObject_3$a;
1997
+ var templateObject_1$J, templateObject_2$h, templateObject_3$a;
1784
1998
 
1785
1999
  var GroupElement = function (_a) {
1786
2000
  var index = _a.index, items = _a.items, title = _a.title, rest = __rest(_a, ["index", "items", "title"]);
@@ -1830,37 +2044,37 @@ var GroupedList = function (props) {
1830
2044
  }); }, [mouseBlocked, setMouseBlocked]);
1831
2045
  var wrapperRef = React.useRef(null);
1832
2046
  var i = 1;
1833
- return (React__default.createElement(Wrapper$8, { style: wrapperStyle, ref: wrapperRef, className: className }, groups.map(function (group, index) {
2047
+ return (React__default.createElement(Wrapper$f, { style: wrapperStyle, ref: wrapperRef, className: className }, groups.map(function (group, index) {
1834
2048
  var oldI = i;
1835
2049
  i += group.items.length;
1836
2050
  return (React__default.createElement(GroupElement, __assign({ key: index }, group, { mouseBlockedProps: mouseBlockedProps, navigable: navigable, index: oldI, wrapperRef: wrapperRef, placeholder: placeholder })));
1837
2051
  })));
1838
2052
  };
1839
- var Wrapper$8 = styled__default.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
1840
- var templateObject_1$B;
2053
+ var Wrapper$f = styled__default.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
2054
+ var templateObject_1$K;
1841
2055
 
1842
- var Label$2 = styled__default.span(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ", "\n"], ["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ",
2056
+ var Label$2 = styled__default.span(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ", "\n"], ["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ",
1843
2057
  "\n"])), function (_a) {
1844
2058
  var isDisabled = _a.isDisabled, palette = _a.theme.palette;
1845
- return isDisabled && styled.css(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n color: ", ";\n cursor: not-allowed;\n "], ["\n color: ", ";\n cursor: not-allowed;\n "])), palette.grey[500]);
2059
+ return isDisabled && styled.css(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n color: ", ";\n cursor: not-allowed;\n "], ["\n color: ", ";\n cursor: not-allowed;\n "])), palette.grey[500]);
1846
2060
  });
1847
- var templateObject_1$C, templateObject_2$g;
2061
+ var templateObject_1$L, templateObject_2$i;
1848
2062
 
1849
2063
  var Radio = styled__default.span(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ", "\n ", "\n ", "\n"], ["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ",
1850
2064
  "\n ",
1851
2065
  "\n ",
1852
2066
  "\n"])), function (_a) {
1853
2067
  var theme = _a.theme;
1854
- return styled.css(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n "], ["\n background-color: ", ";\n border: 1px solid ", ";\n "])), theme.palette.white[100], theme.palette.grey[500]);
2068
+ return styled.css(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n "], ["\n background-color: ", ";\n border: 1px solid ", ";\n "])), theme.palette.white[100], theme.palette.grey[500]);
1855
2069
  }, function (_a) {
1856
2070
  var isChecked = _a.isChecked, theme = _a.theme;
1857
- return isChecked && styled.css(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n border: 5px solid ", ";\n "], ["\n border: 5px solid ", ";\n "])), theme.palette.blue[500]);
2071
+ return isChecked && styled.css(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n border: 5px solid ", ";\n "], ["\n border: 5px solid ", ";\n "])), theme.palette.blue[500]);
1858
2072
  }, function (_a) {
1859
2073
  var isChecked = _a.isChecked, isDisabled = _a.isDisabled, theme = _a.theme;
1860
2074
  return isDisabled && styled.css(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n cursor: not-allowed;\n ", "\n "], ["\n background-color: ", ";\n border-color: ", ";\n cursor: not-allowed;\n ",
1861
2075
  "\n "])), theme.palette.grey[100], theme.palette.grey[100], isChecked && styled.css(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n "], ["\n background-color: ", ";\n border-color: ", ";\n "])), theme.palette.white[100], theme.palette.grey['50']));
1862
2076
  });
1863
- var templateObject_1$D, templateObject_2$h, templateObject_3$b, templateObject_4$6, templateObject_5$4;
2077
+ var templateObject_1$M, templateObject_2$j, templateObject_3$b, templateObject_4$6, templateObject_5$4;
1864
2078
 
1865
2079
  var WrapperRadioButton = function (props) {
1866
2080
  var isChecked = props.isChecked, isDisabled = props.isDisabled, label = props.label;
@@ -1868,14 +2082,14 @@ var WrapperRadioButton = function (props) {
1868
2082
  React__default.createElement(Radio, { isChecked: props.isChecked, isDisabled: props.isDisabled }),
1869
2083
  React__default.createElement(Label$2, { isDisabled: props.isDisabled }, props.label)))));
1870
2084
  };
1871
- var Wrapper$9 = styled__default(WrapperRadioButton)(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n & + & {\n margin-top: ", "px;\n }\n ", "\n"], ["\n & + & {\n margin-top: ", "px;\n }\n ",
2085
+ var Wrapper$g = styled__default(WrapperRadioButton)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n & + & {\n margin-top: ", "px;\n }\n ", "\n"], ["\n & + & {\n margin-top: ", "px;\n }\n ",
1872
2086
  "\n"])), function (props) { return (props.optionsSpacing ? props.optionsSpacing : 0); }, function (props) {
1873
- return props.inline && styled.css(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "], ["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "])));
2087
+ return props.inline && styled.css(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "], ["\n display: inline-block;\n vertical-align: top;\n &:not(:first-child) {\n margin-left: 25px;\n }\n "])));
1874
2088
  });
1875
2089
  var RadioButton = function (props) {
1876
- return React__default.createElement(Wrapper$9, __assign({}, props));
2090
+ return React__default.createElement(Wrapper$g, __assign({}, props));
1877
2091
  };
1878
- var templateObject_1$E, templateObject_2$i;
2092
+ var templateObject_1$N, templateObject_2$k;
1879
2093
 
1880
2094
  var RadioButtonGroup = function (props) { return (React__default.createElement("div", { style: props.style }, props.options.map(function (o) { return (React__default.createElement(RadioButton, { key: o.key, label: o.label, onClick: function () {
1881
2095
  if (props.onClick) {
@@ -1886,10 +2100,10 @@ var RadioButtonGroup = function (props) { return (React__default.createElement("
1886
2100
  var colorSetter = function (type, theme) {
1887
2101
  switch (type) {
1888
2102
  case 'standard': {
1889
- return styled.css(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.grey[100], theme.palette.black[100]);
2103
+ return styled.css(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.grey[100], theme.palette.black[100]);
1890
2104
  }
1891
2105
  case 'info': {
1892
- return styled.css(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.blue[50], theme.palette.blue[500]);
2106
+ return styled.css(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.blue[50], theme.palette.blue[500]);
1893
2107
  }
1894
2108
  case 'error': {
1895
2109
  return styled.css(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.red[50], theme.palette.red[500]);
@@ -1931,7 +2145,7 @@ var StyledCloseIcon = styled__default(Icon)(templateObject_16 || (templateObject
1931
2145
  var palette = _a.theme.palette;
1932
2146
  return palette.blue[700];
1933
2147
  });
1934
- var templateObject_1$F, templateObject_2$j, templateObject_3$c, templateObject_4$7, templateObject_5$5, templateObject_6$4, templateObject_7$4, templateObject_8$2, templateObject_9$1, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16;
2148
+ var templateObject_1$O, templateObject_2$l, templateObject_3$c, templateObject_4$7, templateObject_5$5, templateObject_6$4, templateObject_7$4, templateObject_8$2, templateObject_9$1, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16;
1935
2149
 
1936
2150
  var defaultCloseIcon = {
1937
2151
  icon: proSolidSvgIcons.faTimes,
@@ -1955,7 +2169,7 @@ var InlineMessage = function (props) {
1955
2169
 
1956
2170
  var renderTrigger = function () { return (React__default.createElement(IconWrapper, { tabIndex: 0 },
1957
2171
  React__default.createElement(Icon, { icon: proSolidSvgIcons.faEllipsisH, fixedWidth: true }))); };
1958
- var IconWrapper = styled__default.div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
2172
+ var IconWrapper = styled__default.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
1959
2173
  var triggerStyles = {
1960
2174
  margin: 'auto',
1961
2175
  width: '100%',
@@ -1968,16 +2182,16 @@ var SidebarItemDropdown = function (_a) {
1968
2182
  var className = _a.className, content = _a.content, _b = _a.forceOpen, forceOpen = _b === void 0 ? false : _b;
1969
2183
  return (React__default.createElement(Dropdown, { triggerStyles: triggerStyles, className: className, placement: 'right-start', renderTrigger: renderTrigger, content: content, forceOpen: forceOpen }));
1970
2184
  };
1971
- var templateObject_1$G;
2185
+ var templateObject_1$P;
1972
2186
 
1973
- var SidebarItemCaret = styled__default.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n transition: transform 250ms ease;\n transform: ", ";\n\n visibility: ", ";\n"], ["\n transition: transform 250ms ease;\n transform: ", ";\n\n visibility: ", ";\n"])), function (_a) {
2187
+ var SidebarItemCaret = styled__default.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n transition: transform 250ms ease;\n transform: ", ";\n\n visibility: ", ";\n"], ["\n transition: transform 250ms ease;\n transform: ", ";\n\n visibility: ", ";\n"])), function (_a) {
1974
2188
  var isOpen = _a.isOpen;
1975
2189
  return (isOpen ? 'rotate(90deg)' : 'rotate(0deg)');
1976
2190
  }, function (_a) {
1977
2191
  var isVisible = _a.isVisible;
1978
2192
  return (isVisible ? 'visible' : 'hidden');
1979
2193
  });
1980
- var templateObject_1$H;
2194
+ var templateObject_1$Q;
1981
2195
 
1982
2196
  var getSidebarItemStyles = function (_a) {
1983
2197
  var isActive = _a.isActive, isDisabled = _a.isDisabled, theme = _a.theme;
@@ -2000,8 +2214,8 @@ var SidebarItem = function (props) {
2000
2214
  React__default.createElement(Title$2, null, content),
2001
2215
  !isDisabled && dropdownContent && React__default.createElement(Dropdown$1, { content: dropdownContent, forceOpen: forceOpenDropdown })));
2002
2216
  };
2003
- var Dropdown$1 = styled__default(SidebarItemDropdown)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"], ["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"])));
2004
- var SidebarItemWrapper = styled__default.div.attrs(getSidebarItemStyles)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n height: ", "px;\n padding: 0 8px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: inherit;\n\n &:hover {\n background: ", ";\n }\n\n &:focus-within {\n background: ", ";\n }\n }\n }\n"], ["\n height: ", "px;\n padding: 0 8px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: inherit;\n\n &:hover {\n background: ", ";\n }\n\n &:focus-within {\n background: ", ";\n }\n }\n }\n"])), sidebarItemHeight, function (_a) {
2217
+ var Dropdown$1 = styled__default(SidebarItemDropdown)(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"], ["\n width: 1.5em;\n height: 1.5em;\n\n border-radius: 2px;\n"])));
2218
+ var SidebarItemWrapper = styled__default.div.attrs(getSidebarItemStyles)(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n height: ", "px;\n padding: 0 8px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: inherit;\n\n &:hover {\n background: ", ";\n }\n\n &:focus-within {\n background: ", ";\n }\n }\n }\n"], ["\n height: ", "px;\n padding: 0 8px;\n\n display: flex;\n justify-content: flex-start;\n align-items: center;\n gap: 8px;\n\n cursor: pointer;\n\n transition: background-color 250ms ease;\n\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: none;\n }\n\n &:hover,\n &:focus-within {\n color: ", ";\n background-color: ", ";\n\n ", " {\n display: inherit;\n\n &:hover {\n background: ", ";\n }\n\n &:focus-within {\n background: ", ";\n }\n }\n }\n"])), sidebarItemHeight, function (_a) {
2005
2219
  var color = _a.color, customColor = _a.customColor;
2006
2220
  return customColor || color;
2007
2221
  }, function (_a) {
@@ -2022,7 +2236,7 @@ var SidebarItemWrapper = styled__default.div.attrs(getSidebarItemStyles)(templat
2022
2236
  });
2023
2237
  var Title$2 = styled__default.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"], ["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
2024
2238
  var NoIcon = styled__default(Icon)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n visibility: hidden;\n"], ["\n visibility: hidden;\n"])));
2025
- var templateObject_1$I, templateObject_2$k, templateObject_3$d, templateObject_4$8;
2239
+ var templateObject_1$R, templateObject_2$m, templateObject_3$d, templateObject_4$8;
2026
2240
 
2027
2241
  var sidebarItemPalette = {
2028
2242
  normal: {
@@ -2056,14 +2270,14 @@ var getMicroTagStyles = function (_a) {
2056
2270
  return theme.components.microTag[type];
2057
2271
  };
2058
2272
 
2059
- var MicroTagBody = styled__default.div.attrs(getMicroTagStyles)(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ", ";\n background-color: ", ";\n"], ["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ", ";\n background-color: ", ";\n"])), function (_a) {
2273
+ var MicroTagBody = styled__default.div.attrs(getMicroTagStyles)(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ", ";\n background-color: ", ";\n"], ["\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n display: inline-block;\n padding: 0 4px;\n border-radius: 4px;\n text-transform: uppercase;\n\n color: ", ";\n background-color: ", ";\n"])), function (_a) {
2060
2274
  var color = _a.color;
2061
2275
  return color;
2062
2276
  }, function (_a) {
2063
2277
  var backgroundColor = _a.backgroundColor;
2064
2278
  return backgroundColor;
2065
2279
  });
2066
- var templateObject_1$J;
2280
+ var templateObject_1$S;
2067
2281
 
2068
2282
  var MicroTag = function (_a) {
2069
2283
  var text = _a.text, type = _a.type;
@@ -2102,13 +2316,13 @@ var checkIcon = React__default.createElement(Icon, { icon: proSolidSvgIcons.faCh
2102
2316
  var StepItem = function (_a) {
2103
2317
  var _b = _a.text, text = _b === void 0 ? '' : _b, number = _a.number, status = _a.status;
2104
2318
  var content = status === 'completed' ? checkIcon : number + 1;
2105
- return (React__default.createElement(Wrapper$a, { status: status },
2319
+ return (React__default.createElement(Wrapper$h, { status: status },
2106
2320
  React__default.createElement(Circle, null, content),
2107
2321
  React__default.createElement(Text$2, null, text)));
2108
2322
  };
2109
- var Circle = styled__default.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
2110
- var Text$2 = styled__default.div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject([""], [""])));
2111
- var Wrapper$a = styled__default.div.attrs(getStepItemStyles)(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"], ["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"])), Circle, function (_a) {
2323
+ var Circle = styled__default.div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n border-radius: 50%;\n\n width: 2em;\n height: 2em;\n\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
2324
+ var Text$2 = styled__default.div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject([""], [""])));
2325
+ var Wrapper$h = styled__default.div.attrs(getStepItemStyles)(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"], ["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"])), Circle, function (_a) {
2112
2326
  var circleTextColor = _a.circleTextColor;
2113
2327
  return circleTextColor;
2114
2328
  }, function (_a) {
@@ -2118,10 +2332,10 @@ var Wrapper$a = styled__default.div.attrs(getStepItemStyles)(templateObject_3$e
2118
2332
  var color = _a.color;
2119
2333
  return color;
2120
2334
  });
2121
- var templateObject_1$K, templateObject_2$l, templateObject_3$e;
2335
+ var templateObject_1$T, templateObject_2$n, templateObject_3$e;
2122
2336
 
2123
- var StepperDivider = styled__default.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"], ["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"])));
2124
- var templateObject_1$L;
2337
+ var StepperDivider = styled__default.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"], ["\n width: 2.5em;\n height: 0.1em;\n background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(51, 51, 51, 0.16) 50%, rgba(0, 0, 0, 0) 100%);\n"])));
2338
+ var templateObject_1$U;
2125
2339
 
2126
2340
  var getItemStatus = function (itemStep, currentStep) {
2127
2341
  if (itemStep < currentStep) {
@@ -2150,10 +2364,10 @@ var Stepper = function (_a) {
2150
2364
  }
2151
2365
  }, []);
2152
2366
  }, [steps, currentStep]);
2153
- return React__default.createElement(Wrapper$b, null, mappedSteps);
2367
+ return React__default.createElement(Wrapper$i, null, mappedSteps);
2154
2368
  };
2155
- var Wrapper$b = styled__default.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"], ["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"])));
2156
- var templateObject_1$M;
2369
+ var Wrapper$i = styled__default.div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"], ["\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n align-items: center;\n gap: 0.6em;\n"])));
2370
+ var templateObject_1$V;
2157
2371
 
2158
2372
  var stepperPalette = {
2159
2373
  item: {
@@ -2180,8 +2394,8 @@ var getTagColors = function (_a) {
2180
2394
  return theme.components.tag[tagStyle][type];
2181
2395
  };
2182
2396
 
2183
- var LeftIcon$2 = styled__default(Icon)(templateObject_1$N || (templateObject_1$N = __makeTemplateObject([""], [""])));
2184
- var RightIcon$1 = styled__default(Icon)(templateObject_2$m || (templateObject_2$m = __makeTemplateObject([""], [""])));
2397
+ var LeftIcon$2 = styled__default(Icon)(templateObject_1$W || (templateObject_1$W = __makeTemplateObject([""], [""])));
2398
+ var RightIcon$1 = styled__default(Icon)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject([""], [""])));
2185
2399
  var Text$3 = styled__default.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject([""], [""])));
2186
2400
  var StyledTag = styled__default.div.attrs(getTagColors)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ", ";\n background-color: ", ";\n\n ", " + ", " {\n padding-left: 4px;\n }\n\n ", " + ", " {\n padding-right: 12px;\n }\n"], ["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ", ";\n background-color: ", ";\n\n ", " + ", " {\n padding-left: 4px;\n }\n\n ", " + ", " {\n padding-right: 12px;\n }\n"])), function (_a) {
2187
2401
  var color = _a.color;
@@ -2190,7 +2404,7 @@ var StyledTag = styled__default.div.attrs(getTagColors)(templateObject_4$9 || (t
2190
2404
  var backgroundColor = _a.backgroundColor;
2191
2405
  return backgroundColor;
2192
2406
  }, LeftIcon$2, Text$3, Text$3, RightIcon$1);
2193
- var templateObject_1$N, templateObject_2$m, templateObject_3$f, templateObject_4$9;
2407
+ var templateObject_1$W, templateObject_2$o, templateObject_3$f, templateObject_4$9;
2194
2408
 
2195
2409
  var Tag = function (_a) {
2196
2410
  var leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, tagStyle = _a.tagStyle, text = _a.text, type = _a.type, className = _a.className;
@@ -2269,28 +2483,28 @@ var tagPalette = {
2269
2483
  },
2270
2484
  };
2271
2485
 
2272
- var Arrow = styled__default.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ", ";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"], ["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ", ";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"])), function (_a) {
2486
+ var Arrow = styled__default.div(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ", ";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"], ["\n position: absolute;\n width: 10px;\n height: 10px;\n\n &:after {\n content: '';\n position: absolute;\n transform: rotate(45deg);\n width: 10px;\n height: 10px;\n background-color: ", ";\n box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);\n clip-path: polygon(100% 0, 0% 100%, 100% 100%);\n }\n"])), function (_a) {
2273
2487
  var theme = _a.theme, type = _a.type;
2274
2488
  return theme.components.tooltip[type].background;
2275
2489
  });
2276
- var arrowStyle = styled.css(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"], ["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"])), Arrow, Arrow, Arrow, Arrow);
2277
- var templateObject_1$O, templateObject_2$n;
2490
+ var arrowStyle = styled.css(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"], ["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"])), Arrow, Arrow, Arrow, Arrow);
2491
+ var templateObject_1$X, templateObject_2$p;
2278
2492
 
2279
2493
  var getMessageStyles = function (_a) {
2280
2494
  var theme = _a.theme, type = _a.type;
2281
2495
  return theme.components.tooltip[type];
2282
2496
  };
2283
- var Message = styled__default.div.attrs(getMessageStyles)(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ", ";\n background: ", ";\n"], ["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ", ";\n background: ", ";\n"])), function (_a) {
2497
+ var Message = styled__default.div.attrs(getMessageStyles)(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ", ";\n background: ", ";\n"], ["\n z-index: 9;\n\n font-size: 14px;\n\n padding: 4px 8px;\n border-radius: 3px;\n\n box-shadow: 0 2px 7px -2px rgba(0, 0, 0, 1);\n\n color: ", ";\n background: ", ";\n"])), function (_a) {
2284
2498
  var color = _a.color;
2285
2499
  return color;
2286
2500
  }, function (_a) {
2287
2501
  var background = _a.background;
2288
2502
  return background;
2289
2503
  });
2290
- var templateObject_1$P;
2504
+ var templateObject_1$Y;
2291
2505
 
2292
- var TooltipContainer = styled__default.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", ";\n\n max-width: min(calc(100vw - 5%), 300px);\n"], ["\n ", ";\n\n max-width: min(calc(100vw - 5%), 300px);\n"])), arrowStyle);
2293
- var templateObject_1$Q;
2506
+ var TooltipContainer = styled__default.div(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n ", ";\n\n max-width: min(calc(100vw - 5%), 300px);\n"], ["\n ", ";\n\n max-width: min(calc(100vw - 5%), 300px);\n"])), arrowStyle);
2507
+ var templateObject_1$Z;
2294
2508
 
2295
2509
  var Tooltip = function (_a) {
2296
2510
  var message = _a.message, placement = _a.placement, className = _a.className, children = _a.children, type = _a.type, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave;
@@ -2337,7 +2551,7 @@ var Tooltip = function (_a) {
2337
2551
  },
2338
2552
  ]; }, [arrowRef]),
2339
2553
  }), attributes = _d.attributes, styles = _d.styles;
2340
- return (React__default.createElement(Wrapper$c, { className: className, ref: wrapperRef },
2554
+ return (React__default.createElement(Wrapper$j, { className: className, ref: wrapperRef },
2341
2555
  React__default.createElement("div", { ref: buttonRef, onClick: show, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave }, children),
2342
2556
  React__default.createElement(reactTransitionGroup.CSSTransition, { in: isOpen, timeout: 200, unmountOnExit: true, appear: true },
2343
2557
  React__default.createElement(BodyAnimationWrapper$1, null,
@@ -2345,9 +2559,9 @@ var Tooltip = function (_a) {
2345
2559
  React__default.createElement(Arrow, { type: type, ref: setArrowRef, style: styles.arrow }),
2346
2560
  React__default.createElement(Message, { type: type, style: styles.offset }, message))))));
2347
2561
  };
2348
- var Wrapper$c = styled__default.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
2349
- var BodyAnimationWrapper$1 = styled__default.div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"], ["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"])));
2350
- var templateObject_1$R, templateObject_2$o;
2562
+ var Wrapper$j = styled__default.div(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
2563
+ var BodyAnimationWrapper$1 = styled__default.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"], ["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"])));
2564
+ var templateObject_1$_, templateObject_2$q;
2351
2565
 
2352
2566
  var tooltipPalette = {
2353
2567
  light: {
@@ -2375,14 +2589,15 @@ var components = {
2375
2589
  inputText: inputTextPalette,
2376
2590
  textArea: textAreaPalette,
2377
2591
  inputHelper: inputHelperPalette,
2592
+ select: selectPalette,
2378
2593
  };
2379
2594
  var defaultTheme = {
2380
2595
  palette: defaultPalette,
2381
2596
  components: components,
2382
2597
  };
2383
2598
 
2384
- var ModalAnimation = styled.createGlobalStyle(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"], ["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"])));
2385
- var templateObject_1$S;
2599
+ var ModalAnimation = styled.createGlobalStyle(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"], ["\n .ReactModal__Overlay {\n opacity: 0;\n transition: all 200ms ease-in-out;\n }\n \n .ReactModal__Overlay--after-open {\n opacity: 1;\n }\n \n .ReactModal__Overlay--before-close {\n opacity: 0;\n }\n \n .ReactModal__Overlay--after-open .ReactModal__Content {\n :not(.fic-modal) {\n opacity: 1;\n transform: translate(-50%, -50%);\n }\n }\n \n .ReactModal__Overlay--before-close .ReactModal__Content {\n opacity: 0;\n transform: translate(-50%, 0%);\n }\n"])));
2600
+ var templateObject_1$$;
2386
2601
 
2387
2602
  var styledModalBoxWidth = function (isSmall, isFullscreen) {
2388
2603
  if (isFullscreen) {
@@ -2396,13 +2611,13 @@ var styledModalBoxWidth = function (isSmall, isFullscreen) {
2396
2611
 
2397
2612
  var headerFooterHeight = '80px';
2398
2613
  var closeTimeoutMS = 200;
2399
- var StyledReactModalContainer = styled__default(ReactModal)(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ", "ms ease-in-out;\n"], ["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ", "ms ease-in-out;\n"])), closeTimeoutMS);
2614
+ var StyledReactModalContainer = styled__default(ReactModal)(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ", "ms ease-in-out;\n"], ["\n position: absolute;\n top: 50%;\n left: 50%;\n right: auto;\n bottom: auto;\n outline: none;\n opacity: 0;\n transform: translate(-50%, -100%);\n transition: all ", "ms ease-in-out;\n"])), closeTimeoutMS);
2400
2615
  var StyledModalBox = styled__default.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ", "\n\n box-shadow: ", ";\n\n border: ", ";\n border-radius: ", "px;\n width: ", "vw;\n\n @media screen and (min-width: 992px) {\n width: ", ";\n }\n"], ["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ",
2401
2616
  "\n\n box-shadow: ",
2402
2617
  ";\n\n border: ", ";\n border-radius: ", "px;\n width: ", "vw;\n\n @media screen and (min-width: 992px) {\n width: ", ";\n }\n"])), function (_a) {
2403
2618
  var fullScreenHeight = _a.fullScreenHeight, isFullscreen = _a.isFullscreen;
2404
2619
  return isFullscreen
2405
- ? styled.css(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n height: ", "px;\n "], ["\n height: ", "px;\n "])), fullScreenHeight) : styled.css(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n min-height: 200px;\n "], ["\n min-height: 200px;\n "])));
2620
+ ? styled.css(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n height: ", "px;\n "], ["\n height: ", "px;\n "])), fullScreenHeight) : styled.css(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n min-height: 200px;\n "], ["\n min-height: 200px;\n "])));
2406
2621
  }, function (props) {
2407
2622
  return props.isFullscreen ? 'none' : 'rgba(23, 43, 77, 0.24) 0px 16px 24px, rgba(9, 30, 66, 0.08) 0px 0px 0px';
2408
2623
  }, function (props) { return (props.isFullscreen ? 0 : '1px solid rgb(204, 204, 204)'); }, function (props) { return (props.isFullscreen ? 0 : 8); }, function (props) { return (props.isFullscreen ? 100 : 96); }, function (_a) {
@@ -2441,14 +2656,14 @@ var ModalFooter = styled__default.div(templateObject_12$1 || (templateObject_12$
2441
2656
  var palette = _a.theme.palette;
2442
2657
  return palette.grey[100];
2443
2658
  });
2444
- var Wrapper$d = styled__default.div(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject([""], [""])));
2659
+ var Wrapper$k = styled__default.div(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject([""], [""])));
2445
2660
  var TopAttachment = styled__default.div(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n top: ", ";\n"], ["\n position: absolute;\n width: 100%;\n top: ", ";\n"])), function (_a) {
2446
2661
  var height = _a.height;
2447
2662
  return height && -(height + 16) + "px";
2448
2663
  });
2449
2664
  var BottomAttachment = styled__default.div(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"], ["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"])));
2450
2665
  var StyledIcon$6 = styled__default(Icon)(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n font-size: 24px;\n font-weight: 500;\n"], ["\n font-size: 24px;\n font-weight: 500;\n"])));
2451
- var templateObject_1$T, templateObject_2$p, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$5, templateObject_8$3, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1;
2666
+ var templateObject_1$10, templateObject_2$r, templateObject_3$g, templateObject_4$a, templateObject_5$6, templateObject_6$5, templateObject_7$5, templateObject_8$3, templateObject_9$2, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1;
2452
2667
 
2453
2668
  var closeTimeoutMS$1 = 200;
2454
2669
  var modalStyle = {
@@ -2538,7 +2753,7 @@ var ModalSearchable = function (props) {
2538
2753
  React__default.createElement(ClearButton, { visible: !!value, onClick: clearInput }, "Cancella")));
2539
2754
  return (React__default.createElement(Modal, __assign({ className: className, header: function () { return Header; } }, props), children));
2540
2755
  };
2541
- var ClearButton = styled__default.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ", ";\n color: ", ";\n &:hover {\n color: ", ";\n }\n display: ", ";\n"], ["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ", ";\n color: ", ";\n &:hover {\n color: ", ";\n }\n display: ", ";\n"])), function (_a) {
2756
+ var ClearButton = styled__default.div(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ", ";\n color: ", ";\n &:hover {\n color: ", ";\n }\n display: ", ";\n"], ["\n white-space: nowrap;\n cursor: pointer;\n padding-right: 10px;\n border-right: 1px solid ", ";\n color: ", ";\n &:hover {\n color: ", ";\n }\n display: ", ";\n"])), function (_a) {
2542
2757
  var theme = _a.theme;
2543
2758
  return theme.palette.grey[200];
2544
2759
  }, function (_a) {
@@ -2551,21 +2766,21 @@ var ClearButton = styled__default.div(templateObject_1$U || (templateObject_1$U
2551
2766
  var visible = _a.visible;
2552
2767
  return (visible ? 'inherit' : 'none');
2553
2768
  });
2554
- var WrapperInput = styled__default.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"])), function (_a) {
2769
+ var WrapperInput = styled__default.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"])), function (_a) {
2555
2770
  var theme = _a.theme;
2556
2771
  return theme.palette.blue[300];
2557
2772
  }, function (_a) {
2558
2773
  var theme = _a.theme;
2559
2774
  return theme.palette.grey[50];
2560
2775
  });
2561
- var templateObject_1$U, templateObject_2$q;
2776
+ var templateObject_1$11, templateObject_2$s;
2562
2777
 
2563
- var CustomSizeModal = styled__default(Modal)(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n width: 432px;\n max-width: 90vw;\n"], ["\n width: 432px;\n max-width: 90vw;\n"])));
2564
- var TitleContent = styled__default.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"], ["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"])));
2778
+ var CustomSizeModal = styled__default(Modal)(templateObject_1$12 || (templateObject_1$12 = __makeTemplateObject(["\n width: 432px;\n max-width: 90vw;\n"], ["\n width: 432px;\n max-width: 90vw;\n"])));
2779
+ var TitleContent = styled__default.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"], ["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"])));
2565
2780
  var BodyContent = styled__default.div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"], ["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"])));
2566
2781
  var Question = styled__default.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"], ["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"])));
2567
2782
  var Buttons = styled__default.div(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"], ["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"])));
2568
- var templateObject_1$V, templateObject_2$r, templateObject_3$h, templateObject_4$b, templateObject_5$7;
2783
+ var templateObject_1$12, templateObject_2$t, templateObject_3$h, templateObject_4$b, templateObject_5$7;
2569
2784
 
2570
2785
  var typeMap = {
2571
2786
  error: 'error',
@@ -2604,10 +2819,10 @@ var ConfirmationModal = function (props) {
2604
2819
  props.onAction();
2605
2820
  } }))));
2606
2821
  };
2607
- var StyledButton = styled__default(Button)(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n margin-left: 16px;\n"], ["\n margin-left: 16px;\n"])));
2608
- var templateObject_1$W;
2822
+ var StyledButton = styled__default(Button)(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n margin-left: 16px;\n"], ["\n margin-left: 16px;\n"])));
2823
+ var templateObject_1$13;
2609
2824
 
2610
- var StyledWrapper = styled__default.div(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ", ";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ", ";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ", ";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n }\n"], ["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ", ";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ", ";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ", ";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n }\n"])), function (_a) {
2825
+ var StyledWrapper = styled__default.div(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ", ";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ", ";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ", ";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n }\n"], ["\n width: 90vw;\n margin: 0 auto;\n text-align: center;\n @media screen and (min-width: 768px) {\n width: 376px;\n }\n .icon {\n background-color: ", ";\n width: 176px;\n height: 176px;\n border-radius: 50%;\n color: ", ";\n margin: 0 auto;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 76px;\n }\n h5 {\n margin-top: 2rem;\n margin-bottom: 0;\n font-weight: 500;\n font-size: 20px;\n line-height: 30px;\n color: ", ";\n }\n p {\n margin-top: 0.5rem;\n margin-bottom: 1.5rem;\n font-weight: 400;\n font-size: 14px;\n line-height: 21px;\n color: ", ";\n }\n"])), function (_a) {
2611
2826
  var palette = _a.theme.palette;
2612
2827
  return palette.red[50];
2613
2828
  }, function (_a) {
@@ -2632,14 +2847,14 @@ var PageEmptySet = function (_a) {
2632
2847
  text && React__default.createElement("p", null, text),
2633
2848
  button));
2634
2849
  };
2635
- var templateObject_1$X;
2850
+ var templateObject_1$14;
2636
2851
 
2637
- var StyledWrapper$1 = styled__default.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n ", "\n"], ["\n ",
2852
+ var StyledWrapper$1 = styled__default.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n ", "\n"], ["\n ",
2638
2853
  "\n"])), function (_a) {
2639
2854
  var palette = _a.theme.palette;
2640
- return styled.css(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "], ["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "])), palette.grey[700], palette.white[100], palette.grey[700]);
2855
+ return styled.css(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "], ["\n .pagination {\n display: flex;\n justify-content: center;\n width: 100%;\n margin-top: 2rem;\n }\n\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n "])), palette.grey[700], palette.white[100], palette.grey[700]);
2641
2856
  });
2642
- var templateObject_1$Y, templateObject_2$s;
2857
+ var templateObject_1$15, templateObject_2$u;
2643
2858
 
2644
2859
  var PaginationComponent = function (props) {
2645
2860
  var numberOfPages = Math.ceil(props.listSize / props.pageSize);
@@ -2677,12 +2892,12 @@ var PaginationComponent = function (props) {
2677
2892
  var Pagination = function (props) { return (React__default.createElement(StyledWrapper$1, null,
2678
2893
  React__default.createElement(PaginationComponent, __assign({}, props)))); };
2679
2894
 
2680
- var StyledProgressbarWrapper = styled__default.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n ", "\n"], ["\n ",
2895
+ var StyledProgressbarWrapper = styled__default.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n ", "\n"], ["\n ",
2681
2896
  "\n"])), function (_a) {
2682
2897
  var color = _a.color, percentage = _a.percentage, palette = _a.theme.palette;
2683
- return styled.css(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n .progression__container {\n height: ", ";\n background-color: ", ";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ", ";\n width: ", "%;\n }\n "], ["\n .progression__container {\n height: ", ";\n background-color: ", ";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ", ";\n width: ", "%;\n }\n "])), spacing.s, palette.grey[100], palette[color ? color : 'blue'][500], percentage);
2898
+ return styled.css(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n .progression__container {\n height: ", ";\n background-color: ", ";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ", ";\n width: ", "%;\n }\n "], ["\n .progression__container {\n height: ", ";\n background-color: ", ";\n position: relative;\n border-radius: 100px;\n }\n .progression__bar {\n position: absolute;\n height: 100%;\n z-index: 1;\n border-radius: 100px;\n transition: width 0.35s ease-in-out;\n\n background-color: ", ";\n width: ", "%;\n }\n "])), spacing.s, palette.grey[100], palette[color ? color : 'blue'][500], percentage);
2684
2899
  });
2685
- var templateObject_1$Z, templateObject_2$t;
2900
+ var templateObject_1$16, templateObject_2$v;
2686
2901
 
2687
2902
  var UnstyledProgressbar = /** @class */ (function (_super) {
2688
2903
  __extends(UnstyledProgressbar, _super);
@@ -2700,92 +2915,7 @@ var UnstyledProgressbar = /** @class */ (function (_super) {
2700
2915
  var Progressbar = function (props) { return (React__default.createElement(StyledProgressbarWrapper, __assign({}, props),
2701
2916
  React__default.createElement(UnstyledProgressbar, __assign({}, props)))); };
2702
2917
 
2703
- var elevations = {
2704
- first: '0px 1px 2px 0px rgba(51, 51, 51, 0.24)',
2705
- second: '0px 2px 4px rgba(51, 51, 51, 0.12), 0px 3px 6px rgba(51, 51, 51, 0.15)',
2706
- third: '0px 3px 6px 0px rgba(51, 51, 51, 0.1)',
2707
- fourth: '0px 5px 10px 0px rgba(51, 51, 51, 0.05)',
2708
- fifth: '0px 20px 40px 0px rgba(51, 51, 51, 0.2)',
2709
- };
2710
-
2711
- var styles = {
2712
- fontSize: {
2713
- medium: '14px',
2714
- large: '14px',
2715
- },
2716
- minHeight: {
2717
- medium: '30px',
2718
- large: '38px',
2719
- },
2720
- };
2721
- var indicatorSeparator = function (baseStyle) { return (__assign(__assign({}, baseStyle), { display: 'none' })); };
2722
- var singleValue = function (baseStyle) { return (__assign(__assign({}, baseStyle), { top: '45%' })); };
2723
- var clearIndicator = function (baseStyle) { return (__assign(__assign({}, baseStyle), { padding: '5px' })); };
2724
- var dropdownIndicator = function (baseStyle) { return (__assign(__assign({}, baseStyle), { border: 'none', padding: '5px' })); };
2725
- var multiValue = function (baseStyle) { return (__assign(__assign({}, baseStyle), { borderRadius: '100px' })); };
2726
- var menu = function (baseStyle) { return (__assign(__assign({}, baseStyle), { boxShadow: elevations.second, borderRadius: '4px', fontSize: '14px', lineHeight: '21px' })); };
2727
-
2728
- var useCustomSelectStyle = function (size) {
2729
- if (size === void 0) { size = 'medium'; }
2730
- var themeContext = React.useContext(styled.ThemeContext);
2731
- var container = React.useCallback(function (baseStyle) { return (__assign(__assign({}, baseStyle), { outline: 'none', fontSize: styles.fontSize[size], height: styles.minHeight[size], minHeight: styles.minHeight[size] })); }, [size]);
2732
- var valueContainer = React.useCallback(function (baseStyle) { return (__assign(__assign({}, baseStyle), { height: styles.minHeight[size], minHeight: styles.minHeight[size] })); }, [size]);
2733
- var control = React.useCallback(function (baseStyle, state) {
2734
- if (state.isFocused) {
2735
- return __assign(__assign({}, baseStyle), { border: "1px solid " + themeContext.palette.blue[300], boxShadow: "0 0 0 2px " + themeContext.palette.blue[100], outline: 'none', height: styles.minHeight[size], minHeight: styles.minHeight[size] });
2736
- }
2737
- else {
2738
- return __assign(__assign({}, baseStyle), { outline: 'none', height: styles.minHeight[size], minHeight: styles.minHeight[size] });
2739
- }
2740
- }, [size, themeContext]);
2741
- return React.useMemo(function () { return ({
2742
- indicatorSeparator: indicatorSeparator,
2743
- container: container,
2744
- valueContainer: valueContainer,
2745
- singleValue: singleValue,
2746
- control: control,
2747
- clearIndicator: clearIndicator,
2748
- dropdownIndicator: dropdownIndicator,
2749
- multiValue: multiValue,
2750
- menu: menu,
2751
- }); }, [container, control, valueContainer]);
2752
- };
2753
-
2754
- var ReactSelectWrapper = function (props) {
2755
- var getRef = props.getRef, inputChange = props.inputChange, isClearable = props.isClearable, isMulti = props.isMulti, size = props.size;
2756
- var styles = useCustomSelectStyle(size);
2757
- return (React__default.createElement(ReactSelect, __assign({}, props, { isMulti: isMulti, backspaceRemoves: true, deleteRemoves: false, autosize: false, noOptionsMessage: function () { return 'Nessuna corrispondenza trovata'; }, styles: styles, isClearable: isClearable, onInputChange: inputChange, ref: getRef })));
2758
- };
2759
- var StyledWrapper$2 = styled__default.div(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n .label {\n font-size: 14px;\n line-height: 21px;\n margin-bottom: 4px;\n display: block;\n color: ", ";\n }\n"], ["\n .label {\n font-size: 14px;\n line-height: 21px;\n margin-bottom: 4px;\n display: block;\n color: ", ";\n }\n"])), function (_a) {
2760
- var theme = _a.theme;
2761
- return theme.palette.black[100];
2762
- });
2763
- var Select = function (props) {
2764
- var label = props.label;
2765
- var theme = props.theme, rest = __rest(props, ["theme"]);
2766
- return (React__default.createElement(StyledWrapper$2, __assign({}, rest),
2767
- label ? React__default.createElement("label", { className: 'label' }, label) : null,
2768
- React__default.createElement(ReactSelectWrapper, __assign({}, props))));
2769
- };
2770
- var SelectCreatable = function (props) {
2771
- var isClearable = props.isClearable, isMulti = props.isMulti, label = props.label, size = props.size;
2772
- var theme = props.theme, rest = __rest(props, ["theme"]);
2773
- var styles = useCustomSelectStyle(size);
2774
- return (React__default.createElement(StyledWrapper$2, __assign({}, rest),
2775
- label ? React__default.createElement("label", { className: 'label' }, label) : null,
2776
- React__default.createElement(CreatableSelect, __assign({}, props, { isMulti: isMulti, backspaceRemoves: true, deleteRemoves: true, autosize: false, noOptionsMessage: function () { return 'Nessuna corrispondenza trovata'; }, styles: styles, isClearable: isClearable }))));
2777
- };
2778
- var SelectAsync = function (props) {
2779
- var isClearable = props.isClearable, label = props.label, size = props.size;
2780
- var theme = props.theme, rest = __rest(props, ["theme"]);
2781
- var styles = useCustomSelectStyle(size);
2782
- return (React__default.createElement(StyledWrapper$2, __assign({}, rest),
2783
- label ? React__default.createElement("label", { className: 'label' }, label) : null,
2784
- React__default.createElement(AsyncSelect, __assign({}, props, { backspaceRemoves: true, deleteRemoves: true, autosize: false, noOptionsMessage: function () { return 'Nessuna corrispondenza trovata'; }, styles: styles, isClearable: isClearable }))));
2785
- };
2786
- var templateObject_1$_;
2787
-
2788
- var linearBackground = function () { return styled.css(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ", ";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n ", " 46%,\n ", " 50%,\n ", " 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"], ["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ", ";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n ", " 46%,\n ", " 50%,\n ", " 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"])), function (_a) {
2918
+ var linearBackground = function () { return styled.css(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ", ";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n ", " 46%,\n ", " 50%,\n ", " 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"], ["\n .linear-background {\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n\n position: relative;\n display: flex;\n flex-wrap: wrap;\n overflow: hidden;\n margin-bottom: 0;\n background-color: ", ";\n border-radius: 4px;\n padding: 8px;\n\n &::before {\n content: ' ';\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 50%;\n z-index: 1;\n width: 500%;\n margin-left: -250%;\n animation: phAnimation 2s linear infinite;\n background: linear-gradient(\n to right,\n ", " 46%,\n ", " 50%,\n ", " 54%\n );\n }\n\n > * {\n flex: 1 1 auto;\n display: flex;\n flex-flow: column;\n padding-right: (8px / 2);\n padding-left: (8px / 2);\n }\n\n @keyframes phAnimation {\n 0% {\n transform: translate3d(-30%, 0, 0);\n }\n 100% {\n transform: translate3d(30%, 0, 0);\n }\n }\n }\n"])), function (_a) {
2789
2919
  var theme = _a.theme;
2790
2920
  return theme.palette.grey[100];
2791
2921
  }, function (_a) {
@@ -2798,7 +2928,7 @@ var linearBackground = function () { return styled.css(templateObject_1$$ || (te
2798
2928
  var theme = _a.theme;
2799
2929
  return theme.palette.grey[100];
2800
2930
  }); };
2801
- var templateObject_1$$;
2931
+ var templateObject_1$17;
2802
2932
 
2803
2933
  var tabletLandscape = 991;
2804
2934
  var responsiveThresholds = {
@@ -2871,8 +3001,8 @@ var typeMap$1 = {
2871
3001
  desc: proSolidSvgIcons.faSortDown,
2872
3002
  default: proSolidSvgIcons.faSort,
2873
3003
  };
2874
- var StyledWrapper$3 = styled__default.div(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n margin-left: 0.5rem;\n"], ["\n margin-left: 0.5rem;\n"])));
2875
- var StyledIcon$7 = styled__default(Icon)(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
3004
+ var StyledWrapper$2 = styled__default.div(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n margin-left: 0.5rem;\n"], ["\n margin-left: 0.5rem;\n"])));
3005
+ var StyledIcon$7 = styled__default(Icon)(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
2876
3006
  var SortIcon = function (props) {
2877
3007
  var filter = _.find(props.propertiesFilter, ['id', props.property]);
2878
3008
  var type = '';
@@ -2899,12 +3029,12 @@ var SortIcon = function (props) {
2899
3029
  nextType = 'desc';
2900
3030
  }
2901
3031
  }
2902
- return (React__default.createElement(StyledWrapper$3, null,
3032
+ return (React__default.createElement(StyledWrapper$2, null,
2903
3033
  React__default.createElement(StyledIcon$7, { icon: typeMap$1[type], onClick: function () {
2904
3034
  props.handleSortOnProperty(props.property, nextType);
2905
3035
  } })));
2906
3036
  };
2907
- var templateObject_1$10, templateObject_2$u;
3037
+ var templateObject_1$18, templateObject_2$w;
2908
3038
 
2909
3039
  var ellipsisIcon = {
2910
3040
  icon: proSolidSvgIcons.faEllipsisH,
@@ -2931,29 +3061,29 @@ var HeadDesktop = function (_a) {
2931
3061
  React__default.createElement(Icon, __assign({}, ellipsisIcon))))));
2932
3062
  };
2933
3063
 
2934
- var Row = styled__default.div(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject([""], [""])));
3064
+ var Row = styled__default.div(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject([""], [""])));
2935
3065
  var ListMobile = function (_a) {
2936
3066
  var data = _a.data, isLoading = _a.isLoading, listSize = _a.listSize, renderMobileRow = _a.renderMobileRow;
2937
3067
  return (React__default.createElement("div", null, listSize && !isLoading
2938
3068
  ? data.map(function (o, i) { return React__default.createElement(Row, { key: i }, renderMobileRow ? renderMobileRow(o) : undefined); })
2939
3069
  : undefined));
2940
3070
  };
2941
- var templateObject_1$11;
3071
+ var templateObject_1$19;
2942
3072
 
2943
- var ActionLink = styled__default.a(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ", "\n"], ["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ",
2944
- "\n"])), function (props) { return styled.css(templateObject_1$12 || (templateObject_1$12 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), props.color); });
2945
- var templateObject_1$12, templateObject_2$v;
3073
+ var ActionLink = styled__default.a(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ", "\n"], ["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ",
3074
+ "\n"])), function (props) { return styled.css(templateObject_1$1a || (templateObject_1$1a = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), props.color); });
3075
+ var templateObject_1$1a, templateObject_2$x;
2946
3076
 
2947
- var ActionsContainer = styled__default.div(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
2948
- var templateObject_1$13;
3077
+ var ActionsContainer = styled__default.div(templateObject_1$1b || (templateObject_1$1b = __makeTemplateObject(["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n position: relative;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
3078
+ var templateObject_1$1b;
2949
3079
 
2950
- var StyledWrapper$4 = styled__default.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ", "\n\n .link_container {\n margin: 0.5rem 0;\n }\n"], ["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ",
3080
+ var StyledWrapper$3 = styled__default.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ", "\n\n .link_container {\n margin: 0.5rem 0;\n }\n"], ["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ",
2951
3081
  "\n\n .link_container {\n margin: 0.5rem 0;\n }\n"])), function (_a) {
2952
3082
  var palette = _a.theme.palette;
2953
3083
  return palette.white[100];
2954
3084
  }, function (props) {
2955
3085
  if (props.active) {
2956
- return styled.css(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
3086
+ return styled.css(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
2957
3087
  }
2958
3088
  return undefined;
2959
3089
  });
@@ -2964,30 +3094,30 @@ var Action = styled__default.p(templateObject_4$c || (templateObject_4$c = __mak
2964
3094
  }
2965
3095
  return undefined;
2966
3096
  });
2967
- var ActionsPopUp = function (props) { return (React__default.createElement(StyledWrapper$4, { active: props.active }, props.actions.map(function (a, ai) { return (React__default.createElement("div", { key: ai, className: 'link_container' },
3097
+ var ActionsPopUp = function (props) { return (React__default.createElement(StyledWrapper$3, { active: props.active }, props.actions.map(function (a, ai) { return (React__default.createElement("div", { key: ai, className: 'link_container' },
2968
3098
  React__default.createElement(Action, { className: 'action', key: ai, onClick: function (e) {
2969
3099
  e.preventDefault();
2970
3100
  a.action(props.element, props.selectedRows);
2971
3101
  props.handlePopUpVisibility(undefined);
2972
3102
  }, color: a.color }, a.label))); }))); };
2973
- var templateObject_1$14, templateObject_2$w, templateObject_3$i, templateObject_4$c;
3103
+ var templateObject_1$1c, templateObject_2$y, templateObject_3$i, templateObject_4$c;
2974
3104
 
2975
- var StyledWrapper$5 = styled__default.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ", "\n"], ["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ",
3105
+ var StyledWrapper$4 = styled__default.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ", "\n"], ["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ",
2976
3106
  "\n"])), function (_a) {
2977
3107
  var active = _a.active, palette = _a.theme.palette;
2978
- return styled.css(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n ", "\n &:hover {\n background-color: ", ";\n }\n "], ["\n ",
2979
- "\n &:hover {\n background-color: ", ";\n }\n "])), active && styled.css(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), palette.blue[50], palette.blue[500]), palette.blue[50]);
3108
+ return styled.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n ", "\n &:hover {\n background-color: ", ";\n }\n "], ["\n ",
3109
+ "\n &:hover {\n background-color: ", ";\n }\n "])), active && styled.css(templateObject_1$1d || (templateObject_1$1d = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), palette.blue[50], palette.blue[500]), palette.blue[50]);
2980
3110
  });
2981
- var ActionsPopUpButton = function (props) { return (React__default.createElement(StyledWrapper$5, { active: props.active, onClick: function () { return props.handlePopUpVisibility(props.rowId); } },
3111
+ var ActionsPopUpButton = function (props) { return (React__default.createElement(StyledWrapper$4, { active: props.active, onClick: function () { return props.handlePopUpVisibility(props.rowId); } },
2982
3112
  React__default.createElement(Icon, { icon: proSolidSvgIcons.faEllipsisH }))); };
2983
- var templateObject_1$15, templateObject_2$x, templateObject_3$j;
3113
+ var templateObject_1$1d, templateObject_2$z, templateObject_3$j;
2984
3114
 
2985
- var ActionsPopUpUnderlay = styled__default.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ", "\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ",
3115
+ var ActionsPopUpUnderlay = styled__default.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ", "\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ",
2986
3116
  "\n"])), function (_a) {
2987
3117
  var active = _a.active;
2988
- return active && styled.css(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
3118
+ return active && styled.css(templateObject_1$1e || (templateObject_1$1e = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
2989
3119
  });
2990
- var templateObject_1$16, templateObject_2$y;
3120
+ var templateObject_1$1e, templateObject_2$A;
2991
3121
 
2992
3122
  var RowDesktop = function (_a) {
2993
3123
  var actions = _a.actions, controlledProperties = _a.controlledProperties, currentActionsPopUp = _a.currentActionsPopUp, disableSelection = _a.disableSelection, element = _a.element, handlePopUpVisibility = _a.handlePopUpVisibility, handleSelection = _a.handleSelection, index = _a.index, selectedList = _a.selectedList;
@@ -3018,13 +3148,13 @@ var RowDesktop = function (_a) {
3018
3148
  React__default.createElement("td", null)));
3019
3149
  };
3020
3150
 
3021
- var StyledWrapper$6 = styled__default.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n ", "\n"], ["\n ",
3151
+ var StyledWrapper$5 = styled__default.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n ", "\n"], ["\n ",
3022
3152
  "\n"])), function (_a) {
3023
3153
  var show = _a.show, palette = _a.theme.palette;
3024
- return styled.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ", "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "], ["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ",
3025
- "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "])), show && styled.css(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n "], ["\n display: flex;\n align-items: center;\n justify-content: center;\n "]))), palette.blue[500], palette.white[100], palette.white[100], palette.grey[50], palette.grey[150], palette.grey[100]);
3154
+ return styled.css(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ", "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "], ["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ",
3155
+ "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "])), show && styled.css(templateObject_1$1f || (templateObject_1$1f = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n "], ["\n display: flex;\n align-items: center;\n justify-content: center;\n "]))), palette.blue[500], palette.white[100], palette.white[100], palette.grey[50], palette.grey[150], palette.grey[100]);
3026
3156
  });
3027
- var templateObject_1$17, templateObject_2$z, templateObject_3$k;
3157
+ var templateObject_1$1f, templateObject_2$B, templateObject_3$k;
3028
3158
 
3029
3159
  var getItemStyle = function (snapshot, draggableStyle) {
3030
3160
  return __assign({ userSelect: 'none', padding: '0.5rem 0 0.5rem 0', outline: "none" }, draggableStyle);
@@ -3097,7 +3227,7 @@ var CustomizationsModal = /** @class */ (function (_super) {
3097
3227
  var _this = this;
3098
3228
  var _a = this.props, close = _a.close, modifyControlledPropertiesHandler = _a.modifyControlledPropertiesHandler, properties = _a.properties, show = _a.show, title = _a.title;
3099
3229
  var localProperties = this.state.localProperties;
3100
- return (React__default.createElement(StyledWrapper$6, { show: show },
3230
+ return (React__default.createElement(StyledWrapper$5, { show: show },
3101
3231
  React__default.createElement("div", { className: 'modal__container' },
3102
3232
  React__default.createElement("div", { className: 'modal__header' },
3103
3233
  React__default.createElement("div", null, title),
@@ -3122,7 +3252,7 @@ var CustomizationsModal = /** @class */ (function (_super) {
3122
3252
  return CustomizationsModal;
3123
3253
  }(React.Component));
3124
3254
 
3125
- var LoadingTableRow = styled__default.tr(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n height: 49px;\n"], ["\n height: 49px;\n"])));
3255
+ var LoadingTableRow = styled__default.tr(templateObject_1$1g || (templateObject_1$1g = __makeTemplateObject(["\n height: 49px;\n"], ["\n height: 49px;\n"])));
3126
3256
  var LoadingContent = function (props) {
3127
3257
  // Loading elments for the table
3128
3258
  var renderElements = function () {
@@ -3142,7 +3272,7 @@ var LoadingContent = function (props) {
3142
3272
  };
3143
3273
  return React__default.createElement(React__default.Fragment, null, renderElements());
3144
3274
  };
3145
- var templateObject_1$18;
3275
+ var templateObject_1$1g;
3146
3276
 
3147
3277
  var Pagination$1 = function (props) {
3148
3278
  var managedCurrentPage = props.currentPage;
@@ -3309,7 +3439,7 @@ var StyledTableWrapper = styled__default(UnstyledTable)(templateObject_7$6 || (t
3309
3439
  "\n z-index: 3;\n border-bottom: 2px solid ", ";\n background-color: ", ";\n color: ", ";\n font-weight: 500;\n border-right: 2px solid ", ";\n\n ",
3310
3440
  "\n &:last-child {\n cursor: pointer;\n color: ", ";\n }\n &:last-child,\n &:nth-last-child(2) {\n width: 1px;\n padding: 0 1rem;\n }\n\n div {\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n }\n }\n\n tbody {\n tr {\n &.selected {\n background-color: ", ";\n &:hover {\n background-color: ", ";\n }\n }\n ",
3311
3441
  "\n ",
3312
- "\n }\n }\n "])), isHeaderFixed && styled.css(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject(["\n position: sticky;\n top: 0;\n "], ["\n position: sticky;\n top: 0;\n "]))), palette.grey[200], palette.grey[50], palette.grey[500], palette.grey[100], !disableSelection && styled.css(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "], ["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "]))), palette.black, palette.yellow[50], palette.yellow[100], !isLoading && styled.css(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n "], ["\n &:hover {\n background-color: ", ";\n }\n "])), palette.grey[100]), !disableSelection && styled.css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n }\n "], ["\n &:first-child {\n width: 20px;\n }\n "]))));
3442
+ "\n }\n }\n "])), isHeaderFixed && styled.css(templateObject_1$1h || (templateObject_1$1h = __makeTemplateObject(["\n position: sticky;\n top: 0;\n "], ["\n position: sticky;\n top: 0;\n "]))), palette.grey[200], palette.grey[50], palette.grey[500], palette.grey[100], !disableSelection && styled.css(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "], ["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "]))), palette.black, palette.yellow[50], palette.yellow[100], !isLoading && styled.css(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n "], ["\n &:hover {\n background-color: ", ";\n }\n "])), palette.grey[100]), !disableSelection && styled.css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n }\n "], ["\n &:first-child {\n width: 20px;\n }\n "]))));
3313
3443
  }, function (_a) {
3314
3444
  var palette = _a.theme.palette;
3315
3445
  return palette.blue[500];
@@ -3317,11 +3447,11 @@ var StyledTableWrapper = styled__default(UnstyledTable)(templateObject_7$6 || (t
3317
3447
  var palette = _a.theme.palette;
3318
3448
  return styled.css(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ", "\n "], ["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ", "\n "])), palette.grey[700], palette.white[100], palette.grey[700], linearBackground());
3319
3449
  }, spacing.xxxl);
3320
- var templateObject_1$19, templateObject_2$A, templateObject_3$l, templateObject_4$d, templateObject_5$8, templateObject_6$6, templateObject_7$6;
3450
+ var templateObject_1$1h, templateObject_2$C, templateObject_3$l, templateObject_4$d, templateObject_5$8, templateObject_6$6, templateObject_7$6;
3321
3451
 
3322
3452
  var Table = function (props) { return React__default.createElement(StyledTableWrapper, __assign({}, props)); };
3323
3453
 
3324
- var ActiveTag = styled__default.span(templateObject_1$1a || (templateObject_1$1a = __makeTemplateObject(["\n background: ", ";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"], ["\n background: ", ";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"])), function (_a) {
3454
+ var ActiveTag = styled__default.span(templateObject_1$1i || (templateObject_1$1i = __makeTemplateObject(["\n background: ", ";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"], ["\n background: ", ";\n width: 100%;\n height: 4px;\n margin-top: 6px;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"])), function (_a) {
3325
3455
  var active = _a.active, theme = _a.theme;
3326
3456
  return (active ? theme.palette.primary[500] : 'transparent');
3327
3457
  }, function (_a) {
@@ -3331,30 +3461,30 @@ var ActiveTag = styled__default.span(templateObject_1$1a || (templateObject_1$1a
3331
3461
  var active = _a.active, theme = _a.theme;
3332
3462
  return (active ? theme.palette.primary[500] : theme.palette.grey[900]);
3333
3463
  });
3334
- var templateObject_1$1a;
3464
+ var templateObject_1$1i;
3335
3465
 
3336
- var Tab = styled__default.span(templateObject_1$1b || (templateObject_1$1b = __makeTemplateObject(["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"], ["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"])), function (_a) {
3466
+ var Tab = styled__default.span(templateObject_1$1j || (templateObject_1$1j = __makeTemplateObject(["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"], ["\n font-family: 'Inter UI', sans-serif;\n font-style: normal;\n font-size: 14px;\n font-weight: 500;\n line-height: 21px;\n\n align-items: center;\n display: flex;\n\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n"])), function (_a) {
3337
3467
  var active = _a.active, theme = _a.theme;
3338
3468
  return (active ? theme.palette.primary[500] : theme.palette.grey[500]);
3339
3469
  }, function (_a) {
3340
3470
  var active = _a.active, theme = _a.theme;
3341
3471
  return (active ? theme.palette.primary[500] : theme.palette.grey[900]);
3342
3472
  });
3343
- var templateObject_1$1b;
3473
+ var templateObject_1$1j;
3344
3474
 
3345
3475
  var Item$1 = function (_a) {
3346
3476
  var active = _a.active, handleClick = _a.handleClick, tabRef = _a.tabRef, text = _a.text;
3347
- return (React__default.createElement(ItemWrapper, { ref: tabRef, onClick: handleClick },
3477
+ return (React__default.createElement(ItemWrapper, { ref: tabRef === null || tabRef === void 0 ? void 0 : tabRef(), onClick: handleClick },
3348
3478
  React__default.createElement(Tab, { active: active }, text),
3349
3479
  React__default.createElement(ActiveTag, { active: active })));
3350
3480
  };
3351
- var ItemWrapper = styled__default.div(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"], ["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"])));
3352
- var templateObject_1$1c;
3481
+ var ItemWrapper = styled__default.div(templateObject_1$1k || (templateObject_1$1k = __makeTemplateObject(["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"], ["\n cursor: pointer;\n flex-shrink: 0;\n position: relative;\n padding: 0;\n display: flex;\n flex-direction: column;\n"])));
3482
+ var templateObject_1$1k;
3353
3483
 
3354
- var TabsWrapper = styled__default.div(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ", ";\n\n & > *:first-child {\n padding-left: ", "px;\n }\n\n & > *:last-child {\n padding-right: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"], ["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ",
3484
+ var TabsWrapper = styled__default.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ", ";\n\n & > *:first-child {\n padding-left: ", "px;\n }\n\n & > *:last-child {\n padding-right: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"], ["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ",
3355
3485
  ";\n\n & > *:first-child {\n padding-left: ", "px;\n }\n\n & > *:last-child {\n padding-right: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"])), function (_a) {
3356
3486
  var hidden = _a.hidden;
3357
- return hidden && styled.css(templateObject_1$1d || (templateObject_1$1d = __makeTemplateObject(["\n visibility: hidden;\n position: absolute;\n "], ["\n visibility: hidden;\n position: absolute;\n "])));
3487
+ return hidden && styled.css(templateObject_1$1l || (templateObject_1$1l = __makeTemplateObject(["\n visibility: hidden;\n position: absolute;\n "], ["\n visibility: hidden;\n position: absolute;\n "])));
3358
3488
  }, function (_a) {
3359
3489
  var lateralPadding = _a.lateralPadding;
3360
3490
  return lateralPadding;
@@ -3366,7 +3496,7 @@ var TabsWrapper = styled__default.div(templateObject_2$B || (templateObject_2$B
3366
3496
  return distance;
3367
3497
  });
3368
3498
  var ScrollableTabsWrapper = styled__default(TabsWrapper)(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"], ["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"])));
3369
- var templateObject_1$1d, templateObject_2$B, templateObject_3$m;
3499
+ var templateObject_1$1l, templateObject_2$D, templateObject_3$m;
3370
3500
 
3371
3501
  var useResizedWidth = function () {
3372
3502
  var _a = reactUse.useMeasure(), elementsWrapperRef = _a[0], wrapperTmpWidth = _a[1].width;
@@ -3399,8 +3529,8 @@ var TabsDropdownTrigger = function (_a) {
3399
3529
  var active = _a.active;
3400
3530
  return (React__default.createElement(Item$1, { active: active, text: React__default.createElement(DropdownIcon, { icon: proLightSvgIcons.faEllipsisH, fixedWidth: true }) }));
3401
3531
  };
3402
- var DropdownIcon = styled__default(Icon)(templateObject_1$1e || (templateObject_1$1e = __makeTemplateObject(["\n height: 21px;\n"], ["\n height: 21px;\n"])));
3403
- var templateObject_1$1e;
3532
+ var DropdownIcon = styled__default(Icon)(templateObject_1$1m || (templateObject_1$1m = __makeTemplateObject(["\n height: 21px;\n"], ["\n height: 21px;\n"])));
3533
+ var templateObject_1$1m;
3404
3534
 
3405
3535
  var TabsDropdown = function (_a) {
3406
3536
  var active = _a.active, tabs = _a.tabs;
@@ -3414,14 +3544,21 @@ var TabsDropdown = function (_a) {
3414
3544
  }))); }, [tabs]);
3415
3545
  return React__default.createElement(Dropdown$2, { placement: 'bottom-end', fullWidth: true, renderTrigger: renderTrigger, renderContent: renderContent });
3416
3546
  };
3417
- var Dropdown$2 = styled__default(Dropdown)(templateObject_1$1f || (templateObject_1$1f = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
3418
- var templateObject_1$1f;
3547
+ var Dropdown$2 = styled__default(Dropdown)(templateObject_1$1n || (templateObject_1$1n = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
3548
+ var templateObject_1$1n;
3419
3549
 
3420
3550
  var DropdownTabs = function (_a) {
3421
3551
  var className = _a.className, _b = _a.distance, distance = _b === void 0 ? 15 : _b, _c = _a.lateralPadding, lateralPadding = _c === void 0 ? 23 : _c, tabs = _a.tabs;
3422
3552
  var _d = useResizedWidth(), elementsWrapperRef = _d.elementsWrapperRef, wrapperWidth = _d.wrapperWidth;
3553
+ var _e = React.useState(0), refresh = _e[1];
3423
3554
  var tabsLength = tabs.length;
3424
3555
  var tabsRefs = React.useMemo(function () { return Array.from(Array(tabsLength), function () { return React__default.createRef(); }); }, [tabsLength]);
3556
+ var cbRef = React.useMemo(function () {
3557
+ return tabsRefs.map(function (ref) { return function () {
3558
+ refresh(function (n) { return n + 1; });
3559
+ return ref;
3560
+ }; });
3561
+ }, [tabsRefs]);
3425
3562
  var visibleCount = useTabItemsCount({
3426
3563
  distance: distance,
3427
3564
  tabsLength: tabsLength,
@@ -3429,7 +3566,7 @@ var DropdownTabs = function (_a) {
3429
3566
  tabsRefs: tabsRefs,
3430
3567
  lateralPadding: lateralPadding,
3431
3568
  }).visibleCount;
3432
- var tabsItems = React.useMemo(function () { return tabs.map(function (attrs, i) { return React__default.createElement(Item$1, __assign({ key: i, tabRef: tabsRefs[i] }, attrs)); }); }, [tabs, tabsRefs]);
3569
+ var tabsItems = React.useMemo(function () { return tabs.map(function (attrs, i) { return React__default.createElement(Item$1, __assign({ key: i, tabRef: cbRef[i] }, attrs)); }); }, [tabs, tabsRefs]);
3433
3570
  var visibleItems = React.useMemo(function () { return tabs.slice(0, visibleCount).map(function (attrs, i) { return React__default.createElement(Item$1, __assign({ key: i }, attrs)); }); }, [tabs, visibleCount]);
3434
3571
  var dropdownItems = React.useMemo(function () { return tabs.slice(visibleCount); }, [tabs, visibleCount]);
3435
3572
  var dropdownVisible = dropdownItems.length !== 0;
@@ -3442,8 +3579,8 @@ var DropdownTabs = function (_a) {
3442
3579
  dropdownVisible && React__default.createElement(TabsDropdown, { active: dropdownActive, tabs: dropdownItems }))));
3443
3580
  };
3444
3581
  // Remove scrollbar on ScrollableWrapper used until real DropdownTabs is loaded
3445
- var StyledScrollableWrapper = styled__default(ScrollableTabsWrapper)(templateObject_1$1g || (templateObject_1$1g = __makeTemplateObject(["\n overflow-x: hidden;\n"], ["\n overflow-x: hidden;\n"])));
3446
- var templateObject_1$1g;
3582
+ var StyledScrollableWrapper = styled__default(ScrollableTabsWrapper)(templateObject_1$1o || (templateObject_1$1o = __makeTemplateObject(["\n overflow-x: hidden;\n"], ["\n overflow-x: hidden;\n"])));
3583
+ var templateObject_1$1o;
3447
3584
 
3448
3585
  var ScrollableTabs = function (_a) {
3449
3586
  var className = _a.className, _b = _a.distance, distance = _b === void 0 ? 15 : _b, _c = _a.lateralPadding, lateralPadding = _c === void 0 ? 23 : _c, tabs = _a.tabs;
@@ -3456,19 +3593,19 @@ var TextButton = function (_a) {
3456
3593
  var callback = React.useCallback(function () {
3457
3594
  !isDisabled && onClick();
3458
3595
  }, [isDisabled, onClick]);
3459
- return (React__default.createElement(Wrapper$e, __assign({ isDisabled: isDisabled, onClick: callback }, rest), text));
3596
+ return (React__default.createElement(Wrapper$l, __assign({ isDisabled: isDisabled, onClick: callback }, rest), text));
3460
3597
  };
3461
3598
  var getColorIntensity = function (color) { return (color === 'white' ? 100 : 500); };
3462
- var enabledCss = function (theme, color) { return styled.css(templateObject_1$1h || (templateObject_1$1h = __makeTemplateObject(["\n color: ", ";\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n"], ["\n color: ", ";\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n"])), theme.palette[color !== null && color !== void 0 ? color : 'primary'][getColorIntensity(color)]); };
3463
- var disabledCss = styled.css(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n color: ", ";\n cursor: default;\n text-decoration: none;\n"], ["\n color: ", ";\n cursor: default;\n text-decoration: none;\n"])), function (_a) {
3599
+ var enabledCss = function (theme, color) { return styled.css(templateObject_1$1p || (templateObject_1$1p = __makeTemplateObject(["\n color: ", ";\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n"], ["\n color: ", ";\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n"])), theme.palette[color !== null && color !== void 0 ? color : 'primary'][getColorIntensity(color)]); };
3600
+ var disabledCss = styled.css(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n color: ", ";\n cursor: default;\n text-decoration: none;\n"], ["\n color: ", ";\n cursor: default;\n text-decoration: none;\n"])), function (_a) {
3464
3601
  var theme = _a.theme;
3465
3602
  return theme.palette.grey[500];
3466
3603
  });
3467
- var Wrapper$e = styled__default.div(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
3604
+ var Wrapper$l = styled__default.div(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
3468
3605
  var color = _a.color, isDisabled = _a.isDisabled, theme = _a.theme;
3469
3606
  return (isDisabled ? disabledCss : enabledCss(theme, color));
3470
3607
  });
3471
- var templateObject_1$1h, templateObject_2$C, templateObject_3$n;
3608
+ var templateObject_1$1p, templateObject_2$E, templateObject_3$n;
3472
3609
 
3473
3610
  var ThemeProvider = function (_a) {
3474
3611
  var children = _a.children, theme = _a.theme;
@@ -3476,20 +3613,20 @@ var ThemeProvider = function (_a) {
3476
3613
  React__default.createElement(React__default.Fragment, null, children)));
3477
3614
  };
3478
3615
 
3479
- var StyledTip = styled__default.div(templateObject_1$1i || (templateObject_1$1i = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"], ["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"])), function (_a) {
3616
+ var StyledTip = styled__default.div(templateObject_1$1q || (templateObject_1$1q = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"], ["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"])), function (_a) {
3480
3617
  var palette = _a.theme.palette;
3481
3618
  return palette.white[100];
3482
3619
  }, function (_a) {
3483
3620
  var palette = _a.theme.palette;
3484
3621
  return palette.primary[400];
3485
3622
  });
3486
- var StyledLeftIcon = styled__default.span(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n margin-right: 8px;\n font-size: 20px;\n"], ["\n margin-right: 8px;\n font-size: 20px;\n"])));
3623
+ var StyledLeftIcon = styled__default.span(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n margin-right: 8px;\n font-size: 20px;\n"], ["\n margin-right: 8px;\n font-size: 20px;\n"])));
3487
3624
  var StyledText = styled__default.span(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 21px;\n white-space: nowrap;\n"], ["\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 21px;\n white-space: nowrap;\n"])));
3488
3625
  var StyledCloseIcon$1 = styled__default.div(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ", ";\n }\n"], ["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ", ";\n }\n"])), function (_a) {
3489
3626
  var palette = _a.theme.palette;
3490
3627
  return palette.white[100];
3491
3628
  });
3492
- var templateObject_1$1i, templateObject_2$D, templateObject_3$o, templateObject_4$e;
3629
+ var templateObject_1$1q, templateObject_2$F, templateObject_3$o, templateObject_4$e;
3493
3630
 
3494
3631
  var defaultCloseIcon$1 = {
3495
3632
  icon: proSolidSvgIcons.faTimes,
@@ -3514,14 +3651,14 @@ var ShortcutTip = function (props) {
3514
3651
  React__default.createElement("b", null, shortcut)), leftIcon: rocketIcon }, rest)));
3515
3652
  };
3516
3653
 
3517
- var StyledIconDiv = styled__default.div(templateObject_1$1j || (templateObject_1$1j = __makeTemplateObject(["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"], ["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"])));
3518
- var StyledIcon$8 = styled__default(Icon)(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n vertical-align: sub;\n"], ["\n vertical-align: sub;\n"])));
3654
+ var StyledIconDiv = styled__default.div(templateObject_1$1r || (templateObject_1$1r = __makeTemplateObject(["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"], ["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"])));
3655
+ var StyledIcon$8 = styled__default(Icon)(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n vertical-align: sub;\n"], ["\n vertical-align: sub;\n"])));
3519
3656
  var StyledTitle$1 = styled__default.div(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n display: inline-block;\n height: 24px;\n margin-left: 8px;\n margin-right: 16px;\n margin-top: 16px;\n font-weight: 500;\n width: 256px;\n"], ["\n display: inline-block;\n height: 24px;\n margin-left: 8px;\n margin-right: 16px;\n margin-top: 16px;\n font-weight: 500;\n width: 256px;\n"])));
3520
3657
  var StyledContent$1 = styled__default.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"], ["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"])));
3521
3658
  var StyledAction = styled__default.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"], ["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"])));
3522
3659
  var StyledToast = styled__default.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"], ["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"])));
3523
3660
  var StyledActionLabel = styled__default.label(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
3524
- var templateObject_1$1j, templateObject_2$E, templateObject_3$p, templateObject_4$f, templateObject_5$9, templateObject_6$7, templateObject_7$7;
3661
+ var templateObject_1$1r, templateObject_2$G, templateObject_3$p, templateObject_4$f, templateObject_5$9, templateObject_6$7, templateObject_7$7;
3525
3662
 
3526
3663
  var typeMap$2 = {
3527
3664
  standard: 'dark',
@@ -3573,8 +3710,8 @@ var ToastContainer = styled__default(reactToastify.ToastContainer).attrs({
3573
3710
  closeOnClick: false,
3574
3711
  draggable: false,
3575
3712
  rtl: false,
3576
- })(templateObject_1$1k || (templateObject_1$1k = __makeTemplateObject(["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"], ["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"])));
3577
- var templateObject_1$1k;
3713
+ })(templateObject_1$1s || (templateObject_1$1s = __makeTemplateObject(["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"], ["\n &.Toastify__toast-container {\n z-index: 20000;\n -webkit-transform: translate3d(0, 0, 9999px);\n position: fixed;\n padding: 0px;\n width: 320px;\n box-sizing: border-box;\n color: #fff;\n }\n &.Toastify__toast-container--top-left {\n top: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--top-center {\n top: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--top-right {\n top: 1em;\n right: 1em;\n }\n &.Toastify__toast-container--bottom-left {\n bottom: 1em;\n left: 1em;\n }\n &.Toastify__toast-container--bottom-center {\n bottom: 1em;\n left: 50%;\n transform: translateX(-50%);\n }\n &.Toastify__toast-container--bottom-right {\n bottom: 1em;\n right: 1em;\n }\n\n @media only screen and (max-width: 480px) {\n &.Toastify__toast-container {\n width: 100vw;\n padding: 0;\n left: 0;\n margin: 0;\n }\n &.Toastify__toast-container--top-left,\n &.Toastify__toast-container--top-center,\n &.Toastify__toast-container--top-right {\n top: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--bottom-left,\n &.Toastify__toast-container--bottom-center,\n &.Toastify__toast-container--bottom-right {\n bottom: 0;\n transform: translateX(0);\n }\n &.Toastify__toast-container--rtl {\n right: 0;\n left: initial;\n }\n }\n .Toastify__toast {\n position: relative;\n min-height: 56px;\n box-sizing: border-box;\n margin-bottom: 1rem;\n border-radius: 1px;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-pack: justify;\n justify-content: space-between;\n max-height: 800px;\n overflow: hidden;\n cursor: pointer;\n direction: ltr;\n }\n .Toastify__toast--rtl {\n direction: rtl;\n }\n .Toastify__toast--dark {\n background: #091e42;\n border-radius: 4px;\n }\n .Toastify__toast--default {\n background: #fff;\n color: #aaa;\n }\n .Toastify__toast--info {\n background: #0052cc;\n border-radius: 4px;\n }\n .Toastify__toast--success {\n background: #00875a;\n border-radius: 4px;\n }\n .Toastify__toast--warning {\n background: #ff991f;\n border-radius: 4px;\n }\n .Toastify__toast--error {\n background: #de350b;\n border-radius: 4px;\n }\n .Toastify__toast-body {\n margin: auto 0;\n -ms-flex: 1 1 auto;\n flex: 1 1 auto;\n }\n\n @media only screen and (max-width: 480px) {\n .Toastify__toast {\n margin-bottom: 0;\n }\n }\n .Toastify__close-button {\n color: #fff;\n background: transparent;\n outline: none;\n border: none;\n padding: 0;\n cursor: pointer;\n opacity: 0.7;\n transition: 0.3s ease;\n -ms-flex-item-align: start;\n align-self: flex-start;\n }\n .Toastify__close-button--default {\n color: #000;\n opacity: 0.3;\n }\n .Toastify__close-button > svg {\n fill: currentColor;\n height: 16px;\n width: 14px;\n }\n .Toastify__close-button:hover,\n .Toastify__close-button:focus {\n opacity: 1;\n }\n\n @keyframes Toastify__trackProgress {\n 0% {\n transform: scaleX(1);\n }\n 100% {\n transform: scaleX(0);\n }\n }\n .Toastify__progress-bar {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 5px;\n z-index: 20000;\n opacity: 0.7;\n background-color: rgba(255, 255, 255, 0.7);\n transform-origin: left;\n }\n .Toastify__progress-bar--animated {\n animation: Toastify__trackProgress linear 1 forwards;\n }\n .Toastify__progress-bar--controlled {\n transition: transform 0.2s;\n }\n .Toastify__progress-bar--rtl {\n right: 0;\n left: initial;\n transform-origin: right;\n }\n .Toastify__progress-bar--default {\n background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);\n }\n .Toastify__progress-bar--dark {\n background: #bb86fc;\n }\n @keyframes Toastify__bounceInRight {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(-25px, 0, 0);\n }\n 75% {\n transform: translate3d(10px, 0, 0);\n }\n 90% {\n transform: translate3d(-5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutRight {\n 20% {\n opacity: 1;\n transform: translate3d(-20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInLeft {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(-3000px, 0, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(25px, 0, 0);\n }\n 75% {\n transform: translate3d(-10px, 0, 0);\n }\n 90% {\n transform: translate3d(5px, 0, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutLeft {\n 20% {\n opacity: 1;\n transform: translate3d(20px, 0, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(-2000px, 0, 0);\n }\n }\n @keyframes Toastify__bounceInUp {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n from {\n opacity: 0;\n transform: translate3d(0, 3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n 75% {\n transform: translate3d(0, 10px, 0);\n }\n 90% {\n transform: translate3d(0, -5px, 0);\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__bounceOutUp {\n 20% {\n transform: translate3d(0, -10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, 20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, -2000px, 0);\n }\n }\n @keyframes Toastify__bounceInDown {\n from,\n 60%,\n 75%,\n 90%,\n to {\n animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n }\n 0% {\n opacity: 0;\n transform: translate3d(0, -3000px, 0);\n }\n 60% {\n opacity: 1;\n transform: translate3d(0, 25px, 0);\n }\n 75% {\n transform: translate3d(0, -10px, 0);\n }\n 90% {\n transform: translate3d(0, 5px, 0);\n }\n to {\n transform: none;\n }\n }\n @keyframes Toastify__bounceOutDown {\n 20% {\n transform: translate3d(0, 10px, 0);\n }\n 40%,\n 45% {\n opacity: 1;\n transform: translate3d(0, -20px, 0);\n }\n to {\n opacity: 0;\n transform: translate3d(0, 2000px, 0);\n }\n }\n .Toastify__bounce-enter--top-left,\n .Toastify__bounce-enter--bottom-left {\n animation-name: Toastify__bounceInLeft;\n }\n .Toastify__bounce-enter--top-right,\n .Toastify__bounce-enter--bottom-right {\n animation-name: Toastify__bounceInRight;\n }\n .Toastify__bounce-enter--top-center {\n animation-name: Toastify__bounceInDown;\n }\n .Toastify__bounce-enter--bottom-center {\n animation-name: Toastify__bounceInUp;\n }\n\n .Toastify__bounce-exit--top-left,\n .Toastify__bounce-exit--bottom-left {\n animation-name: Toastify__bounceOutLeft;\n }\n .Toastify__bounce-exit--top-right,\n .Toastify__bounce-exit--bottom-right {\n animation-name: Toastify__bounceOutRight;\n }\n .Toastify__bounce-exit--top-center {\n animation-name: Toastify__bounceOutUp;\n }\n .Toastify__bounce-exit--bottom-center {\n animation-name: Toastify__bounceOutDown;\n }\n\n @keyframes Toastify__zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n @keyframes Toastify__zoomOut {\n from {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n to {\n opacity: 0;\n }\n }\n .Toastify__zoom-enter {\n animation-name: Toastify__zoomIn;\n }\n\n .Toastify__zoom-exit {\n animation-name: Toastify__zoomOut;\n }\n\n @keyframes Toastify__flipIn {\n from {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n animation-timing-function: ease-in;\n opacity: 0;\n }\n 40% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n animation-timing-function: ease-in;\n }\n 60% {\n transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n opacity: 1;\n }\n 80% {\n transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n }\n to {\n transform: perspective(400px);\n }\n }\n @keyframes Toastify__flipOut {\n from {\n transform: perspective(400px);\n }\n 30% {\n transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n opacity: 1;\n }\n to {\n transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n opacity: 0;\n }\n }\n .Toastify__flip-enter {\n animation-name: Toastify__flipIn;\n }\n\n .Toastify__flip-exit {\n animation-name: Toastify__flipOut;\n }\n\n @keyframes Toastify__slideInRight {\n from {\n transform: translate3d(110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInLeft {\n from {\n transform: translate3d(-110%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInUp {\n from {\n transform: translate3d(0, 110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideInDown {\n from {\n transform: translate3d(0, -110%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n @keyframes Toastify__slideOutRight {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutLeft {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(-110%, 0, 0);\n }\n }\n @keyframes Toastify__slideOutDown {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, 500px, 0);\n }\n }\n @keyframes Toastify__slideOutUp {\n from {\n transform: translate3d(0, 0, 0);\n }\n to {\n visibility: hidden;\n transform: translate3d(0, -500px, 0);\n }\n }\n .Toastify__slide-enter--top-left,\n .Toastify__slide-enter--bottom-left {\n animation-name: Toastify__slideInLeft;\n }\n .Toastify__slide-enter--top-right,\n .Toastify__slide-enter--bottom-right {\n animation-name: Toastify__slideInRight;\n }\n .Toastify__slide-enter--top-center {\n animation-name: Toastify__slideInDown;\n }\n .Toastify__slide-enter--bottom-center {\n animation-name: Toastify__slideInUp;\n }\n\n .Toastify__slide-exit--top-left,\n .Toastify__slide-exit--bottom-left {\n animation-name: Toastify__slideOutLeft;\n }\n .Toastify__slide-exit--top-right,\n .Toastify__slide-exit--bottom-right {\n animation-name: Toastify__slideOutRight;\n }\n .Toastify__slide-exit--top-center {\n animation-name: Toastify__slideOutUp;\n }\n .Toastify__slide-exit--bottom-center {\n animation-name: Toastify__slideOutDown;\n }\n\n /*# sourceMappingURL=ReactToastify.css.map */\n"])));
3714
+ var templateObject_1$1s;
3578
3715
 
3579
3716
  var Toast = {
3580
3717
  Container: ToastContainer,
@@ -3588,6 +3725,8 @@ var Toast = {
3588
3725
  };
3589
3726
 
3590
3727
  exports.Accordion = Accordion;
3728
+ exports.AsyncCreatableSelect = AsyncCreatableSelect;
3729
+ exports.AsyncSelect = AsyncSelect;
3591
3730
  exports.Avatar = Avatar;
3592
3731
  exports.Badge = Badge;
3593
3732
  exports.Banner = Banner;
@@ -3595,6 +3734,7 @@ exports.Button = Button;
3595
3734
  exports.Checkbox = Checkbox;
3596
3735
  exports.Chip = Chip;
3597
3736
  exports.ConfirmationModal = ConfirmationModal;
3737
+ exports.CreatableSelect = CreatableSelect;
3598
3738
  exports.Drawer = Drawer;
3599
3739
  exports.Dropdown = Dropdown;
3600
3740
  exports.DropdownTabs = DropdownTabs;
@@ -3616,8 +3756,6 @@ exports.RadioButton = RadioButton;
3616
3756
  exports.RadioButtonGroup = RadioButtonGroup;
3617
3757
  exports.ScrollableTabs = ScrollableTabs;
3618
3758
  exports.Select = Select;
3619
- exports.SelectAsync = SelectAsync;
3620
- exports.SelectCreatable = SelectCreatable;
3621
3759
  exports.ShortcutTip = ShortcutTip;
3622
3760
  exports.SidebarItem = SidebarItem;
3623
3761
  exports.Stepper = Stepper;