react-asc 18.7.3 → 18.8.3
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/TreeView/TreeItem.d.ts +13 -0
- package/components/TreeView/TreeView.d.ts +2 -9
- package/components/TreeView/index.d.ts +1 -0
- package/index.es.js +332 -358
- package/index.es.js.map +1 -1
- package/index.js +332 -357
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/react-asc.scss +0 -15
- package/components/TreeView/TreeNode.d.ts +0 -13
package/index.js
CHANGED
|
@@ -95,56 +95,56 @@ function styleInject(css, ref) {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
|
|
98
|
-
var css_248z$
|
|
99
|
-
var styles$
|
|
100
|
-
styleInject(css_248z$
|
|
98
|
+
var css_248z$T = ".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}";
|
|
99
|
+
var styles$T = {"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"};
|
|
100
|
+
styleInject(css_248z$T);
|
|
101
101
|
|
|
102
102
|
const Alert = (props) => {
|
|
103
103
|
const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
104
104
|
const getCssClasses = () => {
|
|
105
105
|
const cssClasses = [];
|
|
106
|
-
cssClasses.push(styles$
|
|
106
|
+
cssClasses.push(styles$T.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$T.contained);
|
|
109
|
+
cssClasses.push(styles$T[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$T.outline);
|
|
113
|
+
cssClasses.push(styles$T[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$T['shadow']);
|
|
116
116
|
className && cssClasses.push(className);
|
|
117
117
|
return cssClasses.filter(r => r).join(' ');
|
|
118
118
|
};
|
|
119
119
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var css_248z$
|
|
123
|
-
var styles$
|
|
124
|
-
styleInject(css_248z$
|
|
122
|
+
var css_248z$S = ".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}";
|
|
123
|
+
var styles$S = {"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"};
|
|
124
|
+
styleInject(css_248z$S);
|
|
125
125
|
|
|
126
126
|
const AppBar = (props) => {
|
|
127
127
|
const { children, className, color = exports.COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
128
128
|
const getCssClasses = () => {
|
|
129
129
|
const cssClasses = [];
|
|
130
|
-
cssClasses.push(styles$
|
|
131
|
-
cssClasses.push(styles$
|
|
132
|
-
shadow && cssClasses.push(styles$
|
|
130
|
+
cssClasses.push(styles$S[color]);
|
|
131
|
+
cssClasses.push(styles$S.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$S['shadow']);
|
|
133
133
|
className && cssClasses.push(className);
|
|
134
134
|
return cssClasses.filter(r => r).join(' ');
|
|
135
135
|
};
|
|
136
136
|
return (React__default['default'].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
137
137
|
};
|
|
138
138
|
|
|
139
|
-
var css_248z$
|
|
140
|
-
var styles$
|
|
141
|
-
styleInject(css_248z$
|
|
139
|
+
var css_248z$R = ".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}";
|
|
140
|
+
var styles$R = {"appbarTitle":"AppBarTitle-module_appbarTitle__3J-Z1"};
|
|
141
|
+
styleInject(css_248z$R);
|
|
142
142
|
|
|
143
143
|
const AppBarTitle = (props) => {
|
|
144
144
|
const { children, className, onClick } = props;
|
|
145
145
|
const getCssClass = () => {
|
|
146
146
|
const cssClasses = [];
|
|
147
|
-
cssClasses.push(styles$
|
|
147
|
+
cssClasses.push(styles$R.appbarTitle);
|
|
148
148
|
className && cssClasses.push(className);
|
|
149
149
|
return cssClasses.filter(r => r).join(' ');
|
|
150
150
|
};
|
|
@@ -172,40 +172,40 @@ const Backdrop = (props) => {
|
|
|
172
172
|
return (reactDom.createPortal(React__default['default'].createElement("div", { className: getCssClasses(), onClick: handleClick, style: getStyles() }), target));
|
|
173
173
|
};
|
|
174
174
|
|
|
175
|
-
var css_248z$
|
|
176
|
-
var styles$
|
|
177
|
-
styleInject(css_248z$
|
|
175
|
+
var css_248z$Q = ".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}";
|
|
176
|
+
var styles$Q = {"list":"List-module_list__1ax9w"};
|
|
177
|
+
styleInject(css_248z$Q);
|
|
178
178
|
|
|
179
179
|
const List = (props) => {
|
|
180
180
|
const { children, className, isFlush } = props;
|
|
181
181
|
const getCssClasses = () => {
|
|
182
182
|
const cssClasses = [];
|
|
183
183
|
if (isFlush) {
|
|
184
|
-
cssClasses.push(styles$
|
|
184
|
+
cssClasses.push(styles$Q.flush);
|
|
185
185
|
}
|
|
186
|
-
cssClasses.push(styles$
|
|
186
|
+
cssClasses.push(styles$Q.list);
|
|
187
187
|
className && cssClasses.push(className);
|
|
188
188
|
return cssClasses.filter(css => css).join(' ');
|
|
189
189
|
};
|
|
190
190
|
return (React__default['default'].createElement("ul", { className: getCssClasses() }, children));
|
|
191
191
|
};
|
|
192
192
|
|
|
193
|
-
var css_248z$
|
|
194
|
-
var styles$
|
|
195
|
-
styleInject(css_248z$
|
|
193
|
+
var css_248z$P = ".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}";
|
|
194
|
+
var styles$P = {"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"};
|
|
195
|
+
styleInject(css_248z$P);
|
|
196
196
|
|
|
197
197
|
const ListItem = (props) => {
|
|
198
198
|
const { id, children, color, active, className, isHoverable, isDisabled, onClick } = props;
|
|
199
199
|
const getCssClasses = () => {
|
|
200
200
|
const cssClasses = [];
|
|
201
201
|
if (active) {
|
|
202
|
-
cssClasses.push(styles$
|
|
202
|
+
cssClasses.push(styles$P['active']);
|
|
203
203
|
}
|
|
204
204
|
if (isDisabled) {
|
|
205
205
|
cssClasses.push(`disabled`);
|
|
206
206
|
}
|
|
207
|
-
color && cssClasses.push(styles$
|
|
208
|
-
cssClasses.push(styles$
|
|
207
|
+
color && cssClasses.push(styles$P[color]);
|
|
208
|
+
cssClasses.push(styles$P.listItem);
|
|
209
209
|
className && cssClasses.push(className);
|
|
210
210
|
return cssClasses.filter(css => css).join(' ');
|
|
211
211
|
};
|
|
@@ -215,32 +215,32 @@ const ListItem = (props) => {
|
|
|
215
215
|
return (React__default['default'].createElement("li", { id: id, onClick: handleClick, className: getCssClasses() }, children));
|
|
216
216
|
};
|
|
217
217
|
|
|
218
|
-
var css_248z$
|
|
219
|
-
var styles$
|
|
220
|
-
styleInject(css_248z$
|
|
218
|
+
var css_248z$O = ".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}";
|
|
219
|
+
var styles$O = {"avatar":"ListItemAvatar-module_avatar__1fjSE"};
|
|
220
|
+
styleInject(css_248z$O);
|
|
221
221
|
|
|
222
|
-
const ListItemAvatar = ({ avatar }) => (React__default['default'].createElement("div", { className: styles$
|
|
222
|
+
const ListItemAvatar = ({ avatar }) => (React__default['default'].createElement("div", { className: styles$O.avatar }, avatar));
|
|
223
223
|
|
|
224
|
-
var css_248z$
|
|
225
|
-
var styles$
|
|
226
|
-
styleInject(css_248z$
|
|
224
|
+
var css_248z$N = ".ListItemIcon-module_icon__-nsUy {\n margin-right: 32px;\n}\n.ListItemIcon-module_icon__-nsUy svg {\n width: 24px;\n height: 24px;\n}";
|
|
225
|
+
var styles$N = {"icon":"ListItemIcon-module_icon__-nsUy"};
|
|
226
|
+
styleInject(css_248z$N);
|
|
227
227
|
|
|
228
|
-
const ListItemIcon = ({ icon }) => (React__default['default'].createElement("div", { className: styles$
|
|
228
|
+
const ListItemIcon = ({ icon }) => (React__default['default'].createElement("div", { className: styles$N.icon }, icon));
|
|
229
229
|
|
|
230
|
-
var css_248z$
|
|
231
|
-
var styles$
|
|
232
|
-
styleInject(css_248z$
|
|
230
|
+
var css_248z$M = ".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}";
|
|
231
|
+
var styles$M = {"listItemAction":"ListItemAction-module_listItemAction__26S66"};
|
|
232
|
+
styleInject(css_248z$M);
|
|
233
233
|
|
|
234
|
-
const ListItemAction = ({ children, onClick }) => (React__default['default'].createElement("div", { className: styles$
|
|
234
|
+
const ListItemAction = ({ children, onClick }) => (React__default['default'].createElement("div", { className: styles$M.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
235
235
|
|
|
236
|
-
var css_248z$
|
|
237
|
-
var styles$
|
|
238
|
-
styleInject(css_248z$
|
|
236
|
+
var css_248z$L = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1;\n}";
|
|
237
|
+
var styles$L = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
238
|
+
styleInject(css_248z$L);
|
|
239
239
|
|
|
240
240
|
const ListItemText = ({ primary, secondary }) => {
|
|
241
241
|
const getCssClasses = () => {
|
|
242
242
|
const cssClasses = [];
|
|
243
|
-
cssClasses.push(styles$
|
|
243
|
+
cssClasses.push(styles$L.listItemText);
|
|
244
244
|
return cssClasses.filter(css => css).join(' ');
|
|
245
245
|
};
|
|
246
246
|
return (React__default['default'].createElement("div", { className: getCssClasses() },
|
|
@@ -251,9 +251,9 @@ const ListItemText = ({ primary, secondary }) => {
|
|
|
251
251
|
const ListItemTextPrimary = ({ children }) => (React__default['default'].createElement("div", { className: "list-item-text-primary" }, children));
|
|
252
252
|
const ListItemTextSecondary = ({ children }) => (React__default['default'].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
253
253
|
|
|
254
|
-
var css_248z$
|
|
255
|
-
var styles$
|
|
256
|
-
styleInject(css_248z$
|
|
254
|
+
var css_248z$K = ".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}";
|
|
255
|
+
var styles$K = {"selectContainer":"AutoComplete-module_selectContainer__SyqtX","select":"AutoComplete-module_select__2_7JD","selectMenu":"AutoComplete-module_selectMenu__2_ybA"};
|
|
256
|
+
styleInject(css_248z$K);
|
|
257
257
|
|
|
258
258
|
// preset value
|
|
259
259
|
// enter -> delay? -> show results
|
|
@@ -297,12 +297,14 @@ const AutoComplete = (props) => {
|
|
|
297
297
|
React.useEffect(() => {
|
|
298
298
|
return () => {
|
|
299
299
|
document.body.classList.remove('modal-open');
|
|
300
|
+
const main = document.querySelector('.main');
|
|
301
|
+
main === null || main === void 0 ? void 0 : main.classList.remove('modal-open');
|
|
300
302
|
};
|
|
301
303
|
}, []);
|
|
302
304
|
const getCssClass = () => {
|
|
303
305
|
const cssClasses = [];
|
|
304
306
|
className && cssClasses.push(className);
|
|
305
|
-
cssClasses.push(styles$
|
|
307
|
+
cssClasses.push(styles$K.select);
|
|
306
308
|
return cssClasses.filter(r => r).join(' ');
|
|
307
309
|
};
|
|
308
310
|
const show = () => setIsShow(true);
|
|
@@ -327,35 +329,35 @@ const AutoComplete = (props) => {
|
|
|
327
329
|
setSearchText('');
|
|
328
330
|
};
|
|
329
331
|
return (React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
330
|
-
React__default['default'].createElement("div", { ref: selectConainter, className: styles$
|
|
332
|
+
React__default['default'].createElement("div", { ref: selectConainter, className: styles$K.selectContainer },
|
|
331
333
|
React__default['default'].createElement("div", { className: "d-flex" },
|
|
332
334
|
React__default['default'].createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, placeholder: placeholder, value: model }),
|
|
333
335
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
334
336
|
React__default['default'].createElement(IconButton, { icon: React__default['default'].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
335
337
|
isShow &&
|
|
336
338
|
React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
337
|
-
React__default['default'].createElement("div", { className: styles$
|
|
339
|
+
React__default['default'].createElement("div", { className: styles$K.selectMenu },
|
|
338
340
|
React__default['default'].createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React__default['default'].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option) },
|
|
339
341
|
React__default['default'].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
340
342
|
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: () => hide() })))));
|
|
341
343
|
};
|
|
342
344
|
|
|
343
|
-
var css_248z$
|
|
344
|
-
var styles$
|
|
345
|
-
styleInject(css_248z$
|
|
345
|
+
var css_248z$J = ".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}";
|
|
346
|
+
var styles$J = {"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_"};
|
|
347
|
+
styleInject(css_248z$J);
|
|
346
348
|
|
|
347
349
|
const Badge = (props) => {
|
|
348
350
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
349
351
|
const getCssClassesBadgeContainer = () => {
|
|
350
352
|
const cssClasses = [];
|
|
351
|
-
cssClasses.push(styles$
|
|
353
|
+
cssClasses.push(styles$J.badgeContainer);
|
|
352
354
|
className && cssClasses.push(className);
|
|
353
355
|
return cssClasses.filter(css => css).join(' ');
|
|
354
356
|
};
|
|
355
357
|
const getCssClassesBadge = () => {
|
|
356
358
|
const cssClasses = [];
|
|
357
|
-
cssClasses.push(styles$
|
|
358
|
-
cssClasses.push(styles$
|
|
359
|
+
cssClasses.push(styles$J.badge);
|
|
360
|
+
cssClasses.push(styles$J[color]);
|
|
359
361
|
return cssClasses.filter(css => css).join(' ');
|
|
360
362
|
};
|
|
361
363
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -363,42 +365,42 @@ const Badge = (props) => {
|
|
|
363
365
|
React__default['default'].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
364
366
|
};
|
|
365
367
|
|
|
366
|
-
var css_248z$
|
|
367
|
-
var styles$
|
|
368
|
-
styleInject(css_248z$
|
|
368
|
+
var css_248z$I = ".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}";
|
|
369
|
+
var styles$I = {"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"};
|
|
370
|
+
styleInject(css_248z$I);
|
|
369
371
|
|
|
370
372
|
const Icon = (props) => {
|
|
371
373
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
372
374
|
const getCssClasses = () => {
|
|
373
375
|
const cssClasses = [];
|
|
374
|
-
cssClasses.push(styles$
|
|
375
|
-
iconColor && cssClasses.push(styles$
|
|
376
|
+
cssClasses.push(styles$I.icon);
|
|
377
|
+
iconColor && cssClasses.push(styles$I[iconColor]);
|
|
376
378
|
className && cssClasses.push(className);
|
|
377
379
|
return cssClasses.filter(css => css).join(' ');
|
|
378
380
|
};
|
|
379
381
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
380
382
|
};
|
|
381
383
|
|
|
382
|
-
var css_248z$
|
|
383
|
-
var styles$
|
|
384
|
-
styleInject(css_248z$
|
|
384
|
+
var css_248z$H = ".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}";
|
|
385
|
+
var styles$H = {"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"};
|
|
386
|
+
styleInject(css_248z$H);
|
|
385
387
|
|
|
386
388
|
const ButtonTemplate = (props) => {
|
|
387
389
|
const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon"]);
|
|
388
390
|
const getCssClasses = () => {
|
|
389
391
|
const cssClasses = [];
|
|
390
|
-
cssClasses.push(styles$
|
|
392
|
+
cssClasses.push(styles$H.button);
|
|
391
393
|
if (variant !== 'outline' && variant !== 'text') {
|
|
392
|
-
cssClasses.push(styles$
|
|
393
|
-
cssClasses.push(styles$
|
|
394
|
+
cssClasses.push(styles$H.btnContained);
|
|
395
|
+
cssClasses.push(styles$H[color]);
|
|
394
396
|
}
|
|
395
397
|
if (variant === 'outline') {
|
|
396
|
-
cssClasses.push(styles$
|
|
397
|
-
cssClasses.push(styles$
|
|
398
|
+
cssClasses.push(styles$H.btnOutline);
|
|
399
|
+
cssClasses.push(styles$H[color]);
|
|
398
400
|
}
|
|
399
401
|
if (variant === 'text') {
|
|
400
|
-
cssClasses.push(styles$
|
|
401
|
-
cssClasses.push(styles$
|
|
402
|
+
cssClasses.push(styles$H.btnText);
|
|
403
|
+
cssClasses.push(styles$H[color]);
|
|
402
404
|
}
|
|
403
405
|
if (isRounded && variant !== 'text') {
|
|
404
406
|
cssClasses.push(`rounded-pill`);
|
|
@@ -412,40 +414,40 @@ const ButtonTemplate = (props) => {
|
|
|
412
414
|
return (React__default['default'].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
413
415
|
React__default['default'].createElement("span", { className: "d-flex justify-content-center" },
|
|
414
416
|
startIcon &&
|
|
415
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
417
|
+
React__default['default'].createElement(Icon, { className: styles$H.startIcon }, startIcon),
|
|
416
418
|
children,
|
|
417
419
|
endIcon &&
|
|
418
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
420
|
+
React__default['default'].createElement(Icon, { className: styles$H.endIcon }, endIcon))));
|
|
419
421
|
};
|
|
420
422
|
|
|
421
423
|
const Button = (props) => {
|
|
422
424
|
return (React__default['default'].createElement(ButtonTemplate, Object.assign({}, props)));
|
|
423
425
|
};
|
|
424
426
|
|
|
425
|
-
var css_248z$
|
|
426
|
-
var styles$
|
|
427
|
-
styleInject(css_248z$
|
|
427
|
+
var css_248z$G = ".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}";
|
|
428
|
+
var styles$G = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
429
|
+
styleInject(css_248z$G);
|
|
428
430
|
|
|
429
431
|
const ButtonGroup = (props) => {
|
|
430
432
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
431
433
|
const getCssClasses = () => {
|
|
432
434
|
const cssClasses = [];
|
|
433
|
-
cssClasses.push(styles$
|
|
435
|
+
cssClasses.push(styles$G.buttonGroup);
|
|
434
436
|
className && cssClasses.push(className);
|
|
435
437
|
return cssClasses.filter(css => css).join(' ');
|
|
436
438
|
};
|
|
437
439
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
438
440
|
};
|
|
439
441
|
|
|
440
|
-
var css_248z$
|
|
441
|
-
var styles$
|
|
442
|
-
styleInject(css_248z$
|
|
442
|
+
var css_248z$F = ".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}";
|
|
443
|
+
var styles$F = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
444
|
+
styleInject(css_248z$F);
|
|
443
445
|
|
|
444
446
|
const Breadcrumb = (props) => {
|
|
445
447
|
const { children, className } = props;
|
|
446
448
|
const getCssClasses = () => {
|
|
447
449
|
const cssClasses = [];
|
|
448
|
-
cssClasses.push(styles$
|
|
450
|
+
cssClasses.push(styles$F.breadcrumb);
|
|
449
451
|
className && cssClasses.push(className);
|
|
450
452
|
return cssClasses.filter(css => css).join(' ');
|
|
451
453
|
};
|
|
@@ -455,15 +457,15 @@ const Breadcrumb = (props) => {
|
|
|
455
457
|
|
|
456
458
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
457
459
|
|
|
458
|
-
var css_248z$
|
|
459
|
-
var styles$
|
|
460
|
-
styleInject(css_248z$
|
|
460
|
+
var css_248z$E = ".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}";
|
|
461
|
+
var styles$E = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
462
|
+
styleInject(css_248z$E);
|
|
461
463
|
|
|
462
464
|
const BreadcrumbItem = (props) => {
|
|
463
465
|
const { children, className, isActive, onClick } = props;
|
|
464
466
|
const getCssClasses = () => {
|
|
465
467
|
const cssClasses = [];
|
|
466
|
-
cssClasses.push(styles$
|
|
468
|
+
cssClasses.push(styles$E.breadcrumbItem);
|
|
467
469
|
className && cssClasses.push(className);
|
|
468
470
|
isActive && cssClasses.push('active');
|
|
469
471
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -477,106 +479,106 @@ const BreadcrumbItem = (props) => {
|
|
|
477
479
|
wrapper: label => React__default['default'].createElement("a", null, label) }, children)));
|
|
478
480
|
};
|
|
479
481
|
|
|
480
|
-
var css_248z$
|
|
481
|
-
var styles$
|
|
482
|
-
styleInject(css_248z$
|
|
482
|
+
var css_248z$D = ".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}";
|
|
483
|
+
var styles$D = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
484
|
+
styleInject(css_248z$D);
|
|
483
485
|
|
|
484
486
|
const Card = (props) => {
|
|
485
487
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
486
488
|
const getCssClasses = () => {
|
|
487
489
|
const cssClasses = [];
|
|
488
|
-
cssClasses.push(styles$
|
|
489
|
-
shadow && cssClasses.push(styles$
|
|
490
|
+
cssClasses.push(styles$D.card);
|
|
491
|
+
shadow && cssClasses.push(styles$D.shadow);
|
|
490
492
|
className && cssClasses.push(className);
|
|
491
493
|
return cssClasses.filter(css => css).join(' ');
|
|
492
494
|
};
|
|
493
495
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
494
496
|
};
|
|
495
497
|
|
|
496
|
-
var css_248z$
|
|
497
|
-
var styles$
|
|
498
|
-
styleInject(css_248z$
|
|
498
|
+
var css_248z$C = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
499
|
+
var styles$C = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
500
|
+
styleInject(css_248z$C);
|
|
499
501
|
|
|
500
502
|
const CardBody = (props) => {
|
|
501
503
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
502
504
|
const getCssClasses = () => {
|
|
503
505
|
const cssClasses = [];
|
|
504
|
-
cssClasses.push(styles$
|
|
506
|
+
cssClasses.push(styles$C.cardBody);
|
|
505
507
|
className && cssClasses.push(className);
|
|
506
508
|
return cssClasses.filter(css => css).join(' ');
|
|
507
509
|
};
|
|
508
510
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
509
511
|
};
|
|
510
512
|
|
|
511
|
-
var css_248z$
|
|
512
|
-
var styles$
|
|
513
|
-
styleInject(css_248z$
|
|
513
|
+
var css_248z$B = ".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}";
|
|
514
|
+
var styles$B = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
515
|
+
styleInject(css_248z$B);
|
|
514
516
|
|
|
515
517
|
const CardFooter = (props) => {
|
|
516
518
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
517
519
|
const getCssClasses = () => {
|
|
518
520
|
const cssClasses = [];
|
|
519
|
-
cssClasses.push(styles$
|
|
521
|
+
cssClasses.push(styles$B.cardFooter);
|
|
520
522
|
className && cssClasses.push(className);
|
|
521
523
|
return cssClasses.filter(css => css).join(' ');
|
|
522
524
|
};
|
|
523
525
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
524
526
|
};
|
|
525
527
|
|
|
526
|
-
var css_248z$
|
|
527
|
-
var styles$
|
|
528
|
-
styleInject(css_248z$
|
|
528
|
+
var css_248z$A = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important;\n}";
|
|
529
|
+
var styles$A = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
530
|
+
styleInject(css_248z$A);
|
|
529
531
|
|
|
530
532
|
const CardSubtitle = (props) => {
|
|
531
533
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
532
534
|
const getCssClasses = () => {
|
|
533
535
|
const cssClasses = [];
|
|
534
|
-
cssClasses.push(styles$
|
|
536
|
+
cssClasses.push(styles$A.cardSubtitle);
|
|
535
537
|
className && cssClasses.push(className);
|
|
536
538
|
return cssClasses.filter(css => css).join(' ');
|
|
537
539
|
};
|
|
538
540
|
return (React__default['default'].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
539
541
|
};
|
|
540
542
|
|
|
541
|
-
var css_248z$
|
|
542
|
-
var styles$
|
|
543
|
-
styleInject(css_248z$
|
|
543
|
+
var css_248z$z = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0;\n}";
|
|
544
|
+
var styles$z = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
545
|
+
styleInject(css_248z$z);
|
|
544
546
|
|
|
545
547
|
const CardText = (props) => {
|
|
546
548
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
547
549
|
const getCssClasses = () => {
|
|
548
550
|
const cssClasses = [];
|
|
549
|
-
cssClasses.push(styles$
|
|
551
|
+
cssClasses.push(styles$z.cardText);
|
|
550
552
|
className && cssClasses.push(className);
|
|
551
553
|
return cssClasses.filter(css => css).join(' ');
|
|
552
554
|
};
|
|
553
555
|
return (React__default['default'].createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
554
556
|
};
|
|
555
557
|
|
|
556
|
-
var css_248z$
|
|
557
|
-
var styles$
|
|
558
|
-
styleInject(css_248z$
|
|
558
|
+
var css_248z$y = ".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}";
|
|
559
|
+
var styles$y = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
560
|
+
styleInject(css_248z$y);
|
|
559
561
|
|
|
560
562
|
const CardTitle = (props) => {
|
|
561
563
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
562
564
|
const getCssClasses = () => {
|
|
563
565
|
const cssClasses = [];
|
|
564
|
-
cssClasses.push(styles$
|
|
566
|
+
cssClasses.push(styles$y.cardTitle);
|
|
565
567
|
className && cssClasses.push(className);
|
|
566
568
|
return cssClasses.filter(css => css).join(' ');
|
|
567
569
|
};
|
|
568
570
|
return (React__default['default'].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
569
571
|
};
|
|
570
572
|
|
|
571
|
-
var css_248z$
|
|
572
|
-
var styles$
|
|
573
|
-
styleInject(css_248z$
|
|
573
|
+
var css_248z$x = ".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}";
|
|
574
|
+
var styles$x = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
575
|
+
styleInject(css_248z$x);
|
|
574
576
|
|
|
575
577
|
const CardImage = (props) => {
|
|
576
578
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
577
579
|
const getCssClasses = () => {
|
|
578
580
|
const cssClasses = [];
|
|
579
|
-
cssClasses.push(styles$
|
|
581
|
+
cssClasses.push(styles$x.cardImage);
|
|
580
582
|
className && cssClasses.push(className);
|
|
581
583
|
return cssClasses.filter(css => css).join(' ');
|
|
582
584
|
};
|
|
@@ -625,15 +627,15 @@ const CircleSolidIcon = () => (React__default['default'].createElement("svg", {
|
|
|
625
627
|
const ChevronLeftSolidIcon = () => (React__default['default'].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
626
628
|
React__default['default'].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" })));
|
|
627
629
|
|
|
628
|
-
var css_248z$
|
|
629
|
-
var styles$
|
|
630
|
-
styleInject(css_248z$
|
|
630
|
+
var css_248z$w = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important;\n}";
|
|
631
|
+
var styles$w = {"typography":"Typography-module_typography__2bM6E"};
|
|
632
|
+
styleInject(css_248z$w);
|
|
631
633
|
|
|
632
634
|
const Wrapper = (props) => {
|
|
633
635
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
634
636
|
const getCssClasses = () => {
|
|
635
637
|
const cssClasses = [];
|
|
636
|
-
cssClasses.push(styles$
|
|
638
|
+
cssClasses.push(styles$w.typography);
|
|
637
639
|
className && cssClasses.push(className);
|
|
638
640
|
return cssClasses.filter(css => css).join(' ');
|
|
639
641
|
};
|
|
@@ -644,21 +646,21 @@ const Typography = (_a) => {
|
|
|
644
646
|
return (React__default['default'].createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
645
647
|
};
|
|
646
648
|
|
|
647
|
-
var css_248z$
|
|
648
|
-
var styles$
|
|
649
|
-
styleInject(css_248z$
|
|
649
|
+
var css_248z$v = ".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}";
|
|
650
|
+
var styles$v = {"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"};
|
|
651
|
+
styleInject(css_248z$v);
|
|
650
652
|
|
|
651
653
|
const IconButton = (props) => {
|
|
652
654
|
const { children, icon, label, variant = exports.VARIANT.text, color = exports.COLOR.primary, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "label", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
653
655
|
const getCssClasses = () => {
|
|
654
656
|
const cssClasses = [];
|
|
655
|
-
cssClasses.push(styles$
|
|
656
|
-
cssClasses.push(styles$
|
|
657
|
-
cssClasses.push(styles$
|
|
658
|
-
cssClasses.push(styles$
|
|
659
|
-
isActive && cssClasses.push(styles$
|
|
660
|
-
disabled && cssClasses.push(styles$
|
|
661
|
-
shadow && cssClasses.push(styles$
|
|
657
|
+
cssClasses.push(styles$v[color]);
|
|
658
|
+
cssClasses.push(styles$v[variant]);
|
|
659
|
+
cssClasses.push(styles$v[size]);
|
|
660
|
+
cssClasses.push(styles$v.iconButton);
|
|
661
|
+
isActive && cssClasses.push(styles$v.active);
|
|
662
|
+
disabled && cssClasses.push(styles$v.disabled);
|
|
663
|
+
shadow && cssClasses.push(styles$v.shadow);
|
|
662
664
|
className && cssClasses.push(className);
|
|
663
665
|
return cssClasses.filter(css => css).join(' ');
|
|
664
666
|
};
|
|
@@ -667,9 +669,9 @@ const IconButton = (props) => {
|
|
|
667
669
|
label && React__default['default'].createElement(Typography, null, label)));
|
|
668
670
|
};
|
|
669
671
|
|
|
670
|
-
var css_248z$
|
|
671
|
-
var styles$
|
|
672
|
-
styleInject(css_248z$
|
|
672
|
+
var css_248z$u = ".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}";
|
|
673
|
+
var styles$u = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
674
|
+
styleInject(css_248z$u);
|
|
673
675
|
|
|
674
676
|
const Checkbox = (props) => {
|
|
675
677
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -704,24 +706,24 @@ const Checkbox = (props) => {
|
|
|
704
706
|
setIsChecked(!isChecked);
|
|
705
707
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
706
708
|
};
|
|
707
|
-
return (React__default['default'].createElement("div", { className: styles$
|
|
709
|
+
return (React__default['default'].createElement("div", { className: styles$u.checkboxContainer },
|
|
708
710
|
React__default['default'].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
709
|
-
React__default['default'].createElement("label", { onClick: handleClick, className: styles$
|
|
711
|
+
React__default['default'].createElement("label", { onClick: handleClick, className: styles$u.checkboxLabel + ' ' + (disabled ? styles$u['disabled'] : undefined) }, label),
|
|
710
712
|
React__default['default'].createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
711
713
|
};
|
|
712
714
|
|
|
713
|
-
var css_248z$
|
|
714
|
-
var styles$
|
|
715
|
-
styleInject(css_248z$
|
|
715
|
+
var css_248z$t = ".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}";
|
|
716
|
+
var styles$t = {"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"};
|
|
717
|
+
styleInject(css_248z$t);
|
|
716
718
|
|
|
717
719
|
const Chip = (props) => {
|
|
718
720
|
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default['default'].createElement(TimesCircleSolidIcon, null), style } = props, rest = __rest(props, ["children", "color", "className", "shadow", "onClick", "isDeletable", "onDelete", "deleteIcon", "style"]);
|
|
719
721
|
const getCssClass = () => {
|
|
720
722
|
const cssClasses = [];
|
|
721
|
-
cssClasses.push(styles$
|
|
722
|
-
cssClasses.push(styles$
|
|
723
|
-
shadow && cssClasses.push(styles$
|
|
724
|
-
onClick && cssClasses.push(styles$
|
|
723
|
+
cssClasses.push(styles$t.chip);
|
|
724
|
+
cssClasses.push(styles$t[color]);
|
|
725
|
+
shadow && cssClasses.push(styles$t['shadow']);
|
|
726
|
+
onClick && cssClasses.push(styles$t['clickable']);
|
|
725
727
|
className && cssClasses.push(className);
|
|
726
728
|
return cssClasses.filter(r => r).join(' ');
|
|
727
729
|
};
|
|
@@ -731,7 +733,7 @@ const Chip = (props) => {
|
|
|
731
733
|
};
|
|
732
734
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
733
735
|
React__default['default'].createElement("div", null, children),
|
|
734
|
-
isDeletable && (React__default['default'].createElement("div", { className: styles$
|
|
736
|
+
isDeletable && (React__default['default'].createElement("div", { className: styles$t.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
735
737
|
};
|
|
736
738
|
|
|
737
739
|
const FormLabel = ({ children, className, htmlFor }) => (React__default['default'].createElement("label", { htmlFor: htmlFor, className: className }, children));
|
|
@@ -767,9 +769,9 @@ const FileInput = (props) => {
|
|
|
767
769
|
React__default['default'].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))));
|
|
768
770
|
};
|
|
769
771
|
|
|
770
|
-
var css_248z$
|
|
771
|
-
var styles$
|
|
772
|
-
styleInject(css_248z$
|
|
772
|
+
var css_248z$s = ".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}";
|
|
773
|
+
var styles$s = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
774
|
+
styleInject(css_248z$s);
|
|
773
775
|
|
|
774
776
|
const Select = (props) => {
|
|
775
777
|
var _a, _b, _c;
|
|
@@ -782,7 +784,7 @@ const Select = (props) => {
|
|
|
782
784
|
const getCssClass = () => {
|
|
783
785
|
const cssClasses = [];
|
|
784
786
|
className && cssClasses.push(className);
|
|
785
|
-
cssClasses.push(styles$
|
|
787
|
+
cssClasses.push(styles$s.select);
|
|
786
788
|
return cssClasses.filter(r => r).join(' ');
|
|
787
789
|
};
|
|
788
790
|
React.useEffect(() => {
|
|
@@ -901,7 +903,7 @@ const Select = (props) => {
|
|
|
901
903
|
}
|
|
902
904
|
};
|
|
903
905
|
return (React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
904
|
-
React__default['default'].createElement("div", { ref: selectConainter, className: styles$
|
|
906
|
+
React__default['default'].createElement("div", { ref: selectConainter, className: styles$s.selectContainer },
|
|
905
907
|
React__default['default'].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
906
908
|
!multiple && renderSingleViewModel(),
|
|
907
909
|
multiple && renderMultipleViewModel(),
|
|
@@ -909,7 +911,7 @@ const Select = (props) => {
|
|
|
909
911
|
React__default['default'].createElement(ChevronDownSolidIcon, null))),
|
|
910
912
|
isShow &&
|
|
911
913
|
reactDom.createPortal(React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
912
|
-
React__default['default'].createElement("div", { className: styles$
|
|
914
|
+
React__default['default'].createElement("div", { className: styles$s.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
|
|
913
915
|
React__default['default'].createElement(List, null, options && options.map((option, index) => React__default['default'].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), active: isActive(option) },
|
|
914
916
|
multiple &&
|
|
915
917
|
React__default['default'].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -917,15 +919,15 @@ const Select = (props) => {
|
|
|
917
919
|
React__default['default'].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
918
920
|
};
|
|
919
921
|
|
|
920
|
-
var css_248z$
|
|
921
|
-
var styles$
|
|
922
|
-
styleInject(css_248z$
|
|
922
|
+
var css_248z$r = "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}";
|
|
923
|
+
var styles$r = {};
|
|
924
|
+
styleInject(css_248z$r);
|
|
923
925
|
|
|
924
926
|
const Textarea = (props) => {
|
|
925
927
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
926
928
|
const getCssClass = () => {
|
|
927
929
|
const cssClasses = [];
|
|
928
|
-
cssClasses.push(styles$
|
|
930
|
+
cssClasses.push(styles$r.textarea);
|
|
929
931
|
className && cssClasses.push(className);
|
|
930
932
|
return cssClasses.filter(r => r).join(' ');
|
|
931
933
|
};
|
|
@@ -1281,16 +1283,16 @@ const DateSelect = (props) => {
|
|
|
1281
1283
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1282
1284
|
// };
|
|
1283
1285
|
|
|
1284
|
-
var css_248z$
|
|
1285
|
-
var styles$
|
|
1286
|
-
styleInject(css_248z$
|
|
1286
|
+
var css_248z$q = ".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}";
|
|
1287
|
+
var styles$q = {"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"};
|
|
1288
|
+
styleInject(css_248z$q);
|
|
1287
1289
|
|
|
1288
1290
|
const Drawer = (props) => {
|
|
1289
1291
|
const { children, className, position = 'left', permanent = false, target = document.body, onClickBackdrop } = props;
|
|
1290
1292
|
React.useEffect(() => {
|
|
1291
|
-
document.body.classList.add(styles$
|
|
1293
|
+
document.body.classList.add(styles$q.drawerOpen);
|
|
1292
1294
|
return () => {
|
|
1293
|
-
document.body.classList.remove(styles$
|
|
1295
|
+
document.body.classList.remove(styles$q.drawerOpen);
|
|
1294
1296
|
};
|
|
1295
1297
|
}, []);
|
|
1296
1298
|
const handleClickBackdrop = () => {
|
|
@@ -1304,10 +1306,10 @@ const DrawerContent = (props) => {
|
|
|
1304
1306
|
const { children, className, position = 'left', permanent = false } = props;
|
|
1305
1307
|
const getCssClasses = () => {
|
|
1306
1308
|
const cssClasses = [];
|
|
1307
|
-
cssClasses.push(styles$
|
|
1309
|
+
cssClasses.push(styles$q.drawer);
|
|
1308
1310
|
className && cssClasses.push(className);
|
|
1309
|
-
!!permanent && cssClasses.push(styles$
|
|
1310
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1311
|
+
!!permanent && cssClasses.push(styles$q['permanent']);
|
|
1312
|
+
position === 'left' ? cssClasses.push(styles$q['left']) : cssClasses.push(styles$q['right']);
|
|
1311
1313
|
return cssClasses.filter(css => css).join(' ');
|
|
1312
1314
|
};
|
|
1313
1315
|
const positionStyles = {
|
|
@@ -1320,9 +1322,9 @@ const DrawerContent = (props) => {
|
|
|
1320
1322
|
return (React__default['default'].createElement("div", { className: getCssClasses(), style: getStyles() }, children));
|
|
1321
1323
|
};
|
|
1322
1324
|
|
|
1323
|
-
var css_248z$
|
|
1324
|
-
var styles$
|
|
1325
|
-
styleInject(css_248z$
|
|
1325
|
+
var css_248z$p = ".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}";
|
|
1326
|
+
var styles$p = {"menuBody":"MenuBody-module_menuBody__3cPsp","shadow":"MenuBody-module_shadow__AF_9C"};
|
|
1327
|
+
styleInject(css_248z$p);
|
|
1326
1328
|
|
|
1327
1329
|
const MenuBody = (props) => {
|
|
1328
1330
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1352,8 +1354,8 @@ const MenuBody = (props) => {
|
|
|
1352
1354
|
}, [menuBodyRef]);
|
|
1353
1355
|
const getCssClasses = () => {
|
|
1354
1356
|
const cssClasses = [];
|
|
1355
|
-
cssClasses.push(styles$
|
|
1356
|
-
shadow && cssClasses.push(styles$
|
|
1357
|
+
cssClasses.push(styles$p.menuBody);
|
|
1358
|
+
shadow && cssClasses.push(styles$p.shadow);
|
|
1357
1359
|
className && cssClasses.push(className);
|
|
1358
1360
|
return cssClasses.filter(css => css).join(' ');
|
|
1359
1361
|
};
|
|
@@ -1365,9 +1367,9 @@ const MenuBody = (props) => {
|
|
|
1365
1367
|
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1366
1368
|
};
|
|
1367
1369
|
|
|
1368
|
-
var css_248z$
|
|
1369
|
-
var styles$
|
|
1370
|
-
styleInject(css_248z$
|
|
1370
|
+
var css_248z$o = ".Menu-module_menu__23BYG {\n display: flex;\n}";
|
|
1371
|
+
var styles$o = {"menu":"Menu-module_menu__23BYG"};
|
|
1372
|
+
styleInject(css_248z$o);
|
|
1371
1373
|
|
|
1372
1374
|
const Menu = (props) => {
|
|
1373
1375
|
const { toggle, children, className, open, menuPosition, onClickBackdrop, onToggleClick } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop", "onToggleClick"]);
|
|
@@ -1375,7 +1377,7 @@ const Menu = (props) => {
|
|
|
1375
1377
|
const toggleContainerRef = React.useRef(null);
|
|
1376
1378
|
const getCssClasses = () => {
|
|
1377
1379
|
const cssClasses = [];
|
|
1378
|
-
cssClasses.push(styles$
|
|
1380
|
+
cssClasses.push(styles$o.menu);
|
|
1379
1381
|
className && cssClasses.push(className);
|
|
1380
1382
|
return cssClasses.filter(css => css).join(' ');
|
|
1381
1383
|
};
|
|
@@ -1388,17 +1390,17 @@ const Menu = (props) => {
|
|
|
1388
1390
|
React__default['default'].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1389
1391
|
};
|
|
1390
1392
|
|
|
1391
|
-
var css_248z$
|
|
1392
|
-
var styles$
|
|
1393
|
-
styleInject(css_248z$
|
|
1393
|
+
var css_248z$n = ".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}";
|
|
1394
|
+
var styles$n = {"menuItem":"MenuItem-module_menuItem__kvauR","menuItemHeader":"MenuItem-module_menuItemHeader__mp7wc"};
|
|
1395
|
+
styleInject(css_248z$n);
|
|
1394
1396
|
|
|
1395
1397
|
const MenuItem = (props) => {
|
|
1396
1398
|
const { children, onClick, type = 'item' } = props;
|
|
1397
1399
|
const getCssClasses = () => {
|
|
1398
1400
|
const cssClasses = [];
|
|
1399
|
-
cssClasses.push(styles$
|
|
1401
|
+
cssClasses.push(styles$n.menuItem);
|
|
1400
1402
|
if (type === 'header') {
|
|
1401
|
-
cssClasses.push(styles$
|
|
1403
|
+
cssClasses.push(styles$n.menuItemHeader);
|
|
1402
1404
|
}
|
|
1403
1405
|
return cssClasses.filter(css => css).join(' ');
|
|
1404
1406
|
};
|
|
@@ -1416,23 +1418,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1416
1418
|
return (React__default['default'].createElement(React.Fragment, null, children));
|
|
1417
1419
|
};
|
|
1418
1420
|
|
|
1419
|
-
var css_248z$
|
|
1420
|
-
var styles$
|
|
1421
|
-
styleInject(css_248z$
|
|
1421
|
+
var css_248z$m = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef;\n}";
|
|
1422
|
+
var styles$m = {"menuItemDivider":"MenuDivider-module_menuItemDivider__JnLsC"};
|
|
1423
|
+
styleInject(css_248z$m);
|
|
1422
1424
|
|
|
1423
|
-
const MenuDivider = () => React__default['default'].createElement("div", { className: styles$
|
|
1425
|
+
const MenuDivider = () => React__default['default'].createElement("div", { className: styles$m.menuItemDivider });
|
|
1424
1426
|
|
|
1425
|
-
var css_248z$
|
|
1426
|
-
var styles$
|
|
1427
|
-
styleInject(css_248z$
|
|
1427
|
+
var css_248z$l = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px;\n}";
|
|
1428
|
+
var styles$l = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__3H62L"};
|
|
1429
|
+
styleInject(css_248z$l);
|
|
1428
1430
|
|
|
1429
1431
|
const ExpansionPanelContent = ({ children }) => {
|
|
1430
|
-
return (React__default['default'].createElement("div", { className: styles$
|
|
1432
|
+
return (React__default['default'].createElement("div", { className: styles$l.expansionPanelContent }, children));
|
|
1431
1433
|
};
|
|
1432
1434
|
|
|
1433
|
-
var css_248z$
|
|
1434
|
-
var styles$
|
|
1435
|
-
styleInject(css_248z$
|
|
1435
|
+
var css_248z$k = ".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}";
|
|
1436
|
+
var styles$k = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__3hrsI"};
|
|
1437
|
+
styleInject(css_248z$k);
|
|
1436
1438
|
|
|
1437
1439
|
const ExpansionPanelHeader = (props) => {
|
|
1438
1440
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1440,15 +1442,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1440
1442
|
e.stopPropagation();
|
|
1441
1443
|
onClick && onClick(e);
|
|
1442
1444
|
};
|
|
1443
|
-
return (React__default['default'].createElement("div", { className: styles$
|
|
1445
|
+
return (React__default['default'].createElement("div", { className: styles$k.expansionPanelHeader, onClick: handleClick },
|
|
1444
1446
|
children,
|
|
1445
1447
|
React__default['default'].createElement("span", { className: "ml-auto text-muted" },
|
|
1446
1448
|
React__default['default'].createElement(Icon, null, isExpanded ? React__default['default'].createElement(ChevronUpSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null)))));
|
|
1447
1449
|
};
|
|
1448
1450
|
|
|
1449
|
-
var css_248z$
|
|
1450
|
-
var styles$
|
|
1451
|
-
styleInject(css_248z$
|
|
1451
|
+
var css_248z$j = ".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}";
|
|
1452
|
+
var styles$j = {"expansionPanel":"ExpansionPanel-module_expansionPanel__3krcE","isExpanded":"ExpansionPanel-module_isExpanded__1m4Dt"};
|
|
1453
|
+
styleInject(css_248z$j);
|
|
1452
1454
|
|
|
1453
1455
|
const ExpansionPanel = (props) => {
|
|
1454
1456
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1458,9 +1460,9 @@ const ExpansionPanel = (props) => {
|
|
|
1458
1460
|
}, [isExpanded]);
|
|
1459
1461
|
const getCssClasses = () => {
|
|
1460
1462
|
const cssClasses = [];
|
|
1461
|
-
cssClasses.push(styles$
|
|
1463
|
+
cssClasses.push(styles$j.expansionPanel);
|
|
1462
1464
|
if (_isExpanded) {
|
|
1463
|
-
cssClasses.push(styles$
|
|
1465
|
+
cssClasses.push(styles$j.isExpanded);
|
|
1464
1466
|
}
|
|
1465
1467
|
return cssClasses.filter(css => css).join(' ');
|
|
1466
1468
|
};
|
|
@@ -1474,16 +1476,16 @@ const ExpansionPanel = (props) => {
|
|
|
1474
1476
|
React__default['default'].createElement(ExpansionPanelContent, null, children)));
|
|
1475
1477
|
};
|
|
1476
1478
|
|
|
1477
|
-
var css_248z$
|
|
1478
|
-
var styles$
|
|
1479
|
-
styleInject(css_248z$
|
|
1479
|
+
var css_248z$i = ".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}";
|
|
1480
|
+
var styles$i = {"fab":"FloatingActionButton-module_fab__3GwiH","fixed":"FloatingActionButton-module_fixed__17qrv"};
|
|
1481
|
+
styleInject(css_248z$i);
|
|
1480
1482
|
|
|
1481
1483
|
const FloatingActionButton = (props) => {
|
|
1482
1484
|
const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1483
1485
|
const getCssClasses = () => {
|
|
1484
1486
|
const cssClasses = [];
|
|
1485
|
-
cssClasses.push(styles$
|
|
1486
|
-
fixed && cssClasses.push(styles$
|
|
1487
|
+
cssClasses.push(styles$i.fab);
|
|
1488
|
+
fixed && cssClasses.push(styles$i['fixed']);
|
|
1487
1489
|
className && cssClasses.push(className);
|
|
1488
1490
|
return cssClasses.filter(css => css).join(' ');
|
|
1489
1491
|
};
|
|
@@ -1545,14 +1547,14 @@ const Link = (props) => {
|
|
|
1545
1547
|
return (React__default['default'].createElement("a", { className: getCssClasses(), href: url || '#', target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, children));
|
|
1546
1548
|
};
|
|
1547
1549
|
|
|
1548
|
-
var css_248z$
|
|
1549
|
-
var styles$
|
|
1550
|
-
styleInject(css_248z$
|
|
1550
|
+
var css_248z$h = ".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}";
|
|
1551
|
+
var styles$h = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__3e1-3","loadingIndicator":"LoadingIndicator-module_loadingIndicator__tvp5i","spinAnimation":"LoadingIndicator-module_spinAnimation__PKRNn"};
|
|
1552
|
+
styleInject(css_248z$h);
|
|
1551
1553
|
|
|
1552
1554
|
const LoadingIndicator = () => {
|
|
1553
1555
|
const getCssClasses = () => {
|
|
1554
1556
|
const cssClasses = [];
|
|
1555
|
-
cssClasses.push(styles$
|
|
1557
|
+
cssClasses.push(styles$h.loadingIndicator);
|
|
1556
1558
|
return cssClasses.filter(css => css).join(' ');
|
|
1557
1559
|
};
|
|
1558
1560
|
return (React__default['default'].createElement("div", { className: getCssClasses() },
|
|
@@ -1562,7 +1564,7 @@ const LoadingIndicator = () => {
|
|
|
1562
1564
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1563
1565
|
const getCssClasses = () => {
|
|
1564
1566
|
const cssClasses = [];
|
|
1565
|
-
cssClasses.push(styles$
|
|
1567
|
+
cssClasses.push(styles$h.loadingIndicatorContainer);
|
|
1566
1568
|
return cssClasses.filter(css => css).join(' ');
|
|
1567
1569
|
};
|
|
1568
1570
|
return (React__default['default'].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1592,16 +1594,16 @@ class LoadingIndicatorService {
|
|
|
1592
1594
|
}
|
|
1593
1595
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1594
1596
|
|
|
1595
|
-
var css_248z$
|
|
1596
|
-
var styles$
|
|
1597
|
-
styleInject(css_248z$
|
|
1597
|
+
var css_248z$g = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center;\n}";
|
|
1598
|
+
var styles$g = {"modalHeader":"ModalHeader-module_modalHeader__o5HzE"};
|
|
1599
|
+
styleInject(css_248z$g);
|
|
1598
1600
|
|
|
1599
1601
|
const ModalHeader = (props) => {
|
|
1600
1602
|
const { children, isDismissable = false, onClose } = props;
|
|
1601
1603
|
const handleClick = () => {
|
|
1602
1604
|
onClose && onClose();
|
|
1603
1605
|
};
|
|
1604
|
-
return (React__default['default'].createElement("div", { className: "modal-header " + styles$
|
|
1606
|
+
return (React__default['default'].createElement("div", { className: "modal-header " + styles$g.modalHeader },
|
|
1605
1607
|
React__default['default'].createElement("h5", { className: "modal-title" }, children),
|
|
1606
1608
|
isDismissable &&
|
|
1607
1609
|
React__default['default'].createElement(IconButton, { icon: React__default['default'].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
@@ -1609,24 +1611,24 @@ const ModalHeader = (props) => {
|
|
|
1609
1611
|
|
|
1610
1612
|
const ModalBody = ({ children }) => (React__default['default'].createElement("div", { className: "modal-body" }, children));
|
|
1611
1613
|
|
|
1612
|
-
var css_248z$
|
|
1613
|
-
var styles$
|
|
1614
|
-
styleInject(css_248z$
|
|
1614
|
+
var css_248z$f = ".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}";
|
|
1615
|
+
var styles$f = {"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"};
|
|
1616
|
+
styleInject(css_248z$f);
|
|
1615
1617
|
|
|
1616
|
-
var css_248z$
|
|
1617
|
-
var styles$
|
|
1618
|
-
styleInject(css_248z$
|
|
1618
|
+
var css_248z$e = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none;\n}";
|
|
1619
|
+
var styles$e = {"modalFooter":"ModalFooter-module_modalFooter__2Et4e"};
|
|
1620
|
+
styleInject(css_248z$e);
|
|
1619
1621
|
|
|
1620
|
-
const ModalFooter = ({ children }) => (React__default['default'].createElement("div", { className: "modal-footer " + styles$
|
|
1622
|
+
const ModalFooter = ({ children }) => (React__default['default'].createElement("div", { className: "modal-footer " + styles$e.modalFooter }, children));
|
|
1621
1623
|
|
|
1622
1624
|
const Modal = (props) => {
|
|
1623
1625
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1624
1626
|
const getCssClass = () => {
|
|
1625
1627
|
const cssClasses = [];
|
|
1626
1628
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1627
|
-
cssClasses.push(styles$
|
|
1628
|
-
!!fullScreen && cssClasses.push(styles$
|
|
1629
|
-
size && cssClasses.push(styles$
|
|
1629
|
+
cssClasses.push(styles$f.modal);
|
|
1630
|
+
!!fullScreen && cssClasses.push(styles$f['fullscreen']);
|
|
1631
|
+
size && cssClasses.push(styles$f[size]);
|
|
1630
1632
|
className && cssClasses.push(className);
|
|
1631
1633
|
return cssClasses.filter(r => r).join(' ');
|
|
1632
1634
|
};
|
|
@@ -1640,9 +1642,9 @@ const Modal = (props) => {
|
|
|
1640
1642
|
onBackdropClick && onBackdropClick();
|
|
1641
1643
|
};
|
|
1642
1644
|
return (React__default['default'].createElement(React.Fragment, null,
|
|
1643
|
-
React__default['default'].createElement("div", { className: "modal show " + styles$
|
|
1645
|
+
React__default['default'].createElement("div", { className: "modal show " + styles$f.modal, style: { display: 'block' } },
|
|
1644
1646
|
React__default['default'].createElement("div", { className: getCssClass() },
|
|
1645
|
-
React__default['default'].createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$
|
|
1647
|
+
React__default['default'].createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$f['modalContent'] : undefined) },
|
|
1646
1648
|
header &&
|
|
1647
1649
|
React__default['default'].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1648
1650
|
React__default['default'].createElement(ModalBody, null, children),
|
|
@@ -1842,25 +1844,25 @@ const Sidebar = (props) => {
|
|
|
1842
1844
|
!item.isCollapsed && item.items && item.items.length > 0 && (React__default['default'].createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React__default['default'].createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
|
|
1843
1845
|
};
|
|
1844
1846
|
|
|
1845
|
-
var css_248z$
|
|
1846
|
-
var styles$
|
|
1847
|
-
styleInject(css_248z$
|
|
1847
|
+
var css_248z$d = ".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}";
|
|
1848
|
+
var styles$d = {"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"};
|
|
1849
|
+
styleInject(css_248z$d);
|
|
1848
1850
|
|
|
1849
1851
|
const Snackbar = (props) => {
|
|
1850
1852
|
const { message, color = exports.COLOR.dark, actionText = 'ok', onOk } = props;
|
|
1851
1853
|
const getCssClasses = () => {
|
|
1852
1854
|
const cssClasses = [];
|
|
1853
|
-
cssClasses.push(styles$
|
|
1855
|
+
cssClasses.push(styles$d.snackbar);
|
|
1854
1856
|
cssClasses.push(`shadow-lg`);
|
|
1855
|
-
cssClasses.push(styles$
|
|
1857
|
+
cssClasses.push(styles$d[color]);
|
|
1856
1858
|
return cssClasses.filter(css => css).join(' ');
|
|
1857
1859
|
};
|
|
1858
1860
|
const handleClickAction = () => {
|
|
1859
1861
|
onOk && onOk();
|
|
1860
1862
|
};
|
|
1861
1863
|
return (React__default['default'].createElement("div", { className: getCssClasses() },
|
|
1862
|
-
React__default['default'].createElement("div", { className: styles$
|
|
1863
|
-
React__default['default'].createElement("div", { className: styles$
|
|
1864
|
+
React__default['default'].createElement("div", { className: styles$d.text }, message),
|
|
1865
|
+
React__default['default'].createElement("div", { className: styles$d.action + " text-accent", onClick: handleClickAction },
|
|
1864
1866
|
React__default['default'].createElement("span", null, actionText))));
|
|
1865
1867
|
};
|
|
1866
1868
|
|
|
@@ -1898,29 +1900,29 @@ class SnackbarService {
|
|
|
1898
1900
|
}
|
|
1899
1901
|
const snackbarService = new SnackbarService();
|
|
1900
1902
|
|
|
1901
|
-
var css_248z$
|
|
1902
|
-
var styles$
|
|
1903
|
-
styleInject(css_248z$
|
|
1903
|
+
var css_248z$c = ".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}";
|
|
1904
|
+
var styles$c = {"speedDialActions":"SpeedDialActions-module_speedDialActions__zLEps"};
|
|
1905
|
+
styleInject(css_248z$c);
|
|
1904
1906
|
|
|
1905
1907
|
const SpeedDialActions = (props) => {
|
|
1906
1908
|
const { children } = props;
|
|
1907
1909
|
const getCssClasses = () => {
|
|
1908
1910
|
const cssClasses = [];
|
|
1909
|
-
cssClasses.push(styles$
|
|
1911
|
+
cssClasses.push(styles$c.speedDialActions);
|
|
1910
1912
|
return cssClasses.filter(css => css).join(' ');
|
|
1911
1913
|
};
|
|
1912
1914
|
return (React__default['default'].createElement("div", { className: getCssClasses() }, children));
|
|
1913
1915
|
};
|
|
1914
1916
|
|
|
1915
|
-
var css_248z$
|
|
1916
|
-
var styles$
|
|
1917
|
-
styleInject(css_248z$
|
|
1917
|
+
var css_248z$b = ".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}";
|
|
1918
|
+
var styles$b = {"speedDial":"SpeedDial-module_speedDial__CQ5x2"};
|
|
1919
|
+
styleInject(css_248z$b);
|
|
1918
1920
|
|
|
1919
1921
|
const SpeedDial = (props) => {
|
|
1920
1922
|
const { children, className, open, onOpen, onClose } = props, rest = __rest(props, ["children", "className", "open", "onOpen", "onClose"]);
|
|
1921
1923
|
const getCssClasses = () => {
|
|
1922
1924
|
const cssClasses = [];
|
|
1923
|
-
cssClasses.push(styles$
|
|
1925
|
+
cssClasses.push(styles$b.speedDial);
|
|
1924
1926
|
className && cssClasses.push(className);
|
|
1925
1927
|
return cssClasses.filter(css => css).join(' ');
|
|
1926
1928
|
};
|
|
@@ -1937,15 +1939,15 @@ const SpeedDial = (props) => {
|
|
|
1937
1939
|
React__default['default'].createElement(SpeedDialActions, null, children)));
|
|
1938
1940
|
};
|
|
1939
1941
|
|
|
1940
|
-
var css_248z$
|
|
1941
|
-
var styles$
|
|
1942
|
-
styleInject(css_248z$
|
|
1942
|
+
var css_248z$a = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px;\n}";
|
|
1943
|
+
var styles$a = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs"};
|
|
1944
|
+
styleInject(css_248z$a);
|
|
1943
1945
|
|
|
1944
1946
|
const SpeedDialAction = (props) => {
|
|
1945
1947
|
const { icon, onClick, className } = props;
|
|
1946
1948
|
const getCssClasses = () => {
|
|
1947
1949
|
const cssClasses = [];
|
|
1948
|
-
cssClasses.push(styles$
|
|
1950
|
+
cssClasses.push(styles$a.speedDialAction);
|
|
1949
1951
|
className && cssClasses.push(className);
|
|
1950
1952
|
return cssClasses.filter(css => css).join(' ');
|
|
1951
1953
|
};
|
|
@@ -1962,15 +1964,15 @@ const SpeedDialIcon = (props) => {
|
|
|
1962
1964
|
return (React__default['default'].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
1963
1965
|
};
|
|
1964
1966
|
|
|
1965
|
-
var css_248z$
|
|
1966
|
-
var styles$
|
|
1967
|
-
styleInject(css_248z$
|
|
1967
|
+
var css_248z$9 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex;\n}";
|
|
1968
|
+
var styles$9 = {"stepperActions":"StepperActions-module_stepperActions__2r5ZT"};
|
|
1969
|
+
styleInject(css_248z$9);
|
|
1968
1970
|
|
|
1969
1971
|
const StepperActions = (props) => {
|
|
1970
1972
|
const { className, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
|
|
1971
1973
|
const getCssClasses = () => {
|
|
1972
1974
|
const cssClasses = [];
|
|
1973
|
-
cssClasses.push(styles$
|
|
1975
|
+
cssClasses.push(styles$9.stepperActions);
|
|
1974
1976
|
className && cssClasses.push(className);
|
|
1975
1977
|
return cssClasses.filter(css => css).join(' ');
|
|
1976
1978
|
};
|
|
@@ -1987,31 +1989,31 @@ const StepPanel = (props) => {
|
|
|
1987
1989
|
return (React__default['default'].createElement("div", { className: "steppanel" }, children));
|
|
1988
1990
|
};
|
|
1989
1991
|
|
|
1990
|
-
var css_248z$
|
|
1991
|
-
var styles$
|
|
1992
|
-
styleInject(css_248z$
|
|
1992
|
+
var css_248z$8 = ".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}";
|
|
1993
|
+
var styles$8 = {"stepConnector":"StepConnector-module_stepConnector__2m7Xp","stepConnectorLine":"StepConnector-module_stepConnectorLine__jSqG4","isActive":"StepConnector-module_isActive__3Yj6N","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__3R2R8"};
|
|
1994
|
+
styleInject(css_248z$8);
|
|
1993
1995
|
|
|
1994
1996
|
const StepConnector = (props) => {
|
|
1995
1997
|
const { isActive, isHorizontal = true } = props;
|
|
1996
1998
|
const getCssClassesConnector = () => {
|
|
1997
1999
|
const cssClasses = [];
|
|
1998
|
-
cssClasses.push(styles$
|
|
2000
|
+
cssClasses.push(styles$8.stepConnector);
|
|
1999
2001
|
return cssClasses.filter(css => css).join(' ');
|
|
2000
2002
|
};
|
|
2001
2003
|
const getCssClassesLine = () => {
|
|
2002
2004
|
const cssClasses = [];
|
|
2003
|
-
cssClasses.push(styles$
|
|
2004
|
-
isActive && cssClasses.push(styles$
|
|
2005
|
-
isHorizontal && cssClasses.push(styles$
|
|
2005
|
+
cssClasses.push(styles$8.stepConnectorLine);
|
|
2006
|
+
isActive && cssClasses.push(styles$8['isActive']);
|
|
2007
|
+
isHorizontal && cssClasses.push(styles$8.stepConnectorLineHorizontal);
|
|
2006
2008
|
return cssClasses.filter(css => css).join(' ');
|
|
2007
2009
|
};
|
|
2008
2010
|
return (React__default['default'].createElement("div", { className: getCssClassesConnector() },
|
|
2009
2011
|
React__default['default'].createElement("div", { className: getCssClassesLine() })));
|
|
2010
2012
|
};
|
|
2011
2013
|
|
|
2012
|
-
var css_248z$
|
|
2013
|
-
var styles$
|
|
2014
|
-
styleInject(css_248z$
|
|
2014
|
+
var css_248z$7 = ".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}";
|
|
2015
|
+
var styles$7 = {"stepper":"Stepper-module_stepper__1TOxM","isHorizontal":"Stepper-module_isHorizontal__3rFHH"};
|
|
2016
|
+
styleInject(css_248z$7);
|
|
2015
2017
|
|
|
2016
2018
|
const Stepper = (props) => {
|
|
2017
2019
|
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
|
|
@@ -2099,8 +2101,8 @@ const Stepper = (props) => {
|
|
|
2099
2101
|
};
|
|
2100
2102
|
const getCssClasses = () => {
|
|
2101
2103
|
const cssClasses = [];
|
|
2102
|
-
cssClasses.push(styles$
|
|
2103
|
-
isHorizontal && cssClasses.push(styles$
|
|
2104
|
+
cssClasses.push(styles$7.stepper);
|
|
2105
|
+
isHorizontal && cssClasses.push(styles$7['isHorizontal']);
|
|
2104
2106
|
return cssClasses.filter(css => css).join(' ');
|
|
2105
2107
|
};
|
|
2106
2108
|
return (React__default['default'].createElement(React__default['default'].Fragment, null, steps &&
|
|
@@ -2169,9 +2171,9 @@ function useDebounce(callback, timeout, deps) {
|
|
|
2169
2171
|
}, deps);
|
|
2170
2172
|
}
|
|
2171
2173
|
|
|
2172
|
-
var css_248z$
|
|
2173
|
-
var styles$
|
|
2174
|
-
styleInject(css_248z$
|
|
2174
|
+
var css_248z$6 = ".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}";
|
|
2175
|
+
var styles$6 = {"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"};
|
|
2176
|
+
styleInject(css_248z$6);
|
|
2175
2177
|
|
|
2176
2178
|
const Step = (props) => {
|
|
2177
2179
|
const { className, label, showLabel, index, value, isActive, isDone, isDisabled, showProgressCheckIcon, onClick } = props;
|
|
@@ -2183,24 +2185,24 @@ const Step = (props) => {
|
|
|
2183
2185
|
};
|
|
2184
2186
|
const getCssClasses = () => {
|
|
2185
2187
|
const cssClasses = [];
|
|
2186
|
-
cssClasses.push(styles$
|
|
2187
|
-
label && showLabel && cssClasses.push(styles$
|
|
2188
|
-
isDisabled && cssClasses.push(styles$
|
|
2188
|
+
cssClasses.push(styles$6.stepWrapper);
|
|
2189
|
+
label && showLabel && cssClasses.push(styles$6['hasLabel']);
|
|
2190
|
+
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2189
2191
|
className && cssClasses.push(className);
|
|
2190
2192
|
return cssClasses.filter(css => css).join(' ');
|
|
2191
2193
|
};
|
|
2192
2194
|
const getCssClassesStep = () => {
|
|
2193
2195
|
const cssClasses = [];
|
|
2194
|
-
cssClasses.push(styles$
|
|
2195
|
-
label && showLabel && cssClasses.push(styles$
|
|
2196
|
-
isDisabled && cssClasses.push(styles$
|
|
2196
|
+
cssClasses.push(styles$6.step);
|
|
2197
|
+
label && showLabel && cssClasses.push(styles$6['hasLabel']);
|
|
2198
|
+
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2197
2199
|
return cssClasses.filter(css => css).join(' ');
|
|
2198
2200
|
};
|
|
2199
2201
|
return (React__default['default'].createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
|
|
2200
2202
|
React__default['default'].createElement("div", { className: getCssClassesStep() },
|
|
2201
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
2203
|
+
React__default['default'].createElement(Icon, { className: styles$6.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? exports.COLOR.primary : exports.COLOR.secondary },
|
|
2202
2204
|
React__default['default'].createElement(CircleSolidIcon, null)),
|
|
2203
|
-
React__default['default'].createElement("div", { className: styles$
|
|
2205
|
+
React__default['default'].createElement("div", { className: styles$6.stepValue + ' ' + (isActive ? (styles$6.stepValue['isActive']) : '') }, showProgressCheckIcon && isActive && isDone ?
|
|
2204
2206
|
React__default['default'].createElement(Icon, null,
|
|
2205
2207
|
React__default['default'].createElement(CheckSolidIcon, null))
|
|
2206
2208
|
:
|
|
@@ -2224,16 +2226,16 @@ const Table = (props) => {
|
|
|
2224
2226
|
React__default['default'].createElement("table", { className: getCssClasses() }, children)));
|
|
2225
2227
|
};
|
|
2226
2228
|
|
|
2227
|
-
var css_248z$
|
|
2228
|
-
var styles$
|
|
2229
|
-
styleInject(css_248z$
|
|
2229
|
+
var css_248z$5 = ".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}";
|
|
2230
|
+
var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__wj9Qm","primary":"TabIndicator-module_primary__2Lc8c","accent":"TabIndicator-module_accent__37h0D"};
|
|
2231
|
+
styleInject(css_248z$5);
|
|
2230
2232
|
|
|
2231
2233
|
const TabIndicator = (props) => {
|
|
2232
2234
|
const { color = exports.COLOR.accent, width, amount, index } = props;
|
|
2233
2235
|
const getCssClasses = () => {
|
|
2234
2236
|
const cssClasses = [];
|
|
2235
|
-
cssClasses.push(styles$
|
|
2236
|
-
cssClasses.push(styles$
|
|
2237
|
+
cssClasses.push(styles$5.tabIndicator);
|
|
2238
|
+
cssClasses.push(styles$5[color]);
|
|
2237
2239
|
return cssClasses.filter(css => css).join(' ');
|
|
2238
2240
|
};
|
|
2239
2241
|
return (React__default['default'].createElement("span", { className: getCssClasses(), style: {
|
|
@@ -2242,9 +2244,9 @@ const TabIndicator = (props) => {
|
|
|
2242
2244
|
} }));
|
|
2243
2245
|
};
|
|
2244
2246
|
|
|
2245
|
-
var css_248z$
|
|
2246
|
-
var styles$
|
|
2247
|
-
styleInject(css_248z$
|
|
2247
|
+
var css_248z$4 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative;\n}";
|
|
2248
|
+
var styles$4 = {"tabs":"Tabs-module_tabs__2azkC"};
|
|
2249
|
+
styleInject(css_248z$4);
|
|
2248
2250
|
|
|
2249
2251
|
const Tabs = (props) => {
|
|
2250
2252
|
const { children, className, fixed, indicatorColor, onChange, value } = props;
|
|
@@ -2259,7 +2261,7 @@ const Tabs = (props) => {
|
|
|
2259
2261
|
}, [children, value]);
|
|
2260
2262
|
const getCssClasses = () => {
|
|
2261
2263
|
const cssClasses = [];
|
|
2262
|
-
cssClasses.push(styles$
|
|
2264
|
+
cssClasses.push(styles$4.tabs);
|
|
2263
2265
|
className && cssClasses.push(className);
|
|
2264
2266
|
return cssClasses.filter(css => css).join(' ');
|
|
2265
2267
|
};
|
|
@@ -2283,15 +2285,15 @@ const Tabs = (props) => {
|
|
|
2283
2285
|
React__default['default'].createElement(TabIndicator, { color: indicatorColor, width: (100 / React__default['default'].Children.toArray(children).length) + '%', index: selectedIndex, amount: React__default['default'].Children.toArray(children).length }))));
|
|
2284
2286
|
};
|
|
2285
2287
|
|
|
2286
|
-
var css_248z$
|
|
2287
|
-
var styles$
|
|
2288
|
-
styleInject(css_248z$
|
|
2288
|
+
var css_248z$3 = ".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}";
|
|
2289
|
+
var styles$3 = {"tab":"Tab-module_tab__31Fjd"};
|
|
2290
|
+
styleInject(css_248z$3);
|
|
2289
2291
|
|
|
2290
2292
|
const Tab = (props) => {
|
|
2291
2293
|
const { label, className, isActive, disabled, value, onClick } = props;
|
|
2292
2294
|
const getCssClasses = () => {
|
|
2293
2295
|
const cssClasses = [];
|
|
2294
|
-
cssClasses.push(styles$
|
|
2296
|
+
cssClasses.push(styles$3.tab);
|
|
2295
2297
|
if (isActive) {
|
|
2296
2298
|
cssClasses.push(`show active`);
|
|
2297
2299
|
}
|
|
@@ -2306,9 +2308,9 @@ const TabPanel = (props) => {
|
|
|
2306
2308
|
return (React__default['default'].createElement("div", Object.assign({ role: "tabpanel", hidden: value !== index, id: `tabpanel-${index}`, "aria-labelledby": `wrapped-tab-${index}` }, rest), value === index && children));
|
|
2307
2309
|
};
|
|
2308
2310
|
|
|
2309
|
-
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}";
|
|
2310
|
-
var styles = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2311
|
-
styleInject(css_248z);
|
|
2311
|
+
var css_248z$2 = ".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}";
|
|
2312
|
+
var styles$2 = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2313
|
+
styleInject(css_248z$2);
|
|
2312
2314
|
|
|
2313
2315
|
const Tooltip = (props) => {
|
|
2314
2316
|
const { children, text, placement = 'bottom' } = props;
|
|
@@ -2336,12 +2338,12 @@ const Tooltip = (props) => {
|
|
|
2336
2338
|
setShow(false);
|
|
2337
2339
|
};
|
|
2338
2340
|
return (React__default['default'].createElement(React.Fragment, null,
|
|
2339
|
-
React__default['default'].createElement("div", { className: styles.tooltipContainer, ref: refChild, id: "tooltip-container" }, React.cloneElement(children, {
|
|
2341
|
+
React__default['default'].createElement("div", { className: styles$2.tooltipContainer, ref: refChild, id: "tooltip-container" }, React.cloneElement(children, {
|
|
2340
2342
|
onMouseOver: handleMouseOver,
|
|
2341
2343
|
onMouseLeave: handleMouseLeave,
|
|
2342
2344
|
})),
|
|
2343
2345
|
show &&
|
|
2344
|
-
React__default['default'].createElement("div", { className: styles.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2346
|
+
React__default['default'].createElement("div", { className: styles$2.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2345
2347
|
text,
|
|
2346
2348
|
React__default['default'].createElement("div", { id: "arrow", "data-popper-arrow": true }))));
|
|
2347
2349
|
};
|
|
@@ -2485,87 +2487,59 @@ const TimeSelect = (props) => {
|
|
|
2485
2487
|
React__default['default'].createElement(MilliSecondSelect, { className: "form-control", value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MILLISECONDS) }))));
|
|
2486
2488
|
};
|
|
2487
2489
|
|
|
2488
|
-
|
|
2489
|
-
|
|
2490
|
-
|
|
2491
|
-
hasChildren &&
|
|
2492
|
-
React__default['default'].createElement(IconButton, { onClick: () => onToggleExpand(id), icon: !isExpanded ? React__default['default'].createElement(ChevronRightSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null) }),
|
|
2493
|
-
React__default['default'].createElement(Checkbox, { checked: isSelected, onChange: () => onClickSelect(id) }),
|
|
2494
|
-
label));
|
|
2495
|
-
};
|
|
2490
|
+
var css_248z$1 = ".TreeView-module_treeView__3kmGm {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important;\n}\n.TreeView-module_treeView__3kmGm ul {\n padding-left: 48px !important;\n}";
|
|
2491
|
+
var styles$1 = {"treeView":"TreeView-module_treeView__3kmGm"};
|
|
2492
|
+
styleInject(css_248z$1);
|
|
2496
2493
|
|
|
2497
2494
|
const TreeView = (props) => {
|
|
2498
|
-
const {
|
|
2499
|
-
const
|
|
2500
|
-
|
|
2501
|
-
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
result = arr1.reduce((acc, val) => {
|
|
2505
|
-
return (Array.isArray(val.children) ?
|
|
2506
|
-
acc.concat([
|
|
2507
|
-
{ id: val.id, label: val.label, level: level, hasChildren: true, parentId: parentId },
|
|
2508
|
-
...flattenDeep(val.children, val.id, level + 1)
|
|
2509
|
-
]) :
|
|
2510
|
-
acc.concat([{ id: val.id, label: val.label, level: level, hasChildren: false, parentId: parentId }]));
|
|
2511
|
-
}, []);
|
|
2512
|
-
return result;
|
|
2513
|
-
};
|
|
2514
|
-
React.useEffect(() => {
|
|
2515
|
-
setFlattenData(flattenDeep(data));
|
|
2516
|
-
}, [data]);
|
|
2517
|
-
const handleOnToggleExpand = (item) => {
|
|
2518
|
-
if (item.hasChildren) {
|
|
2519
|
-
let newExpandedItems = [...expandedItems];
|
|
2520
|
-
if (isExpanded(item.id)) {
|
|
2521
|
-
newExpandedItems = collapseRecursive(item, [...expandedItems]);
|
|
2522
|
-
onCollapse && onCollapse(item.id);
|
|
2523
|
-
}
|
|
2524
|
-
else {
|
|
2525
|
-
newExpandedItems.push(item);
|
|
2526
|
-
onExpand && onExpand(item.id);
|
|
2527
|
-
}
|
|
2528
|
-
setExpandedItems(newExpandedItems);
|
|
2529
|
-
}
|
|
2530
|
-
};
|
|
2531
|
-
const collapseRecursive = (item, expandedItems) => {
|
|
2532
|
-
let expandedItemIds = expandedItems.map(i => i.id);
|
|
2533
|
-
if (expandedItemIds.indexOf(item.id) >= 0) {
|
|
2534
|
-
expandedItems = expandedItems.filter(i => i.id !== item.id);
|
|
2535
|
-
}
|
|
2536
|
-
if (item.hasChildren) {
|
|
2537
|
-
let children = expandedItems.filter(child => child.parentId === item.id);
|
|
2538
|
-
for (let child of children) {
|
|
2539
|
-
expandedItems = collapseRecursive(child, expandedItems);
|
|
2540
|
-
}
|
|
2541
|
-
}
|
|
2542
|
-
return expandedItems;
|
|
2543
|
-
};
|
|
2544
|
-
const isExpanded = (id) => {
|
|
2545
|
-
return expandedItems.map(i => i.id).indexOf(id) >= 0;
|
|
2495
|
+
const { children, className } = props;
|
|
2496
|
+
const getCssClasses = () => {
|
|
2497
|
+
const cssClasses = [];
|
|
2498
|
+
cssClasses.push(styles$1.treeView);
|
|
2499
|
+
className && cssClasses.push(className);
|
|
2500
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2546
2501
|
};
|
|
2547
|
-
|
|
2548
|
-
|
|
2502
|
+
return (React__default['default'].createElement("ul", { className: getCssClasses() }, children));
|
|
2503
|
+
};
|
|
2504
|
+
|
|
2505
|
+
var css_248z = ".TreeItem-module_treeItem__2FtLe {\n display: flex;\n flex-direction: column;\n min-height: 48px;\n justify-content: center;\n}";
|
|
2506
|
+
var styles = {"treeItem":"TreeItem-module_treeItem__2FtLe"};
|
|
2507
|
+
styleInject(css_248z);
|
|
2508
|
+
|
|
2509
|
+
const TreeItem = (props) => {
|
|
2510
|
+
const { nodeId, label, children, className, isExpanded, isSelected, isSelectable, onToggleExpand, onSelect } = props;
|
|
2511
|
+
const [_isExpanded, setIsExpanded] = React.useState(false);
|
|
2512
|
+
const [_isSelected, setIsSelected] = React.useState(false);
|
|
2513
|
+
const getCssClasses = () => {
|
|
2514
|
+
const cssClasses = [];
|
|
2515
|
+
cssClasses.push(styles.treeItem);
|
|
2516
|
+
className && cssClasses.push(className);
|
|
2517
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2549
2518
|
};
|
|
2550
|
-
|
|
2551
|
-
|
|
2552
|
-
|
|
2553
|
-
|
|
2554
|
-
|
|
2555
|
-
|
|
2556
|
-
|
|
2557
|
-
|
|
2558
|
-
|
|
2559
|
-
|
|
2560
|
-
|
|
2519
|
+
React.useEffect(() => {
|
|
2520
|
+
if (isExpanded !== undefined)
|
|
2521
|
+
setIsExpanded(isExpanded);
|
|
2522
|
+
}, [isExpanded]);
|
|
2523
|
+
React.useEffect(() => {
|
|
2524
|
+
if (isSelected !== undefined)
|
|
2525
|
+
setIsSelected(isSelected);
|
|
2526
|
+
}, [isSelected]);
|
|
2527
|
+
const handleOnToggleExpand = (nodeId) => {
|
|
2528
|
+
setIsExpanded(!_isExpanded);
|
|
2529
|
+
onToggleExpand && onToggleExpand(nodeId);
|
|
2561
2530
|
};
|
|
2562
|
-
const
|
|
2563
|
-
|
|
2531
|
+
const handleOnSelect = (nodeId) => {
|
|
2532
|
+
setIsSelected(!_isSelected);
|
|
2533
|
+
onSelect && onSelect(nodeId, !_isSelected);
|
|
2564
2534
|
};
|
|
2565
|
-
return (React__default['default'].createElement("
|
|
2566
|
-
|
|
2567
|
-
|
|
2568
|
-
|
|
2535
|
+
return (React__default['default'].createElement("li", { className: getCssClasses(), style: { paddingLeft: `${(48 * (children ? 0 : 1))}px` } },
|
|
2536
|
+
React__default['default'].createElement("div", { className: "d-flex align-items-center" },
|
|
2537
|
+
children &&
|
|
2538
|
+
React__default['default'].createElement(IconButton, { onClick: () => handleOnToggleExpand(nodeId), icon: !_isExpanded ? React__default['default'].createElement(ChevronRightSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null) }),
|
|
2539
|
+
isSelectable &&
|
|
2540
|
+
React__default['default'].createElement(Checkbox, { checked: _isSelected, onChange: () => handleOnSelect(nodeId) }),
|
|
2541
|
+
label),
|
|
2542
|
+
children && _isExpanded ? React__default['default'].createElement("ul", null, children) : null));
|
|
2569
2543
|
};
|
|
2570
2544
|
|
|
2571
2545
|
exports.Alert = Alert;
|
|
@@ -2666,6 +2640,7 @@ exports.TimeSelect = TimeSelect;
|
|
|
2666
2640
|
exports.TimesCircleSolidIcon = TimesCircleSolidIcon;
|
|
2667
2641
|
exports.TimesSolidIcon = TimesSolidIcon;
|
|
2668
2642
|
exports.Tooltip = Tooltip;
|
|
2643
|
+
exports.TreeItem = TreeItem;
|
|
2669
2644
|
exports.TreeView = TreeView;
|
|
2670
2645
|
exports.Typography = Typography;
|
|
2671
2646
|
exports.YearSelect = YearSelect;
|