@fattureincloud/fic-design-system 0.3.19 → 0.3.20
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/buttons/button/styled.d.ts +2 -2
- package/dist/components/dropdown/components/Item.d.ts +1 -1
- package/dist/components/form/inputHelper/InputHelper.d.ts +2 -2
- package/dist/components/form/select/Select.d.ts +6 -0
- package/dist/components/form/select/SelectInputParts.d.ts +13 -0
- package/dist/components/form/select/SelectWrapper.d.ts +12 -0
- package/dist/components/form/select/components/ClearIndicator.d.ts +3 -0
- package/dist/components/form/select/components/Control.d.ts +3 -0
- package/dist/components/form/select/components/DropdownIndicator.d.ts +3 -0
- package/dist/components/form/select/components/FooterActions.d.ts +11 -0
- package/dist/components/form/select/components/MenuList.d.ts +3 -0
- package/dist/components/form/select/components/Option.d.ts +14 -0
- package/dist/components/form/select/components/Placeholder.d.ts +3 -0
- package/dist/components/form/select/components/types.d.ts +10 -0
- package/dist/components/form/select/components.d.ts +2 -0
- package/dist/components/form/select/hooks/useSelectThemeStyles.d.ts +13 -0
- package/dist/components/form/select/index.d.ts +5 -0
- package/dist/components/form/select/originalComponents.d.ts +6 -0
- package/dist/components/form/select/select.stories.d.ts +1 -0
- package/dist/components/form/select/selectPalette.d.ts +16 -0
- package/dist/components/form/select/types.d.ts +12 -0
- package/dist/components/form/select/utils.d.ts +7 -0
- package/dist/components/form/textArea/components/CharCounter.d.ts +9 -0
- package/dist/components/form/textArea/components/TextAreaElement.d.ts +2 -2
- package/dist/components/form/textArea/types.d.ts +6 -3
- package/dist/components/icon/Icon.d.ts +1 -0
- package/dist/components/icon/utils.d.ts +2 -2
- package/dist/components/tabs/common/Item.d.ts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.esm.js +391 -255
- package/dist/index.esm.js.map +1 -0
- package/dist/index.js +391 -253
- package/dist/index.js.map +1 -0
- package/dist/styles/theme.d.ts +2 -0
- package/package.json +10 -7
package/dist/index.esm.js
CHANGED
|
@@ -1,17 +1,18 @@
|
|
|
1
|
-
import { faChevronDown, faTimes, faCheck, faMinus, faExclamationTriangle, faTimesCircle, faCheckCircle, faEllipsisH, faCaretRight, faInfoCircle, faSortUp, faSortDown, faSort, faEquals, faInfoSquare } from '@fortawesome/pro-solid-svg-icons';
|
|
2
|
-
import React, {
|
|
3
|
-
import styled, { css,
|
|
1
|
+
import { faChevronDown, faTimes, faCheck, faMinus, faExclamationTriangle, faTimesCircle, faCheckCircle, faCaretDown, faEllipsisH, faCaretRight, faInfoCircle, faSortUp, faSortDown, faSort, faEquals, faInfoSquare } from '@fortawesome/pro-solid-svg-icons';
|
|
2
|
+
import React, { useMemo, Component, useCallback, useRef, useEffect, useState } from 'react';
|
|
3
|
+
import styled, { css, useTheme, createGlobalStyle, ThemeProvider as ThemeProvider$1 } from 'styled-components';
|
|
4
4
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
5
5
|
import { faCircleNotch, faCircle } from '@fortawesome/pro-regular-svg-icons';
|
|
6
6
|
import { usePopper } from 'react-popper';
|
|
7
7
|
import { CSSTransition } from 'react-transition-group';
|
|
8
8
|
import { useClickAway, useMeasure, useDebounce } from 'react-use';
|
|
9
|
+
import ReactSelect, { components as components$1 } from 'react-select';
|
|
10
|
+
import Async from 'react-select/async';
|
|
11
|
+
import AsyncCreatable from 'react-select/async-creatable';
|
|
12
|
+
import Creatable from 'react-select/creatable';
|
|
9
13
|
import { faTimes as faTimes$1, faSearch, faEllipsisH as faEllipsisH$1 } from '@fortawesome/pro-light-svg-icons';
|
|
10
14
|
import ReactModal from 'react-modal';
|
|
11
15
|
import range from 'lodash/range';
|
|
12
|
-
import ReactSelect from 'react-select';
|
|
13
|
-
import AsyncSelect from 'react-select/async';
|
|
14
|
-
import CreatableSelect from 'react-select/creatable';
|
|
15
16
|
import _ from 'lodash';
|
|
16
17
|
import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
|
|
17
18
|
import { faRocket } from '@fortawesome/pro-duotone-svg-icons';
|
|
@@ -305,12 +306,12 @@ var getIconStyles = function (_a) {
|
|
|
305
306
|
|
|
306
307
|
var Icon = function (_a) {
|
|
307
308
|
var onClick = _a.onClick, isDisabled = _a.isDisabled, props = __rest(_a, ["onClick", "isDisabled"]);
|
|
308
|
-
var handleClick =
|
|
309
|
+
var handleClick = useMemo(function () { return (isDisabled || !onClick ? undefined : function (e) { return onClick(e); }); }, [isDisabled, onClick]);
|
|
309
310
|
return React.createElement(StyledIcon, __assign({}, props, { onClick: handleClick }));
|
|
310
311
|
};
|
|
311
312
|
var StyledIcon = styled(FontAwesomeIcon).attrs(getIconStyles)(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n cursor: ", ";\n color: ", ";\n --fa-secondary-color: ", ";\n"], ["\n cursor: ", ";\n color: ", ";\n --fa-secondary-color: ", ";\n"])), function (_a) {
|
|
312
|
-
var onClick = _a.onClick
|
|
313
|
-
return (
|
|
313
|
+
var onClick = _a.onClick;
|
|
314
|
+
return (onClick ? 'pointer' : 'inherit');
|
|
314
315
|
}, function (_a) {
|
|
315
316
|
var primary = _a.primary;
|
|
316
317
|
return primary;
|
|
@@ -335,10 +336,7 @@ var iconPalette = {
|
|
|
335
336
|
fuchsia: getColoredIcon('fuchsia'),
|
|
336
337
|
indigo: getColoredIcon('indigo'),
|
|
337
338
|
pink: getColoredIcon('pink'),
|
|
338
|
-
grey:
|
|
339
|
-
primary: defaultPalette.grey[500],
|
|
340
|
-
secondary: defaultPalette.grey[200],
|
|
341
|
-
},
|
|
339
|
+
grey: getColoredIcon('grey'),
|
|
342
340
|
white: {
|
|
343
341
|
primary: defaultPalette.white[100],
|
|
344
342
|
secondary: defaultPalette.white[48],
|
|
@@ -585,7 +583,7 @@ var Button = function (_a) {
|
|
|
585
583
|
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;
|
|
586
584
|
var debounceClick = useDebounceClick({ onClick: onClick, manualLock: isLoading || isDisabled });
|
|
587
585
|
var showLoading = !isDisabled && isLoading;
|
|
588
|
-
var Wrapper = href ? HrefWrapper : OnClickWrapper;
|
|
586
|
+
var Wrapper = useCallback(function (props) { return (href ? React.createElement(HrefWrapper, __assign({}, props)) : React.createElement(OnClickWrapper, __assign({}, props))); }, [href]);
|
|
589
587
|
return (React.createElement(Wrapper, { className: className, size: size, color: color, onClick: debounceClick, href: href, type: type, isDisabled: isDisabled, fullWidth: fullWidth, target: target },
|
|
590
588
|
React.createElement(Content$1, { isLoading: showLoading },
|
|
591
589
|
iconLeft && React.createElement(LeftIcon, __assign({}, iconLeft)),
|
|
@@ -1391,7 +1389,7 @@ var inputHelperPalette = {
|
|
|
1391
1389
|
},
|
|
1392
1390
|
};
|
|
1393
1391
|
|
|
1394
|
-
var ComplexInputWrapper = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n
|
|
1392
|
+
var ComplexInputWrapper = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"], ["\n display: flex;\n flex-flow: column;\n gap: 6px;\n flex: 1;\n"])));
|
|
1395
1393
|
var templateObject_1$o;
|
|
1396
1394
|
|
|
1397
1395
|
var inputTextHTMLLabelBootstrapFixes = css(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"], ["\n cursor: default !important;\n font-weight: 400 !important;\n display: block !important;\n margin-bottom: 0 !important;\n"])));
|
|
@@ -1565,14 +1563,220 @@ var inputTextPalette = {
|
|
|
1565
1563
|
},
|
|
1566
1564
|
};
|
|
1567
1565
|
|
|
1568
|
-
var
|
|
1566
|
+
var ClearIndicator = function (_a) {
|
|
1567
|
+
var isDisabled = _a.isDisabled, clearValue = _a.clearValue;
|
|
1568
|
+
var onClick = useCallback(function () { return !isDisabled && clearValue(); }, [clearValue, isDisabled]);
|
|
1569
|
+
return React.createElement(CaretIcon, { icon: faTimes$1, onClick: onClick });
|
|
1570
|
+
};
|
|
1571
|
+
var CaretIcon = styled(Icon)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n margin: 0.5em;\n"], ["\n margin: 0.5em;\n"])));
|
|
1569
1572
|
var templateObject_1$w;
|
|
1570
1573
|
|
|
1571
|
-
var
|
|
1574
|
+
var Control = function (_a) {
|
|
1575
|
+
var onMouseDown = _a.innerProps.onMouseDown, children = _a.children;
|
|
1576
|
+
return (React.createElement(Wrapper$7, { onMouseDown: onMouseDown }, children));
|
|
1577
|
+
};
|
|
1578
|
+
var Wrapper$7 = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"], ["\n display: flex;\n flex-wrap: initial;\n\n cursor: default;\n"])));
|
|
1579
|
+
var templateObject_1$x;
|
|
1580
|
+
|
|
1581
|
+
var DropdownIndicator = function (_a) {
|
|
1582
|
+
var selectProps = _a.selectProps;
|
|
1583
|
+
return (React.createElement(Wrapper$8, { isRotated: selectProps.menuIsOpen },
|
|
1584
|
+
React.createElement(Icon, { icon: faCaretDown })));
|
|
1585
|
+
};
|
|
1586
|
+
var Wrapper$8 = styled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(", "deg);\n"], ["\n margin: 0.5em;\n\n transition: transform 250ms ease;\n transform: rotate(", "deg);\n"])), function (_a) {
|
|
1587
|
+
var isRotated = _a.isRotated;
|
|
1588
|
+
return (isRotated ? 180 : 0);
|
|
1589
|
+
});
|
|
1590
|
+
var templateObject_1$y;
|
|
1591
|
+
|
|
1592
|
+
var FooterActions = function (_a) {
|
|
1593
|
+
var actions = _a.actions, triggerClose = _a.triggerClose;
|
|
1594
|
+
var mappedActions = useMemo(function () {
|
|
1595
|
+
return actions.map(function (_a, id) {
|
|
1596
|
+
var onClick = _a.onClick, closeOnClick = _a.closeOnClick, rest = __rest(_a, ["onClick", "closeOnClick"]);
|
|
1597
|
+
return (React.createElement(FooterItem, __assign({ key: id, onClick: function (e) {
|
|
1598
|
+
e.stopPropagation();
|
|
1599
|
+
onClick === null || onClick === void 0 ? void 0 : onClick(e);
|
|
1600
|
+
closeOnClick && triggerClose();
|
|
1601
|
+
} }, rest)));
|
|
1602
|
+
});
|
|
1603
|
+
}, [actions]);
|
|
1604
|
+
return React.createElement(Wrapper$9, null, mappedActions);
|
|
1605
|
+
};
|
|
1606
|
+
var Wrapper$9 = styled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n border-top: 1px solid ", ";\n"], ["\n border-top: 1px solid ", ";\n"])), function (_a) {
|
|
1607
|
+
var theme = _a.theme;
|
|
1608
|
+
return theme.palette.grey[100];
|
|
1609
|
+
});
|
|
1610
|
+
var FooterItem = styled(Item)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n padding: 5px 10px;\n"], ["\n padding: 5px 10px;\n"])));
|
|
1611
|
+
var templateObject_1$z, templateObject_2$e;
|
|
1612
|
+
|
|
1613
|
+
var MenuList = function (props) {
|
|
1614
|
+
var setValue = props.setValue, getValue = props.getValue, selectProps = props.selectProps;
|
|
1615
|
+
var children = props.children, rest = __rest(props, ["children"]);
|
|
1616
|
+
var footerActions = selectProps.footerActions;
|
|
1617
|
+
var List = components$1.MenuList;
|
|
1618
|
+
var triggerClose = useCallback(function () { return setValue(getValue(), 'select-option'); }, [getValue, setValue]);
|
|
1619
|
+
return (React.createElement(Wrapper$a, null,
|
|
1620
|
+
React.createElement(List, __assign({}, rest),
|
|
1621
|
+
children,
|
|
1622
|
+
footerActions && React.createElement(FooterActions, { actions: footerActions, triggerClose: triggerClose }))));
|
|
1623
|
+
};
|
|
1624
|
+
var Wrapper$a = styled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject([""], [""])));
|
|
1625
|
+
var templateObject_1$A;
|
|
1626
|
+
|
|
1627
|
+
var Option = function (_a) {
|
|
1628
|
+
var onClick = _a.innerProps.onClick, _b = _a.data, label = _b.label, icon = _b.icon;
|
|
1629
|
+
return (React.createElement(Wrapper$b, { onClick: onClick },
|
|
1630
|
+
icon && React.createElement(Icon, __assign({}, icon)),
|
|
1631
|
+
React.createElement("div", null, label)));
|
|
1632
|
+
};
|
|
1633
|
+
var Wrapper$b = styled.div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ", ";\n }\n"], ["\n height: 32px;\n\n cursor: pointer;\n\n font-size: 14px;\n\n display: flex;\n align-items: center;\n gap: 6px;\n\n padding: 0 10px;\n\n &:hover {\n background: ", ";\n }\n"])), function (_a) {
|
|
1634
|
+
var theme = _a.theme;
|
|
1635
|
+
return theme.palette.grey[100];
|
|
1636
|
+
});
|
|
1637
|
+
var templateObject_1$B;
|
|
1638
|
+
|
|
1639
|
+
var Placeholder = function (_a) {
|
|
1640
|
+
var children = _a.children;
|
|
1641
|
+
return React.createElement(Wrapper$c, null, children);
|
|
1642
|
+
};
|
|
1643
|
+
var Wrapper$c = styled.div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n font-size: 14px;\n color: ", ";\n"], ["\n font-size: 14px;\n color: ", ";\n"])), function (_a) {
|
|
1644
|
+
var theme = _a.theme;
|
|
1645
|
+
return theme.palette.grey[200];
|
|
1646
|
+
});
|
|
1647
|
+
var templateObject_1$C;
|
|
1648
|
+
|
|
1649
|
+
var customComponents = {
|
|
1650
|
+
Option: Option,
|
|
1651
|
+
DropdownIndicator: DropdownIndicator,
|
|
1652
|
+
ClearIndicator: ClearIndicator,
|
|
1653
|
+
Placeholder: Placeholder,
|
|
1654
|
+
Control: Control,
|
|
1655
|
+
MenuList: MenuList,
|
|
1656
|
+
};
|
|
1657
|
+
|
|
1658
|
+
var getSelectStyles = function (_a) {
|
|
1659
|
+
var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
|
|
1660
|
+
var actualStatus = isDisabled ? 'disabled' : status;
|
|
1661
|
+
var styles = theme.components.select[actualStatus];
|
|
1662
|
+
return __assign(__assign({}, styles), { normalFocused: theme.components.select['normalFocused'] });
|
|
1663
|
+
};
|
|
1664
|
+
|
|
1665
|
+
var useSelectThemeStyles = function (_a) {
|
|
1666
|
+
var status = _a.status, isDisabled = _a.isDisabled;
|
|
1667
|
+
var theme = useTheme();
|
|
1668
|
+
var color = getSelectStyles({ theme: theme, status: status, isDisabled: isDisabled }).color;
|
|
1669
|
+
return {
|
|
1670
|
+
singleValue: function (provided) { return (__assign(__assign({}, provided), { color: color, fontSize: '14px' })); },
|
|
1671
|
+
noOptionsMessage: function (base) { return (__assign(__assign({}, base), { fontSize: '14px' })); },
|
|
1672
|
+
};
|
|
1673
|
+
};
|
|
1674
|
+
|
|
1675
|
+
var SelectWrapper = styled.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) {
|
|
1676
|
+
var inputSize = _a.inputSize;
|
|
1677
|
+
return (inputSize === 'large' ? 40 : 30);
|
|
1678
|
+
}, function (_a) {
|
|
1679
|
+
var inputSize = _a.inputSize;
|
|
1680
|
+
return (inputSize === 'large' ? 40 : 30);
|
|
1681
|
+
});
|
|
1682
|
+
var templateObject_1$D;
|
|
1683
|
+
|
|
1684
|
+
var SelectsWrapper = function (_a) {
|
|
1685
|
+
var children = _a.children, rest = __rest(_a, ["children"]);
|
|
1686
|
+
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;
|
|
1687
|
+
return (React.createElement(ComplexInputWrapper, null,
|
|
1688
|
+
React.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
|
|
1689
|
+
React.createElement(SelectWrapper, { isDisabled: isDisabled, status: status, inputSize: inputSize }, children),
|
|
1690
|
+
helper && React.createElement(InputHelper, __assign({}, helper))));
|
|
1691
|
+
};
|
|
1692
|
+
var Select = function (props) {
|
|
1693
|
+
var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
|
|
1694
|
+
var styles = useSelectThemeStyles({ status: status });
|
|
1695
|
+
var customComponents$1 = useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
|
|
1696
|
+
return (React.createElement(SelectsWrapper, null,
|
|
1697
|
+
React.createElement(ReactSelect, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
|
|
1698
|
+
};
|
|
1699
|
+
var CreatableSelect = function (props) {
|
|
1700
|
+
var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
|
|
1701
|
+
var styles = useSelectThemeStyles({ status: status });
|
|
1702
|
+
var customComponents$1 = useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
|
|
1703
|
+
return (React.createElement(SelectsWrapper, null,
|
|
1704
|
+
React.createElement(Creatable, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
|
|
1705
|
+
};
|
|
1706
|
+
var AsyncSelect = function (props) {
|
|
1707
|
+
var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
|
|
1708
|
+
var styles = useSelectThemeStyles({ status: status });
|
|
1709
|
+
var customComponents$1 = useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
|
|
1710
|
+
return (React.createElement(SelectsWrapper, null,
|
|
1711
|
+
React.createElement(Async, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
|
|
1712
|
+
};
|
|
1713
|
+
var AsyncCreatableSelect = function (props) {
|
|
1714
|
+
var _a = props.status, status = _a === void 0 ? 'normal' : _a, components = props.components;
|
|
1715
|
+
var styles = useSelectThemeStyles({ status: status });
|
|
1716
|
+
var customComponents$1 = useMemo(function () { return (__assign(__assign({}, customComponents), components)); }, [components]);
|
|
1717
|
+
return (React.createElement(SelectsWrapper, null,
|
|
1718
|
+
React.createElement(AsyncCreatable, __assign({}, props, { components: customComponents$1, backspaceRemoves: true, styles: styles }))));
|
|
1719
|
+
};
|
|
1720
|
+
|
|
1721
|
+
var selectPalette = {
|
|
1722
|
+
normal: {
|
|
1723
|
+
background: defaultPalette.white[100],
|
|
1724
|
+
color: defaultPalette.black[100],
|
|
1725
|
+
iconColor: defaultPalette.black[100],
|
|
1726
|
+
borderColor: defaultPalette.grey[500],
|
|
1727
|
+
},
|
|
1728
|
+
normalFocused: {
|
|
1729
|
+
background: defaultPalette.white[100],
|
|
1730
|
+
color: defaultPalette.black[100],
|
|
1731
|
+
iconColor: defaultPalette.black[100],
|
|
1732
|
+
borderColor: defaultPalette.blue[300],
|
|
1733
|
+
},
|
|
1734
|
+
success: {
|
|
1735
|
+
background: defaultPalette.green[50],
|
|
1736
|
+
color: defaultPalette.black[100],
|
|
1737
|
+
iconColor: defaultPalette.green[900],
|
|
1738
|
+
borderColor: defaultPalette.green[300],
|
|
1739
|
+
},
|
|
1740
|
+
warning: {
|
|
1741
|
+
background: defaultPalette.yellow[50],
|
|
1742
|
+
color: defaultPalette.black[100],
|
|
1743
|
+
iconColor: defaultPalette.yellow[900],
|
|
1744
|
+
borderColor: defaultPalette.yellow[300],
|
|
1745
|
+
},
|
|
1746
|
+
error: {
|
|
1747
|
+
background: defaultPalette.red[50],
|
|
1748
|
+
color: defaultPalette.black[100],
|
|
1749
|
+
iconColor: defaultPalette.red[900],
|
|
1750
|
+
borderColor: defaultPalette.red[300],
|
|
1751
|
+
},
|
|
1752
|
+
disabled: {
|
|
1753
|
+
background: defaultPalette.grey[100],
|
|
1754
|
+
color: defaultPalette.black[16],
|
|
1755
|
+
iconColor: defaultPalette.black[16],
|
|
1756
|
+
borderColor: 'transparent',
|
|
1757
|
+
},
|
|
1758
|
+
};
|
|
1759
|
+
|
|
1760
|
+
var CharCounter = function (_a) {
|
|
1761
|
+
var length = _a.length, maxLength = _a.maxLength;
|
|
1762
|
+
return (React.createElement(Wrapper$d, null,
|
|
1763
|
+
length,
|
|
1764
|
+
maxLength && "/" + maxLength));
|
|
1765
|
+
};
|
|
1766
|
+
var Wrapper$d = styled.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) {
|
|
1767
|
+
var theme = _a.theme;
|
|
1768
|
+
return theme.palette.grey[500];
|
|
1769
|
+
});
|
|
1770
|
+
var templateObject_1$E;
|
|
1771
|
+
|
|
1772
|
+
var inputTextHTMLTextAreaBootstrapFixes = 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"])));
|
|
1773
|
+
var templateObject_1$F;
|
|
1774
|
+
|
|
1775
|
+
var StyledTextArea = styled.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) {
|
|
1572
1776
|
var theme = _a.theme;
|
|
1573
1777
|
return theme.palette.grey[200];
|
|
1574
1778
|
}, inputTextHTMLTextAreaBootstrapFixes);
|
|
1575
|
-
var templateObject_1$
|
|
1779
|
+
var templateObject_1$G;
|
|
1576
1780
|
|
|
1577
1781
|
var getTextAreaStyles = function (_a) {
|
|
1578
1782
|
var theme = _a.theme, isDisabled = _a.isDisabled, _b = _a.status, status = _b === void 0 ? 'normal' : _b;
|
|
@@ -1582,31 +1786,40 @@ var getTextAreaStyles = function (_a) {
|
|
|
1582
1786
|
};
|
|
1583
1787
|
|
|
1584
1788
|
var TextAreaElement = function (_a) {
|
|
1585
|
-
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;
|
|
1789
|
+
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;
|
|
1586
1790
|
var ref = useRef(null);
|
|
1587
1791
|
var onClick = useCallback(function () { var _a; return (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
|
|
1588
1792
|
var actualValue = (value === null || value === void 0 ? void 0 : value.toString()) || '';
|
|
1589
1793
|
var handleChange = useCallback(function (e) {
|
|
1590
|
-
setValue === null || setValue === void 0 ? void 0 : setValue(e.currentTarget.value);
|
|
1794
|
+
setValue === null || setValue === void 0 ? void 0 : setValue(e.currentTarget.value.slice(0, maxLength || Infinity));
|
|
1591
1795
|
onChange === null || onChange === void 0 ? void 0 : onChange(e);
|
|
1592
|
-
}, [onChange, setValue]);
|
|
1796
|
+
}, [maxLength, onChange, setValue]);
|
|
1797
|
+
useEffect(function () {
|
|
1798
|
+
setValue === null || setValue === void 0 ? void 0 : setValue(value === null || value === void 0 ? void 0 : value.slice(0, maxLength || Infinity));
|
|
1799
|
+
}, [maxLength, setValue, value]);
|
|
1593
1800
|
var handleBlur = useCallback(function (e) {
|
|
1594
1801
|
setValue === null || setValue === void 0 ? void 0 : setValue(e.target.value.trim());
|
|
1595
1802
|
onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
|
|
1596
1803
|
}, [onBlur, setValue]);
|
|
1597
|
-
return (React.createElement(Wrapper$
|
|
1598
|
-
React.createElement(
|
|
1804
|
+
return (React.createElement(Wrapper$e, { onClick: onClick, isDisabled: isDisabled, status: status, className: className, initialHeight: initialHeight, isResizable: isResizable },
|
|
1805
|
+
React.createElement(FlexWrapper, null,
|
|
1806
|
+
React.createElement(StyledTextArea, { ref: ref, autoFocus: autoFocus, value: actualValue, placeholder: placeholder, disabled: isDisabled, name: name, onChange: handleChange, onFocus: onFocus, onBlur: handleBlur, onKeyPress: onKeyPress, onKeyDown: onKeyDown, onKeyUp: onKeyUp }),
|
|
1807
|
+
(showCounter || maxLength) && React.createElement(CharCounter, { length: actualValue.length, maxLength: maxLength }))));
|
|
1599
1808
|
};
|
|
1600
|
-
var
|
|
1809
|
+
var FlexWrapper = styled.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"])));
|
|
1810
|
+
var Wrapper$e = styled.div.attrs(getTextAreaStyles)(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n ", ";\n\n resize: ", ";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ", ";\n"], ["\n ", ";\n\n resize: ", ";\n overflow: hidden;\n\n min-height: 3em;\n\n height: ", ";\n"])), boxedInputWrapperStyle, function (_a) {
|
|
1811
|
+
var isResizable = _a.isResizable;
|
|
1812
|
+
return (isResizable ? 'vertical' : 'none');
|
|
1813
|
+
}, function (_a) {
|
|
1601
1814
|
var initialHeight = _a.initialHeight;
|
|
1602
1815
|
return initialHeight;
|
|
1603
1816
|
});
|
|
1604
|
-
var templateObject_1$
|
|
1817
|
+
var templateObject_1$H, templateObject_2$f;
|
|
1605
1818
|
|
|
1606
1819
|
var TextArea = function (props) {
|
|
1607
|
-
var label = props.label, inputProps = __rest(props, ["label"]);
|
|
1820
|
+
var label = props.label, className = props.className, inputProps = __rest(props, ["label", "className"]);
|
|
1608
1821
|
var isDisabled = props.isDisabled, required = props.required, helper = props.helper;
|
|
1609
|
-
return (React.createElement(ComplexInputWrapper,
|
|
1822
|
+
return (React.createElement(ComplexInputWrapper, { className: className },
|
|
1610
1823
|
React.createElement(Label$1, { label: label, isDisabled: isDisabled, required: required }),
|
|
1611
1824
|
React.createElement(TextAreaElement, __assign({}, inputProps)),
|
|
1612
1825
|
helper && React.createElement(InputHelper, __assign({}, helper))));
|
|
@@ -1720,11 +1933,11 @@ var ItemElement = function (props) {
|
|
|
1720
1933
|
removeEventListener('keydown', handleKeyDown);
|
|
1721
1934
|
}, showActionOnHover: showActionOnHover, "data-grouped-list-item": index },
|
|
1722
1935
|
icon && React.createElement(LeftIcon$1, __assign({}, icon, { fixedWidth: true })),
|
|
1723
|
-
title ? React.createElement(Title$1, null, title) : React.createElement(Placeholder, null, placeholder),
|
|
1936
|
+
title ? React.createElement(Title$1, null, title) : React.createElement(Placeholder$1, null, placeholder),
|
|
1724
1937
|
action && React.createElement(RightElement, null, action)));
|
|
1725
1938
|
};
|
|
1726
|
-
var Title$1 = styled.div(templateObject_1$
|
|
1727
|
-
var Placeholder = styled(Title$1)(templateObject_2$
|
|
1939
|
+
var Title$1 = styled.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"])));
|
|
1940
|
+
var Placeholder$1 = styled(Title$1)(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), function (_a) {
|
|
1728
1941
|
var theme = _a.theme;
|
|
1729
1942
|
return theme.palette.grey[500];
|
|
1730
1943
|
});
|
|
@@ -1751,7 +1964,7 @@ var SingleElement = styled.div(templateObject_7$3 || (templateObject_7$3 = __mak
|
|
|
1751
1964
|
return showActionOnHover
|
|
1752
1965
|
? css(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n ", " {\n display: none;\n }\n\n &:focus {\n ", " {\n display: inherit;\n }\n }\n "], ["\n ", " {\n display: none;\n }\n\n &:focus {\n ", " {\n display: inherit;\n }\n }\n "])), RightElement, RightElement) : css(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject([""], [""])));
|
|
1753
1966
|
});
|
|
1754
|
-
var templateObject_1$
|
|
1967
|
+
var templateObject_1$I, templateObject_2$g, templateObject_3$9, templateObject_4$5, templateObject_5$3, templateObject_6$3, templateObject_7$3;
|
|
1755
1968
|
|
|
1756
1969
|
var TitleElement = function (props) {
|
|
1757
1970
|
var noResults = props.noResults, title = props.title;
|
|
@@ -1759,11 +1972,11 @@ var TitleElement = function (props) {
|
|
|
1759
1972
|
title.toUpperCase(),
|
|
1760
1973
|
noResults && React.createElement(NoResultsWrapper, null, "(nessun risultato)")));
|
|
1761
1974
|
};
|
|
1762
|
-
var TitleElementWrapper = styled.div(templateObject_2$
|
|
1975
|
+
var TitleElementWrapper = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ", ";\n height: 32px;\n padding-left: 8px;\n line-height: 32px;\n font-size: 11px;\n\n color: ", ";\n font-weight: 500;\n cursor: initial;\n"], ["\n &:not(:first-child) {\n margin-top: 16px;\n }\n\n margin-bottom: 1px;\n ",
|
|
1763
1976
|
";\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) {
|
|
1764
1977
|
var noResults = _a.noResults, theme = _a.theme;
|
|
1765
1978
|
return noResults === true
|
|
1766
|
-
? css(templateObject_1$
|
|
1979
|
+
? css(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), theme.palette.grey[50]) : undefined;
|
|
1767
1980
|
}, function (_a) {
|
|
1768
1981
|
var theme = _a.theme;
|
|
1769
1982
|
return theme.palette.grey[700];
|
|
@@ -1772,7 +1985,7 @@ var NoResultsWrapper = styled.span(templateObject_3$a || (templateObject_3$a = _
|
|
|
1772
1985
|
var theme = _a.theme;
|
|
1773
1986
|
return theme.palette.grey[700];
|
|
1774
1987
|
});
|
|
1775
|
-
var templateObject_1$
|
|
1988
|
+
var templateObject_1$J, templateObject_2$h, templateObject_3$a;
|
|
1776
1989
|
|
|
1777
1990
|
var GroupElement = function (_a) {
|
|
1778
1991
|
var index = _a.index, items = _a.items, title = _a.title, rest = __rest(_a, ["index", "items", "title"]);
|
|
@@ -1822,37 +2035,37 @@ var GroupedList = function (props) {
|
|
|
1822
2035
|
}); }, [mouseBlocked, setMouseBlocked]);
|
|
1823
2036
|
var wrapperRef = useRef(null);
|
|
1824
2037
|
var i = 1;
|
|
1825
|
-
return (React.createElement(Wrapper$
|
|
2038
|
+
return (React.createElement(Wrapper$f, { style: wrapperStyle, ref: wrapperRef, className: className }, groups.map(function (group, index) {
|
|
1826
2039
|
var oldI = i;
|
|
1827
2040
|
i += group.items.length;
|
|
1828
2041
|
return (React.createElement(GroupElement, __assign({ key: index }, group, { mouseBlockedProps: mouseBlockedProps, navigable: navigable, index: oldI, wrapperRef: wrapperRef, placeholder: placeholder })));
|
|
1829
2042
|
})));
|
|
1830
2043
|
};
|
|
1831
|
-
var Wrapper$
|
|
1832
|
-
var templateObject_1$
|
|
2044
|
+
var Wrapper$f = styled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
|
|
2045
|
+
var templateObject_1$K;
|
|
1833
2046
|
|
|
1834
|
-
var Label$2 = styled.span(templateObject_2$
|
|
2047
|
+
var Label$2 = styled.span(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ", "\n"], ["\n display: inline-block;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n text-align: left;\n margin-left: 8px;\n vertical-align: top;\n cursor: pointer;\n ",
|
|
1835
2048
|
"\n"])), function (_a) {
|
|
1836
2049
|
var isDisabled = _a.isDisabled, palette = _a.theme.palette;
|
|
1837
|
-
return isDisabled && css(templateObject_1$
|
|
2050
|
+
return isDisabled && 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]);
|
|
1838
2051
|
});
|
|
1839
|
-
var templateObject_1$
|
|
2052
|
+
var templateObject_1$L, templateObject_2$i;
|
|
1840
2053
|
|
|
1841
2054
|
var Radio = styled.span(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ", "\n ", "\n ", "\n"], ["\n display: inline-block;\n border-radius: 8px;\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n cursor: pointer;\n ",
|
|
1842
2055
|
"\n ",
|
|
1843
2056
|
"\n ",
|
|
1844
2057
|
"\n"])), function (_a) {
|
|
1845
2058
|
var theme = _a.theme;
|
|
1846
|
-
return css(templateObject_1$
|
|
2059
|
+
return 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]);
|
|
1847
2060
|
}, function (_a) {
|
|
1848
2061
|
var isChecked = _a.isChecked, theme = _a.theme;
|
|
1849
|
-
return isChecked && css(templateObject_2$
|
|
2062
|
+
return isChecked && css(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n border: 5px solid ", ";\n "], ["\n border: 5px solid ", ";\n "])), theme.palette.blue[500]);
|
|
1850
2063
|
}, function (_a) {
|
|
1851
2064
|
var isChecked = _a.isChecked, isDisabled = _a.isDisabled, theme = _a.theme;
|
|
1852
2065
|
return isDisabled && css(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n cursor: not-allowed;\n ", "\n "], ["\n background-color: ", ";\n border-color: ", ";\n cursor: not-allowed;\n ",
|
|
1853
2066
|
"\n "])), theme.palette.grey[100], theme.palette.grey[100], isChecked && css(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n background-color: ", ";\n border-color: ", ";\n "], ["\n background-color: ", ";\n border-color: ", ";\n "])), theme.palette.white[100], theme.palette.grey['50']));
|
|
1854
2067
|
});
|
|
1855
|
-
var templateObject_1$
|
|
2068
|
+
var templateObject_1$M, templateObject_2$j, templateObject_3$b, templateObject_4$6, templateObject_5$4;
|
|
1856
2069
|
|
|
1857
2070
|
var WrapperRadioButton = function (props) {
|
|
1858
2071
|
var isChecked = props.isChecked, isDisabled = props.isDisabled, label = props.label;
|
|
@@ -1860,14 +2073,14 @@ var WrapperRadioButton = function (props) {
|
|
|
1860
2073
|
React.createElement(Radio, { isChecked: props.isChecked, isDisabled: props.isDisabled }),
|
|
1861
2074
|
React.createElement(Label$2, { isDisabled: props.isDisabled }, props.label)))));
|
|
1862
2075
|
};
|
|
1863
|
-
var Wrapper$
|
|
2076
|
+
var Wrapper$g = styled(WrapperRadioButton)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n & + & {\n margin-top: ", "px;\n }\n ", "\n"], ["\n & + & {\n margin-top: ", "px;\n }\n ",
|
|
1864
2077
|
"\n"])), function (props) { return (props.optionsSpacing ? props.optionsSpacing : 0); }, function (props) {
|
|
1865
|
-
return props.inline && css(templateObject_1$
|
|
2078
|
+
return props.inline && 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 "])));
|
|
1866
2079
|
});
|
|
1867
2080
|
var RadioButton = function (props) {
|
|
1868
|
-
return React.createElement(Wrapper$
|
|
2081
|
+
return React.createElement(Wrapper$g, __assign({}, props));
|
|
1869
2082
|
};
|
|
1870
|
-
var templateObject_1$
|
|
2083
|
+
var templateObject_1$N, templateObject_2$k;
|
|
1871
2084
|
|
|
1872
2085
|
var RadioButtonGroup = function (props) { return (React.createElement("div", { style: props.style }, props.options.map(function (o) { return (React.createElement(RadioButton, { key: o.key, label: o.label, onClick: function () {
|
|
1873
2086
|
if (props.onClick) {
|
|
@@ -1878,10 +2091,10 @@ var RadioButtonGroup = function (props) { return (React.createElement("div", { s
|
|
|
1878
2091
|
var colorSetter = function (type, theme) {
|
|
1879
2092
|
switch (type) {
|
|
1880
2093
|
case 'standard': {
|
|
1881
|
-
return css(templateObject_1$
|
|
2094
|
+
return 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]);
|
|
1882
2095
|
}
|
|
1883
2096
|
case 'info': {
|
|
1884
|
-
return css(templateObject_2$
|
|
2097
|
+
return css(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.blue[50], theme.palette.blue[500]);
|
|
1885
2098
|
}
|
|
1886
2099
|
case 'error': {
|
|
1887
2100
|
return css(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), theme.palette.red[50], theme.palette.red[500]);
|
|
@@ -1923,7 +2136,7 @@ var StyledCloseIcon = styled(Icon)(templateObject_16 || (templateObject_16 = __m
|
|
|
1923
2136
|
var palette = _a.theme.palette;
|
|
1924
2137
|
return palette.blue[700];
|
|
1925
2138
|
});
|
|
1926
|
-
var templateObject_1$
|
|
2139
|
+
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;
|
|
1927
2140
|
|
|
1928
2141
|
var defaultCloseIcon = {
|
|
1929
2142
|
icon: faTimes,
|
|
@@ -1947,7 +2160,7 @@ var InlineMessage = function (props) {
|
|
|
1947
2160
|
|
|
1948
2161
|
var renderTrigger = function () { return (React.createElement(IconWrapper, { tabIndex: 0 },
|
|
1949
2162
|
React.createElement(Icon, { icon: faEllipsisH, fixedWidth: true }))); };
|
|
1950
|
-
var IconWrapper = styled.div(templateObject_1$
|
|
2163
|
+
var IconWrapper = styled.div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
1951
2164
|
var triggerStyles = {
|
|
1952
2165
|
margin: 'auto',
|
|
1953
2166
|
width: '100%',
|
|
@@ -1960,16 +2173,16 @@ var SidebarItemDropdown = function (_a) {
|
|
|
1960
2173
|
var className = _a.className, content = _a.content, _b = _a.forceOpen, forceOpen = _b === void 0 ? false : _b;
|
|
1961
2174
|
return (React.createElement(Dropdown, { triggerStyles: triggerStyles, className: className, placement: 'right-start', renderTrigger: renderTrigger, content: content, forceOpen: forceOpen }));
|
|
1962
2175
|
};
|
|
1963
|
-
var templateObject_1$
|
|
2176
|
+
var templateObject_1$P;
|
|
1964
2177
|
|
|
1965
|
-
var SidebarItemCaret = styled.div(templateObject_1$
|
|
2178
|
+
var SidebarItemCaret = styled.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) {
|
|
1966
2179
|
var isOpen = _a.isOpen;
|
|
1967
2180
|
return (isOpen ? 'rotate(90deg)' : 'rotate(0deg)');
|
|
1968
2181
|
}, function (_a) {
|
|
1969
2182
|
var isVisible = _a.isVisible;
|
|
1970
2183
|
return (isVisible ? 'visible' : 'hidden');
|
|
1971
2184
|
});
|
|
1972
|
-
var templateObject_1$
|
|
2185
|
+
var templateObject_1$Q;
|
|
1973
2186
|
|
|
1974
2187
|
var getSidebarItemStyles = function (_a) {
|
|
1975
2188
|
var isActive = _a.isActive, isDisabled = _a.isDisabled, theme = _a.theme;
|
|
@@ -1992,8 +2205,8 @@ var SidebarItem = function (props) {
|
|
|
1992
2205
|
React.createElement(Title$2, null, content),
|
|
1993
2206
|
!isDisabled && dropdownContent && React.createElement(Dropdown$1, { content: dropdownContent, forceOpen: forceOpenDropdown })));
|
|
1994
2207
|
};
|
|
1995
|
-
var Dropdown$1 = styled(SidebarItemDropdown)(templateObject_1$
|
|
1996
|
-
var SidebarItemWrapper = styled.div.attrs(getSidebarItemStyles)(templateObject_2$
|
|
2208
|
+
var Dropdown$1 = styled(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"])));
|
|
2209
|
+
var SidebarItemWrapper = styled.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) {
|
|
1997
2210
|
var color = _a.color, customColor = _a.customColor;
|
|
1998
2211
|
return customColor || color;
|
|
1999
2212
|
}, function (_a) {
|
|
@@ -2014,7 +2227,7 @@ var SidebarItemWrapper = styled.div.attrs(getSidebarItemStyles)(templateObject_2
|
|
|
2014
2227
|
});
|
|
2015
2228
|
var Title$2 = styled.div(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"], ["\n flex-grow: 1;\n\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
|
|
2016
2229
|
var NoIcon = styled(Icon)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n visibility: hidden;\n"], ["\n visibility: hidden;\n"])));
|
|
2017
|
-
var templateObject_1$
|
|
2230
|
+
var templateObject_1$R, templateObject_2$m, templateObject_3$d, templateObject_4$8;
|
|
2018
2231
|
|
|
2019
2232
|
var sidebarItemPalette = {
|
|
2020
2233
|
normal: {
|
|
@@ -2048,14 +2261,14 @@ var getMicroTagStyles = function (_a) {
|
|
|
2048
2261
|
return theme.components.microTag[type];
|
|
2049
2262
|
};
|
|
2050
2263
|
|
|
2051
|
-
var MicroTagBody = styled.div.attrs(getMicroTagStyles)(templateObject_1$
|
|
2264
|
+
var MicroTagBody = styled.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) {
|
|
2052
2265
|
var color = _a.color;
|
|
2053
2266
|
return color;
|
|
2054
2267
|
}, function (_a) {
|
|
2055
2268
|
var backgroundColor = _a.backgroundColor;
|
|
2056
2269
|
return backgroundColor;
|
|
2057
2270
|
});
|
|
2058
|
-
var templateObject_1$
|
|
2271
|
+
var templateObject_1$S;
|
|
2059
2272
|
|
|
2060
2273
|
var MicroTag = function (_a) {
|
|
2061
2274
|
var text = _a.text, type = _a.type;
|
|
@@ -2094,13 +2307,13 @@ var checkIcon = React.createElement(Icon, { icon: faCheck, fixedWidth: true });
|
|
|
2094
2307
|
var StepItem = function (_a) {
|
|
2095
2308
|
var _b = _a.text, text = _b === void 0 ? '' : _b, number = _a.number, status = _a.status;
|
|
2096
2309
|
var content = status === 'completed' ? checkIcon : number + 1;
|
|
2097
|
-
return (React.createElement(Wrapper$
|
|
2310
|
+
return (React.createElement(Wrapper$h, { status: status },
|
|
2098
2311
|
React.createElement(Circle, null, content),
|
|
2099
2312
|
React.createElement(Text$2, null, text)));
|
|
2100
2313
|
};
|
|
2101
|
-
var Circle = styled.div(templateObject_1$
|
|
2102
|
-
var Text$2 = styled.div(templateObject_2$
|
|
2103
|
-
var Wrapper$
|
|
2314
|
+
var Circle = styled.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"])));
|
|
2315
|
+
var Text$2 = styled.div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject([""], [""])));
|
|
2316
|
+
var Wrapper$h = styled.div.attrs(getStepItemStyles)(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"], ["\n ", " {\n color: ", ";\n background: ", ";\n }\n\n ", " {\n color: ", ";\n }\n\n display: inline-flex;\n align-items: center;\n gap: 0.6em;\n"])), Circle, function (_a) {
|
|
2104
2317
|
var circleTextColor = _a.circleTextColor;
|
|
2105
2318
|
return circleTextColor;
|
|
2106
2319
|
}, function (_a) {
|
|
@@ -2110,10 +2323,10 @@ var Wrapper$a = styled.div.attrs(getStepItemStyles)(templateObject_3$e || (templ
|
|
|
2110
2323
|
var color = _a.color;
|
|
2111
2324
|
return color;
|
|
2112
2325
|
});
|
|
2113
|
-
var templateObject_1$
|
|
2326
|
+
var templateObject_1$T, templateObject_2$n, templateObject_3$e;
|
|
2114
2327
|
|
|
2115
|
-
var StepperDivider = styled.div(templateObject_1$
|
|
2116
|
-
var templateObject_1$
|
|
2328
|
+
var StepperDivider = styled.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"])));
|
|
2329
|
+
var templateObject_1$U;
|
|
2117
2330
|
|
|
2118
2331
|
var getItemStatus = function (itemStep, currentStep) {
|
|
2119
2332
|
if (itemStep < currentStep) {
|
|
@@ -2142,10 +2355,10 @@ var Stepper = function (_a) {
|
|
|
2142
2355
|
}
|
|
2143
2356
|
}, []);
|
|
2144
2357
|
}, [steps, currentStep]);
|
|
2145
|
-
return React.createElement(Wrapper$
|
|
2358
|
+
return React.createElement(Wrapper$i, null, mappedSteps);
|
|
2146
2359
|
};
|
|
2147
|
-
var Wrapper$
|
|
2148
|
-
var templateObject_1$
|
|
2360
|
+
var Wrapper$i = styled.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"])));
|
|
2361
|
+
var templateObject_1$V;
|
|
2149
2362
|
|
|
2150
2363
|
var stepperPalette = {
|
|
2151
2364
|
item: {
|
|
@@ -2172,8 +2385,8 @@ var getTagColors = function (_a) {
|
|
|
2172
2385
|
return theme.components.tag[tagStyle][type];
|
|
2173
2386
|
};
|
|
2174
2387
|
|
|
2175
|
-
var LeftIcon$2 = styled(Icon)(templateObject_1$
|
|
2176
|
-
var RightIcon$1 = styled(Icon)(templateObject_2$
|
|
2388
|
+
var LeftIcon$2 = styled(Icon)(templateObject_1$W || (templateObject_1$W = __makeTemplateObject([""], [""])));
|
|
2389
|
+
var RightIcon$1 = styled(Icon)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject([""], [""])));
|
|
2177
2390
|
var Text$3 = styled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject([""], [""])));
|
|
2178
2391
|
var StyledTag = styled.div.attrs(getTagColors)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ", ";\n background-color: ", ";\n\n ", " + ", " {\n padding-left: 4px;\n }\n\n ", " + ", " {\n padding-right: 12px;\n }\n"], ["\n display: inline-flex;\n flex-direction: row;\n border: 4px;\n align-items: center;\n font-weight: 500;\n font-size: 12px;\n line-height: 18px;\n text-align: center;\n border-radius: 4px;\n padding: 3px 8px;\n color: ", ";\n background-color: ", ";\n\n ", " + ", " {\n padding-left: 4px;\n }\n\n ", " + ", " {\n padding-right: 12px;\n }\n"])), function (_a) {
|
|
2179
2392
|
var color = _a.color;
|
|
@@ -2182,7 +2395,7 @@ var StyledTag = styled.div.attrs(getTagColors)(templateObject_4$9 || (templateOb
|
|
|
2182
2395
|
var backgroundColor = _a.backgroundColor;
|
|
2183
2396
|
return backgroundColor;
|
|
2184
2397
|
}, LeftIcon$2, Text$3, Text$3, RightIcon$1);
|
|
2185
|
-
var templateObject_1$
|
|
2398
|
+
var templateObject_1$W, templateObject_2$o, templateObject_3$f, templateObject_4$9;
|
|
2186
2399
|
|
|
2187
2400
|
var Tag = function (_a) {
|
|
2188
2401
|
var leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, tagStyle = _a.tagStyle, text = _a.text, type = _a.type, className = _a.className;
|
|
@@ -2261,28 +2474,28 @@ var tagPalette = {
|
|
|
2261
2474
|
},
|
|
2262
2475
|
};
|
|
2263
2476
|
|
|
2264
|
-
var Arrow = styled.div(templateObject_1$
|
|
2477
|
+
var Arrow = styled.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) {
|
|
2265
2478
|
var theme = _a.theme, type = _a.type;
|
|
2266
2479
|
return theme.components.tooltip[type].background;
|
|
2267
2480
|
});
|
|
2268
|
-
var arrowStyle = css(templateObject_2$
|
|
2269
|
-
var templateObject_1$
|
|
2481
|
+
var arrowStyle = css(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"], ["\n &[data-popper-placement^='top'] > ", " {\n bottom: -5px;\n &:after {\n border-bottom-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='bottom'] > ", " {\n top: -5px;\n &:after {\n border-top-left-radius: 3px;\n }\n }\n\n &[data-popper-placement^='left'] > ", " {\n right: -5px;\n &:after {\n border-top-right-radius: 3px;\n }\n }\n\n &[data-popper-placement^='right'] > ", " {\n left: -5px;\n &:after {\n border-bottom-left-radius: 3px;\n }\n }\n"])), Arrow, Arrow, Arrow, Arrow);
|
|
2482
|
+
var templateObject_1$X, templateObject_2$p;
|
|
2270
2483
|
|
|
2271
2484
|
var getMessageStyles = function (_a) {
|
|
2272
2485
|
var theme = _a.theme, type = _a.type;
|
|
2273
2486
|
return theme.components.tooltip[type];
|
|
2274
2487
|
};
|
|
2275
|
-
var Message = styled.div.attrs(getMessageStyles)(templateObject_1$
|
|
2488
|
+
var Message = styled.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) {
|
|
2276
2489
|
var color = _a.color;
|
|
2277
2490
|
return color;
|
|
2278
2491
|
}, function (_a) {
|
|
2279
2492
|
var background = _a.background;
|
|
2280
2493
|
return background;
|
|
2281
2494
|
});
|
|
2282
|
-
var templateObject_1$
|
|
2495
|
+
var templateObject_1$Y;
|
|
2283
2496
|
|
|
2284
|
-
var TooltipContainer = styled.div(templateObject_1$
|
|
2285
|
-
var templateObject_1$
|
|
2497
|
+
var TooltipContainer = styled.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);
|
|
2498
|
+
var templateObject_1$Z;
|
|
2286
2499
|
|
|
2287
2500
|
var Tooltip = function (_a) {
|
|
2288
2501
|
var message = _a.message, placement = _a.placement, className = _a.className, children = _a.children, type = _a.type, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave;
|
|
@@ -2329,7 +2542,7 @@ var Tooltip = function (_a) {
|
|
|
2329
2542
|
},
|
|
2330
2543
|
]; }, [arrowRef]),
|
|
2331
2544
|
}), attributes = _d.attributes, styles = _d.styles;
|
|
2332
|
-
return (React.createElement(Wrapper$
|
|
2545
|
+
return (React.createElement(Wrapper$j, { className: className, ref: wrapperRef },
|
|
2333
2546
|
React.createElement("div", { ref: buttonRef, onClick: show, onMouseEnter: _onMouseEnter, onMouseLeave: _onMouseLeave }, children),
|
|
2334
2547
|
React.createElement(CSSTransition, { in: isOpen, timeout: 200, unmountOnExit: true, appear: true },
|
|
2335
2548
|
React.createElement(BodyAnimationWrapper$1, null,
|
|
@@ -2337,9 +2550,9 @@ var Tooltip = function (_a) {
|
|
|
2337
2550
|
React.createElement(Arrow, { type: type, ref: setArrowRef, style: styles.arrow }),
|
|
2338
2551
|
React.createElement(Message, { type: type, style: styles.offset }, message))))));
|
|
2339
2552
|
};
|
|
2340
|
-
var Wrapper$
|
|
2341
|
-
var BodyAnimationWrapper$1 = styled.div(templateObject_2$
|
|
2342
|
-
var templateObject_1$
|
|
2553
|
+
var Wrapper$j = styled.div(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
2554
|
+
var BodyAnimationWrapper$1 = styled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"], ["\n &.enter {\n opacity: 0;\n margin-top: -10px;\n }\n\n &.enter-active {\n opacity: 1;\n margin-top: 0;\n transition: margin-top 200ms, opacity 200ms;\n }\n\n &.exit {\n opacity: 1;\n margin-top: 0;\n }\n\n &.exit-active {\n opacity: 0;\n margin-top: -10px;\n transition: margin-top 200ms, opacity 200ms;\n }\n"])));
|
|
2555
|
+
var templateObject_1$_, templateObject_2$q;
|
|
2343
2556
|
|
|
2344
2557
|
var tooltipPalette = {
|
|
2345
2558
|
light: {
|
|
@@ -2367,14 +2580,15 @@ var components = {
|
|
|
2367
2580
|
inputText: inputTextPalette,
|
|
2368
2581
|
textArea: textAreaPalette,
|
|
2369
2582
|
inputHelper: inputHelperPalette,
|
|
2583
|
+
select: selectPalette,
|
|
2370
2584
|
};
|
|
2371
2585
|
var defaultTheme = {
|
|
2372
2586
|
palette: defaultPalette,
|
|
2373
2587
|
components: components,
|
|
2374
2588
|
};
|
|
2375
2589
|
|
|
2376
|
-
var ModalAnimation = createGlobalStyle(templateObject_1
|
|
2377
|
-
var templateObject_1
|
|
2590
|
+
var ModalAnimation = 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"])));
|
|
2591
|
+
var templateObject_1$$;
|
|
2378
2592
|
|
|
2379
2593
|
var styledModalBoxWidth = function (isSmall, isFullscreen) {
|
|
2380
2594
|
if (isFullscreen) {
|
|
@@ -2388,13 +2602,13 @@ var styledModalBoxWidth = function (isSmall, isFullscreen) {
|
|
|
2388
2602
|
|
|
2389
2603
|
var headerFooterHeight = '80px';
|
|
2390
2604
|
var closeTimeoutMS = 200;
|
|
2391
|
-
var StyledReactModalContainer = styled(ReactModal)(templateObject_1$
|
|
2605
|
+
var StyledReactModalContainer = styled(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);
|
|
2392
2606
|
var StyledModalBox = styled.div(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ", "\n\n box-shadow: ", ";\n\n border: ", ";\n border-radius: ", "px;\n width: ", "vw;\n\n @media screen and (min-width: 992px) {\n width: ", ";\n }\n"], ["\n overflow: auto;\n background: rgb(255, 255, 255);\n padding: 0;\n ",
|
|
2393
2607
|
"\n\n box-shadow: ",
|
|
2394
2608
|
";\n\n border: ", ";\n border-radius: ", "px;\n width: ", "vw;\n\n @media screen and (min-width: 992px) {\n width: ", ";\n }\n"])), function (_a) {
|
|
2395
2609
|
var fullScreenHeight = _a.fullScreenHeight, isFullscreen = _a.isFullscreen;
|
|
2396
2610
|
return isFullscreen
|
|
2397
|
-
? css(templateObject_2$
|
|
2611
|
+
? css(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n height: ", "px;\n "], ["\n height: ", "px;\n "])), fullScreenHeight) : css(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n min-height: 200px;\n "], ["\n min-height: 200px;\n "])));
|
|
2398
2612
|
}, function (props) {
|
|
2399
2613
|
return props.isFullscreen ? 'none' : 'rgba(23, 43, 77, 0.24) 0px 16px 24px, rgba(9, 30, 66, 0.08) 0px 0px 0px';
|
|
2400
2614
|
}, 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) {
|
|
@@ -2433,14 +2647,14 @@ var ModalFooter = styled.div(templateObject_12$1 || (templateObject_12$1 = __mak
|
|
|
2433
2647
|
var palette = _a.theme.palette;
|
|
2434
2648
|
return palette.grey[100];
|
|
2435
2649
|
});
|
|
2436
|
-
var Wrapper$
|
|
2650
|
+
var Wrapper$k = styled.div(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject([""], [""])));
|
|
2437
2651
|
var TopAttachment = styled.div(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n top: ", ";\n"], ["\n position: absolute;\n width: 100%;\n top: ", ";\n"])), function (_a) {
|
|
2438
2652
|
var height = _a.height;
|
|
2439
2653
|
return height && -(height + 16) + "px";
|
|
2440
2654
|
});
|
|
2441
2655
|
var BottomAttachment = styled.div(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"], ["\n width: auto;\n margin-top: 24px;\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n"])));
|
|
2442
2656
|
var StyledIcon$6 = styled(Icon)(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n font-size: 24px;\n font-weight: 500;\n"], ["\n font-size: 24px;\n font-weight: 500;\n"])));
|
|
2443
|
-
var templateObject_1$
|
|
2657
|
+
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;
|
|
2444
2658
|
|
|
2445
2659
|
var closeTimeoutMS$1 = 200;
|
|
2446
2660
|
var modalStyle = {
|
|
@@ -2530,7 +2744,7 @@ var ModalSearchable = function (props) {
|
|
|
2530
2744
|
React.createElement(ClearButton, { visible: !!value, onClick: clearInput }, "Cancella")));
|
|
2531
2745
|
return (React.createElement(Modal, __assign({ className: className, header: function () { return Header; } }, props), children));
|
|
2532
2746
|
};
|
|
2533
|
-
var ClearButton = styled.div(templateObject_1$
|
|
2747
|
+
var ClearButton = styled.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) {
|
|
2534
2748
|
var theme = _a.theme;
|
|
2535
2749
|
return theme.palette.grey[200];
|
|
2536
2750
|
}, function (_a) {
|
|
@@ -2543,21 +2757,21 @@ var ClearButton = styled.div(templateObject_1$U || (templateObject_1$U = __makeT
|
|
|
2543
2757
|
var visible = _a.visible;
|
|
2544
2758
|
return (visible ? 'inherit' : 'none');
|
|
2545
2759
|
});
|
|
2546
|
-
var WrapperInput = styled.div(templateObject_2$
|
|
2760
|
+
var WrapperInput = styled.div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n caret-color: ", ";\n input[type='text'].inputSearchable:focus {\n outline: none !important;\n box-shadow: none !important;\n }\n\n > input {\n width: 100%;\n margin-left: 4px;\n background-color: ", " !important;\n border: none;\n font-size: 20px !important;\n top: 6px;\n outline: none;\n box-shadow: none;\n }\n\n > input,\n input::-webkit-input-placeholder {\n font-size: 20px;\n }\n"])), function (_a) {
|
|
2547
2761
|
var theme = _a.theme;
|
|
2548
2762
|
return theme.palette.blue[300];
|
|
2549
2763
|
}, function (_a) {
|
|
2550
2764
|
var theme = _a.theme;
|
|
2551
2765
|
return theme.palette.grey[50];
|
|
2552
2766
|
});
|
|
2553
|
-
var templateObject_1$
|
|
2767
|
+
var templateObject_1$11, templateObject_2$s;
|
|
2554
2768
|
|
|
2555
|
-
var CustomSizeModal = styled(Modal)(templateObject_1$
|
|
2556
|
-
var TitleContent = styled.div(templateObject_2$
|
|
2769
|
+
var CustomSizeModal = styled(Modal)(templateObject_1$12 || (templateObject_1$12 = __makeTemplateObject(["\n width: 432px;\n max-width: 90vw;\n"], ["\n width: 432px;\n max-width: 90vw;\n"])));
|
|
2770
|
+
var TitleContent = styled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"], ["\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n margin-top: 8px;\n line-height: 24px;\n font-weight: 500;\n font-size: 16px;\n font-style: normal;\n color: #000000;\n"])));
|
|
2557
2771
|
var BodyContent = styled.div(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"], ["\n margin-top: 8px;\n margin-bottom: 8px;\n font-size: 14px;\n font-weight: normal;\n font-style: normal;\n line-height: 21px;\n color: #5e6c84;\n"])));
|
|
2558
2772
|
var Question = styled.div(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"], ["\n font-size: 14px;\n font-style: normal;\n line-height: 21px;\n font-weight: 500;\n color: #091e42;\n"])));
|
|
2559
2773
|
var Buttons = styled.div(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"], ["\n margin-top: 24px;\n margin-bottom: 8px;\n display: flex;\n flex-direction: row;\n line-height: 21px;\n justify-content: flex-end;\n"])));
|
|
2560
|
-
var templateObject_1$
|
|
2774
|
+
var templateObject_1$12, templateObject_2$t, templateObject_3$h, templateObject_4$b, templateObject_5$7;
|
|
2561
2775
|
|
|
2562
2776
|
var typeMap = {
|
|
2563
2777
|
error: 'error',
|
|
@@ -2596,10 +2810,10 @@ var ConfirmationModal = function (props) {
|
|
|
2596
2810
|
props.onAction();
|
|
2597
2811
|
} }))));
|
|
2598
2812
|
};
|
|
2599
|
-
var StyledButton = styled(Button)(templateObject_1$
|
|
2600
|
-
var templateObject_1$
|
|
2813
|
+
var StyledButton = styled(Button)(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n margin-left: 16px;\n"], ["\n margin-left: 16px;\n"])));
|
|
2814
|
+
var templateObject_1$13;
|
|
2601
2815
|
|
|
2602
|
-
var StyledWrapper = styled.div(templateObject_1$
|
|
2816
|
+
var StyledWrapper = styled.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) {
|
|
2603
2817
|
var palette = _a.theme.palette;
|
|
2604
2818
|
return palette.red[50];
|
|
2605
2819
|
}, function (_a) {
|
|
@@ -2624,14 +2838,14 @@ var PageEmptySet = function (_a) {
|
|
|
2624
2838
|
text && React.createElement("p", null, text),
|
|
2625
2839
|
button));
|
|
2626
2840
|
};
|
|
2627
|
-
var templateObject_1$
|
|
2841
|
+
var templateObject_1$14;
|
|
2628
2842
|
|
|
2629
|
-
var StyledWrapper$1 = styled.div(templateObject_2$
|
|
2843
|
+
var StyledWrapper$1 = styled.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n ", "\n"], ["\n ",
|
|
2630
2844
|
"\n"])), function (_a) {
|
|
2631
2845
|
var palette = _a.theme.palette;
|
|
2632
|
-
return css(templateObject_1$
|
|
2846
|
+
return 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]);
|
|
2633
2847
|
});
|
|
2634
|
-
var templateObject_1$
|
|
2848
|
+
var templateObject_1$15, templateObject_2$u;
|
|
2635
2849
|
|
|
2636
2850
|
var PaginationComponent = function (props) {
|
|
2637
2851
|
var numberOfPages = Math.ceil(props.listSize / props.pageSize);
|
|
@@ -2669,12 +2883,12 @@ var PaginationComponent = function (props) {
|
|
|
2669
2883
|
var Pagination = function (props) { return (React.createElement(StyledWrapper$1, null,
|
|
2670
2884
|
React.createElement(PaginationComponent, __assign({}, props)))); };
|
|
2671
2885
|
|
|
2672
|
-
var StyledProgressbarWrapper = styled.div(templateObject_2$
|
|
2886
|
+
var StyledProgressbarWrapper = styled.div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n ", "\n"], ["\n ",
|
|
2673
2887
|
"\n"])), function (_a) {
|
|
2674
2888
|
var color = _a.color, percentage = _a.percentage, palette = _a.theme.palette;
|
|
2675
|
-
return css(templateObject_1$
|
|
2889
|
+
return 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);
|
|
2676
2890
|
});
|
|
2677
|
-
var templateObject_1$
|
|
2891
|
+
var templateObject_1$16, templateObject_2$v;
|
|
2678
2892
|
|
|
2679
2893
|
var UnstyledProgressbar = /** @class */ (function (_super) {
|
|
2680
2894
|
__extends(UnstyledProgressbar, _super);
|
|
@@ -2692,92 +2906,7 @@ var UnstyledProgressbar = /** @class */ (function (_super) {
|
|
|
2692
2906
|
var Progressbar = function (props) { return (React.createElement(StyledProgressbarWrapper, __assign({}, props),
|
|
2693
2907
|
React.createElement(UnstyledProgressbar, __assign({}, props)))); };
|
|
2694
2908
|
|
|
2695
|
-
var
|
|
2696
|
-
first: '0px 1px 2px 0px rgba(51, 51, 51, 0.24)',
|
|
2697
|
-
second: '0px 2px 4px rgba(51, 51, 51, 0.12), 0px 3px 6px rgba(51, 51, 51, 0.15)',
|
|
2698
|
-
third: '0px 3px 6px 0px rgba(51, 51, 51, 0.1)',
|
|
2699
|
-
fourth: '0px 5px 10px 0px rgba(51, 51, 51, 0.05)',
|
|
2700
|
-
fifth: '0px 20px 40px 0px rgba(51, 51, 51, 0.2)',
|
|
2701
|
-
};
|
|
2702
|
-
|
|
2703
|
-
var styles = {
|
|
2704
|
-
fontSize: {
|
|
2705
|
-
medium: '14px',
|
|
2706
|
-
large: '14px',
|
|
2707
|
-
},
|
|
2708
|
-
minHeight: {
|
|
2709
|
-
medium: '30px',
|
|
2710
|
-
large: '38px',
|
|
2711
|
-
},
|
|
2712
|
-
};
|
|
2713
|
-
var indicatorSeparator = function (baseStyle) { return (__assign(__assign({}, baseStyle), { display: 'none' })); };
|
|
2714
|
-
var singleValue = function (baseStyle) { return (__assign(__assign({}, baseStyle), { top: '45%' })); };
|
|
2715
|
-
var clearIndicator = function (baseStyle) { return (__assign(__assign({}, baseStyle), { padding: '5px' })); };
|
|
2716
|
-
var dropdownIndicator = function (baseStyle) { return (__assign(__assign({}, baseStyle), { border: 'none', padding: '5px' })); };
|
|
2717
|
-
var multiValue = function (baseStyle) { return (__assign(__assign({}, baseStyle), { borderRadius: '100px' })); };
|
|
2718
|
-
var menu = function (baseStyle) { return (__assign(__assign({}, baseStyle), { boxShadow: elevations.second, borderRadius: '4px', fontSize: '14px', lineHeight: '21px' })); };
|
|
2719
|
-
|
|
2720
|
-
var useCustomSelectStyle = function (size) {
|
|
2721
|
-
if (size === void 0) { size = 'medium'; }
|
|
2722
|
-
var themeContext = useContext(ThemeContext);
|
|
2723
|
-
var container = useCallback(function (baseStyle) { return (__assign(__assign({}, baseStyle), { outline: 'none', fontSize: styles.fontSize[size], height: styles.minHeight[size], minHeight: styles.minHeight[size] })); }, [size]);
|
|
2724
|
-
var valueContainer = useCallback(function (baseStyle) { return (__assign(__assign({}, baseStyle), { height: styles.minHeight[size], minHeight: styles.minHeight[size] })); }, [size]);
|
|
2725
|
-
var control = useCallback(function (baseStyle, state) {
|
|
2726
|
-
if (state.isFocused) {
|
|
2727
|
-
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] });
|
|
2728
|
-
}
|
|
2729
|
-
else {
|
|
2730
|
-
return __assign(__assign({}, baseStyle), { outline: 'none', height: styles.minHeight[size], minHeight: styles.minHeight[size] });
|
|
2731
|
-
}
|
|
2732
|
-
}, [size, themeContext]);
|
|
2733
|
-
return useMemo(function () { return ({
|
|
2734
|
-
indicatorSeparator: indicatorSeparator,
|
|
2735
|
-
container: container,
|
|
2736
|
-
valueContainer: valueContainer,
|
|
2737
|
-
singleValue: singleValue,
|
|
2738
|
-
control: control,
|
|
2739
|
-
clearIndicator: clearIndicator,
|
|
2740
|
-
dropdownIndicator: dropdownIndicator,
|
|
2741
|
-
multiValue: multiValue,
|
|
2742
|
-
menu: menu,
|
|
2743
|
-
}); }, [container, control, valueContainer]);
|
|
2744
|
-
};
|
|
2745
|
-
|
|
2746
|
-
var ReactSelectWrapper = function (props) {
|
|
2747
|
-
var getRef = props.getRef, inputChange = props.inputChange, isClearable = props.isClearable, isMulti = props.isMulti, size = props.size;
|
|
2748
|
-
var styles = useCustomSelectStyle(size);
|
|
2749
|
-
return (React.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 })));
|
|
2750
|
-
};
|
|
2751
|
-
var StyledWrapper$2 = styled.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) {
|
|
2752
|
-
var theme = _a.theme;
|
|
2753
|
-
return theme.palette.black[100];
|
|
2754
|
-
});
|
|
2755
|
-
var Select = function (props) {
|
|
2756
|
-
var label = props.label;
|
|
2757
|
-
var theme = props.theme, rest = __rest(props, ["theme"]);
|
|
2758
|
-
return (React.createElement(StyledWrapper$2, __assign({}, rest),
|
|
2759
|
-
label ? React.createElement("label", { className: 'label' }, label) : null,
|
|
2760
|
-
React.createElement(ReactSelectWrapper, __assign({}, props))));
|
|
2761
|
-
};
|
|
2762
|
-
var SelectCreatable = function (props) {
|
|
2763
|
-
var isClearable = props.isClearable, isMulti = props.isMulti, label = props.label, size = props.size;
|
|
2764
|
-
var theme = props.theme, rest = __rest(props, ["theme"]);
|
|
2765
|
-
var styles = useCustomSelectStyle(size);
|
|
2766
|
-
return (React.createElement(StyledWrapper$2, __assign({}, rest),
|
|
2767
|
-
label ? React.createElement("label", { className: 'label' }, label) : null,
|
|
2768
|
-
React.createElement(CreatableSelect, __assign({}, props, { isMulti: isMulti, backspaceRemoves: true, deleteRemoves: true, autosize: false, noOptionsMessage: function () { return 'Nessuna corrispondenza trovata'; }, styles: styles, isClearable: isClearable }))));
|
|
2769
|
-
};
|
|
2770
|
-
var SelectAsync = function (props) {
|
|
2771
|
-
var isClearable = props.isClearable, label = props.label, size = props.size;
|
|
2772
|
-
var theme = props.theme, rest = __rest(props, ["theme"]);
|
|
2773
|
-
var styles = useCustomSelectStyle(size);
|
|
2774
|
-
return (React.createElement(StyledWrapper$2, __assign({}, rest),
|
|
2775
|
-
label ? React.createElement("label", { className: 'label' }, label) : null,
|
|
2776
|
-
React.createElement(AsyncSelect, __assign({}, props, { backspaceRemoves: true, deleteRemoves: true, autosize: false, noOptionsMessage: function () { return 'Nessuna corrispondenza trovata'; }, styles: styles, isClearable: isClearable }))));
|
|
2777
|
-
};
|
|
2778
|
-
var templateObject_1$_;
|
|
2779
|
-
|
|
2780
|
-
var linearBackground = function () { return 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) {
|
|
2909
|
+
var linearBackground = function () { return 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) {
|
|
2781
2910
|
var theme = _a.theme;
|
|
2782
2911
|
return theme.palette.grey[100];
|
|
2783
2912
|
}, function (_a) {
|
|
@@ -2790,7 +2919,7 @@ var linearBackground = function () { return css(templateObject_1$$ || (templateO
|
|
|
2790
2919
|
var theme = _a.theme;
|
|
2791
2920
|
return theme.palette.grey[100];
|
|
2792
2921
|
}); };
|
|
2793
|
-
var templateObject_1
|
|
2922
|
+
var templateObject_1$17;
|
|
2794
2923
|
|
|
2795
2924
|
var tabletLandscape = 991;
|
|
2796
2925
|
var responsiveThresholds = {
|
|
@@ -2863,8 +2992,8 @@ var typeMap$1 = {
|
|
|
2863
2992
|
desc: faSortDown,
|
|
2864
2993
|
default: faSort,
|
|
2865
2994
|
};
|
|
2866
|
-
var StyledWrapper$
|
|
2867
|
-
var StyledIcon$7 = styled(Icon)(templateObject_2$
|
|
2995
|
+
var StyledWrapper$2 = styled.div(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n margin-left: 0.5rem;\n"], ["\n margin-left: 0.5rem;\n"])));
|
|
2996
|
+
var StyledIcon$7 = styled(Icon)(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
|
|
2868
2997
|
var SortIcon = function (props) {
|
|
2869
2998
|
var filter = _.find(props.propertiesFilter, ['id', props.property]);
|
|
2870
2999
|
var type = '';
|
|
@@ -2891,12 +3020,12 @@ var SortIcon = function (props) {
|
|
|
2891
3020
|
nextType = 'desc';
|
|
2892
3021
|
}
|
|
2893
3022
|
}
|
|
2894
|
-
return (React.createElement(StyledWrapper$
|
|
3023
|
+
return (React.createElement(StyledWrapper$2, null,
|
|
2895
3024
|
React.createElement(StyledIcon$7, { icon: typeMap$1[type], onClick: function () {
|
|
2896
3025
|
props.handleSortOnProperty(props.property, nextType);
|
|
2897
3026
|
} })));
|
|
2898
3027
|
};
|
|
2899
|
-
var templateObject_1$
|
|
3028
|
+
var templateObject_1$18, templateObject_2$w;
|
|
2900
3029
|
|
|
2901
3030
|
var ellipsisIcon = {
|
|
2902
3031
|
icon: faEllipsisH,
|
|
@@ -2923,29 +3052,29 @@ var HeadDesktop = function (_a) {
|
|
|
2923
3052
|
React.createElement(Icon, __assign({}, ellipsisIcon))))));
|
|
2924
3053
|
};
|
|
2925
3054
|
|
|
2926
|
-
var Row = styled.div(templateObject_1$
|
|
3055
|
+
var Row = styled.div(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject([""], [""])));
|
|
2927
3056
|
var ListMobile = function (_a) {
|
|
2928
3057
|
var data = _a.data, isLoading = _a.isLoading, listSize = _a.listSize, renderMobileRow = _a.renderMobileRow;
|
|
2929
3058
|
return (React.createElement("div", null, listSize && !isLoading
|
|
2930
3059
|
? data.map(function (o, i) { return React.createElement(Row, { key: i }, renderMobileRow ? renderMobileRow(o) : undefined); })
|
|
2931
3060
|
: undefined));
|
|
2932
3061
|
};
|
|
2933
|
-
var templateObject_1$
|
|
3062
|
+
var templateObject_1$19;
|
|
2934
3063
|
|
|
2935
|
-
var ActionLink = styled.a(templateObject_2$
|
|
2936
|
-
"\n"])), function (props) { return css(templateObject_1$
|
|
2937
|
-
var templateObject_1$
|
|
3064
|
+
var ActionLink = styled.a(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ", "\n"], ["\n margin-right: 1rem;\n cursor: pointer;\n user-select: none;\n &:hover {\n text-decoration: underline;\n }\n ",
|
|
3065
|
+
"\n"])), function (props) { return css(templateObject_1$1a || (templateObject_1$1a = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), props.color); });
|
|
3066
|
+
var templateObject_1$1a, templateObject_2$x;
|
|
2938
3067
|
|
|
2939
|
-
var ActionsContainer = styled.div(templateObject_1$
|
|
2940
|
-
var templateObject_1$
|
|
3068
|
+
var ActionsContainer = styled.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"])));
|
|
3069
|
+
var templateObject_1$1b;
|
|
2941
3070
|
|
|
2942
|
-
var StyledWrapper$
|
|
3071
|
+
var StyledWrapper$3 = styled.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ", "\n\n .link_container {\n margin: 0.5rem 0;\n }\n"], ["\n position: absolute;\n right: 0;\n top: 32px;\n background-color: ", ";\n box-shadow: 0px 1px 2px rgba(51, 51, 51, 0.24), 0px 1px 3px rgba(51, 51, 51, 0.12);\n border-radius: 4px;\n min-width: 200px;\n max-width: calc(100% - 2rem);\n padding: 0.5rem 1rem;\n z-index: 999;\n display: none;\n ",
|
|
2943
3072
|
"\n\n .link_container {\n margin: 0.5rem 0;\n }\n"])), function (_a) {
|
|
2944
3073
|
var palette = _a.theme.palette;
|
|
2945
3074
|
return palette.white[100];
|
|
2946
3075
|
}, function (props) {
|
|
2947
3076
|
if (props.active) {
|
|
2948
|
-
return css(templateObject_1$
|
|
3077
|
+
return css(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
|
|
2949
3078
|
}
|
|
2950
3079
|
return undefined;
|
|
2951
3080
|
});
|
|
@@ -2956,30 +3085,30 @@ var Action = styled.p(templateObject_4$c || (templateObject_4$c = __makeTemplate
|
|
|
2956
3085
|
}
|
|
2957
3086
|
return undefined;
|
|
2958
3087
|
});
|
|
2959
|
-
var ActionsPopUp = function (props) { return (React.createElement(StyledWrapper$
|
|
3088
|
+
var ActionsPopUp = function (props) { return (React.createElement(StyledWrapper$3, { active: props.active }, props.actions.map(function (a, ai) { return (React.createElement("div", { key: ai, className: 'link_container' },
|
|
2960
3089
|
React.createElement(Action, { className: 'action', key: ai, onClick: function (e) {
|
|
2961
3090
|
e.preventDefault();
|
|
2962
3091
|
a.action(props.element, props.selectedRows);
|
|
2963
3092
|
props.handlePopUpVisibility(undefined);
|
|
2964
3093
|
}, color: a.color }, a.label))); }))); };
|
|
2965
|
-
var templateObject_1$
|
|
3094
|
+
var templateObject_1$1c, templateObject_2$y, templateObject_3$i, templateObject_4$c;
|
|
2966
3095
|
|
|
2967
|
-
var StyledWrapper$
|
|
3096
|
+
var StyledWrapper$4 = styled.div(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ", "\n"], ["\n cursor: pointer;\n display: flex;\n align-items: center;\n width: 32px;\n height: 32px;\n justify-content: center;\n border-radius: 4px;\n\n ",
|
|
2968
3097
|
"\n"])), function (_a) {
|
|
2969
3098
|
var active = _a.active, palette = _a.theme.palette;
|
|
2970
|
-
return css(templateObject_2$
|
|
2971
|
-
"\n &:hover {\n background-color: ", ";\n }\n "])), active && css(templateObject_1$
|
|
3099
|
+
return css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n ", "\n &:hover {\n background-color: ", ";\n }\n "], ["\n ",
|
|
3100
|
+
"\n &:hover {\n background-color: ", ";\n }\n "])), active && 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]);
|
|
2972
3101
|
});
|
|
2973
|
-
var ActionsPopUpButton = function (props) { return (React.createElement(StyledWrapper$
|
|
3102
|
+
var ActionsPopUpButton = function (props) { return (React.createElement(StyledWrapper$4, { active: props.active, onClick: function () { return props.handlePopUpVisibility(props.rowId); } },
|
|
2974
3103
|
React.createElement(Icon, { icon: faEllipsisH }))); };
|
|
2975
|
-
var templateObject_1$
|
|
3104
|
+
var templateObject_1$1d, templateObject_2$z, templateObject_3$j;
|
|
2976
3105
|
|
|
2977
|
-
var ActionsPopUpUnderlay = styled.div(templateObject_2$
|
|
3106
|
+
var ActionsPopUpUnderlay = styled.div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ", "\n"], ["\n position: fixed;\n top: 0;\n left: 0;\n background-color: transparent;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: none;\n ",
|
|
2978
3107
|
"\n"])), function (_a) {
|
|
2979
3108
|
var active = _a.active;
|
|
2980
|
-
return active && css(templateObject_1$
|
|
3109
|
+
return active && css(templateObject_1$1e || (templateObject_1$1e = __makeTemplateObject(["\n display: block;\n "], ["\n display: block;\n "])));
|
|
2981
3110
|
});
|
|
2982
|
-
var templateObject_1$
|
|
3111
|
+
var templateObject_1$1e, templateObject_2$A;
|
|
2983
3112
|
|
|
2984
3113
|
var RowDesktop = function (_a) {
|
|
2985
3114
|
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;
|
|
@@ -3010,13 +3139,13 @@ var RowDesktop = function (_a) {
|
|
|
3010
3139
|
React.createElement("td", null)));
|
|
3011
3140
|
};
|
|
3012
3141
|
|
|
3013
|
-
var StyledWrapper$
|
|
3142
|
+
var StyledWrapper$5 = styled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n ", "\n"], ["\n ",
|
|
3014
3143
|
"\n"])), function (_a) {
|
|
3015
3144
|
var show = _a.show, palette = _a.theme.palette;
|
|
3016
|
-
return css(templateObject_2$
|
|
3017
|
-
"\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "])), show && css(templateObject_1$
|
|
3145
|
+
return css(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ", "\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "], ["\n position: fixed;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.14);\n top: 0;\n left: 0;\n display: none;\n ",
|
|
3146
|
+
"\n .link {\n color: ", ";\n cursor: pointer;\n }\n .modal__container {\n background-color: ", ";\n width: 424px;\n box-shadow: 0px 16px 24px rgba(23, 43, 77, 0.24), 0px 0px 0px rgba(9, 30, 66, 0.08);\n border-radius: 8px;\n background-color: ", ";\n }\n .modal__header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n background: ", ";\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 0 1.5rem;\n font-size: 20px;\n line-height: 30px;\n p {\n cursor: pointer;\n }\n }\n .modal__body {\n padding: 1rem 1.5rem;\n position: relative;\n .draggable_element {\n display: flex;\n align-items: center;\n &:hover,\n &:active {\n .icon {\n visibility: visible;\n color: ", ";\n }\n }\n }\n .draggable__handle {\n width: 30px;\n .icon {\n display: block;\n visibility: hidden;\n }\n }\n .draggable__checkbox {\n margin-bottom: 6px;\n }\n }\n .modal__footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 1.5rem 1.5rem;\n border-top: 1px solid ", ";\n font-size: 14px;\n line-height: 21px;\n .buttons__container {\n a {\n &:first-child {\n margin-right: 1rem;\n }\n }\n }\n }\n "])), show && css(templateObject_1$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]);
|
|
3018
3147
|
});
|
|
3019
|
-
var templateObject_1$
|
|
3148
|
+
var templateObject_1$1f, templateObject_2$B, templateObject_3$k;
|
|
3020
3149
|
|
|
3021
3150
|
var getItemStyle = function (snapshot, draggableStyle) {
|
|
3022
3151
|
return __assign({ userSelect: 'none', padding: '0.5rem 0 0.5rem 0', outline: "none" }, draggableStyle);
|
|
@@ -3089,7 +3218,7 @@ var CustomizationsModal = /** @class */ (function (_super) {
|
|
|
3089
3218
|
var _this = this;
|
|
3090
3219
|
var _a = this.props, close = _a.close, modifyControlledPropertiesHandler = _a.modifyControlledPropertiesHandler, properties = _a.properties, show = _a.show, title = _a.title;
|
|
3091
3220
|
var localProperties = this.state.localProperties;
|
|
3092
|
-
return (React.createElement(StyledWrapper$
|
|
3221
|
+
return (React.createElement(StyledWrapper$5, { show: show },
|
|
3093
3222
|
React.createElement("div", { className: 'modal__container' },
|
|
3094
3223
|
React.createElement("div", { className: 'modal__header' },
|
|
3095
3224
|
React.createElement("div", null, title),
|
|
@@ -3114,7 +3243,7 @@ var CustomizationsModal = /** @class */ (function (_super) {
|
|
|
3114
3243
|
return CustomizationsModal;
|
|
3115
3244
|
}(Component));
|
|
3116
3245
|
|
|
3117
|
-
var LoadingTableRow = styled.tr(templateObject_1$
|
|
3246
|
+
var LoadingTableRow = styled.tr(templateObject_1$1g || (templateObject_1$1g = __makeTemplateObject(["\n height: 49px;\n"], ["\n height: 49px;\n"])));
|
|
3118
3247
|
var LoadingContent = function (props) {
|
|
3119
3248
|
// Loading elments for the table
|
|
3120
3249
|
var renderElements = function () {
|
|
@@ -3134,7 +3263,7 @@ var LoadingContent = function (props) {
|
|
|
3134
3263
|
};
|
|
3135
3264
|
return React.createElement(React.Fragment, null, renderElements());
|
|
3136
3265
|
};
|
|
3137
|
-
var templateObject_1$
|
|
3266
|
+
var templateObject_1$1g;
|
|
3138
3267
|
|
|
3139
3268
|
var Pagination$1 = function (props) {
|
|
3140
3269
|
var managedCurrentPage = props.currentPage;
|
|
@@ -3301,7 +3430,7 @@ var StyledTableWrapper = styled(UnstyledTable)(templateObject_7$6 || (templateOb
|
|
|
3301
3430
|
"\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 ",
|
|
3302
3431
|
"\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 ",
|
|
3303
3432
|
"\n ",
|
|
3304
|
-
"\n }\n }\n "])), isHeaderFixed && css(templateObject_1$
|
|
3433
|
+
"\n }\n }\n "])), isHeaderFixed && 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 && css(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "], ["\n &:first-child {\n width: 20px;\n border-right: 0;\n }\n "]))), palette.black, palette.yellow[50], palette.yellow[100], !isLoading && css(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n &:hover {\n background-color: ", ";\n }\n "], ["\n &:hover {\n background-color: ", ";\n }\n "])), palette.grey[100]), !disableSelection && css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n &:first-child {\n width: 20px;\n }\n "], ["\n &:first-child {\n width: 20px;\n }\n "]))));
|
|
3305
3434
|
}, function (_a) {
|
|
3306
3435
|
var palette = _a.theme.palette;
|
|
3307
3436
|
return palette.blue[500];
|
|
@@ -3309,11 +3438,11 @@ var StyledTableWrapper = styled(UnstyledTable)(templateObject_7$6 || (templateOb
|
|
|
3309
3438
|
var palette = _a.theme.palette;
|
|
3310
3439
|
return css(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ", "\n "], ["\n .pagination__element {\n padding: 0.5rem;\n font-size: 14px;\n line-height: 24px;\n color: ", ";\n cursor: pointer;\n box-sizing: content-box;\n\n &.deactivated {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &.selected {\n color: ", ";\n background-color: ", ";\n font-weight: 500;\n border-radius: 4px;\n height: 24px;\n width: 24px;\n text-align: center;\n }\n }\n /* Loading animation */\n ", "\n "])), palette.grey[700], palette.white[100], palette.grey[700], linearBackground());
|
|
3311
3440
|
}, spacing.xxxl);
|
|
3312
|
-
var templateObject_1$
|
|
3441
|
+
var templateObject_1$1h, templateObject_2$C, templateObject_3$l, templateObject_4$d, templateObject_5$8, templateObject_6$6, templateObject_7$6;
|
|
3313
3442
|
|
|
3314
3443
|
var Table = function (props) { return React.createElement(StyledTableWrapper, __assign({}, props)); };
|
|
3315
3444
|
|
|
3316
|
-
var ActiveTag = styled.span(templateObject_1$
|
|
3445
|
+
var ActiveTag = styled.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) {
|
|
3317
3446
|
var active = _a.active, theme = _a.theme;
|
|
3318
3447
|
return (active ? theme.palette.primary[500] : 'transparent');
|
|
3319
3448
|
}, function (_a) {
|
|
@@ -3323,30 +3452,30 @@ var ActiveTag = styled.span(templateObject_1$1a || (templateObject_1$1a = __make
|
|
|
3323
3452
|
var active = _a.active, theme = _a.theme;
|
|
3324
3453
|
return (active ? theme.palette.primary[500] : theme.palette.grey[900]);
|
|
3325
3454
|
});
|
|
3326
|
-
var templateObject_1$
|
|
3455
|
+
var templateObject_1$1i;
|
|
3327
3456
|
|
|
3328
|
-
var Tab = styled.span(templateObject_1$
|
|
3457
|
+
var Tab = styled.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) {
|
|
3329
3458
|
var active = _a.active, theme = _a.theme;
|
|
3330
3459
|
return (active ? theme.palette.primary[500] : theme.palette.grey[500]);
|
|
3331
3460
|
}, function (_a) {
|
|
3332
3461
|
var active = _a.active, theme = _a.theme;
|
|
3333
3462
|
return (active ? theme.palette.primary[500] : theme.palette.grey[900]);
|
|
3334
3463
|
});
|
|
3335
|
-
var templateObject_1$
|
|
3464
|
+
var templateObject_1$1j;
|
|
3336
3465
|
|
|
3337
3466
|
var Item$1 = function (_a) {
|
|
3338
3467
|
var active = _a.active, handleClick = _a.handleClick, tabRef = _a.tabRef, text = _a.text;
|
|
3339
|
-
return (React.createElement(ItemWrapper, { ref: tabRef, onClick: handleClick },
|
|
3468
|
+
return (React.createElement(ItemWrapper, { ref: tabRef === null || tabRef === void 0 ? void 0 : tabRef(), onClick: handleClick },
|
|
3340
3469
|
React.createElement(Tab, { active: active }, text),
|
|
3341
3470
|
React.createElement(ActiveTag, { active: active })));
|
|
3342
3471
|
};
|
|
3343
|
-
var ItemWrapper = styled.div(templateObject_1$
|
|
3344
|
-
var templateObject_1$
|
|
3472
|
+
var ItemWrapper = styled.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"])));
|
|
3473
|
+
var templateObject_1$1k;
|
|
3345
3474
|
|
|
3346
|
-
var TabsWrapper = styled.div(templateObject_2$
|
|
3475
|
+
var TabsWrapper = styled.div(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ", ";\n\n & > *:first-child {\n padding-left: ", "px;\n }\n\n & > *:last-child {\n padding-right: ", "px;\n }\n\n & > * + * {\n margin-left: ", "px;\n }\n"], ["\n box-sizing: border-box;\n height: 31px;\n alignment-baseline: baseline;\n display: flex;\n white-space: nowrap;\n margin-top: 3px;\n width: 100%;\n\n ",
|
|
3347
3476
|
";\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) {
|
|
3348
3477
|
var hidden = _a.hidden;
|
|
3349
|
-
return hidden && css(templateObject_1$
|
|
3478
|
+
return hidden && css(templateObject_1$1l || (templateObject_1$1l = __makeTemplateObject(["\n visibility: hidden;\n position: absolute;\n "], ["\n visibility: hidden;\n position: absolute;\n "])));
|
|
3350
3479
|
}, function (_a) {
|
|
3351
3480
|
var lateralPadding = _a.lateralPadding;
|
|
3352
3481
|
return lateralPadding;
|
|
@@ -3358,7 +3487,7 @@ var TabsWrapper = styled.div(templateObject_2$B || (templateObject_2$B = __makeT
|
|
|
3358
3487
|
return distance;
|
|
3359
3488
|
});
|
|
3360
3489
|
var ScrollableTabsWrapper = styled(TabsWrapper)(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"], ["\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n"])));
|
|
3361
|
-
var templateObject_1$
|
|
3490
|
+
var templateObject_1$1l, templateObject_2$D, templateObject_3$m;
|
|
3362
3491
|
|
|
3363
3492
|
var useResizedWidth = function () {
|
|
3364
3493
|
var _a = useMeasure(), elementsWrapperRef = _a[0], wrapperTmpWidth = _a[1].width;
|
|
@@ -3391,8 +3520,8 @@ var TabsDropdownTrigger = function (_a) {
|
|
|
3391
3520
|
var active = _a.active;
|
|
3392
3521
|
return (React.createElement(Item$1, { active: active, text: React.createElement(DropdownIcon, { icon: faEllipsisH$1, fixedWidth: true }) }));
|
|
3393
3522
|
};
|
|
3394
|
-
var DropdownIcon = styled(Icon)(templateObject_1$
|
|
3395
|
-
var templateObject_1$
|
|
3523
|
+
var DropdownIcon = styled(Icon)(templateObject_1$1m || (templateObject_1$1m = __makeTemplateObject(["\n height: 21px;\n"], ["\n height: 21px;\n"])));
|
|
3524
|
+
var templateObject_1$1m;
|
|
3396
3525
|
|
|
3397
3526
|
var TabsDropdown = function (_a) {
|
|
3398
3527
|
var active = _a.active, tabs = _a.tabs;
|
|
@@ -3406,14 +3535,21 @@ var TabsDropdown = function (_a) {
|
|
|
3406
3535
|
}))); }, [tabs]);
|
|
3407
3536
|
return React.createElement(Dropdown$2, { placement: 'bottom-end', fullWidth: true, renderTrigger: renderTrigger, renderContent: renderContent });
|
|
3408
3537
|
};
|
|
3409
|
-
var Dropdown$2 = styled(Dropdown)(templateObject_1$
|
|
3410
|
-
var templateObject_1$
|
|
3538
|
+
var Dropdown$2 = styled(Dropdown)(templateObject_1$1n || (templateObject_1$1n = __makeTemplateObject(["\n display: block;\n"], ["\n display: block;\n"])));
|
|
3539
|
+
var templateObject_1$1n;
|
|
3411
3540
|
|
|
3412
3541
|
var DropdownTabs = function (_a) {
|
|
3413
3542
|
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;
|
|
3414
3543
|
var _d = useResizedWidth(), elementsWrapperRef = _d.elementsWrapperRef, wrapperWidth = _d.wrapperWidth;
|
|
3544
|
+
var _e = useState(0), refresh = _e[1];
|
|
3415
3545
|
var tabsLength = tabs.length;
|
|
3416
3546
|
var tabsRefs = useMemo(function () { return Array.from(Array(tabsLength), function () { return React.createRef(); }); }, [tabsLength]);
|
|
3547
|
+
var cbRef = useMemo(function () {
|
|
3548
|
+
return tabsRefs.map(function (ref) { return function () {
|
|
3549
|
+
refresh(function (n) { return n + 1; });
|
|
3550
|
+
return ref;
|
|
3551
|
+
}; });
|
|
3552
|
+
}, [tabsRefs]);
|
|
3417
3553
|
var visibleCount = useTabItemsCount({
|
|
3418
3554
|
distance: distance,
|
|
3419
3555
|
tabsLength: tabsLength,
|
|
@@ -3421,7 +3557,7 @@ var DropdownTabs = function (_a) {
|
|
|
3421
3557
|
tabsRefs: tabsRefs,
|
|
3422
3558
|
lateralPadding: lateralPadding,
|
|
3423
3559
|
}).visibleCount;
|
|
3424
|
-
var tabsItems = useMemo(function () { return tabs.map(function (attrs, i) { return React.createElement(Item$1, __assign({ key: i, tabRef:
|
|
3560
|
+
var tabsItems = useMemo(function () { return tabs.map(function (attrs, i) { return React.createElement(Item$1, __assign({ key: i, tabRef: cbRef[i] }, attrs)); }); }, [tabs, tabsRefs]);
|
|
3425
3561
|
var visibleItems = useMemo(function () { return tabs.slice(0, visibleCount).map(function (attrs, i) { return React.createElement(Item$1, __assign({ key: i }, attrs)); }); }, [tabs, visibleCount]);
|
|
3426
3562
|
var dropdownItems = useMemo(function () { return tabs.slice(visibleCount); }, [tabs, visibleCount]);
|
|
3427
3563
|
var dropdownVisible = dropdownItems.length !== 0;
|
|
@@ -3434,8 +3570,8 @@ var DropdownTabs = function (_a) {
|
|
|
3434
3570
|
dropdownVisible && React.createElement(TabsDropdown, { active: dropdownActive, tabs: dropdownItems }))));
|
|
3435
3571
|
};
|
|
3436
3572
|
// Remove scrollbar on ScrollableWrapper used until real DropdownTabs is loaded
|
|
3437
|
-
var StyledScrollableWrapper = styled(ScrollableTabsWrapper)(templateObject_1$
|
|
3438
|
-
var templateObject_1$
|
|
3573
|
+
var StyledScrollableWrapper = styled(ScrollableTabsWrapper)(templateObject_1$1o || (templateObject_1$1o = __makeTemplateObject(["\n overflow-x: hidden;\n"], ["\n overflow-x: hidden;\n"])));
|
|
3574
|
+
var templateObject_1$1o;
|
|
3439
3575
|
|
|
3440
3576
|
var ScrollableTabs = function (_a) {
|
|
3441
3577
|
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;
|
|
@@ -3448,19 +3584,19 @@ var TextButton = function (_a) {
|
|
|
3448
3584
|
var callback = useCallback(function () {
|
|
3449
3585
|
!isDisabled && onClick();
|
|
3450
3586
|
}, [isDisabled, onClick]);
|
|
3451
|
-
return (React.createElement(Wrapper$
|
|
3587
|
+
return (React.createElement(Wrapper$l, __assign({ isDisabled: isDisabled, onClick: callback }, rest), text));
|
|
3452
3588
|
};
|
|
3453
3589
|
var getColorIntensity = function (color) { return (color === 'white' ? 100 : 500); };
|
|
3454
|
-
var enabledCss = function (theme, color) { return css(templateObject_1$
|
|
3455
|
-
var disabledCss = css(templateObject_2$
|
|
3590
|
+
var enabledCss = function (theme, color) { return 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)]); };
|
|
3591
|
+
var disabledCss = 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) {
|
|
3456
3592
|
var theme = _a.theme;
|
|
3457
3593
|
return theme.palette.grey[500];
|
|
3458
3594
|
});
|
|
3459
|
-
var Wrapper$
|
|
3595
|
+
var Wrapper$l = styled.div(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
3460
3596
|
var color = _a.color, isDisabled = _a.isDisabled, theme = _a.theme;
|
|
3461
3597
|
return (isDisabled ? disabledCss : enabledCss(theme, color));
|
|
3462
3598
|
});
|
|
3463
|
-
var templateObject_1$
|
|
3599
|
+
var templateObject_1$1p, templateObject_2$E, templateObject_3$n;
|
|
3464
3600
|
|
|
3465
3601
|
var ThemeProvider = function (_a) {
|
|
3466
3602
|
var children = _a.children, theme = _a.theme;
|
|
@@ -3468,20 +3604,20 @@ var ThemeProvider = function (_a) {
|
|
|
3468
3604
|
React.createElement(React.Fragment, null, children)));
|
|
3469
3605
|
};
|
|
3470
3606
|
|
|
3471
|
-
var StyledTip = styled.div(templateObject_1$
|
|
3607
|
+
var StyledTip = styled.div(templateObject_1$1q || (templateObject_1$1q = __makeTemplateObject(["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"], ["\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n padding: 16px;\n color: ", ";\n background-color: ", ";\n border-radius: 100px;\n"])), function (_a) {
|
|
3472
3608
|
var palette = _a.theme.palette;
|
|
3473
3609
|
return palette.white[100];
|
|
3474
3610
|
}, function (_a) {
|
|
3475
3611
|
var palette = _a.theme.palette;
|
|
3476
3612
|
return palette.primary[400];
|
|
3477
3613
|
});
|
|
3478
|
-
var StyledLeftIcon = styled.span(templateObject_2$
|
|
3614
|
+
var StyledLeftIcon = styled.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"])));
|
|
3479
3615
|
var StyledText = styled.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"])));
|
|
3480
3616
|
var StyledCloseIcon$1 = styled.div(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ", ";\n }\n"], ["\n margin-left: 32px;\n line-height: 20px;\n & :hover {\n cursor: pointer;\n color: ", ";\n }\n"])), function (_a) {
|
|
3481
3617
|
var palette = _a.theme.palette;
|
|
3482
3618
|
return palette.white[100];
|
|
3483
3619
|
});
|
|
3484
|
-
var templateObject_1$
|
|
3620
|
+
var templateObject_1$1q, templateObject_2$F, templateObject_3$o, templateObject_4$e;
|
|
3485
3621
|
|
|
3486
3622
|
var defaultCloseIcon$1 = {
|
|
3487
3623
|
icon: faTimes,
|
|
@@ -3506,14 +3642,14 @@ var ShortcutTip = function (props) {
|
|
|
3506
3642
|
React.createElement("b", null, shortcut)), leftIcon: rocketIcon }, rest)));
|
|
3507
3643
|
};
|
|
3508
3644
|
|
|
3509
|
-
var StyledIconDiv = styled.div(templateObject_1$
|
|
3510
|
-
var StyledIcon$8 = styled(Icon)(templateObject_2$
|
|
3645
|
+
var StyledIconDiv = styled.div(templateObject_1$1r || (templateObject_1$1r = __makeTemplateObject(["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"], ["\n display: inline-block;\n width: 24px;\n height: 24px;\n margin-left: 16px;\n margin-top: 16px;\n text-align: center;\n"])));
|
|
3646
|
+
var StyledIcon$8 = styled(Icon)(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n vertical-align: sub;\n"], ["\n vertical-align: sub;\n"])));
|
|
3511
3647
|
var StyledTitle$1 = styled.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"])));
|
|
3512
3648
|
var StyledContent$1 = styled.div(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"], ["\n display: block;\n margin: 4px 16px 16px 48px;\n line-height: 21px;\n font-weight: 400;\n word-break: break-word;\n overflow: hidden;\n text-overflow: clip;\n"])));
|
|
3513
3649
|
var StyledAction = styled.div(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"], ["\n display: inline-block;\n height: 21px;\n float: right;\n margin-right: -1px;\n cursor: pointer;\n"])));
|
|
3514
3650
|
var StyledToast = styled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"], ["\n min-height: 56px;\n line-height: 24px;\n font-size: 14px;\n user-select: none;\n"])));
|
|
3515
3651
|
var StyledActionLabel = styled.label(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
|
|
3516
|
-
var templateObject_1$
|
|
3652
|
+
var templateObject_1$1r, templateObject_2$G, templateObject_3$p, templateObject_4$f, templateObject_5$9, templateObject_6$7, templateObject_7$7;
|
|
3517
3653
|
|
|
3518
3654
|
var typeMap$2 = {
|
|
3519
3655
|
standard: 'dark',
|
|
@@ -3565,8 +3701,8 @@ var ToastContainer = styled(ToastContainer$1).attrs({
|
|
|
3565
3701
|
closeOnClick: false,
|
|
3566
3702
|
draggable: false,
|
|
3567
3703
|
rtl: false,
|
|
3568
|
-
})(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"])));
|
|
3569
|
-
var templateObject_1$
|
|
3704
|
+
})(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"])));
|
|
3705
|
+
var templateObject_1$1s;
|
|
3570
3706
|
|
|
3571
3707
|
var Toast = {
|
|
3572
3708
|
Container: ToastContainer,
|
|
@@ -3579,4 +3715,4 @@ var Toast = {
|
|
|
3579
3715
|
standard: standard,
|
|
3580
3716
|
};
|
|
3581
3717
|
|
|
3582
|
-
export { Accordion, Avatar, Badge, Banner, Button, Checkbox, Chip, ConfirmationModal, Drawer, Dropdown, DropdownTabs, GroupedList, Icon, IconBackground, IconButton, InlineMessage, InputHelper, InputText, MicroTag, Modal, ModalBody, ModalSearchable, PageEmptySet, Pagination, Progressbar, RadioButton, RadioButtonGroup, ScrollableTabs, Select,
|
|
3718
|
+
export { Accordion, AsyncCreatableSelect, AsyncSelect, Avatar, Badge, Banner, Button, Checkbox, Chip, ConfirmationModal, CreatableSelect, Drawer, Dropdown, DropdownTabs, GroupedList, Icon, IconBackground, IconButton, InlineMessage, InputHelper, InputText, MicroTag, Modal, ModalBody, ModalSearchable, PageEmptySet, Pagination, Progressbar, RadioButton, RadioButtonGroup, ScrollableTabs, Select, ShortcutTip, SidebarItem, Stepper, Table, Tag, TextArea, TextButton, ThemeProvider, Tip, Toast, Tooltip, WithBadge, sidebarItemHeight, useCheckboxValue };
|