@luscii-healthtech/web-ui 2.40.2 → 2.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AccordionList/AccordionList.d.ts +1 -0
- package/dist/web-ui-tailwind.css +12 -0
- package/dist/web-ui.cjs.development.js +99 -95
- package/dist/web-ui.cjs.development.js.map +1 -1
- package/dist/web-ui.cjs.production.min.js +1 -1
- package/dist/web-ui.cjs.production.min.js.map +1 -1
- package/dist/web-ui.esm.js +99 -95
- package/dist/web-ui.esm.js.map +1 -1
- package/package.json +1 -1
|
@@ -12,6 +12,7 @@ export interface AccordionListProps extends Omit<AccordionProps, "items"> {
|
|
|
12
12
|
accordionItems: AccordionListItemProps[];
|
|
13
13
|
buttonProps?: BaseButtonProps;
|
|
14
14
|
isSearchEnabled?: boolean;
|
|
15
|
+
isLoading?: boolean;
|
|
15
16
|
}
|
|
16
17
|
export interface AccordionListItemProps extends Omit<AccordionItemProps, "content"> {
|
|
17
18
|
listItems: ListItemProps[];
|
package/dist/web-ui-tailwind.css
CHANGED
|
@@ -1216,6 +1216,10 @@ video {
|
|
|
1216
1216
|
justify-content: space-between;
|
|
1217
1217
|
}
|
|
1218
1218
|
|
|
1219
|
+
.flex-1 {
|
|
1220
|
+
flex: 1 1 0%;
|
|
1221
|
+
}
|
|
1222
|
+
|
|
1219
1223
|
.flex-auto {
|
|
1220
1224
|
flex: 1 1 auto;
|
|
1221
1225
|
}
|
|
@@ -2228,6 +2232,14 @@ video {
|
|
|
2228
2232
|
width: 0.625rem;
|
|
2229
2233
|
}
|
|
2230
2234
|
|
|
2235
|
+
.w-1\/3 {
|
|
2236
|
+
width: 33.333333%;
|
|
2237
|
+
}
|
|
2238
|
+
|
|
2239
|
+
.w-2\/3 {
|
|
2240
|
+
width: 66.666667%;
|
|
2241
|
+
}
|
|
2242
|
+
|
|
2231
2243
|
.w-full {
|
|
2232
2244
|
width: 100%;
|
|
2233
2245
|
}
|
|
@@ -1670,7 +1670,44 @@ var EmptyListMessage = function EmptyListMessage(_ref) {
|
|
|
1670
1670
|
}));
|
|
1671
1671
|
};
|
|
1672
1672
|
|
|
1673
|
-
var
|
|
1673
|
+
var img$3 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3e %3cg fill='none' fill-rule='nonzero'%3e %3ccircle cx='10' cy='10' r='10' fill='%23F09'%3e %3canimate attributeName='opacity' dur='2s' values='1%3b0.6%3b1' repeatCount='indefinite' begin='0.1'/%3e %3canimate attributeName='r' dur='2s' repeatCount='indefinite' values='10%3b8%3b10' begin='0.1'/%3e %3c/circle%3e %3ccircle cx='34' cy='10' r='10' fill='%236ABFA5'%3e %3canimate attributeName='opacity' dur='2s' values='1%3b0.6%3b1' repeatCount='indefinite' begin='0.6'/%3e %3canimate attributeName='r' dur='2s' repeatCount='indefinite' values='10%3b8%3b10' begin='0.6'/%3e %3c/circle%3e %3ccircle cx='58' cy='10' r='10' fill='%236670A5'%3e %3canimate attributeName='opacity' dur='2s' values='1%3b0.6%3b1' repeatCount='indefinite' begin='1.1'/%3e %3canimate attributeName='r' dur='2s' repeatCount='indefinite' values='10%3b8%3b10' begin='1.1'/%3e %3c/circle%3e %3c/g%3e%3c/svg%3e";
|
|
1674
|
+
|
|
1675
|
+
var img$4 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='margin: auto%3b background: none%3b display: block%3b shape-rendering: auto%3b' width='200px' height='200px' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3e%3ccircle cx='50' cy='50' fill='none' stroke='%23009fe3' stroke-width='16' r='36' stroke-dasharray='169.64600329384882 58.548667764616276'%3e %3canimateTransform attributeName='transform' type='rotate' repeatCount='indefinite' dur='1.1111111111111112s' values='0 50 50%3b360 50 50' keyTimes='0%3b1'%3e%3c/animateTransform%3e%3c/circle%3e%3c/svg%3e";
|
|
1676
|
+
|
|
1677
|
+
var img$5 = "data:image/svg+xml,%3c%3fxml version='1.0' encoding='utf-8'%3f%3e%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='margin: auto%3b background: none%3b display: block%3b shape-rendering: auto%3b' width='200px' height='200px' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3e%3ccircle cx='50' cy='50' fill='none' stroke='%23cbd5e1' stroke-width='16' r='36' stroke-dasharray='169.64600329384882 58.548667764616276'%3e %3canimateTransform attributeName='transform' type='rotate' repeatCount='indefinite' dur='1.1111111111111112s' values='0 50 50%3b360 50 50' keyTimes='0%3b1'%3e%3c/animateTransform%3e%3c/circle%3e%3c!-- %5bldio%5d generated by https://loading.io/ --%3e%3c/svg%3e";
|
|
1678
|
+
|
|
1679
|
+
var css_248z$6 = ".cweb-loading {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.cweb-loading .cweb-loading-text {\n margin-bottom: 24px;\n}\n\n.cweb-loading.as-modal {\n position: fixed;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n z-index: 9999;\n background-color: rgba(255, 255, 255, 0.6);\n}\n\n.cweb-loading.as-modal .cweb-loading-panel {\n position: relative;\n width: 320px;\n min-height: 120px;\n border-radius: 4px;\n padding: 16px;\n box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.36);\n background-color: #ffffff;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n\n.cweb-loading.as-modal .cweb-loading-panel:before {\n position: absolute;\n content: \"\";\n top: 0;\n left: 0;\n right: 0;\n z-index: 1;\n height: 3px;\n background-color: #6abfa5;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}";
|
|
1680
|
+
styleInject(css_248z$6);
|
|
1681
|
+
|
|
1682
|
+
var _excluded$5 = ["asModal", "asSpinner", "className", "spinnerColor"];
|
|
1683
|
+
function LoadingIndicator(_ref) {
|
|
1684
|
+
var _ref$asModal = _ref.asModal,
|
|
1685
|
+
asModal = _ref$asModal === void 0 ? false : _ref$asModal,
|
|
1686
|
+
_ref$asSpinner = _ref.asSpinner,
|
|
1687
|
+
asSpinner = _ref$asSpinner === void 0 ? false : _ref$asSpinner,
|
|
1688
|
+
_ref$className = _ref.className,
|
|
1689
|
+
className = _ref$className === void 0 ? "" : _ref$className,
|
|
1690
|
+
_ref$spinnerColor = _ref.spinnerColor,
|
|
1691
|
+
spinnerColor = _ref$spinnerColor === void 0 ? "blue" : _ref$spinnerColor,
|
|
1692
|
+
restProps = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
1693
|
+
|
|
1694
|
+
var spinnerToRender = spinnerColor === "blue" ? img$4 : img$5;
|
|
1695
|
+
var containerClassName = classNames("cweb-loading", className, {
|
|
1696
|
+
"as-modal": asModal
|
|
1697
|
+
});
|
|
1698
|
+
return /*#__PURE__*/React__default.createElement("div", _extends({}, restProps, {
|
|
1699
|
+
className: containerClassName
|
|
1700
|
+
}), /*#__PURE__*/React__default.createElement("img", {
|
|
1701
|
+
src: asSpinner ? spinnerToRender : img$3,
|
|
1702
|
+
"data-chromatic": "ignore",
|
|
1703
|
+
className: classNames("text-gray-600 fill-current stroke-current", {
|
|
1704
|
+
"h-4 w-4": asSpinner,
|
|
1705
|
+
"h-12 w-12": !asSpinner
|
|
1706
|
+
})
|
|
1707
|
+
}));
|
|
1708
|
+
}
|
|
1709
|
+
|
|
1710
|
+
var _excluded$6 = ["localisations", "buttonProps", "accordionItems", "isSearchEnabled", "isLoading"];
|
|
1674
1711
|
var AccordionList = function AccordionList(_ref) {
|
|
1675
1712
|
var _ref$localisations = _ref.localisations,
|
|
1676
1713
|
title = _ref$localisations.title,
|
|
@@ -1682,7 +1719,9 @@ var AccordionList = function AccordionList(_ref) {
|
|
|
1682
1719
|
accordionItems = _ref.accordionItems,
|
|
1683
1720
|
_ref$isSearchEnabled = _ref.isSearchEnabled,
|
|
1684
1721
|
isSearchEnabled = _ref$isSearchEnabled === void 0 ? false : _ref$isSearchEnabled,
|
|
1685
|
-
|
|
1722
|
+
_ref$isLoading = _ref.isLoading,
|
|
1723
|
+
isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
|
|
1724
|
+
accordionProps = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
1686
1725
|
|
|
1687
1726
|
var _useState = React.useState(""),
|
|
1688
1727
|
searchString = _useState[0],
|
|
@@ -1709,7 +1748,7 @@ var AccordionList = function AccordionList(_ref) {
|
|
|
1709
1748
|
}).filter(Boolean);
|
|
1710
1749
|
}, [accordionItems, searchString]);
|
|
1711
1750
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
1712
|
-
className: "bg-white rounded-lg box-border overflow-auto"
|
|
1751
|
+
className: "bg-white h-full rounded-lg box-border overflow-auto flex flex-col"
|
|
1713
1752
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
1714
1753
|
className: "p-6 flex flex-col space-y-4 border-b border-slate-100"
|
|
1715
1754
|
}, title && /*#__PURE__*/React__default.createElement(Title, {
|
|
@@ -1722,9 +1761,11 @@ var AccordionList = function AccordionList(_ref) {
|
|
|
1722
1761
|
onChange: function onChange(e) {
|
|
1723
1762
|
setSearchString(typeof e === "string" ? e : e.currentTarget.value);
|
|
1724
1763
|
}
|
|
1725
|
-
}), buttonProps && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(SecondaryButton, _extends({}, buttonProps)))),
|
|
1764
|
+
}), buttonProps && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(SecondaryButton, _extends({}, buttonProps)))), isLoading && /*#__PURE__*/React__default.createElement(LoadingIndicator, {
|
|
1765
|
+
className: "flex-1"
|
|
1766
|
+
}), !isLoading && filteredAccordionItems.length > 0 && /*#__PURE__*/React__default.createElement(Accordion, _extends({}, accordionProps, {
|
|
1726
1767
|
items: filteredAccordionItems
|
|
1727
|
-
}))
|
|
1768
|
+
})), !isLoading && filteredAccordionItems.length === 0 && /*#__PURE__*/React__default.createElement(EmptyListMessage, {
|
|
1728
1769
|
imageName: "search-not-found",
|
|
1729
1770
|
text: emptyListText,
|
|
1730
1771
|
className: "mb-4 py-4 border-t border-b border-slate-100"
|
|
@@ -1834,8 +1875,8 @@ var Modal = function Modal(props) {
|
|
|
1834
1875
|
return /*#__PURE__*/React__default.createElement(ModalBase, _extends({}, props));
|
|
1835
1876
|
};
|
|
1836
1877
|
|
|
1837
|
-
var css_248z$
|
|
1838
|
-
styleInject(css_248z$
|
|
1878
|
+
var css_248z$7 = ".cweb-avatar {\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n align-items: center;\n width: 64px;\n box-sizing: border-box;\n}\n\n.cweb-avatar > .avatar-content-container {\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n width: 64px;\n height: 64px;\n border-radius: 50%;\n box-sizing: border-box;\n}\n\n.cweb-avatar > .avatar-content-container > .avatar-image {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n}\n\n.cweb-avatar > .avatar-content-container > .avatar-initials-text {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 24px;\n font-weight: 300;\n line-height: 1;\n color: #737373;\n margin: 0;\n pointer-events: none;\n}\n\n.cweb-avatar.size-large {\n width: 128px;\n}\n\n.cweb-avatar.size-large > .avatar-content-container {\n width: 128px;\n height: 128px;\n}\n\n.cweb-avatar.size-large > .avatar-content-container > .avatar-initials-text {\n font-size: 48px;\n}\n\n.cweb-avatar.size-medium {\n width: 64px;\n}\n\n.cweb-avatar.size-medium > .avatar-content-container {\n width: 64px;\n height: 64px;\n}\n\n.cweb-avatar.size-medium > .avatar-content-container > .avatar-initials-text {\n font-size: 24px;\n}\n\n.cweb-avatar.size-small {\n width: 36px;\n}\n\n.cweb-avatar.size-small > .avatar-content-container {\n width: 36px;\n height: 36px;\n}\n\n.cweb-avatar.size-small > .avatar-content-container > .avatar-initials-text {\n font-size: 14px;\n}\n\n.cweb-avatar.type-editable {\n cursor: pointer;\n}\n\n.cweb-avatar.type-editable > .avatar-content-container {\n position: relative;\n border-color: #0074dd;\n background-color: #ffffff;\n}\n\n.cweb-avatar.type-editable > .avatar-content-container:after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n border-radius: 50%;\n transition: 0.4s ease background-color;\n}\n\n.cweb-avatar.type-editable > .avatar-content-container:hover:after {\n background-color: rgba(0, 116, 221, 0.1);\n}\n\n.cweb-avatar.type-editable > .avatar-content-container > .avatar-initials-text {\n color: #0074dd;\n}\n\n.cweb-avatar.type-readonly > .avatar-content-container {\n border-color: #cccccc;\n background-color: #f1f5f9;\n}\n\n.cweb-avatar.type-readonly > .avatar-content-container > .avatar-initials-text {\n color: #64748b;\n}\n\n@media (max-width: 767px) {\n .cweb-avatar.size-large {\n width: 64px;\n }\n\n .cweb-avatar.size-large > .avatar-content-container {\n width: 64px;\n height: 64px;\n }\n\n .cweb-avatar.size-large > .avatar-content-container > .avatar-initials-text {\n font-size: 24px;\n }\n\n .cweb-avatar.size-large.display-initials > .avatar-content-container {\n border-width: 0.5px;\n }\n}";
|
|
1879
|
+
styleInject(css_248z$7);
|
|
1839
1880
|
|
|
1840
1881
|
function checkImageValidity(src) {
|
|
1841
1882
|
return new Promise(function (resolve) {
|
|
@@ -2069,41 +2110,41 @@ var PrintIcon = function PrintIcon(props) {
|
|
|
2069
2110
|
}));
|
|
2070
2111
|
};
|
|
2071
2112
|
|
|
2072
|
-
var img$
|
|
2113
|
+
var img$6 = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M7.05037 5.63664C6.65984 5.24612 6.02668 5.24612 5.63615 5.63664C5.24563 6.02717 5.24563 6.66033 5.63616 7.05086L10.5862 12.0009L5.63618 16.9509C5.24566 17.3415 5.24566 17.9746 5.63618 18.3652C6.02671 18.7557 6.65987 18.7557 7.0504 18.3652L12.0004 13.4151L16.9499 18.3646C17.3404 18.7551 17.9736 18.7551 18.3641 18.3646C18.7546 17.974 18.7546 17.3409 18.3641 16.9504L13.4146 12.0009L18.3641 7.05145C18.7546 6.66093 18.7546 6.02776 18.3641 5.63724C17.9736 5.24671 17.3404 5.24671 16.9499 5.63724L12.0004 10.5867L7.05037 5.63664Z' fill='%23EDF2F7'/%3e%3c/svg%3e";
|
|
2073
2114
|
|
|
2074
|
-
var img$
|
|
2115
|
+
var img$7 = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M3 6C3 5.44772 3.44772 5 4 5H20C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H4C3.44772 7 3 6.55228 3 6Z' fill='%23EDF2F7'/%3e%3cpath d='M3 12C3 11.4477 3.44772 11 4 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H4C3.44772 13 3 12.5523 3 12Z' fill='%23EDF2F7'/%3e%3cpath d='M4 17C3.44772 17 3 17.4477 3 18C3 18.5523 3.44772 19 4 19H20C20.5523 19 21 18.5523 21 18C21 17.4477 20.5523 17 20 17H4Z' fill='%23EDF2F7'/%3e%3c/svg%3e";
|
|
2075
2116
|
|
|
2076
|
-
var img$
|
|
2117
|
+
var img$8 = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.31008 6.70978C8.92008 7.09978 8.92008 7.72978 9.31008 8.11978L13.1901 11.9998L9.31008 15.8798C8.92008 16.2698 8.92008 16.8998 9.31008 17.2898C9.70008 17.6798 10.3301 17.6798 10.7201 17.2898L15.3101 12.6998C15.7001 12.3098 15.7001 11.6798 15.3101 11.2898L10.7201 6.69978C10.3401 6.31978 9.70008 6.31978 9.31008 6.70978Z' fill='%230074DD'/%3e%3c/svg%3e";
|
|
2077
2118
|
|
|
2078
|
-
var img$
|
|
2119
|
+
var img$9 = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M9.31008 6.70978C8.92008 7.09978 8.92008 7.72978 9.31008 8.11978L13.1901 11.9998L9.31008 15.8798C8.92008 16.2698 8.92008 16.8998 9.31008 17.2898C9.70008 17.6798 10.3301 17.6798 10.7201 17.2898L15.3101 12.6998C15.7001 12.3098 15.7001 11.6798 15.3101 11.2898L10.7201 6.69978C10.3401 6.31978 9.70008 6.31978 9.31008 6.70978Z' fill='%23EDF2F7'/%3e%3c/svg%3e";
|
|
2079
2120
|
|
|
2080
|
-
var img$
|
|
2121
|
+
var img$a = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M13.6899 17.2902C14.0799 16.9002 14.0799 16.2702 13.6899 15.8802L9.80992 12.0002L13.6899 8.12022C14.0799 7.73022 14.0799 7.10022 13.6899 6.71022C13.2999 6.32022 12.6699 6.32022 12.2799 6.71022L7.68992 11.3002C7.29992 11.6902 7.29992 12.3202 7.68992 12.7102L12.2799 17.3002C12.6599 17.6802 13.2999 17.6802 13.6899 17.2902Z' fill='%230074DD'/%3e%3c/svg%3e";
|
|
2081
2122
|
|
|
2082
|
-
var img$
|
|
2123
|
+
var img$b = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M13.6899 17.2902C14.0799 16.9002 14.0799 16.2702 13.6899 15.8802L9.80992 12.0002L13.6899 8.12022C14.0799 7.73022 14.0799 7.10022 13.6899 6.71022C13.2999 6.32022 12.6699 6.32022 12.2799 6.71022L7.68992 11.3002C7.29992 11.6902 7.29992 12.3202 7.68992 12.7102L12.2799 17.3002C12.6599 17.6802 13.2999 17.6802 13.6899 17.2902Z' fill='%23EDF2F7'/%3e%3c/svg%3e";
|
|
2083
2124
|
|
|
2084
|
-
var img$
|
|
2125
|
+
var img$c = "data:image/svg+xml,%3csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.5006 11.0006H11.7106L11.4306 10.7306C12.6306 9.33063 13.2506 7.42063 12.9106 5.39063C12.4406 2.61063 10.1206 0.390626 7.32063 0.0506256C3.09063 -0.469374 -0.469374 3.09063 0.0506256 7.32063C0.390626 10.1206 2.61063 12.4406 5.39063 12.9106C7.42063 13.2506 9.33063 12.6306 10.7306 11.4306L11.0006 11.7106V12.5006L15.2506 16.7506C15.6606 17.1606 16.3306 17.1606 16.7406 16.7506C17.1506 16.3406 17.1506 15.6706 16.7406 15.2606L12.5006 11.0006ZM6.50063 11.0006C4.01063 11.0006 2.00063 8.99063 2.00063 6.50063C2.00063 4.01063 4.01063 2.00063 6.50063 2.00063C8.99063 2.00063 11.0006 4.01063 11.0006 6.50063C11.0006 8.99063 8.99063 11.0006 6.50063 11.0006Z' fill='%230074DD'/%3e%3c/svg%3e";
|
|
2085
2126
|
|
|
2086
|
-
var img$
|
|
2127
|
+
var img$d = "data:image/svg+xml,%3csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M2.05086 0.636643C1.66033 0.246119 1.02717 0.246119 0.636643 0.636643C0.246119 1.02717 0.246119 1.66033 0.636643 2.05086L5.5867 7.00092L0.636672 11.9509C0.246148 12.3415 0.246148 12.9746 0.636672 13.3652C1.0272 13.7557 1.66036 13.7557 2.05089 13.3652L7.00091 8.41513L11.9503 13.3646C12.3409 13.7551 12.974 13.7551 13.3646 13.3646C13.7551 12.974 13.7551 12.3409 13.3646 11.9504L8.41513 7.00092L13.3646 2.05145C13.7551 1.66093 13.7551 1.02776 13.3646 0.637237C12.9741 0.246712 12.3409 0.246713 11.9504 0.637237L7.00092 5.5867L2.05086 0.636643Z' fill='%230074DD'/%3e%3c/svg%3e";
|
|
2087
2128
|
|
|
2088
|
-
var img$
|
|
2129
|
+
var img$e = "data:image/svg+xml,%3csvg width='19' height='18' viewBox='0 0 19 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M8.58663 1.04906C8.93899 0.258571 10.061 0.258571 10.4134 1.04906L12.1659 4.9807C12.3112 5.30673 12.6193 5.53057 12.9743 5.56804L17.2551 6.01985C18.1158 6.11069 18.4625 7.17779 17.8196 7.75718L14.6219 10.6389C14.3568 10.8778 14.2391 11.24 14.3131 11.5892L15.2063 15.8001C15.3858 16.6467 14.4781 17.3062 13.7284 16.8738L9.99962 14.7232C9.69041 14.5448 9.30959 14.5448 9.00038 14.7232L5.27159 16.8738C4.52189 17.3062 3.61416 16.6467 3.79373 15.8001L4.68686 11.5892C4.76093 11.24 4.64325 10.8778 4.37808 10.6389L1.18043 7.75718C0.537518 7.17779 0.88424 6.11069 1.74492 6.01985L6.0257 5.56804C6.38068 5.53057 6.68877 5.30673 6.8341 4.9807L8.58663 1.04906Z' fill='%23009FE3'/%3e%3c/svg%3e";
|
|
2089
2130
|
|
|
2090
|
-
var img$
|
|
2131
|
+
var img$f = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e %3cg transform='translate(1.5%2c 0.5)'%3e %3cpath fill='none' fill-rule='evenodd' stroke='%230074DD' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286'/%3e %3c/g%3e%3c/svg%3e";
|
|
2091
2132
|
|
|
2092
2133
|
var iconSrc = {
|
|
2093
2134
|
// These need to be converted to svg files instead of components and added in
|
|
2094
2135
|
// "add": AddIcon,
|
|
2095
2136
|
// "delete": DeleteIcon,
|
|
2096
2137
|
// "edit": EditIcon,
|
|
2097
|
-
close: img$
|
|
2098
|
-
hamburger: img$
|
|
2099
|
-
"chevron-right-blue": img$
|
|
2100
|
-
"chevron-left-blue": img$
|
|
2101
|
-
"chevron-right-grey": img$
|
|
2102
|
-
"chevron-left-grey": img$
|
|
2103
|
-
search: img$
|
|
2104
|
-
star: img$
|
|
2105
|
-
check: img$
|
|
2106
|
-
"search-cancel": img$
|
|
2138
|
+
close: img$6,
|
|
2139
|
+
hamburger: img$7,
|
|
2140
|
+
"chevron-right-blue": img$8,
|
|
2141
|
+
"chevron-left-blue": img$a,
|
|
2142
|
+
"chevron-right-grey": img$9,
|
|
2143
|
+
"chevron-left-grey": img$b,
|
|
2144
|
+
search: img$c,
|
|
2145
|
+
star: img$e,
|
|
2146
|
+
check: img$f,
|
|
2147
|
+
"search-cancel": img$d
|
|
2107
2148
|
};
|
|
2108
2149
|
var ButtonIcon = function ButtonIcon(props) {
|
|
2109
2150
|
return /*#__PURE__*/React.createElement("img", {
|
|
@@ -2124,7 +2165,7 @@ var BUTTON_ROLES = {
|
|
|
2124
2165
|
ICON: "icon"
|
|
2125
2166
|
};
|
|
2126
2167
|
|
|
2127
|
-
var _excluded$
|
|
2168
|
+
var _excluded$7 = ["text", "role", "type", "title", "link", "isPending", "isDisabled", "onClick", "className", "iconName", "hasIcon", "dynamicIcon"];
|
|
2128
2169
|
|
|
2129
2170
|
function Button(props) {
|
|
2130
2171
|
var _props$text = props.text,
|
|
@@ -2149,7 +2190,7 @@ function Button(props) {
|
|
|
2149
2190
|
_props$hasIcon = props.hasIcon,
|
|
2150
2191
|
hasIconProps = _props$hasIcon === void 0 ? false : _props$hasIcon,
|
|
2151
2192
|
dynamicIcon = props.dynamicIcon,
|
|
2152
|
-
otherAttributes = _objectWithoutPropertiesLoose(props, _excluded$
|
|
2193
|
+
otherAttributes = _objectWithoutPropertiesLoose(props, _excluded$7);
|
|
2153
2194
|
|
|
2154
2195
|
var hasAddIcon = className.includes("add-button");
|
|
2155
2196
|
var hasEditIcon = className.includes("edit-button");
|
|
@@ -2271,8 +2312,8 @@ function Button(props) {
|
|
|
2271
2312
|
}, text));
|
|
2272
2313
|
}
|
|
2273
2314
|
|
|
2274
|
-
var css_248z$
|
|
2275
|
-
styleInject(css_248z$
|
|
2315
|
+
var css_248z$8 = ".entity-preview-dots.glider-dots {\n padding-top: 1rem;\n}\n\n.entity-preview-dots.glider-dots .glider-dot {\n height: 0.5rem;\n width: 0.5rem;\n margin: 0.25rem;\n --bg-opacity: 1;\n background-color: #F2FAFD;\n background-color: rgba(242, 250, 253, var(--bg-opacity));\n}\n\n.entity-preview-dots.glider-dots .glider-dot:focus {\n outline: 4px solid rgba(0, 159, 227, 0.3);\n outline-offset: 0;\n}\n\n.entity-preview-dots.glider-dots .glider-dot.active, .entity-preview-dots.glider-dots .glider-dot:focus {\n --bg-opacity: 1;\n background-color: #0074DD;\n background-color: rgba(0, 116, 221, var(--bg-opacity));\n}";
|
|
2316
|
+
styleInject(css_248z$8);
|
|
2276
2317
|
|
|
2277
2318
|
var GliderContainer = function GliderContainer(props) {
|
|
2278
2319
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
@@ -2378,8 +2419,8 @@ var CenteredHero = function CenteredHero(_ref) {
|
|
|
2378
2419
|
})));
|
|
2379
2420
|
};
|
|
2380
2421
|
|
|
2381
|
-
var css_248z$
|
|
2382
|
-
styleInject(css_248z$
|
|
2422
|
+
var css_248z$9 = ".cweb-checkbox {\n outline: none;\n}\n\n.cweb-checkbox .cweb-checkbox-input {\n position: absolute;\n -webkit-appearance: none;\n height: 1px;\n opacity: 0;\n width: 1px;\n}\n\n.cweb-checkbox.type-regular .cweb-checkbox-label {\n display: flex;\n align-items: center;\n margin-bottom: 0;\n}\n\n.cweb-checkbox.type-regular .cweb-checkbox-icon-container {\n width: 16px;\n height: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 auto;\n border: 1px solid #cccccc;\n border-radius: 4px;\n}\n\n.cweb-checkbox.type-regular.hasError .cweb-checkbox-icon-container {\n border: 1px solid #ff6266;\n}\n\n.cweb-checkbox.type-regular .cweb-checkbox-icon {\n display: block;\n}\n\n.cweb-checkbox.type-regular.is-focused .cweb-checkbox-icon-container {\n border-color: #0074dd;\n}\n\n.cweb-checkbox.type-regular.is-checked .cweb-checkbox-icon {\n width: 0.5rem;\n height: 0.5rem;\n padding: 4px;\n background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2210%22 height%3D%228%22 viewBox%3D%220 0 10 8%22 fill%3D%22none%22%3E %3Cpath d%3D%22M9.207 0.792787C9.39447 0.980314 9.49979 1.23462 9.49979 1.49979C9.49979 1.76495 9.39447 2.01926 9.207 2.20679L4.207 7.20679C4.01947 7.39426 3.76516 7.49957 3.5 7.49957C3.23484 7.49957 2.98053 7.39426 2.793 7.20679L0.793 5.20679C0.610842 5.01818 0.510047 4.76558 0.512326 4.50339C0.514604 4.24119 0.619773 3.99038 0.805181 3.80497C0.990589 3.61956 1.2414 3.51439 1.5036 3.51211C1.7658 3.50983 2.0184 3.61063 2.207 3.79279L3.5 5.08579L7.793 0.792787C7.98053 0.605316 8.23484 0.5 8.5 0.5C8.76516 0.5 9.01947 0.605316 9.207 0.792787Z%22 fill%3D%22white%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}\n\n.cweb-checkbox.type-regular.is-indeterminate .cweb-checkbox-icon {\n width: 0.5rem;\n height: 0.5rem;\n padding: 4px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%222%22 viewBox%3D%220 0 10 2%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9 -4.37114e-08C9.55228 -1.95703e-08 10 0.447715 10 1C10 1.55228 9.55228 2 9 2L1 2C0.447716 2 -6.78525e-08 1.55228 -4.37114e-08 1C-1.95703e-08 0.447715 0.447715 -4.17544e-07 1 -3.93402e-07L9 -4.37114e-08Z%22 fill%3D%22white%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}\n\n.cweb-checkbox.type-regular.is-disabled.show-cross-when-disabled .cweb-checkbox-icon {\n width: 10px;\n height: 10px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2211px%22 height%3D%2211px%22 viewBox%3D%220 0 11 11%22 version%3D%221.1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg stroke%3D%22none%22 stroke-width%3D%221%22 fill%3D%22none%22 fill-rule%3D%22evenodd%22 stroke-linecap%3D%22round%22%3E %3Cg transform%3D%22translate(-6.000000%2C -7.000000)%22 stroke%3D%22%232D2D2D%22 stroke-width%3D%222%22%3E %3Cpath d%3D%22M7%2C17 L16%2C8 M16%2C17 L7%2C8%22 %2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n opacity: 0.6;\n}\n\n.cweb-checkbox.type-switch .cweb-checkbox-label {\n display: flex;\n align-items: center;\n margin-bottom: 0;\n width: 56px;\n height: 28px;\n position: relative;\n}\n\n.cweb-checkbox.type-switch .cweb-checkbox-icon-container {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #d1d5db;\n border-radius: 16px;\n}\n\n.cweb-checkbox.type-switch .cweb-checkbox-icon-container:after {\n position: relative;\n display: block;\n content: \"\";\n height: 20px;\n width: 20px;\n top: 4px;\n left: 4px;\n background-color: white;\n border-radius: 50%;\n}\n\n.cweb-checkbox.type-switch.is-checked .cweb-checkbox-icon-container {\n background-color: #6abfa6;\n}\n\n.cweb-checkbox.type-switch.is-checked .cweb-checkbox-icon-container:after {\n left: 32px;\n}";
|
|
2423
|
+
styleInject(css_248z$9);
|
|
2383
2424
|
|
|
2384
2425
|
var Checkbox = function Checkbox(_ref) {
|
|
2385
2426
|
var id = _ref.id,
|
|
@@ -2605,10 +2646,10 @@ NotificationBanner.defaultProps = {
|
|
|
2605
2646
|
onButtonClick: undefined
|
|
2606
2647
|
};
|
|
2607
2648
|
|
|
2608
|
-
var css_248z$
|
|
2609
|
-
styleInject(css_248z$
|
|
2649
|
+
var css_248z$a = ".radio-form-field-label input[type=\"radio\"]:checked + .radio-circle {\n --bg-opacity: 1;\n background-color: #0074DD;\n background-color: rgba(0, 116, 221, var(--bg-opacity));\n}\n\n.radio-form-field-label[data-has-error=\"true\"] .radio-circle {\n --border-opacity: 1;\n border-color: #c53030;\n border-color: rgba(197, 48, 48, var(--border-opacity));\n outline: 4px solid rgba(255, 98, 102, 0.3);\n outline-offset: 0;\n}\n\n.radio-form-field-label\n input[type=\"radio\"]:checked\n + .radio-circle\n .radio-inner-circle {\n --bg-opacity: 1;\n background-color: #fff;\n background-color: rgba(255, 255, 255, var(--bg-opacity));\n}\n";
|
|
2650
|
+
styleInject(css_248z$a);
|
|
2610
2651
|
|
|
2611
|
-
var _excluded$
|
|
2652
|
+
var _excluded$8 = ["text", "info", "isError", "innerRef", "className"];
|
|
2612
2653
|
|
|
2613
2654
|
function RadioInner(_ref) {
|
|
2614
2655
|
var text = _ref.text,
|
|
@@ -2616,7 +2657,7 @@ function RadioInner(_ref) {
|
|
|
2616
2657
|
isError = _ref.isError,
|
|
2617
2658
|
innerRef = _ref.innerRef,
|
|
2618
2659
|
className = _ref.className,
|
|
2619
|
-
otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
2660
|
+
otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$8);
|
|
2620
2661
|
|
|
2621
2662
|
var value = otherProps.value,
|
|
2622
2663
|
disabled = otherProps.disabled;
|
|
@@ -2668,14 +2709,14 @@ var RadioV2 = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
|
|
|
2668
2709
|
}));
|
|
2669
2710
|
});
|
|
2670
2711
|
|
|
2671
|
-
var _excluded$
|
|
2712
|
+
var _excluded$9 = ["innerRef", "options", "defaultValue", "title"];
|
|
2672
2713
|
|
|
2673
2714
|
function RadioGroupInner(_ref) {
|
|
2674
2715
|
var innerRef = _ref.innerRef,
|
|
2675
2716
|
options = _ref.options,
|
|
2676
2717
|
defaultValue = _ref.defaultValue,
|
|
2677
2718
|
title = _ref.title,
|
|
2678
|
-
registerProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
2719
|
+
registerProps = _objectWithoutPropertiesLoose(_ref, _excluded$9);
|
|
2679
2720
|
|
|
2680
2721
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
2681
2722
|
className: classNames("flex flex-col space-y-2")
|
|
@@ -2806,10 +2847,10 @@ var ConfirmationDialog = function ConfirmationDialog(props) {
|
|
|
2806
2847
|
})));
|
|
2807
2848
|
};
|
|
2808
2849
|
|
|
2809
|
-
var css_248z$a = ".cweb-box-shadow-default {\n box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-box-shadow-default {\n box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.24), 0 0 2px 1px rgba(0, 0, 0, 0.12);\n }\n}\n\n.cweb-datepicker {\n width: 182px;\n height: 44px;\n border: 1px solid #cccccc;\n border-radius: 4px;\n background-color: #ffffff;\n outline: none;\n padding: 12px 12px 11px 12px;\n}\n\n.cweb-datepicker input.cweb-datepicker {\n font-size: 14px;\n}\n\n.cweb-datepicker:-ms-input-placeholder {\n color: #64748b;\n}\n\n.cweb-datepicker::placeholder {\n color: #64748b;\n}\n\n.cweb-datepicker:-ms-input-placeholder {\n color: #64748b !important;\n}\n\n.cweb-datepicker::-ms-input-placeholder {\n color: #64748b;\n}\n\n.react-datepicker-popper {\n z-index: 5;\n}\n\n.react-datepicker-popper[data-placement^=bottom] {\n margin-top: 4px;\n}\n\n.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {\n border-bottom-color: #ffffff;\n margin-top: -4px;\n}\n\n.react-datepicker-popper[data-placement^=top] {\n margin-bottom: 4px;\n}\n\n.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {\n border-top-color: #ffffff;\n margin-bottom: -4px;\n}\n\n.cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);\n padding: 0;\n border: 1px solid #cccccc;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);\n }\n}\n\n.cweb-datepicker-calendar .react-datepicker__triangle {\n left: 10px;\n border: 6px solid transparent;\n}\n\n.cweb-datepicker-calendar .react-datepicker__navigation {\n top: 19px;\n width: 19px;\n height: 10px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%227%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0 1.5L1.5 0 5 3.5 8.5 0 10 1.5l-5 5z%22 fill%3D%22%231D9BD8%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n}\n\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--previous {\n border: 0;\n transform: rotate(90deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--next {\n border: 0;\n transform: rotate(-90deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-box {\n width: auto;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list {\n overflow-x: hidden;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 40px !important;\n padding: 0 !important;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected {\n color: #ffffff;\n background-color: #0074dd !important;\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:hover {\n background-color: #045baa !important;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__header {\n padding-top: 0;\n border: none;\n background-color: #ffffff;\n font-size: 14px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__current-month {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: 600;\n line-height: 19px;\n color: #2d2d2d;\n margin: 0;\n padding-top: 16px;\n padding-bottom: 16px;\n text-transform: capitalize;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__header__dropdown {\n margin-bottom: 15px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n height: 44px;\n padding-left: 12px;\n border-radius: 4px;\n background: #ffffff url(\"data:image/svg+xml,%3Csvg width%3D%228%22 height%3D%2214%22 viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z%22 fill%3D%22%239CA3AF%22%2F%3E%3C%2Fsvg%3E\") no-repeat right 8px center;\n text-transform: capitalize;\n -webkit-appearance: none;\n -moz-appearance: none;\n border: 1px solid #cccccc;\n transition: all 0.4s ease;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:hover, .cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:focus,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:hover,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:focus {\n color: #0074dd;\n border-color: #0074dd;\n cursor: pointer;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select {\n min-width: 172px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n min-width: 107px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header.react-datepicker__header--time {\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 52px;\n padding: 0;\n background-color: #f3f3f3;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__month {\n margin: 0.4rem;\n}\n\n.cweb-datepicker-calendar .react-datepicker__month {\n padding-bottom: 8px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__week {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-name,\n.cweb-datepicker-calendar .react-datepicker__day {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n width: 41px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-name {\n height: 19px;\n text-transform: capitalize;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day {\n height: 30px;\n border-radius: 4px;\n transition: background-color 0.3s ease-in-out;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted {\n background-color: #ffffff;\n color: #0074dd;\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted:after {\n content: \"\";\n position: absolute;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background-color: #0074dd;\n left: 0;\n right: 0;\n bottom: 2px;\n margin: 0 auto;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--keyboard-selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--in-range:after {\n background-color: #ffffff;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--today {\n font-weight: bold;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-selecting-range {\n background-color: #e8f5fc;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day:hover {\n background-color: #f8fafc;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n color: #ffffff;\n background-color: #0074dd;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range:hover, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected:hover {\n background-color: #045baa;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--keyboard-selected {\n color: #ffffff;\n background-color: #045baa;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start {\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start:before {\n content: \"\";\n position: absolute;\n top: -3px;\n left: 0;\n bottom: initial;\n right: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(45deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end {\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled {\n color: #cccccc;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled:hover {\n background-color: #ffffff;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--outside-month {\n color: #cccccc;\n}";
|
|
2810
|
-
styleInject(css_248z$
|
|
2850
|
+
var css_248z$b = ".cweb-box-shadow-default {\n box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-box-shadow-default {\n box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.24), 0 0 2px 1px rgba(0, 0, 0, 0.12);\n }\n}\n\n.cweb-datepicker {\n width: 182px;\n height: 44px;\n border: 1px solid #cccccc;\n border-radius: 4px;\n background-color: #ffffff;\n outline: none;\n padding: 12px 12px 11px 12px;\n}\n\n.cweb-datepicker input.cweb-datepicker {\n font-size: 14px;\n}\n\n.cweb-datepicker:-ms-input-placeholder {\n color: #64748b;\n}\n\n.cweb-datepicker::placeholder {\n color: #64748b;\n}\n\n.cweb-datepicker:-ms-input-placeholder {\n color: #64748b !important;\n}\n\n.cweb-datepicker::-ms-input-placeholder {\n color: #64748b;\n}\n\n.react-datepicker-popper {\n z-index: 5;\n}\n\n.react-datepicker-popper[data-placement^=bottom] {\n margin-top: 4px;\n}\n\n.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {\n border-bottom-color: #ffffff;\n margin-top: -4px;\n}\n\n.react-datepicker-popper[data-placement^=top] {\n margin-bottom: 4px;\n}\n\n.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {\n border-top-color: #ffffff;\n margin-bottom: -4px;\n}\n\n.cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);\n padding: 0;\n border: 1px solid #cccccc;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-datepicker-calendar {\n box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.2);\n }\n}\n\n.cweb-datepicker-calendar .react-datepicker__triangle {\n left: 10px;\n border: 6px solid transparent;\n}\n\n.cweb-datepicker-calendar .react-datepicker__navigation {\n top: 19px;\n width: 19px;\n height: 10px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%227%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath d%3D%22M0 1.5L1.5 0 5 3.5 8.5 0 10 1.5l-5 5z%22 fill%3D%22%231D9BD8%22 fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n}\n\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--previous {\n border: 0;\n transform: rotate(90deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__navigation.react-datepicker__navigation--next {\n border: 0;\n transform: rotate(-90deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-box {\n width: auto;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list {\n overflow-x: hidden;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 40px !important;\n padding: 0 !important;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected {\n color: #ffffff;\n background-color: #0074dd !important;\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:hover {\n background-color: #045baa !important;\n}\n\n.cweb-datepicker-calendar .react-datepicker__time-container .react-datepicker__time-list-item.react-datepicker__time-list-item--selected:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__header {\n padding-top: 0;\n border: none;\n background-color: #ffffff;\n font-size: 14px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__current-month {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: 600;\n line-height: 19px;\n color: #2d2d2d;\n margin: 0;\n padding-top: 16px;\n padding-bottom: 16px;\n text-transform: capitalize;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__header__dropdown {\n margin-bottom: 15px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n height: 44px;\n padding-left: 12px;\n border-radius: 4px;\n background: #ffffff url(\"data:image/svg+xml,%3Csvg width%3D%228%22 height%3D%2214%22 viewBox%3D%220 0 8 14%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z%22 fill%3D%22%239CA3AF%22%2F%3E%3C%2Fsvg%3E\") no-repeat right 8px center;\n text-transform: capitalize;\n -webkit-appearance: none;\n -moz-appearance: none;\n border: 1px solid #cccccc;\n transition: all 0.4s ease;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:hover, .cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select:focus,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:hover,\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select:focus {\n color: #0074dd;\n border-color: #0074dd;\n cursor: pointer;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__month-select {\n min-width: 172px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header .react-datepicker__year-select {\n min-width: 107px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__header.react-datepicker__header--time {\n display: flex;\n justify-content: center;\n flex-direction: row;\n align-items: center;\n height: 52px;\n padding: 0;\n background-color: #f3f3f3;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__month {\n margin: 0.4rem;\n}\n\n.cweb-datepicker-calendar .react-datepicker__month {\n padding-bottom: 8px;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-names,\n.cweb-datepicker-calendar .react-datepicker__week {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-name,\n.cweb-datepicker-calendar .react-datepicker__day {\n font-family: \"Inter\", \"Roboto\", sans-serif;\n font-size: 14px;\n font-weight: normal;\n line-height: 19px;\n color: #1e293b;\n margin: 0;\n width: 41px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day-name {\n height: 19px;\n text-transform: capitalize;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day {\n height: 30px;\n border-radius: 4px;\n transition: background-color 0.3s ease-in-out;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted {\n background-color: #ffffff;\n color: #0074dd;\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted:after {\n content: \"\";\n position: absolute;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background-color: #0074dd;\n left: 0;\n right: 0;\n bottom: 2px;\n margin: 0 auto;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--keyboard-selected:after, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--highlighted.react-datepicker__day--in-range:after {\n background-color: #ffffff;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--today {\n font-weight: bold;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-selecting-range {\n background-color: #e8f5fc;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day:hover {\n background-color: #f8fafc;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n color: #ffffff;\n background-color: #0074dd;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--in-range:hover, .cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected:hover {\n background-color: #045baa;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--keyboard-selected {\n color: #ffffff;\n background-color: #045baa;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--selected {\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start {\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-start:before {\n content: \"\";\n position: absolute;\n top: -3px;\n left: 0;\n bottom: initial;\n right: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(45deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end {\n position: relative;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--range-end:before {\n content: \"\";\n position: absolute;\n bottom: -3px;\n right: 0;\n left: initial;\n top: initial;\n border-style: solid;\n border-width: 6px 6px 6px 0;\n border-color: transparent #ffffff transparent transparent;\n transform: rotate(-135deg);\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled {\n color: #cccccc;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--disabled:hover {\n background-color: #ffffff;\n}\n\n.cweb-datepicker-calendar .react-datepicker__day.react-datepicker__day--outside-month {\n color: #cccccc;\n}";
|
|
2851
|
+
styleInject(css_248z$b);
|
|
2811
2852
|
|
|
2812
|
-
var _excluded$
|
|
2853
|
+
var _excluded$a = ["className", "hasCloseButton", "closeButtonText", "adjustDateOnChange", "showMonthDropdown", "showYearDropdown", "shouldCloseOnSelect", "allowSameDay", "minDate", "maxDate", "isDisabled", "selected"];
|
|
2813
2854
|
|
|
2814
2855
|
var Datepicker = /*#__PURE__*/function (_Component) {
|
|
2815
2856
|
_inheritsLoose(Datepicker, _Component);
|
|
@@ -2864,7 +2905,7 @@ var Datepicker = /*#__PURE__*/function (_Component) {
|
|
|
2864
2905
|
_this$props2$isDisabl = _this$props2.isDisabled,
|
|
2865
2906
|
isDisabled = _this$props2$isDisabl === void 0 ? false : _this$props2$isDisabl,
|
|
2866
2907
|
selected = _this$props2.selected,
|
|
2867
|
-
otherProps = _objectWithoutPropertiesLoose(_this$props2, _excluded$
|
|
2908
|
+
otherProps = _objectWithoutPropertiesLoose(_this$props2, _excluded$a);
|
|
2868
2909
|
|
|
2869
2910
|
var dateFormat = this.getDateFormat();
|
|
2870
2911
|
var pickerClassName = classNames("cweb-datepicker text-slate-800 text-sm", className);
|
|
@@ -2920,12 +2961,12 @@ Datepicker.propTypes = {
|
|
|
2920
2961
|
isDisabled: PropTypes.bool
|
|
2921
2962
|
};
|
|
2922
2963
|
|
|
2923
|
-
var img$
|
|
2964
|
+
var img$g = "data:image/svg+xml,%3csvg width='8' height='14' viewBox='0 0 8 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 0C4.26522 5.96046e-08 4.51957 0.105357 4.70711 0.292893L7.70711 3.29289C8.09763 3.68342 8.09763 4.31658 7.70711 4.70711C7.31658 5.09763 6.68342 5.09763 6.29289 4.70711L4 2.41421L1.70711 4.70711C1.31658 5.09763 0.683417 5.09763 0.292893 4.70711C-0.0976311 4.31658 -0.097631 3.68342 0.292893 3.29289L3.29289 0.292893C3.48043 0.105357 3.73478 0 4 0ZM0.292893 9.29289C0.683417 8.90237 1.31658 8.90237 1.70711 9.29289L4 11.5858L6.29289 9.29289C6.68342 8.90237 7.31658 8.90237 7.70711 9.29289C8.09763 9.68342 8.09763 10.3166 7.70711 10.7071L4.70711 13.7071C4.31658 14.0976 3.68342 14.0976 3.29289 13.7071L0.292893 10.7071C-0.0976311 10.3166 -0.0976311 9.68342 0.292893 9.29289Z' fill='%239CA3AF'/%3e%3c/svg%3e";
|
|
2924
2965
|
|
|
2925
|
-
var css_248z$
|
|
2926
|
-
styleInject(css_248z$
|
|
2966
|
+
var css_248z$c = ".cweb-box-shadow-default {\n box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .cweb-box-shadow-default {\n box-shadow: 0 2px 2px 1px rgba(0, 0, 0, 0.24), 0 0 2px 1px rgba(0, 0, 0, 0.12);\n }\n}\n\n.cweb-dropdown {\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n align-items: flex-start;\n position: relative;\n outline: none;\n border-radius: 4px;\n}\n\n.cweb-dropdown:focus {\n outline: 4px solid rgba(0, 159, 227, 0.3);\n}\n\n.cweb-dropdown > .dropdown-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n align-self: stretch;\n height: 44px;\n border-radius: 4px;\n transition: all 0.4s ease;\n}\n\n.cweb-dropdown > .dropdown-header > .dropdown-header-icon {\n opacity: 0.5;\n transition: opacity 0.3s ease-in-out;\n}\n\n.cweb-dropdown > .dropdown-header:hover > .dropdown-header-icon {\n opacity: 1;\n}\n\n.cweb-dropdown > .dropdown-list {\n box-shadow: 0px 2px 4px -2px rgba(0, 0, 0, 0.56);\n display: none;\n position: absolute;\n top: 100%;\n z-index: 1;\n width: 100%;\n max-height: 360px;\n overflow-y: auto;\n align-self: stretch;\n margin-top: 8px;\n padding: 0;\n background-color: #ffffff;\n list-style: none;\n border: 1px solid #d1d5db;\n border-radius: 4px;\n}\n\n.cweb-dropdown > .dropdown-list > .dropdown-list-item {\n cursor: pointer;\n}\n\n.cweb-dropdown > .dropdown-list > .dropdown-list-item-group > .dropdown-list-item {\n cursor: pointer;\n}\n\n.cweb-dropdown.is-open > .dropdown-list {\n display: block;\n margin-bottom: 32px;\n}\n\n.cweb-dropdown.is-open > .dropdown-list.wider {\n width: 200%;\n}";
|
|
2967
|
+
styleInject(css_248z$c);
|
|
2927
2968
|
|
|
2928
|
-
var _excluded$
|
|
2969
|
+
var _excluded$b = ["placeholder", "className", "initialSelectedItemId", "onItemSelect", "items", "wider"];
|
|
2929
2970
|
var ITEM_QUERY_FIELD_NAMES = {
|
|
2930
2971
|
ID: "id",
|
|
2931
2972
|
HIGHLIGHT_INDEX: "highlightIndex"
|
|
@@ -3119,7 +3160,7 @@ var Dropdown = /*#__PURE__*/function (_PureComponent) {
|
|
|
3119
3160
|
className: classNames({
|
|
3120
3161
|
hidden: !isItemSelected
|
|
3121
3162
|
}),
|
|
3122
|
-
src: img$
|
|
3163
|
+
src: img$f,
|
|
3123
3164
|
alt: "checked"
|
|
3124
3165
|
}));
|
|
3125
3166
|
};
|
|
@@ -3197,7 +3238,7 @@ var Dropdown = /*#__PURE__*/function (_PureComponent) {
|
|
|
3197
3238
|
_this$props$placehold = _this$props.placeholder,
|
|
3198
3239
|
placeholder = _this$props$placehold === void 0 ? "" : _this$props$placehold,
|
|
3199
3240
|
className = _this$props.className,
|
|
3200
|
-
otherProps = _objectWithoutPropertiesLoose(_this$props, _excluded$
|
|
3241
|
+
otherProps = _objectWithoutPropertiesLoose(_this$props, _excluded$b);
|
|
3201
3242
|
|
|
3202
3243
|
var _this$state2 = this.state,
|
|
3203
3244
|
selectedItem = _this$state2.selectedItem,
|
|
@@ -3225,7 +3266,7 @@ var Dropdown = /*#__PURE__*/function (_PureComponent) {
|
|
|
3225
3266
|
truncate: true
|
|
3226
3267
|
}), /*#__PURE__*/React__default.createElement("img", {
|
|
3227
3268
|
className: "dropdown-header-icon",
|
|
3228
|
-
src: img$
|
|
3269
|
+
src: img$g,
|
|
3229
3270
|
alt: "browse icon"
|
|
3230
3271
|
})), this.renderItems());
|
|
3231
3272
|
};
|
|
@@ -3287,10 +3328,10 @@ Dropdown.propTypes = {
|
|
|
3287
3328
|
wider: PropTypes.bool
|
|
3288
3329
|
};
|
|
3289
3330
|
|
|
3290
|
-
var css_248z$
|
|
3291
|
-
styleInject(css_248z$
|
|
3331
|
+
var css_248z$d = ".cweb-error-block {\n position: relative;\n padding: 16px 16px 16px 56px;\n background-color: #fff1f1;\n border-radius: 8px;\n}\n\n.cweb-error-block:before {\n content: \"\";\n position: absolute;\n left: 16px;\n top: 14px;\n z-index: 1;\n width: 24px;\n height: 23px;\n background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E %3Cg fill%3D%22none%22 fill-rule%3D%22evenodd%22%3E %3Ccircle cx%3D%2212%22 cy%3D%2212%22 r%3D%2212%22 fill%3D%22%23FF6266%22%2F%3E %3Ccircle cx%3D%2212%22 cy%3D%2217%22 r%3D%222%22 fill%3D%22%23FFF%22%2F%3E %3Crect width%3D%224%22 height%3D%2210%22 x%3D%2210%22 y%3D%224%22 fill%3D%22%23FFF%22 rx%3D%222%22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}";
|
|
3332
|
+
styleInject(css_248z$d);
|
|
3292
3333
|
|
|
3293
|
-
var _excluded$
|
|
3334
|
+
var _excluded$c = ["message", "className"];
|
|
3294
3335
|
ErrorBlock.propTypes = {
|
|
3295
3336
|
message: PropTypes.string.isRequired,
|
|
3296
3337
|
className: PropTypes.string
|
|
@@ -3300,7 +3341,7 @@ function ErrorBlock(_ref) {
|
|
|
3300
3341
|
var message = _ref.message,
|
|
3301
3342
|
_ref$className = _ref.className,
|
|
3302
3343
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
3303
|
-
otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$
|
|
3344
|
+
otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$c);
|
|
3304
3345
|
|
|
3305
3346
|
var containerClassName = classNames("cweb-error-block", className);
|
|
3306
3347
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
@@ -3311,8 +3352,8 @@ function ErrorBlock(_ref) {
|
|
|
3311
3352
|
})));
|
|
3312
3353
|
}
|
|
3313
3354
|
|
|
3314
|
-
var css_248z$
|
|
3315
|
-
styleInject(css_248z$
|
|
3355
|
+
var css_248z$e = ".cweb-info-block {\n position: relative;\n padding: 16px 16px 16px 56px;\n background-color: #e8f5fc;\n border-radius: 8px;\n}\n\n.cweb-info-block:before {\n content: \"\";\n position: absolute;\n left: 16px;\n top: 14px;\n z-index: 1;\n width: 24px;\n height: 23px;\n background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E %3Cg fill%3D%22none%22 fill-rule%3D%22evenodd%22%3E %3Ccircle cx%3D%2212%22 cy%3D%2212%22 r%3D%2212%22 fill%3D%22%23009FE3%22%2F%3E %3Cpath fill%3D%22%23FFF%22 fill-rule%3D%22nonzero%22 d%3D%22M12.483 7.314l1.128 2.39a.54.54 0 0 0 .405.308l2.522.383c.442.067.618.635.299.96l-1.825 1.86a.58.58 0 0 0-.155.499l.43 2.626c.076.46-.386.811-.78.594l-2.256-1.24a.518.518 0 0 0-.502 0l-2.255 1.24c-.395.217-.857-.134-.782-.594l.431-2.626a.58.58 0 0 0-.155-.499l-1.825-1.86c-.32-.326-.143-.893.299-.96l2.522-.383a.54.54 0 0 0 .405-.308l1.128-2.39a.528.528 0 0 1 .966 0z%22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}";
|
|
3356
|
+
styleInject(css_248z$e);
|
|
3316
3357
|
|
|
3317
3358
|
InfoBlock.propTypes = {
|
|
3318
3359
|
message: PropTypes.string.isRequired,
|
|
@@ -3453,43 +3494,6 @@ function TableHeader(props) {
|
|
|
3453
3494
|
})));
|
|
3454
3495
|
}
|
|
3455
3496
|
|
|
3456
|
-
var img$e = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='68' height='20' viewBox='0 0 68 20'%3e %3cg fill='none' fill-rule='nonzero'%3e %3ccircle cx='10' cy='10' r='10' fill='%23F09'%3e %3canimate attributeName='opacity' dur='2s' values='1%3b0.6%3b1' repeatCount='indefinite' begin='0.1'/%3e %3canimate attributeName='r' dur='2s' repeatCount='indefinite' values='10%3b8%3b10' begin='0.1'/%3e %3c/circle%3e %3ccircle cx='34' cy='10' r='10' fill='%236ABFA5'%3e %3canimate attributeName='opacity' dur='2s' values='1%3b0.6%3b1' repeatCount='indefinite' begin='0.6'/%3e %3canimate attributeName='r' dur='2s' repeatCount='indefinite' values='10%3b8%3b10' begin='0.6'/%3e %3c/circle%3e %3ccircle cx='58' cy='10' r='10' fill='%236670A5'%3e %3canimate attributeName='opacity' dur='2s' values='1%3b0.6%3b1' repeatCount='indefinite' begin='1.1'/%3e %3canimate attributeName='r' dur='2s' repeatCount='indefinite' values='10%3b8%3b10' begin='1.1'/%3e %3c/circle%3e %3c/g%3e%3c/svg%3e";
|
|
3457
|
-
|
|
3458
|
-
var img$f = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='margin: auto%3b background: none%3b display: block%3b shape-rendering: auto%3b' width='200px' height='200px' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3e%3ccircle cx='50' cy='50' fill='none' stroke='%23009fe3' stroke-width='16' r='36' stroke-dasharray='169.64600329384882 58.548667764616276'%3e %3canimateTransform attributeName='transform' type='rotate' repeatCount='indefinite' dur='1.1111111111111112s' values='0 50 50%3b360 50 50' keyTimes='0%3b1'%3e%3c/animateTransform%3e%3c/circle%3e%3c/svg%3e";
|
|
3459
|
-
|
|
3460
|
-
var img$g = "data:image/svg+xml,%3c%3fxml version='1.0' encoding='utf-8'%3f%3e%3csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' style='margin: auto%3b background: none%3b display: block%3b shape-rendering: auto%3b' width='200px' height='200px' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid'%3e%3ccircle cx='50' cy='50' fill='none' stroke='%23cbd5e1' stroke-width='16' r='36' stroke-dasharray='169.64600329384882 58.548667764616276'%3e %3canimateTransform attributeName='transform' type='rotate' repeatCount='indefinite' dur='1.1111111111111112s' values='0 50 50%3b360 50 50' keyTimes='0%3b1'%3e%3c/animateTransform%3e%3c/circle%3e%3c!-- %5bldio%5d generated by https://loading.io/ --%3e%3c/svg%3e";
|
|
3461
|
-
|
|
3462
|
-
var css_248z$e = ".cweb-loading {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.cweb-loading .cweb-loading-text {\n margin-bottom: 24px;\n}\n\n.cweb-loading.as-modal {\n position: fixed;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n z-index: 9999;\n background-color: rgba(255, 255, 255, 0.6);\n}\n\n.cweb-loading.as-modal .cweb-loading-panel {\n position: relative;\n width: 320px;\n min-height: 120px;\n border-radius: 4px;\n padding: 16px;\n box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.36);\n background-color: #ffffff;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n align-items: center;\n}\n\n.cweb-loading.as-modal .cweb-loading-panel:before {\n position: absolute;\n content: \"\";\n top: 0;\n left: 0;\n right: 0;\n z-index: 1;\n height: 3px;\n background-color: #6abfa5;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}";
|
|
3463
|
-
styleInject(css_248z$e);
|
|
3464
|
-
|
|
3465
|
-
var _excluded$c = ["asModal", "asSpinner", "className", "spinnerColor"];
|
|
3466
|
-
function LoadingIndicator(_ref) {
|
|
3467
|
-
var _ref$asModal = _ref.asModal,
|
|
3468
|
-
asModal = _ref$asModal === void 0 ? false : _ref$asModal,
|
|
3469
|
-
_ref$asSpinner = _ref.asSpinner,
|
|
3470
|
-
asSpinner = _ref$asSpinner === void 0 ? false : _ref$asSpinner,
|
|
3471
|
-
_ref$className = _ref.className,
|
|
3472
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
3473
|
-
_ref$spinnerColor = _ref.spinnerColor,
|
|
3474
|
-
spinnerColor = _ref$spinnerColor === void 0 ? "blue" : _ref$spinnerColor,
|
|
3475
|
-
restProps = _objectWithoutPropertiesLoose(_ref, _excluded$c);
|
|
3476
|
-
|
|
3477
|
-
var spinnerToRender = spinnerColor === "blue" ? img$f : img$g;
|
|
3478
|
-
var containerClassName = classNames("cweb-loading", className, {
|
|
3479
|
-
"as-modal": asModal
|
|
3480
|
-
});
|
|
3481
|
-
return /*#__PURE__*/React__default.createElement("div", _extends({}, restProps, {
|
|
3482
|
-
className: containerClassName
|
|
3483
|
-
}), /*#__PURE__*/React__default.createElement("img", {
|
|
3484
|
-
src: asSpinner ? spinnerToRender : img$e,
|
|
3485
|
-
"data-chromatic": "ignore",
|
|
3486
|
-
className: classNames("text-gray-600 fill-current stroke-current", {
|
|
3487
|
-
"h-4 w-4": asSpinner,
|
|
3488
|
-
"h-12 w-12": !asSpinner
|
|
3489
|
-
})
|
|
3490
|
-
}));
|
|
3491
|
-
}
|
|
3492
|
-
|
|
3493
3497
|
var TagSize;
|
|
3494
3498
|
|
|
3495
3499
|
(function (TagSize) {
|
|
@@ -7829,12 +7833,12 @@ var FullPageModal = function FullPageModal(_ref) {
|
|
|
7829
7833
|
overlayClassName: "fixed inset-0 overflow-x-hidden overflow-y-auto z-20",
|
|
7830
7834
|
onRequestClose: onCloseClick,
|
|
7831
7835
|
shouldFocusAfterRender: false,
|
|
7832
|
-
className: "h-
|
|
7836
|
+
className: "w-full h-full",
|
|
7833
7837
|
data: {
|
|
7834
7838
|
"test-id": dataTestId != null ? dataTestId : "react-modal"
|
|
7835
7839
|
}
|
|
7836
7840
|
}, /*#__PURE__*/React__default.createElement("div", {
|
|
7837
|
-
className: "flex flex-col h-
|
|
7841
|
+
className: "flex flex-col w-full h-full bg-slate-100"
|
|
7838
7842
|
}, /*#__PURE__*/React__default.createElement(FullPageModalHeader, {
|
|
7839
7843
|
title: title,
|
|
7840
7844
|
primaryButtonProps: primaryButtonProps
|