@hexure/ui 1.3.3 → 1.3.5
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 +213 -61
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/Field/Field.d.ts +1 -1
- package/dist/cjs/types/components/FileUpload/FileUpload.d.ts +23 -0
- package/dist/cjs/types/components/FileUpload/index.d.ts +1 -0
- package/dist/cjs/types/index.d.ts +2 -0
- package/dist/esm/index.js +213 -63
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/Field/Field.d.ts +1 -1
- package/dist/esm/types/components/FileUpload/FileUpload.d.ts +23 -0
- package/dist/esm/types/components/FileUpload/index.d.ts +1 -0
- package/dist/esm/types/index.d.ts +2 -0
- package/dist/index.d.ts +29 -2
- package/package.json +90 -90
- package/dist/cjs/types/components/Accordion/Accordion.stories.d.ts +0 -5
- package/dist/cjs/types/components/ActionDialog/ActionDialog.stories.d.ts +0 -5
- package/dist/cjs/types/components/ActionDialog/ActionDialog.test.d.ts +0 -1
- package/dist/cjs/types/components/Alert/Alert.stories.d.ts +0 -5
- package/dist/cjs/types/components/BulkActionBar/BulkActionBar.stories.d.ts +0 -5
- package/dist/cjs/types/components/Button/Button.stories.d.ts +0 -5
- package/dist/cjs/types/components/Checkbox/Checkbox.stories.d.ts +0 -5
- package/dist/cjs/types/components/Checklist/Checklist.stories.d.ts +0 -5
- package/dist/cjs/types/components/Copy/Copy.stories.d.ts +0 -5
- package/dist/cjs/types/components/DatePicker/DatePicker.stories.d.ts +0 -5
- package/dist/cjs/types/components/Drawer/Drawer.stories.d.ts +0 -5
- package/dist/cjs/types/components/Field/Field.stories.d.ts +0 -5
- package/dist/cjs/types/components/Heading/Heading.stories.d.ts +0 -5
- package/dist/cjs/types/components/Input/Input.stories.d.ts +0 -5
- package/dist/cjs/types/components/Logo/Logo.stories.d.ts +0 -5
- package/dist/cjs/types/components/Modal/Modal.stories.d.ts +0 -5
- package/dist/cjs/types/components/MoreMenu/MoreMenu.stories.d.ts +0 -5
- package/dist/cjs/types/components/Multiselect/MultiSelect.stories.d.ts +0 -5
- package/dist/cjs/types/components/Pagination/Pagination.stories.d.ts +0 -5
- package/dist/cjs/types/components/Radio/Radio.stories.d.ts +0 -5
- package/dist/cjs/types/components/RadioList/RadioList.stories.d.ts +0 -5
- package/dist/cjs/types/components/Select/Select.stories.d.ts +0 -5
- package/dist/cjs/types/components/Table/Table.stories.d.ts +0 -5
- package/dist/cjs/types/components/Tabs/Tabs.stories.d.ts +0 -5
- package/dist/cjs/types/components/Tag/Tag.stories.d.ts +0 -5
- package/dist/cjs/types/components/Toggle/Toggle.stories.d.ts +0 -5
- package/dist/cjs/types/components/ZeroState/ZeroState.stories.d.ts +0 -5
- package/dist/esm/types/components/Accordion/Accordion.stories.d.ts +0 -5
- package/dist/esm/types/components/ActionDialog/ActionDialog.stories.d.ts +0 -5
- package/dist/esm/types/components/ActionDialog/ActionDialog.test.d.ts +0 -1
- package/dist/esm/types/components/Alert/Alert.stories.d.ts +0 -5
- package/dist/esm/types/components/BulkActionBar/BulkActionBar.stories.d.ts +0 -5
- package/dist/esm/types/components/Button/Button.stories.d.ts +0 -5
- package/dist/esm/types/components/Checkbox/Checkbox.stories.d.ts +0 -5
- package/dist/esm/types/components/Checklist/Checklist.stories.d.ts +0 -5
- package/dist/esm/types/components/Copy/Copy.stories.d.ts +0 -5
- package/dist/esm/types/components/DatePicker/DatePicker.stories.d.ts +0 -5
- package/dist/esm/types/components/Drawer/Drawer.stories.d.ts +0 -5
- package/dist/esm/types/components/Field/Field.stories.d.ts +0 -5
- package/dist/esm/types/components/Heading/Heading.stories.d.ts +0 -5
- package/dist/esm/types/components/Input/Input.stories.d.ts +0 -5
- package/dist/esm/types/components/Logo/Logo.stories.d.ts +0 -5
- package/dist/esm/types/components/Modal/Modal.stories.d.ts +0 -5
- package/dist/esm/types/components/MoreMenu/MoreMenu.stories.d.ts +0 -5
- package/dist/esm/types/components/Multiselect/MultiSelect.stories.d.ts +0 -5
- package/dist/esm/types/components/Pagination/Pagination.stories.d.ts +0 -5
- package/dist/esm/types/components/Radio/Radio.stories.d.ts +0 -5
- package/dist/esm/types/components/RadioList/RadioList.stories.d.ts +0 -5
- package/dist/esm/types/components/Select/Select.stories.d.ts +0 -5
- package/dist/esm/types/components/Table/Table.stories.d.ts +0 -5
- package/dist/esm/types/components/Tabs/Tabs.stories.d.ts +0 -5
- package/dist/esm/types/components/Tag/Tag.stories.d.ts +0 -5
- package/dist/esm/types/components/Toggle/Toggle.stories.d.ts +0 -5
- package/dist/esm/types/components/ZeroState/ZeroState.stories.d.ts +0 -5
- /package/dist/cjs/types/components/{Multiselect → MultiSelect}/MultiSelect.d.ts +0 -0
- /package/dist/cjs/types/components/{Multiselect → MultiSelect}/index.d.ts +0 -0
- /package/dist/esm/types/components/{Multiselect → MultiSelect}/MultiSelect.d.ts +0 -0
- /package/dist/esm/types/components/{Multiselect → MultiSelect}/index.d.ts +0 -0
|
@@ -6,8 +6,8 @@ interface ActionProps {
|
|
|
6
6
|
}
|
|
7
7
|
export interface FieldProps extends AccessibleProps {
|
|
8
8
|
action?: ActionProps;
|
|
9
|
-
margin?: string;
|
|
10
9
|
required?: boolean;
|
|
10
|
+
style?: object;
|
|
11
11
|
/** Tie the field label to the nested input. This should match the name defined on the input */
|
|
12
12
|
htmlFor?: string;
|
|
13
13
|
/** It is used to pass child nodes, string values and number as child components. */
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { AccessibleProps } from '../../utils/Accessibility';
|
|
3
|
+
export interface FileUploadProps extends AccessibleProps {
|
|
4
|
+
/** It is used to get the array of files. */
|
|
5
|
+
onChange: (e: any) => void;
|
|
6
|
+
/** It is used to get the delete file. */
|
|
7
|
+
onFileDelete: (e: any) => void;
|
|
8
|
+
/** It is used to get max file size in MBs. */
|
|
9
|
+
maxFileSize: number;
|
|
10
|
+
/** It is used to whether the progress bar should be shown or not. */
|
|
11
|
+
progress: boolean;
|
|
12
|
+
/** It is used to set the upload progress value from 0 to 100. */
|
|
13
|
+
UploadProgress?: {
|
|
14
|
+
index: number;
|
|
15
|
+
progress: number;
|
|
16
|
+
};
|
|
17
|
+
/** It is used to set the value of multile file upload in boolean. */
|
|
18
|
+
multiple: boolean;
|
|
19
|
+
/** It is used to set the value of acceptable files. Example ".jpg, .jpeg, .pdf"*/
|
|
20
|
+
acceptFiles: string;
|
|
21
|
+
}
|
|
22
|
+
declare const FileUpload: FC<FileUploadProps>;
|
|
23
|
+
export default FileUpload;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './FileUpload';
|
|
@@ -8,8 +8,10 @@ export { default as Checklist } from './components/Checklist';
|
|
|
8
8
|
export { default as Copy } from './components/Copy';
|
|
9
9
|
export { default as Drawer } from './components/Drawer';
|
|
10
10
|
export { default as Field } from './components/Field';
|
|
11
|
+
export { default as FileUpload } from './components/FileUpload';
|
|
11
12
|
export { default as Heading } from './components/Heading';
|
|
12
13
|
export { default as Input } from './components/Input';
|
|
14
|
+
export { default as Logo } from './components/Logo';
|
|
13
15
|
export { default as Modal } from './components/Modal';
|
|
14
16
|
export { default as MoreMenu } from './components/MoreMenu';
|
|
15
17
|
export { default as MultiSelect } from './components/MultiSelect';
|
package/dist/esm/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useRef, useDebugValue, useContext, createElement, useEffect, useState } from 'react';
|
|
2
2
|
import Icon from '@mdi/react';
|
|
3
|
-
import { mdiChevronUp, mdiChevronDown, mdiInformationOutline, mdiAlertOctagonOutline, mdiAlertOutline, mdiCheckboxMarkedCircleOutline, mdiClose, mdiChevronLeft, mdiChevronRight, mdiCheck } from '@mdi/js';
|
|
3
|
+
import { mdiChevronUp, mdiChevronDown, mdiInformationOutline, mdiAlertOctagonOutline, mdiAlertOutline, mdiCheckboxMarkedCircleOutline, mdiClose, mdiMinusCircle, mdiFolderPlusOutline, mdiChevronLeft, mdiChevronRight, mdiCheck } from '@mdi/js';
|
|
4
4
|
import Numeral from 'numeral';
|
|
5
5
|
import 'moment';
|
|
6
6
|
|
|
@@ -38,6 +38,15 @@ function __rest(s, e) {
|
|
|
38
38
|
}
|
|
39
39
|
return t;
|
|
40
40
|
}
|
|
41
|
+
function __spreadArray(to, from, pack) {
|
|
42
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
43
|
+
if (ar || !(i in from)) {
|
|
44
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
45
|
+
ar[i] = from[i];
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
49
|
+
}
|
|
41
50
|
function __makeTemplateObject(cooked, raw) {
|
|
42
51
|
if (Object.defineProperty) {
|
|
43
52
|
Object.defineProperty(cooked, "raw", {
|
|
@@ -2023,8 +2032,8 @@ var FontSizes = {
|
|
|
2023
2032
|
SMALL: '13px',
|
|
2024
2033
|
};
|
|
2025
2034
|
|
|
2026
|
-
var Header$3 = styled.div(templateObject_1$
|
|
2027
|
-
var Title$1 = styled.div(templateObject_2$
|
|
2035
|
+
var Header$3 = styled.div(templateObject_1$n || (templateObject_1$n = __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"])));
|
|
2036
|
+
var Title$1 = styled.div(templateObject_2$l || (templateObject_2$l = __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);
|
|
2028
2037
|
var Accordion = function (_a) {
|
|
2029
2038
|
var title = _a.title, children = _a.children, open = _a.open, onClick = _a.onClick, accessibleProps = __rest(_a, ["title", "children", "open", "onClick"]);
|
|
2030
2039
|
return (React.createElement(React.Fragment, null,
|
|
@@ -2033,7 +2042,7 @@ var Accordion = function (_a) {
|
|
|
2033
2042
|
React.createElement(Icon, { color: Colors.BLACK.Hex, path: open ? mdiChevronUp : mdiChevronDown, size: '24px' })),
|
|
2034
2043
|
open ? children : null));
|
|
2035
2044
|
};
|
|
2036
|
-
var templateObject_1$
|
|
2045
|
+
var templateObject_1$n, templateObject_2$l;
|
|
2037
2046
|
|
|
2038
2047
|
var button_type_mapping = {
|
|
2039
2048
|
primary: {
|
|
@@ -2058,7 +2067,7 @@ var button_type_mapping = {
|
|
|
2058
2067
|
badge_content_color: Colors.RED.Hex,
|
|
2059
2068
|
},
|
|
2060
2069
|
};
|
|
2061
|
-
var StyledButton = styled.button(templateObject_1$
|
|
2070
|
+
var StyledButton = styled.button(templateObject_1$m || (templateObject_1$m = __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) {
|
|
2062
2071
|
if (props.$hasChildren) {
|
|
2063
2072
|
if (props.$small) {
|
|
2064
2073
|
return '0 10px';
|
|
@@ -2081,9 +2090,9 @@ var StyledButton = styled.button(templateObject_1$l || (templateObject_1$l = __m
|
|
|
2081
2090
|
}, function (props) { return (props.$disabled ? 'default' : 'pointer'); }, function (props) { return (props.$disabled ? 0.6 : 0.9); }, function (props) {
|
|
2082
2091
|
return props.$format ? button_type_mapping[props.$format].border_color : Colors.PRIMARY.Hex;
|
|
2083
2092
|
}, function (props) { return (props.$disabled ? 0.6 : 1); });
|
|
2084
|
-
var Label$4 = styled.span(templateObject_2$
|
|
2085
|
-
var StyledIcon$
|
|
2086
|
-
var Badge = styled.span(templateObject_4$
|
|
2093
|
+
var Label$4 = styled.span(templateObject_2$k || (templateObject_2$k = __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'); });
|
|
2094
|
+
var StyledIcon$2 = styled.span(templateObject_3$h || (templateObject_3$h = __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'); });
|
|
2095
|
+
var Badge = 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) {
|
|
2087
2096
|
return props.$format ? button_type_mapping[props.$format].badge_bg_color : '#fff';
|
|
2088
2097
|
}, function (props) {
|
|
2089
2098
|
return props.$format ? button_type_mapping[props.$format].badge_content_color : Colors.PRIMARY.Hex;
|
|
@@ -2093,13 +2102,13 @@ var Button = function (_a) {
|
|
|
2093
2102
|
var has_children = children && children.length > 0;
|
|
2094
2103
|
return (React.createElement(StyledButton, __assign({ "$disabled": disabled, "$format": format, "$hasChildren": !!has_children, "$margin": margin, "$small": small, onClick: disabled ? undefined : onClick, type: isForm ? 'submit' : undefined }, accessibleProps),
|
|
2095
2104
|
children ? (React.createElement(Label$4, { "$format": format, "$small": small }, children)) : null,
|
|
2096
|
-
icon && !badge ? (React.createElement(StyledIcon$
|
|
2105
|
+
icon && !badge ? (React.createElement(StyledIcon$2, { "$hasChildren": !!has_children },
|
|
2097
2106
|
React.createElement(Icon, { color: format ? button_type_mapping[format].content_color : '#fff', path: icon, size: small ? '20px' : '24px' }))) : null,
|
|
2098
2107
|
badge && !icon ? (React.createElement(Badge, { "$format": format, "$small": small }, badge)) : null));
|
|
2099
2108
|
};
|
|
2100
|
-
var templateObject_1$
|
|
2109
|
+
var templateObject_1$m, templateObject_2$k, templateObject_3$h, templateObject_4$9;
|
|
2101
2110
|
|
|
2102
|
-
var StyledComponent = styled.p(templateObject_1$
|
|
2111
|
+
var StyledComponent = styled.p(templateObject_1$l || (templateObject_1$l = __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].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) {
|
|
2103
2112
|
return ['underline', 'line-through'].includes(props.$type) ? props.$type : 'none';
|
|
2104
2113
|
}, function (props) { return props.$margin || '0px'; }, function (props) { return props.$padding || '0px'; }, function (props) { return props.$align || 'left'; });
|
|
2105
2114
|
var Copy = function (_a) {
|
|
@@ -2109,11 +2118,11 @@ var Copy = function (_a) {
|
|
|
2109
2118
|
Copy.defaultProps = {
|
|
2110
2119
|
type: 'default',
|
|
2111
2120
|
};
|
|
2112
|
-
var templateObject_1$
|
|
2121
|
+
var templateObject_1$l;
|
|
2113
2122
|
|
|
2114
|
-
var H1 = styled.h1(templateObject_1$
|
|
2115
|
-
var H2 = styled.h2(templateObject_2$
|
|
2116
|
-
var H3 = styled.h3(templateObject_3$
|
|
2123
|
+
var H1 = styled.h1(templateObject_1$k || (templateObject_1$k = __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'; });
|
|
2124
|
+
var H2 = styled.h2(templateObject_2$j || (templateObject_2$j = __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'; });
|
|
2125
|
+
var H3 = styled.h3(templateObject_3$g || (templateObject_3$g = __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'; });
|
|
2117
2126
|
var Heading = function (_a) {
|
|
2118
2127
|
var bold = _a.bold, children = _a.children, margin = _a.margin, padding = _a.padding, type = _a.type, accessibleProps = __rest(_a, ["bold", "children", "margin", "padding", "type"]);
|
|
2119
2128
|
switch (type) {
|
|
@@ -2132,11 +2141,11 @@ Heading.defaultProps = {
|
|
|
2132
2141
|
bold: false,
|
|
2133
2142
|
type: 'primary',
|
|
2134
2143
|
};
|
|
2135
|
-
var templateObject_1$
|
|
2144
|
+
var templateObject_1$k, templateObject_2$j, templateObject_3$g;
|
|
2136
2145
|
|
|
2137
|
-
var Wrapper$
|
|
2138
|
-
var Container$3 = styled.dialog(templateObject_2$
|
|
2139
|
-
var Buttons = styled.div(templateObject_3$
|
|
2146
|
+
var Wrapper$e = styled.div(templateObject_1$j || (templateObject_1$j = __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"])));
|
|
2147
|
+
var Container$3 = styled.dialog(templateObject_2$i || (templateObject_2$i = __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"])));
|
|
2148
|
+
var Buttons = styled.div(templateObject_3$f || (templateObject_3$f = __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"])));
|
|
2140
2149
|
var ActionDialog = function (_a) {
|
|
2141
2150
|
var description = _a.description, title = _a.title, onClose = _a.onClose, primaryButton = _a.primaryButton, secondaryButton = _a.secondaryButton, accessibleProps = __rest(_a, ["description", "title", "onClose", "primaryButton", "secondaryButton"]);
|
|
2142
2151
|
useEffect(function () {
|
|
@@ -2149,7 +2158,7 @@ var ActionDialog = function (_a) {
|
|
|
2149
2158
|
document.onkeydown = null;
|
|
2150
2159
|
};
|
|
2151
2160
|
}, []);
|
|
2152
|
-
return (React.createElement(Wrapper$
|
|
2161
|
+
return (React.createElement(Wrapper$e, __assign({}, accessibleProps),
|
|
2153
2162
|
React.createElement(Container$3, { open: true },
|
|
2154
2163
|
title ? (React.createElement(Heading, { margin: '0px 0px 20px 0px', type: 'secondary' }, title)) : null,
|
|
2155
2164
|
description ? React.createElement(Copy, { align: 'center' }, description) : null,
|
|
@@ -2157,11 +2166,11 @@ var ActionDialog = function (_a) {
|
|
|
2157
2166
|
secondaryButton ? (React.createElement(Button, __assign({}, secondaryButton, { format: 'secondary', margin: '0px 5px' }))) : null,
|
|
2158
2167
|
primaryButton ? React.createElement(Button, __assign({}, primaryButton, { format: 'primary', margin: '0px 5px' })) : null)) : null)));
|
|
2159
2168
|
};
|
|
2160
|
-
var templateObject_1$
|
|
2169
|
+
var templateObject_1$j, templateObject_2$i, templateObject_3$f;
|
|
2161
2170
|
|
|
2162
|
-
var Wrapper$
|
|
2163
|
-
var Content$1 = styled.div(templateObject_2$
|
|
2164
|
-
var Action$1 = styled.div(templateObject_3$
|
|
2171
|
+
var Wrapper$d = styled.div(templateObject_1$i || (templateObject_1$i = __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"])));
|
|
2172
|
+
var Content$1 = styled.div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n margin-left: 20px;\n"], ["\n margin-left: 20px;\n"])));
|
|
2173
|
+
var Action$1 = styled.div(templateObject_3$e || (templateObject_3$e = __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);
|
|
2165
2174
|
var Alert = function (_a) {
|
|
2166
2175
|
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"]);
|
|
2167
2176
|
var type_mapping = {
|
|
@@ -2182,7 +2191,7 @@ var Alert = function (_a) {
|
|
|
2182
2191
|
icon: mdiCheckboxMarkedCircleOutline,
|
|
2183
2192
|
},
|
|
2184
2193
|
};
|
|
2185
|
-
return (React.createElement(Wrapper$
|
|
2194
|
+
return (React.createElement(Wrapper$d, __assign({}, accessibleProps, { style: { borderLeftColor: type_mapping[type].color } }),
|
|
2186
2195
|
React.createElement("div", { style: { flexShrink: 0 } },
|
|
2187
2196
|
React.createElement(Icon, { color: type_mapping[type].color, path: type_mapping[type].icon, size: '30px' })),
|
|
2188
2197
|
React.createElement(Content$1, null,
|
|
@@ -2190,19 +2199,19 @@ var Alert = function (_a) {
|
|
|
2190
2199
|
description ? React.createElement(Copy, { margin: '6px 0 0 0 !important' }, description) : null,
|
|
2191
2200
|
action ? React.createElement(Action$1, { onClick: action.onClick }, action.label) : null)));
|
|
2192
2201
|
};
|
|
2193
|
-
var templateObject_1$
|
|
2194
|
-
|
|
2195
|
-
var Wrapper$
|
|
2196
|
-
var Left = styled.div(templateObject_2$
|
|
2197
|
-
var Info = styled.div(templateObject_3$
|
|
2198
|
-
var Selected = styled.span(templateObject_4$
|
|
2199
|
-
var Clear = styled.span(templateObject_5$
|
|
2200
|
-
var Actions = styled.div(templateObject_6$
|
|
2202
|
+
var templateObject_1$i, templateObject_2$h, templateObject_3$e;
|
|
2203
|
+
|
|
2204
|
+
var Wrapper$c = styled.div(templateObject_1$h || (templateObject_1$h = __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);
|
|
2205
|
+
var Left = styled.div(templateObject_2$g || (templateObject_2$g = __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"])));
|
|
2206
|
+
var Info = styled.div(templateObject_3$d || (templateObject_3$d = __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"])));
|
|
2207
|
+
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);
|
|
2208
|
+
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);
|
|
2209
|
+
var Actions = styled.div(templateObject_6$4 || (templateObject_6$4 = __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"])));
|
|
2201
2210
|
var Error$1 = styled.div(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n background: rgba(", ", 0.1);\n border-radius: 4px;\n padding: 6px 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n margin-left: 30px;\n"], ["\n box-sizing: border-box;\n display: flex;\n align-items: center;\n background: rgba(", ", 0.1);\n border-radius: 4px;\n padding: 6px 8px;\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n margin-left: 30px;\n"])), Colors.RED.Rgb);
|
|
2202
|
-
var ErrorMsg = styled.span(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n font-family: ", ";\n line-height: 1em;\n color: ", ";\n margin-left: 8px;\n"], ["\n font-size: 14px;\n font-weight: 500;\n font-family: ", ";\n line-height: 1em;\n color: ", ";\n margin-left: 8px;\n"])), FontStyles.DEFAULT, Colors.RED.Hex);
|
|
2211
|
+
var ErrorMsg = styled.span(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n font-family: ", ";\n line-height: 1em;\n color: ", ";\n margin-left: 8px;\n"], ["\n font-size: 14px;\n font-weight: 500;\n font-family: ", ";\n line-height: 1em;\n color: ", ";\n margin-left: 8px;\n"])), FontStyles.DEFAULT, Colors.RED.Hex);
|
|
2203
2212
|
var BulkActionBar = function (_a) {
|
|
2204
2213
|
var _b = _a.actions, actions = _b === void 0 ? [] : _b, errorMsg = _a.errorMsg, onClear = _a.onClear, _c = _a.selectedCount, selectedCount = _c === void 0 ? 0 : _c, accessibleProps = __rest(_a, ["actions", "errorMsg", "onClear", "selectedCount"]);
|
|
2205
|
-
return (React.createElement(Wrapper$
|
|
2214
|
+
return (React.createElement(Wrapper$c, __assign({}, accessibleProps),
|
|
2206
2215
|
React.createElement(Left, null,
|
|
2207
2216
|
React.createElement(Info, null,
|
|
2208
2217
|
React.createElement(Selected, null,
|
|
@@ -2214,21 +2223,21 @@ var BulkActionBar = function (_a) {
|
|
|
2214
2223
|
React.createElement(Icon, { color: Colors.RED.Hex, path: mdiInformationOutline, size: '20px' }),
|
|
2215
2224
|
React.createElement(ErrorMsg, null, errorMsg))) : null));
|
|
2216
2225
|
};
|
|
2217
|
-
var templateObject_1$
|
|
2226
|
+
var templateObject_1$h, templateObject_2$g, templateObject_3$d, templateObject_4$8, templateObject_5$6, templateObject_6$4, templateObject_7$2, templateObject_8$1;
|
|
2218
2227
|
|
|
2219
|
-
var Wrapper$
|
|
2220
|
-
var Input$2 = styled.input(templateObject_2$
|
|
2221
|
-
var Label$3 = styled.span(templateObject_3$
|
|
2228
|
+
var Wrapper$b = styled.label(templateObject_1$g || (templateObject_1$g = __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);
|
|
2229
|
+
var Input$2 = styled.input(templateObject_2$f || (templateObject_2$f = __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"])));
|
|
2230
|
+
var Label$3 = styled.span(templateObject_3$c || (templateObject_3$c = __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);
|
|
2222
2231
|
var Checkbox = function (_a) {
|
|
2223
2232
|
var children = _a.children, disabled = _a.disabled, checked = _a.checked, onChange = _a.onChange, accessibleProps = __rest(_a, ["children", "disabled", "checked", "onChange"]);
|
|
2224
|
-
return (React.createElement(Wrapper$
|
|
2233
|
+
return (React.createElement(Wrapper$b, __assign({}, accessibleProps),
|
|
2225
2234
|
React.createElement(Input$2, { checked: checked, disabled: disabled, name: accessibleProps.name, onChange: disabled ? undefined : onChange, type: 'checkbox' }),
|
|
2226
2235
|
children ? React.createElement(Label$3, null, children) : null));
|
|
2227
2236
|
};
|
|
2228
|
-
var templateObject_1$
|
|
2237
|
+
var templateObject_1$g, templateObject_2$f, templateObject_3$c;
|
|
2229
2238
|
|
|
2230
|
-
var SelectAll = styled.div(templateObject_1$
|
|
2231
|
-
var Options$1 = styled.div(templateObject_2$
|
|
2239
|
+
var SelectAll = styled.div(templateObject_1$f || (templateObject_1$f = __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);
|
|
2240
|
+
var Options$1 = styled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n padding: 12px;\n box-sizing: border-box;\n"], ["\n padding: 12px;\n box-sizing: border-box;\n"])));
|
|
2232
2241
|
var Checklist = function (_a) {
|
|
2233
2242
|
var disabled = _a.disabled, onChange = _a.onChange, options = _a.options, selected = _a.selected, showSelectAll = _a.showSelectAll, accessibleProps = __rest(_a, ["disabled", "onChange", "options", "selected", "showSelectAll"]);
|
|
2234
2243
|
var values = options.map(function (option) { return option.value; });
|
|
@@ -2256,20 +2265,20 @@ var Checklist = function (_a) {
|
|
|
2256
2265
|
return (React.createElement(Checkbox, __assign({ key: i }, accessibleProps, { checked: checked, disabled: disabled, onChange: handleChange.bind(null, option) }), label));
|
|
2257
2266
|
}))));
|
|
2258
2267
|
};
|
|
2259
|
-
var templateObject_1$
|
|
2268
|
+
var templateObject_1$f, templateObject_2$e;
|
|
2260
2269
|
|
|
2261
|
-
var Scrim$1 = styled.div(templateObject_1$
|
|
2270
|
+
var Scrim$1 = styled.div(templateObject_1$e || (templateObject_1$e = __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) {
|
|
2262
2271
|
var $scrim = _a.$scrim;
|
|
2263
2272
|
return ($scrim === 'dark' ? 'rgba(0,0,0,0.8)' : 'transparent');
|
|
2264
2273
|
});
|
|
2265
|
-
var Container$2 = styled.div(templateObject_2$
|
|
2274
|
+
var Container$2 = styled.div(templateObject_2$d || (templateObject_2$d = __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) {
|
|
2266
2275
|
var $width = _a.$width;
|
|
2267
2276
|
return $width || '400px';
|
|
2268
2277
|
});
|
|
2269
|
-
var Header$2 = styled.div(templateObject_3$
|
|
2270
|
-
var Close$1 = styled.div(templateObject_4$
|
|
2271
|
-
var ContentWrapper$1 = styled.div(templateObject_5$
|
|
2272
|
-
var ButtonBar$1 = styled.div(templateObject_6$
|
|
2278
|
+
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"])));
|
|
2279
|
+
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"])));
|
|
2280
|
+
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"])));
|
|
2281
|
+
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"])));
|
|
2273
2282
|
var Drawer = function (_a) {
|
|
2274
2283
|
var children = _a.children, description = _a.description, title = _a.title, onClose = _a.onClose, primaryButton = _a.primaryButton, secondaryButton = _a.secondaryButton, tertiaryButton = _a.tertiaryButton, scrim = _a.scrim, width = _a.width, accessibleProps = __rest(_a, ["children", "description", "title", "onClose", "primaryButton", "secondaryButton", "tertiaryButton", "scrim", "width"]);
|
|
2275
2284
|
useEffect(function () {
|
|
@@ -2297,18 +2306,18 @@ var Drawer = function (_a) {
|
|
|
2297
2306
|
primaryButton ? React.createElement(Button, __assign({}, primaryButton, { format: 'primary' })) : null)) : null),
|
|
2298
2307
|
scrim ? React.createElement(Scrim$1, { "$scrim": scrim, onClick: onClose }) : null));
|
|
2299
2308
|
};
|
|
2300
|
-
var templateObject_1$
|
|
2301
|
-
|
|
2302
|
-
var Wrapper$
|
|
2303
|
-
var LabelRow = styled.div(
|
|
2304
|
-
var Label$2 = styled.label(
|
|
2305
|
-
var Required = styled.span(
|
|
2306
|
-
var Action = styled.span(
|
|
2307
|
-
var Description = styled.div(
|
|
2308
|
-
var Validation = styled.div(
|
|
2309
|
+
var templateObject_1$e, templateObject_2$d, templateObject_3$b, templateObject_4$7, templateObject_5$5, templateObject_6$3;
|
|
2310
|
+
|
|
2311
|
+
var Wrapper$a = styled.div(function (props) { return (__assign({ margin: '0px 0px 15px 0px' }, props.style)); });
|
|
2312
|
+
var LabelRow = styled.div(templateObject_1$d || (templateObject_1$d = __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"])));
|
|
2313
|
+
var Label$2 = styled.label(templateObject_2$c || (templateObject_2$c = __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);
|
|
2314
|
+
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);
|
|
2315
|
+
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);
|
|
2316
|
+
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);
|
|
2317
|
+
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);
|
|
2309
2318
|
var Field = function (_a) {
|
|
2310
|
-
var action = _a.action, children = _a.children, validationText = _a.validationText, label = _a.label,
|
|
2311
|
-
return (React.createElement(Wrapper$
|
|
2319
|
+
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"]);
|
|
2320
|
+
return (React.createElement(Wrapper$a, __assign({ style: style }, accessibleProps),
|
|
2312
2321
|
React.createElement(LabelRow, null,
|
|
2313
2322
|
React.createElement(Label$2, { htmlFor: htmlFor },
|
|
2314
2323
|
label,
|
|
@@ -2318,7 +2327,106 @@ var Field = function (_a) {
|
|
|
2318
2327
|
children,
|
|
2319
2328
|
validationText ? React.createElement(Validation, null, validationText) : null));
|
|
2320
2329
|
};
|
|
2321
|
-
var templateObject_1$
|
|
2330
|
+
var templateObject_1$d, templateObject_2$c, templateObject_3$a, templateObject_4$6, templateObject_5$4, templateObject_6$2;
|
|
2331
|
+
|
|
2332
|
+
var Wrapper$9 = styled.div(templateObject_1$c || (templateObject_1$c = __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) {
|
|
2333
|
+
var $isDragOver = _a.$isDragOver;
|
|
2334
|
+
return ($isDragOver ? "".concat(Colors.PRIMARY.Hex) : '#ccc');
|
|
2335
|
+
}, function (_a) {
|
|
2336
|
+
var $isDragOver = _a.$isDragOver;
|
|
2337
|
+
return $isDragOver ? "rgba(".concat(Colors.PRIMARY.Rgb, ", 0.05)") : '#ffffff';
|
|
2338
|
+
});
|
|
2339
|
+
var StyledIcon$1 = styled.div(templateObject_2$b || (templateObject_2$b = __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) {
|
|
2340
|
+
var $isDragOver = _a.$isDragOver;
|
|
2341
|
+
return ($isDragOver ? '#fff' : '#f5f5f5');
|
|
2342
|
+
});
|
|
2343
|
+
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"])));
|
|
2344
|
+
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"])));
|
|
2345
|
+
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) {
|
|
2346
|
+
var $fileState = _a.$fileState;
|
|
2347
|
+
return ($fileState ? '20px 0px' : '');
|
|
2348
|
+
}, function (_a) {
|
|
2349
|
+
var $fileState = _a.$fileState;
|
|
2350
|
+
return ($fileState ? '' : '16px');
|
|
2351
|
+
});
|
|
2352
|
+
var IconWrapper$2 = styled.div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n cursor: pointer;\n"], ["\n cursor: pointer;\n"])));
|
|
2353
|
+
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"])));
|
|
2354
|
+
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) {
|
|
2355
|
+
var $width = _a.$width;
|
|
2356
|
+
return "".concat($width, "%");
|
|
2357
|
+
}, Colors.GREEN.Hex);
|
|
2358
|
+
var FileUpload = function (_a) {
|
|
2359
|
+
var acceptFiles = _a.acceptFiles, onChange = _a.onChange, onFileDelete = _a.onFileDelete, _b = _a.maxFileSize, maxFileSize = _b === void 0 ? 10 : _b, _c = _a.multiple, multiple = _c === void 0 ? false : _c, _d = _a.progress, progress = _d === void 0 ? false : _d, UploadProgress = _a.UploadProgress, accessibleProps = __rest(_a, ["acceptFiles", "onChange", "onFileDelete", "maxFileSize", "multiple", "progress", "UploadProgress"]);
|
|
2360
|
+
var MAX_FILE_SIZE = maxFileSize * 1024 * 1024;
|
|
2361
|
+
var _e = useState([]), files = _e[0], setFiles = _e[1];
|
|
2362
|
+
var _f = useState(false), dragOver = _f[0], setDragOver = _f[1];
|
|
2363
|
+
var inputField = useRef(null);
|
|
2364
|
+
useEffect(function () {
|
|
2365
|
+
if (UploadProgress) {
|
|
2366
|
+
var updatedFiles = files.map(function (file, index) {
|
|
2367
|
+
if (index === UploadProgress.index) {
|
|
2368
|
+
return __assign(__assign({}, file), { uploadUpdate: UploadProgress.progress });
|
|
2369
|
+
}
|
|
2370
|
+
else {
|
|
2371
|
+
return file;
|
|
2372
|
+
}
|
|
2373
|
+
});
|
|
2374
|
+
setFiles(updatedFiles);
|
|
2375
|
+
}
|
|
2376
|
+
}, [UploadProgress]);
|
|
2377
|
+
useEffect(function () {
|
|
2378
|
+
onChange(files);
|
|
2379
|
+
}, [files]);
|
|
2380
|
+
var assignFiles = function (newFiles) {
|
|
2381
|
+
var _loop_1 = function (i) {
|
|
2382
|
+
if (newFiles[i].size < MAX_FILE_SIZE) {
|
|
2383
|
+
setFiles(function (files) { return __spreadArray(__spreadArray([], files, true), [{ file: newFiles[i], uploadProgress: 0 }], false); });
|
|
2384
|
+
}
|
|
2385
|
+
};
|
|
2386
|
+
for (var i = 0; i < newFiles.length; i++) {
|
|
2387
|
+
_loop_1(i);
|
|
2388
|
+
}
|
|
2389
|
+
};
|
|
2390
|
+
var onFileSelect = function (e) {
|
|
2391
|
+
assignFiles(Array.from(e.target.files || []));
|
|
2392
|
+
};
|
|
2393
|
+
var handleDrop = function (e) {
|
|
2394
|
+
e === null || e === void 0 ? void 0 : e.preventDefault();
|
|
2395
|
+
assignFiles(Array.from(e.dataTransfer.files || []));
|
|
2396
|
+
};
|
|
2397
|
+
var handleDragOver = function (e) {
|
|
2398
|
+
e === null || e === void 0 ? void 0 : e.preventDefault();
|
|
2399
|
+
setDragOver(true);
|
|
2400
|
+
};
|
|
2401
|
+
var handleDragLeave = function (e) {
|
|
2402
|
+
e === null || e === void 0 ? void 0 : e.preventDefault();
|
|
2403
|
+
setDragOver(false);
|
|
2404
|
+
};
|
|
2405
|
+
var removeItem = function (index) {
|
|
2406
|
+
var newArray = __spreadArray([], files, true);
|
|
2407
|
+
newArray.splice(index, 1);
|
|
2408
|
+
setFiles(newArray);
|
|
2409
|
+
onFileDelete(files[index]);
|
|
2410
|
+
};
|
|
2411
|
+
return (React.createElement(React.Fragment, null,
|
|
2412
|
+
React.createElement(Wrapper$9, __assign({ "$isDragOver": dragOver, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop }, accessibleProps),
|
|
2413
|
+
files.length > 0 && (React.createElement(Files, null, Array.from(files).map(function (singleFile, index) {
|
|
2414
|
+
var _a;
|
|
2415
|
+
return (React.createElement(File, { key: index },
|
|
2416
|
+
React.createElement(Copy, { children: (_a = singleFile.file) === null || _a === void 0 ? void 0 : _a.name, type: 'bold' }),
|
|
2417
|
+
singleFile.uploadUpdate === 100 || !progress ? (React.createElement(IconWrapper$2, { onClick: function () { return removeItem(index); } },
|
|
2418
|
+
React.createElement(Icon, { color: 'red', path: mdiMinusCircle, size: 1 }))) : (React.createElement(ProgressBar, null,
|
|
2419
|
+
React.createElement(Progress, { "$width": (singleFile === null || singleFile === void 0 ? void 0 : singleFile.uploadUpdate) || 0, role: 'progressbar' })))));
|
|
2420
|
+
}))),
|
|
2421
|
+
React.createElement("div", { onClick: function () { var _a; return (_a = inputField === null || inputField === void 0 ? void 0 : inputField.current) === null || _a === void 0 ? void 0 : _a.click(); } },
|
|
2422
|
+
!(files.length > 0) && (React.createElement(StyledIcon$1, { "$isDragOver": dragOver },
|
|
2423
|
+
React.createElement(Icon, { color: dragOver ? "".concat(Colors.PRIMARY.Hex) : "".concat(Colors.GRAY.Hex), path: mdiFolderPlusOutline, size: 1.667 }))),
|
|
2424
|
+
React.createElement("input", { accept: acceptFiles, hidden: true, multiple: multiple, onChange: onFileSelect, ref: inputField, type: 'file' }),
|
|
2425
|
+
React.createElement(CopyWrapper, { "$fileState": files.length > 0 },
|
|
2426
|
+
React.createElement(Copy, { align: 'center', children: 'Drag & drop files here or click to choose', type: 'bold' }),
|
|
2427
|
+
React.createElement(Copy, { align: 'center', children: "".concat(maxFileSize, " MB max file size"), color: 'GRAY' }))))));
|
|
2428
|
+
};
|
|
2429
|
+
var templateObject_1$c, templateObject_2$b, templateObject_3$9, templateObject_4$5, templateObject_5$3, templateObject_6$1, templateObject_7$1, templateObject_8;
|
|
2322
2430
|
|
|
2323
2431
|
var formatAsPhone = function (number) {
|
|
2324
2432
|
var formatted_value = "".concat(number).replace(/[^0-9.]/g, '');
|
|
@@ -2397,6 +2505,48 @@ var Input$1 = function (_a) {
|
|
|
2397
2505
|
};
|
|
2398
2506
|
var templateObject_1$b, templateObject_2$a, templateObject_3$8, templateObject_4$4;
|
|
2399
2507
|
|
|
2508
|
+
var colorMapping = {
|
|
2509
|
+
black: {
|
|
2510
|
+
fill_1: '#000000',
|
|
2511
|
+
fill_2: '#000000',
|
|
2512
|
+
fill_3: '#000000',
|
|
2513
|
+
},
|
|
2514
|
+
white: {
|
|
2515
|
+
fill_1: '#ffffff',
|
|
2516
|
+
fill_2: '#ffffff',
|
|
2517
|
+
fill_3: '#ffffff',
|
|
2518
|
+
},
|
|
2519
|
+
full: {
|
|
2520
|
+
fill_1: '#000000',
|
|
2521
|
+
fill_2: '#E82425',
|
|
2522
|
+
fill_3: '#E82425',
|
|
2523
|
+
},
|
|
2524
|
+
reversed: {
|
|
2525
|
+
fill_1: '#ffffff',
|
|
2526
|
+
fill_2: '#E82425',
|
|
2527
|
+
fill_3: '#E82425',
|
|
2528
|
+
},
|
|
2529
|
+
};
|
|
2530
|
+
var Logo = function (_a) {
|
|
2531
|
+
var _b = _a.type, type = _b === void 0 ? 'standard_full' : _b, _c = _a.height, height = _c === void 0 ? '50px' : _c, accessibleProps = __rest(_a, ["type", "height"]);
|
|
2532
|
+
var type_parts = type.split('_');
|
|
2533
|
+
switch (type_parts[0]) {
|
|
2534
|
+
case 'mark':
|
|
2535
|
+
return (React.createElement("svg", __assign({ fill: 'none', height: height, viewBox: '0 0 58 51', width: '100%', xmlns: 'http://www.w3.org/2000/svg' }, accessibleProps),
|
|
2536
|
+
React.createElement("path", { d: 'M43.9348 -1.14441e-05H13.3724L0 25.2376L7.27148 38.0136L14.1215 50.0487H43.1856L57.3077 25.2376L43.9348 -1.14441e-05ZM38.206 9.49903L46.459 25.0743L37.6507 40.5497H19.6567L15.5417 33.3199L10.8487 25.0743L19.1013 9.49903H38.206Z', fill: type_parts[1] })));
|
|
2537
|
+
default:
|
|
2538
|
+
return (React.createElement("svg", __assign({ fill: 'none', height: height, preserveAspectRatio: 'xMidYMid meet', viewBox: '0 0 236 50', width: '100%', xmlns: 'http://www.w3.org/2000/svg' }, accessibleProps),
|
|
2539
|
+
React.createElement("path", { d: 'M230.794 29.59H219.306L214.279 39.0907L217.012 43.9001L219.587 48.4308H230.512L235.821 39.0907L230.794 29.59V29.59ZM228.641 33.1659L231.743 39.0292L228.432 44.8549H221.668L220.121 42.1332L218.356 39.0292L221.459 33.1659H228.641Z', fill: colorMapping[type_parts[1]].fill_3 }),
|
|
2540
|
+
React.createElement("path", { d: 'M211.662 42.6033L199.206 42.6319C196.339 42.6319 193.862 41.6095 191.846 39.5923C189.828 37.5755 188.805 35.0985 188.805 32.2321C188.805 29.3656 189.828 26.8886 191.846 24.8718C193.848 22.8332 196.325 21.7975 199.206 21.7975C202.072 21.7975 204.549 22.8199 206.566 24.8374C207.613 25.8847 208.391 27.093 208.944 28.5312L209.253 29.3327H197.87L196.325 32.2579L197.921 35.0969H211.458L215.015 28.6192C214.296 25.5702 212.835 22.9293 210.672 20.7657C207.531 17.6257 203.674 16.0333 199.206 16.0333C194.737 16.0333 190.88 17.6257 187.739 20.7657C184.555 23.9501 183.007 27.7011 183.007 32.2321C183.007 36.7001 184.599 40.5577 187.739 43.6981C190.88 46.8384 194.737 48.4308 199.206 48.4308H210.095L214.745 48.3297L211.662 42.6033', fill: colorMapping[type_parts[1]].fill_1 }),
|
|
2541
|
+
React.createElement("path", { d: 'M160.945 19.133L158.826 20.8384C155.734 23.9359 154.141 27.8058 154.141 32.2967L154.141 47.7903L156.985 49.407L159.939 47.8778L159.94 32.2967C159.94 29.6632 160.778 27.3706 162.432 25.4846C162.615 25.2739 162.811 25.0666 163.018 24.8639C163.074 24.8155 164.138 24.0061 164.811 23.5592C166.321 22.5576 168.076 21.9876 170.024 21.8632L170.166 21.8621C172.923 21.8621 175.32 22.7325 177.301 24.4494L180.146 23.0088L180.246 19.3426C177.44 17.1664 174.132 16.0633 170.408 16.0633C166.909 16.0633 163.725 17.0962 160.945 19.133', fill: colorMapping[type_parts[1]].fill_1 }),
|
|
2542
|
+
React.createElement("path", { d: 'M131.392 50C135.884 50 139.753 48.4076 142.893 45.2676C146.033 42.1269 147.626 38.2581 147.626 33.7668V18.1124L144.782 16.4964L141.827 18.0251V33.7668C141.827 36.6932 140.792 39.1936 138.745 41.2034C136.684 43.1927 134.128 44.2013 131.151 44.2013L131.01 44.2002H131.81L131.669 44.2013C128.692 44.2013 126.136 43.1927 124.074 41.2034C122.028 39.1936 120.993 36.6932 120.993 33.7668V18.0251L118.038 16.4964L115.194 18.1124V33.7668C115.194 38.2581 116.786 42.1269 119.926 45.2676C123.067 48.4076 126.936 50 131.427 50H131.392Z', fill: colorMapping[type_parts[1]].fill_1 }),
|
|
2543
|
+
React.createElement("path", { d: 'M93.8353 26.9933L97.8468 31.2421L100.788 28.1521L107.791 20.4534L106.753 17.3567L103.584 16.5678', fill: colorMapping[type_parts[1]].fill_2 }),
|
|
2544
|
+
React.createElement("path", { d: 'M80.7509 16.5677L77.5821 17.3564L76.5441 20.4534L83.5514 28.1568L88.1484 32.9862L76.5412 45.2133L77.5187 48.3175C79.525 48.9571 80.359 49.1805 80.6985 49.2584L92.195 37.238L103.636 49.2584C103.976 49.1805 104.81 48.9571 106.817 48.3175L107.794 45.2133L80.7509 16.5677', fill: colorMapping[type_parts[1]].fill_1 }),
|
|
2545
|
+
React.createElement("path", { d: 'M67.8498 45.479C67.5109 44.893 66.7322 43.5486 66.2043 42.6319H55.1965C52.3299 42.6319 49.8532 41.6095 47.8364 39.5923C45.819 37.5755 44.7966 35.0985 44.7966 32.2321C44.7966 29.3656 45.819 26.8886 47.8364 24.8718C49.8388 22.8332 52.316 21.7975 55.1965 21.7975C58.0632 21.7975 60.5398 22.8199 62.5565 24.8374C63.6038 25.8847 64.3824 27.093 64.9357 28.5312L65.2435 29.3327H53.8141C53.231 30.2171 52.5673 31.6476 52.303 32.2354L53.912 35.0969H67.474L71.0059 28.6192C70.2872 25.5702 68.8261 22.9293 66.6625 20.7657C63.5219 17.6257 59.6649 16.0333 55.1965 16.0333C50.7283 16.0333 46.8708 17.6257 43.7303 20.7657C40.546 23.9501 38.9979 27.7011 38.9979 32.2321C38.9979 36.7001 40.5903 40.5577 43.7303 43.6981C46.8708 46.8384 50.7283 48.4308 55.1965 48.4308H66.0873C66.9322 47.0737 67.5668 45.977 67.8498 45.479', fill: colorMapping[type_parts[1]].fill_1 }),
|
|
2546
|
+
React.createElement("path", { d: 'M27.6655 20.7443C26.9235 20.002 26.2307 19.4097 25.608 18.9831C22.7338 17.0113 19.5684 16.0117 16.1992 16.0117C13.6229 16.0117 11.1676 16.5943 8.9002 17.7442C8.1016 18.1264 7.38657 18.6118 6.73074 19.0799L5.88805 19.6819C5.85364 19.711 5.81716 19.7449 5.78223 19.7749L5.77618 17.9067C5.78246 17.9022 5.7892 17.8965 5.79554 17.8921L5.72168 1.52402L2.84058 1.54784e-05L0 1.6145V24.9966V30.8918C0.0184614 30.8508 0.0393993 30.8108 0.0580857 30.7698C0.0216133 31.2417 0 31.7206 0 32.2105V47.6757L2.84688 49.2499C4.7412 48.3293 5.4988 47.9164 5.79866 47.7385V32.2105C5.79866 29.3439 6.82128 26.8672 8.83853 24.8504C10.8415 22.8118 13.319 21.7759 16.1992 21.7759C19.0796 21.7759 21.557 22.8118 23.5635 24.8538C25.3441 26.6351 26.3374 28.7976 26.5963 31.4625C26.6263 31.6669 26.6339 40.3058 26.6339 47.6694C27.2825 48.0147 28.6127 48.8167 29.5141 49.3059C29.9448 49.0814 32.0589 47.8425 32.3979 47.6669V32.2105C32.3979 27.6795 30.8499 23.9285 27.6655 20.7443Z', fill: colorMapping[type_parts[1]].fill_1 })));
|
|
2547
|
+
}
|
|
2548
|
+
};
|
|
2549
|
+
|
|
2400
2550
|
var Wrapper$8 = styled.div(templateObject_1$a || (templateObject_1$a = __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"])));
|
|
2401
2551
|
var Container$1 = styled.dialog(templateObject_2$9 || (templateObject_2$9 = __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'; });
|
|
2402
2552
|
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"])));
|
|
@@ -2638,5 +2788,5 @@ var ZeroState = function (_a) {
|
|
|
2638
2788
|
};
|
|
2639
2789
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
2640
2790
|
|
|
2641
|
-
export { Accordion, ActionDialog, Alert, BulkActionBar, Button, Checkbox, Checklist, Copy, Drawer, Field, Heading, Input$1 as Input, Modal, MoreMenu, MultiSelect, Pagination, Radio, RadioList, Select, Table, Tabs, Tag, Toggle, ZeroState };
|
|
2791
|
+
export { Accordion, ActionDialog, Alert, BulkActionBar, Button, Checkbox, Checklist, Copy, Drawer, Field, FileUpload, Heading, Input$1 as Input, Logo, Modal, MoreMenu, MultiSelect, Pagination, Radio, RadioList, Select, Table, Tabs, Tag, Toggle, ZeroState };
|
|
2642
2792
|
//# sourceMappingURL=index.js.map
|