react-asc 18.3.5 → 18.6.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/Menu/Menu.d.ts +2 -0
- package/components/Menu/MenuBody.d.ts +1 -0
- package/components/Modal/GlobalModal.d.ts +3 -1
- package/components/Modal/Modal.d.ts +3 -2
- package/components/Modal/modal.service.d.ts +2 -0
- package/components/TreeView/TreeNode.d.ts +1 -1
- package/components/TreeView/TreeView.d.ts +9 -2
- package/index.es.js +173 -185
- package/index.es.js.map +1 -1
- package/index.js +172 -184
- package/index.js.map +1 -1
- package/package.json +1 -1
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$Q = ".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$Q = {"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$Q);
|
|
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$Q.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$Q.contained);
|
|
109
|
+
cssClasses.push(styles$Q[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$Q.outline);
|
|
113
|
+
cssClasses.push(styles$Q[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$Q['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$P = ".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$P = {"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$P);
|
|
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$P[color]);
|
|
131
|
+
cssClasses.push(styles$P.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$P['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$O = ".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$O = {"appbarTitle":"AppBarTitle-module_appbarTitle__3J-Z1"};
|
|
141
|
+
styleInject(css_248z$O);
|
|
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$O.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$N = ".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$N = {"list":"List-module_list__1ax9w"};
|
|
177
|
+
styleInject(css_248z$N);
|
|
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$N.flush);
|
|
185
185
|
}
|
|
186
|
-
cssClasses.push(styles$
|
|
186
|
+
cssClasses.push(styles$N.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$M = ".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$M = {"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$M);
|
|
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$M['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$M[color]);
|
|
208
|
+
cssClasses.push(styles$M.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$
|
|
218
|
+
var css_248z$L = ".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$L = {"avatar":"ListItemAvatar-module_avatar__1fjSE"};
|
|
220
|
+
styleInject(css_248z$L);
|
|
221
|
+
|
|
222
|
+
const ListItemAvatar = ({ avatar }) => (React__default['default'].createElement("div", { className: styles$L.avatar }, avatar));
|
|
223
|
+
|
|
224
|
+
var css_248z$K = ".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$K = {"icon":"ListItemIcon-module_icon__-nsUy"};
|
|
220
226
|
styleInject(css_248z$K);
|
|
221
227
|
|
|
222
|
-
const
|
|
228
|
+
const ListItemIcon = ({ icon }) => (React__default['default'].createElement("div", { className: styles$K.icon }, icon));
|
|
223
229
|
|
|
224
|
-
var css_248z$J = ".
|
|
225
|
-
var styles$J = {"
|
|
230
|
+
var css_248z$J = ".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$J = {"listItemAction":"ListItemAction-module_listItemAction__26S66"};
|
|
226
232
|
styleInject(css_248z$J);
|
|
227
233
|
|
|
228
|
-
const
|
|
234
|
+
const ListItemAction = ({ children, onClick }) => (React__default['default'].createElement("div", { className: styles$J.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
229
235
|
|
|
230
|
-
var css_248z$I = ".
|
|
231
|
-
var styles$I = {"
|
|
236
|
+
var css_248z$I = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1;\n}";
|
|
237
|
+
var styles$I = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
232
238
|
styleInject(css_248z$I);
|
|
233
239
|
|
|
234
|
-
const ListItemAction = ({ children, onClick }) => (React__default['default'].createElement("div", { className: styles$I.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
235
|
-
|
|
236
|
-
var css_248z$H = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1; }\n";
|
|
237
|
-
var styles$H = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
238
|
-
styleInject(css_248z$H);
|
|
239
|
-
|
|
240
240
|
const ListItemText = ({ primary, secondary }) => {
|
|
241
241
|
const getCssClasses = () => {
|
|
242
242
|
const cssClasses = [];
|
|
243
|
-
cssClasses.push(styles$
|
|
243
|
+
cssClasses.push(styles$I.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$H = ".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$H = {"selectContainer":"AutoComplete-module_selectContainer__SyqtX","select":"AutoComplete-module_select__2_7JD","selectMenu":"AutoComplete-module_selectMenu__2_ybA"};
|
|
256
|
+
styleInject(css_248z$H);
|
|
257
257
|
|
|
258
258
|
// preset value
|
|
259
259
|
// enter -> delay? -> show results
|
|
@@ -279,7 +279,7 @@ const AutoComplete = (props) => {
|
|
|
279
279
|
const getCssClass = () => {
|
|
280
280
|
const cssClasses = [];
|
|
281
281
|
className && cssClasses.push(className);
|
|
282
|
-
cssClasses.push(styles$
|
|
282
|
+
cssClasses.push(styles$H.select);
|
|
283
283
|
return cssClasses.filter(r => r).join(' ');
|
|
284
284
|
};
|
|
285
285
|
const show = () => setIsShow(true);
|
|
@@ -304,32 +304,32 @@ const AutoComplete = (props) => {
|
|
|
304
304
|
openOnFocus && show();
|
|
305
305
|
};
|
|
306
306
|
return (React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
307
|
-
React__default['default'].createElement("div", { ref: selectConainter, className: styles$
|
|
307
|
+
React__default['default'].createElement("div", { ref: selectConainter, className: styles$H.selectContainer },
|
|
308
308
|
React__default['default'].createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, value: model }),
|
|
309
309
|
isShow &&
|
|
310
310
|
React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
311
|
-
React__default['default'].createElement("div", { className: styles$
|
|
311
|
+
React__default['default'].createElement("div", { className: styles$H.selectMenu },
|
|
312
312
|
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) },
|
|
313
313
|
React__default['default'].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
314
314
|
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: () => hide() })))));
|
|
315
315
|
};
|
|
316
316
|
|
|
317
|
-
var css_248z$
|
|
318
|
-
var styles$
|
|
319
|
-
styleInject(css_248z$
|
|
317
|
+
var css_248z$G = ".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}";
|
|
318
|
+
var styles$G = {"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_"};
|
|
319
|
+
styleInject(css_248z$G);
|
|
320
320
|
|
|
321
321
|
const Badge = (props) => {
|
|
322
322
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
323
323
|
const getCssClassesBadgeContainer = () => {
|
|
324
324
|
const cssClasses = [];
|
|
325
|
-
cssClasses.push(styles$
|
|
325
|
+
cssClasses.push(styles$G.badgeContainer);
|
|
326
326
|
className && cssClasses.push(className);
|
|
327
327
|
return cssClasses.filter(css => css).join(' ');
|
|
328
328
|
};
|
|
329
329
|
const getCssClassesBadge = () => {
|
|
330
330
|
const cssClasses = [];
|
|
331
|
-
cssClasses.push(styles$
|
|
332
|
-
cssClasses.push(styles$
|
|
331
|
+
cssClasses.push(styles$G.badge);
|
|
332
|
+
cssClasses.push(styles$G[color]);
|
|
333
333
|
return cssClasses.filter(css => css).join(' ');
|
|
334
334
|
};
|
|
335
335
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -337,43 +337,43 @@ const Badge = (props) => {
|
|
|
337
337
|
React__default['default'].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
338
338
|
};
|
|
339
339
|
|
|
340
|
-
var css_248z$
|
|
341
|
-
var styles$
|
|
342
|
-
styleInject(css_248z$
|
|
340
|
+
var css_248z$F = ".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}";
|
|
341
|
+
var styles$F = {"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"};
|
|
342
|
+
styleInject(css_248z$F);
|
|
343
343
|
|
|
344
344
|
const Icon = (props) => {
|
|
345
345
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
346
346
|
const getCssClasses = () => {
|
|
347
347
|
const cssClasses = [];
|
|
348
|
-
cssClasses.push(styles$
|
|
349
|
-
iconColor && cssClasses.push(styles$
|
|
348
|
+
cssClasses.push(styles$F.icon);
|
|
349
|
+
iconColor && cssClasses.push(styles$F[iconColor]);
|
|
350
350
|
className && cssClasses.push(className);
|
|
351
351
|
return cssClasses.filter(css => css).join(' ');
|
|
352
352
|
};
|
|
353
353
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
354
354
|
};
|
|
355
355
|
|
|
356
|
-
var css_248z$
|
|
357
|
-
var styles$
|
|
358
|
-
styleInject(css_248z$
|
|
356
|
+
var css_248z$E = ".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}";
|
|
357
|
+
var styles$E = {"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"};
|
|
358
|
+
styleInject(css_248z$E);
|
|
359
359
|
|
|
360
360
|
const ButtonTemplate = (props) => {
|
|
361
361
|
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"]);
|
|
362
362
|
const getCssClasses = () => {
|
|
363
363
|
const cssClasses = [];
|
|
364
364
|
cssClasses.push(`btn`);
|
|
365
|
-
cssClasses.push(styles$
|
|
365
|
+
cssClasses.push(styles$E.button);
|
|
366
366
|
if (variant !== 'outline' && variant !== 'text') {
|
|
367
|
-
cssClasses.push(styles$
|
|
368
|
-
cssClasses.push(styles$
|
|
367
|
+
cssClasses.push(styles$E.btnContained);
|
|
368
|
+
cssClasses.push(styles$E[color]);
|
|
369
369
|
}
|
|
370
370
|
if (variant === 'outline') {
|
|
371
|
-
cssClasses.push(styles$
|
|
372
|
-
cssClasses.push(styles$
|
|
371
|
+
cssClasses.push(styles$E.btnOutline);
|
|
372
|
+
cssClasses.push(styles$E[color]);
|
|
373
373
|
}
|
|
374
374
|
if (variant === 'text') {
|
|
375
|
-
cssClasses.push(styles$
|
|
376
|
-
cssClasses.push(styles$
|
|
375
|
+
cssClasses.push(styles$E.btnText);
|
|
376
|
+
cssClasses.push(styles$E[color]);
|
|
377
377
|
}
|
|
378
378
|
if (isRounded && variant !== 'text') {
|
|
379
379
|
cssClasses.push(`rounded-pill`);
|
|
@@ -387,10 +387,10 @@ const ButtonTemplate = (props) => {
|
|
|
387
387
|
return (React__default['default'].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
388
388
|
React__default['default'].createElement("span", { className: "d-flex justify-content-center" },
|
|
389
389
|
startIcon &&
|
|
390
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
390
|
+
React__default['default'].createElement(Icon, { className: styles$E.startIcon }, startIcon),
|
|
391
391
|
children,
|
|
392
392
|
endIcon &&
|
|
393
|
-
React__default['default'].createElement(Icon, { className: styles$
|
|
393
|
+
React__default['default'].createElement(Icon, { className: styles$E.endIcon }, endIcon))));
|
|
394
394
|
};
|
|
395
395
|
|
|
396
396
|
const Button = (props) => {
|
|
@@ -408,15 +408,15 @@ const ButtonGroup = (props) => {
|
|
|
408
408
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
409
409
|
};
|
|
410
410
|
|
|
411
|
-
var css_248z$
|
|
412
|
-
var styles$
|
|
413
|
-
styleInject(css_248z$
|
|
411
|
+
var css_248z$D = ".Breadcrumb-module_breadcrumb__2BHXS {\n display: flex;\n flex-wrap: wrap;\n padding: 0.75rem 1rem;\n margin-bottom: 0;\n list-style: none;\n border-radius: var(--borderRadius);\n}";
|
|
412
|
+
var styles$D = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
413
|
+
styleInject(css_248z$D);
|
|
414
414
|
|
|
415
415
|
const Breadcrumb = (props) => {
|
|
416
416
|
const { children, className } = props;
|
|
417
417
|
const getCssClasses = () => {
|
|
418
418
|
const cssClasses = [];
|
|
419
|
-
cssClasses.push(styles$
|
|
419
|
+
cssClasses.push(styles$D.breadcrumb);
|
|
420
420
|
className && cssClasses.push(className);
|
|
421
421
|
return cssClasses.filter(css => css).join(' ');
|
|
422
422
|
};
|
|
@@ -426,15 +426,15 @@ const Breadcrumb = (props) => {
|
|
|
426
426
|
|
|
427
427
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
428
428
|
|
|
429
|
-
var css_248z$
|
|
430
|
-
var styles$
|
|
431
|
-
styleInject(css_248z$
|
|
429
|
+
var css_248z$C = ".BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D {\n padding-left: 0.5rem;\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\";\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D a:not([href]):not([class]) {\n color: var(--primary);\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D:hover {\n cursor: pointer;\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D.BreadcrumbItem-module_active__3iVU2:hover {\n cursor: unset;\n}";
|
|
430
|
+
var styles$C = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
431
|
+
styleInject(css_248z$C);
|
|
432
432
|
|
|
433
433
|
const BreadcrumbItem = (props) => {
|
|
434
434
|
const { children, className, isActive, onClick } = props;
|
|
435
435
|
const getCssClasses = () => {
|
|
436
436
|
const cssClasses = [];
|
|
437
|
-
cssClasses.push(styles$
|
|
437
|
+
cssClasses.push(styles$C.breadcrumbItem);
|
|
438
438
|
className && cssClasses.push(className);
|
|
439
439
|
isActive && cssClasses.push('active');
|
|
440
440
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -448,106 +448,106 @@ const BreadcrumbItem = (props) => {
|
|
|
448
448
|
wrapper: label => React__default['default'].createElement("a", null, label) }, children)));
|
|
449
449
|
};
|
|
450
450
|
|
|
451
|
-
var css_248z$
|
|
452
|
-
var styles$
|
|
453
|
-
styleInject(css_248z$
|
|
451
|
+
var css_248z$B = ".Card-module_card__31o3Z {\n background: var(--white);\n border-radius: var(--borderRadius);\n}\n.Card-module_card__31o3Z.Card-module_shadow__2lpYq {\n box-shadow: var(--shadow);\n}";
|
|
452
|
+
var styles$B = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
453
|
+
styleInject(css_248z$B);
|
|
454
454
|
|
|
455
455
|
const Card = (props) => {
|
|
456
456
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
457
457
|
const getCssClasses = () => {
|
|
458
458
|
const cssClasses = [];
|
|
459
|
-
cssClasses.push(styles$
|
|
460
|
-
shadow && cssClasses.push(styles$
|
|
459
|
+
cssClasses.push(styles$B.card);
|
|
460
|
+
shadow && cssClasses.push(styles$B.shadow);
|
|
461
461
|
className && cssClasses.push(className);
|
|
462
462
|
return cssClasses.filter(css => css).join(' ');
|
|
463
463
|
};
|
|
464
464
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
465
465
|
};
|
|
466
466
|
|
|
467
|
-
var css_248z$
|
|
468
|
-
var styles$
|
|
469
|
-
styleInject(css_248z$
|
|
467
|
+
var css_248z$A = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
468
|
+
var styles$A = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
469
|
+
styleInject(css_248z$A);
|
|
470
470
|
|
|
471
471
|
const CardBody = (props) => {
|
|
472
472
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
473
473
|
const getCssClasses = () => {
|
|
474
474
|
const cssClasses = [];
|
|
475
|
-
cssClasses.push(styles$
|
|
475
|
+
cssClasses.push(styles$A.cardBody);
|
|
476
476
|
className && cssClasses.push(className);
|
|
477
477
|
return cssClasses.filter(css => css).join(' ');
|
|
478
478
|
};
|
|
479
479
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
480
480
|
};
|
|
481
481
|
|
|
482
|
-
var css_248z$
|
|
483
|
-
var styles$
|
|
484
|
-
styleInject(css_248z$
|
|
482
|
+
var css_248z$z = ".CardFooter-module_cardFooter__3dYKa {\n padding: 0.75rem 1.25rem;\n background-color: rgba(0, 0, 0, 0.03);\n border-top: 1px solid rgba(0, 0, 0, 0.125);\n}\n.CardFooter-module_cardFooter__3dYKa:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);\n}";
|
|
483
|
+
var styles$z = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
484
|
+
styleInject(css_248z$z);
|
|
485
485
|
|
|
486
486
|
const CardFooter = (props) => {
|
|
487
487
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
488
488
|
const getCssClasses = () => {
|
|
489
489
|
const cssClasses = [];
|
|
490
|
-
cssClasses.push(styles$
|
|
490
|
+
cssClasses.push(styles$z.cardFooter);
|
|
491
491
|
className && cssClasses.push(className);
|
|
492
492
|
return cssClasses.filter(css => css).join(' ');
|
|
493
493
|
};
|
|
494
494
|
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
495
495
|
};
|
|
496
496
|
|
|
497
|
-
var css_248z$
|
|
498
|
-
var styles$
|
|
499
|
-
styleInject(css_248z$
|
|
497
|
+
var css_248z$y = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important;\n}";
|
|
498
|
+
var styles$y = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
499
|
+
styleInject(css_248z$y);
|
|
500
500
|
|
|
501
501
|
const CardSubtitle = (props) => {
|
|
502
502
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
503
503
|
const getCssClasses = () => {
|
|
504
504
|
const cssClasses = [];
|
|
505
|
-
cssClasses.push(styles$
|
|
505
|
+
cssClasses.push(styles$y.cardSubtitle);
|
|
506
506
|
className && cssClasses.push(className);
|
|
507
507
|
return cssClasses.filter(css => css).join(' ');
|
|
508
508
|
};
|
|
509
509
|
return (React__default['default'].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
510
510
|
};
|
|
511
511
|
|
|
512
|
-
var css_248z$
|
|
513
|
-
var styles$
|
|
514
|
-
styleInject(css_248z$
|
|
512
|
+
var css_248z$x = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0;\n}";
|
|
513
|
+
var styles$x = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
514
|
+
styleInject(css_248z$x);
|
|
515
515
|
|
|
516
516
|
const CardText = (props) => {
|
|
517
517
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
518
518
|
const getCssClasses = () => {
|
|
519
519
|
const cssClasses = [];
|
|
520
|
-
cssClasses.push(styles$
|
|
520
|
+
cssClasses.push(styles$x.cardText);
|
|
521
521
|
className && cssClasses.push(className);
|
|
522
522
|
return cssClasses.filter(css => css).join(' ');
|
|
523
523
|
};
|
|
524
524
|
return (React__default['default'].createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
525
525
|
};
|
|
526
526
|
|
|
527
|
-
var css_248z$
|
|
528
|
-
var styles$
|
|
529
|
-
styleInject(css_248z$
|
|
527
|
+
var css_248z$w = ".CardTitle-module_cardTitle__24Amb {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em;\n}";
|
|
528
|
+
var styles$w = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
529
|
+
styleInject(css_248z$w);
|
|
530
530
|
|
|
531
531
|
const CardTitle = (props) => {
|
|
532
532
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
533
533
|
const getCssClasses = () => {
|
|
534
534
|
const cssClasses = [];
|
|
535
|
-
cssClasses.push(styles$
|
|
535
|
+
cssClasses.push(styles$w.cardTitle);
|
|
536
536
|
className && cssClasses.push(className);
|
|
537
537
|
return cssClasses.filter(css => css).join(' ');
|
|
538
538
|
};
|
|
539
539
|
return (React__default['default'].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
540
540
|
};
|
|
541
541
|
|
|
542
|
-
var css_248z$
|
|
543
|
-
var styles$
|
|
544
|
-
styleInject(css_248z$
|
|
542
|
+
var css_248z$v = ".CardImage-module_cardImage__1tZM4 {\n flex-shrink: 0;\n width: 100%;\n border-top-left-radius: calc(0.25rem - 1px);\n border-top-right-radius: calc(0.25rem - 1px);\n}";
|
|
543
|
+
var styles$v = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
544
|
+
styleInject(css_248z$v);
|
|
545
545
|
|
|
546
546
|
const CardImage = (props) => {
|
|
547
547
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
548
548
|
const getCssClasses = () => {
|
|
549
549
|
const cssClasses = [];
|
|
550
|
-
cssClasses.push(styles$
|
|
550
|
+
cssClasses.push(styles$v.cardImage);
|
|
551
551
|
className && cssClasses.push(className);
|
|
552
552
|
return cssClasses.filter(css => css).join(' ');
|
|
553
553
|
};
|
|
@@ -596,11 +596,15 @@ const CircleSolidIcon = () => (React__default['default'].createElement("svg", {
|
|
|
596
596
|
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" },
|
|
597
597
|
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" })));
|
|
598
598
|
|
|
599
|
+
var css_248z$u = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important;\n}";
|
|
600
|
+
var styles$u = {"typography":"Typography-module_typography__2bM6E"};
|
|
601
|
+
styleInject(css_248z$u);
|
|
602
|
+
|
|
599
603
|
const Wrapper = (props) => {
|
|
600
604
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
601
605
|
const getCssClasses = () => {
|
|
602
606
|
const cssClasses = [];
|
|
603
|
-
cssClasses.push(
|
|
607
|
+
cssClasses.push(styles$u.typography);
|
|
604
608
|
className && cssClasses.push(className);
|
|
605
609
|
return cssClasses.filter(css => css).join(' ');
|
|
606
610
|
};
|
|
@@ -611,7 +615,7 @@ const Typography = (_a) => {
|
|
|
611
615
|
return (React__default['default'].createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
612
616
|
};
|
|
613
617
|
|
|
614
|
-
var css_248z$t = ".IconButton-module_iconButton__1xqrL {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none
|
|
618
|
+
var css_248z$t = ".IconButton-module_iconButton__1xqrL {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none;\n}\n.IconButton-module_iconButton__1xqrL:hover {\n cursor: pointer;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_shadow__5U4-_ {\n box-shadow: var(--shadow);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_md__1lmDL {\n width: 48px;\n height: 48px;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_lg__1O2Uy {\n width: 56px;\n height: 56px;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG {\n padding: 0;\n background: transparent;\n color: inherit;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_active__2tJut {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T.IconButton-module_active__2tJut {\n color: var(--primary);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL.IconButton-module_active__2tJut {\n color: var(--secondary);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t.IconButton-module_active__2tJut {\n color: var(--accent);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD.IconButton-module_active__2tJut {\n color: var(--light);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_dark__1e6bR {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_disabled__3TgpF {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_active__2tJut {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T {\n background-color: var(--primary);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T.IconButton-module_active__2tJut {\n background-color: var(--primary-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL {\n background-color: var(--secondary);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL.IconButton-module_active__2tJut {\n background-color: var(--secondary-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t {\n background-color: var(--accent);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t.IconButton-module_active__2tJut {\n background-color: var(--accent-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD {\n background-color: var(--light);\n color: var(--dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD.IconButton-module_active__2tJut {\n background-color: var(--light-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR {\n background-color: var(--dark);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR.IconButton-module_active__2tJut {\n background-color: var(--dark-light);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_disabled__3TgpF {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none;\n}";
|
|
615
619
|
var styles$t = {"iconButton":"IconButton-module_iconButton__1xqrL","shadow":"IconButton-module_shadow__5U4-_","md":"IconButton-module_md__1lmDL","lg":"IconButton-module_lg__1O2Uy","text":"IconButton-module_text__33RrG","active":"IconButton-module_active__2tJut","primary":"IconButton-module_primary__qRw4T","secondary":"IconButton-module_secondary__1lzNL","accent":"IconButton-module_accent__exm5t","light":"IconButton-module_light__2nWhD","dark":"IconButton-module_dark__1e6bR","disabled":"IconButton-module_disabled__3TgpF","contained":"IconButton-module_contained__gWulJ"};
|
|
616
620
|
styleInject(css_248z$t);
|
|
617
621
|
|
|
@@ -634,7 +638,7 @@ const IconButton = (props) => {
|
|
|
634
638
|
label && React__default['default'].createElement(Typography, null, label)));
|
|
635
639
|
};
|
|
636
640
|
|
|
637
|
-
var css_248z$s = ".Checkbox-module_checkboxContainer__2oWhu {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
641
|
+
var css_248z$s = ".Checkbox-module_checkboxContainer__2oWhu {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Checkbox-module_checkboxContainer__2oWhu label {\n margin-bottom: 0;\n margin-left: 0;\n}\n.Checkbox-module_checkboxContainer__2oWhu label:hover {\n cursor: pointer;\n}\n\n.Checkbox-module_checkboxLabel__27Y6U.Checkbox-module_disabled__3EXUd {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed;\n}";
|
|
638
642
|
var styles$s = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
639
643
|
styleInject(css_248z$s);
|
|
640
644
|
|
|
@@ -677,7 +681,7 @@ const Checkbox = (props) => {
|
|
|
677
681
|
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))));
|
|
678
682
|
};
|
|
679
683
|
|
|
680
|
-
var css_248z$r = ".Chip-module_chip__1cghp {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1
|
|
684
|
+
var css_248z$r = ".Chip-module_chip__1cghp {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1;\n}\n.Chip-module_chip__1cghp svg {\n width: 18px;\n height: 18px;\n}\n.Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c {\n margin-left: 5px;\n}\n.Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c:hover {\n cursor: pointer;\n}\n.Chip-module_chip__1cghp.Chip-module_primary__198Dq {\n background: var(--primary);\n color: var(--primary-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_secondary__14H0b {\n background: var(--secondary);\n color: var(--secondary-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_accent__2LkWr {\n background: var(--accent);\n color: var(--accent-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_light__2zVYs {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Chip-module_chip__1cghp.Chip-module_dark__2Bg-S {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover {\n cursor: pointer;\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_primary__198Dq {\n background: var(--primary-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_secondary__14H0b {\n background: var(--secondary-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_accent__2LkWr {\n background: var(--accent-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_shadow__3TYny {\n box-shadow: var(--shadow);\n}";
|
|
681
685
|
var styles$r = {"chip":"Chip-module_chip__1cghp","deleteIcon":"Chip-module_deleteIcon__34X9c","primary":"Chip-module_primary__198Dq","secondary":"Chip-module_secondary__14H0b","accent":"Chip-module_accent__2LkWr","light":"Chip-module_light__2zVYs","dark":"Chip-module_dark__2Bg-S","clickable":"Chip-module_clickable__2Y4x7","shadow":"Chip-module_shadow__3TYny"};
|
|
682
686
|
styleInject(css_248z$r);
|
|
683
687
|
|
|
@@ -734,7 +738,7 @@ const FileInput = (props) => {
|
|
|
734
738
|
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))));
|
|
735
739
|
};
|
|
736
740
|
|
|
737
|
-
var css_248z$q = ".Select-module_selectContainer__2oizY {\n position: relative
|
|
741
|
+
var css_248z$q = ".Select-module_selectContainer__2oizY {\n position: relative;\n}\n\n.Select-module_select__MSqgU {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n}\n.Select-module_select__MSqgU:hover {\n cursor: pointer;\n}\n\n.Select-module_selectMenu__2vhJt {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 2px;\n z-index: 1112;\n max-height: 280px;\n overflow: auto;\n}";
|
|
738
742
|
var styles$q = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
739
743
|
styleInject(css_248z$q);
|
|
740
744
|
|
|
@@ -884,7 +888,7 @@ const Select = (props) => {
|
|
|
884
888
|
React__default['default'].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
885
889
|
};
|
|
886
890
|
|
|
887
|
-
var css_248z$p = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical
|
|
891
|
+
var css_248z$p = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical;\n}\ntextarea:focus {\n outline: none !important;\n border-color: var(--primary);\n}";
|
|
888
892
|
var styles$p = {};
|
|
889
893
|
styleInject(css_248z$p);
|
|
890
894
|
|
|
@@ -1248,7 +1252,7 @@ const DateSelect = (props) => {
|
|
|
1248
1252
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1249
1253
|
// };
|
|
1250
1254
|
|
|
1251
|
-
var css_248z$o = ".Drawer-module_drawer__36R2P {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto
|
|
1255
|
+
var css_248z$o = ".Drawer-module_drawer__36R2P {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_permanent__AW5Df {\n position: inherit;\n z-index: 0;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_left__1KKcY {\n order: 0;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_right__2gESb {\n order: 2;\n}\n\n.Drawer-module_drawerOpen__euFdW {\n overflow: hidden;\n}";
|
|
1252
1256
|
var styles$o = {"drawer":"Drawer-module_drawer__36R2P","permanent":"Drawer-module_permanent__AW5Df","left":"Drawer-module_left__1KKcY","right":"Drawer-module_right__2gESb","drawerOpen":"Drawer-module_drawerOpen__euFdW"};
|
|
1253
1257
|
styleInject(css_248z$o);
|
|
1254
1258
|
|
|
@@ -1287,19 +1291,13 @@ const DrawerContent = (props) => {
|
|
|
1287
1291
|
return (React__default['default'].createElement("div", { className: getCssClasses(), style: getStyles() }, children));
|
|
1288
1292
|
};
|
|
1289
1293
|
|
|
1290
|
-
|
|
1291
|
-
isShow: false,
|
|
1292
|
-
setIsShow: () => { }
|
|
1293
|
-
});
|
|
1294
|
-
|
|
1295
|
-
var css_248z$n = ".MenuBody-module_menuBody__3cPsp {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius); }\n .MenuBody-module_menuBody__3cPsp.MenuBody-module_shadow__AF_9C {\n box-shadow: var(--shadow); }\n";
|
|
1294
|
+
var css_248z$n = ".MenuBody-module_menuBody__3cPsp {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius);\n}\n.MenuBody-module_menuBody__3cPsp.MenuBody-module_shadow__AF_9C {\n box-shadow: var(--shadow);\n}";
|
|
1296
1295
|
var styles$n = {"menuBody":"MenuBody-module_menuBody__3cPsp","shadow":"MenuBody-module_shadow__AF_9C"};
|
|
1297
1296
|
styleInject(css_248z$n);
|
|
1298
1297
|
|
|
1299
1298
|
const MenuBody = (props) => {
|
|
1300
|
-
const { parentRef, children, className, shadow = true, menuPosition = 'left' } = props;
|
|
1299
|
+
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
1301
1300
|
const menuBodyRef = React.useRef(null);
|
|
1302
|
-
const { setIsShow } = React.useContext(MenuContext);
|
|
1303
1301
|
React.useEffect(() => {
|
|
1304
1302
|
if (menuBodyRef) {
|
|
1305
1303
|
core.createPopper(parentRef.current, menuBodyRef.current, {
|
|
@@ -1330,27 +1328,20 @@ const MenuBody = (props) => {
|
|
|
1330
1328
|
className && cssClasses.push(className);
|
|
1331
1329
|
return cssClasses.filter(css => css).join(' ');
|
|
1332
1330
|
};
|
|
1333
|
-
const
|
|
1334
|
-
|
|
1331
|
+
const handleClickBackdrop = () => {
|
|
1332
|
+
onClickBackdrop && onClickBackdrop();
|
|
1335
1333
|
};
|
|
1336
1334
|
return (reactDom.createPortal(React__default['default'].createElement(React__default['default'].Fragment, null,
|
|
1337
|
-
React__default['default'].createElement("div", { ref: menuBodyRef, className: getCssClasses() }, children
|
|
1338
|
-
|
|
1339
|
-
onClick: (e) => {
|
|
1340
|
-
child.props.onClick && child.props.onClick(e);
|
|
1341
|
-
child.props.type !== 'header' && handleClickItem();
|
|
1342
|
-
}
|
|
1343
|
-
})))),
|
|
1344
|
-
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: () => setIsShow(false) })), document.body));
|
|
1335
|
+
React__default['default'].createElement("div", { ref: menuBodyRef, className: getCssClasses() }, children),
|
|
1336
|
+
React__default['default'].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1345
1337
|
};
|
|
1346
1338
|
|
|
1347
|
-
var css_248z$m = ".Menu-module_menu__23BYG {\n display: flex
|
|
1339
|
+
var css_248z$m = ".Menu-module_menu__23BYG {\n display: flex;\n}";
|
|
1348
1340
|
var styles$m = {"menu":"Menu-module_menu__23BYG"};
|
|
1349
1341
|
styleInject(css_248z$m);
|
|
1350
1342
|
|
|
1351
1343
|
const Menu = (props) => {
|
|
1352
|
-
const { toggle, children, className, menuPosition, onToggleClick } = props, rest = __rest(props, ["toggle", "children", "className", "menuPosition", "onToggleClick"]);
|
|
1353
|
-
const [isShow, setIsShow] = React.useState(false);
|
|
1344
|
+
const { toggle, children, className, open, menuPosition, onClickBackdrop, onToggleClick } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop", "onToggleClick"]);
|
|
1354
1345
|
const menuContainer = React.useRef(null);
|
|
1355
1346
|
const toggleContainerRef = React.useRef(null);
|
|
1356
1347
|
const getCssClasses = () => {
|
|
@@ -1359,23 +1350,16 @@ const Menu = (props) => {
|
|
|
1359
1350
|
className && cssClasses.push(className);
|
|
1360
1351
|
return cssClasses.filter(css => css).join(' ');
|
|
1361
1352
|
};
|
|
1362
|
-
const
|
|
1363
|
-
|
|
1364
|
-
setIsShow: setIsShow
|
|
1365
|
-
};
|
|
1366
|
-
const handleClickToggle = (e) => {
|
|
1367
|
-
e.stopPropagation();
|
|
1368
|
-
setIsShow(!isShow);
|
|
1369
|
-
onToggleClick && onToggleClick(e);
|
|
1353
|
+
const handleClickBackdrop = () => {
|
|
1354
|
+
onClickBackdrop && onClickBackdrop();
|
|
1370
1355
|
};
|
|
1371
|
-
return (React__default['default'].createElement(
|
|
1372
|
-
React__default['default'].createElement("div",
|
|
1373
|
-
|
|
1374
|
-
|
|
1375
|
-
React__default['default'].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition }, children))));
|
|
1356
|
+
return (React__default['default'].createElement("div", Object.assign({ ref: menuContainer, className: getCssClasses() }, rest),
|
|
1357
|
+
React__default['default'].createElement("div", { ref: toggleContainerRef }, toggle),
|
|
1358
|
+
open &&
|
|
1359
|
+
React__default['default'].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1376
1360
|
};
|
|
1377
1361
|
|
|
1378
|
-
var css_248z$l = ".MenuItem-module_menuItem__kvauR {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0
|
|
1362
|
+
var css_248z$l = ".MenuItem-module_menuItem__kvauR {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0;\n}\n.MenuItem-module_menuItem__kvauR.MenuItem-module_menuItemHeader__mp7wc {\n margin-bottom: 0;\n font-size: 0.875rem;\n}\n.MenuItem-module_menuItem__kvauR:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04);\n}";
|
|
1379
1363
|
var styles$l = {"menuItem":"MenuItem-module_menuItem__kvauR","menuItemHeader":"MenuItem-module_menuItemHeader__mp7wc"};
|
|
1380
1364
|
styleInject(css_248z$l);
|
|
1381
1365
|
|
|
@@ -1403,13 +1387,13 @@ const MenuToggle = ({ children }) => {
|
|
|
1403
1387
|
return (React__default['default'].createElement(React.Fragment, null, children));
|
|
1404
1388
|
};
|
|
1405
1389
|
|
|
1406
|
-
var css_248z$k = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef
|
|
1390
|
+
var css_248z$k = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef;\n}";
|
|
1407
1391
|
var styles$k = {"menuItemDivider":"MenuDivider-module_menuItemDivider__JnLsC"};
|
|
1408
1392
|
styleInject(css_248z$k);
|
|
1409
1393
|
|
|
1410
1394
|
const MenuDivider = () => React__default['default'].createElement("div", { className: styles$k.menuItemDivider });
|
|
1411
1395
|
|
|
1412
|
-
var css_248z$j = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px
|
|
1396
|
+
var css_248z$j = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px;\n}";
|
|
1413
1397
|
var styles$j = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__3H62L"};
|
|
1414
1398
|
styleInject(css_248z$j);
|
|
1415
1399
|
|
|
@@ -1417,7 +1401,7 @@ const ExpansionPanelContent = ({ children }) => {
|
|
|
1417
1401
|
return (React__default['default'].createElement("div", { className: styles$j.expansionPanelContent }, children));
|
|
1418
1402
|
};
|
|
1419
1403
|
|
|
1420
|
-
var css_248z$i = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px
|
|
1404
|
+
var css_248z$i = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px;\n}\n.ExpansionPanelHeader-module_expansionPanelHeader__3hrsI:hover {\n cursor: pointer;\n background-color: var(--highlight);\n}";
|
|
1421
1405
|
var styles$i = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__3hrsI"};
|
|
1422
1406
|
styleInject(css_248z$i);
|
|
1423
1407
|
|
|
@@ -1433,7 +1417,7 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1433
1417
|
React__default['default'].createElement(Icon, null, isExpanded ? React__default['default'].createElement(ChevronUpSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null)))));
|
|
1434
1418
|
};
|
|
1435
1419
|
|
|
1436
|
-
var css_248z$h = ".ExpansionPanel-module_expansionPanel__3krcE {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out
|
|
1420
|
+
var css_248z$h = ".ExpansionPanel-module_expansionPanel__3krcE {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n}\n.ExpansionPanel-module_expansionPanel__3krcE:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__3krcE:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt {\n margin: 16px 0;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:first-child {\n margin-top: 0;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:last-child {\n margin-bottom: 0;\n}";
|
|
1437
1421
|
var styles$h = {"expansionPanel":"ExpansionPanel-module_expansionPanel__3krcE","isExpanded":"ExpansionPanel-module_isExpanded__1m4Dt"};
|
|
1438
1422
|
styleInject(css_248z$h);
|
|
1439
1423
|
|
|
@@ -1461,7 +1445,7 @@ const ExpansionPanel = (props) => {
|
|
|
1461
1445
|
React__default['default'].createElement(ExpansionPanelContent, null, children)));
|
|
1462
1446
|
};
|
|
1463
1447
|
|
|
1464
|
-
var css_248z$g = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow)
|
|
1448
|
+
var css_248z$g = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow);\n}\n.FloatingActionButton-module_fab__3GwiH.FloatingActionButton-module_fixed__17qrv {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000;\n}";
|
|
1465
1449
|
var styles$g = {"fab":"FloatingActionButton-module_fab__3GwiH","fixed":"FloatingActionButton-module_fixed__17qrv"};
|
|
1466
1450
|
styleInject(css_248z$g);
|
|
1467
1451
|
|
|
@@ -1532,7 +1516,7 @@ const Link = (props) => {
|
|
|
1532
1516
|
return (React__default['default'].createElement("a", { className: getCssClasses(), href: url || '#', target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, children));
|
|
1533
1517
|
};
|
|
1534
1518
|
|
|
1535
|
-
var css_248z$f = ".LoadingIndicator-module_loadingIndicatorContainer__3e1-3 {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100
|
|
1519
|
+
var css_248z$f = ".LoadingIndicator-module_loadingIndicatorContainer__3e1-3 {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.LoadingIndicator-module_loadingIndicator__tvp5i {\n animation-name: LoadingIndicator-module_spinAnimation__PKRNn;\n animation-duration: 5000ms;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n width: 24px;\n height: 24px;\n}\n\n@keyframes LoadingIndicator-module_spinAnimation__PKRNn {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}";
|
|
1536
1520
|
var styles$f = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__3e1-3","loadingIndicator":"LoadingIndicator-module_loadingIndicator__tvp5i","spinAnimation":"LoadingIndicator-module_spinAnimation__PKRNn"};
|
|
1537
1521
|
styleInject(css_248z$f);
|
|
1538
1522
|
|
|
@@ -1579,7 +1563,7 @@ class LoadingIndicatorService {
|
|
|
1579
1563
|
}
|
|
1580
1564
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1581
1565
|
|
|
1582
|
-
var css_248z$e = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center
|
|
1566
|
+
var css_248z$e = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center;\n}";
|
|
1583
1567
|
var styles$e = {"modalHeader":"ModalHeader-module_modalHeader__o5HzE"};
|
|
1584
1568
|
styleInject(css_248z$e);
|
|
1585
1569
|
|
|
@@ -1596,23 +1580,24 @@ const ModalHeader = (props) => {
|
|
|
1596
1580
|
|
|
1597
1581
|
const ModalBody = ({ children }) => (React__default['default'].createElement("div", { className: "modal-body" }, children));
|
|
1598
1582
|
|
|
1599
|
-
var css_248z$d = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius)
|
|
1600
|
-
var styles$d = {"modal":"Modal-module_modal__1NdMJ","fullscreen":"Modal-module_fullscreen__3R-sM","modalContent":"Modal-module_modalContent__E2kaP","modal-dialog":"Modal-module_modal-dialog__IdJ1c"};
|
|
1583
|
+
var css_248z$d = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius);\n}\n.Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0;\n}\n.Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM .Modal-module_modalContent__E2kaP {\n height: auto;\n min-height: 100%;\n max-height: 100%;\n border-radius: 0;\n overflow: auto;\n}\n@media (min-width: 320px) {\n .Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n max-width: 100% !important;\n }\n}\n.Modal-module_modal__1NdMJ .Modal-module_sm__3UfYB {\n max-width: 300px;\n}\n.Modal-module_modal__1NdMJ .Modal-module_md__2uX1a {\n max-width: 500px;\n}\n.Modal-module_modal__1NdMJ .Modal-module_lg__3ux_V {\n max-width: 1140px;\n}\n@media (min-width: 576px) {\n .Modal-module_modal__1NdMJ .Modal-module_modal-dialog__IdJ1c {\n max-width: 600px;\n }\n}";
|
|
1584
|
+
var styles$d = {"modal":"Modal-module_modal__1NdMJ","fullscreen":"Modal-module_fullscreen__3R-sM","modalContent":"Modal-module_modalContent__E2kaP","sm":"Modal-module_sm__3UfYB","md":"Modal-module_md__2uX1a","lg":"Modal-module_lg__3ux_V","modal-dialog":"Modal-module_modal-dialog__IdJ1c"};
|
|
1601
1585
|
styleInject(css_248z$d);
|
|
1602
1586
|
|
|
1603
|
-
var css_248z$c = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none
|
|
1587
|
+
var css_248z$c = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none;\n}";
|
|
1604
1588
|
var styles$c = {"modalFooter":"ModalFooter-module_modalFooter__2Et4e"};
|
|
1605
1589
|
styleInject(css_248z$c);
|
|
1606
1590
|
|
|
1607
1591
|
const ModalFooter = ({ children }) => (React__default['default'].createElement("div", { className: "modal-footer " + styles$c.modalFooter }, children));
|
|
1608
1592
|
|
|
1609
1593
|
const Modal = (props) => {
|
|
1610
|
-
const { className, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1594
|
+
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1611
1595
|
const getCssClass = () => {
|
|
1612
1596
|
const cssClasses = [];
|
|
1613
1597
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1614
1598
|
cssClasses.push(styles$d.modal);
|
|
1615
1599
|
!!fullScreen && cssClasses.push(styles$d['fullscreen']);
|
|
1600
|
+
size && cssClasses.push(styles$d[size]);
|
|
1616
1601
|
className && cssClasses.push(className);
|
|
1617
1602
|
return cssClasses.filter(r => r).join(' ');
|
|
1618
1603
|
};
|
|
@@ -1654,7 +1639,7 @@ exports.MODALBUTTONTYPE = void 0;
|
|
|
1654
1639
|
const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismissable = false, buttons = [
|
|
1655
1640
|
{ label: 'Cancel', type: exports.MODALBUTTONTYPE.CANCEL, color: exports.COLOR.secondary, variant: exports.VARIANT.text, focus: true },
|
|
1656
1641
|
{ label: 'Ok', type: exports.MODALBUTTONTYPE.OK, variant: exports.VARIANT.contained },
|
|
1657
|
-
], fullScreen = false }) => {
|
|
1642
|
+
], size = exports.SIZE.md, fullScreen = false }) => {
|
|
1658
1643
|
// workaround for getDerivedStateFromProps
|
|
1659
1644
|
const [myControls, setMyControls] = React.useState(null);
|
|
1660
1645
|
React.useEffect(() => {
|
|
@@ -1692,7 +1677,7 @@ const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismi
|
|
|
1692
1677
|
}
|
|
1693
1678
|
button.handler && button.handler();
|
|
1694
1679
|
};
|
|
1695
|
-
return (React__default['default'].createElement(Modal, { fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, isDismissable: isDismissable, footer: React__default['default'].createElement(React.Fragment, null, buttons.map((button, index) => (React__default['default'].createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, onClick: () => handleClickButton(button) }, button.label)))) },
|
|
1680
|
+
return (React__default['default'].createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, isDismissable: isDismissable, footer: React__default['default'].createElement(React.Fragment, null, buttons.map((button, index) => (React__default['default'].createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, onClick: () => handleClickButton(button) }, button.label)))) },
|
|
1696
1681
|
description && React__default['default'].createElement("div", null, description),
|
|
1697
1682
|
modalType === exports.MODALTYPE.FORM &&
|
|
1698
1683
|
React__default['default'].createElement(React.Fragment, null,
|
|
@@ -1713,7 +1698,7 @@ class ModalService {
|
|
|
1713
1698
|
reject();
|
|
1714
1699
|
this.hide();
|
|
1715
1700
|
};
|
|
1716
|
-
reactDom.render(React__default['default'].createElement(GlobalModal, { fullScreen: options && options.fullScreen, title: title, description: description, formControls: options && options.formControls, onCancel: handleCancel, onOk: handleOk, isDismissable: options && options.isDismissable, buttons: options && options.buttons }), this.container);
|
|
1701
|
+
reactDom.render(React__default['default'].createElement(GlobalModal, { fullScreen: options && options.fullScreen, size: options && options.size, title: title, description: description, formControls: options && options.formControls, onCancel: handleCancel, onOk: handleOk, isDismissable: options && options.isDismissable, buttons: options && options.buttons }), this.container);
|
|
1717
1702
|
}
|
|
1718
1703
|
});
|
|
1719
1704
|
}
|
|
@@ -1828,7 +1813,7 @@ const Sidebar = (props) => {
|
|
|
1828
1813
|
!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)))))))))));
|
|
1829
1814
|
};
|
|
1830
1815
|
|
|
1831
|
-
var css_248z$b = ".Snackbar-module_snackbar__3AF3D {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__11jAv 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius)
|
|
1816
|
+
var css_248z$b = ".Snackbar-module_snackbar__3AF3D {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__11jAv 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_primary__3Pt9m {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_accent__1iCXk {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_secondary__3ke12 {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_light__3Pi0Y {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_dark__3TwXn {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n\n.Snackbar-module_text__2gmW- {\n width: 100%;\n padding: 8px 0;\n}\n\n.Snackbar-module_action__1BXqS {\n margin-left: auto;\n}\n.Snackbar-module_action__1BXqS:hover {\n cursor: pointer;\n}\n\n@keyframes Snackbar-module_bounceIn__11jAv {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0.9;\n }\n 80% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n }\n}";
|
|
1832
1817
|
var styles$b = {"snackbar":"Snackbar-module_snackbar__3AF3D","bounceIn":"Snackbar-module_bounceIn__11jAv","primary":"Snackbar-module_primary__3Pt9m","accent":"Snackbar-module_accent__1iCXk","secondary":"Snackbar-module_secondary__3ke12","light":"Snackbar-module_light__3Pi0Y","dark":"Snackbar-module_dark__3TwXn","text":"Snackbar-module_text__2gmW-","action":"Snackbar-module_action__1BXqS"};
|
|
1833
1818
|
styleInject(css_248z$b);
|
|
1834
1819
|
|
|
@@ -1884,7 +1869,7 @@ class SnackbarService {
|
|
|
1884
1869
|
}
|
|
1885
1870
|
const snackbarService = new SnackbarService();
|
|
1886
1871
|
|
|
1887
|
-
var css_248z$a = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto
|
|
1872
|
+
var css_248z$a = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto;\n}";
|
|
1888
1873
|
var styles$a = {"speedDialActions":"SpeedDialActions-module_speedDialActions__zLEps"};
|
|
1889
1874
|
styleInject(css_248z$a);
|
|
1890
1875
|
|
|
@@ -1898,7 +1883,7 @@ const SpeedDialActions = (props) => {
|
|
|
1898
1883
|
return (React__default['default'].createElement("div", { className: getCssClasses() }, children));
|
|
1899
1884
|
};
|
|
1900
1885
|
|
|
1901
|
-
var css_248z$9 = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
1886
|
+
var css_248z$9 = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
|
|
1902
1887
|
var styles$9 = {"speedDial":"SpeedDial-module_speedDial__CQ5x2"};
|
|
1903
1888
|
styleInject(css_248z$9);
|
|
1904
1889
|
|
|
@@ -1923,7 +1908,7 @@ const SpeedDial = (props) => {
|
|
|
1923
1908
|
React__default['default'].createElement(SpeedDialActions, null, children)));
|
|
1924
1909
|
};
|
|
1925
1910
|
|
|
1926
|
-
var css_248z$8 = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px
|
|
1911
|
+
var css_248z$8 = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px;\n}";
|
|
1927
1912
|
var styles$8 = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs"};
|
|
1928
1913
|
styleInject(css_248z$8);
|
|
1929
1914
|
|
|
@@ -1948,7 +1933,7 @@ const SpeedDialIcon = (props) => {
|
|
|
1948
1933
|
return (React__default['default'].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
1949
1934
|
};
|
|
1950
1935
|
|
|
1951
|
-
var css_248z$7 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex
|
|
1936
|
+
var css_248z$7 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex;\n}";
|
|
1952
1937
|
var styles$7 = {"stepperActions":"StepperActions-module_stepperActions__2r5ZT"};
|
|
1953
1938
|
styleInject(css_248z$7);
|
|
1954
1939
|
|
|
@@ -1973,7 +1958,7 @@ const StepPanel = (props) => {
|
|
|
1973
1958
|
return (React__default['default'].createElement("div", { className: "steppanel" }, children));
|
|
1974
1959
|
};
|
|
1975
1960
|
|
|
1976
|
-
var css_248z$6 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px
|
|
1961
|
+
var css_248z$6 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px;\n}\n\n.StepConnector-module_stepConnectorLine__jSqG4 {\n display: block;\n border-color: var(--secondary);\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.StepConnector-module_stepConnectorLine__jSqG4.StepConnector-module_isActive__3Yj6N {\n border-color: var(--primary);\n}\n\n.StepConnector-module_stepConnectorLineHorizontal__3R2R8 {\n border-top-style: solid;\n border-top-width: 1px;\n}";
|
|
1977
1962
|
var styles$6 = {"stepConnector":"StepConnector-module_stepConnector__2m7Xp","stepConnectorLine":"StepConnector-module_stepConnectorLine__jSqG4","isActive":"StepConnector-module_isActive__3Yj6N","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__3R2R8"};
|
|
1978
1963
|
styleInject(css_248z$6);
|
|
1979
1964
|
|
|
@@ -1995,7 +1980,7 @@ const StepConnector = (props) => {
|
|
|
1995
1980
|
React__default['default'].createElement("div", { className: getCssClassesLine() })));
|
|
1996
1981
|
};
|
|
1997
1982
|
|
|
1998
|
-
var css_248z$5 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px
|
|
1983
|
+
var css_248z$5 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px;\n}\n.Stepper-module_stepper__1TOxM.Stepper-module_isHorizontal__3rFHH {\n overflow-x: auto;\n}";
|
|
1999
1984
|
var styles$5 = {"stepper":"Stepper-module_stepper__1TOxM","isHorizontal":"Stepper-module_isHorizontal__3rFHH"};
|
|
2000
1985
|
styleInject(css_248z$5);
|
|
2001
1986
|
|
|
@@ -2146,7 +2131,7 @@ const useConstructor = (callBack = () => { }) => {
|
|
|
2146
2131
|
setHasBeenCalled(true);
|
|
2147
2132
|
};
|
|
2148
2133
|
|
|
2149
|
-
var css_248z$4 = ".Step-module_stepWrapper__1se3l {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2134
|
+
var css_248z$4 = ".Step-module_stepWrapper__1se3l {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Step-module_stepWrapper__1se3l.Step-module_hasLabel__3cdCU:not(.Step-module_disabled__1R7hh):hover {\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n border-radius: var(--borderRadius);\n}\n\n.Step-module_step__2siYu {\n width: 40px;\n height: 40px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Step-module_step__2siYu:not(.Step-module_hasLabel__3cdCU):not(.Step-module_disabled__1R7hh):hover {\n border-radius: 100%;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n}\n.Step-module_step__2siYu.Step-module_hasLabel__3cdCU svg {\n width: 18px !important;\n height: 18px !important;\n}\n\n.Step-module_stepIconCircle__3IyDn svg {\n width: 24px;\n height: 24px;\n}\n\n.Step-module_stepValue__2TVrP {\n position: absolute;\n color: var(--secondary-contrast-text);\n}\n.Step-module_stepValue__2TVrP .Step-module_isActive__1QTL4 {\n color: var(--primary-contrast-text);\n}";
|
|
2150
2135
|
var styles$4 = {"stepWrapper":"Step-module_stepWrapper__1se3l","hasLabel":"Step-module_hasLabel__3cdCU","disabled":"Step-module_disabled__1R7hh","step":"Step-module_step__2siYu","stepIconCircle":"Step-module_stepIconCircle__3IyDn","stepValue":"Step-module_stepValue__2TVrP","isActive":"Step-module_isActive__1QTL4"};
|
|
2151
2136
|
styleInject(css_248z$4);
|
|
2152
2137
|
|
|
@@ -2201,7 +2186,7 @@ const Table = (props) => {
|
|
|
2201
2186
|
React__default['default'].createElement("table", { className: getCssClasses() }, children)));
|
|
2202
2187
|
};
|
|
2203
2188
|
|
|
2204
|
-
var css_248z$3 = ".TabIndicator-module_tabIndicator__wj9Qm {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2189
|
+
var css_248z$3 = ".TabIndicator-module_tabIndicator__wj9Qm {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_primary__2Lc8c {\n background-color: var(--primary);\n}\n.TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_accent__37h0D {\n background-color: var(--accent);\n}";
|
|
2205
2190
|
var styles$3 = {"tabIndicator":"TabIndicator-module_tabIndicator__wj9Qm","primary":"TabIndicator-module_primary__2Lc8c","accent":"TabIndicator-module_accent__37h0D"};
|
|
2206
2191
|
styleInject(css_248z$3);
|
|
2207
2192
|
|
|
@@ -2219,7 +2204,7 @@ const TabIndicator = (props) => {
|
|
|
2219
2204
|
} }));
|
|
2220
2205
|
};
|
|
2221
2206
|
|
|
2222
|
-
var css_248z$2 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative
|
|
2207
|
+
var css_248z$2 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative;\n}";
|
|
2223
2208
|
var styles$2 = {"tabs":"Tabs-module_tabs__2azkC"};
|
|
2224
2209
|
styleInject(css_248z$2);
|
|
2225
2210
|
|
|
@@ -2260,7 +2245,7 @@ const Tabs = (props) => {
|
|
|
2260
2245
|
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 }))));
|
|
2261
2246
|
};
|
|
2262
2247
|
|
|
2263
|
-
var css_248z$1 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2248
|
+
var css_248z$1 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
|
|
2264
2249
|
var styles$1 = {"tab":"Tab-module_tab__31Fjd"};
|
|
2265
2250
|
styleInject(css_248z$1);
|
|
2266
2251
|
|
|
@@ -2283,7 +2268,7 @@ const TabPanel = (props) => {
|
|
|
2283
2268
|
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));
|
|
2284
2269
|
};
|
|
2285
2270
|
|
|
2286
|
-
var css_248z = ".Tooltip-module_tooltipContainer__3SPVX {\n display: inline
|
|
2271
|
+
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}";
|
|
2287
2272
|
var styles = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2288
2273
|
styleInject(css_248z);
|
|
2289
2274
|
|
|
@@ -2294,6 +2279,7 @@ const Tooltip = (props) => {
|
|
|
2294
2279
|
const refTooltip = React.useRef(null);
|
|
2295
2280
|
React.useEffect(() => {
|
|
2296
2281
|
if (show === true && refChild && refChild.current) {
|
|
2282
|
+
// TODO - extract to own component?
|
|
2297
2283
|
core.createPopper(refChild.current, refTooltip.current, {
|
|
2298
2284
|
placement: placement,
|
|
2299
2285
|
modifiers: [
|
|
@@ -2462,16 +2448,16 @@ const TimeSelect = (props) => {
|
|
|
2462
2448
|
};
|
|
2463
2449
|
|
|
2464
2450
|
const TreeNode = (props) => {
|
|
2465
|
-
const { id, label, level, hasChildren, isExpanded, isSelected,
|
|
2451
|
+
const { id, label, level, hasChildren, isExpanded, isSelected, onToggleExpand, onClickSelect } = props;
|
|
2466
2452
|
return (React__default['default'].createElement("li", { className: "tree-node", style: { paddingLeft: `${(48 * level) + (hasChildren ? 0 : 1) * 48}px` } },
|
|
2467
2453
|
hasChildren &&
|
|
2468
|
-
React__default['default'].createElement(IconButton, { onClick: () =>
|
|
2454
|
+
React__default['default'].createElement(IconButton, { onClick: () => onToggleExpand(id), icon: !isExpanded ? React__default['default'].createElement(ChevronRightSolidIcon, null) : React__default['default'].createElement(ChevronDownSolidIcon, null) }),
|
|
2469
2455
|
React__default['default'].createElement(Checkbox, { checked: isSelected, onChange: () => onClickSelect(id) }),
|
|
2470
2456
|
label));
|
|
2471
2457
|
};
|
|
2472
2458
|
|
|
2473
2459
|
const TreeView = (props) => {
|
|
2474
|
-
const { data, onSelect } = props;
|
|
2460
|
+
const { data, onSelect, onExpand, onCollapse } = props;
|
|
2475
2461
|
const [flattenData, setFlattenData] = React.useState([]);
|
|
2476
2462
|
const [expandedItems, setExpandedItems] = React.useState([]);
|
|
2477
2463
|
const [selectedItemIds, setSelectedItemIds] = React.useState([]);
|
|
@@ -2490,14 +2476,16 @@ const TreeView = (props) => {
|
|
|
2490
2476
|
React.useEffect(() => {
|
|
2491
2477
|
setFlattenData(flattenDeep(data));
|
|
2492
2478
|
}, [data]);
|
|
2493
|
-
const
|
|
2479
|
+
const handleOnToggleExpand = (item) => {
|
|
2494
2480
|
if (item.hasChildren) {
|
|
2495
2481
|
let newExpandedItems = [...expandedItems];
|
|
2496
2482
|
if (isExpanded(item.id)) {
|
|
2497
2483
|
newExpandedItems = collapseRecursive(item, [...expandedItems]);
|
|
2484
|
+
onCollapse && onCollapse(item.id);
|
|
2498
2485
|
}
|
|
2499
2486
|
else {
|
|
2500
2487
|
newExpandedItems.push(item);
|
|
2488
|
+
onExpand && onExpand(item.id);
|
|
2501
2489
|
}
|
|
2502
2490
|
setExpandedItems(newExpandedItems);
|
|
2503
2491
|
}
|
|
@@ -2538,7 +2526,7 @@ const TreeView = (props) => {
|
|
|
2538
2526
|
};
|
|
2539
2527
|
return (React__default['default'].createElement("ul", { className: "treeview" }, flattenData.map(item => {
|
|
2540
2528
|
return isItemVisible(item) &&
|
|
2541
|
-
React__default['default'].createElement(TreeNode, { key: item.id, id: item.id, label: item.label, level: item.level, parentId: item.parentId, isExpanded: isExpanded(item.id), isSelected: isSelected(item.id), hasChildren: item.hasChildren,
|
|
2529
|
+
React__default['default'].createElement(TreeNode, { key: item.id, id: item.id, label: item.label, level: item.level, parentId: item.parentId, isExpanded: isExpanded(item.id), isSelected: isSelected(item.id), hasChildren: item.hasChildren, onToggleExpand: () => handleOnToggleExpand(item), onClickSelect: () => handleNodeClickSelect(item) });
|
|
2542
2530
|
})));
|
|
2543
2531
|
};
|
|
2544
2532
|
|