react-asc 18.7.3 → 18.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/TreeView/TreeItem.d.ts +12 -0
- package/components/TreeView/TreeView.d.ts +2 -9
- package/components/TreeView/index.d.ts +1 -0
- package/index.es.js +329 -358
- package/index.es.js.map +1 -1
- package/index.js +329 -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
|
|
@@ -302,7 +302,7 @@ const AutoComplete = (props) => {
|
|
|
302
302
|
const getCssClass = () => {
|
|
303
303
|
const cssClasses = [];
|
|
304
304
|
className && cssClasses.push(className);
|
|
305
|
-
cssClasses.push(styles$
|
|
305
|
+
cssClasses.push(styles$K.select);
|
|
306
306
|
return cssClasses.filter(r => r).join(' ');
|
|
307
307
|
};
|
|
308
308
|
const show = () => setIsShow(true);
|
|
@@ -327,35 +327,35 @@ const AutoComplete = (props) => {
|
|
|
327
327
|
setSearchText('');
|
|
328
328
|
};
|
|
329
329
|
return (React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
330
|
-
React__default['default'].createElement("div", { ref: selectConainter, className: styles$
|
|
330
|
+
React__default['default'].createElement("div", { ref: selectConainter, className: styles$K.selectContainer },
|
|
331
331
|
React__default['default'].createElement("div", { className: "d-flex" },
|
|
332
332
|
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
333
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
334
334
|
React__default['default'].createElement(IconButton, { icon: React__default['default'].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
335
335
|
isShow &&
|
|
336
336
|
React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
337
|
-
React__default['default'].createElement("div", { className: styles$
|
|
337
|
+
React__default['default'].createElement("div", { className: styles$K.selectMenu },
|
|
338
338
|
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
339
|
React__default['default'].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
340
340
|
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: () => hide() })))));
|
|
341
341
|
};
|
|
342
342
|
|
|
343
|
-
var css_248z$
|
|
344
|
-
var styles$
|
|
345
|
-
styleInject(css_248z$
|
|
343
|
+
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}";
|
|
344
|
+
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_"};
|
|
345
|
+
styleInject(css_248z$J);
|
|
346
346
|
|
|
347
347
|
const Badge = (props) => {
|
|
348
348
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
349
349
|
const getCssClassesBadgeContainer = () => {
|
|
350
350
|
const cssClasses = [];
|
|
351
|
-
cssClasses.push(styles$
|
|
351
|
+
cssClasses.push(styles$J.badgeContainer);
|
|
352
352
|
className && cssClasses.push(className);
|
|
353
353
|
return cssClasses.filter(css => css).join(' ');
|
|
354
354
|
};
|
|
355
355
|
const getCssClassesBadge = () => {
|
|
356
356
|
const cssClasses = [];
|
|
357
|
-
cssClasses.push(styles$
|
|
358
|
-
cssClasses.push(styles$
|
|
357
|
+
cssClasses.push(styles$J.badge);
|
|
358
|
+
cssClasses.push(styles$J[color]);
|
|
359
359
|
return cssClasses.filter(css => css).join(' ');
|
|
360
360
|
};
|
|
361
361
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -363,42 +363,42 @@ const Badge = (props) => {
|
|
|
363
363
|
React__default['default'].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
364
364
|
};
|
|
365
365
|
|
|
366
|
-
var css_248z$
|
|
367
|
-
var styles$
|
|
368
|
-
styleInject(css_248z$
|
|
366
|
+
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}";
|
|
367
|
+
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"};
|
|
368
|
+
styleInject(css_248z$I);
|
|
369
369
|
|
|
370
370
|
const Icon = (props) => {
|
|
371
371
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
372
372
|
const getCssClasses = () => {
|
|
373
373
|
const cssClasses = [];
|
|
374
|
-
cssClasses.push(styles$
|
|
375
|
-
iconColor && cssClasses.push(styles$
|
|
374
|
+
cssClasses.push(styles$I.icon);
|
|
375
|
+
iconColor && cssClasses.push(styles$I[iconColor]);
|
|
376
376
|
className && cssClasses.push(className);
|
|
377
377
|
return cssClasses.filter(css => css).join(' ');
|
|
378
378
|
};
|
|
379
379
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
380
380
|
};
|
|
381
381
|
|
|
382
|
-
var css_248z$
|
|
383
|
-
var styles$
|
|
384
|
-
styleInject(css_248z$
|
|
382
|
+
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}";
|
|
383
|
+
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"};
|
|
384
|
+
styleInject(css_248z$H);
|
|
385
385
|
|
|
386
386
|
const ButtonTemplate = (props) => {
|
|
387
387
|
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
388
|
const getCssClasses = () => {
|
|
389
389
|
const cssClasses = [];
|
|
390
|
-
cssClasses.push(styles$
|
|
390
|
+
cssClasses.push(styles$H.button);
|
|
391
391
|
if (variant !== 'outline' && variant !== 'text') {
|
|
392
|
-
cssClasses.push(styles$
|
|
393
|
-
cssClasses.push(styles$
|
|
392
|
+
cssClasses.push(styles$H.btnContained);
|
|
393
|
+
cssClasses.push(styles$H[color]);
|
|
394
394
|
}
|
|
395
395
|
if (variant === 'outline') {
|
|
396
|
-
cssClasses.push(styles$
|
|
397
|
-
cssClasses.push(styles$
|
|
396
|
+
cssClasses.push(styles$H.btnOutline);
|
|
397
|
+
cssClasses.push(styles$H[color]);
|
|
398
398
|
}
|
|
399
399
|
if (variant === 'text') {
|
|
400
|
-
cssClasses.push(styles$
|
|
401
|
-
cssClasses.push(styles$
|
|
400
|
+
cssClasses.push(styles$H.btnText);
|
|
401
|
+
cssClasses.push(styles$H[color]);
|
|
402
402
|
}
|
|
403
403
|
if (isRounded && variant !== 'text') {
|
|
404
404
|
cssClasses.push(`rounded-pill`);
|
|
@@ -412,40 +412,40 @@ const ButtonTemplate = (props) => {
|
|
|
412
412
|
return (React__default['default'].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
413
413
|
React__default['default'].createElement("span", { className: "d-flex justify-content-center" },
|
|
414
414
|
startIcon &&
|
|
415
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
415
|
+
React__default['default'].createElement(Icon, { className: styles$H.startIcon }, startIcon),
|
|
416
416
|
children,
|
|
417
417
|
endIcon &&
|
|
418
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
418
|
+
React__default['default'].createElement(Icon, { className: styles$H.endIcon }, endIcon))));
|
|
419
419
|
};
|
|
420
420
|
|
|
421
421
|
const Button = (props) => {
|
|
422
422
|
return (React__default['default'].createElement(ButtonTemplate, Object.assign({}, props)));
|
|
423
423
|
};
|
|
424
424
|
|
|
425
|
-
var css_248z$
|
|
426
|
-
var styles$
|
|
427
|
-
styleInject(css_248z$
|
|
425
|
+
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}";
|
|
426
|
+
var styles$G = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
427
|
+
styleInject(css_248z$G);
|
|
428
428
|
|
|
429
429
|
const ButtonGroup = (props) => {
|
|
430
430
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
431
431
|
const getCssClasses = () => {
|
|
432
432
|
const cssClasses = [];
|
|
433
|
-
cssClasses.push(styles$
|
|
433
|
+
cssClasses.push(styles$G.buttonGroup);
|
|
434
434
|
className && cssClasses.push(className);
|
|
435
435
|
return cssClasses.filter(css => css).join(' ');
|
|
436
436
|
};
|
|
437
437
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
438
438
|
};
|
|
439
439
|
|
|
440
|
-
var css_248z$
|
|
441
|
-
var styles$
|
|
442
|
-
styleInject(css_248z$
|
|
440
|
+
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}";
|
|
441
|
+
var styles$F = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
442
|
+
styleInject(css_248z$F);
|
|
443
443
|
|
|
444
444
|
const Breadcrumb = (props) => {
|
|
445
445
|
const { children, className } = props;
|
|
446
446
|
const getCssClasses = () => {
|
|
447
447
|
const cssClasses = [];
|
|
448
|
-
cssClasses.push(styles$
|
|
448
|
+
cssClasses.push(styles$F.breadcrumb);
|
|
449
449
|
className && cssClasses.push(className);
|
|
450
450
|
return cssClasses.filter(css => css).join(' ');
|
|
451
451
|
};
|
|
@@ -455,15 +455,15 @@ const Breadcrumb = (props) => {
|
|
|
455
455
|
|
|
456
456
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
457
457
|
|
|
458
|
-
var css_248z$
|
|
459
|
-
var styles$
|
|
460
|
-
styleInject(css_248z$
|
|
458
|
+
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}";
|
|
459
|
+
var styles$E = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
460
|
+
styleInject(css_248z$E);
|
|
461
461
|
|
|
462
462
|
const BreadcrumbItem = (props) => {
|
|
463
463
|
const { children, className, isActive, onClick } = props;
|
|
464
464
|
const getCssClasses = () => {
|
|
465
465
|
const cssClasses = [];
|
|
466
|
-
cssClasses.push(styles$
|
|
466
|
+
cssClasses.push(styles$E.breadcrumbItem);
|
|
467
467
|
className && cssClasses.push(className);
|
|
468
468
|
isActive && cssClasses.push('active');
|
|
469
469
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -477,106 +477,106 @@ const BreadcrumbItem = (props) => {
|
|
|
477
477
|
wrapper: label => React__default['default'].createElement("a", null, label) }, children)));
|
|
478
478
|
};
|
|
479
479
|
|
|
480
|
-
var css_248z$
|
|
481
|
-
var styles$
|
|
482
|
-
styleInject(css_248z$
|
|
480
|
+
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}";
|
|
481
|
+
var styles$D = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
482
|
+
styleInject(css_248z$D);
|
|
483
483
|
|
|
484
484
|
const Card = (props) => {
|
|
485
485
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
486
486
|
const getCssClasses = () => {
|
|
487
487
|
const cssClasses = [];
|
|
488
|
-
cssClasses.push(styles$
|
|
489
|
-
shadow && cssClasses.push(styles$
|
|
488
|
+
cssClasses.push(styles$D.card);
|
|
489
|
+
shadow && cssClasses.push(styles$D.shadow);
|
|
490
490
|
className && cssClasses.push(className);
|
|
491
491
|
return cssClasses.filter(css => css).join(' ');
|
|
492
492
|
};
|
|
493
493
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
494
494
|
};
|
|
495
495
|
|
|
496
|
-
var css_248z$
|
|
497
|
-
var styles$
|
|
498
|
-
styleInject(css_248z$
|
|
496
|
+
var css_248z$C = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
497
|
+
var styles$C = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
498
|
+
styleInject(css_248z$C);
|
|
499
499
|
|
|
500
500
|
const CardBody = (props) => {
|
|
501
501
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
502
502
|
const getCssClasses = () => {
|
|
503
503
|
const cssClasses = [];
|
|
504
|
-
cssClasses.push(styles$
|
|
504
|
+
cssClasses.push(styles$C.cardBody);
|
|
505
505
|
className && cssClasses.push(className);
|
|
506
506
|
return cssClasses.filter(css => css).join(' ');
|
|
507
507
|
};
|
|
508
508
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
509
509
|
};
|
|
510
510
|
|
|
511
|
-
var css_248z$
|
|
512
|
-
var styles$
|
|
513
|
-
styleInject(css_248z$
|
|
511
|
+
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}";
|
|
512
|
+
var styles$B = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
513
|
+
styleInject(css_248z$B);
|
|
514
514
|
|
|
515
515
|
const CardFooter = (props) => {
|
|
516
516
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
517
517
|
const getCssClasses = () => {
|
|
518
518
|
const cssClasses = [];
|
|
519
|
-
cssClasses.push(styles$
|
|
519
|
+
cssClasses.push(styles$B.cardFooter);
|
|
520
520
|
className && cssClasses.push(className);
|
|
521
521
|
return cssClasses.filter(css => css).join(' ');
|
|
522
522
|
};
|
|
523
523
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
524
524
|
};
|
|
525
525
|
|
|
526
|
-
var css_248z$
|
|
527
|
-
var styles$
|
|
528
|
-
styleInject(css_248z$
|
|
526
|
+
var css_248z$A = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important;\n}";
|
|
527
|
+
var styles$A = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
528
|
+
styleInject(css_248z$A);
|
|
529
529
|
|
|
530
530
|
const CardSubtitle = (props) => {
|
|
531
531
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
532
532
|
const getCssClasses = () => {
|
|
533
533
|
const cssClasses = [];
|
|
534
|
-
cssClasses.push(styles$
|
|
534
|
+
cssClasses.push(styles$A.cardSubtitle);
|
|
535
535
|
className && cssClasses.push(className);
|
|
536
536
|
return cssClasses.filter(css => css).join(' ');
|
|
537
537
|
};
|
|
538
538
|
return (React__default['default'].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
539
539
|
};
|
|
540
540
|
|
|
541
|
-
var css_248z$
|
|
542
|
-
var styles$
|
|
543
|
-
styleInject(css_248z$
|
|
541
|
+
var css_248z$z = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0;\n}";
|
|
542
|
+
var styles$z = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
543
|
+
styleInject(css_248z$z);
|
|
544
544
|
|
|
545
545
|
const CardText = (props) => {
|
|
546
546
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
547
547
|
const getCssClasses = () => {
|
|
548
548
|
const cssClasses = [];
|
|
549
|
-
cssClasses.push(styles$
|
|
549
|
+
cssClasses.push(styles$z.cardText);
|
|
550
550
|
className && cssClasses.push(className);
|
|
551
551
|
return cssClasses.filter(css => css).join(' ');
|
|
552
552
|
};
|
|
553
553
|
return (React__default['default'].createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
554
554
|
};
|
|
555
555
|
|
|
556
|
-
var css_248z$
|
|
557
|
-
var styles$
|
|
558
|
-
styleInject(css_248z$
|
|
556
|
+
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}";
|
|
557
|
+
var styles$y = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
558
|
+
styleInject(css_248z$y);
|
|
559
559
|
|
|
560
560
|
const CardTitle = (props) => {
|
|
561
561
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
562
562
|
const getCssClasses = () => {
|
|
563
563
|
const cssClasses = [];
|
|
564
|
-
cssClasses.push(styles$
|
|
564
|
+
cssClasses.push(styles$y.cardTitle);
|
|
565
565
|
className && cssClasses.push(className);
|
|
566
566
|
return cssClasses.filter(css => css).join(' ');
|
|
567
567
|
};
|
|
568
568
|
return (React__default['default'].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
569
569
|
};
|
|
570
570
|
|
|
571
|
-
var css_248z$
|
|
572
|
-
var styles$
|
|
573
|
-
styleInject(css_248z$
|
|
571
|
+
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}";
|
|
572
|
+
var styles$x = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
573
|
+
styleInject(css_248z$x);
|
|
574
574
|
|
|
575
575
|
const CardImage = (props) => {
|
|
576
576
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
577
577
|
const getCssClasses = () => {
|
|
578
578
|
const cssClasses = [];
|
|
579
|
-
cssClasses.push(styles$
|
|
579
|
+
cssClasses.push(styles$x.cardImage);
|
|
580
580
|
className && cssClasses.push(className);
|
|
581
581
|
return cssClasses.filter(css => css).join(' ');
|
|
582
582
|
};
|
|
@@ -625,15 +625,15 @@ const CircleSolidIcon = () => (React__default['default'].createElement("svg", {
|
|
|
625
625
|
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
626
|
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
627
|
|
|
628
|
-
var css_248z$
|
|
629
|
-
var styles$
|
|
630
|
-
styleInject(css_248z$
|
|
628
|
+
var css_248z$w = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important;\n}";
|
|
629
|
+
var styles$w = {"typography":"Typography-module_typography__2bM6E"};
|
|
630
|
+
styleInject(css_248z$w);
|
|
631
631
|
|
|
632
632
|
const Wrapper = (props) => {
|
|
633
633
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
634
634
|
const getCssClasses = () => {
|
|
635
635
|
const cssClasses = [];
|
|
636
|
-
cssClasses.push(styles$
|
|
636
|
+
cssClasses.push(styles$w.typography);
|
|
637
637
|
className && cssClasses.push(className);
|
|
638
638
|
return cssClasses.filter(css => css).join(' ');
|
|
639
639
|
};
|
|
@@ -644,21 +644,21 @@ const Typography = (_a) => {
|
|
|
644
644
|
return (React__default['default'].createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
645
645
|
};
|
|
646
646
|
|
|
647
|
-
var css_248z$
|
|
648
|
-
var styles$
|
|
649
|
-
styleInject(css_248z$
|
|
647
|
+
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}";
|
|
648
|
+
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"};
|
|
649
|
+
styleInject(css_248z$v);
|
|
650
650
|
|
|
651
651
|
const IconButton = (props) => {
|
|
652
652
|
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
653
|
const getCssClasses = () => {
|
|
654
654
|
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$
|
|
655
|
+
cssClasses.push(styles$v[color]);
|
|
656
|
+
cssClasses.push(styles$v[variant]);
|
|
657
|
+
cssClasses.push(styles$v[size]);
|
|
658
|
+
cssClasses.push(styles$v.iconButton);
|
|
659
|
+
isActive && cssClasses.push(styles$v.active);
|
|
660
|
+
disabled && cssClasses.push(styles$v.disabled);
|
|
661
|
+
shadow && cssClasses.push(styles$v.shadow);
|
|
662
662
|
className && cssClasses.push(className);
|
|
663
663
|
return cssClasses.filter(css => css).join(' ');
|
|
664
664
|
};
|
|
@@ -667,9 +667,9 @@ const IconButton = (props) => {
|
|
|
667
667
|
label && React__default['default'].createElement(Typography, null, label)));
|
|
668
668
|
};
|
|
669
669
|
|
|
670
|
-
var css_248z$
|
|
671
|
-
var styles$
|
|
672
|
-
styleInject(css_248z$
|
|
670
|
+
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}";
|
|
671
|
+
var styles$u = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
672
|
+
styleInject(css_248z$u);
|
|
673
673
|
|
|
674
674
|
const Checkbox = (props) => {
|
|
675
675
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -704,24 +704,24 @@ const Checkbox = (props) => {
|
|
|
704
704
|
setIsChecked(!isChecked);
|
|
705
705
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
706
706
|
};
|
|
707
|
-
return (React__default['default'].createElement("div", { className: styles$
|
|
707
|
+
return (React__default['default'].createElement("div", { className: styles$u.checkboxContainer },
|
|
708
708
|
React__default['default'].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
709
|
-
React__default['default'].createElement("label", { onClick: handleClick, className: styles$
|
|
709
|
+
React__default['default'].createElement("label", { onClick: handleClick, className: styles$u.checkboxLabel + ' ' + (disabled ? styles$u['disabled'] : undefined) }, label),
|
|
710
710
|
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
711
|
};
|
|
712
712
|
|
|
713
|
-
var css_248z$
|
|
714
|
-
var styles$
|
|
715
|
-
styleInject(css_248z$
|
|
713
|
+
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}";
|
|
714
|
+
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"};
|
|
715
|
+
styleInject(css_248z$t);
|
|
716
716
|
|
|
717
717
|
const Chip = (props) => {
|
|
718
718
|
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
719
|
const getCssClass = () => {
|
|
720
720
|
const cssClasses = [];
|
|
721
|
-
cssClasses.push(styles$
|
|
722
|
-
cssClasses.push(styles$
|
|
723
|
-
shadow && cssClasses.push(styles$
|
|
724
|
-
onClick && cssClasses.push(styles$
|
|
721
|
+
cssClasses.push(styles$t.chip);
|
|
722
|
+
cssClasses.push(styles$t[color]);
|
|
723
|
+
shadow && cssClasses.push(styles$t['shadow']);
|
|
724
|
+
onClick && cssClasses.push(styles$t['clickable']);
|
|
725
725
|
className && cssClasses.push(className);
|
|
726
726
|
return cssClasses.filter(r => r).join(' ');
|
|
727
727
|
};
|
|
@@ -731,7 +731,7 @@ const Chip = (props) => {
|
|
|
731
731
|
};
|
|
732
732
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
733
733
|
React__default['default'].createElement("div", null, children),
|
|
734
|
-
isDeletable && (React__default['default'].createElement("div", { className: styles$
|
|
734
|
+
isDeletable && (React__default['default'].createElement("div", { className: styles$t.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
735
735
|
};
|
|
736
736
|
|
|
737
737
|
const FormLabel = ({ children, className, htmlFor }) => (React__default['default'].createElement("label", { htmlFor: htmlFor, className: className }, children));
|
|
@@ -767,9 +767,9 @@ const FileInput = (props) => {
|
|
|
767
767
|
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
768
|
};
|
|
769
769
|
|
|
770
|
-
var css_248z$
|
|
771
|
-
var styles$
|
|
772
|
-
styleInject(css_248z$
|
|
770
|
+
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}";
|
|
771
|
+
var styles$s = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
772
|
+
styleInject(css_248z$s);
|
|
773
773
|
|
|
774
774
|
const Select = (props) => {
|
|
775
775
|
var _a, _b, _c;
|
|
@@ -782,7 +782,7 @@ const Select = (props) => {
|
|
|
782
782
|
const getCssClass = () => {
|
|
783
783
|
const cssClasses = [];
|
|
784
784
|
className && cssClasses.push(className);
|
|
785
|
-
cssClasses.push(styles$
|
|
785
|
+
cssClasses.push(styles$s.select);
|
|
786
786
|
return cssClasses.filter(r => r).join(' ');
|
|
787
787
|
};
|
|
788
788
|
React.useEffect(() => {
|
|
@@ -901,7 +901,7 @@ const Select = (props) => {
|
|
|
901
901
|
}
|
|
902
902
|
};
|
|
903
903
|
return (React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
904
|
-
React__default['default'].createElement("div", { ref: selectConainter, className: styles$
|
|
904
|
+
React__default['default'].createElement("div", { ref: selectConainter, className: styles$s.selectContainer },
|
|
905
905
|
React__default['default'].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
906
906
|
!multiple && renderSingleViewModel(),
|
|
907
907
|
multiple && renderMultipleViewModel(),
|
|
@@ -909,7 +909,7 @@ const Select = (props) => {
|
|
|
909
909
|
React__default['default'].createElement(ChevronDownSolidIcon, null))),
|
|
910
910
|
isShow &&
|
|
911
911
|
reactDom.createPortal(React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
912
|
-
React__default['default'].createElement("div", { className: styles$
|
|
912
|
+
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
913
|
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
914
|
multiple &&
|
|
915
915
|
React__default['default'].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -917,15 +917,15 @@ const Select = (props) => {
|
|
|
917
917
|
React__default['default'].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
918
918
|
};
|
|
919
919
|
|
|
920
|
-
var css_248z$
|
|
921
|
-
var styles$
|
|
922
|
-
styleInject(css_248z$
|
|
920
|
+
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}";
|
|
921
|
+
var styles$r = {};
|
|
922
|
+
styleInject(css_248z$r);
|
|
923
923
|
|
|
924
924
|
const Textarea = (props) => {
|
|
925
925
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
926
926
|
const getCssClass = () => {
|
|
927
927
|
const cssClasses = [];
|
|
928
|
-
cssClasses.push(styles$
|
|
928
|
+
cssClasses.push(styles$r.textarea);
|
|
929
929
|
className && cssClasses.push(className);
|
|
930
930
|
return cssClasses.filter(r => r).join(' ');
|
|
931
931
|
};
|
|
@@ -1281,16 +1281,16 @@ const DateSelect = (props) => {
|
|
|
1281
1281
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1282
1282
|
// };
|
|
1283
1283
|
|
|
1284
|
-
var css_248z$
|
|
1285
|
-
var styles$
|
|
1286
|
-
styleInject(css_248z$
|
|
1284
|
+
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}";
|
|
1285
|
+
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"};
|
|
1286
|
+
styleInject(css_248z$q);
|
|
1287
1287
|
|
|
1288
1288
|
const Drawer = (props) => {
|
|
1289
1289
|
const { children, className, position = 'left', permanent = false, target = document.body, onClickBackdrop } = props;
|
|
1290
1290
|
React.useEffect(() => {
|
|
1291
|
-
document.body.classList.add(styles$
|
|
1291
|
+
document.body.classList.add(styles$q.drawerOpen);
|
|
1292
1292
|
return () => {
|
|
1293
|
-
document.body.classList.remove(styles$
|
|
1293
|
+
document.body.classList.remove(styles$q.drawerOpen);
|
|
1294
1294
|
};
|
|
1295
1295
|
}, []);
|
|
1296
1296
|
const handleClickBackdrop = () => {
|
|
@@ -1304,10 +1304,10 @@ const DrawerContent = (props) => {
|
|
|
1304
1304
|
const { children, className, position = 'left', permanent = false } = props;
|
|
1305
1305
|
const getCssClasses = () => {
|
|
1306
1306
|
const cssClasses = [];
|
|
1307
|
-
cssClasses.push(styles$
|
|
1307
|
+
cssClasses.push(styles$q.drawer);
|
|
1308
1308
|
className && cssClasses.push(className);
|
|
1309
|
-
!!permanent && cssClasses.push(styles$
|
|
1310
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1309
|
+
!!permanent && cssClasses.push(styles$q['permanent']);
|
|
1310
|
+
position === 'left' ? cssClasses.push(styles$q['left']) : cssClasses.push(styles$q['right']);
|
|
1311
1311
|
return cssClasses.filter(css => css).join(' ');
|
|
1312
1312
|
};
|
|
1313
1313
|
const positionStyles = {
|
|
@@ -1320,9 +1320,9 @@ const DrawerContent = (props) => {
|
|
|
1320
1320
|
return (React__default['default'].createElement("div", { className: getCssClasses(), style: getStyles() }, children));
|
|
1321
1321
|
};
|
|
1322
1322
|
|
|
1323
|
-
var css_248z$
|
|
1324
|
-
var styles$
|
|
1325
|
-
styleInject(css_248z$
|
|
1323
|
+
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}";
|
|
1324
|
+
var styles$p = {"menuBody":"MenuBody-module_menuBody__3cPsp","shadow":"MenuBody-module_shadow__AF_9C"};
|
|
1325
|
+
styleInject(css_248z$p);
|
|
1326
1326
|
|
|
1327
1327
|
const MenuBody = (props) => {
|
|
1328
1328
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1352,8 +1352,8 @@ const MenuBody = (props) => {
|
|
|
1352
1352
|
}, [menuBodyRef]);
|
|
1353
1353
|
const getCssClasses = () => {
|
|
1354
1354
|
const cssClasses = [];
|
|
1355
|
-
cssClasses.push(styles$
|
|
1356
|
-
shadow && cssClasses.push(styles$
|
|
1355
|
+
cssClasses.push(styles$p.menuBody);
|
|
1356
|
+
shadow && cssClasses.push(styles$p.shadow);
|
|
1357
1357
|
className && cssClasses.push(className);
|
|
1358
1358
|
return cssClasses.filter(css => css).join(' ');
|
|
1359
1359
|
};
|
|
@@ -1365,9 +1365,9 @@ const MenuBody = (props) => {
|
|
|
1365
1365
|
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1366
1366
|
};
|
|
1367
1367
|
|
|
1368
|
-
var css_248z$
|
|
1369
|
-
var styles$
|
|
1370
|
-
styleInject(css_248z$
|
|
1368
|
+
var css_248z$o = ".Menu-module_menu__23BYG {\n display: flex;\n}";
|
|
1369
|
+
var styles$o = {"menu":"Menu-module_menu__23BYG"};
|
|
1370
|
+
styleInject(css_248z$o);
|
|
1371
1371
|
|
|
1372
1372
|
const Menu = (props) => {
|
|
1373
1373
|
const { toggle, children, className, open, menuPosition, onClickBackdrop, onToggleClick } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop", "onToggleClick"]);
|
|
@@ -1375,7 +1375,7 @@ const Menu = (props) => {
|
|
|
1375
1375
|
const toggleContainerRef = React.useRef(null);
|
|
1376
1376
|
const getCssClasses = () => {
|
|
1377
1377
|
const cssClasses = [];
|
|
1378
|
-
cssClasses.push(styles$
|
|
1378
|
+
cssClasses.push(styles$o.menu);
|
|
1379
1379
|
className && cssClasses.push(className);
|
|
1380
1380
|
return cssClasses.filter(css => css).join(' ');
|
|
1381
1381
|
};
|
|
@@ -1388,17 +1388,17 @@ const Menu = (props) => {
|
|
|
1388
1388
|
React__default['default'].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1389
1389
|
};
|
|
1390
1390
|
|
|
1391
|
-
var css_248z$
|
|
1392
|
-
var styles$
|
|
1393
|
-
styleInject(css_248z$
|
|
1391
|
+
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}";
|
|
1392
|
+
var styles$n = {"menuItem":"MenuItem-module_menuItem__kvauR","menuItemHeader":"MenuItem-module_menuItemHeader__mp7wc"};
|
|
1393
|
+
styleInject(css_248z$n);
|
|
1394
1394
|
|
|
1395
1395
|
const MenuItem = (props) => {
|
|
1396
1396
|
const { children, onClick, type = 'item' } = props;
|
|
1397
1397
|
const getCssClasses = () => {
|
|
1398
1398
|
const cssClasses = [];
|
|
1399
|
-
cssClasses.push(styles$
|
|
1399
|
+
cssClasses.push(styles$n.menuItem);
|
|
1400
1400
|
if (type === 'header') {
|
|
1401
|
-
cssClasses.push(styles$
|
|
1401
|
+
cssClasses.push(styles$n.menuItemHeader);
|
|
1402
1402
|
}
|
|
1403
1403
|
return cssClasses.filter(css => css).join(' ');
|
|
1404
1404
|
};
|
|
@@ -1416,23 +1416,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1416
1416
|
return (React__default['default'].createElement(React.Fragment, null, children));
|
|
1417
1417
|
};
|
|
1418
1418
|
|
|
1419
|
-
var css_248z$
|
|
1420
|
-
var styles$
|
|
1421
|
-
styleInject(css_248z$
|
|
1419
|
+
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}";
|
|
1420
|
+
var styles$m = {"menuItemDivider":"MenuDivider-module_menuItemDivider__JnLsC"};
|
|
1421
|
+
styleInject(css_248z$m);
|
|
1422
1422
|
|
|
1423
|
-
const MenuDivider = () => React__default['default'].createElement("div", { className: styles$
|
|
1423
|
+
const MenuDivider = () => React__default['default'].createElement("div", { className: styles$m.menuItemDivider });
|
|
1424
1424
|
|
|
1425
|
-
var css_248z$
|
|
1426
|
-
var styles$
|
|
1427
|
-
styleInject(css_248z$
|
|
1425
|
+
var css_248z$l = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px;\n}";
|
|
1426
|
+
var styles$l = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__3H62L"};
|
|
1427
|
+
styleInject(css_248z$l);
|
|
1428
1428
|
|
|
1429
1429
|
const ExpansionPanelContent = ({ children }) => {
|
|
1430
|
-
return (React__default['default'].createElement("div", { className: styles$
|
|
1430
|
+
return (React__default['default'].createElement("div", { className: styles$l.expansionPanelContent }, children));
|
|
1431
1431
|
};
|
|
1432
1432
|
|
|
1433
|
-
var css_248z$
|
|
1434
|
-
var styles$
|
|
1435
|
-
styleInject(css_248z$
|
|
1433
|
+
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}";
|
|
1434
|
+
var styles$k = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__3hrsI"};
|
|
1435
|
+
styleInject(css_248z$k);
|
|
1436
1436
|
|
|
1437
1437
|
const ExpansionPanelHeader = (props) => {
|
|
1438
1438
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1440,15 +1440,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1440
1440
|
e.stopPropagation();
|
|
1441
1441
|
onClick && onClick(e);
|
|
1442
1442
|
};
|
|
1443
|
-
return (React__default['default'].createElement("div", { className: styles$
|
|
1443
|
+
return (React__default['default'].createElement("div", { className: styles$k.expansionPanelHeader, onClick: handleClick },
|
|
1444
1444
|
children,
|
|
1445
1445
|
React__default['default'].createElement("span", { className: "ml-auto text-muted" },
|
|
1446
1446
|
React__default['default'].createElement(Icon, null, isExpanded ? React__default['default'].createElement(ChevronUpSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null)))));
|
|
1447
1447
|
};
|
|
1448
1448
|
|
|
1449
|
-
var css_248z$
|
|
1450
|
-
var styles$
|
|
1451
|
-
styleInject(css_248z$
|
|
1449
|
+
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}";
|
|
1450
|
+
var styles$j = {"expansionPanel":"ExpansionPanel-module_expansionPanel__3krcE","isExpanded":"ExpansionPanel-module_isExpanded__1m4Dt"};
|
|
1451
|
+
styleInject(css_248z$j);
|
|
1452
1452
|
|
|
1453
1453
|
const ExpansionPanel = (props) => {
|
|
1454
1454
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1458,9 +1458,9 @@ const ExpansionPanel = (props) => {
|
|
|
1458
1458
|
}, [isExpanded]);
|
|
1459
1459
|
const getCssClasses = () => {
|
|
1460
1460
|
const cssClasses = [];
|
|
1461
|
-
cssClasses.push(styles$
|
|
1461
|
+
cssClasses.push(styles$j.expansionPanel);
|
|
1462
1462
|
if (_isExpanded) {
|
|
1463
|
-
cssClasses.push(styles$
|
|
1463
|
+
cssClasses.push(styles$j.isExpanded);
|
|
1464
1464
|
}
|
|
1465
1465
|
return cssClasses.filter(css => css).join(' ');
|
|
1466
1466
|
};
|
|
@@ -1474,16 +1474,16 @@ const ExpansionPanel = (props) => {
|
|
|
1474
1474
|
React__default['default'].createElement(ExpansionPanelContent, null, children)));
|
|
1475
1475
|
};
|
|
1476
1476
|
|
|
1477
|
-
var css_248z$
|
|
1478
|
-
var styles$
|
|
1479
|
-
styleInject(css_248z$
|
|
1477
|
+
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}";
|
|
1478
|
+
var styles$i = {"fab":"FloatingActionButton-module_fab__3GwiH","fixed":"FloatingActionButton-module_fixed__17qrv"};
|
|
1479
|
+
styleInject(css_248z$i);
|
|
1480
1480
|
|
|
1481
1481
|
const FloatingActionButton = (props) => {
|
|
1482
1482
|
const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1483
1483
|
const getCssClasses = () => {
|
|
1484
1484
|
const cssClasses = [];
|
|
1485
|
-
cssClasses.push(styles$
|
|
1486
|
-
fixed && cssClasses.push(styles$
|
|
1485
|
+
cssClasses.push(styles$i.fab);
|
|
1486
|
+
fixed && cssClasses.push(styles$i['fixed']);
|
|
1487
1487
|
className && cssClasses.push(className);
|
|
1488
1488
|
return cssClasses.filter(css => css).join(' ');
|
|
1489
1489
|
};
|
|
@@ -1545,14 +1545,14 @@ const Link = (props) => {
|
|
|
1545
1545
|
return (React__default['default'].createElement("a", { className: getCssClasses(), href: url || '#', target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, children));
|
|
1546
1546
|
};
|
|
1547
1547
|
|
|
1548
|
-
var css_248z$
|
|
1549
|
-
var styles$
|
|
1550
|
-
styleInject(css_248z$
|
|
1548
|
+
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}";
|
|
1549
|
+
var styles$h = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__3e1-3","loadingIndicator":"LoadingIndicator-module_loadingIndicator__tvp5i","spinAnimation":"LoadingIndicator-module_spinAnimation__PKRNn"};
|
|
1550
|
+
styleInject(css_248z$h);
|
|
1551
1551
|
|
|
1552
1552
|
const LoadingIndicator = () => {
|
|
1553
1553
|
const getCssClasses = () => {
|
|
1554
1554
|
const cssClasses = [];
|
|
1555
|
-
cssClasses.push(styles$
|
|
1555
|
+
cssClasses.push(styles$h.loadingIndicator);
|
|
1556
1556
|
return cssClasses.filter(css => css).join(' ');
|
|
1557
1557
|
};
|
|
1558
1558
|
return (React__default['default'].createElement("div", { className: getCssClasses() },
|
|
@@ -1562,7 +1562,7 @@ const LoadingIndicator = () => {
|
|
|
1562
1562
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1563
1563
|
const getCssClasses = () => {
|
|
1564
1564
|
const cssClasses = [];
|
|
1565
|
-
cssClasses.push(styles$
|
|
1565
|
+
cssClasses.push(styles$h.loadingIndicatorContainer);
|
|
1566
1566
|
return cssClasses.filter(css => css).join(' ');
|
|
1567
1567
|
};
|
|
1568
1568
|
return (React__default['default'].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1592,16 +1592,16 @@ class LoadingIndicatorService {
|
|
|
1592
1592
|
}
|
|
1593
1593
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1594
1594
|
|
|
1595
|
-
var css_248z$
|
|
1596
|
-
var styles$
|
|
1597
|
-
styleInject(css_248z$
|
|
1595
|
+
var css_248z$g = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center;\n}";
|
|
1596
|
+
var styles$g = {"modalHeader":"ModalHeader-module_modalHeader__o5HzE"};
|
|
1597
|
+
styleInject(css_248z$g);
|
|
1598
1598
|
|
|
1599
1599
|
const ModalHeader = (props) => {
|
|
1600
1600
|
const { children, isDismissable = false, onClose } = props;
|
|
1601
1601
|
const handleClick = () => {
|
|
1602
1602
|
onClose && onClose();
|
|
1603
1603
|
};
|
|
1604
|
-
return (React__default['default'].createElement("div", { className: "modal-header " + styles$
|
|
1604
|
+
return (React__default['default'].createElement("div", { className: "modal-header " + styles$g.modalHeader },
|
|
1605
1605
|
React__default['default'].createElement("h5", { className: "modal-title" }, children),
|
|
1606
1606
|
isDismissable &&
|
|
1607
1607
|
React__default['default'].createElement(IconButton, { icon: React__default['default'].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
@@ -1609,24 +1609,24 @@ const ModalHeader = (props) => {
|
|
|
1609
1609
|
|
|
1610
1610
|
const ModalBody = ({ children }) => (React__default['default'].createElement("div", { className: "modal-body" }, children));
|
|
1611
1611
|
|
|
1612
|
-
var css_248z$
|
|
1613
|
-
var styles$
|
|
1614
|
-
styleInject(css_248z$
|
|
1612
|
+
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}";
|
|
1613
|
+
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"};
|
|
1614
|
+
styleInject(css_248z$f);
|
|
1615
1615
|
|
|
1616
|
-
var css_248z$
|
|
1617
|
-
var styles$
|
|
1618
|
-
styleInject(css_248z$
|
|
1616
|
+
var css_248z$e = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none;\n}";
|
|
1617
|
+
var styles$e = {"modalFooter":"ModalFooter-module_modalFooter__2Et4e"};
|
|
1618
|
+
styleInject(css_248z$e);
|
|
1619
1619
|
|
|
1620
|
-
const ModalFooter = ({ children }) => (React__default['default'].createElement("div", { className: "modal-footer " + styles$
|
|
1620
|
+
const ModalFooter = ({ children }) => (React__default['default'].createElement("div", { className: "modal-footer " + styles$e.modalFooter }, children));
|
|
1621
1621
|
|
|
1622
1622
|
const Modal = (props) => {
|
|
1623
1623
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1624
1624
|
const getCssClass = () => {
|
|
1625
1625
|
const cssClasses = [];
|
|
1626
1626
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1627
|
-
cssClasses.push(styles$
|
|
1628
|
-
!!fullScreen && cssClasses.push(styles$
|
|
1629
|
-
size && cssClasses.push(styles$
|
|
1627
|
+
cssClasses.push(styles$f.modal);
|
|
1628
|
+
!!fullScreen && cssClasses.push(styles$f['fullscreen']);
|
|
1629
|
+
size && cssClasses.push(styles$f[size]);
|
|
1630
1630
|
className && cssClasses.push(className);
|
|
1631
1631
|
return cssClasses.filter(r => r).join(' ');
|
|
1632
1632
|
};
|
|
@@ -1640,9 +1640,9 @@ const Modal = (props) => {
|
|
|
1640
1640
|
onBackdropClick && onBackdropClick();
|
|
1641
1641
|
};
|
|
1642
1642
|
return (React__default['default'].createElement(React.Fragment, null,
|
|
1643
|
-
React__default['default'].createElement("div", { className: "modal show " + styles$
|
|
1643
|
+
React__default['default'].createElement("div", { className: "modal show " + styles$f.modal, style: { display: 'block' } },
|
|
1644
1644
|
React__default['default'].createElement("div", { className: getCssClass() },
|
|
1645
|
-
React__default['default'].createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$
|
|
1645
|
+
React__default['default'].createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$f['modalContent'] : undefined) },
|
|
1646
1646
|
header &&
|
|
1647
1647
|
React__default['default'].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1648
1648
|
React__default['default'].createElement(ModalBody, null, children),
|
|
@@ -1842,25 +1842,25 @@ const Sidebar = (props) => {
|
|
|
1842
1842
|
!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
1843
|
};
|
|
1844
1844
|
|
|
1845
|
-
var css_248z$
|
|
1846
|
-
var styles$
|
|
1847
|
-
styleInject(css_248z$
|
|
1845
|
+
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}";
|
|
1846
|
+
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"};
|
|
1847
|
+
styleInject(css_248z$d);
|
|
1848
1848
|
|
|
1849
1849
|
const Snackbar = (props) => {
|
|
1850
1850
|
const { message, color = exports.COLOR.dark, actionText = 'ok', onOk } = props;
|
|
1851
1851
|
const getCssClasses = () => {
|
|
1852
1852
|
const cssClasses = [];
|
|
1853
|
-
cssClasses.push(styles$
|
|
1853
|
+
cssClasses.push(styles$d.snackbar);
|
|
1854
1854
|
cssClasses.push(`shadow-lg`);
|
|
1855
|
-
cssClasses.push(styles$
|
|
1855
|
+
cssClasses.push(styles$d[color]);
|
|
1856
1856
|
return cssClasses.filter(css => css).join(' ');
|
|
1857
1857
|
};
|
|
1858
1858
|
const handleClickAction = () => {
|
|
1859
1859
|
onOk && onOk();
|
|
1860
1860
|
};
|
|
1861
1861
|
return (React__default['default'].createElement("div", { className: getCssClasses() },
|
|
1862
|
-
React__default['default'].createElement("div", { className: styles$
|
|
1863
|
-
React__default['default'].createElement("div", { className: styles$
|
|
1862
|
+
React__default['default'].createElement("div", { className: styles$d.text }, message),
|
|
1863
|
+
React__default['default'].createElement("div", { className: styles$d.action + " text-accent", onClick: handleClickAction },
|
|
1864
1864
|
React__default['default'].createElement("span", null, actionText))));
|
|
1865
1865
|
};
|
|
1866
1866
|
|
|
@@ -1898,29 +1898,29 @@ class SnackbarService {
|
|
|
1898
1898
|
}
|
|
1899
1899
|
const snackbarService = new SnackbarService();
|
|
1900
1900
|
|
|
1901
|
-
var css_248z$
|
|
1902
|
-
var styles$
|
|
1903
|
-
styleInject(css_248z$
|
|
1901
|
+
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}";
|
|
1902
|
+
var styles$c = {"speedDialActions":"SpeedDialActions-module_speedDialActions__zLEps"};
|
|
1903
|
+
styleInject(css_248z$c);
|
|
1904
1904
|
|
|
1905
1905
|
const SpeedDialActions = (props) => {
|
|
1906
1906
|
const { children } = props;
|
|
1907
1907
|
const getCssClasses = () => {
|
|
1908
1908
|
const cssClasses = [];
|
|
1909
|
-
cssClasses.push(styles$
|
|
1909
|
+
cssClasses.push(styles$c.speedDialActions);
|
|
1910
1910
|
return cssClasses.filter(css => css).join(' ');
|
|
1911
1911
|
};
|
|
1912
1912
|
return (React__default['default'].createElement("div", { className: getCssClasses() }, children));
|
|
1913
1913
|
};
|
|
1914
1914
|
|
|
1915
|
-
var css_248z$
|
|
1916
|
-
var styles$
|
|
1917
|
-
styleInject(css_248z$
|
|
1915
|
+
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}";
|
|
1916
|
+
var styles$b = {"speedDial":"SpeedDial-module_speedDial__CQ5x2"};
|
|
1917
|
+
styleInject(css_248z$b);
|
|
1918
1918
|
|
|
1919
1919
|
const SpeedDial = (props) => {
|
|
1920
1920
|
const { children, className, open, onOpen, onClose } = props, rest = __rest(props, ["children", "className", "open", "onOpen", "onClose"]);
|
|
1921
1921
|
const getCssClasses = () => {
|
|
1922
1922
|
const cssClasses = [];
|
|
1923
|
-
cssClasses.push(styles$
|
|
1923
|
+
cssClasses.push(styles$b.speedDial);
|
|
1924
1924
|
className && cssClasses.push(className);
|
|
1925
1925
|
return cssClasses.filter(css => css).join(' ');
|
|
1926
1926
|
};
|
|
@@ -1937,15 +1937,15 @@ const SpeedDial = (props) => {
|
|
|
1937
1937
|
React__default['default'].createElement(SpeedDialActions, null, children)));
|
|
1938
1938
|
};
|
|
1939
1939
|
|
|
1940
|
-
var css_248z$
|
|
1941
|
-
var styles$
|
|
1942
|
-
styleInject(css_248z$
|
|
1940
|
+
var css_248z$a = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px;\n}";
|
|
1941
|
+
var styles$a = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs"};
|
|
1942
|
+
styleInject(css_248z$a);
|
|
1943
1943
|
|
|
1944
1944
|
const SpeedDialAction = (props) => {
|
|
1945
1945
|
const { icon, onClick, className } = props;
|
|
1946
1946
|
const getCssClasses = () => {
|
|
1947
1947
|
const cssClasses = [];
|
|
1948
|
-
cssClasses.push(styles$
|
|
1948
|
+
cssClasses.push(styles$a.speedDialAction);
|
|
1949
1949
|
className && cssClasses.push(className);
|
|
1950
1950
|
return cssClasses.filter(css => css).join(' ');
|
|
1951
1951
|
};
|
|
@@ -1962,15 +1962,15 @@ const SpeedDialIcon = (props) => {
|
|
|
1962
1962
|
return (React__default['default'].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
1963
1963
|
};
|
|
1964
1964
|
|
|
1965
|
-
var css_248z$
|
|
1966
|
-
var styles$
|
|
1967
|
-
styleInject(css_248z$
|
|
1965
|
+
var css_248z$9 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex;\n}";
|
|
1966
|
+
var styles$9 = {"stepperActions":"StepperActions-module_stepperActions__2r5ZT"};
|
|
1967
|
+
styleInject(css_248z$9);
|
|
1968
1968
|
|
|
1969
1969
|
const StepperActions = (props) => {
|
|
1970
1970
|
const { className, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
|
|
1971
1971
|
const getCssClasses = () => {
|
|
1972
1972
|
const cssClasses = [];
|
|
1973
|
-
cssClasses.push(styles$
|
|
1973
|
+
cssClasses.push(styles$9.stepperActions);
|
|
1974
1974
|
className && cssClasses.push(className);
|
|
1975
1975
|
return cssClasses.filter(css => css).join(' ');
|
|
1976
1976
|
};
|
|
@@ -1987,31 +1987,31 @@ const StepPanel = (props) => {
|
|
|
1987
1987
|
return (React__default['default'].createElement("div", { className: "steppanel" }, children));
|
|
1988
1988
|
};
|
|
1989
1989
|
|
|
1990
|
-
var css_248z$
|
|
1991
|
-
var styles$
|
|
1992
|
-
styleInject(css_248z$
|
|
1990
|
+
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}";
|
|
1991
|
+
var styles$8 = {"stepConnector":"StepConnector-module_stepConnector__2m7Xp","stepConnectorLine":"StepConnector-module_stepConnectorLine__jSqG4","isActive":"StepConnector-module_isActive__3Yj6N","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__3R2R8"};
|
|
1992
|
+
styleInject(css_248z$8);
|
|
1993
1993
|
|
|
1994
1994
|
const StepConnector = (props) => {
|
|
1995
1995
|
const { isActive, isHorizontal = true } = props;
|
|
1996
1996
|
const getCssClassesConnector = () => {
|
|
1997
1997
|
const cssClasses = [];
|
|
1998
|
-
cssClasses.push(styles$
|
|
1998
|
+
cssClasses.push(styles$8.stepConnector);
|
|
1999
1999
|
return cssClasses.filter(css => css).join(' ');
|
|
2000
2000
|
};
|
|
2001
2001
|
const getCssClassesLine = () => {
|
|
2002
2002
|
const cssClasses = [];
|
|
2003
|
-
cssClasses.push(styles$
|
|
2004
|
-
isActive && cssClasses.push(styles$
|
|
2005
|
-
isHorizontal && cssClasses.push(styles$
|
|
2003
|
+
cssClasses.push(styles$8.stepConnectorLine);
|
|
2004
|
+
isActive && cssClasses.push(styles$8['isActive']);
|
|
2005
|
+
isHorizontal && cssClasses.push(styles$8.stepConnectorLineHorizontal);
|
|
2006
2006
|
return cssClasses.filter(css => css).join(' ');
|
|
2007
2007
|
};
|
|
2008
2008
|
return (React__default['default'].createElement("div", { className: getCssClassesConnector() },
|
|
2009
2009
|
React__default['default'].createElement("div", { className: getCssClassesLine() })));
|
|
2010
2010
|
};
|
|
2011
2011
|
|
|
2012
|
-
var css_248z$
|
|
2013
|
-
var styles$
|
|
2014
|
-
styleInject(css_248z$
|
|
2012
|
+
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}";
|
|
2013
|
+
var styles$7 = {"stepper":"Stepper-module_stepper__1TOxM","isHorizontal":"Stepper-module_isHorizontal__3rFHH"};
|
|
2014
|
+
styleInject(css_248z$7);
|
|
2015
2015
|
|
|
2016
2016
|
const Stepper = (props) => {
|
|
2017
2017
|
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
|
|
@@ -2099,8 +2099,8 @@ const Stepper = (props) => {
|
|
|
2099
2099
|
};
|
|
2100
2100
|
const getCssClasses = () => {
|
|
2101
2101
|
const cssClasses = [];
|
|
2102
|
-
cssClasses.push(styles$
|
|
2103
|
-
isHorizontal && cssClasses.push(styles$
|
|
2102
|
+
cssClasses.push(styles$7.stepper);
|
|
2103
|
+
isHorizontal && cssClasses.push(styles$7['isHorizontal']);
|
|
2104
2104
|
return cssClasses.filter(css => css).join(' ');
|
|
2105
2105
|
};
|
|
2106
2106
|
return (React__default['default'].createElement(React__default['default'].Fragment, null, steps &&
|
|
@@ -2169,9 +2169,9 @@ function useDebounce(callback, timeout, deps) {
|
|
|
2169
2169
|
}, deps);
|
|
2170
2170
|
}
|
|
2171
2171
|
|
|
2172
|
-
var css_248z$
|
|
2173
|
-
var styles$
|
|
2174
|
-
styleInject(css_248z$
|
|
2172
|
+
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}";
|
|
2173
|
+
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"};
|
|
2174
|
+
styleInject(css_248z$6);
|
|
2175
2175
|
|
|
2176
2176
|
const Step = (props) => {
|
|
2177
2177
|
const { className, label, showLabel, index, value, isActive, isDone, isDisabled, showProgressCheckIcon, onClick } = props;
|
|
@@ -2183,24 +2183,24 @@ const Step = (props) => {
|
|
|
2183
2183
|
};
|
|
2184
2184
|
const getCssClasses = () => {
|
|
2185
2185
|
const cssClasses = [];
|
|
2186
|
-
cssClasses.push(styles$
|
|
2187
|
-
label && showLabel && cssClasses.push(styles$
|
|
2188
|
-
isDisabled && cssClasses.push(styles$
|
|
2186
|
+
cssClasses.push(styles$6.stepWrapper);
|
|
2187
|
+
label && showLabel && cssClasses.push(styles$6['hasLabel']);
|
|
2188
|
+
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2189
2189
|
className && cssClasses.push(className);
|
|
2190
2190
|
return cssClasses.filter(css => css).join(' ');
|
|
2191
2191
|
};
|
|
2192
2192
|
const getCssClassesStep = () => {
|
|
2193
2193
|
const cssClasses = [];
|
|
2194
|
-
cssClasses.push(styles$
|
|
2195
|
-
label && showLabel && cssClasses.push(styles$
|
|
2196
|
-
isDisabled && cssClasses.push(styles$
|
|
2194
|
+
cssClasses.push(styles$6.step);
|
|
2195
|
+
label && showLabel && cssClasses.push(styles$6['hasLabel']);
|
|
2196
|
+
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2197
2197
|
return cssClasses.filter(css => css).join(' ');
|
|
2198
2198
|
};
|
|
2199
2199
|
return (React__default['default'].createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
|
|
2200
2200
|
React__default['default'].createElement("div", { className: getCssClassesStep() },
|
|
2201
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
2201
|
+
React__default['default'].createElement(Icon, { className: styles$6.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? exports.COLOR.primary : exports.COLOR.secondary },
|
|
2202
2202
|
React__default['default'].createElement(CircleSolidIcon, null)),
|
|
2203
|
-
React__default['default'].createElement("div", { className: styles$
|
|
2203
|
+
React__default['default'].createElement("div", { className: styles$6.stepValue + ' ' + (isActive ? (styles$6.stepValue['isActive']) : '') }, showProgressCheckIcon && isActive && isDone ?
|
|
2204
2204
|
React__default['default'].createElement(Icon, null,
|
|
2205
2205
|
React__default['default'].createElement(CheckSolidIcon, null))
|
|
2206
2206
|
:
|
|
@@ -2224,16 +2224,16 @@ const Table = (props) => {
|
|
|
2224
2224
|
React__default['default'].createElement("table", { className: getCssClasses() }, children)));
|
|
2225
2225
|
};
|
|
2226
2226
|
|
|
2227
|
-
var css_248z$
|
|
2228
|
-
var styles$
|
|
2229
|
-
styleInject(css_248z$
|
|
2227
|
+
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}";
|
|
2228
|
+
var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__wj9Qm","primary":"TabIndicator-module_primary__2Lc8c","accent":"TabIndicator-module_accent__37h0D"};
|
|
2229
|
+
styleInject(css_248z$5);
|
|
2230
2230
|
|
|
2231
2231
|
const TabIndicator = (props) => {
|
|
2232
2232
|
const { color = exports.COLOR.accent, width, amount, index } = props;
|
|
2233
2233
|
const getCssClasses = () => {
|
|
2234
2234
|
const cssClasses = [];
|
|
2235
|
-
cssClasses.push(styles$
|
|
2236
|
-
cssClasses.push(styles$
|
|
2235
|
+
cssClasses.push(styles$5.tabIndicator);
|
|
2236
|
+
cssClasses.push(styles$5[color]);
|
|
2237
2237
|
return cssClasses.filter(css => css).join(' ');
|
|
2238
2238
|
};
|
|
2239
2239
|
return (React__default['default'].createElement("span", { className: getCssClasses(), style: {
|
|
@@ -2242,9 +2242,9 @@ const TabIndicator = (props) => {
|
|
|
2242
2242
|
} }));
|
|
2243
2243
|
};
|
|
2244
2244
|
|
|
2245
|
-
var css_248z$
|
|
2246
|
-
var styles$
|
|
2247
|
-
styleInject(css_248z$
|
|
2245
|
+
var css_248z$4 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative;\n}";
|
|
2246
|
+
var styles$4 = {"tabs":"Tabs-module_tabs__2azkC"};
|
|
2247
|
+
styleInject(css_248z$4);
|
|
2248
2248
|
|
|
2249
2249
|
const Tabs = (props) => {
|
|
2250
2250
|
const { children, className, fixed, indicatorColor, onChange, value } = props;
|
|
@@ -2259,7 +2259,7 @@ const Tabs = (props) => {
|
|
|
2259
2259
|
}, [children, value]);
|
|
2260
2260
|
const getCssClasses = () => {
|
|
2261
2261
|
const cssClasses = [];
|
|
2262
|
-
cssClasses.push(styles$
|
|
2262
|
+
cssClasses.push(styles$4.tabs);
|
|
2263
2263
|
className && cssClasses.push(className);
|
|
2264
2264
|
return cssClasses.filter(css => css).join(' ');
|
|
2265
2265
|
};
|
|
@@ -2283,15 +2283,15 @@ const Tabs = (props) => {
|
|
|
2283
2283
|
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
2284
|
};
|
|
2285
2285
|
|
|
2286
|
-
var css_248z$
|
|
2287
|
-
var styles$
|
|
2288
|
-
styleInject(css_248z$
|
|
2286
|
+
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}";
|
|
2287
|
+
var styles$3 = {"tab":"Tab-module_tab__31Fjd"};
|
|
2288
|
+
styleInject(css_248z$3);
|
|
2289
2289
|
|
|
2290
2290
|
const Tab = (props) => {
|
|
2291
2291
|
const { label, className, isActive, disabled, value, onClick } = props;
|
|
2292
2292
|
const getCssClasses = () => {
|
|
2293
2293
|
const cssClasses = [];
|
|
2294
|
-
cssClasses.push(styles$
|
|
2294
|
+
cssClasses.push(styles$3.tab);
|
|
2295
2295
|
if (isActive) {
|
|
2296
2296
|
cssClasses.push(`show active`);
|
|
2297
2297
|
}
|
|
@@ -2306,9 +2306,9 @@ const TabPanel = (props) => {
|
|
|
2306
2306
|
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
2307
|
};
|
|
2308
2308
|
|
|
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);
|
|
2309
|
+
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}";
|
|
2310
|
+
var styles$2 = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2311
|
+
styleInject(css_248z$2);
|
|
2312
2312
|
|
|
2313
2313
|
const Tooltip = (props) => {
|
|
2314
2314
|
const { children, text, placement = 'bottom' } = props;
|
|
@@ -2336,12 +2336,12 @@ const Tooltip = (props) => {
|
|
|
2336
2336
|
setShow(false);
|
|
2337
2337
|
};
|
|
2338
2338
|
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, {
|
|
2339
|
+
React__default['default'].createElement("div", { className: styles$2.tooltipContainer, ref: refChild, id: "tooltip-container" }, React.cloneElement(children, {
|
|
2340
2340
|
onMouseOver: handleMouseOver,
|
|
2341
2341
|
onMouseLeave: handleMouseLeave,
|
|
2342
2342
|
})),
|
|
2343
2343
|
show &&
|
|
2344
|
-
React__default['default'].createElement("div", { className: styles.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2344
|
+
React__default['default'].createElement("div", { className: styles$2.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2345
2345
|
text,
|
|
2346
2346
|
React__default['default'].createElement("div", { id: "arrow", "data-popper-arrow": true }))));
|
|
2347
2347
|
};
|
|
@@ -2485,87 +2485,58 @@ const TimeSelect = (props) => {
|
|
|
2485
2485
|
React__default['default'].createElement(MilliSecondSelect, { className: "form-control", value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MILLISECONDS) }))));
|
|
2486
2486
|
};
|
|
2487
2487
|
|
|
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
|
-
};
|
|
2488
|
+
var css_248z$1 = ".TreeView-module_treeview__2vaBA {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important;\n}\n.TreeView-module_treeview__2vaBA ul {\n padding-left: 48px !important;\n}";
|
|
2489
|
+
var styles$1 = {"treeview":"TreeView-module_treeview__2vaBA"};
|
|
2490
|
+
styleInject(css_248z$1);
|
|
2496
2491
|
|
|
2497
2492
|
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;
|
|
2493
|
+
const { children, className } = props;
|
|
2494
|
+
const getCssClasses = () => {
|
|
2495
|
+
const cssClasses = [];
|
|
2496
|
+
cssClasses.push(styles$1.treeView);
|
|
2497
|
+
className && cssClasses.push(className);
|
|
2498
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2546
2499
|
};
|
|
2547
|
-
|
|
2548
|
-
|
|
2500
|
+
return (React__default['default'].createElement("ul", { className: getCssClasses() }, children));
|
|
2501
|
+
};
|
|
2502
|
+
|
|
2503
|
+
var css_248z = ".TreeItem-module_treeItem__2FtLe {\n display: flex;\n flex-direction: column;\n}";
|
|
2504
|
+
var styles = {"treeItem":"TreeItem-module_treeItem__2FtLe"};
|
|
2505
|
+
styleInject(css_248z);
|
|
2506
|
+
|
|
2507
|
+
const TreeItem = (props) => {
|
|
2508
|
+
const { nodeId, label, children, className, isExpanded, isSelected, onToggleExpand, onSelect } = props;
|
|
2509
|
+
const [_isExpanded, setIsExpanded] = React.useState(false);
|
|
2510
|
+
const [_isSelected, setIsSelected] = React.useState(false);
|
|
2511
|
+
const getCssClasses = () => {
|
|
2512
|
+
const cssClasses = [];
|
|
2513
|
+
cssClasses.push(styles.treeItem);
|
|
2514
|
+
className && cssClasses.push(className);
|
|
2515
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2549
2516
|
};
|
|
2550
|
-
|
|
2551
|
-
|
|
2552
|
-
|
|
2553
|
-
|
|
2554
|
-
|
|
2555
|
-
|
|
2556
|
-
|
|
2557
|
-
|
|
2558
|
-
|
|
2559
|
-
|
|
2560
|
-
|
|
2517
|
+
React.useEffect(() => {
|
|
2518
|
+
if (isExpanded !== undefined)
|
|
2519
|
+
setIsExpanded(isExpanded);
|
|
2520
|
+
}, [isExpanded]);
|
|
2521
|
+
React.useEffect(() => {
|
|
2522
|
+
if (isSelected !== undefined)
|
|
2523
|
+
setIsSelected(isSelected);
|
|
2524
|
+
}, [isSelected]);
|
|
2525
|
+
const handleOnToggleExpand = (nodeId) => {
|
|
2526
|
+
setIsExpanded(!_isExpanded);
|
|
2527
|
+
onToggleExpand && onToggleExpand(nodeId);
|
|
2561
2528
|
};
|
|
2562
|
-
const
|
|
2563
|
-
|
|
2529
|
+
const handleOnSelect = (nodeId) => {
|
|
2530
|
+
setIsSelected(!_isSelected);
|
|
2531
|
+
onSelect && onSelect(nodeId, !_isSelected);
|
|
2564
2532
|
};
|
|
2565
|
-
return (React__default['default'].createElement("
|
|
2566
|
-
|
|
2567
|
-
|
|
2568
|
-
|
|
2533
|
+
return (React__default['default'].createElement("li", { className: getCssClasses(), style: { paddingLeft: `${(48 * (children ? 0 : 1))}px` } },
|
|
2534
|
+
React__default['default'].createElement("div", { className: "d-flex align-items-center" },
|
|
2535
|
+
children &&
|
|
2536
|
+
React__default['default'].createElement(IconButton, { onClick: () => handleOnToggleExpand(nodeId), icon: !_isExpanded ? React__default['default'].createElement(ChevronRightSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null) }),
|
|
2537
|
+
React__default['default'].createElement(Checkbox, { checked: _isSelected, onChange: () => handleOnSelect(nodeId) }),
|
|
2538
|
+
label),
|
|
2539
|
+
children && _isExpanded ? React__default['default'].createElement("ul", null, children) : null));
|
|
2569
2540
|
};
|
|
2570
2541
|
|
|
2571
2542
|
exports.Alert = Alert;
|
|
@@ -2666,6 +2637,7 @@ exports.TimeSelect = TimeSelect;
|
|
|
2666
2637
|
exports.TimesCircleSolidIcon = TimesCircleSolidIcon;
|
|
2667
2638
|
exports.TimesSolidIcon = TimesSolidIcon;
|
|
2668
2639
|
exports.Tooltip = Tooltip;
|
|
2640
|
+
exports.TreeItem = TreeItem;
|
|
2669
2641
|
exports.TreeView = TreeView;
|
|
2670
2642
|
exports.Typography = Typography;
|
|
2671
2643
|
exports.YearSelect = YearSelect;
|