react-asc 18.4.0 → 18.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/AutoComplete/AutoComplete.d.ts +3 -1
- package/components/Modal/GlobalModal.d.ts +3 -1
- package/components/Modal/Modal.d.ts +3 -2
- package/components/Modal/modal.service.d.ts +2 -0
- package/components/TreeView/TreeNode.d.ts +1 -1
- package/components/TreeView/TreeView.d.ts +9 -2
- package/hooks/index.d.ts +1 -1
- package/hooks/useDebounce.d.ts +1 -0
- package/index.es.js +154 -137
- package/index.es.js.map +1 -1
- package/index.js +154 -136
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/hooks/Debounce.hook.d.ts +0 -1
package/index.es.js
CHANGED
|
@@ -87,56 +87,56 @@ function styleInject(css, ref) {
|
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
|
|
90
|
-
var css_248z$
|
|
91
|
-
var styles$
|
|
92
|
-
styleInject(css_248z$
|
|
90
|
+
var css_248z$R = ".Alert-module_alert__2yOUn {\n border-radius: var(--borderRadius);\n padding: 6px 16px;\n}\n\n.Alert-module_contained__1cUnn.Alert-module_primary__1pnWJ {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Alert-module_contained__1cUnn.Alert-module_accent__3TlkP {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Alert-module_contained__1cUnn.Alert-module_secondary__3cfYS {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Alert-module_contained__1cUnn.Alert-module_light__vSzHK {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Alert-module_contained__1cUnn.Alert-module_dark__3DrkS {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n\n.Alert-module_outline__3fdYC.Alert-module_primary__1pnWJ {\n color: var(--primary) !important;\n border: 1px solid var(--primary) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_secondary__3cfYS {\n color: var(--secondary) !important;\n border: 1px solid var(--secondary) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_accent__3TlkP {\n color: var(--accent) !important;\n border: 1px solid var(--accent) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_light__vSzHK {\n color: var(--light-contrast-text) !important;\n border: 1px solid var(--light) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_dark__3DrkS {\n color: var(--dark) !important;\n border: 1px solid var(--dark) !important;\n}";
|
|
91
|
+
var styles$R = {"alert":"Alert-module_alert__2yOUn","contained":"Alert-module_contained__1cUnn","primary":"Alert-module_primary__1pnWJ","accent":"Alert-module_accent__3TlkP","secondary":"Alert-module_secondary__3cfYS","light":"Alert-module_light__vSzHK","dark":"Alert-module_dark__3DrkS","outline":"Alert-module_outline__3fdYC"};
|
|
92
|
+
styleInject(css_248z$R);
|
|
93
93
|
|
|
94
94
|
const Alert = (props) => {
|
|
95
95
|
const { children, className, color = COLOR.primary, variant = VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
96
96
|
const getCssClasses = () => {
|
|
97
97
|
const cssClasses = [];
|
|
98
|
-
cssClasses.push(styles$
|
|
98
|
+
cssClasses.push(styles$R.alert);
|
|
99
99
|
if (variant === VARIANT.contained) {
|
|
100
|
-
cssClasses.push(styles$
|
|
101
|
-
cssClasses.push(styles$
|
|
100
|
+
cssClasses.push(styles$R.contained);
|
|
101
|
+
cssClasses.push(styles$R[color]);
|
|
102
102
|
}
|
|
103
103
|
if (variant === VARIANT.outline) {
|
|
104
|
-
cssClasses.push(styles$
|
|
105
|
-
cssClasses.push(styles$
|
|
104
|
+
cssClasses.push(styles$R.outline);
|
|
105
|
+
cssClasses.push(styles$R[color]);
|
|
106
106
|
}
|
|
107
|
-
shadow && cssClasses.push(styles$
|
|
107
|
+
shadow && cssClasses.push(styles$R['shadow']);
|
|
108
108
|
className && cssClasses.push(className);
|
|
109
109
|
return cssClasses.filter(r => r).join(' ');
|
|
110
110
|
};
|
|
111
111
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
112
112
|
};
|
|
113
113
|
|
|
114
|
-
var css_248z$
|
|
115
|
-
var styles$
|
|
116
|
-
styleInject(css_248z$
|
|
114
|
+
var css_248z$Q = ".AppBar-module_appbar__1S8G1 {\n padding: 0.5rem 1rem;\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0;\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_primary__3CiO7 {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_secondary__1W4qT {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_accent__Mgcwx {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_light__1FxmL {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_dark__3n5rm {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_shadow__2c8iH {\n box-shadow: var(--shadow);\n}";
|
|
115
|
+
var styles$Q = {"appbar":"AppBar-module_appbar__1S8G1","primary":"AppBar-module_primary__3CiO7","secondary":"AppBar-module_secondary__1W4qT","accent":"AppBar-module_accent__Mgcwx","light":"AppBar-module_light__1FxmL","dark":"AppBar-module_dark__3n5rm","shadow":"AppBar-module_shadow__2c8iH"};
|
|
116
|
+
styleInject(css_248z$Q);
|
|
117
117
|
|
|
118
118
|
const AppBar = (props) => {
|
|
119
119
|
const { children, className, color = COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
120
120
|
const getCssClasses = () => {
|
|
121
121
|
const cssClasses = [];
|
|
122
|
-
cssClasses.push(styles$
|
|
123
|
-
cssClasses.push(styles$
|
|
124
|
-
shadow && cssClasses.push(styles$
|
|
122
|
+
cssClasses.push(styles$Q[color]);
|
|
123
|
+
cssClasses.push(styles$Q.appbar);
|
|
124
|
+
shadow && cssClasses.push(styles$Q['shadow']);
|
|
125
125
|
className && cssClasses.push(className);
|
|
126
126
|
return cssClasses.filter(r => r).join(' ');
|
|
127
127
|
};
|
|
128
128
|
return (React.createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
129
129
|
};
|
|
130
130
|
|
|
131
|
-
var css_248z$
|
|
132
|
-
var styles$
|
|
133
|
-
styleInject(css_248z$
|
|
131
|
+
var css_248z$P = ".AppBarTitle-module_appbarTitle__3J-Z1 {\n align-items: center;\n padding-top: 0.3125rem;\n padding-bottom: 0.3125rem;\n font-size: 1.25rem;\n line-height: 1.8;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden !important;\n display: inline-block;\n}\n.AppBarTitle-module_appbarTitle__3J-Z1:hover {\n cursor: pointer;\n}";
|
|
132
|
+
var styles$P = {"appbarTitle":"AppBarTitle-module_appbarTitle__3J-Z1"};
|
|
133
|
+
styleInject(css_248z$P);
|
|
134
134
|
|
|
135
135
|
const AppBarTitle = (props) => {
|
|
136
136
|
const { children, className, onClick } = props;
|
|
137
137
|
const getCssClass = () => {
|
|
138
138
|
const cssClasses = [];
|
|
139
|
-
cssClasses.push(styles$
|
|
139
|
+
cssClasses.push(styles$P.appbarTitle);
|
|
140
140
|
className && cssClasses.push(className);
|
|
141
141
|
return cssClasses.filter(r => r).join(' ');
|
|
142
142
|
};
|
|
@@ -164,40 +164,40 @@ const Backdrop = (props) => {
|
|
|
164
164
|
return (createPortal(React.createElement("div", { className: getCssClasses(), onClick: handleClick, style: getStyles() }), target));
|
|
165
165
|
};
|
|
166
166
|
|
|
167
|
-
var css_248z$
|
|
168
|
-
var styles$
|
|
169
|
-
styleInject(css_248z$
|
|
167
|
+
var css_248z$O = ".List-module_list__1ax9w {\n width: 100%;\n display: flex;\n flex-direction: column;\n padding-left: 0;\n margin-bottom: 0;\n margin-top: 0;\n background-color: var(--white);\n}";
|
|
168
|
+
var styles$O = {"list":"List-module_list__1ax9w"};
|
|
169
|
+
styleInject(css_248z$O);
|
|
170
170
|
|
|
171
171
|
const List = (props) => {
|
|
172
172
|
const { children, className, isFlush } = props;
|
|
173
173
|
const getCssClasses = () => {
|
|
174
174
|
const cssClasses = [];
|
|
175
175
|
if (isFlush) {
|
|
176
|
-
cssClasses.push(styles$
|
|
176
|
+
cssClasses.push(styles$O.flush);
|
|
177
177
|
}
|
|
178
|
-
cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$O.list);
|
|
179
179
|
className && cssClasses.push(className);
|
|
180
180
|
return cssClasses.filter(css => css).join(' ');
|
|
181
181
|
};
|
|
182
182
|
return (React.createElement("ul", { className: getCssClasses() }, children));
|
|
183
183
|
};
|
|
184
184
|
|
|
185
|
-
var css_248z$
|
|
186
|
-
var styles$
|
|
187
|
-
styleInject(css_248z$
|
|
185
|
+
var css_248z$N = ".ListItem-module_listItem__3hAZb {\n display: flex;\n align-items: center;\n position: relative;\n padding: 0.75rem 1.25rem;\n min-width: 100%;\n color: var(--bodyColor);\n text-align: inherit;\n transition: background 0.5s ease;\n}\n.ListItem-module_listItem__3hAZb:hover, .ListItem-module_listItem__3hAZb.ListItem-module_active__hyvch {\n cursor: pointer;\n z-index: 1;\n text-decoration: none;\n background-color: rgba(0, 0, 0, 0.04);\n color: var(--primary);\n}\n.ListItem-module_listItem__3hAZb + .ListItem-module_listItem__3hAZb {\n border-top-width: 0;\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_primary__2OJAg {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_accent__2RXHe {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_secondary__3EVjH {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_light__3CJBB {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_dark__SazkE {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}";
|
|
186
|
+
var styles$N = {"listItem":"ListItem-module_listItem__3hAZb","active":"ListItem-module_active__hyvch","primary":"ListItem-module_primary__2OJAg","accent":"ListItem-module_accent__2RXHe","secondary":"ListItem-module_secondary__3EVjH","light":"ListItem-module_light__3CJBB","dark":"ListItem-module_dark__SazkE"};
|
|
187
|
+
styleInject(css_248z$N);
|
|
188
188
|
|
|
189
189
|
const ListItem = (props) => {
|
|
190
190
|
const { id, children, color, active, className, isHoverable, isDisabled, onClick } = props;
|
|
191
191
|
const getCssClasses = () => {
|
|
192
192
|
const cssClasses = [];
|
|
193
193
|
if (active) {
|
|
194
|
-
cssClasses.push(styles$
|
|
194
|
+
cssClasses.push(styles$N['active']);
|
|
195
195
|
}
|
|
196
196
|
if (isDisabled) {
|
|
197
197
|
cssClasses.push(`disabled`);
|
|
198
198
|
}
|
|
199
|
-
color && cssClasses.push(styles$
|
|
200
|
-
cssClasses.push(styles$
|
|
199
|
+
color && cssClasses.push(styles$N[color]);
|
|
200
|
+
cssClasses.push(styles$N.listItem);
|
|
201
201
|
className && cssClasses.push(className);
|
|
202
202
|
return cssClasses.filter(css => css).join(' ');
|
|
203
203
|
};
|
|
@@ -207,32 +207,32 @@ const ListItem = (props) => {
|
|
|
207
207
|
return (React.createElement("li", { id: id, onClick: handleClick, className: getCssClasses() }, children));
|
|
208
208
|
};
|
|
209
209
|
|
|
210
|
-
var css_248z$
|
|
211
|
-
var styles$
|
|
210
|
+
var css_248z$M = ".ListItemAvatar-module_avatar__1fjSE {\n margin-right: 16px;\n}\n.ListItemAvatar-module_avatar__1fjSE svg, .ListItemAvatar-module_avatar__1fjSE img {\n width: 24px;\n height: 24px;\n}\n.ListItemAvatar-module_avatar__1fjSE img {\n border-radius: 50%;\n}";
|
|
211
|
+
var styles$M = {"avatar":"ListItemAvatar-module_avatar__1fjSE"};
|
|
212
|
+
styleInject(css_248z$M);
|
|
213
|
+
|
|
214
|
+
const ListItemAvatar = ({ avatar }) => (React.createElement("div", { className: styles$M.avatar }, avatar));
|
|
215
|
+
|
|
216
|
+
var css_248z$L = ".ListItemIcon-module_icon__-nsUy {\n margin-right: 32px;\n}\n.ListItemIcon-module_icon__-nsUy svg {\n width: 24px;\n height: 24px;\n}";
|
|
217
|
+
var styles$L = {"icon":"ListItemIcon-module_icon__-nsUy"};
|
|
212
218
|
styleInject(css_248z$L);
|
|
213
219
|
|
|
214
|
-
const
|
|
220
|
+
const ListItemIcon = ({ icon }) => (React.createElement("div", { className: styles$L.icon }, icon));
|
|
215
221
|
|
|
216
|
-
var css_248z$K = ".
|
|
217
|
-
var styles$K = {"
|
|
222
|
+
var css_248z$K = ".ListItemAction-module_listItemAction__26S66 {\n display: flex;\n justify-content: center;\n min-width: 40px;\n}\n.ListItemAction-module_listItemAction__26S66 svg {\n width: 20px;\n height: 20px;\n}";
|
|
223
|
+
var styles$K = {"listItemAction":"ListItemAction-module_listItemAction__26S66"};
|
|
218
224
|
styleInject(css_248z$K);
|
|
219
225
|
|
|
220
|
-
const
|
|
226
|
+
const ListItemAction = ({ children, onClick }) => (React.createElement("div", { className: styles$K.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
221
227
|
|
|
222
|
-
var css_248z$J = ".
|
|
223
|
-
var styles$J = {"
|
|
228
|
+
var css_248z$J = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1;\n}";
|
|
229
|
+
var styles$J = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
224
230
|
styleInject(css_248z$J);
|
|
225
231
|
|
|
226
|
-
const ListItemAction = ({ children, onClick }) => (React.createElement("div", { className: styles$J.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
227
|
-
|
|
228
|
-
var css_248z$I = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1; }\n";
|
|
229
|
-
var styles$I = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
230
|
-
styleInject(css_248z$I);
|
|
231
|
-
|
|
232
232
|
const ListItemText = ({ primary, secondary }) => {
|
|
233
233
|
const getCssClasses = () => {
|
|
234
234
|
const cssClasses = [];
|
|
235
|
-
cssClasses.push(styles$
|
|
235
|
+
cssClasses.push(styles$J.listItemText);
|
|
236
236
|
return cssClasses.filter(css => css).join(' ');
|
|
237
237
|
};
|
|
238
238
|
return (React.createElement("div", { className: getCssClasses() },
|
|
@@ -243,9 +243,9 @@ const ListItemText = ({ primary, secondary }) => {
|
|
|
243
243
|
const ListItemTextPrimary = ({ children }) => (React.createElement("div", { className: "list-item-text-primary" }, children));
|
|
244
244
|
const ListItemTextSecondary = ({ children }) => (React.createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
245
245
|
|
|
246
|
-
var css_248z$
|
|
247
|
-
var styles$
|
|
248
|
-
styleInject(css_248z$
|
|
246
|
+
var css_248z$I = ".AutoComplete-module_selectContainer__SyqtX {\n position: relative;\n}\n\n.AutoComplete-module_select__2_7JD {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n}\n.AutoComplete-module_select__2_7JD:hover {\n cursor: pointer;\n}\n\n.AutoComplete-module_selectMenu__2_ybA {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 38px;\n z-index: 1050;\n max-height: 280px;\n overflow: auto;\n}";
|
|
247
|
+
var styles$I = {"selectContainer":"AutoComplete-module_selectContainer__SyqtX","select":"AutoComplete-module_select__2_7JD","selectMenu":"AutoComplete-module_selectMenu__2_ybA"};
|
|
248
|
+
styleInject(css_248z$I);
|
|
249
249
|
|
|
250
250
|
// preset value
|
|
251
251
|
// enter -> delay? -> show results
|
|
@@ -253,8 +253,9 @@ styleInject(css_248z$H);
|
|
|
253
253
|
// multiple
|
|
254
254
|
// custom template render items
|
|
255
255
|
const AutoComplete = (props) => {
|
|
256
|
-
const { id, name, className, options = [], openOnFocus = true, disabled, readOnly, onChange, value } = props;
|
|
256
|
+
const { id, name, className, options = [], openOnFocus = true, disabled, readOnly, debounce = 0, onChange, onSelect, value } = props;
|
|
257
257
|
const [model, setModel] = useState('');
|
|
258
|
+
const [searchText, setSearchText] = useState('');
|
|
258
259
|
const [isShow, setIsShow] = useState(false);
|
|
259
260
|
const [optionsTemp, setOptionsTemp] = useState([]);
|
|
260
261
|
const selectConainter = useRef(null);
|
|
@@ -265,63 +266,64 @@ const AutoComplete = (props) => {
|
|
|
265
266
|
}
|
|
266
267
|
}, [value]);
|
|
267
268
|
useEffect(() => {
|
|
268
|
-
|
|
269
|
-
|
|
269
|
+
if (options && options.length > 0) {
|
|
270
|
+
const optionsOrigin = JSON.parse(JSON.stringify(options));
|
|
271
|
+
const regex = new RegExp(searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), 'gi');
|
|
272
|
+
const optionsFiltered = optionsOrigin.filter(o => { var _a; return (_a = o.label) === null || _a === void 0 ? void 0 : _a.match(regex); });
|
|
273
|
+
setOptionsTemp(optionsFiltered);
|
|
274
|
+
}
|
|
270
275
|
}, [options]);
|
|
276
|
+
useDebounce(() => { onChange && onChange(searchText); }, debounce, [searchText]);
|
|
271
277
|
const getCssClass = () => {
|
|
272
278
|
const cssClasses = [];
|
|
273
279
|
className && cssClasses.push(className);
|
|
274
|
-
cssClasses.push(styles$
|
|
280
|
+
cssClasses.push(styles$I.select);
|
|
275
281
|
return cssClasses.filter(r => r).join(' ');
|
|
276
282
|
};
|
|
277
283
|
const show = () => setIsShow(true);
|
|
278
284
|
const hide = () => setIsShow(false);
|
|
279
285
|
const handleOnClick = (option) => {
|
|
280
286
|
if (model !== option.value) {
|
|
281
|
-
|
|
287
|
+
onSelect && onSelect(option);
|
|
282
288
|
}
|
|
283
289
|
setModel(option.label);
|
|
284
290
|
hide();
|
|
285
291
|
};
|
|
286
292
|
const handleOnChange = (e) => {
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
setModel(searchText);
|
|
290
|
-
const regex = new RegExp(searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), 'gi');
|
|
291
|
-
const optionsFiltered = optionsOrigin.filter(o => { var _a; return (_a = o.label) === null || _a === void 0 ? void 0 : _a.match(regex); });
|
|
292
|
-
setOptionsTemp(optionsFiltered);
|
|
293
|
+
setModel(e.target.value);
|
|
294
|
+
setSearchText(e.target.value);
|
|
293
295
|
show();
|
|
294
296
|
};
|
|
295
297
|
const handleOnFocus = () => {
|
|
296
298
|
openOnFocus && show();
|
|
297
299
|
};
|
|
298
300
|
return (React.createElement(React.Fragment, null,
|
|
299
|
-
React.createElement("div", { ref: selectConainter, className: styles$
|
|
301
|
+
React.createElement("div", { ref: selectConainter, className: styles$I.selectContainer },
|
|
300
302
|
React.createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, value: model }),
|
|
301
303
|
isShow &&
|
|
302
304
|
React.createElement(React.Fragment, null,
|
|
303
|
-
React.createElement("div", { className: styles$
|
|
305
|
+
React.createElement("div", { className: styles$I.selectMenu },
|
|
304
306
|
React.createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React.createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option) },
|
|
305
307
|
React.createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
306
308
|
React.createElement(Backdrop, { isTransparent: true, onClick: () => hide() })))));
|
|
307
309
|
};
|
|
308
310
|
|
|
309
|
-
var css_248z$
|
|
310
|
-
var styles$
|
|
311
|
-
styleInject(css_248z$
|
|
311
|
+
var css_248z$H = ".Badge-module_badgeContainer__1QtTD {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle;\n}\n\n.Badge-module_badge__2Y_LO {\n top: 0;\n right: 0;\n transform: scale(1) translate(50%, -50%);\n transform-origin: 100% 0%;\n height: 20px;\n display: flex;\n padding: 0 6px;\n z-index: 1;\n position: absolute;\n flex-wrap: wrap;\n font-size: 0.75rem;\n min-width: 20px;\n align-items: center;\n font-weight: 500;\n line-height: 1;\n align-content: center;\n flex-direction: row;\n justify-content: center;\n border-radius: 10px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Badge-module_badge__2Y_LO.Badge-module_primary__2mn7_ {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Badge-module_badge__2Y_LO.Badge-module_accent__8Hg8z {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Badge-module_badge__2Y_LO.Badge-module_secondary__1QqDc {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Badge-module_badge__2Y_LO.Badge-module_light__3Z7JO {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Badge-module_badge__2Y_LO.Badge-module_dark__2qWe_ {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}";
|
|
312
|
+
var styles$H = {"badgeContainer":"Badge-module_badgeContainer__1QtTD","badge":"Badge-module_badge__2Y_LO","primary":"Badge-module_primary__2mn7_","accent":"Badge-module_accent__8Hg8z","secondary":"Badge-module_secondary__1QqDc","light":"Badge-module_light__3Z7JO","dark":"Badge-module_dark__2qWe_"};
|
|
313
|
+
styleInject(css_248z$H);
|
|
312
314
|
|
|
313
315
|
const Badge = (props) => {
|
|
314
316
|
const { children, content, className, color = COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
315
317
|
const getCssClassesBadgeContainer = () => {
|
|
316
318
|
const cssClasses = [];
|
|
317
|
-
cssClasses.push(styles$
|
|
319
|
+
cssClasses.push(styles$H.badgeContainer);
|
|
318
320
|
className && cssClasses.push(className);
|
|
319
321
|
return cssClasses.filter(css => css).join(' ');
|
|
320
322
|
};
|
|
321
323
|
const getCssClassesBadge = () => {
|
|
322
324
|
const cssClasses = [];
|
|
323
|
-
cssClasses.push(styles$
|
|
324
|
-
cssClasses.push(styles$
|
|
325
|
+
cssClasses.push(styles$H.badge);
|
|
326
|
+
cssClasses.push(styles$H[color]);
|
|
325
327
|
return cssClasses.filter(css => css).join(' ');
|
|
326
328
|
};
|
|
327
329
|
return (React.createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -329,43 +331,42 @@ const Badge = (props) => {
|
|
|
329
331
|
React.createElement("span", { className: getCssClassesBadge() }, content)));
|
|
330
332
|
};
|
|
331
333
|
|
|
332
|
-
var css_248z$
|
|
333
|
-
var styles$
|
|
334
|
-
styleInject(css_248z$
|
|
334
|
+
var css_248z$G = ".Icon-module_icon__2etAT {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px;\n}\n.Icon-module_icon__2etAT svg {\n width: inherit;\n height: inherit;\n}\n.Icon-module_icon__2etAT.Icon-module_primary__32Mh4 {\n color: var(--primary);\n}\n.Icon-module_icon__2etAT.Icon-module_accent__2U_no {\n color: var(--accent);\n}\n.Icon-module_icon__2etAT.Icon-module_secondary__3cMmx {\n color: var(--secondary);\n}\n.Icon-module_icon__2etAT.Icon-module_light__2SugS {\n color: var(--light);\n}\n.Icon-module_icon__2etAT.Icon-module_dark__GWMzb {\n color: var(--dark);\n}";
|
|
335
|
+
var styles$G = {"icon":"Icon-module_icon__2etAT","primary":"Icon-module_primary__32Mh4","accent":"Icon-module_accent__2U_no","secondary":"Icon-module_secondary__3cMmx","light":"Icon-module_light__2SugS","dark":"Icon-module_dark__GWMzb"};
|
|
336
|
+
styleInject(css_248z$G);
|
|
335
337
|
|
|
336
338
|
const Icon = (props) => {
|
|
337
339
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
338
340
|
const getCssClasses = () => {
|
|
339
341
|
const cssClasses = [];
|
|
340
|
-
cssClasses.push(styles$
|
|
341
|
-
iconColor && cssClasses.push(styles$
|
|
342
|
+
cssClasses.push(styles$G.icon);
|
|
343
|
+
iconColor && cssClasses.push(styles$G[iconColor]);
|
|
342
344
|
className && cssClasses.push(className);
|
|
343
345
|
return cssClasses.filter(css => css).join(' ');
|
|
344
346
|
};
|
|
345
347
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
346
348
|
};
|
|
347
349
|
|
|
348
|
-
var css_248z$
|
|
349
|
-
var styles$
|
|
350
|
-
styleInject(css_248z$
|
|
350
|
+
var css_248z$F = ".Button-module_button__3cIVZ {\n text-transform: uppercase !important;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius);\n box-shadow: var(--shadow);\n}\n\n.Button-module_btnContained__8Q4uL.Button-module_primary__2soUg {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Button-module_btnContained__8Q4uL.Button-module_primary__2soUg:hover {\n background-color: var(--primary-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_accent__1_cP6 {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Button-module_btnContained__8Q4uL.Button-module_accent__1_cP6:hover {\n background-color: var(--accent-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_secondary__psAvb {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Button-module_btnContained__8Q4uL.Button-module_secondary__psAvb:hover {\n background-color: var(--secondary-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_light__JVK1z {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Button-module_btnContained__8Q4uL.Button-module_light__JVK1z:hover {\n background-color: var(--light-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_dark__O89wU {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_dark__O89wU:hover {\n background-color: var(--dark-dark);\n}\n.Button-module_btnContained__8Q4uL:disabled:hover {\n cursor: not-allowed;\n}\n\n.Button-module_btnText__32H44 {\n box-shadow: none;\n text-decoration: none;\n}\n.Button-module_btnText__32H44.Button-module_primary__2soUg {\n color: var(--primary) !important;\n}\n.Button-module_btnText__32H44.Button-module_primary__2soUg:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_secondary__psAvb {\n color: var(--secondary) !important;\n}\n.Button-module_btnText__32H44.Button-module_secondary__psAvb:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_accent__1_cP6 {\n color: var(--accent) !important;\n}\n.Button-module_btnText__32H44.Button-module_accent__1_cP6:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important;\n}\n.Button-module_btnText__32H44.Button-module_light__JVK1z:hover {\n text-decoration: none;\n background: var(--light-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_dark__O89wU {\n color: var(--dark) !important;\n}\n.Button-module_btnText__32H44.Button-module_dark__O89wU:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important;\n}\n\n.Button-module_btnOutline__2drkn {\n box-shadow: none;\n text-decoration: none;\n}\n.Button-module_btnOutline__2drkn.Button-module_primary__2soUg {\n color: var(--primary) !important;\n border-color: var(--primary) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_primary__2soUg:hover {\n background: var(--primary-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_secondary__psAvb {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_secondary__psAvb:hover {\n background: var(--secondary-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_accent__1_cP6 {\n color: var(--accent) !important;\n border-color: var(--accent) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_accent__1_cP6:hover {\n background: var(--accent-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_light__JVK1z:hover {\n background: var(--light-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_dark__O89wU {\n color: var(--dark) !important;\n border-color: var(--dark) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_dark__O89wU:hover {\n background: var(--dark-highlight) !important;\n}\n\n.Button-module_startIcon__1TN-G {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px;\n}\n.Button-module_startIcon__1TN-G svg {\n width: 18px;\n height: 18px;\n}\n\n.Button-module_endIcon__3uZjE {\n display: inherit;\n margin-left: 8px;\n}\n.Button-module_endIcon__3uZjE svg {\n width: 18px;\n height: 18px;\n}";
|
|
351
|
+
var styles$F = {"button":"Button-module_button__3cIVZ","btnContained":"Button-module_btnContained__8Q4uL","primary":"Button-module_primary__2soUg","accent":"Button-module_accent__1_cP6","secondary":"Button-module_secondary__psAvb","light":"Button-module_light__JVK1z","dark":"Button-module_dark__O89wU","btnText":"Button-module_btnText__32H44","btnOutline":"Button-module_btnOutline__2drkn","startIcon":"Button-module_startIcon__1TN-G","endIcon":"Button-module_endIcon__3uZjE"};
|
|
352
|
+
styleInject(css_248z$F);
|
|
351
353
|
|
|
352
354
|
const ButtonTemplate = (props) => {
|
|
353
355
|
const { children, variant = VARIANT.contained, color = COLOR.primary, isRounded, isActive, className, startIcon, endIcon } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon"]);
|
|
354
356
|
const getCssClasses = () => {
|
|
355
357
|
const cssClasses = [];
|
|
356
|
-
cssClasses.push(
|
|
357
|
-
cssClasses.push(styles$E.button);
|
|
358
|
+
cssClasses.push(styles$F.button);
|
|
358
359
|
if (variant !== 'outline' && variant !== 'text') {
|
|
359
|
-
cssClasses.push(styles$
|
|
360
|
-
cssClasses.push(styles$
|
|
360
|
+
cssClasses.push(styles$F.btnContained);
|
|
361
|
+
cssClasses.push(styles$F[color]);
|
|
361
362
|
}
|
|
362
363
|
if (variant === 'outline') {
|
|
363
|
-
cssClasses.push(styles$
|
|
364
|
-
cssClasses.push(styles$
|
|
364
|
+
cssClasses.push(styles$F.btnOutline);
|
|
365
|
+
cssClasses.push(styles$F[color]);
|
|
365
366
|
}
|
|
366
367
|
if (variant === 'text') {
|
|
367
|
-
cssClasses.push(styles$
|
|
368
|
-
cssClasses.push(styles$
|
|
368
|
+
cssClasses.push(styles$F.btnText);
|
|
369
|
+
cssClasses.push(styles$F[color]);
|
|
369
370
|
}
|
|
370
371
|
if (isRounded && variant !== 'text') {
|
|
371
372
|
cssClasses.push(`rounded-pill`);
|
|
@@ -379,28 +380,32 @@ const ButtonTemplate = (props) => {
|
|
|
379
380
|
return (React.createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
380
381
|
React.createElement("span", { className: "d-flex justify-content-center" },
|
|
381
382
|
startIcon &&
|
|
382
|
-
React.createElement(Icon, { className: styles$
|
|
383
|
+
React.createElement(Icon, { className: styles$F.startIcon }, startIcon),
|
|
383
384
|
children,
|
|
384
385
|
endIcon &&
|
|
385
|
-
React.createElement(Icon, { className: styles$
|
|
386
|
+
React.createElement(Icon, { className: styles$F.endIcon }, endIcon))));
|
|
386
387
|
};
|
|
387
388
|
|
|
388
389
|
const Button = (props) => {
|
|
389
390
|
return (React.createElement(ButtonTemplate, Object.assign({}, props)));
|
|
390
391
|
};
|
|
391
392
|
|
|
393
|
+
var css_248z$E = ".ButtonGroup-module_buttonGroup__2RS71 button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.ButtonGroup-module_buttonGroup__2RS71 button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}";
|
|
394
|
+
var styles$E = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
395
|
+
styleInject(css_248z$E);
|
|
396
|
+
|
|
392
397
|
const ButtonGroup = (props) => {
|
|
393
398
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
394
399
|
const getCssClasses = () => {
|
|
395
400
|
const cssClasses = [];
|
|
396
|
-
cssClasses.push(
|
|
401
|
+
cssClasses.push(styles$E.buttonGroup);
|
|
397
402
|
className && cssClasses.push(className);
|
|
398
403
|
return cssClasses.filter(css => css).join(' ');
|
|
399
404
|
};
|
|
400
405
|
return (React.createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
401
406
|
};
|
|
402
407
|
|
|
403
|
-
var css_248z$D = ".Breadcrumb-module_breadcrumb__2BHXS {\n display: flex;\n flex-wrap: wrap;\n padding: 0.75rem 1rem;\n margin-bottom: 0;\n list-style: none;\n border-radius: var(--borderRadius)
|
|
408
|
+
var css_248z$D = ".Breadcrumb-module_breadcrumb__2BHXS {\n display: flex;\n flex-wrap: wrap;\n padding: 0.75rem 1rem;\n margin-bottom: 0;\n list-style: none;\n border-radius: var(--borderRadius);\n}";
|
|
404
409
|
var styles$D = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
405
410
|
styleInject(css_248z$D);
|
|
406
411
|
|
|
@@ -418,7 +423,7 @@ const Breadcrumb = (props) => {
|
|
|
418
423
|
|
|
419
424
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
420
425
|
|
|
421
|
-
var css_248z$C = ".BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D {\n padding-left: 0.5rem
|
|
426
|
+
var css_248z$C = ".BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D {\n padding-left: 0.5rem;\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\";\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D a:not([href]):not([class]) {\n color: var(--primary);\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D:hover {\n cursor: pointer;\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D.BreadcrumbItem-module_active__3iVU2:hover {\n cursor: unset;\n}";
|
|
422
427
|
var styles$C = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
423
428
|
styleInject(css_248z$C);
|
|
424
429
|
|
|
@@ -440,7 +445,7 @@ const BreadcrumbItem = (props) => {
|
|
|
440
445
|
wrapper: label => React.createElement("a", null, label) }, children)));
|
|
441
446
|
};
|
|
442
447
|
|
|
443
|
-
var css_248z$B = ".Card-module_card__31o3Z {\n background: var(--white);\n border-radius: var(--borderRadius)
|
|
448
|
+
var css_248z$B = ".Card-module_card__31o3Z {\n background: var(--white);\n border-radius: var(--borderRadius);\n}\n.Card-module_card__31o3Z.Card-module_shadow__2lpYq {\n box-shadow: var(--shadow);\n}";
|
|
444
449
|
var styles$B = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
445
450
|
styleInject(css_248z$B);
|
|
446
451
|
|
|
@@ -456,7 +461,7 @@ const Card = (props) => {
|
|
|
456
461
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
457
462
|
};
|
|
458
463
|
|
|
459
|
-
var css_248z$A = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem
|
|
464
|
+
var css_248z$A = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
460
465
|
var styles$A = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
461
466
|
styleInject(css_248z$A);
|
|
462
467
|
|
|
@@ -471,7 +476,7 @@ const CardBody = (props) => {
|
|
|
471
476
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
472
477
|
};
|
|
473
478
|
|
|
474
|
-
var css_248z$z = ".CardFooter-module_cardFooter__3dYKa {\n padding: 0.75rem 1.25rem;\n background-color: rgba(0, 0, 0, 0.03);\n border-top: 1px solid rgba(0, 0, 0, 0.125)
|
|
479
|
+
var css_248z$z = ".CardFooter-module_cardFooter__3dYKa {\n padding: 0.75rem 1.25rem;\n background-color: rgba(0, 0, 0, 0.03);\n border-top: 1px solid rgba(0, 0, 0, 0.125);\n}\n.CardFooter-module_cardFooter__3dYKa:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);\n}";
|
|
475
480
|
var styles$z = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
476
481
|
styleInject(css_248z$z);
|
|
477
482
|
|
|
@@ -486,7 +491,7 @@ const CardFooter = (props) => {
|
|
|
486
491
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
487
492
|
};
|
|
488
493
|
|
|
489
|
-
var css_248z$y = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important
|
|
494
|
+
var css_248z$y = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important;\n}";
|
|
490
495
|
var styles$y = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
491
496
|
styleInject(css_248z$y);
|
|
492
497
|
|
|
@@ -501,7 +506,7 @@ const CardSubtitle = (props) => {
|
|
|
501
506
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
502
507
|
};
|
|
503
508
|
|
|
504
|
-
var css_248z$x = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0
|
|
509
|
+
var css_248z$x = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0;\n}";
|
|
505
510
|
var styles$x = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
506
511
|
styleInject(css_248z$x);
|
|
507
512
|
|
|
@@ -516,7 +521,7 @@ const CardText = (props) => {
|
|
|
516
521
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
517
522
|
};
|
|
518
523
|
|
|
519
|
-
var css_248z$w = ".CardTitle-module_cardTitle__24Amb {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em
|
|
524
|
+
var css_248z$w = ".CardTitle-module_cardTitle__24Amb {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em;\n}";
|
|
520
525
|
var styles$w = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
521
526
|
styleInject(css_248z$w);
|
|
522
527
|
|
|
@@ -531,7 +536,7 @@ const CardTitle = (props) => {
|
|
|
531
536
|
return (React.createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
532
537
|
};
|
|
533
538
|
|
|
534
|
-
var css_248z$v = ".CardImage-module_cardImage__1tZM4 {\n flex-shrink: 0;\n width: 100%;\n border-top-left-radius: calc(0.25rem - 1px);\n border-top-right-radius: calc(0.25rem - 1px)
|
|
539
|
+
var css_248z$v = ".CardImage-module_cardImage__1tZM4 {\n flex-shrink: 0;\n width: 100%;\n border-top-left-radius: calc(0.25rem - 1px);\n border-top-right-radius: calc(0.25rem - 1px);\n}";
|
|
535
540
|
var styles$v = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
536
541
|
styleInject(css_248z$v);
|
|
537
542
|
|
|
@@ -588,7 +593,7 @@ const CircleSolidIcon = () => (React.createElement("svg", { "aria-hidden": "true
|
|
|
588
593
|
const ChevronLeftSolidIcon = () => (React.createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
589
594
|
React.createElement("path", { fill: "currentColor", d: "M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z" })));
|
|
590
595
|
|
|
591
|
-
var css_248z$u = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important
|
|
596
|
+
var css_248z$u = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important;\n}";
|
|
592
597
|
var styles$u = {"typography":"Typography-module_typography__2bM6E"};
|
|
593
598
|
styleInject(css_248z$u);
|
|
594
599
|
|
|
@@ -607,7 +612,7 @@ const Typography = (_a) => {
|
|
|
607
612
|
return (React.createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
608
613
|
};
|
|
609
614
|
|
|
610
|
-
var css_248z$t = ".IconButton-module_iconButton__1xqrL {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none
|
|
615
|
+
var css_248z$t = ".IconButton-module_iconButton__1xqrL {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none;\n}\n.IconButton-module_iconButton__1xqrL:hover {\n cursor: pointer;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_shadow__5U4-_ {\n box-shadow: var(--shadow);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_md__1lmDL {\n width: 48px;\n height: 48px;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_lg__1O2Uy {\n width: 56px;\n height: 56px;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG {\n padding: 0;\n background: transparent;\n color: inherit;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_active__2tJut {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T.IconButton-module_active__2tJut {\n color: var(--primary);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL.IconButton-module_active__2tJut {\n color: var(--secondary);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t.IconButton-module_active__2tJut {\n color: var(--accent);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD.IconButton-module_active__2tJut {\n color: var(--light);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_dark__1e6bR {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_disabled__3TgpF {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_active__2tJut {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T {\n background-color: var(--primary);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T.IconButton-module_active__2tJut {\n background-color: var(--primary-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL {\n background-color: var(--secondary);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL.IconButton-module_active__2tJut {\n background-color: var(--secondary-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t {\n background-color: var(--accent);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t.IconButton-module_active__2tJut {\n background-color: var(--accent-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD {\n background-color: var(--light);\n color: var(--dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD.IconButton-module_active__2tJut {\n background-color: var(--light-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR {\n background-color: var(--dark);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR.IconButton-module_active__2tJut {\n background-color: var(--dark-light);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_disabled__3TgpF {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none;\n}";
|
|
611
616
|
var styles$t = {"iconButton":"IconButton-module_iconButton__1xqrL","shadow":"IconButton-module_shadow__5U4-_","md":"IconButton-module_md__1lmDL","lg":"IconButton-module_lg__1O2Uy","text":"IconButton-module_text__33RrG","active":"IconButton-module_active__2tJut","primary":"IconButton-module_primary__qRw4T","secondary":"IconButton-module_secondary__1lzNL","accent":"IconButton-module_accent__exm5t","light":"IconButton-module_light__2nWhD","dark":"IconButton-module_dark__1e6bR","disabled":"IconButton-module_disabled__3TgpF","contained":"IconButton-module_contained__gWulJ"};
|
|
612
617
|
styleInject(css_248z$t);
|
|
613
618
|
|
|
@@ -630,7 +635,7 @@ const IconButton = (props) => {
|
|
|
630
635
|
label && React.createElement(Typography, null, label)));
|
|
631
636
|
};
|
|
632
637
|
|
|
633
|
-
var css_248z$s = ".Checkbox-module_checkboxContainer__2oWhu {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
638
|
+
var css_248z$s = ".Checkbox-module_checkboxContainer__2oWhu {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Checkbox-module_checkboxContainer__2oWhu label {\n margin-bottom: 0;\n margin-left: 0;\n}\n.Checkbox-module_checkboxContainer__2oWhu label:hover {\n cursor: pointer;\n}\n\n.Checkbox-module_checkboxLabel__27Y6U.Checkbox-module_disabled__3EXUd {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed;\n}";
|
|
634
639
|
var styles$s = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
635
640
|
styleInject(css_248z$s);
|
|
636
641
|
|
|
@@ -673,7 +678,7 @@ const Checkbox = (props) => {
|
|
|
673
678
|
React.createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
674
679
|
};
|
|
675
680
|
|
|
676
|
-
var css_248z$r = ".Chip-module_chip__1cghp {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1
|
|
681
|
+
var css_248z$r = ".Chip-module_chip__1cghp {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1;\n}\n.Chip-module_chip__1cghp svg {\n width: 18px;\n height: 18px;\n}\n.Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c {\n margin-left: 5px;\n}\n.Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c:hover {\n cursor: pointer;\n}\n.Chip-module_chip__1cghp.Chip-module_primary__198Dq {\n background: var(--primary);\n color: var(--primary-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_secondary__14H0b {\n background: var(--secondary);\n color: var(--secondary-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_accent__2LkWr {\n background: var(--accent);\n color: var(--accent-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_light__2zVYs {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Chip-module_chip__1cghp.Chip-module_dark__2Bg-S {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover {\n cursor: pointer;\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_primary__198Dq {\n background: var(--primary-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_secondary__14H0b {\n background: var(--secondary-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_accent__2LkWr {\n background: var(--accent-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_shadow__3TYny {\n box-shadow: var(--shadow);\n}";
|
|
677
682
|
var styles$r = {"chip":"Chip-module_chip__1cghp","deleteIcon":"Chip-module_deleteIcon__34X9c","primary":"Chip-module_primary__198Dq","secondary":"Chip-module_secondary__14H0b","accent":"Chip-module_accent__2LkWr","light":"Chip-module_light__2zVYs","dark":"Chip-module_dark__2Bg-S","clickable":"Chip-module_clickable__2Y4x7","shadow":"Chip-module_shadow__3TYny"};
|
|
678
683
|
styleInject(css_248z$r);
|
|
679
684
|
|
|
@@ -730,7 +735,7 @@ const FileInput = (props) => {
|
|
|
730
735
|
React.createElement("input", Object.assign({ type: "file", ref: inputFileElement, className: getCssClasses(), id: id, name: name, multiple: multiple, accept: accept, disabled: disabled, readOnly: readOnly, hidden: true, onChange: handleOnChange, value: model }, rest))));
|
|
731
736
|
};
|
|
732
737
|
|
|
733
|
-
var css_248z$q = ".Select-module_selectContainer__2oizY {\n position: relative
|
|
738
|
+
var css_248z$q = ".Select-module_selectContainer__2oizY {\n position: relative;\n}\n\n.Select-module_select__MSqgU {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n}\n.Select-module_select__MSqgU:hover {\n cursor: pointer;\n}\n\n.Select-module_selectMenu__2vhJt {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 2px;\n z-index: 1112;\n max-height: 280px;\n overflow: auto;\n}";
|
|
734
739
|
var styles$q = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
735
740
|
styleInject(css_248z$q);
|
|
736
741
|
|
|
@@ -880,7 +885,7 @@ const Select = (props) => {
|
|
|
880
885
|
React.createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
881
886
|
};
|
|
882
887
|
|
|
883
|
-
var css_248z$p = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical
|
|
888
|
+
var css_248z$p = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical;\n}\ntextarea:focus {\n outline: none !important;\n border-color: var(--primary);\n}";
|
|
884
889
|
var styles$p = {};
|
|
885
890
|
styleInject(css_248z$p);
|
|
886
891
|
|
|
@@ -1244,7 +1249,7 @@ const DateSelect = (props) => {
|
|
|
1244
1249
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1245
1250
|
// };
|
|
1246
1251
|
|
|
1247
|
-
var css_248z$o = ".Drawer-module_drawer__36R2P {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto
|
|
1252
|
+
var css_248z$o = ".Drawer-module_drawer__36R2P {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_permanent__AW5Df {\n position: inherit;\n z-index: 0;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_left__1KKcY {\n order: 0;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_right__2gESb {\n order: 2;\n}\n\n.Drawer-module_drawerOpen__euFdW {\n overflow: hidden;\n}";
|
|
1248
1253
|
var styles$o = {"drawer":"Drawer-module_drawer__36R2P","permanent":"Drawer-module_permanent__AW5Df","left":"Drawer-module_left__1KKcY","right":"Drawer-module_right__2gESb","drawerOpen":"Drawer-module_drawerOpen__euFdW"};
|
|
1249
1254
|
styleInject(css_248z$o);
|
|
1250
1255
|
|
|
@@ -1283,7 +1288,7 @@ const DrawerContent = (props) => {
|
|
|
1283
1288
|
return (React.createElement("div", { className: getCssClasses(), style: getStyles() }, children));
|
|
1284
1289
|
};
|
|
1285
1290
|
|
|
1286
|
-
var css_248z$n = ".MenuBody-module_menuBody__3cPsp {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius)
|
|
1291
|
+
var css_248z$n = ".MenuBody-module_menuBody__3cPsp {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius);\n}\n.MenuBody-module_menuBody__3cPsp.MenuBody-module_shadow__AF_9C {\n box-shadow: var(--shadow);\n}";
|
|
1287
1292
|
var styles$n = {"menuBody":"MenuBody-module_menuBody__3cPsp","shadow":"MenuBody-module_shadow__AF_9C"};
|
|
1288
1293
|
styleInject(css_248z$n);
|
|
1289
1294
|
|
|
@@ -1328,7 +1333,7 @@ const MenuBody = (props) => {
|
|
|
1328
1333
|
React.createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1329
1334
|
};
|
|
1330
1335
|
|
|
1331
|
-
var css_248z$m = ".Menu-module_menu__23BYG {\n display: flex
|
|
1336
|
+
var css_248z$m = ".Menu-module_menu__23BYG {\n display: flex;\n}";
|
|
1332
1337
|
var styles$m = {"menu":"Menu-module_menu__23BYG"};
|
|
1333
1338
|
styleInject(css_248z$m);
|
|
1334
1339
|
|
|
@@ -1351,7 +1356,7 @@ const Menu = (props) => {
|
|
|
1351
1356
|
React.createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1352
1357
|
};
|
|
1353
1358
|
|
|
1354
|
-
var css_248z$l = ".MenuItem-module_menuItem__kvauR {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0
|
|
1359
|
+
var css_248z$l = ".MenuItem-module_menuItem__kvauR {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0;\n}\n.MenuItem-module_menuItem__kvauR.MenuItem-module_menuItemHeader__mp7wc {\n margin-bottom: 0;\n font-size: 0.875rem;\n}\n.MenuItem-module_menuItem__kvauR:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04);\n}";
|
|
1355
1360
|
var styles$l = {"menuItem":"MenuItem-module_menuItem__kvauR","menuItemHeader":"MenuItem-module_menuItemHeader__mp7wc"};
|
|
1356
1361
|
styleInject(css_248z$l);
|
|
1357
1362
|
|
|
@@ -1379,13 +1384,13 @@ const MenuToggle = ({ children }) => {
|
|
|
1379
1384
|
return (React.createElement(Fragment, null, children));
|
|
1380
1385
|
};
|
|
1381
1386
|
|
|
1382
|
-
var css_248z$k = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef
|
|
1387
|
+
var css_248z$k = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef;\n}";
|
|
1383
1388
|
var styles$k = {"menuItemDivider":"MenuDivider-module_menuItemDivider__JnLsC"};
|
|
1384
1389
|
styleInject(css_248z$k);
|
|
1385
1390
|
|
|
1386
1391
|
const MenuDivider = () => React.createElement("div", { className: styles$k.menuItemDivider });
|
|
1387
1392
|
|
|
1388
|
-
var css_248z$j = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px
|
|
1393
|
+
var css_248z$j = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px;\n}";
|
|
1389
1394
|
var styles$j = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__3H62L"};
|
|
1390
1395
|
styleInject(css_248z$j);
|
|
1391
1396
|
|
|
@@ -1393,7 +1398,7 @@ const ExpansionPanelContent = ({ children }) => {
|
|
|
1393
1398
|
return (React.createElement("div", { className: styles$j.expansionPanelContent }, children));
|
|
1394
1399
|
};
|
|
1395
1400
|
|
|
1396
|
-
var css_248z$i = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px
|
|
1401
|
+
var css_248z$i = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px;\n}\n.ExpansionPanelHeader-module_expansionPanelHeader__3hrsI:hover {\n cursor: pointer;\n background-color: var(--highlight);\n}";
|
|
1397
1402
|
var styles$i = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__3hrsI"};
|
|
1398
1403
|
styleInject(css_248z$i);
|
|
1399
1404
|
|
|
@@ -1409,7 +1414,7 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1409
1414
|
React.createElement(Icon, null, isExpanded ? React.createElement(ChevronUpSolidIcon, null) : React.createElement(ChevronDownSolidIcon, null)))));
|
|
1410
1415
|
};
|
|
1411
1416
|
|
|
1412
|
-
var css_248z$h = ".ExpansionPanel-module_expansionPanel__3krcE {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out
|
|
1417
|
+
var css_248z$h = ".ExpansionPanel-module_expansionPanel__3krcE {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n}\n.ExpansionPanel-module_expansionPanel__3krcE:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__3krcE:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt {\n margin: 16px 0;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:first-child {\n margin-top: 0;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:last-child {\n margin-bottom: 0;\n}";
|
|
1413
1418
|
var styles$h = {"expansionPanel":"ExpansionPanel-module_expansionPanel__3krcE","isExpanded":"ExpansionPanel-module_isExpanded__1m4Dt"};
|
|
1414
1419
|
styleInject(css_248z$h);
|
|
1415
1420
|
|
|
@@ -1437,7 +1442,7 @@ const ExpansionPanel = (props) => {
|
|
|
1437
1442
|
React.createElement(ExpansionPanelContent, null, children)));
|
|
1438
1443
|
};
|
|
1439
1444
|
|
|
1440
|
-
var css_248z$g = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow)
|
|
1445
|
+
var css_248z$g = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow);\n}\n.FloatingActionButton-module_fab__3GwiH.FloatingActionButton-module_fixed__17qrv {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000;\n}";
|
|
1441
1446
|
var styles$g = {"fab":"FloatingActionButton-module_fab__3GwiH","fixed":"FloatingActionButton-module_fixed__17qrv"};
|
|
1442
1447
|
styleInject(css_248z$g);
|
|
1443
1448
|
|
|
@@ -1508,7 +1513,7 @@ const Link = (props) => {
|
|
|
1508
1513
|
return (React.createElement("a", { className: getCssClasses(), href: url || '#', target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, children));
|
|
1509
1514
|
};
|
|
1510
1515
|
|
|
1511
|
-
var css_248z$f = ".LoadingIndicator-module_loadingIndicatorContainer__3e1-3 {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100
|
|
1516
|
+
var css_248z$f = ".LoadingIndicator-module_loadingIndicatorContainer__3e1-3 {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.LoadingIndicator-module_loadingIndicator__tvp5i {\n animation-name: LoadingIndicator-module_spinAnimation__PKRNn;\n animation-duration: 5000ms;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n width: 24px;\n height: 24px;\n}\n\n@keyframes LoadingIndicator-module_spinAnimation__PKRNn {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}";
|
|
1512
1517
|
var styles$f = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__3e1-3","loadingIndicator":"LoadingIndicator-module_loadingIndicator__tvp5i","spinAnimation":"LoadingIndicator-module_spinAnimation__PKRNn"};
|
|
1513
1518
|
styleInject(css_248z$f);
|
|
1514
1519
|
|
|
@@ -1555,7 +1560,7 @@ class LoadingIndicatorService {
|
|
|
1555
1560
|
}
|
|
1556
1561
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1557
1562
|
|
|
1558
|
-
var css_248z$e = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center
|
|
1563
|
+
var css_248z$e = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center;\n}";
|
|
1559
1564
|
var styles$e = {"modalHeader":"ModalHeader-module_modalHeader__o5HzE"};
|
|
1560
1565
|
styleInject(css_248z$e);
|
|
1561
1566
|
|
|
@@ -1572,23 +1577,24 @@ const ModalHeader = (props) => {
|
|
|
1572
1577
|
|
|
1573
1578
|
const ModalBody = ({ children }) => (React.createElement("div", { className: "modal-body" }, children));
|
|
1574
1579
|
|
|
1575
|
-
var css_248z$d = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius)
|
|
1576
|
-
var styles$d = {"modal":"Modal-module_modal__1NdMJ","fullscreen":"Modal-module_fullscreen__3R-sM","modalContent":"Modal-module_modalContent__E2kaP","modal-dialog":"Modal-module_modal-dialog__IdJ1c"};
|
|
1580
|
+
var css_248z$d = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius);\n}\n.Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0;\n}\n.Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM .Modal-module_modalContent__E2kaP {\n height: auto;\n min-height: 100%;\n max-height: 100%;\n border-radius: 0;\n overflow: auto;\n}\n@media (min-width: 320px) {\n .Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n max-width: 100% !important;\n }\n}\n.Modal-module_modal__1NdMJ .Modal-module_sm__3UfYB {\n max-width: 300px;\n}\n.Modal-module_modal__1NdMJ .Modal-module_md__2uX1a {\n max-width: 500px;\n}\n.Modal-module_modal__1NdMJ .Modal-module_lg__3ux_V {\n max-width: 1140px;\n}\n@media (min-width: 576px) {\n .Modal-module_modal__1NdMJ .Modal-module_modal-dialog__IdJ1c {\n max-width: 600px;\n }\n}";
|
|
1581
|
+
var styles$d = {"modal":"Modal-module_modal__1NdMJ","fullscreen":"Modal-module_fullscreen__3R-sM","modalContent":"Modal-module_modalContent__E2kaP","sm":"Modal-module_sm__3UfYB","md":"Modal-module_md__2uX1a","lg":"Modal-module_lg__3ux_V","modal-dialog":"Modal-module_modal-dialog__IdJ1c"};
|
|
1577
1582
|
styleInject(css_248z$d);
|
|
1578
1583
|
|
|
1579
|
-
var css_248z$c = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none
|
|
1584
|
+
var css_248z$c = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none;\n}";
|
|
1580
1585
|
var styles$c = {"modalFooter":"ModalFooter-module_modalFooter__2Et4e"};
|
|
1581
1586
|
styleInject(css_248z$c);
|
|
1582
1587
|
|
|
1583
1588
|
const ModalFooter = ({ children }) => (React.createElement("div", { className: "modal-footer " + styles$c.modalFooter }, children));
|
|
1584
1589
|
|
|
1585
1590
|
const Modal = (props) => {
|
|
1586
|
-
const { className, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1591
|
+
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1587
1592
|
const getCssClass = () => {
|
|
1588
1593
|
const cssClasses = [];
|
|
1589
1594
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1590
1595
|
cssClasses.push(styles$d.modal);
|
|
1591
1596
|
!!fullScreen && cssClasses.push(styles$d['fullscreen']);
|
|
1597
|
+
size && cssClasses.push(styles$d[size]);
|
|
1592
1598
|
className && cssClasses.push(className);
|
|
1593
1599
|
return cssClasses.filter(r => r).join(' ');
|
|
1594
1600
|
};
|
|
@@ -1630,7 +1636,7 @@ var MODALBUTTONTYPE;
|
|
|
1630
1636
|
const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismissable = false, buttons = [
|
|
1631
1637
|
{ label: 'Cancel', type: MODALBUTTONTYPE.CANCEL, color: COLOR.secondary, variant: VARIANT.text, focus: true },
|
|
1632
1638
|
{ label: 'Ok', type: MODALBUTTONTYPE.OK, variant: VARIANT.contained },
|
|
1633
|
-
], fullScreen = false }) => {
|
|
1639
|
+
], size = SIZE.md, fullScreen = false }) => {
|
|
1634
1640
|
// workaround for getDerivedStateFromProps
|
|
1635
1641
|
const [myControls, setMyControls] = useState(null);
|
|
1636
1642
|
useEffect(() => {
|
|
@@ -1668,7 +1674,7 @@ const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismi
|
|
|
1668
1674
|
}
|
|
1669
1675
|
button.handler && button.handler();
|
|
1670
1676
|
};
|
|
1671
|
-
return (React.createElement(Modal, { fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, isDismissable: isDismissable, footer: React.createElement(Fragment, null, buttons.map((button, index) => (React.createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, onClick: () => handleClickButton(button) }, button.label)))) },
|
|
1677
|
+
return (React.createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, isDismissable: isDismissable, footer: React.createElement(Fragment, null, buttons.map((button, index) => (React.createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, onClick: () => handleClickButton(button) }, button.label)))) },
|
|
1672
1678
|
description && React.createElement("div", null, description),
|
|
1673
1679
|
modalType === MODALTYPE.FORM &&
|
|
1674
1680
|
React.createElement(Fragment, null,
|
|
@@ -1689,7 +1695,7 @@ class ModalService {
|
|
|
1689
1695
|
reject();
|
|
1690
1696
|
this.hide();
|
|
1691
1697
|
};
|
|
1692
|
-
render(React.createElement(GlobalModal, { fullScreen: options && options.fullScreen, title: title, description: description, formControls: options && options.formControls, onCancel: handleCancel, onOk: handleOk, isDismissable: options && options.isDismissable, buttons: options && options.buttons }), this.container);
|
|
1698
|
+
render(React.createElement(GlobalModal, { fullScreen: options && options.fullScreen, size: options && options.size, title: title, description: description, formControls: options && options.formControls, onCancel: handleCancel, onOk: handleOk, isDismissable: options && options.isDismissable, buttons: options && options.buttons }), this.container);
|
|
1693
1699
|
}
|
|
1694
1700
|
});
|
|
1695
1701
|
}
|
|
@@ -1804,7 +1810,7 @@ const Sidebar = (props) => {
|
|
|
1804
1810
|
!item.isCollapsed && item.items && item.items.length > 0 && (React.createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React.createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
|
|
1805
1811
|
};
|
|
1806
1812
|
|
|
1807
|
-
var css_248z$b = ".Snackbar-module_snackbar__3AF3D {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__11jAv 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius)
|
|
1813
|
+
var css_248z$b = ".Snackbar-module_snackbar__3AF3D {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__11jAv 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_primary__3Pt9m {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_accent__1iCXk {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_secondary__3ke12 {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_light__3Pi0Y {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_dark__3TwXn {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n\n.Snackbar-module_text__2gmW- {\n width: 100%;\n padding: 8px 0;\n}\n\n.Snackbar-module_action__1BXqS {\n margin-left: auto;\n}\n.Snackbar-module_action__1BXqS:hover {\n cursor: pointer;\n}\n\n@keyframes Snackbar-module_bounceIn__11jAv {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0.9;\n }\n 80% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n }\n}";
|
|
1808
1814
|
var styles$b = {"snackbar":"Snackbar-module_snackbar__3AF3D","bounceIn":"Snackbar-module_bounceIn__11jAv","primary":"Snackbar-module_primary__3Pt9m","accent":"Snackbar-module_accent__1iCXk","secondary":"Snackbar-module_secondary__3ke12","light":"Snackbar-module_light__3Pi0Y","dark":"Snackbar-module_dark__3TwXn","text":"Snackbar-module_text__2gmW-","action":"Snackbar-module_action__1BXqS"};
|
|
1809
1815
|
styleInject(css_248z$b);
|
|
1810
1816
|
|
|
@@ -1860,7 +1866,7 @@ class SnackbarService {
|
|
|
1860
1866
|
}
|
|
1861
1867
|
const snackbarService = new SnackbarService();
|
|
1862
1868
|
|
|
1863
|
-
var css_248z$a = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto
|
|
1869
|
+
var css_248z$a = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto;\n}";
|
|
1864
1870
|
var styles$a = {"speedDialActions":"SpeedDialActions-module_speedDialActions__zLEps"};
|
|
1865
1871
|
styleInject(css_248z$a);
|
|
1866
1872
|
|
|
@@ -1874,7 +1880,7 @@ const SpeedDialActions = (props) => {
|
|
|
1874
1880
|
return (React.createElement("div", { className: getCssClasses() }, children));
|
|
1875
1881
|
};
|
|
1876
1882
|
|
|
1877
|
-
var css_248z$9 = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
1883
|
+
var css_248z$9 = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
|
|
1878
1884
|
var styles$9 = {"speedDial":"SpeedDial-module_speedDial__CQ5x2"};
|
|
1879
1885
|
styleInject(css_248z$9);
|
|
1880
1886
|
|
|
@@ -1899,7 +1905,7 @@ const SpeedDial = (props) => {
|
|
|
1899
1905
|
React.createElement(SpeedDialActions, null, children)));
|
|
1900
1906
|
};
|
|
1901
1907
|
|
|
1902
|
-
var css_248z$8 = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px
|
|
1908
|
+
var css_248z$8 = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px;\n}";
|
|
1903
1909
|
var styles$8 = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs"};
|
|
1904
1910
|
styleInject(css_248z$8);
|
|
1905
1911
|
|
|
@@ -1924,7 +1930,7 @@ const SpeedDialIcon = (props) => {
|
|
|
1924
1930
|
return (React.createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
1925
1931
|
};
|
|
1926
1932
|
|
|
1927
|
-
var css_248z$7 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex
|
|
1933
|
+
var css_248z$7 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex;\n}";
|
|
1928
1934
|
var styles$7 = {"stepperActions":"StepperActions-module_stepperActions__2r5ZT"};
|
|
1929
1935
|
styleInject(css_248z$7);
|
|
1930
1936
|
|
|
@@ -1949,7 +1955,7 @@ const StepPanel = (props) => {
|
|
|
1949
1955
|
return (React.createElement("div", { className: "steppanel" }, children));
|
|
1950
1956
|
};
|
|
1951
1957
|
|
|
1952
|
-
var css_248z$6 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px
|
|
1958
|
+
var css_248z$6 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px;\n}\n\n.StepConnector-module_stepConnectorLine__jSqG4 {\n display: block;\n border-color: var(--secondary);\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.StepConnector-module_stepConnectorLine__jSqG4.StepConnector-module_isActive__3Yj6N {\n border-color: var(--primary);\n}\n\n.StepConnector-module_stepConnectorLineHorizontal__3R2R8 {\n border-top-style: solid;\n border-top-width: 1px;\n}";
|
|
1953
1959
|
var styles$6 = {"stepConnector":"StepConnector-module_stepConnector__2m7Xp","stepConnectorLine":"StepConnector-module_stepConnectorLine__jSqG4","isActive":"StepConnector-module_isActive__3Yj6N","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__3R2R8"};
|
|
1954
1960
|
styleInject(css_248z$6);
|
|
1955
1961
|
|
|
@@ -1971,7 +1977,7 @@ const StepConnector = (props) => {
|
|
|
1971
1977
|
React.createElement("div", { className: getCssClassesLine() })));
|
|
1972
1978
|
};
|
|
1973
1979
|
|
|
1974
|
-
var css_248z$5 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px
|
|
1980
|
+
var css_248z$5 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px;\n}\n.Stepper-module_stepper__1TOxM.Stepper-module_isHorizontal__3rFHH {\n overflow-x: auto;\n}";
|
|
1975
1981
|
var styles$5 = {"stepper":"Stepper-module_stepper__1TOxM","isHorizontal":"Stepper-module_isHorizontal__3rFHH"};
|
|
1976
1982
|
styleInject(css_248z$5);
|
|
1977
1983
|
|
|
@@ -2122,7 +2128,16 @@ const useConstructor = (callBack = () => { }) => {
|
|
|
2122
2128
|
setHasBeenCalled(true);
|
|
2123
2129
|
};
|
|
2124
2130
|
|
|
2125
|
-
|
|
2131
|
+
function useDebounce(callback, timeout, deps) {
|
|
2132
|
+
const timeoutId = useRef();
|
|
2133
|
+
useEffect(() => {
|
|
2134
|
+
clearTimeout(timeoutId.current);
|
|
2135
|
+
timeoutId.current = setTimeout(callback, timeout);
|
|
2136
|
+
return () => clearTimeout(timeoutId.current);
|
|
2137
|
+
}, deps);
|
|
2138
|
+
}
|
|
2139
|
+
|
|
2140
|
+
var css_248z$4 = ".Step-module_stepWrapper__1se3l {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Step-module_stepWrapper__1se3l.Step-module_hasLabel__3cdCU:not(.Step-module_disabled__1R7hh):hover {\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n border-radius: var(--borderRadius);\n}\n\n.Step-module_step__2siYu {\n width: 40px;\n height: 40px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Step-module_step__2siYu:not(.Step-module_hasLabel__3cdCU):not(.Step-module_disabled__1R7hh):hover {\n border-radius: 100%;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n}\n.Step-module_step__2siYu.Step-module_hasLabel__3cdCU svg {\n width: 18px !important;\n height: 18px !important;\n}\n\n.Step-module_stepIconCircle__3IyDn svg {\n width: 24px;\n height: 24px;\n}\n\n.Step-module_stepValue__2TVrP {\n position: absolute;\n color: var(--secondary-contrast-text);\n}\n.Step-module_stepValue__2TVrP .Step-module_isActive__1QTL4 {\n color: var(--primary-contrast-text);\n}";
|
|
2126
2141
|
var styles$4 = {"stepWrapper":"Step-module_stepWrapper__1se3l","hasLabel":"Step-module_hasLabel__3cdCU","disabled":"Step-module_disabled__1R7hh","step":"Step-module_step__2siYu","stepIconCircle":"Step-module_stepIconCircle__3IyDn","stepValue":"Step-module_stepValue__2TVrP","isActive":"Step-module_isActive__1QTL4"};
|
|
2127
2142
|
styleInject(css_248z$4);
|
|
2128
2143
|
|
|
@@ -2177,7 +2192,7 @@ const Table = (props) => {
|
|
|
2177
2192
|
React.createElement("table", { className: getCssClasses() }, children)));
|
|
2178
2193
|
};
|
|
2179
2194
|
|
|
2180
|
-
var css_248z$3 = ".TabIndicator-module_tabIndicator__wj9Qm {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2195
|
+
var css_248z$3 = ".TabIndicator-module_tabIndicator__wj9Qm {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_primary__2Lc8c {\n background-color: var(--primary);\n}\n.TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_accent__37h0D {\n background-color: var(--accent);\n}";
|
|
2181
2196
|
var styles$3 = {"tabIndicator":"TabIndicator-module_tabIndicator__wj9Qm","primary":"TabIndicator-module_primary__2Lc8c","accent":"TabIndicator-module_accent__37h0D"};
|
|
2182
2197
|
styleInject(css_248z$3);
|
|
2183
2198
|
|
|
@@ -2195,7 +2210,7 @@ const TabIndicator = (props) => {
|
|
|
2195
2210
|
} }));
|
|
2196
2211
|
};
|
|
2197
2212
|
|
|
2198
|
-
var css_248z$2 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative
|
|
2213
|
+
var css_248z$2 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative;\n}";
|
|
2199
2214
|
var styles$2 = {"tabs":"Tabs-module_tabs__2azkC"};
|
|
2200
2215
|
styleInject(css_248z$2);
|
|
2201
2216
|
|
|
@@ -2236,7 +2251,7 @@ const Tabs = (props) => {
|
|
|
2236
2251
|
React.createElement(TabIndicator, { color: indicatorColor, width: (100 / React.Children.toArray(children).length) + '%', index: selectedIndex, amount: React.Children.toArray(children).length }))));
|
|
2237
2252
|
};
|
|
2238
2253
|
|
|
2239
|
-
var css_248z$1 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2254
|
+
var css_248z$1 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
|
|
2240
2255
|
var styles$1 = {"tab":"Tab-module_tab__31Fjd"};
|
|
2241
2256
|
styleInject(css_248z$1);
|
|
2242
2257
|
|
|
@@ -2259,7 +2274,7 @@ const TabPanel = (props) => {
|
|
|
2259
2274
|
return (React.createElement("div", Object.assign({ role: "tabpanel", hidden: value !== index, id: `tabpanel-${index}`, "aria-labelledby": `wrapped-tab-${index}` }, rest), value === index && children));
|
|
2260
2275
|
};
|
|
2261
2276
|
|
|
2262
|
-
var css_248z = ".Tooltip-module_tooltipContainer__3SPVX {\n display: inline
|
|
2277
|
+
var css_248z = ".Tooltip-module_tooltipContainer__3SPVX {\n display: inline;\n}\n\n.Tooltip-module_tooltip__1AML3 {\n background-color: #333;\n color: white;\n padding: 5px 10px;\n border-radius: 4px;\n font-size: 13px;\n position: absolute;\n left: -1000000px;\n z-index: 1100;\n}\n.Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL,\n.Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL::before {\n position: absolute;\n width: 8px;\n height: 8px;\n z-index: -1;\n}\n.Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL::before {\n content: \"\";\n transform: rotate(45deg);\n background: #333;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=top] > #Tooltip-module_arrow__2c3YL {\n bottom: -4px;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=bottom] > #Tooltip-module_arrow__2c3YL {\n top: -4px;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=left] > #Tooltip-module_arrow__2c3YL {\n right: -4px;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=right] > #Tooltip-module_arrow__2c3YL {\n left: -4px;\n}";
|
|
2263
2278
|
var styles = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2264
2279
|
styleInject(css_248z);
|
|
2265
2280
|
|
|
@@ -2439,16 +2454,16 @@ const TimeSelect = (props) => {
|
|
|
2439
2454
|
};
|
|
2440
2455
|
|
|
2441
2456
|
const TreeNode = (props) => {
|
|
2442
|
-
const { id, label, level, hasChildren, isExpanded, isSelected,
|
|
2457
|
+
const { id, label, level, hasChildren, isExpanded, isSelected, onToggleExpand, onClickSelect } = props;
|
|
2443
2458
|
return (React.createElement("li", { className: "tree-node", style: { paddingLeft: `${(48 * level) + (hasChildren ? 0 : 1) * 48}px` } },
|
|
2444
2459
|
hasChildren &&
|
|
2445
|
-
React.createElement(IconButton, { onClick: () =>
|
|
2460
|
+
React.createElement(IconButton, { onClick: () => onToggleExpand(id), icon: !isExpanded ? React.createElement(ChevronRightSolidIcon, null) : React.createElement(ChevronDownSolidIcon, null) }),
|
|
2446
2461
|
React.createElement(Checkbox, { checked: isSelected, onChange: () => onClickSelect(id) }),
|
|
2447
2462
|
label));
|
|
2448
2463
|
};
|
|
2449
2464
|
|
|
2450
2465
|
const TreeView = (props) => {
|
|
2451
|
-
const { data, onSelect } = props;
|
|
2466
|
+
const { data, onSelect, onExpand, onCollapse } = props;
|
|
2452
2467
|
const [flattenData, setFlattenData] = useState([]);
|
|
2453
2468
|
const [expandedItems, setExpandedItems] = useState([]);
|
|
2454
2469
|
const [selectedItemIds, setSelectedItemIds] = useState([]);
|
|
@@ -2467,14 +2482,16 @@ const TreeView = (props) => {
|
|
|
2467
2482
|
useEffect(() => {
|
|
2468
2483
|
setFlattenData(flattenDeep(data));
|
|
2469
2484
|
}, [data]);
|
|
2470
|
-
const
|
|
2485
|
+
const handleOnToggleExpand = (item) => {
|
|
2471
2486
|
if (item.hasChildren) {
|
|
2472
2487
|
let newExpandedItems = [...expandedItems];
|
|
2473
2488
|
if (isExpanded(item.id)) {
|
|
2474
2489
|
newExpandedItems = collapseRecursive(item, [...expandedItems]);
|
|
2490
|
+
onCollapse && onCollapse(item.id);
|
|
2475
2491
|
}
|
|
2476
2492
|
else {
|
|
2477
2493
|
newExpandedItems.push(item);
|
|
2494
|
+
onExpand && onExpand(item.id);
|
|
2478
2495
|
}
|
|
2479
2496
|
setExpandedItems(newExpandedItems);
|
|
2480
2497
|
}
|
|
@@ -2515,9 +2532,9 @@ const TreeView = (props) => {
|
|
|
2515
2532
|
};
|
|
2516
2533
|
return (React.createElement("ul", { className: "treeview" }, flattenData.map(item => {
|
|
2517
2534
|
return isItemVisible(item) &&
|
|
2518
|
-
React.createElement(TreeNode, { key: item.id, id: item.id, label: item.label, level: item.level, parentId: item.parentId, isExpanded: isExpanded(item.id), isSelected: isSelected(item.id), hasChildren: item.hasChildren,
|
|
2535
|
+
React.createElement(TreeNode, { key: item.id, id: item.id, label: item.label, level: item.level, parentId: item.parentId, isExpanded: isExpanded(item.id), isSelected: isSelected(item.id), hasChildren: item.hasChildren, onToggleExpand: () => handleOnToggleExpand(item), onClickSelect: () => handleNodeClickSelect(item) });
|
|
2519
2536
|
})));
|
|
2520
2537
|
};
|
|
2521
2538
|
|
|
2522
|
-
export { Alert, AppBar, AppBarTitle, AutoComplete, Backdrop, Badge, Breadcrumb, BreadcrumbItem, Button, ButtonGroup, COLOR, Card, CardBody, CardFooter, CardImage, CardSubtitle, CardText, CardTitle, CaretDownSolidIcon, CheckSolidIcon, CheckSquareRegularIcon, Checkbox, ChevronDownSolidIcon, ChevronLeftSolidIcon, ChevronRightSolidIcon, ChevronUpSolidIcon, Chip, CircleSolidIcon, Column, ConditionalWrapper, DATEMODE, DateSelect, DaySelect, Drawer, EmailValidator, ExpansionPanel, ExpansionPanelContent, ExpansionPanelHeader, FileInput, FloatingActionButton, Form, FormControl, FormError, FormGroup, FormHint, FormInput, FormLabel, GlobalModal, HomeSolidIcon, HourSelect, Icon, IconButton, IsEmptyValidator, IsEqualValidator, Link, List, ListItem, ListItemAction, ListItemAvatar, ListItemIcon, ListItemText, LoadingIndicator, LoadingIndicatorContainer, MODALBUTTONTYPE, MODALTYPE, Menu, MenuBody, MenuDivider, MenuItem, MenuToggle, MilliSecondSelect, MinuteSelect, Modal, ModalBody, ModalFooter, ModalHeader, MonthSelect, NumberSelect, POSITION, PlusSolidIcon, Row, SIZE, STATUS, SecondSelect, Select, Sidebar, Snackbar, SpeedDial, SpeedDialAction, SpeedDialIcon, SpinnerSolidIcon, SquareRegularIcon, Step, Stepper, StepperActions, TIMEMODE, Tab, TabPanel, Table, Tabs, Textarea, TimeSelect, TimesCircleSolidIcon, TimesSolidIcon, Tooltip, TreeView, Typography, VARIANT, YearSelect, loadingIndicatorService, modalService, snackbarService, useConstructor, useHover, useWindowSize };
|
|
2539
|
+
export { Alert, AppBar, AppBarTitle, AutoComplete, Backdrop, Badge, Breadcrumb, BreadcrumbItem, Button, ButtonGroup, COLOR, Card, CardBody, CardFooter, CardImage, CardSubtitle, CardText, CardTitle, CaretDownSolidIcon, CheckSolidIcon, CheckSquareRegularIcon, Checkbox, ChevronDownSolidIcon, ChevronLeftSolidIcon, ChevronRightSolidIcon, ChevronUpSolidIcon, Chip, CircleSolidIcon, Column, ConditionalWrapper, DATEMODE, DateSelect, DaySelect, Drawer, EmailValidator, ExpansionPanel, ExpansionPanelContent, ExpansionPanelHeader, FileInput, FloatingActionButton, Form, FormControl, FormError, FormGroup, FormHint, FormInput, FormLabel, GlobalModal, HomeSolidIcon, HourSelect, Icon, IconButton, IsEmptyValidator, IsEqualValidator, Link, List, ListItem, ListItemAction, ListItemAvatar, ListItemIcon, ListItemText, LoadingIndicator, LoadingIndicatorContainer, MODALBUTTONTYPE, MODALTYPE, Menu, MenuBody, MenuDivider, MenuItem, MenuToggle, MilliSecondSelect, MinuteSelect, Modal, ModalBody, ModalFooter, ModalHeader, MonthSelect, NumberSelect, POSITION, PlusSolidIcon, Row, SIZE, STATUS, SecondSelect, Select, Sidebar, Snackbar, SpeedDial, SpeedDialAction, SpeedDialIcon, SpinnerSolidIcon, SquareRegularIcon, Step, Stepper, StepperActions, TIMEMODE, Tab, TabPanel, Table, Tabs, Textarea, TimeSelect, TimesCircleSolidIcon, TimesSolidIcon, Tooltip, TreeView, Typography, VARIANT, YearSelect, loadingIndicatorService, modalService, snackbarService, useConstructor, useDebounce, useHover, useWindowSize };
|
|
2523
2540
|
//# sourceMappingURL=index.es.js.map
|