@hexure/ui 1.3.8 → 1.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +474 -95
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/DatePicker/DatePicker.d.ts +6 -15
- package/dist/cjs/types/components/Input/Input.d.ts +2 -2
- package/dist/cjs/types/components/Select/Select.d.ts +1 -1
- package/dist/cjs/types/index.d.ts +1 -0
- package/dist/esm/index.js +474 -96
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/DatePicker/DatePicker.d.ts +6 -15
- package/dist/esm/types/components/Input/Input.d.ts +2 -2
- package/dist/esm/types/components/Select/Select.d.ts +1 -1
- package/dist/esm/types/index.d.ts +1 -0
- package/dist/index.d.ts +20 -4
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -60,6 +60,8 @@ function __makeTemplateObject(cooked, raw) {
|
|
|
60
60
|
return cooked;
|
|
61
61
|
}
|
|
62
62
|
|
|
63
|
+
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
64
|
+
|
|
63
65
|
function getDefaultExportFromCjs (x) {
|
|
64
66
|
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
|
65
67
|
}
|
|
@@ -2034,8 +2036,8 @@ var FontSizes = {
|
|
|
2034
2036
|
SMALL: '13px',
|
|
2035
2037
|
};
|
|
2036
2038
|
|
|
2037
|
-
var Header$3 = styled.div(templateObject_1$
|
|
2038
|
-
var Title$1 = styled.div(templateObject_2$
|
|
2039
|
+
var Header$3 = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n background: #f5f5f5;\n border: 1px solid #e5e5e5;\n padding: 14px 20px;\n height: 50px;\n cursor: pointer;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-sizing: border-box;\n background: #f5f5f5;\n border: 1px solid #e5e5e5;\n padding: 14px 20px;\n height: 50px;\n cursor: pointer;\n"])));
|
|
2040
|
+
var Title$1 = styled.div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 400;\n color: ", ";\n line-height: 1.6em;\n font-family: ", ";\n box-sizing: border-box;\n"], ["\n font-size: ", ";\n font-weight: 400;\n color: ", ";\n line-height: 1.6em;\n font-family: ", ";\n box-sizing: border-box;\n"])), FontSizes.DEFAULT, Colors.BLACK.Hex, FontStyles.DEFAULT);
|
|
2039
2041
|
var Accordion = function (_a) {
|
|
2040
2042
|
var title = _a.title, children = _a.children, open = _a.open, onClick = _a.onClick, accessibleProps = __rest(_a, ["title", "children", "open", "onClick"]);
|
|
2041
2043
|
return (React.createElement(React.Fragment, null,
|
|
@@ -2044,7 +2046,7 @@ var Accordion = function (_a) {
|
|
|
2044
2046
|
React.createElement(Icon, { color: Colors.BLACK.Hex, path: open ? js.mdiChevronUp : js.mdiChevronDown, size: '24px' })),
|
|
2045
2047
|
open ? children : null));
|
|
2046
2048
|
};
|
|
2047
|
-
var templateObject_1$
|
|
2049
|
+
var templateObject_1$o, templateObject_2$m;
|
|
2048
2050
|
|
|
2049
2051
|
var button_type_mapping = {
|
|
2050
2052
|
primary: {
|
|
@@ -2069,7 +2071,7 @@ var button_type_mapping = {
|
|
|
2069
2071
|
badge_content_color: Colors.RED.Hex,
|
|
2070
2072
|
},
|
|
2071
2073
|
};
|
|
2072
|
-
var StyledButton = styled.button(templateObject_1$
|
|
2074
|
+
var StyledButton = styled.button(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n height: ", ";\n line-height: 1em;\n border-radius: ", ";\n margin: ", ";\n padding: ", ";\n outline: none;\n background: ", ";\n width: ", ";\n cursor: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n opacity: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n &:hover {\n opacity: ", ";\n }\n"], ["\n height: ", ";\n line-height: 1em;\n border-radius: ", ";\n margin: ", ";\n padding: ", ";\n outline: none;\n background: ", ";\n width: ", ";\n cursor: ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n opacity: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n &:hover {\n opacity: ", ";\n }\n"])), function (props) { return (props.$small ? '30px' : '40px'); }, function (props) { return (props.$small ? '15px' : '20px'); }, function (props) { return props.$margin || '0px'; }, function (props) {
|
|
2073
2075
|
if (props.$hasChildren) {
|
|
2074
2076
|
if (props.$small) {
|
|
2075
2077
|
return '0 10px';
|
|
@@ -2092,7 +2094,7 @@ var StyledButton = styled.button(templateObject_1$m || (templateObject_1$m = __m
|
|
|
2092
2094
|
}, function (props) { return (props.$disabled ? 'default' : 'pointer'); }, function (props) { return (props.$disabled ? 0.6 : 0.9); }, function (props) {
|
|
2093
2095
|
return props.$format ? button_type_mapping[props.$format].border_color : Colors.PRIMARY.Hex;
|
|
2094
2096
|
}, function (props) { return (props.$disabled ? 0.6 : 1); });
|
|
2095
|
-
var Label$4 = styled.span(templateObject_2$
|
|
2097
|
+
var Label$4 = styled.span(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n font-family: ", ";\n font-weight: 500;\n line-height: ", ";\n"], ["\n color: ", ";\n font-size: ", ";\n font-family: ", ";\n font-weight: 500;\n line-height: ", ";\n"])), function (props) { return (props.$format ? button_type_mapping[props.$format].content_color : '#fff'); }, function (props) { return (props.$small ? FontSizes.SMALL : FontSizes.DEFAULT); }, FontStyles.DEFAULT, function (props) { return (props.$small ? '2.2em' : '2.9em'); });
|
|
2096
2098
|
var StyledIcon$2 = styled.span(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n margin-left: ", ";\n margin-right: ", ";\n display: flex;\n align-items: center;\n box-sizing: border-box;\n"], ["\n margin-left: ", ";\n margin-right: ", ";\n display: flex;\n align-items: center;\n box-sizing: border-box;\n"])), function (props) { return (props.$hasChildren ? '6px' : '0px'); }, function (props) { return (props.$hasChildren ? '-4px' : '0px'); });
|
|
2097
2099
|
var Badge$1 = styled.span(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 100%;\n background-color: ", ";\n color: ", ";\n font-size: ", ";\n font-weight: 600;\n font-family: ", ";\n letter-spacing: -1px;\n margin-left: ", ";\n margin-right: ", ";\n"], ["\n width: ", ";\n height: ", ";\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 100%;\n background-color: ", ";\n color: ", ";\n font-size: ", ";\n font-weight: 600;\n font-family: ", ";\n letter-spacing: -1px;\n margin-left: ", ";\n margin-right: ", ";\n"])), function (props) { return (props.$small ? '20px' : '24px'); }, function (props) { return (props.$small ? '20px' : '24px'); }, function (props) {
|
|
2098
2100
|
return props.$format ? button_type_mapping[props.$format].badge_bg_color : '#fff';
|
|
@@ -2108,9 +2110,9 @@ var Button = function (_a) {
|
|
|
2108
2110
|
React.createElement(Icon, { color: format ? button_type_mapping[format].content_color : '#fff', path: icon, size: small ? '20px' : '24px' }))) : null,
|
|
2109
2111
|
badge && !icon ? (React.createElement(Badge$1, { "$format": format, "$small": small }, badge)) : null));
|
|
2110
2112
|
};
|
|
2111
|
-
var templateObject_1$
|
|
2113
|
+
var templateObject_1$n, templateObject_2$l, templateObject_3$i, templateObject_4$9;
|
|
2112
2114
|
|
|
2113
|
-
var StyledComponent = styled.p(templateObject_1$
|
|
2115
|
+
var StyledComponent = styled.p(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n letter-spacing: ", ";\n font-weight: ", ";\n font-style: ", ";\n text-decoration: ", ";\n font-family: 'Roboto', Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n text-align: ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n font-size: ", ";\n line-height: ", ";\n letter-spacing: ", ";\n font-weight: ", ";\n font-style: ", ";\n text-decoration: ", ";\n font-family: 'Roboto', Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n text-align: ", ";\n box-sizing: border-box;\n"])), function (props) { return Colors[props.$color || 'BLACK'].Hex; }, function (props) { return (props.$type === 'small' ? FontSizes.SMALL : FontSizes.DEFAULT); }, function (props) { return (props.$type === 'small' ? '1.5em' : '1.6em'); }, function (props) { return (props.$type === 'small' ? '1px' : '0px'); }, function (props) { return (props.$type === 'bold' ? '500' : '400'); }, function (props) { return (props.$type === 'italic' ? 'italic' : 'normal'); }, function (props) {
|
|
2114
2116
|
return ['underline', 'line-through'].includes(props.$type) ? props.$type : 'none';
|
|
2115
2117
|
}, function (props) { return props.$margin || '0px'; }, function (props) { return props.$padding || '0px'; }, function (props) { return props.$align || 'left'; });
|
|
2116
2118
|
var Copy = function (_a) {
|
|
@@ -2120,10 +2122,10 @@ var Copy = function (_a) {
|
|
|
2120
2122
|
Copy.defaultProps = {
|
|
2121
2123
|
type: 'default',
|
|
2122
2124
|
};
|
|
2123
|
-
var templateObject_1$
|
|
2125
|
+
var templateObject_1$m;
|
|
2124
2126
|
|
|
2125
|
-
var H1 = styled.h1(templateObject_1$
|
|
2126
|
-
var H2 = styled.h2(templateObject_2$
|
|
2127
|
+
var H1 = styled.h1(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n color: ", ";\n font-size: 30px;\n font-weight: ", ";\n line-height: 1.4em;\n font-family: 'Roboto Slab', Roboto, Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n font-size: 30px;\n font-weight: ", ";\n line-height: 1.4em;\n font-family: 'Roboto Slab', Roboto, Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n box-sizing: border-box;\n"])), Colors.BLACK.Hex, function (props) { return (props.$bold ? '500' : '400'); }, function (props) { return props.$margin || '0px'; }, function (props) { return props.$padding || '0px'; });
|
|
2128
|
+
var H2 = styled.h2(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n color: ", ";\n font-size: 24px;\n font-weight: ", ";\n line-height: 1.33em;\n font-family: 'Roboto Slab', Roboto, Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n font-size: 24px;\n font-weight: ", ";\n line-height: 1.33em;\n font-family: 'Roboto Slab', Roboto, Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n box-sizing: border-box;\n"])), Colors.BLACK.Hex, function (props) { return (props.$bold ? '500' : '400'); }, function (props) { return props.$margin || '0px'; }, function (props) { return props.$padding || '0px'; });
|
|
2127
2129
|
var H3 = styled.h3(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n color: ", ";\n font-size: 18px;\n font-weight: ", ";\n line-height: 1.33em;\n font-family: 'Roboto Slab', Roboto, Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n box-sizing: border-box;\n"], ["\n color: ", ";\n font-size: 18px;\n font-weight: ", ";\n line-height: 1.33em;\n font-family: 'Roboto Slab', Roboto, Helvetica, Arial, sans-serif;\n margin: ", ";\n padding: ", ";\n box-sizing: border-box;\n"])), Colors.BLACK.Hex, function (props) { return (props.$bold ? '500' : '400'); }, function (props) { return props.$margin || '0px'; }, function (props) { return props.$padding || '0px'; });
|
|
2128
2130
|
var Heading = function (_a) {
|
|
2129
2131
|
var bold = _a.bold, children = _a.children, margin = _a.margin, padding = _a.padding, type = _a.type, accessibleProps = __rest(_a, ["bold", "children", "margin", "padding", "type"]);
|
|
@@ -2143,10 +2145,10 @@ Heading.defaultProps = {
|
|
|
2143
2145
|
bold: false,
|
|
2144
2146
|
type: 'primary',
|
|
2145
2147
|
};
|
|
2146
|
-
var templateObject_1$
|
|
2148
|
+
var templateObject_1$l, templateObject_2$k, templateObject_3$h;
|
|
2147
2149
|
|
|
2148
|
-
var Wrapper$e = styled.div(templateObject_1$
|
|
2149
|
-
var Container$3 = styled.dialog(templateObject_2$
|
|
2150
|
+
var Wrapper$e = styled.div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 9999;\n background: rgba(0, 0, 0, 0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n"], ["\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 9999;\n background: rgba(0, 0, 0, 0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n"])));
|
|
2151
|
+
var Container$3 = styled.dialog(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n max-width: 600px;\n width: auto;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: relative;\n padding: 40px;\n text-align: center;\n box-sizing: border-box;\n"], ["\n max-width: 600px;\n width: auto;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: relative;\n padding: 40px;\n text-align: center;\n box-sizing: border-box;\n"])));
|
|
2150
2152
|
var Buttons = styled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 30px;\n box-sizing: border-box;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 30px;\n box-sizing: border-box;\n"])));
|
|
2151
2153
|
var ActionDialog = function (_a) {
|
|
2152
2154
|
var description = _a.description, title = _a.title, onClose = _a.onClose, primaryButton = _a.primaryButton, secondaryButton = _a.secondaryButton, accessibleProps = __rest(_a, ["description", "title", "onClose", "primaryButton", "secondaryButton"]);
|
|
@@ -2168,10 +2170,10 @@ var ActionDialog = function (_a) {
|
|
|
2168
2170
|
secondaryButton ? (React.createElement(Button, __assign({}, secondaryButton, { format: 'secondary', margin: '0px 5px' }))) : null,
|
|
2169
2171
|
primaryButton ? React.createElement(Button, __assign({}, primaryButton, { format: 'primary', margin: '0px 5px' })) : null)) : null)));
|
|
2170
2172
|
};
|
|
2171
|
-
var templateObject_1$
|
|
2173
|
+
var templateObject_1$k, templateObject_2$j, templateObject_3$g;
|
|
2172
2174
|
|
|
2173
|
-
var Wrapper$d = styled.div(templateObject_1$
|
|
2174
|
-
var Content$1 = styled.div(templateObject_2$
|
|
2175
|
+
var Wrapper$d = styled.div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n border: 1px solid #f1f1f1;\n border-radius: 4px;\n border-left-width: 4px;\n box-shadow: 0px 4px 12px -6px rgba(0, 0, 0, 0.2);\n display: flex;\n align-items: flex-start;\n padding: 20px;\n box-sizing: border-box;\n"], ["\n border: 1px solid #f1f1f1;\n border-radius: 4px;\n border-left-width: 4px;\n box-shadow: 0px 4px 12px -6px rgba(0, 0, 0, 0.2);\n display: flex;\n align-items: flex-start;\n padding: 20px;\n box-sizing: border-box;\n"])));
|
|
2176
|
+
var Content$1 = styled.div(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin-left: 20px;\n"], ["\n margin-left: 20px;\n"])));
|
|
2175
2177
|
var Action$1 = styled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n color: ", ";\n font-size: ", ";\n font-family: ", ";\n font-weight: 500;\n cursor: pointer;\n margin-top: 6px;\n"], ["\n color: ", ";\n font-size: ", ";\n font-family: ", ";\n font-weight: 500;\n cursor: pointer;\n margin-top: 6px;\n"])), Colors.PRIMARY.Hex, FontSizes.DEFAULT, FontStyles.DEFAULT);
|
|
2176
2178
|
var Alert = function (_a) {
|
|
2177
2179
|
var action = _a.action, _b = _a.type, type = _b === void 0 ? 'info' : _b, title = _a.title, description = _a.description, accessibleProps = __rest(_a, ["action", "type", "title", "description"]);
|
|
@@ -2201,10 +2203,10 @@ var Alert = function (_a) {
|
|
|
2201
2203
|
description ? React.createElement(Copy, { margin: '6px 0 0 0 !important' }, description) : null,
|
|
2202
2204
|
action ? React.createElement(Action$1, { onClick: action.onClick }, action.label) : null)));
|
|
2203
2205
|
};
|
|
2204
|
-
var templateObject_1$
|
|
2206
|
+
var templateObject_1$j, templateObject_2$i, templateObject_3$f;
|
|
2205
2207
|
|
|
2206
|
-
var Wrapper$c = styled.div(templateObject_1$
|
|
2207
|
-
var Left = styled.div(templateObject_2$
|
|
2208
|
+
var Wrapper$c = styled.div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n border: 1px solid ", ";\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n"], ["\n border: 1px solid ", ";\n border-radius: 8px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 16px 20px;\n"])), Colors.PRIMARY.Hex);
|
|
2209
|
+
var Left = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-shrink: 0;\n"], ["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-shrink: 0;\n"])));
|
|
2208
2210
|
var Info = styled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n margin-right: 30px;\n"], ["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n margin-right: 30px;\n"])));
|
|
2209
2211
|
var Selected = styled.span(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 400;\n font-family: ", ";\n color: ", ";\n line-height: 1;\n"], ["\n font-size: 14px;\n font-weight: 400;\n font-family: ", ";\n color: ", ";\n line-height: 1;\n"])), FontStyles.DEFAULT, Colors.BLACK.Hex);
|
|
2210
2212
|
var Clear = styled.span(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 400;\n font-family: ", ";\n color: ", ";\n line-height: 1;\n cursor: pointer;\n padding-left: 10px;\n margin-left: 10px;\n border-left: 1px solid #ccc;\n"], ["\n font-size: 14px;\n font-weight: 400;\n font-family: ", ";\n color: ", ";\n line-height: 1;\n cursor: pointer;\n padding-left: 10px;\n margin-left: 10px;\n border-left: 1px solid #ccc;\n"])), FontStyles.DEFAULT, Colors.PRIMARY.Hex);
|
|
@@ -2225,10 +2227,10 @@ var BulkActionBar = function (_a) {
|
|
|
2225
2227
|
React.createElement(Icon, { color: Colors.RED.Hex, path: js.mdiInformationOutline, size: '20px' }),
|
|
2226
2228
|
React.createElement(ErrorMsg, null, errorMsg))) : null));
|
|
2227
2229
|
};
|
|
2228
|
-
var templateObject_1$
|
|
2230
|
+
var templateObject_1$i, templateObject_2$h, templateObject_3$e, templateObject_4$8, templateObject_5$6, templateObject_6$4, templateObject_7$2, templateObject_8$1;
|
|
2229
2231
|
|
|
2230
|
-
var Wrapper$b = styled.label(templateObject_1$
|
|
2231
|
-
var Input$2 = styled.input(templateObject_2$
|
|
2232
|
+
var Wrapper$b = styled.label(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n padding: 4px 0;\n cursor: ", ";\n display: flex;\n align-items: center;\n font-size: ", ";\n line-height: 1.6em;\n box-sizing: border-box;\n"], ["\n padding: 4px 0;\n cursor: ", ";\n display: flex;\n align-items: center;\n font-size: ", ";\n line-height: 1.6em;\n box-sizing: border-box;\n"])), function (props) { return (props.$disabled ? 'default' : 'pointer'); }, FontSizes.DEFAULT);
|
|
2233
|
+
var Input$2 = styled.input(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n font-size: 20px;\n margin: 0px 0px 2px 0px;\n line-height: 1.1em;\n box-sizing: border-box;\n"], ["\n font-size: 20px;\n margin: 0px 0px 2px 0px;\n line-height: 1.1em;\n box-sizing: border-box;\n"])));
|
|
2232
2234
|
var Label$3 = styled.span(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n line-height: 1.6em;\n color: ", ";\n margin-left: 6px;\n box-sizing: border-box;\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n line-height: 1.6em;\n color: ", ";\n margin-left: 6px;\n box-sizing: border-box;\n"])), FontStyles.DEFAULT, FontSizes.DEFAULT, Colors.BLACK.Hex);
|
|
2233
2235
|
var Checkbox = function (_a) {
|
|
2234
2236
|
var children = _a.children, disabled = _a.disabled, checked = _a.checked, onChange = _a.onChange, accessibleProps = __rest(_a, ["children", "disabled", "checked", "onChange"]);
|
|
@@ -2236,10 +2238,10 @@ var Checkbox = function (_a) {
|
|
|
2236
2238
|
React.createElement(Input$2, { checked: checked, disabled: disabled, name: accessibleProps.name, onChange: disabled ? undefined : onChange, type: 'checkbox' }),
|
|
2237
2239
|
children ? React.createElement(Label$3, null, children) : null));
|
|
2238
2240
|
};
|
|
2239
|
-
var templateObject_1$
|
|
2241
|
+
var templateObject_1$h, templateObject_2$g, templateObject_3$d;
|
|
2240
2242
|
|
|
2241
|
-
var SelectAll = styled.div(templateObject_1$
|
|
2242
|
-
var Options$1 = styled.div(templateObject_2$
|
|
2243
|
+
var SelectAll = styled.div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n padding: 8px 12px;\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n"], ["\n padding: 8px 12px;\n border-bottom: 1px solid ", ";\n box-sizing: border-box;\n"])), Colors.LIGHT_GRAY.Hex);
|
|
2244
|
+
var Options$1 = styled.div(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n padding: 12px;\n box-sizing: border-box;\n"], ["\n padding: 12px;\n box-sizing: border-box;\n"])));
|
|
2243
2245
|
var Checklist = function (_a) {
|
|
2244
2246
|
var disabled = _a.disabled, onChange = _a.onChange, options = _a.options, selected = _a.selected, showSelectAll = _a.showSelectAll, accessibleProps = __rest(_a, ["disabled", "onChange", "options", "selected", "showSelectAll"]);
|
|
2245
2247
|
var values = options.map(function (option) { return option.value; });
|
|
@@ -2267,17 +2269,422 @@ var Checklist = function (_a) {
|
|
|
2267
2269
|
return (React.createElement(Checkbox, __assign({ key: i }, accessibleProps, { checked: checked, disabled: disabled, onChange: handleChange.bind(null, option) }), label));
|
|
2268
2270
|
}))));
|
|
2269
2271
|
};
|
|
2270
|
-
var templateObject_1$
|
|
2272
|
+
var templateObject_1$g, templateObject_2$f;
|
|
2273
|
+
|
|
2274
|
+
var dayjs_min = {exports: {}};
|
|
2275
|
+
|
|
2276
|
+
(function (module, exports) {
|
|
2277
|
+
!function (t, e) {
|
|
2278
|
+
module.exports = e() ;
|
|
2279
|
+
}(commonjsGlobal, function () {
|
|
2280
|
+
|
|
2281
|
+
var t = 1e3,
|
|
2282
|
+
e = 6e4,
|
|
2283
|
+
n = 36e5,
|
|
2284
|
+
r = "millisecond",
|
|
2285
|
+
i = "second",
|
|
2286
|
+
s = "minute",
|
|
2287
|
+
u = "hour",
|
|
2288
|
+
a = "day",
|
|
2289
|
+
o = "week",
|
|
2290
|
+
f = "month",
|
|
2291
|
+
h = "quarter",
|
|
2292
|
+
c = "year",
|
|
2293
|
+
d = "date",
|
|
2294
|
+
l = "Invalid Date",
|
|
2295
|
+
$ = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,
|
|
2296
|
+
y = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,
|
|
2297
|
+
M = {
|
|
2298
|
+
name: "en",
|
|
2299
|
+
weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),
|
|
2300
|
+
months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"),
|
|
2301
|
+
ordinal: function (t) {
|
|
2302
|
+
var e = ["th", "st", "nd", "rd"],
|
|
2303
|
+
n = t % 100;
|
|
2304
|
+
return "[" + t + (e[(n - 20) % 10] || e[n] || e[0]) + "]";
|
|
2305
|
+
}
|
|
2306
|
+
},
|
|
2307
|
+
m = function (t, e, n) {
|
|
2308
|
+
var r = String(t);
|
|
2309
|
+
return !r || r.length >= e ? t : "" + Array(e + 1 - r.length).join(n) + t;
|
|
2310
|
+
},
|
|
2311
|
+
v = {
|
|
2312
|
+
s: m,
|
|
2313
|
+
z: function (t) {
|
|
2314
|
+
var e = -t.utcOffset(),
|
|
2315
|
+
n = Math.abs(e),
|
|
2316
|
+
r = Math.floor(n / 60),
|
|
2317
|
+
i = n % 60;
|
|
2318
|
+
return (e <= 0 ? "+" : "-") + m(r, 2, "0") + ":" + m(i, 2, "0");
|
|
2319
|
+
},
|
|
2320
|
+
m: function t(e, n) {
|
|
2321
|
+
if (e.date() < n.date()) return -t(n, e);
|
|
2322
|
+
var r = 12 * (n.year() - e.year()) + (n.month() - e.month()),
|
|
2323
|
+
i = e.clone().add(r, f),
|
|
2324
|
+
s = n - i < 0,
|
|
2325
|
+
u = e.clone().add(r + (s ? -1 : 1), f);
|
|
2326
|
+
return +(-(r + (n - i) / (s ? i - u : u - i)) || 0);
|
|
2327
|
+
},
|
|
2328
|
+
a: function (t) {
|
|
2329
|
+
return t < 0 ? Math.ceil(t) || 0 : Math.floor(t);
|
|
2330
|
+
},
|
|
2331
|
+
p: function (t) {
|
|
2332
|
+
return {
|
|
2333
|
+
M: f,
|
|
2334
|
+
y: c,
|
|
2335
|
+
w: o,
|
|
2336
|
+
d: a,
|
|
2337
|
+
D: d,
|
|
2338
|
+
h: u,
|
|
2339
|
+
m: s,
|
|
2340
|
+
s: i,
|
|
2341
|
+
ms: r,
|
|
2342
|
+
Q: h
|
|
2343
|
+
}[t] || String(t || "").toLowerCase().replace(/s$/, "");
|
|
2344
|
+
},
|
|
2345
|
+
u: function (t) {
|
|
2346
|
+
return void 0 === t;
|
|
2347
|
+
}
|
|
2348
|
+
},
|
|
2349
|
+
g = "en",
|
|
2350
|
+
D = {};
|
|
2351
|
+
D[g] = M;
|
|
2352
|
+
var p = function (t) {
|
|
2353
|
+
return t instanceof _;
|
|
2354
|
+
},
|
|
2355
|
+
S = function t(e, n, r) {
|
|
2356
|
+
var i;
|
|
2357
|
+
if (!e) return g;
|
|
2358
|
+
if ("string" == typeof e) {
|
|
2359
|
+
var s = e.toLowerCase();
|
|
2360
|
+
D[s] && (i = s), n && (D[s] = n, i = s);
|
|
2361
|
+
var u = e.split("-");
|
|
2362
|
+
if (!i && u.length > 1) return t(u[0]);
|
|
2363
|
+
} else {
|
|
2364
|
+
var a = e.name;
|
|
2365
|
+
D[a] = e, i = a;
|
|
2366
|
+
}
|
|
2367
|
+
return !r && i && (g = i), i || !r && g;
|
|
2368
|
+
},
|
|
2369
|
+
w = function (t, e) {
|
|
2370
|
+
if (p(t)) return t.clone();
|
|
2371
|
+
var n = "object" == typeof e ? e : {};
|
|
2372
|
+
return n.date = t, n.args = arguments, new _(n);
|
|
2373
|
+
},
|
|
2374
|
+
O = v;
|
|
2375
|
+
O.l = S, O.i = p, O.w = function (t, e) {
|
|
2376
|
+
return w(t, {
|
|
2377
|
+
locale: e.$L,
|
|
2378
|
+
utc: e.$u,
|
|
2379
|
+
x: e.$x,
|
|
2380
|
+
$offset: e.$offset
|
|
2381
|
+
});
|
|
2382
|
+
};
|
|
2383
|
+
var _ = function () {
|
|
2384
|
+
function M(t) {
|
|
2385
|
+
this.$L = S(t.locale, null, !0), this.parse(t);
|
|
2386
|
+
}
|
|
2387
|
+
var m = M.prototype;
|
|
2388
|
+
return m.parse = function (t) {
|
|
2389
|
+
this.$d = function (t) {
|
|
2390
|
+
var e = t.date,
|
|
2391
|
+
n = t.utc;
|
|
2392
|
+
if (null === e) return new Date(NaN);
|
|
2393
|
+
if (O.u(e)) return new Date();
|
|
2394
|
+
if (e instanceof Date) return new Date(e);
|
|
2395
|
+
if ("string" == typeof e && !/Z$/i.test(e)) {
|
|
2396
|
+
var r = e.match($);
|
|
2397
|
+
if (r) {
|
|
2398
|
+
var i = r[2] - 1 || 0,
|
|
2399
|
+
s = (r[7] || "0").substring(0, 3);
|
|
2400
|
+
return n ? new Date(Date.UTC(r[1], i, r[3] || 1, r[4] || 0, r[5] || 0, r[6] || 0, s)) : new Date(r[1], i, r[3] || 1, r[4] || 0, r[5] || 0, r[6] || 0, s);
|
|
2401
|
+
}
|
|
2402
|
+
}
|
|
2403
|
+
return new Date(e);
|
|
2404
|
+
}(t), this.$x = t.x || {}, this.init();
|
|
2405
|
+
}, m.init = function () {
|
|
2406
|
+
var t = this.$d;
|
|
2407
|
+
this.$y = t.getFullYear(), this.$M = t.getMonth(), this.$D = t.getDate(), this.$W = t.getDay(), this.$H = t.getHours(), this.$m = t.getMinutes(), this.$s = t.getSeconds(), this.$ms = t.getMilliseconds();
|
|
2408
|
+
}, m.$utils = function () {
|
|
2409
|
+
return O;
|
|
2410
|
+
}, m.isValid = function () {
|
|
2411
|
+
return !(this.$d.toString() === l);
|
|
2412
|
+
}, m.isSame = function (t, e) {
|
|
2413
|
+
var n = w(t);
|
|
2414
|
+
return this.startOf(e) <= n && n <= this.endOf(e);
|
|
2415
|
+
}, m.isAfter = function (t, e) {
|
|
2416
|
+
return w(t) < this.startOf(e);
|
|
2417
|
+
}, m.isBefore = function (t, e) {
|
|
2418
|
+
return this.endOf(e) < w(t);
|
|
2419
|
+
}, m.$g = function (t, e, n) {
|
|
2420
|
+
return O.u(t) ? this[e] : this.set(n, t);
|
|
2421
|
+
}, m.unix = function () {
|
|
2422
|
+
return Math.floor(this.valueOf() / 1e3);
|
|
2423
|
+
}, m.valueOf = function () {
|
|
2424
|
+
return this.$d.getTime();
|
|
2425
|
+
}, m.startOf = function (t, e) {
|
|
2426
|
+
var n = this,
|
|
2427
|
+
r = !!O.u(e) || e,
|
|
2428
|
+
h = O.p(t),
|
|
2429
|
+
l = function (t, e) {
|
|
2430
|
+
var i = O.w(n.$u ? Date.UTC(n.$y, e, t) : new Date(n.$y, e, t), n);
|
|
2431
|
+
return r ? i : i.endOf(a);
|
|
2432
|
+
},
|
|
2433
|
+
$ = function (t, e) {
|
|
2434
|
+
return O.w(n.toDate()[t].apply(n.toDate("s"), (r ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(e)), n);
|
|
2435
|
+
},
|
|
2436
|
+
y = this.$W,
|
|
2437
|
+
M = this.$M,
|
|
2438
|
+
m = this.$D,
|
|
2439
|
+
v = "set" + (this.$u ? "UTC" : "");
|
|
2440
|
+
switch (h) {
|
|
2441
|
+
case c:
|
|
2442
|
+
return r ? l(1, 0) : l(31, 11);
|
|
2443
|
+
case f:
|
|
2444
|
+
return r ? l(1, M) : l(0, M + 1);
|
|
2445
|
+
case o:
|
|
2446
|
+
var g = this.$locale().weekStart || 0,
|
|
2447
|
+
D = (y < g ? y + 7 : y) - g;
|
|
2448
|
+
return l(r ? m - D : m + (6 - D), M);
|
|
2449
|
+
case a:
|
|
2450
|
+
case d:
|
|
2451
|
+
return $(v + "Hours", 0);
|
|
2452
|
+
case u:
|
|
2453
|
+
return $(v + "Minutes", 1);
|
|
2454
|
+
case s:
|
|
2455
|
+
return $(v + "Seconds", 2);
|
|
2456
|
+
case i:
|
|
2457
|
+
return $(v + "Milliseconds", 3);
|
|
2458
|
+
default:
|
|
2459
|
+
return this.clone();
|
|
2460
|
+
}
|
|
2461
|
+
}, m.endOf = function (t) {
|
|
2462
|
+
return this.startOf(t, !1);
|
|
2463
|
+
}, m.$set = function (t, e) {
|
|
2464
|
+
var n,
|
|
2465
|
+
o = O.p(t),
|
|
2466
|
+
h = "set" + (this.$u ? "UTC" : ""),
|
|
2467
|
+
l = (n = {}, n[a] = h + "Date", n[d] = h + "Date", n[f] = h + "Month", n[c] = h + "FullYear", n[u] = h + "Hours", n[s] = h + "Minutes", n[i] = h + "Seconds", n[r] = h + "Milliseconds", n)[o],
|
|
2468
|
+
$ = o === a ? this.$D + (e - this.$W) : e;
|
|
2469
|
+
if (o === f || o === c) {
|
|
2470
|
+
var y = this.clone().set(d, 1);
|
|
2471
|
+
y.$d[l]($), y.init(), this.$d = y.set(d, Math.min(this.$D, y.daysInMonth())).$d;
|
|
2472
|
+
} else l && this.$d[l]($);
|
|
2473
|
+
return this.init(), this;
|
|
2474
|
+
}, m.set = function (t, e) {
|
|
2475
|
+
return this.clone().$set(t, e);
|
|
2476
|
+
}, m.get = function (t) {
|
|
2477
|
+
return this[O.p(t)]();
|
|
2478
|
+
}, m.add = function (r, h) {
|
|
2479
|
+
var d,
|
|
2480
|
+
l = this;
|
|
2481
|
+
r = Number(r);
|
|
2482
|
+
var $ = O.p(h),
|
|
2483
|
+
y = function (t) {
|
|
2484
|
+
var e = w(l);
|
|
2485
|
+
return O.w(e.date(e.date() + Math.round(t * r)), l);
|
|
2486
|
+
};
|
|
2487
|
+
if ($ === f) return this.set(f, this.$M + r);
|
|
2488
|
+
if ($ === c) return this.set(c, this.$y + r);
|
|
2489
|
+
if ($ === a) return y(1);
|
|
2490
|
+
if ($ === o) return y(7);
|
|
2491
|
+
var M = (d = {}, d[s] = e, d[u] = n, d[i] = t, d)[$] || 1,
|
|
2492
|
+
m = this.$d.getTime() + r * M;
|
|
2493
|
+
return O.w(m, this);
|
|
2494
|
+
}, m.subtract = function (t, e) {
|
|
2495
|
+
return this.add(-1 * t, e);
|
|
2496
|
+
}, m.format = function (t) {
|
|
2497
|
+
var e = this,
|
|
2498
|
+
n = this.$locale();
|
|
2499
|
+
if (!this.isValid()) return n.invalidDate || l;
|
|
2500
|
+
var r = t || "YYYY-MM-DDTHH:mm:ssZ",
|
|
2501
|
+
i = O.z(this),
|
|
2502
|
+
s = this.$H,
|
|
2503
|
+
u = this.$m,
|
|
2504
|
+
a = this.$M,
|
|
2505
|
+
o = n.weekdays,
|
|
2506
|
+
f = n.months,
|
|
2507
|
+
h = function (t, n, i, s) {
|
|
2508
|
+
return t && (t[n] || t(e, r)) || i[n].slice(0, s);
|
|
2509
|
+
},
|
|
2510
|
+
c = function (t) {
|
|
2511
|
+
return O.s(s % 12 || 12, t, "0");
|
|
2512
|
+
},
|
|
2513
|
+
d = n.meridiem || function (t, e, n) {
|
|
2514
|
+
var r = t < 12 ? "AM" : "PM";
|
|
2515
|
+
return n ? r.toLowerCase() : r;
|
|
2516
|
+
},
|
|
2517
|
+
$ = {
|
|
2518
|
+
YY: String(this.$y).slice(-2),
|
|
2519
|
+
YYYY: O.s(this.$y, 4, "0"),
|
|
2520
|
+
M: a + 1,
|
|
2521
|
+
MM: O.s(a + 1, 2, "0"),
|
|
2522
|
+
MMM: h(n.monthsShort, a, f, 3),
|
|
2523
|
+
MMMM: h(f, a),
|
|
2524
|
+
D: this.$D,
|
|
2525
|
+
DD: O.s(this.$D, 2, "0"),
|
|
2526
|
+
d: String(this.$W),
|
|
2527
|
+
dd: h(n.weekdaysMin, this.$W, o, 2),
|
|
2528
|
+
ddd: h(n.weekdaysShort, this.$W, o, 3),
|
|
2529
|
+
dddd: o[this.$W],
|
|
2530
|
+
H: String(s),
|
|
2531
|
+
HH: O.s(s, 2, "0"),
|
|
2532
|
+
h: c(1),
|
|
2533
|
+
hh: c(2),
|
|
2534
|
+
a: d(s, u, !0),
|
|
2535
|
+
A: d(s, u, !1),
|
|
2536
|
+
m: String(u),
|
|
2537
|
+
mm: O.s(u, 2, "0"),
|
|
2538
|
+
s: String(this.$s),
|
|
2539
|
+
ss: O.s(this.$s, 2, "0"),
|
|
2540
|
+
SSS: O.s(this.$ms, 3, "0"),
|
|
2541
|
+
Z: i
|
|
2542
|
+
};
|
|
2543
|
+
return r.replace(y, function (t, e) {
|
|
2544
|
+
return e || $[t] || i.replace(":", "");
|
|
2545
|
+
});
|
|
2546
|
+
}, m.utcOffset = function () {
|
|
2547
|
+
return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
|
|
2548
|
+
}, m.diff = function (r, d, l) {
|
|
2549
|
+
var $,
|
|
2550
|
+
y = O.p(d),
|
|
2551
|
+
M = w(r),
|
|
2552
|
+
m = (M.utcOffset() - this.utcOffset()) * e,
|
|
2553
|
+
v = this - M,
|
|
2554
|
+
g = O.m(this, M);
|
|
2555
|
+
return g = ($ = {}, $[c] = g / 12, $[f] = g, $[h] = g / 3, $[o] = (v - m) / 6048e5, $[a] = (v - m) / 864e5, $[u] = v / n, $[s] = v / e, $[i] = v / t, $)[y] || v, l ? g : O.a(g);
|
|
2556
|
+
}, m.daysInMonth = function () {
|
|
2557
|
+
return this.endOf(f).$D;
|
|
2558
|
+
}, m.$locale = function () {
|
|
2559
|
+
return D[this.$L];
|
|
2560
|
+
}, m.locale = function (t, e) {
|
|
2561
|
+
if (!t) return this.$L;
|
|
2562
|
+
var n = this.clone(),
|
|
2563
|
+
r = S(t, e, !0);
|
|
2564
|
+
return r && (n.$L = r), n;
|
|
2565
|
+
}, m.clone = function () {
|
|
2566
|
+
return O.w(this.$d, this);
|
|
2567
|
+
}, m.toDate = function () {
|
|
2568
|
+
return new Date(this.valueOf());
|
|
2569
|
+
}, m.toJSON = function () {
|
|
2570
|
+
return this.isValid() ? this.toISOString() : null;
|
|
2571
|
+
}, m.toISOString = function () {
|
|
2572
|
+
return this.$d.toISOString();
|
|
2573
|
+
}, m.toString = function () {
|
|
2574
|
+
return this.$d.toUTCString();
|
|
2575
|
+
}, M;
|
|
2576
|
+
}(),
|
|
2577
|
+
T = _.prototype;
|
|
2578
|
+
return w.prototype = T, [["$ms", r], ["$s", i], ["$m", s], ["$H", u], ["$W", a], ["$M", f], ["$y", c], ["$D", d]].forEach(function (t) {
|
|
2579
|
+
T[t[1]] = function (e) {
|
|
2580
|
+
return this.$g(e, t[0], t[1]);
|
|
2581
|
+
};
|
|
2582
|
+
}), w.extend = function (t, e) {
|
|
2583
|
+
return t.$i || (t(e, _, w), t.$i = !0), w;
|
|
2584
|
+
}, w.locale = S, w.isDayjs = p, w.unix = function (t) {
|
|
2585
|
+
return w(1e3 * t);
|
|
2586
|
+
}, w.en = D[g], w.Ls = D, w.p = {}, w;
|
|
2587
|
+
});
|
|
2588
|
+
})(dayjs_min);
|
|
2589
|
+
var dayjs_minExports = dayjs_min.exports;
|
|
2590
|
+
var dayjs = /*@__PURE__*/getDefaultExportFromCjs(dayjs_minExports);
|
|
2591
|
+
|
|
2592
|
+
var Wrapper$a = styled.div(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n border-radius: 4px;\n height: 40px;\n background-color: ", ";\n position: relative;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: ", ";\n flex-grow: ", ";\n box-sizing: border-box;\n padding: 10px 0px;\n display: flex;\n align-items: center;\n"], ["\n border-radius: 4px;\n height: 40px;\n background-color: ", ";\n position: relative;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: ", ";\n flex-grow: ", ";\n box-sizing: border-box;\n padding: 10px 0px;\n display: flex;\n align-items: center;\n"])), function (props) { return (props.$readOnly ? '#f5f5f5' : '#ffffff'); }, function (props) { return (props.$invalid ? Colors.RED.Hex : '#cccccc'); }, function (_a) {
|
|
2593
|
+
var $style = _a.$style;
|
|
2594
|
+
return ($style === null || $style === void 0 ? void 0 : $style.borderRadius) || '4px';
|
|
2595
|
+
}, function (_a) {
|
|
2596
|
+
var $style = _a.$style;
|
|
2597
|
+
return ($style === null || $style === void 0 ? void 0 : $style.flexGrow) || 0;
|
|
2598
|
+
});
|
|
2599
|
+
var Trigger$1 = styled.select(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n appearance: none;\n box-shadow: none;\n outline: none;\n border: none;\n color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 2.9em;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n width: 100%;\n box-sizing: border-box;\n padding: 0px 30px 0px 10px;\n box-sizing: border-box;\n position: relative;\n z-index: 2;\n"], ["\n appearance: none;\n box-shadow: none;\n outline: none;\n border: none;\n color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 2.9em;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n width: 100%;\n box-sizing: border-box;\n padding: 0px 30px 0px 10px;\n box-sizing: border-box;\n position: relative;\n z-index: 2;\n"])), Colors.BLACK.Hex, FontSizes.DEFAULT, FontStyles.DEFAULT);
|
|
2600
|
+
var IconWrapper$2 = styled.span(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n position: absolute;\n right: 4px;\n height: 22px;\n z-index: 1;\n"], ["\n position: absolute;\n right: 4px;\n height: 22px;\n z-index: 1;\n"])));
|
|
2601
|
+
var Select = function (_a) {
|
|
2602
|
+
var options = _a.options, optionGroups = _a.optionGroups, placeholder = _a.placeholder, readOnly = _a.readOnly, invalid = _a.invalid, value = _a.value, onChange = _a.onChange, style = _a.style, accessibleProps = __rest(_a, ["options", "optionGroups", "placeholder", "readOnly", "invalid", "value", "onChange", "style"]);
|
|
2603
|
+
return (React.createElement(Wrapper$a, { "$invalid": invalid, "$readOnly": readOnly, "$style": style },
|
|
2604
|
+
React.createElement(Trigger$1, __assign({ disabled: readOnly, onChange: onChange, placeholder: placeholder, value: value }, accessibleProps),
|
|
2605
|
+
placeholder ? (React.createElement("option", { disabled: true, value: '' }, placeholder)) : null,
|
|
2606
|
+
optionGroups &&
|
|
2607
|
+
optionGroups.map(function (group, i) {
|
|
2608
|
+
return (React.createElement("optgroup", { key: i, label: group.label || "Group ".concat(i) }, group.options.map(function (option, i) {
|
|
2609
|
+
return (React.createElement("option", { key: i, value: option.value }, option.label || option.value));
|
|
2610
|
+
})));
|
|
2611
|
+
}),
|
|
2612
|
+
options &&
|
|
2613
|
+
options.map(function (option, i) {
|
|
2614
|
+
return (React.createElement("option", { key: i, value: option.value }, option.label || option.value));
|
|
2615
|
+
})),
|
|
2616
|
+
React.createElement(IconWrapper$2, null,
|
|
2617
|
+
React.createElement(Icon, { color: Colors.BLACK.Hex, path: js.mdiChevronDown, size: '22px' }))));
|
|
2618
|
+
};
|
|
2619
|
+
var templateObject_1$f, templateObject_2$e, templateObject_3$c;
|
|
2620
|
+
|
|
2621
|
+
var DatePickerWrapper = styled.div(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
2622
|
+
var Middle = styled.div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n margin: 0px -1px;\n"], ["\n margin: 0px -1px;\n"])));
|
|
2623
|
+
var DatePicker = function (_a) {
|
|
2624
|
+
var _b = _a.readOnly, readOnly = _b === void 0 ? false : _b, _c = _a.invalid, invalid = _c === void 0 ? false : _c, _d = _a.maxDate, maxDate = _d === void 0 ? null : _d, _e = _a.minDate, minDate = _e === void 0 ? null : _e, date = _a.date, onChange = _a.onChange;
|
|
2625
|
+
var dMaxDate = maxDate ? dayjs(maxDate) : dayjs();
|
|
2626
|
+
var dMinDate = minDate ? dayjs(minDate) : dMaxDate.subtract(100, 'year');
|
|
2627
|
+
var _f = React.useState(dayjs(date)), dDate = _f[0], setDate = _f[1];
|
|
2628
|
+
var _g = React.useState(Array.from({ length: dDate.daysInMonth() - 1 }, function (_, i) { return ({
|
|
2629
|
+
value: i + 1,
|
|
2630
|
+
}); })), dayOptions = _g[0], setDayOptions = _g[1];
|
|
2631
|
+
var months = [
|
|
2632
|
+
{ label: 'January', value: 1 },
|
|
2633
|
+
{ label: 'Feburary', value: 2 },
|
|
2634
|
+
{ label: 'March', value: 3 },
|
|
2635
|
+
{ label: 'April', value: 4 },
|
|
2636
|
+
{ label: 'May', value: 5 },
|
|
2637
|
+
{ label: 'June', value: 6 },
|
|
2638
|
+
{ label: 'July', value: 7 },
|
|
2639
|
+
{ label: 'August', value: 8 },
|
|
2640
|
+
{ label: 'September', value: 9 },
|
|
2641
|
+
{ label: 'October', value: 10 },
|
|
2642
|
+
{ label: 'November', value: 11 },
|
|
2643
|
+
{ label: 'December', value: 12 },
|
|
2644
|
+
];
|
|
2645
|
+
var years = Array.from({ length: dMaxDate.year() - dMinDate.year() + 1 }, function (_, i) { return ({
|
|
2646
|
+
label: (dMinDate.year() + i).toString(),
|
|
2647
|
+
value: dMinDate.year() + i,
|
|
2648
|
+
}); });
|
|
2649
|
+
React.useEffect(function () {
|
|
2650
|
+
setDayOptions(Array.from({ length: dDate.daysInMonth() }, function (_, i) { return ({
|
|
2651
|
+
value: i + 1,
|
|
2652
|
+
}); }));
|
|
2653
|
+
onChange(dDate.format('YYYY-MM-DD'));
|
|
2654
|
+
}, [dDate]);
|
|
2655
|
+
var handleDayChange = function (e) {
|
|
2656
|
+
var date = parseInt(e.target.value, 10);
|
|
2657
|
+
var new_date = dDate.date(date);
|
|
2658
|
+
setDate(new_date);
|
|
2659
|
+
};
|
|
2660
|
+
var handleMonthChange = function (e) {
|
|
2661
|
+
var month = parseInt(e.target.value, 10);
|
|
2662
|
+
var new_date = dDate.month(month - 1); // dayjs month is zero based
|
|
2663
|
+
setDate(new_date);
|
|
2664
|
+
};
|
|
2665
|
+
var handleYearChange = function (e) {
|
|
2666
|
+
var year = parseInt(e.target.value, 10);
|
|
2667
|
+
var new_date = dDate.year(year);
|
|
2668
|
+
setDate(new_date);
|
|
2669
|
+
};
|
|
2670
|
+
return (React.createElement(React.Fragment, null,
|
|
2671
|
+
React.createElement(DatePickerWrapper, null,
|
|
2672
|
+
React.createElement(Select, { invalid: invalid, onChange: handleMonthChange, options: months, readOnly: readOnly, style: { borderRadius: '4px 0px 0px 4px' }, value: dDate.format('M') }),
|
|
2673
|
+
React.createElement(Middle, null,
|
|
2674
|
+
React.createElement(Select, { invalid: invalid, onChange: handleDayChange, options: dayOptions, readOnly: readOnly, style: { borderRadius: '0px' }, value: dDate.format('D') })),
|
|
2675
|
+
React.createElement(Select, { invalid: invalid, onChange: handleYearChange, options: years, readOnly: readOnly, style: { borderRadius: '0px 4px 4px 0px' }, value: dDate.format('YYYY') }))));
|
|
2676
|
+
};
|
|
2677
|
+
var templateObject_1$e, templateObject_2$d;
|
|
2271
2678
|
|
|
2272
|
-
var Scrim$1 = styled.div(templateObject_1$
|
|
2679
|
+
var Scrim$1 = styled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 9998;\n background: ", ";\n"], ["\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 9998;\n background: ", ";\n"])), function (_a) {
|
|
2273
2680
|
var $scrim = _a.$scrim;
|
|
2274
2681
|
return ($scrim === 'dark' ? 'rgba(0,0,0,0.8)' : 'transparent');
|
|
2275
2682
|
});
|
|
2276
|
-
var Container$2 = styled.div(templateObject_2$
|
|
2683
|
+
var Container$2 = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n z-index: 9999;\n min-width: 400px;\n width: ", ";\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n padding: 0px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n background: #fff;\n"], ["\n z-index: 9999;\n min-width: 400px;\n width: ", ";\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n padding: 0px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n background: #fff;\n"])), function (_a) {
|
|
2277
2684
|
var $width = _a.$width;
|
|
2278
2685
|
return $width || '400px';
|
|
2279
2686
|
});
|
|
2280
|
-
var Header$2 = styled.div(templateObject_3$
|
|
2687
|
+
var Header$2 = styled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n padding: 30px 20px;\n display: flex;\n align-items: flex-start;\n box-sizing: border-box;\n flex-shrink: 0;\n background: #fff;\n"], ["\n padding: 30px 20px;\n display: flex;\n align-items: flex-start;\n box-sizing: border-box;\n flex-shrink: 0;\n background: #fff;\n"])));
|
|
2281
2688
|
var Close$1 = styled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n padding-left: 20px;\n cursor: pointer;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n padding-left: 20px;\n cursor: pointer;\n"])));
|
|
2282
2689
|
var ContentWrapper$1 = styled.div(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n overflow-x: hidden;\n overflow-y: auto;\n box-sizing: border-box;\n flex: 1;\n background: #fff;\n"], ["\n overflow-x: hidden;\n overflow-y: auto;\n box-sizing: border-box;\n flex: 1;\n background: #fff;\n"])));
|
|
2283
2690
|
var ButtonBar$1 = styled.div(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n padding: 20px;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n box-sizing: border-box;\n gap: 10px;\n flex-shrink: 0;\n background: #fff;\n"], ["\n padding: 20px;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n box-sizing: border-box;\n gap: 10px;\n flex-shrink: 0;\n background: #fff;\n"])));
|
|
@@ -2308,18 +2715,18 @@ var Drawer = function (_a) {
|
|
|
2308
2715
|
primaryButton ? React.createElement(Button, __assign({}, primaryButton, { format: 'primary' })) : null)) : null),
|
|
2309
2716
|
scrim ? React.createElement(Scrim$1, { "$scrim": scrim, onClick: onClose }) : null));
|
|
2310
2717
|
};
|
|
2311
|
-
var templateObject_1$
|
|
2718
|
+
var templateObject_1$d, templateObject_2$c, templateObject_3$b, templateObject_4$7, templateObject_5$5, templateObject_6$3;
|
|
2312
2719
|
|
|
2313
|
-
var Wrapper$
|
|
2314
|
-
var LabelRow = styled.div(templateObject_1$
|
|
2315
|
-
var Label$2 = styled.label(templateObject_2$
|
|
2316
|
-
var Required = styled.span(templateObject_3$
|
|
2720
|
+
var Wrapper$9 = styled.div(function (props) { return (__assign({ margin: '0px 0px 18px 0px' }, props.style)); });
|
|
2721
|
+
var LabelRow = styled.div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 0 4px 0;\n box-sizing: border-box;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 0 0 4px 0;\n box-sizing: border-box;\n"])));
|
|
2722
|
+
var Label$2 = styled.label(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 500;\n line-height: 1em;\n font-family: ", ";\n color: ", ";\n"], ["\n font-size: ", ";\n font-weight: 500;\n line-height: 1em;\n font-family: ", ";\n color: ", ";\n"])), FontSizes.DEFAULT, FontStyles.DEFAULT, Colors.BLACK.Hex);
|
|
2723
|
+
var Required = styled.span(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n color: ", ";\n margin-left: 4px;\n"], ["\n color: ", ";\n margin-left: 4px;\n"])), Colors.RED.Hex);
|
|
2317
2724
|
var Action = styled.span(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 500;\n line-height: 1em;\n font-family: ", ";\n color: ", ";\n cursor: pointer;\n"], ["\n font-size: ", ";\n font-weight: 500;\n line-height: 1em;\n font-family: ", ";\n color: ", ";\n cursor: pointer;\n"])), FontSizes.DEFAULT, FontStyles.DEFAULT, Colors.PRIMARY.Hex);
|
|
2318
2725
|
var Description = styled.div(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 400;\n line-height: 1.3em;\n font-family: ", ";\n color: ", ";\n margin: 0 0 8px 0;\n box-sizing: border-box;\n"], ["\n font-size: ", ";\n font-weight: 400;\n line-height: 1.3em;\n font-family: ", ";\n color: ", ";\n margin: 0 0 8px 0;\n box-sizing: border-box;\n"])), FontSizes.SMALL, FontStyles.DEFAULT, Colors.BLACK.Hex);
|
|
2319
2726
|
var Validation = styled.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 400;\n line-height: 1.3em;\n font-family: ", ";\n color: ", ";\n margin: 4px 0 0 0;\n box-sizing: border-box;\n"], ["\n font-size: ", ";\n font-weight: 400;\n line-height: 1.3em;\n font-family: ", ";\n color: ", ";\n margin: 4px 0 0 0;\n box-sizing: border-box;\n"])), FontSizes.SMALL, FontStyles.DEFAULT, Colors.RED.Hex);
|
|
2320
2727
|
var Field = function (_a) {
|
|
2321
2728
|
var action = _a.action, children = _a.children, validationText = _a.validationText, label = _a.label, description = _a.description, required = _a.required, htmlFor = _a.htmlFor, style = _a.style, accessibleProps = __rest(_a, ["action", "children", "validationText", "label", "description", "required", "htmlFor", "style"]);
|
|
2322
|
-
return (React.createElement(Wrapper$
|
|
2729
|
+
return (React.createElement(Wrapper$9, __assign({ style: style }, accessibleProps),
|
|
2323
2730
|
React.createElement(LabelRow, null,
|
|
2324
2731
|
React.createElement(Label$2, { htmlFor: htmlFor },
|
|
2325
2732
|
label,
|
|
@@ -2329,20 +2736,20 @@ var Field = function (_a) {
|
|
|
2329
2736
|
children,
|
|
2330
2737
|
validationText ? React.createElement(Validation, null, validationText) : null));
|
|
2331
2738
|
};
|
|
2332
|
-
var templateObject_1$
|
|
2739
|
+
var templateObject_1$c, templateObject_2$b, templateObject_3$a, templateObject_4$6, templateObject_5$4, templateObject_6$2;
|
|
2333
2740
|
|
|
2334
|
-
var Wrapper$
|
|
2741
|
+
var Wrapper$8 = styled.div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n display: flex;\n gap: 16px;\n padding: 20px;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n border: 1px dashed ", ";\n background-color: ", ";\n"], ["\n display: flex;\n gap: 16px;\n padding: 20px;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n border-radius: 8px;\n border: 1px dashed ", ";\n background-color: ", ";\n"])), function (_a) {
|
|
2335
2742
|
var $isDragOver = _a.$isDragOver;
|
|
2336
2743
|
return ($isDragOver ? "".concat(Colors.PRIMARY.Hex) : '#ccc');
|
|
2337
2744
|
}, function (_a) {
|
|
2338
2745
|
var $isDragOver = _a.$isDragOver;
|
|
2339
2746
|
return $isDragOver ? "rgba(".concat(Colors.PRIMARY.Rgb, ", 0.05)") : '#ffffff';
|
|
2340
2747
|
});
|
|
2341
|
-
var StyledIcon$1 = styled.div(templateObject_2$
|
|
2748
|
+
var StyledIcon$1 = styled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n width: 80px;\n height: 80px;\n cursor: pointer;\n flex-shrink: 0;\n background-color: ", ";\n border-radius: 80px;\n display: flex;\n margin: auto;\n justify-content: center;\n align-items: center;\n"], ["\n width: 80px;\n height: 80px;\n cursor: pointer;\n flex-shrink: 0;\n background-color: ", ";\n border-radius: 80px;\n display: flex;\n margin: auto;\n justify-content: center;\n align-items: center;\n"])), function (_a) {
|
|
2342
2749
|
var $isDragOver = _a.$isDragOver;
|
|
2343
2750
|
return ($isDragOver ? '#fff' : '#f5f5f5');
|
|
2344
2751
|
});
|
|
2345
|
-
var Files = styled.div(templateObject_3$
|
|
2752
|
+
var Files = styled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 10px;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 10px;\n"])));
|
|
2346
2753
|
var File = styled.div(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n width: 300px;\n padding: 10px;\n align-items: center;\n gap: 2px;\n list-style-type: none;\n border-radius: 4px;\n border: 1px solid #ccc;\n"], ["\n display: flex;\n justify-content: space-between;\n width: 300px;\n padding: 10px;\n align-items: center;\n gap: 2px;\n list-style-type: none;\n border-radius: 4px;\n border: 1px solid #ccc;\n"])));
|
|
2347
2754
|
var CopyWrapper = styled.div(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n padding: ", ";\n margin-top: ", ";\n"], ["\n padding: ", ";\n margin-top: ", ";\n"])), function (_a) {
|
|
2348
2755
|
var $fileState = _a.$fileState;
|
|
@@ -2351,7 +2758,7 @@ var CopyWrapper = styled.div(templateObject_5$3 || (templateObject_5$3 = __makeT
|
|
|
2351
2758
|
var $fileState = _a.$fileState;
|
|
2352
2759
|
return ($fileState ? '' : '16px');
|
|
2353
2760
|
});
|
|
2354
|
-
var IconWrapper$
|
|
2761
|
+
var IconWrapper$1 = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
|
|
2355
2762
|
var ProgressBar = styled.div(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n width: 100px;\n height: 14px;\n border-radius: 4px;\n background: #f5f5f5;\n overflow-x: hidden;\n"], ["\n width: 100px;\n height: 14px;\n border-radius: 4px;\n background: #f5f5f5;\n overflow-x: hidden;\n"])));
|
|
2356
2763
|
var Progress = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n width: ", ";\n height: 100%;\n border-radius: 4px 0px 0px 4px;\n background: ", ";\n"], ["\n width: ", ";\n height: 100%;\n border-radius: 4px 0px 0px 4px;\n background: ", ";\n"])), function (_a) {
|
|
2357
2764
|
var $width = _a.$width;
|
|
@@ -2411,12 +2818,12 @@ var FileUpload = function (_a) {
|
|
|
2411
2818
|
onFileDelete(files[index]);
|
|
2412
2819
|
};
|
|
2413
2820
|
return (React.createElement(React.Fragment, null,
|
|
2414
|
-
React.createElement(Wrapper$
|
|
2821
|
+
React.createElement(Wrapper$8, __assign({ "$isDragOver": dragOver, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop }, accessibleProps),
|
|
2415
2822
|
files.length > 0 && (React.createElement(Files, null, Array.from(files).map(function (singleFile, index) {
|
|
2416
2823
|
var _a;
|
|
2417
2824
|
return (React.createElement(File, { key: index },
|
|
2418
2825
|
React.createElement(Copy, { children: (_a = singleFile.file) === null || _a === void 0 ? void 0 : _a.name, type: 'bold' }),
|
|
2419
|
-
singleFile.uploadUpdate === 100 || !progress ? (React.createElement(IconWrapper$
|
|
2826
|
+
singleFile.uploadUpdate === 100 || !progress ? (React.createElement(IconWrapper$1, { onClick: function () { return removeItem(index); } },
|
|
2420
2827
|
React.createElement(Icon, { color: 'red', path: js.mdiMinusCircle, size: 1 }))) : (React.createElement(ProgressBar, null,
|
|
2421
2828
|
React.createElement(Progress, { "$width": (singleFile === null || singleFile === void 0 ? void 0 : singleFile.uploadUpdate) || 0, role: 'progressbar' })))));
|
|
2422
2829
|
}))),
|
|
@@ -2428,7 +2835,7 @@ var FileUpload = function (_a) {
|
|
|
2428
2835
|
React.createElement(Copy, { align: 'center', children: 'Drag & drop files here or click to choose', type: 'bold' }),
|
|
2429
2836
|
React.createElement(Copy, { align: 'center', children: "".concat(maxFileSize, " MB max file size"), color: 'GRAY' }))))));
|
|
2430
2837
|
};
|
|
2431
|
-
var templateObject_1$
|
|
2838
|
+
var templateObject_1$b, templateObject_2$a, templateObject_3$9, templateObject_4$5, templateObject_5$3, templateObject_6$1, templateObject_7$1, templateObject_8;
|
|
2432
2839
|
|
|
2433
2840
|
var formatAsPhone = function (number) {
|
|
2434
2841
|
var formatted_value = "".concat(number).replace(/[^0-9.]/g, '');
|
|
@@ -2457,9 +2864,9 @@ var formatAsSsn = function (number) {
|
|
|
2457
2864
|
return formatted_value;
|
|
2458
2865
|
};
|
|
2459
2866
|
|
|
2460
|
-
var StyledInput = styled.input(templateObject_1$
|
|
2461
|
-
var StyledSuffix = styled.div(templateObject_2$
|
|
2462
|
-
var StyledWrapper = styled.div(templateObject_3$
|
|
2867
|
+
var StyledInput = styled.input(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n background-color: ", ";\n border-radius: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 1.28em;\n color: ", ";\n position: relative;\n height: auto;\n padding: 10px;\n opacity: ", ";\n box-shadow: none;\n outline: none;\n margin: 0px;\n text-indent: 0px;\n --webkit-appearance: none;\n box-sizing: border-box;\n display: block;\n width: 100%;\n &:focus {\n border-color: ", ";\n }\n"], ["\n background-color: ", ";\n border-radius: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 1.28em;\n color: ", ";\n position: relative;\n height: auto;\n padding: 10px;\n opacity: ", ";\n box-shadow: none;\n outline: none;\n margin: 0px;\n text-indent: 0px;\n --webkit-appearance: none;\n box-sizing: border-box;\n display: block;\n width: 100%;\n &:focus {\n border-color: ", ";\n }\n"])), function (props) { return (props.$readOnly ? '#f5f5f5' : '#ffffff'); }, function (props) { return (props.$suffix ? '4px 0px 0px 4px' : '4px'); }, function (props) { return (props.$invalid && !props.$readOnly ? Colors.RED.Hex : '#cccccc'); }, FontSizes.DEFAULT, FontStyles.DEFAULT, function (props) { return (props.$invalid && !props.$readOnly ? Colors.RED.Hex : Colors.BLACK.Hex); }, function (props) { return (props.$readOnly ? 0.6 : 1); }, function (props) { return (props.$readOnly ? '#cccccc' : Colors.PRIMARY.Hex); });
|
|
2868
|
+
var StyledSuffix = styled.div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 10px;\n height: auto;\n background: #f5f5f5;\n border-width: 1px 1px 1px 0px;\n border-style: solid;\n border-color: #cccccc;\n border-radius: 0px 4px 4px 0px;\n font-family: ", ";\n font-style: normal;\n font-weight: 400;\n font-size: ", ";\n color: Colors.BLACK.Hex;\n"], ["\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 10px;\n height: auto;\n background: #f5f5f5;\n border-width: 1px 1px 1px 0px;\n border-style: solid;\n border-color: #cccccc;\n border-radius: 0px 4px 4px 0px;\n font-family: ", ";\n font-style: normal;\n font-weight: 400;\n font-size: ", ";\n color: Colors.BLACK.Hex;\n"])), FontStyles.DEFAULT, FontSizes.DEFAULT);
|
|
2869
|
+
var StyledWrapper = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
2463
2870
|
var StyledTextarea = styled.textarea(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n background-color: ", ";\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 1.6em;\n color: ", ";\n position: relative;\n height: ", ";\n padding: 10px;\n opacity: ", ";\n box-shadow: none;\n outline: none;\n padding: 10px,\n margin: 0px,\n text-indent: 0px,\n --webkit-appearance: none;\n box-sizing: border-box;\n display: block;\n width: 100%;\n &:focus {\n border-color: ", ";\n }\n"], ["\n background-color: ", ";\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 1.6em;\n color: ", ";\n position: relative;\n height: ", ";\n padding: 10px;\n opacity: ", ";\n box-shadow: none;\n outline: none;\n padding: 10px,\n margin: 0px,\n text-indent: 0px,\n --webkit-appearance: none;\n box-sizing: border-box;\n display: block;\n width: 100%;\n &:focus {\n border-color: ", ";\n }\n"])), function (props) { return (props.$readOnly ? '#f5f5f5' : '#ffffff'); }, function (props) { return (props.$invalid && !props.$readOnly ? Colors.RED.Hex : '#cccccc'); }, FontSizes.DEFAULT, FontStyles.DEFAULT, function (props) { return (props.$invalid && !props.$readOnly ? Colors.RED.Hex : Colors.BLACK.Hex); }, function (props) { return props.$height || '40px'; }, function (props) { return (props.$readOnly ? 0.6 : 1); }, function (props) { return (props.$readOnly ? '#cccccc' : Colors.PRIMARY.Hex); });
|
|
2464
2871
|
var Input$1 = function (_a) {
|
|
2465
2872
|
var format = _a.format, suffix = _a.suffix, height = _a.height, invalid = _a.invalid, max = _a.max, maxLength = _a.maxLength, min = _a.min, onBlur = _a.onBlur, onChange = _a.onChange, onKeyDown = _a.onKeyDown, placeholder = _a.placeholder, readOnly = _a.readOnly, step = _a.step, _b = _a.type, type = _b === void 0 ? 'text' : _b, _c = _a.value, value = _c === void 0 ? '' : _c, accessibleProps = __rest(_a, ["format", "suffix", "height", "invalid", "max", "maxLength", "min", "onBlur", "onChange", "onKeyDown", "placeholder", "readOnly", "step", "type", "value"]);
|
|
@@ -2476,7 +2883,7 @@ var Input$1 = function (_a) {
|
|
|
2476
2883
|
if (type === 'email') {
|
|
2477
2884
|
e.target.value = e.target.value.toLowerCase();
|
|
2478
2885
|
}
|
|
2479
|
-
if (type === 'number' && max && parseInt(e.target.value, 10) > max) {
|
|
2886
|
+
if (type === 'number' && max && parseInt(e.target.value, 10) > parseInt(max, 10)) {
|
|
2480
2887
|
e.target.value = "".concat(max);
|
|
2481
2888
|
}
|
|
2482
2889
|
if (!readOnly && onChange)
|
|
@@ -2505,7 +2912,7 @@ var Input$1 = function (_a) {
|
|
|
2505
2912
|
React.createElement(StyledInput, __assign({ "$invalid": invalid, "$readOnly": readOnly, "$suffix": suffix, max: max, maxLength: maxLength, min: min, onBlur: onBlur, onChange: handleInputChange, onKeyDown: onKeyDown, placeholder: placeholder, step: step, type: type, value: formatted_value }, accessibleProps)),
|
|
2506
2913
|
suffix && React.createElement(StyledSuffix, null, suffix)));
|
|
2507
2914
|
};
|
|
2508
|
-
var templateObject_1$
|
|
2915
|
+
var templateObject_1$a, templateObject_2$9, templateObject_3$8, templateObject_4$4;
|
|
2509
2916
|
|
|
2510
2917
|
var colorMapping = {
|
|
2511
2918
|
black: {
|
|
@@ -2549,9 +2956,9 @@ var Logo = function (_a) {
|
|
|
2549
2956
|
}
|
|
2550
2957
|
};
|
|
2551
2958
|
|
|
2552
|
-
var Wrapper$
|
|
2553
|
-
var Container$1 = styled.dialog(templateObject_2$
|
|
2554
|
-
var Header$1 = styled.div(templateObject_3$
|
|
2959
|
+
var Wrapper$7 = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 9999;\n background: rgba(0, 0, 0, 0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 9999;\n background: rgba(0, 0, 0, 0.8);\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
|
|
2960
|
+
var Container$1 = styled.dialog(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n max-width: ", ";\n width: auto;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: relative;\n padding: 0px;\n box-sizing: border-box;\n"], ["\n max-width: ", ";\n width: auto;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n outline: none;\n border: none;\n position: relative;\n padding: 0px;\n box-sizing: border-box;\n"])), function (props) { return props.$maxWidth || '90vw'; });
|
|
2961
|
+
var Header$1 = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n position: sticky;\n top: 0;\n padding: 20px;\n border-bottom: 1px solid #e5e5e5;\n display: flex;\n align-items: center;\n background: #ffffff;\n box-sizing: border-box;\n"], ["\n position: sticky;\n top: 0;\n padding: 20px;\n border-bottom: 1px solid #e5e5e5;\n display: flex;\n align-items: center;\n background: #ffffff;\n box-sizing: border-box;\n"])));
|
|
2555
2962
|
var Close = styled.div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n padding-left: 20px;\n cursor: pointer;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n padding-left: 20px;\n cursor: pointer;\n"])));
|
|
2556
2963
|
var CloseMsg = styled.span(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 1em;\n color: ", ";\n"], ["\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 1em;\n color: ", ";\n"])), FontSizes.SMALL, FontStyles.DEFAULT, Colors.MEDIUM_GRAY.Hex);
|
|
2557
2964
|
var ContentWrapper = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n overflow-x: hidden;\n overflow-y: auto;\n background: #ffffff;\n max-height: calc(100vh - 260px);\n box-sizing: border-box;\n"], ["\n overflow-x: hidden;\n overflow-y: auto;\n background: #ffffff;\n max-height: calc(100vh - 260px);\n box-sizing: border-box;\n"])));
|
|
@@ -2568,7 +2975,7 @@ var Modal = function (_a) {
|
|
|
2568
2975
|
document.onkeydown = null;
|
|
2569
2976
|
};
|
|
2570
2977
|
}, []);
|
|
2571
|
-
return (React.createElement(Wrapper$
|
|
2978
|
+
return (React.createElement(Wrapper$7, null,
|
|
2572
2979
|
React.createElement(Container$1, __assign({ "$maxWidth": maxWidth, open: true }, accessibleProps),
|
|
2573
2980
|
React.createElement(Header$1, null,
|
|
2574
2981
|
title ? React.createElement(Heading, { type: 'secondary' }, title) : null,
|
|
@@ -2587,23 +2994,23 @@ var Modal = function (_a) {
|
|
|
2587
2994
|
secondaryButton ? React.createElement(Button, __assign({}, secondaryButton, { format: 'secondary' })) : null,
|
|
2588
2995
|
primaryButton ? (React.createElement(Button, __assign({}, primaryButton, { format: 'primary', margin: '0px 0px 0px 10px' }))) : null)) : null)) : null)));
|
|
2589
2996
|
};
|
|
2590
|
-
var templateObject_1$
|
|
2997
|
+
var templateObject_1$9, templateObject_2$8, templateObject_3$7, templateObject_4$3, templateObject_5$2, templateObject_6, templateObject_7;
|
|
2591
2998
|
|
|
2592
|
-
var Wrapper$
|
|
2593
|
-
var MenuItem = styled.div(templateObject_2$
|
|
2594
|
-
var Title = styled.span(templateObject_3$
|
|
2999
|
+
var Wrapper$6 = styled.div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n background: #fff;\n border-radius: 8px;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n display: flex;\n flex-direction: column;\n gap: 4px;\n max-height: ", ";\n padding: 10px;\n width: 200px;\n"], ["\n background: #fff;\n border-radius: 8px;\n box-shadow: 0px 10px 30px -15px rgba(0, 0, 0, 0.2);\n display: flex;\n flex-direction: column;\n gap: 4px;\n max-height: ", ";\n padding: 10px;\n width: 200px;\n"])), function (props) { return props.$maxHeight || '312px'; });
|
|
3000
|
+
var MenuItem = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n align-items: center;\n border-radius: 8px;\n border: 1px solid transparent;\n display: flex;\n gap: 8px;\n height: 38px;\n padding: 8px;\n &:hover {\n background: rgba(1, 147, 215, 0.1);\n cursor: pointer;\n }\n"], ["\n align-items: center;\n border-radius: 8px;\n border: 1px solid transparent;\n display: flex;\n gap: 8px;\n height: 38px;\n padding: 8px;\n &:hover {\n background: rgba(1, 147, 215, 0.1);\n cursor: pointer;\n }\n"])));
|
|
3001
|
+
var Title = styled.span(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n font-family: Roboto;\n font-size: 14px;\n font-weight: 400;\n height: auto;\n letter-spacing: 0px;\n line-height: 22px;\n text-align: left;\n"], ["\n font-family: Roboto;\n font-size: 14px;\n font-weight: 400;\n height: auto;\n letter-spacing: 0px;\n line-height: 22px;\n text-align: left;\n"])));
|
|
2595
3002
|
var MoreMenu = function (_a) {
|
|
2596
3003
|
var maxHeight = _a.maxHeight, _b = _a.menuItems, menuItems = _b === void 0 ? [] : _b, accessibleProps = __rest(_a, ["maxHeight", "menuItems"]);
|
|
2597
|
-
return (React.createElement(Wrapper$
|
|
3004
|
+
return (React.createElement(Wrapper$6, __assign({ "$maxHeight": maxHeight }, accessibleProps), menuItems.map(function (item) {
|
|
2598
3005
|
return (React.createElement(MenuItem, __assign({ onClick: item.onClick }, accessibleProps),
|
|
2599
3006
|
item.icon ? (React.createElement(Icon, { color: Colors.MEDIUM_GRAY.Hex, path: item.icon, size: '20px' })) : null,
|
|
2600
3007
|
React.createElement(Title, null, item.label)));
|
|
2601
3008
|
})));
|
|
2602
3009
|
};
|
|
2603
|
-
var templateObject_1$
|
|
3010
|
+
var templateObject_1$8, templateObject_2$7, templateObject_3$6;
|
|
2604
3011
|
|
|
2605
|
-
var Wrapper$
|
|
2606
|
-
var Trigger
|
|
3012
|
+
var Wrapper$5 = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
3013
|
+
var Trigger = styled.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: ", ";\n height: 40px;\n padding: 0 10px;\n position: relative;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n background-image: none;\n display: flex;\n align-items: center;\n justify-content: space-between;\n z-index: 1;\n"], ["\n box-sizing: border-box;\n border-radius: ", ";\n height: 40px;\n padding: 0 10px;\n position: relative;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n background-image: none;\n display: flex;\n align-items: center;\n justify-content: space-between;\n z-index: 1;\n"])), function (props) { return (props.$showOptions ? '4px 4px 0px 0px' : '4px'); }, function (props) {
|
|
2607
3014
|
if (props.$invalid) {
|
|
2608
3015
|
return Colors.RED.Hex;
|
|
2609
3016
|
}
|
|
@@ -2614,15 +3021,15 @@ var Trigger$1 = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTem
|
|
|
2614
3021
|
return '#cccccc';
|
|
2615
3022
|
}
|
|
2616
3023
|
}, function (props) { return (props.$readOnly ? '#f5f5f5' : '#ffffff'); });
|
|
2617
|
-
var Value = styled.div(templateObject_3$
|
|
3024
|
+
var Value = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n line-height: 2.9em;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n"], ["\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n line-height: 2.9em;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n"])), Colors.BLACK.Hex, FontStyles.DEFAULT, FontSizes.DEFAULT);
|
|
2618
3025
|
var Options = styled.div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n background: #fff;\n border-color: ", ";\n border-radius: 0px 0px 4px 4px;\n border-style: solid;\n border-top: none;\n border-width: 1px;\n left: 0;\n position: absolute;\n right: 0;\n z-index: 2;\n"], ["\n background: #fff;\n border-color: ", ";\n border-radius: 0px 0px 4px 4px;\n border-style: solid;\n border-top: none;\n border-width: 1px;\n left: 0;\n position: absolute;\n right: 0;\n z-index: 2;\n"])), Colors.PRIMARY.Hex);
|
|
2619
3026
|
var Scrim = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n bottom: 0;\n left: 0;\n position: fixed;\n right: 0;\n top: 0;\n z-index: 1;\n"], ["\n bottom: 0;\n left: 0;\n position: fixed;\n right: 0;\n top: 0;\n z-index: 1;\n"])));
|
|
2620
3027
|
var MultiSelect = function (_a) {
|
|
2621
3028
|
var readOnly = _a.readOnly, _b = _a.displayCount, displayCount = _b === void 0 ? 3 : _b, invalid = _a.invalid, onChange = _a.onChange, _c = _a.options, options = _c === void 0 ? [] : _c, selected = _a.selected, showSelectAll = _a.showSelectAll, accessibleProps = __rest(_a, ["readOnly", "displayCount", "invalid", "onChange", "options", "selected", "showSelectAll"]);
|
|
2622
3029
|
var _d = React.useState(false), showOptions = _d[0], setShowOptions = _d[1];
|
|
2623
3030
|
var selected_options = options.filter(function (o) { return selected.includes(o.value); });
|
|
2624
|
-
return (React.createElement(Wrapper$
|
|
2625
|
-
React.createElement(Trigger
|
|
3031
|
+
return (React.createElement(Wrapper$5, null,
|
|
3032
|
+
React.createElement(Trigger, __assign({ "$invalid": invalid, "$readOnly": readOnly, "$showOptions": showOptions, onClick: readOnly ? undefined : setShowOptions.bind(null, !showOptions) }, accessibleProps),
|
|
2626
3033
|
React.createElement(Value, null, selected.length > 0 && selected.length <= displayCount
|
|
2627
3034
|
? selected_options.map(function (o) { return o.label || o.value; }).join(', ')
|
|
2628
3035
|
: "".concat(selected.length, " Selected")),
|
|
@@ -2631,36 +3038,7 @@ var MultiSelect = function (_a) {
|
|
|
2631
3038
|
React.createElement(Checklist, { disabled: readOnly, onChange: onChange, options: options, selected: selected, showSelectAll: showSelectAll }))) : null,
|
|
2632
3039
|
showOptions ? React.createElement(Scrim, { onClick: setShowOptions.bind(null, !showOptions) }) : null));
|
|
2633
3040
|
};
|
|
2634
|
-
var templateObject_1$
|
|
2635
|
-
|
|
2636
|
-
var Wrapper$5 = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n border-radius: 4px;\n height: 40px;\n background-color: ", ";\n position: relative;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: ", ";\n flex-grow: ", ";\n box-sizing: border-box;\n padding: 10px 0px;\n display: flex;\n align-items: center;\n"], ["\n border-radius: 4px;\n height: 40px;\n background-color: ", ";\n position: relative;\n cursor: pointer;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: ", ";\n flex-grow: ", ";\n box-sizing: border-box;\n padding: 10px 0px;\n display: flex;\n align-items: center;\n"])), function (props) { return (props.$readOnly ? '#f5f5f5' : '#ffffff'); }, function (props) { return (props.$invalid ? Colors.RED.Hex : '#cccccc'); }, function (_a) {
|
|
2637
|
-
var $style = _a.$style;
|
|
2638
|
-
return ($style === null || $style === void 0 ? void 0 : $style.borderRadius) || '4px';
|
|
2639
|
-
}, function (_a) {
|
|
2640
|
-
var $style = _a.$style;
|
|
2641
|
-
return ($style === null || $style === void 0 ? void 0 : $style.flexGrow) || 0;
|
|
2642
|
-
});
|
|
2643
|
-
var Trigger = styled.select(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n appearance: none;\n box-shadow: none;\n outline: none;\n border: none;\n color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 2.9em;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n width: 100%;\n box-sizing: border-box;\n padding: 0px 30px 0px 10px;\n box-sizing: border-box;\n position: relative;\n z-index: 2;\n"], ["\n appearance: none;\n box-shadow: none;\n outline: none;\n border: none;\n color: ", ";\n font-size: ", ";\n font-weight: 400;\n font-family: ", ";\n line-height: 2.9em;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n width: 100%;\n box-sizing: border-box;\n padding: 0px 30px 0px 10px;\n box-sizing: border-box;\n position: relative;\n z-index: 2;\n"])), Colors.BLACK.Hex, FontSizes.DEFAULT, FontStyles.DEFAULT);
|
|
2644
|
-
var IconWrapper$1 = styled.span(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n position: absolute;\n right: 4px;\n height: 22px;\n z-index: 1;\n"], ["\n position: absolute;\n right: 4px;\n height: 22px;\n z-index: 1;\n"])));
|
|
2645
|
-
var Select = function (_a) {
|
|
2646
|
-
var options = _a.options, optionGroups = _a.optionGroups, placeholder = _a.placeholder, readOnly = _a.readOnly, invalid = _a.invalid, value = _a.value, onChange = _a.onChange, style = _a.style, accessibleProps = __rest(_a, ["options", "optionGroups", "placeholder", "readOnly", "invalid", "value", "onChange", "style"]);
|
|
2647
|
-
return (React.createElement(Wrapper$5, { "$invalid": invalid, "$readOnly": readOnly, "$style": style },
|
|
2648
|
-
React.createElement(Trigger, __assign({ disabled: readOnly, onChange: onChange, placeholder: placeholder, value: value }, accessibleProps),
|
|
2649
|
-
placeholder ? (React.createElement("option", { disabled: true, value: '' }, placeholder)) : null,
|
|
2650
|
-
optionGroups &&
|
|
2651
|
-
optionGroups.map(function (group, i) {
|
|
2652
|
-
return (React.createElement("optgroup", { key: i, label: group.label || "Group ".concat(i) }, group.options.map(function (option, i) {
|
|
2653
|
-
return (React.createElement("option", { key: i, value: option.value }, option.label || option.value));
|
|
2654
|
-
})));
|
|
2655
|
-
}),
|
|
2656
|
-
options &&
|
|
2657
|
-
options.map(function (option, i) {
|
|
2658
|
-
return (React.createElement("option", { key: i, value: option.value }, option.label || option.value));
|
|
2659
|
-
})),
|
|
2660
|
-
React.createElement(IconWrapper$1, null,
|
|
2661
|
-
React.createElement(Icon, { color: Colors.BLACK.Hex, path: js.mdiChevronDown, size: '22px' }))));
|
|
2662
|
-
};
|
|
2663
|
-
var templateObject_1$7, templateObject_2$6, templateObject_3$5;
|
|
3041
|
+
var templateObject_1$7, templateObject_2$6, templateObject_3$5, templateObject_4$2, templateObject_5$1;
|
|
2664
3042
|
|
|
2665
3043
|
var Wrapper$4 = styled.nav(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n column-gap: 10px;\n"], ["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n column-gap: 10px;\n"])));
|
|
2666
3044
|
var Pagination = function (_a) {
|
|
@@ -2742,9 +3120,9 @@ var Tab = styled.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateO
|
|
|
2742
3120
|
var Badge = styled.div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n display: flex;\n width: 18px;\n height: 18px;\n justify-content: center;\n align-items: center;\n border-radius: 9px;\n background: ", ";\n color: #fff;\n font-family: ", ";\n font-size: 12px;\n font-weight: 500;\n line-height: 1;\n letter-spacing: 1px;\n"], ["\n display: flex;\n width: 18px;\n height: 18px;\n justify-content: center;\n align-items: center;\n border-radius: 9px;\n background: ", ";\n color: #fff;\n font-family: ", ";\n font-size: 12px;\n font-weight: 500;\n line-height: 1;\n letter-spacing: 1px;\n"])), function (props) { return (props.$isError ? Colors.RED.Hex : Colors.PRIMARY.Hex); }, FontStyles.DEFAULT);
|
|
2743
3121
|
var Tabs = function (_a) {
|
|
2744
3122
|
var tabs = _a.tabs, accessibleProps = __rest(_a, ["tabs"]);
|
|
2745
|
-
return (React.createElement(Wrapper$2, __assign({}, accessibleProps), tabs.map(function (_a) {
|
|
3123
|
+
return (React.createElement(Wrapper$2, __assign({}, accessibleProps), tabs.map(function (_a, i) {
|
|
2746
3124
|
var isActive = _a.isActive, label = _a.label, badgeCount = _a.badgeCount, errorBadge = _a.errorBadge, onClick = _a.onClick, accessibleProps = __rest(_a, ["isActive", "label", "badgeCount", "errorBadge", "onClick"]);
|
|
2747
|
-
return (React.createElement(Tab, __assign({ "$isActive": isActive || false, onClick: isActive ? undefined : onClick }, accessibleProps),
|
|
3125
|
+
return (React.createElement(Tab, __assign({ "$isActive": isActive || false, key: i, onClick: isActive ? undefined : onClick }, accessibleProps),
|
|
2748
3126
|
badgeCount ? React.createElement(Badge, { "$isError": errorBadge || false }, badgeCount) : null,
|
|
2749
3127
|
label));
|
|
2750
3128
|
})));
|
|
@@ -2801,6 +3179,7 @@ exports.Button = Button;
|
|
|
2801
3179
|
exports.Checkbox = Checkbox;
|
|
2802
3180
|
exports.Checklist = Checklist;
|
|
2803
3181
|
exports.Copy = Copy;
|
|
3182
|
+
exports.DatePicker = DatePicker;
|
|
2804
3183
|
exports.Drawer = Drawer;
|
|
2805
3184
|
exports.Field = Field;
|
|
2806
3185
|
exports.FileUpload = FileUpload;
|