react-asc 18.7.3 → 18.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/TreeView/TreeItem.d.ts +12 -0
- package/components/TreeView/TreeView.d.ts +2 -9
- package/components/TreeView/index.d.ts +1 -0
- package/index.es.js +329 -358
- package/index.es.js.map +1 -1
- package/index.js +329 -357
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/react-asc.scss +0 -15
- package/components/TreeView/TreeNode.d.ts +0 -13
package/index.es.js
CHANGED
|
@@ -87,56 +87,56 @@ function styleInject(css, ref) {
|
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
|
|
90
|
-
var css_248z$
|
|
91
|
-
var styles$
|
|
92
|
-
styleInject(css_248z$
|
|
90
|
+
var css_248z$T = ".Alert-module_alert__2yOUn {\n border-radius: var(--borderRadius);\n padding: 6px 16px;\n}\n\n.Alert-module_contained__1cUnn.Alert-module_primary__1pnWJ {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Alert-module_contained__1cUnn.Alert-module_accent__3TlkP {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Alert-module_contained__1cUnn.Alert-module_secondary__3cfYS {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Alert-module_contained__1cUnn.Alert-module_light__vSzHK {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Alert-module_contained__1cUnn.Alert-module_dark__3DrkS {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n\n.Alert-module_outline__3fdYC.Alert-module_primary__1pnWJ {\n color: var(--primary) !important;\n border: 1px solid var(--primary) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_secondary__3cfYS {\n color: var(--secondary) !important;\n border: 1px solid var(--secondary) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_accent__3TlkP {\n color: var(--accent) !important;\n border: 1px solid var(--accent) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_light__vSzHK {\n color: var(--light-contrast-text) !important;\n border: 1px solid var(--light) !important;\n}\n.Alert-module_outline__3fdYC.Alert-module_dark__3DrkS {\n color: var(--dark) !important;\n border: 1px solid var(--dark) !important;\n}";
|
|
91
|
+
var styles$T = {"alert":"Alert-module_alert__2yOUn","contained":"Alert-module_contained__1cUnn","primary":"Alert-module_primary__1pnWJ","accent":"Alert-module_accent__3TlkP","secondary":"Alert-module_secondary__3cfYS","light":"Alert-module_light__vSzHK","dark":"Alert-module_dark__3DrkS","outline":"Alert-module_outline__3fdYC"};
|
|
92
|
+
styleInject(css_248z$T);
|
|
93
93
|
|
|
94
94
|
const Alert = (props) => {
|
|
95
95
|
const { children, className, color = COLOR.primary, variant = VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
96
96
|
const getCssClasses = () => {
|
|
97
97
|
const cssClasses = [];
|
|
98
|
-
cssClasses.push(styles$
|
|
98
|
+
cssClasses.push(styles$T.alert);
|
|
99
99
|
if (variant === VARIANT.contained) {
|
|
100
|
-
cssClasses.push(styles$
|
|
101
|
-
cssClasses.push(styles$
|
|
100
|
+
cssClasses.push(styles$T.contained);
|
|
101
|
+
cssClasses.push(styles$T[color]);
|
|
102
102
|
}
|
|
103
103
|
if (variant === VARIANT.outline) {
|
|
104
|
-
cssClasses.push(styles$
|
|
105
|
-
cssClasses.push(styles$
|
|
104
|
+
cssClasses.push(styles$T.outline);
|
|
105
|
+
cssClasses.push(styles$T[color]);
|
|
106
106
|
}
|
|
107
|
-
shadow && cssClasses.push(styles$
|
|
107
|
+
shadow && cssClasses.push(styles$T['shadow']);
|
|
108
108
|
className && cssClasses.push(className);
|
|
109
109
|
return cssClasses.filter(r => r).join(' ');
|
|
110
110
|
};
|
|
111
111
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
112
112
|
};
|
|
113
113
|
|
|
114
|
-
var css_248z$
|
|
115
|
-
var styles$
|
|
116
|
-
styleInject(css_248z$
|
|
114
|
+
var css_248z$S = ".AppBar-module_appbar__1S8G1 {\n padding: 0.5rem 1rem;\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0;\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_primary__3CiO7 {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_secondary__1W4qT {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_accent__Mgcwx {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_light__1FxmL {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_dark__3n5rm {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.AppBar-module_appbar__1S8G1.AppBar-module_shadow__2c8iH {\n box-shadow: var(--shadow);\n}";
|
|
115
|
+
var styles$S = {"appbar":"AppBar-module_appbar__1S8G1","primary":"AppBar-module_primary__3CiO7","secondary":"AppBar-module_secondary__1W4qT","accent":"AppBar-module_accent__Mgcwx","light":"AppBar-module_light__1FxmL","dark":"AppBar-module_dark__3n5rm","shadow":"AppBar-module_shadow__2c8iH"};
|
|
116
|
+
styleInject(css_248z$S);
|
|
117
117
|
|
|
118
118
|
const AppBar = (props) => {
|
|
119
119
|
const { children, className, color = COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
120
120
|
const getCssClasses = () => {
|
|
121
121
|
const cssClasses = [];
|
|
122
|
-
cssClasses.push(styles$
|
|
123
|
-
cssClasses.push(styles$
|
|
124
|
-
shadow && cssClasses.push(styles$
|
|
122
|
+
cssClasses.push(styles$S[color]);
|
|
123
|
+
cssClasses.push(styles$S.appbar);
|
|
124
|
+
shadow && cssClasses.push(styles$S['shadow']);
|
|
125
125
|
className && cssClasses.push(className);
|
|
126
126
|
return cssClasses.filter(r => r).join(' ');
|
|
127
127
|
};
|
|
128
128
|
return (React.createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
129
129
|
};
|
|
130
130
|
|
|
131
|
-
var css_248z$
|
|
132
|
-
var styles$
|
|
133
|
-
styleInject(css_248z$
|
|
131
|
+
var css_248z$R = ".AppBarTitle-module_appbarTitle__3J-Z1 {\n align-items: center;\n padding-top: 0.3125rem;\n padding-bottom: 0.3125rem;\n font-size: 1.25rem;\n line-height: 1.8;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden !important;\n display: inline-block;\n}\n.AppBarTitle-module_appbarTitle__3J-Z1:hover {\n cursor: pointer;\n}";
|
|
132
|
+
var styles$R = {"appbarTitle":"AppBarTitle-module_appbarTitle__3J-Z1"};
|
|
133
|
+
styleInject(css_248z$R);
|
|
134
134
|
|
|
135
135
|
const AppBarTitle = (props) => {
|
|
136
136
|
const { children, className, onClick } = props;
|
|
137
137
|
const getCssClass = () => {
|
|
138
138
|
const cssClasses = [];
|
|
139
|
-
cssClasses.push(styles$
|
|
139
|
+
cssClasses.push(styles$R.appbarTitle);
|
|
140
140
|
className && cssClasses.push(className);
|
|
141
141
|
return cssClasses.filter(r => r).join(' ');
|
|
142
142
|
};
|
|
@@ -164,40 +164,40 @@ const Backdrop = (props) => {
|
|
|
164
164
|
return (createPortal(React.createElement("div", { className: getCssClasses(), onClick: handleClick, style: getStyles() }), target));
|
|
165
165
|
};
|
|
166
166
|
|
|
167
|
-
var css_248z$
|
|
168
|
-
var styles$
|
|
169
|
-
styleInject(css_248z$
|
|
167
|
+
var css_248z$Q = ".List-module_list__1ax9w {\n width: 100%;\n display: flex;\n flex-direction: column;\n padding-left: 0;\n margin-bottom: 0;\n margin-top: 0;\n background-color: var(--white);\n}";
|
|
168
|
+
var styles$Q = {"list":"List-module_list__1ax9w"};
|
|
169
|
+
styleInject(css_248z$Q);
|
|
170
170
|
|
|
171
171
|
const List = (props) => {
|
|
172
172
|
const { children, className, isFlush } = props;
|
|
173
173
|
const getCssClasses = () => {
|
|
174
174
|
const cssClasses = [];
|
|
175
175
|
if (isFlush) {
|
|
176
|
-
cssClasses.push(styles$
|
|
176
|
+
cssClasses.push(styles$Q.flush);
|
|
177
177
|
}
|
|
178
|
-
cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$Q.list);
|
|
179
179
|
className && cssClasses.push(className);
|
|
180
180
|
return cssClasses.filter(css => css).join(' ');
|
|
181
181
|
};
|
|
182
182
|
return (React.createElement("ul", { className: getCssClasses() }, children));
|
|
183
183
|
};
|
|
184
184
|
|
|
185
|
-
var css_248z$
|
|
186
|
-
var styles$
|
|
187
|
-
styleInject(css_248z$
|
|
185
|
+
var css_248z$P = ".ListItem-module_listItem__3hAZb {\n display: flex;\n align-items: center;\n position: relative;\n padding: 0.75rem 1.25rem;\n min-width: 100%;\n color: var(--bodyColor);\n text-align: inherit;\n transition: background 0.5s ease;\n}\n.ListItem-module_listItem__3hAZb:hover, .ListItem-module_listItem__3hAZb.ListItem-module_active__hyvch {\n cursor: pointer;\n z-index: 1;\n text-decoration: none;\n background-color: rgba(0, 0, 0, 0.04);\n color: var(--primary);\n}\n.ListItem-module_listItem__3hAZb + .ListItem-module_listItem__3hAZb {\n border-top-width: 0;\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_primary__2OJAg {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_accent__2RXHe {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_secondary__3EVjH {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_light__3CJBB {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.ListItem-module_listItem__3hAZb.ListItem-module_dark__SazkE {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}";
|
|
186
|
+
var styles$P = {"listItem":"ListItem-module_listItem__3hAZb","active":"ListItem-module_active__hyvch","primary":"ListItem-module_primary__2OJAg","accent":"ListItem-module_accent__2RXHe","secondary":"ListItem-module_secondary__3EVjH","light":"ListItem-module_light__3CJBB","dark":"ListItem-module_dark__SazkE"};
|
|
187
|
+
styleInject(css_248z$P);
|
|
188
188
|
|
|
189
189
|
const ListItem = (props) => {
|
|
190
190
|
const { id, children, color, active, className, isHoverable, isDisabled, onClick } = props;
|
|
191
191
|
const getCssClasses = () => {
|
|
192
192
|
const cssClasses = [];
|
|
193
193
|
if (active) {
|
|
194
|
-
cssClasses.push(styles$
|
|
194
|
+
cssClasses.push(styles$P['active']);
|
|
195
195
|
}
|
|
196
196
|
if (isDisabled) {
|
|
197
197
|
cssClasses.push(`disabled`);
|
|
198
198
|
}
|
|
199
|
-
color && cssClasses.push(styles$
|
|
200
|
-
cssClasses.push(styles$
|
|
199
|
+
color && cssClasses.push(styles$P[color]);
|
|
200
|
+
cssClasses.push(styles$P.listItem);
|
|
201
201
|
className && cssClasses.push(className);
|
|
202
202
|
return cssClasses.filter(css => css).join(' ');
|
|
203
203
|
};
|
|
@@ -207,32 +207,32 @@ const ListItem = (props) => {
|
|
|
207
207
|
return (React.createElement("li", { id: id, onClick: handleClick, className: getCssClasses() }, children));
|
|
208
208
|
};
|
|
209
209
|
|
|
210
|
-
var css_248z$
|
|
211
|
-
var styles$
|
|
212
|
-
styleInject(css_248z$
|
|
210
|
+
var css_248z$O = ".ListItemAvatar-module_avatar__1fjSE {\n margin-right: 16px;\n}\n.ListItemAvatar-module_avatar__1fjSE svg, .ListItemAvatar-module_avatar__1fjSE img {\n width: 24px;\n height: 24px;\n}\n.ListItemAvatar-module_avatar__1fjSE img {\n border-radius: 50%;\n}";
|
|
211
|
+
var styles$O = {"avatar":"ListItemAvatar-module_avatar__1fjSE"};
|
|
212
|
+
styleInject(css_248z$O);
|
|
213
213
|
|
|
214
|
-
const ListItemAvatar = ({ avatar }) => (React.createElement("div", { className: styles$
|
|
214
|
+
const ListItemAvatar = ({ avatar }) => (React.createElement("div", { className: styles$O.avatar }, avatar));
|
|
215
215
|
|
|
216
|
-
var css_248z$
|
|
217
|
-
var styles$
|
|
218
|
-
styleInject(css_248z$
|
|
216
|
+
var css_248z$N = ".ListItemIcon-module_icon__-nsUy {\n margin-right: 32px;\n}\n.ListItemIcon-module_icon__-nsUy svg {\n width: 24px;\n height: 24px;\n}";
|
|
217
|
+
var styles$N = {"icon":"ListItemIcon-module_icon__-nsUy"};
|
|
218
|
+
styleInject(css_248z$N);
|
|
219
219
|
|
|
220
|
-
const ListItemIcon = ({ icon }) => (React.createElement("div", { className: styles$
|
|
220
|
+
const ListItemIcon = ({ icon }) => (React.createElement("div", { className: styles$N.icon }, icon));
|
|
221
221
|
|
|
222
|
-
var css_248z$
|
|
223
|
-
var styles$
|
|
224
|
-
styleInject(css_248z$
|
|
222
|
+
var css_248z$M = ".ListItemAction-module_listItemAction__26S66 {\n display: flex;\n justify-content: center;\n min-width: 40px;\n}\n.ListItemAction-module_listItemAction__26S66 svg {\n width: 20px;\n height: 20px;\n}";
|
|
223
|
+
var styles$M = {"listItemAction":"ListItemAction-module_listItemAction__26S66"};
|
|
224
|
+
styleInject(css_248z$M);
|
|
225
225
|
|
|
226
|
-
const ListItemAction = ({ children, onClick }) => (React.createElement("div", { className: styles$
|
|
226
|
+
const ListItemAction = ({ children, onClick }) => (React.createElement("div", { className: styles$M.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
227
227
|
|
|
228
|
-
var css_248z$
|
|
229
|
-
var styles$
|
|
230
|
-
styleInject(css_248z$
|
|
228
|
+
var css_248z$L = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1;\n}";
|
|
229
|
+
var styles$L = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
230
|
+
styleInject(css_248z$L);
|
|
231
231
|
|
|
232
232
|
const ListItemText = ({ primary, secondary }) => {
|
|
233
233
|
const getCssClasses = () => {
|
|
234
234
|
const cssClasses = [];
|
|
235
|
-
cssClasses.push(styles$
|
|
235
|
+
cssClasses.push(styles$L.listItemText);
|
|
236
236
|
return cssClasses.filter(css => css).join(' ');
|
|
237
237
|
};
|
|
238
238
|
return (React.createElement("div", { className: getCssClasses() },
|
|
@@ -243,9 +243,9 @@ const ListItemText = ({ primary, secondary }) => {
|
|
|
243
243
|
const ListItemTextPrimary = ({ children }) => (React.createElement("div", { className: "list-item-text-primary" }, children));
|
|
244
244
|
const ListItemTextSecondary = ({ children }) => (React.createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
245
245
|
|
|
246
|
-
var css_248z$
|
|
247
|
-
var styles$
|
|
248
|
-
styleInject(css_248z$
|
|
246
|
+
var css_248z$K = ".AutoComplete-module_selectContainer__SyqtX {\n position: relative;\n}\n\n.AutoComplete-module_select__2_7JD {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n}\n.AutoComplete-module_select__2_7JD:hover {\n cursor: pointer;\n}\n\n.AutoComplete-module_selectMenu__2_ybA {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 38px;\n z-index: 1050;\n max-height: 280px;\n overflow: auto;\n}";
|
|
247
|
+
var styles$K = {"selectContainer":"AutoComplete-module_selectContainer__SyqtX","select":"AutoComplete-module_select__2_7JD","selectMenu":"AutoComplete-module_selectMenu__2_ybA"};
|
|
248
|
+
styleInject(css_248z$K);
|
|
249
249
|
|
|
250
250
|
// preset value
|
|
251
251
|
// enter -> delay? -> show results
|
|
@@ -294,7 +294,7 @@ const AutoComplete = (props) => {
|
|
|
294
294
|
const getCssClass = () => {
|
|
295
295
|
const cssClasses = [];
|
|
296
296
|
className && cssClasses.push(className);
|
|
297
|
-
cssClasses.push(styles$
|
|
297
|
+
cssClasses.push(styles$K.select);
|
|
298
298
|
return cssClasses.filter(r => r).join(' ');
|
|
299
299
|
};
|
|
300
300
|
const show = () => setIsShow(true);
|
|
@@ -319,35 +319,35 @@ const AutoComplete = (props) => {
|
|
|
319
319
|
setSearchText('');
|
|
320
320
|
};
|
|
321
321
|
return (React.createElement(React.Fragment, null,
|
|
322
|
-
React.createElement("div", { ref: selectConainter, className: styles$
|
|
322
|
+
React.createElement("div", { ref: selectConainter, className: styles$K.selectContainer },
|
|
323
323
|
React.createElement("div", { className: "d-flex" },
|
|
324
324
|
React.createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, placeholder: placeholder, value: model }),
|
|
325
325
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
326
326
|
React.createElement(IconButton, { icon: React.createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
327
327
|
isShow &&
|
|
328
328
|
React.createElement(React.Fragment, null,
|
|
329
|
-
React.createElement("div", { className: styles$
|
|
329
|
+
React.createElement("div", { className: styles$K.selectMenu },
|
|
330
330
|
React.createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React.createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option) },
|
|
331
331
|
React.createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
332
332
|
React.createElement(Backdrop, { isTransparent: true, onClick: () => hide() })))));
|
|
333
333
|
};
|
|
334
334
|
|
|
335
|
-
var css_248z$
|
|
336
|
-
var styles$
|
|
337
|
-
styleInject(css_248z$
|
|
335
|
+
var css_248z$J = ".Badge-module_badgeContainer__1QtTD {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle;\n}\n\n.Badge-module_badge__2Y_LO {\n top: 0;\n right: 0;\n transform: scale(1) translate(50%, -50%);\n transform-origin: 100% 0%;\n height: 20px;\n display: flex;\n padding: 0 6px;\n z-index: 1;\n position: absolute;\n flex-wrap: wrap;\n font-size: 0.75rem;\n min-width: 20px;\n align-items: center;\n font-weight: 500;\n line-height: 1;\n align-content: center;\n flex-direction: row;\n justify-content: center;\n border-radius: 10px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Badge-module_badge__2Y_LO.Badge-module_primary__2mn7_ {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Badge-module_badge__2Y_LO.Badge-module_accent__8Hg8z {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Badge-module_badge__2Y_LO.Badge-module_secondary__1QqDc {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Badge-module_badge__2Y_LO.Badge-module_light__3Z7JO {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Badge-module_badge__2Y_LO.Badge-module_dark__2qWe_ {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}";
|
|
336
|
+
var styles$J = {"badgeContainer":"Badge-module_badgeContainer__1QtTD","badge":"Badge-module_badge__2Y_LO","primary":"Badge-module_primary__2mn7_","accent":"Badge-module_accent__8Hg8z","secondary":"Badge-module_secondary__1QqDc","light":"Badge-module_light__3Z7JO","dark":"Badge-module_dark__2qWe_"};
|
|
337
|
+
styleInject(css_248z$J);
|
|
338
338
|
|
|
339
339
|
const Badge = (props) => {
|
|
340
340
|
const { children, content, className, color = COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
341
341
|
const getCssClassesBadgeContainer = () => {
|
|
342
342
|
const cssClasses = [];
|
|
343
|
-
cssClasses.push(styles$
|
|
343
|
+
cssClasses.push(styles$J.badgeContainer);
|
|
344
344
|
className && cssClasses.push(className);
|
|
345
345
|
return cssClasses.filter(css => css).join(' ');
|
|
346
346
|
};
|
|
347
347
|
const getCssClassesBadge = () => {
|
|
348
348
|
const cssClasses = [];
|
|
349
|
-
cssClasses.push(styles$
|
|
350
|
-
cssClasses.push(styles$
|
|
349
|
+
cssClasses.push(styles$J.badge);
|
|
350
|
+
cssClasses.push(styles$J[color]);
|
|
351
351
|
return cssClasses.filter(css => css).join(' ');
|
|
352
352
|
};
|
|
353
353
|
return (React.createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -355,42 +355,42 @@ const Badge = (props) => {
|
|
|
355
355
|
React.createElement("span", { className: getCssClassesBadge() }, content)));
|
|
356
356
|
};
|
|
357
357
|
|
|
358
|
-
var css_248z$
|
|
359
|
-
var styles$
|
|
360
|
-
styleInject(css_248z$
|
|
358
|
+
var css_248z$I = ".Icon-module_icon__2etAT {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px;\n}\n.Icon-module_icon__2etAT svg {\n width: inherit;\n height: inherit;\n}\n.Icon-module_icon__2etAT.Icon-module_primary__32Mh4 {\n color: var(--primary);\n}\n.Icon-module_icon__2etAT.Icon-module_accent__2U_no {\n color: var(--accent);\n}\n.Icon-module_icon__2etAT.Icon-module_secondary__3cMmx {\n color: var(--secondary);\n}\n.Icon-module_icon__2etAT.Icon-module_light__2SugS {\n color: var(--light);\n}\n.Icon-module_icon__2etAT.Icon-module_dark__GWMzb {\n color: var(--dark);\n}";
|
|
359
|
+
var styles$I = {"icon":"Icon-module_icon__2etAT","primary":"Icon-module_primary__32Mh4","accent":"Icon-module_accent__2U_no","secondary":"Icon-module_secondary__3cMmx","light":"Icon-module_light__2SugS","dark":"Icon-module_dark__GWMzb"};
|
|
360
|
+
styleInject(css_248z$I);
|
|
361
361
|
|
|
362
362
|
const Icon = (props) => {
|
|
363
363
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
364
364
|
const getCssClasses = () => {
|
|
365
365
|
const cssClasses = [];
|
|
366
|
-
cssClasses.push(styles$
|
|
367
|
-
iconColor && cssClasses.push(styles$
|
|
366
|
+
cssClasses.push(styles$I.icon);
|
|
367
|
+
iconColor && cssClasses.push(styles$I[iconColor]);
|
|
368
368
|
className && cssClasses.push(className);
|
|
369
369
|
return cssClasses.filter(css => css).join(' ');
|
|
370
370
|
};
|
|
371
371
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
372
372
|
};
|
|
373
373
|
|
|
374
|
-
var css_248z$
|
|
375
|
-
var styles$
|
|
376
|
-
styleInject(css_248z$
|
|
374
|
+
var css_248z$H = ".Button-module_button__3cIVZ {\n text-transform: uppercase !important;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius);\n box-shadow: var(--shadow);\n}\n\n.Button-module_btnContained__8Q4uL.Button-module_primary__2soUg {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Button-module_btnContained__8Q4uL.Button-module_primary__2soUg:hover {\n background-color: var(--primary-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_accent__1_cP6 {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Button-module_btnContained__8Q4uL.Button-module_accent__1_cP6:hover {\n background-color: var(--accent-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_secondary__psAvb {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Button-module_btnContained__8Q4uL.Button-module_secondary__psAvb:hover {\n background-color: var(--secondary-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_light__JVK1z {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Button-module_btnContained__8Q4uL.Button-module_light__JVK1z:hover {\n background-color: var(--light-dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_dark__O89wU {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.Button-module_btnContained__8Q4uL.Button-module_dark__O89wU:hover {\n background-color: var(--dark-dark);\n}\n.Button-module_btnContained__8Q4uL:disabled:hover {\n cursor: not-allowed;\n}\n\n.Button-module_btnText__32H44 {\n box-shadow: none;\n text-decoration: none;\n}\n.Button-module_btnText__32H44.Button-module_primary__2soUg {\n color: var(--primary) !important;\n}\n.Button-module_btnText__32H44.Button-module_primary__2soUg:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_secondary__psAvb {\n color: var(--secondary) !important;\n}\n.Button-module_btnText__32H44.Button-module_secondary__psAvb:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_accent__1_cP6 {\n color: var(--accent) !important;\n}\n.Button-module_btnText__32H44.Button-module_accent__1_cP6:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important;\n}\n.Button-module_btnText__32H44.Button-module_light__JVK1z:hover {\n text-decoration: none;\n background: var(--light-highlight) !important;\n}\n.Button-module_btnText__32H44.Button-module_dark__O89wU {\n color: var(--dark) !important;\n}\n.Button-module_btnText__32H44.Button-module_dark__O89wU:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important;\n}\n\n.Button-module_btnOutline__2drkn {\n box-shadow: none;\n text-decoration: none;\n}\n.Button-module_btnOutline__2drkn.Button-module_primary__2soUg {\n color: var(--primary) !important;\n border-color: var(--primary) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_primary__2soUg:hover {\n background: var(--primary-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_secondary__psAvb {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_secondary__psAvb:hover {\n background: var(--secondary-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_accent__1_cP6 {\n color: var(--accent) !important;\n border-color: var(--accent) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_accent__1_cP6:hover {\n background: var(--accent-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_light__JVK1z:hover {\n background: var(--light-highlight) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_dark__O89wU {\n color: var(--dark) !important;\n border-color: var(--dark) !important;\n}\n.Button-module_btnOutline__2drkn.Button-module_dark__O89wU:hover {\n background: var(--dark-highlight) !important;\n}\n\n.Button-module_startIcon__1TN-G {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px;\n}\n.Button-module_startIcon__1TN-G svg {\n width: 18px;\n height: 18px;\n}\n\n.Button-module_endIcon__3uZjE {\n display: inherit;\n margin-left: 8px;\n}\n.Button-module_endIcon__3uZjE svg {\n width: 18px;\n height: 18px;\n}";
|
|
375
|
+
var styles$H = {"button":"Button-module_button__3cIVZ","btnContained":"Button-module_btnContained__8Q4uL","primary":"Button-module_primary__2soUg","accent":"Button-module_accent__1_cP6","secondary":"Button-module_secondary__psAvb","light":"Button-module_light__JVK1z","dark":"Button-module_dark__O89wU","btnText":"Button-module_btnText__32H44","btnOutline":"Button-module_btnOutline__2drkn","startIcon":"Button-module_startIcon__1TN-G","endIcon":"Button-module_endIcon__3uZjE"};
|
|
376
|
+
styleInject(css_248z$H);
|
|
377
377
|
|
|
378
378
|
const ButtonTemplate = (props) => {
|
|
379
379
|
const { children, variant = VARIANT.contained, color = COLOR.primary, isRounded, isActive, className, startIcon, endIcon } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon"]);
|
|
380
380
|
const getCssClasses = () => {
|
|
381
381
|
const cssClasses = [];
|
|
382
|
-
cssClasses.push(styles$
|
|
382
|
+
cssClasses.push(styles$H.button);
|
|
383
383
|
if (variant !== 'outline' && variant !== 'text') {
|
|
384
|
-
cssClasses.push(styles$
|
|
385
|
-
cssClasses.push(styles$
|
|
384
|
+
cssClasses.push(styles$H.btnContained);
|
|
385
|
+
cssClasses.push(styles$H[color]);
|
|
386
386
|
}
|
|
387
387
|
if (variant === 'outline') {
|
|
388
|
-
cssClasses.push(styles$
|
|
389
|
-
cssClasses.push(styles$
|
|
388
|
+
cssClasses.push(styles$H.btnOutline);
|
|
389
|
+
cssClasses.push(styles$H[color]);
|
|
390
390
|
}
|
|
391
391
|
if (variant === 'text') {
|
|
392
|
-
cssClasses.push(styles$
|
|
393
|
-
cssClasses.push(styles$
|
|
392
|
+
cssClasses.push(styles$H.btnText);
|
|
393
|
+
cssClasses.push(styles$H[color]);
|
|
394
394
|
}
|
|
395
395
|
if (isRounded && variant !== 'text') {
|
|
396
396
|
cssClasses.push(`rounded-pill`);
|
|
@@ -404,40 +404,40 @@ const ButtonTemplate = (props) => {
|
|
|
404
404
|
return (React.createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
405
405
|
React.createElement("span", { className: "d-flex justify-content-center" },
|
|
406
406
|
startIcon &&
|
|
407
|
-
React.createElement(Icon, { className: styles$
|
|
407
|
+
React.createElement(Icon, { className: styles$H.startIcon }, startIcon),
|
|
408
408
|
children,
|
|
409
409
|
endIcon &&
|
|
410
|
-
React.createElement(Icon, { className: styles$
|
|
410
|
+
React.createElement(Icon, { className: styles$H.endIcon }, endIcon))));
|
|
411
411
|
};
|
|
412
412
|
|
|
413
413
|
const Button = (props) => {
|
|
414
414
|
return (React.createElement(ButtonTemplate, Object.assign({}, props)));
|
|
415
415
|
};
|
|
416
416
|
|
|
417
|
-
var css_248z$
|
|
418
|
-
var styles$
|
|
419
|
-
styleInject(css_248z$
|
|
417
|
+
var css_248z$G = ".ButtonGroup-module_buttonGroup__2RS71 button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.ButtonGroup-module_buttonGroup__2RS71 button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}";
|
|
418
|
+
var styles$G = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
419
|
+
styleInject(css_248z$G);
|
|
420
420
|
|
|
421
421
|
const ButtonGroup = (props) => {
|
|
422
422
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
423
423
|
const getCssClasses = () => {
|
|
424
424
|
const cssClasses = [];
|
|
425
|
-
cssClasses.push(styles$
|
|
425
|
+
cssClasses.push(styles$G.buttonGroup);
|
|
426
426
|
className && cssClasses.push(className);
|
|
427
427
|
return cssClasses.filter(css => css).join(' ');
|
|
428
428
|
};
|
|
429
429
|
return (React.createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
430
430
|
};
|
|
431
431
|
|
|
432
|
-
var css_248z$
|
|
433
|
-
var styles$
|
|
434
|
-
styleInject(css_248z$
|
|
432
|
+
var css_248z$F = ".Breadcrumb-module_breadcrumb__2BHXS {\n display: flex;\n flex-wrap: wrap;\n padding: 0.75rem 1rem;\n margin-bottom: 0;\n list-style: none;\n border-radius: var(--borderRadius);\n}";
|
|
433
|
+
var styles$F = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
434
|
+
styleInject(css_248z$F);
|
|
435
435
|
|
|
436
436
|
const Breadcrumb = (props) => {
|
|
437
437
|
const { children, className } = props;
|
|
438
438
|
const getCssClasses = () => {
|
|
439
439
|
const cssClasses = [];
|
|
440
|
-
cssClasses.push(styles$
|
|
440
|
+
cssClasses.push(styles$F.breadcrumb);
|
|
441
441
|
className && cssClasses.push(className);
|
|
442
442
|
return cssClasses.filter(css => css).join(' ');
|
|
443
443
|
};
|
|
@@ -447,15 +447,15 @@ const Breadcrumb = (props) => {
|
|
|
447
447
|
|
|
448
448
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
449
449
|
|
|
450
|
-
var css_248z$
|
|
451
|
-
var styles$
|
|
452
|
-
styleInject(css_248z$
|
|
450
|
+
var css_248z$E = ".BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D {\n padding-left: 0.5rem;\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D + .BreadcrumbItem-module_breadcrumbItem__1yy-D::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\";\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D a:not([href]):not([class]) {\n color: var(--primary);\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D:hover {\n cursor: pointer;\n}\n.BreadcrumbItem-module_breadcrumbItem__1yy-D.BreadcrumbItem-module_active__3iVU2:hover {\n cursor: unset;\n}";
|
|
451
|
+
var styles$E = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
452
|
+
styleInject(css_248z$E);
|
|
453
453
|
|
|
454
454
|
const BreadcrumbItem = (props) => {
|
|
455
455
|
const { children, className, isActive, onClick } = props;
|
|
456
456
|
const getCssClasses = () => {
|
|
457
457
|
const cssClasses = [];
|
|
458
|
-
cssClasses.push(styles$
|
|
458
|
+
cssClasses.push(styles$E.breadcrumbItem);
|
|
459
459
|
className && cssClasses.push(className);
|
|
460
460
|
isActive && cssClasses.push('active');
|
|
461
461
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -469,106 +469,106 @@ const BreadcrumbItem = (props) => {
|
|
|
469
469
|
wrapper: label => React.createElement("a", null, label) }, children)));
|
|
470
470
|
};
|
|
471
471
|
|
|
472
|
-
var css_248z$
|
|
473
|
-
var styles$
|
|
474
|
-
styleInject(css_248z$
|
|
472
|
+
var css_248z$D = ".Card-module_card__31o3Z {\n background: var(--white);\n border-radius: var(--borderRadius);\n}\n.Card-module_card__31o3Z.Card-module_shadow__2lpYq {\n box-shadow: var(--shadow);\n}";
|
|
473
|
+
var styles$D = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
474
|
+
styleInject(css_248z$D);
|
|
475
475
|
|
|
476
476
|
const Card = (props) => {
|
|
477
477
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
478
478
|
const getCssClasses = () => {
|
|
479
479
|
const cssClasses = [];
|
|
480
|
-
cssClasses.push(styles$
|
|
481
|
-
shadow && cssClasses.push(styles$
|
|
480
|
+
cssClasses.push(styles$D.card);
|
|
481
|
+
shadow && cssClasses.push(styles$D.shadow);
|
|
482
482
|
className && cssClasses.push(className);
|
|
483
483
|
return cssClasses.filter(css => css).join(' ');
|
|
484
484
|
};
|
|
485
485
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
486
486
|
};
|
|
487
487
|
|
|
488
|
-
var css_248z$
|
|
489
|
-
var styles$
|
|
490
|
-
styleInject(css_248z$
|
|
488
|
+
var css_248z$C = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
489
|
+
var styles$C = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
490
|
+
styleInject(css_248z$C);
|
|
491
491
|
|
|
492
492
|
const CardBody = (props) => {
|
|
493
493
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
494
494
|
const getCssClasses = () => {
|
|
495
495
|
const cssClasses = [];
|
|
496
|
-
cssClasses.push(styles$
|
|
496
|
+
cssClasses.push(styles$C.cardBody);
|
|
497
497
|
className && cssClasses.push(className);
|
|
498
498
|
return cssClasses.filter(css => css).join(' ');
|
|
499
499
|
};
|
|
500
500
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
501
501
|
};
|
|
502
502
|
|
|
503
|
-
var css_248z$
|
|
504
|
-
var styles$
|
|
505
|
-
styleInject(css_248z$
|
|
503
|
+
var css_248z$B = ".CardFooter-module_cardFooter__3dYKa {\n padding: 0.75rem 1.25rem;\n background-color: rgba(0, 0, 0, 0.03);\n border-top: 1px solid rgba(0, 0, 0, 0.125);\n}\n.CardFooter-module_cardFooter__3dYKa:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);\n}";
|
|
504
|
+
var styles$B = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
505
|
+
styleInject(css_248z$B);
|
|
506
506
|
|
|
507
507
|
const CardFooter = (props) => {
|
|
508
508
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
509
509
|
const getCssClasses = () => {
|
|
510
510
|
const cssClasses = [];
|
|
511
|
-
cssClasses.push(styles$
|
|
511
|
+
cssClasses.push(styles$B.cardFooter);
|
|
512
512
|
className && cssClasses.push(className);
|
|
513
513
|
return cssClasses.filter(css => css).join(' ');
|
|
514
514
|
};
|
|
515
515
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
516
516
|
};
|
|
517
517
|
|
|
518
|
-
var css_248z$
|
|
519
|
-
var styles$
|
|
520
|
-
styleInject(css_248z$
|
|
518
|
+
var css_248z$A = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important;\n}";
|
|
519
|
+
var styles$A = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
520
|
+
styleInject(css_248z$A);
|
|
521
521
|
|
|
522
522
|
const CardSubtitle = (props) => {
|
|
523
523
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
524
524
|
const getCssClasses = () => {
|
|
525
525
|
const cssClasses = [];
|
|
526
|
-
cssClasses.push(styles$
|
|
526
|
+
cssClasses.push(styles$A.cardSubtitle);
|
|
527
527
|
className && cssClasses.push(className);
|
|
528
528
|
return cssClasses.filter(css => css).join(' ');
|
|
529
529
|
};
|
|
530
530
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
531
531
|
};
|
|
532
532
|
|
|
533
|
-
var css_248z$
|
|
534
|
-
var styles$
|
|
535
|
-
styleInject(css_248z$
|
|
533
|
+
var css_248z$z = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0;\n}";
|
|
534
|
+
var styles$z = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
535
|
+
styleInject(css_248z$z);
|
|
536
536
|
|
|
537
537
|
const CardText = (props) => {
|
|
538
538
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
539
539
|
const getCssClasses = () => {
|
|
540
540
|
const cssClasses = [];
|
|
541
|
-
cssClasses.push(styles$
|
|
541
|
+
cssClasses.push(styles$z.cardText);
|
|
542
542
|
className && cssClasses.push(className);
|
|
543
543
|
return cssClasses.filter(css => css).join(' ');
|
|
544
544
|
};
|
|
545
545
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
546
546
|
};
|
|
547
547
|
|
|
548
|
-
var css_248z$
|
|
549
|
-
var styles$
|
|
550
|
-
styleInject(css_248z$
|
|
548
|
+
var css_248z$y = ".CardTitle-module_cardTitle__24Amb {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em;\n}";
|
|
549
|
+
var styles$y = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
550
|
+
styleInject(css_248z$y);
|
|
551
551
|
|
|
552
552
|
const CardTitle = (props) => {
|
|
553
553
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
554
554
|
const getCssClasses = () => {
|
|
555
555
|
const cssClasses = [];
|
|
556
|
-
cssClasses.push(styles$
|
|
556
|
+
cssClasses.push(styles$y.cardTitle);
|
|
557
557
|
className && cssClasses.push(className);
|
|
558
558
|
return cssClasses.filter(css => css).join(' ');
|
|
559
559
|
};
|
|
560
560
|
return (React.createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
561
561
|
};
|
|
562
562
|
|
|
563
|
-
var css_248z$
|
|
564
|
-
var styles$
|
|
565
|
-
styleInject(css_248z$
|
|
563
|
+
var css_248z$x = ".CardImage-module_cardImage__1tZM4 {\n flex-shrink: 0;\n width: 100%;\n border-top-left-radius: calc(0.25rem - 1px);\n border-top-right-radius: calc(0.25rem - 1px);\n}";
|
|
564
|
+
var styles$x = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
565
|
+
styleInject(css_248z$x);
|
|
566
566
|
|
|
567
567
|
const CardImage = (props) => {
|
|
568
568
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
569
569
|
const getCssClasses = () => {
|
|
570
570
|
const cssClasses = [];
|
|
571
|
-
cssClasses.push(styles$
|
|
571
|
+
cssClasses.push(styles$x.cardImage);
|
|
572
572
|
className && cssClasses.push(className);
|
|
573
573
|
return cssClasses.filter(css => css).join(' ');
|
|
574
574
|
};
|
|
@@ -617,15 +617,15 @@ const CircleSolidIcon = () => (React.createElement("svg", { "aria-hidden": "true
|
|
|
617
617
|
const ChevronLeftSolidIcon = () => (React.createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
618
618
|
React.createElement("path", { fill: "currentColor", d: "M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z" })));
|
|
619
619
|
|
|
620
|
-
var css_248z$
|
|
621
|
-
var styles$
|
|
622
|
-
styleInject(css_248z$
|
|
620
|
+
var css_248z$w = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important;\n}";
|
|
621
|
+
var styles$w = {"typography":"Typography-module_typography__2bM6E"};
|
|
622
|
+
styleInject(css_248z$w);
|
|
623
623
|
|
|
624
624
|
const Wrapper = (props) => {
|
|
625
625
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
626
626
|
const getCssClasses = () => {
|
|
627
627
|
const cssClasses = [];
|
|
628
|
-
cssClasses.push(styles$
|
|
628
|
+
cssClasses.push(styles$w.typography);
|
|
629
629
|
className && cssClasses.push(className);
|
|
630
630
|
return cssClasses.filter(css => css).join(' ');
|
|
631
631
|
};
|
|
@@ -636,21 +636,21 @@ const Typography = (_a) => {
|
|
|
636
636
|
return (React.createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
637
637
|
};
|
|
638
638
|
|
|
639
|
-
var css_248z$
|
|
640
|
-
var styles$
|
|
641
|
-
styleInject(css_248z$
|
|
639
|
+
var css_248z$v = ".IconButton-module_iconButton__1xqrL {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none;\n}\n.IconButton-module_iconButton__1xqrL:hover {\n cursor: pointer;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_shadow__5U4-_ {\n box-shadow: var(--shadow);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_md__1lmDL {\n width: 48px;\n height: 48px;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_lg__1O2Uy {\n width: 56px;\n height: 56px;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG {\n padding: 0;\n background: transparent;\n color: inherit;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_active__2tJut {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T.IconButton-module_active__2tJut {\n color: var(--primary);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL.IconButton-module_active__2tJut {\n color: var(--secondary);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t.IconButton-module_active__2tJut {\n color: var(--accent);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD.IconButton-module_active__2tJut {\n color: var(--light);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_dark__1e6bR {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_disabled__3TgpF {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none;\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_active__2tJut {\n background-color: rgba(0, 0, 0, 0.04);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T {\n background-color: var(--primary);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T.IconButton-module_active__2tJut {\n background-color: var(--primary-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL {\n background-color: var(--secondary);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL.IconButton-module_active__2tJut {\n background-color: var(--secondary-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t {\n background-color: var(--accent);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t.IconButton-module_active__2tJut {\n background-color: var(--accent-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD {\n background-color: var(--light);\n color: var(--dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD.IconButton-module_active__2tJut {\n background-color: var(--light-dark);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR {\n background-color: var(--dark);\n color: var(--white);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR.IconButton-module_active__2tJut {\n background-color: var(--dark-light);\n}\n.IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_disabled__3TgpF {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none;\n}";
|
|
640
|
+
var styles$v = {"iconButton":"IconButton-module_iconButton__1xqrL","shadow":"IconButton-module_shadow__5U4-_","md":"IconButton-module_md__1lmDL","lg":"IconButton-module_lg__1O2Uy","text":"IconButton-module_text__33RrG","active":"IconButton-module_active__2tJut","primary":"IconButton-module_primary__qRw4T","secondary":"IconButton-module_secondary__1lzNL","accent":"IconButton-module_accent__exm5t","light":"IconButton-module_light__2nWhD","dark":"IconButton-module_dark__1e6bR","disabled":"IconButton-module_disabled__3TgpF","contained":"IconButton-module_contained__gWulJ"};
|
|
641
|
+
styleInject(css_248z$v);
|
|
642
642
|
|
|
643
643
|
const IconButton = (props) => {
|
|
644
644
|
const { children, icon, label, variant = VARIANT.text, color = COLOR.primary, size = SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "label", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
645
645
|
const getCssClasses = () => {
|
|
646
646
|
const cssClasses = [];
|
|
647
|
-
cssClasses.push(styles$
|
|
648
|
-
cssClasses.push(styles$
|
|
649
|
-
cssClasses.push(styles$
|
|
650
|
-
cssClasses.push(styles$
|
|
651
|
-
isActive && cssClasses.push(styles$
|
|
652
|
-
disabled && cssClasses.push(styles$
|
|
653
|
-
shadow && cssClasses.push(styles$
|
|
647
|
+
cssClasses.push(styles$v[color]);
|
|
648
|
+
cssClasses.push(styles$v[variant]);
|
|
649
|
+
cssClasses.push(styles$v[size]);
|
|
650
|
+
cssClasses.push(styles$v.iconButton);
|
|
651
|
+
isActive && cssClasses.push(styles$v.active);
|
|
652
|
+
disabled && cssClasses.push(styles$v.disabled);
|
|
653
|
+
shadow && cssClasses.push(styles$v.shadow);
|
|
654
654
|
className && cssClasses.push(className);
|
|
655
655
|
return cssClasses.filter(css => css).join(' ');
|
|
656
656
|
};
|
|
@@ -659,9 +659,9 @@ const IconButton = (props) => {
|
|
|
659
659
|
label && React.createElement(Typography, null, label)));
|
|
660
660
|
};
|
|
661
661
|
|
|
662
|
-
var css_248z$
|
|
663
|
-
var styles$
|
|
664
|
-
styleInject(css_248z$
|
|
662
|
+
var css_248z$u = ".Checkbox-module_checkboxContainer__2oWhu {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Checkbox-module_checkboxContainer__2oWhu label {\n margin-bottom: 0;\n margin-left: 0;\n}\n.Checkbox-module_checkboxContainer__2oWhu label:hover {\n cursor: pointer;\n}\n\n.Checkbox-module_checkboxLabel__27Y6U.Checkbox-module_disabled__3EXUd {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed;\n}";
|
|
663
|
+
var styles$u = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
664
|
+
styleInject(css_248z$u);
|
|
665
665
|
|
|
666
666
|
const Checkbox = (props) => {
|
|
667
667
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -696,24 +696,24 @@ const Checkbox = (props) => {
|
|
|
696
696
|
setIsChecked(!isChecked);
|
|
697
697
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
698
698
|
};
|
|
699
|
-
return (React.createElement("div", { className: styles$
|
|
699
|
+
return (React.createElement("div", { className: styles$u.checkboxContainer },
|
|
700
700
|
React.createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
701
|
-
React.createElement("label", { onClick: handleClick, className: styles$
|
|
701
|
+
React.createElement("label", { onClick: handleClick, className: styles$u.checkboxLabel + ' ' + (disabled ? styles$u['disabled'] : undefined) }, label),
|
|
702
702
|
React.createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
703
703
|
};
|
|
704
704
|
|
|
705
|
-
var css_248z$
|
|
706
|
-
var styles$
|
|
707
|
-
styleInject(css_248z$
|
|
705
|
+
var css_248z$t = ".Chip-module_chip__1cghp {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1;\n}\n.Chip-module_chip__1cghp svg {\n width: 18px;\n height: 18px;\n}\n.Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c {\n margin-left: 5px;\n}\n.Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c:hover {\n cursor: pointer;\n}\n.Chip-module_chip__1cghp.Chip-module_primary__198Dq {\n background: var(--primary);\n color: var(--primary-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_secondary__14H0b {\n background: var(--secondary);\n color: var(--secondary-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_accent__2LkWr {\n background: var(--accent);\n color: var(--accent-contrast-text);\n}\n.Chip-module_chip__1cghp.Chip-module_light__2zVYs {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Chip-module_chip__1cghp.Chip-module_dark__2Bg-S {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover {\n cursor: pointer;\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_primary__198Dq {\n background: var(--primary-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_secondary__14H0b {\n background: var(--secondary-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_accent__2LkWr {\n background: var(--accent-dark);\n}\n.Chip-module_chip__1cghp.Chip-module_shadow__3TYny {\n box-shadow: var(--shadow);\n}";
|
|
706
|
+
var styles$t = {"chip":"Chip-module_chip__1cghp","deleteIcon":"Chip-module_deleteIcon__34X9c","primary":"Chip-module_primary__198Dq","secondary":"Chip-module_secondary__14H0b","accent":"Chip-module_accent__2LkWr","light":"Chip-module_light__2zVYs","dark":"Chip-module_dark__2Bg-S","clickable":"Chip-module_clickable__2Y4x7","shadow":"Chip-module_shadow__3TYny"};
|
|
707
|
+
styleInject(css_248z$t);
|
|
708
708
|
|
|
709
709
|
const Chip = (props) => {
|
|
710
710
|
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React.createElement(TimesCircleSolidIcon, null), style } = props, rest = __rest(props, ["children", "color", "className", "shadow", "onClick", "isDeletable", "onDelete", "deleteIcon", "style"]);
|
|
711
711
|
const getCssClass = () => {
|
|
712
712
|
const cssClasses = [];
|
|
713
|
-
cssClasses.push(styles$
|
|
714
|
-
cssClasses.push(styles$
|
|
715
|
-
shadow && cssClasses.push(styles$
|
|
716
|
-
onClick && cssClasses.push(styles$
|
|
713
|
+
cssClasses.push(styles$t.chip);
|
|
714
|
+
cssClasses.push(styles$t[color]);
|
|
715
|
+
shadow && cssClasses.push(styles$t['shadow']);
|
|
716
|
+
onClick && cssClasses.push(styles$t['clickable']);
|
|
717
717
|
className && cssClasses.push(className);
|
|
718
718
|
return cssClasses.filter(r => r).join(' ');
|
|
719
719
|
};
|
|
@@ -723,7 +723,7 @@ const Chip = (props) => {
|
|
|
723
723
|
};
|
|
724
724
|
return (React.createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
725
725
|
React.createElement("div", null, children),
|
|
726
|
-
isDeletable && (React.createElement("div", { className: styles$
|
|
726
|
+
isDeletable && (React.createElement("div", { className: styles$t.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
727
727
|
};
|
|
728
728
|
|
|
729
729
|
const FormLabel = ({ children, className, htmlFor }) => (React.createElement("label", { htmlFor: htmlFor, className: className }, children));
|
|
@@ -759,9 +759,9 @@ const FileInput = (props) => {
|
|
|
759
759
|
React.createElement("input", Object.assign({ type: "file", ref: inputFileElement, className: getCssClasses(), id: id, name: name, multiple: multiple, accept: accept, disabled: disabled, readOnly: readOnly, hidden: true, onChange: handleOnChange, value: model }, rest))));
|
|
760
760
|
};
|
|
761
761
|
|
|
762
|
-
var css_248z$
|
|
763
|
-
var styles$
|
|
764
|
-
styleInject(css_248z$
|
|
762
|
+
var css_248z$s = ".Select-module_selectContainer__2oizY {\n position: relative;\n}\n\n.Select-module_select__MSqgU {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n}\n.Select-module_select__MSqgU:hover {\n cursor: pointer;\n}\n\n.Select-module_selectMenu__2vhJt {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 2px;\n z-index: 1112;\n max-height: 280px;\n overflow: auto;\n}";
|
|
763
|
+
var styles$s = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
764
|
+
styleInject(css_248z$s);
|
|
765
765
|
|
|
766
766
|
const Select = (props) => {
|
|
767
767
|
var _a, _b, _c;
|
|
@@ -774,7 +774,7 @@ const Select = (props) => {
|
|
|
774
774
|
const getCssClass = () => {
|
|
775
775
|
const cssClasses = [];
|
|
776
776
|
className && cssClasses.push(className);
|
|
777
|
-
cssClasses.push(styles$
|
|
777
|
+
cssClasses.push(styles$s.select);
|
|
778
778
|
return cssClasses.filter(r => r).join(' ');
|
|
779
779
|
};
|
|
780
780
|
useEffect(() => {
|
|
@@ -893,7 +893,7 @@ const Select = (props) => {
|
|
|
893
893
|
}
|
|
894
894
|
};
|
|
895
895
|
return (React.createElement(React.Fragment, null,
|
|
896
|
-
React.createElement("div", { ref: selectConainter, className: styles$
|
|
896
|
+
React.createElement("div", { ref: selectConainter, className: styles$s.selectContainer },
|
|
897
897
|
React.createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
898
898
|
!multiple && renderSingleViewModel(),
|
|
899
899
|
multiple && renderMultipleViewModel(),
|
|
@@ -901,7 +901,7 @@ const Select = (props) => {
|
|
|
901
901
|
React.createElement(ChevronDownSolidIcon, null))),
|
|
902
902
|
isShow &&
|
|
903
903
|
createPortal(React.createElement(React.Fragment, null,
|
|
904
|
-
React.createElement("div", { className: styles$
|
|
904
|
+
React.createElement("div", { className: styles$s.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
|
|
905
905
|
React.createElement(List, null, options && options.map((option, index) => React.createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), active: isActive(option) },
|
|
906
906
|
multiple &&
|
|
907
907
|
React.createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -909,15 +909,15 @@ const Select = (props) => {
|
|
|
909
909
|
React.createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
910
910
|
};
|
|
911
911
|
|
|
912
|
-
var css_248z$
|
|
913
|
-
var styles$
|
|
914
|
-
styleInject(css_248z$
|
|
912
|
+
var css_248z$r = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical;\n}\ntextarea:focus {\n outline: none !important;\n border-color: var(--primary);\n}";
|
|
913
|
+
var styles$r = {};
|
|
914
|
+
styleInject(css_248z$r);
|
|
915
915
|
|
|
916
916
|
const Textarea = (props) => {
|
|
917
917
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
918
918
|
const getCssClass = () => {
|
|
919
919
|
const cssClasses = [];
|
|
920
|
-
cssClasses.push(styles$
|
|
920
|
+
cssClasses.push(styles$r.textarea);
|
|
921
921
|
className && cssClasses.push(className);
|
|
922
922
|
return cssClasses.filter(r => r).join(' ');
|
|
923
923
|
};
|
|
@@ -1273,16 +1273,16 @@ const DateSelect = (props) => {
|
|
|
1273
1273
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1274
1274
|
// };
|
|
1275
1275
|
|
|
1276
|
-
var css_248z$
|
|
1277
|
-
var styles$
|
|
1278
|
-
styleInject(css_248z$
|
|
1276
|
+
var css_248z$q = ".Drawer-module_drawer__36R2P {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_permanent__AW5Df {\n position: inherit;\n z-index: 0;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_left__1KKcY {\n order: 0;\n}\n.Drawer-module_drawer__36R2P.Drawer-module_right__2gESb {\n order: 2;\n}\n\n.Drawer-module_drawerOpen__euFdW {\n overflow: hidden;\n}";
|
|
1277
|
+
var styles$q = {"drawer":"Drawer-module_drawer__36R2P","permanent":"Drawer-module_permanent__AW5Df","left":"Drawer-module_left__1KKcY","right":"Drawer-module_right__2gESb","drawerOpen":"Drawer-module_drawerOpen__euFdW"};
|
|
1278
|
+
styleInject(css_248z$q);
|
|
1279
1279
|
|
|
1280
1280
|
const Drawer = (props) => {
|
|
1281
1281
|
const { children, className, position = 'left', permanent = false, target = document.body, onClickBackdrop } = props;
|
|
1282
1282
|
useEffect(() => {
|
|
1283
|
-
document.body.classList.add(styles$
|
|
1283
|
+
document.body.classList.add(styles$q.drawerOpen);
|
|
1284
1284
|
return () => {
|
|
1285
|
-
document.body.classList.remove(styles$
|
|
1285
|
+
document.body.classList.remove(styles$q.drawerOpen);
|
|
1286
1286
|
};
|
|
1287
1287
|
}, []);
|
|
1288
1288
|
const handleClickBackdrop = () => {
|
|
@@ -1296,10 +1296,10 @@ const DrawerContent = (props) => {
|
|
|
1296
1296
|
const { children, className, position = 'left', permanent = false } = props;
|
|
1297
1297
|
const getCssClasses = () => {
|
|
1298
1298
|
const cssClasses = [];
|
|
1299
|
-
cssClasses.push(styles$
|
|
1299
|
+
cssClasses.push(styles$q.drawer);
|
|
1300
1300
|
className && cssClasses.push(className);
|
|
1301
|
-
!!permanent && cssClasses.push(styles$
|
|
1302
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1301
|
+
!!permanent && cssClasses.push(styles$q['permanent']);
|
|
1302
|
+
position === 'left' ? cssClasses.push(styles$q['left']) : cssClasses.push(styles$q['right']);
|
|
1303
1303
|
return cssClasses.filter(css => css).join(' ');
|
|
1304
1304
|
};
|
|
1305
1305
|
const positionStyles = {
|
|
@@ -1312,9 +1312,9 @@ const DrawerContent = (props) => {
|
|
|
1312
1312
|
return (React.createElement("div", { className: getCssClasses(), style: getStyles() }, children));
|
|
1313
1313
|
};
|
|
1314
1314
|
|
|
1315
|
-
var css_248z$
|
|
1316
|
-
var styles$
|
|
1317
|
-
styleInject(css_248z$
|
|
1315
|
+
var css_248z$p = ".MenuBody-module_menuBody__3cPsp {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius);\n}\n.MenuBody-module_menuBody__3cPsp.MenuBody-module_shadow__AF_9C {\n box-shadow: var(--shadow);\n}";
|
|
1316
|
+
var styles$p = {"menuBody":"MenuBody-module_menuBody__3cPsp","shadow":"MenuBody-module_shadow__AF_9C"};
|
|
1317
|
+
styleInject(css_248z$p);
|
|
1318
1318
|
|
|
1319
1319
|
const MenuBody = (props) => {
|
|
1320
1320
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1344,8 +1344,8 @@ const MenuBody = (props) => {
|
|
|
1344
1344
|
}, [menuBodyRef]);
|
|
1345
1345
|
const getCssClasses = () => {
|
|
1346
1346
|
const cssClasses = [];
|
|
1347
|
-
cssClasses.push(styles$
|
|
1348
|
-
shadow && cssClasses.push(styles$
|
|
1347
|
+
cssClasses.push(styles$p.menuBody);
|
|
1348
|
+
shadow && cssClasses.push(styles$p.shadow);
|
|
1349
1349
|
className && cssClasses.push(className);
|
|
1350
1350
|
return cssClasses.filter(css => css).join(' ');
|
|
1351
1351
|
};
|
|
@@ -1357,9 +1357,9 @@ const MenuBody = (props) => {
|
|
|
1357
1357
|
React.createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1358
1358
|
};
|
|
1359
1359
|
|
|
1360
|
-
var css_248z$
|
|
1361
|
-
var styles$
|
|
1362
|
-
styleInject(css_248z$
|
|
1360
|
+
var css_248z$o = ".Menu-module_menu__23BYG {\n display: flex;\n}";
|
|
1361
|
+
var styles$o = {"menu":"Menu-module_menu__23BYG"};
|
|
1362
|
+
styleInject(css_248z$o);
|
|
1363
1363
|
|
|
1364
1364
|
const Menu = (props) => {
|
|
1365
1365
|
const { toggle, children, className, open, menuPosition, onClickBackdrop, onToggleClick } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop", "onToggleClick"]);
|
|
@@ -1367,7 +1367,7 @@ const Menu = (props) => {
|
|
|
1367
1367
|
const toggleContainerRef = useRef(null);
|
|
1368
1368
|
const getCssClasses = () => {
|
|
1369
1369
|
const cssClasses = [];
|
|
1370
|
-
cssClasses.push(styles$
|
|
1370
|
+
cssClasses.push(styles$o.menu);
|
|
1371
1371
|
className && cssClasses.push(className);
|
|
1372
1372
|
return cssClasses.filter(css => css).join(' ');
|
|
1373
1373
|
};
|
|
@@ -1380,17 +1380,17 @@ const Menu = (props) => {
|
|
|
1380
1380
|
React.createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1381
1381
|
};
|
|
1382
1382
|
|
|
1383
|
-
var css_248z$
|
|
1384
|
-
var styles$
|
|
1385
|
-
styleInject(css_248z$
|
|
1383
|
+
var css_248z$n = ".MenuItem-module_menuItem__kvauR {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0;\n}\n.MenuItem-module_menuItem__kvauR.MenuItem-module_menuItemHeader__mp7wc {\n margin-bottom: 0;\n font-size: 0.875rem;\n}\n.MenuItem-module_menuItem__kvauR:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04);\n}";
|
|
1384
|
+
var styles$n = {"menuItem":"MenuItem-module_menuItem__kvauR","menuItemHeader":"MenuItem-module_menuItemHeader__mp7wc"};
|
|
1385
|
+
styleInject(css_248z$n);
|
|
1386
1386
|
|
|
1387
1387
|
const MenuItem = (props) => {
|
|
1388
1388
|
const { children, onClick, type = 'item' } = props;
|
|
1389
1389
|
const getCssClasses = () => {
|
|
1390
1390
|
const cssClasses = [];
|
|
1391
|
-
cssClasses.push(styles$
|
|
1391
|
+
cssClasses.push(styles$n.menuItem);
|
|
1392
1392
|
if (type === 'header') {
|
|
1393
|
-
cssClasses.push(styles$
|
|
1393
|
+
cssClasses.push(styles$n.menuItemHeader);
|
|
1394
1394
|
}
|
|
1395
1395
|
return cssClasses.filter(css => css).join(' ');
|
|
1396
1396
|
};
|
|
@@ -1408,23 +1408,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1408
1408
|
return (React.createElement(Fragment, null, children));
|
|
1409
1409
|
};
|
|
1410
1410
|
|
|
1411
|
-
var css_248z$
|
|
1412
|
-
var styles$
|
|
1413
|
-
styleInject(css_248z$
|
|
1411
|
+
var css_248z$m = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef;\n}";
|
|
1412
|
+
var styles$m = {"menuItemDivider":"MenuDivider-module_menuItemDivider__JnLsC"};
|
|
1413
|
+
styleInject(css_248z$m);
|
|
1414
1414
|
|
|
1415
|
-
const MenuDivider = () => React.createElement("div", { className: styles$
|
|
1415
|
+
const MenuDivider = () => React.createElement("div", { className: styles$m.menuItemDivider });
|
|
1416
1416
|
|
|
1417
|
-
var css_248z$
|
|
1418
|
-
var styles$
|
|
1419
|
-
styleInject(css_248z$
|
|
1417
|
+
var css_248z$l = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px;\n}";
|
|
1418
|
+
var styles$l = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__3H62L"};
|
|
1419
|
+
styleInject(css_248z$l);
|
|
1420
1420
|
|
|
1421
1421
|
const ExpansionPanelContent = ({ children }) => {
|
|
1422
|
-
return (React.createElement("div", { className: styles$
|
|
1422
|
+
return (React.createElement("div", { className: styles$l.expansionPanelContent }, children));
|
|
1423
1423
|
};
|
|
1424
1424
|
|
|
1425
|
-
var css_248z$
|
|
1426
|
-
var styles$
|
|
1427
|
-
styleInject(css_248z$
|
|
1425
|
+
var css_248z$k = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px;\n}\n.ExpansionPanelHeader-module_expansionPanelHeader__3hrsI:hover {\n cursor: pointer;\n background-color: var(--highlight);\n}";
|
|
1426
|
+
var styles$k = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__3hrsI"};
|
|
1427
|
+
styleInject(css_248z$k);
|
|
1428
1428
|
|
|
1429
1429
|
const ExpansionPanelHeader = (props) => {
|
|
1430
1430
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1432,15 +1432,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1432
1432
|
e.stopPropagation();
|
|
1433
1433
|
onClick && onClick(e);
|
|
1434
1434
|
};
|
|
1435
|
-
return (React.createElement("div", { className: styles$
|
|
1435
|
+
return (React.createElement("div", { className: styles$k.expansionPanelHeader, onClick: handleClick },
|
|
1436
1436
|
children,
|
|
1437
1437
|
React.createElement("span", { className: "ml-auto text-muted" },
|
|
1438
1438
|
React.createElement(Icon, null, isExpanded ? React.createElement(ChevronUpSolidIcon, null) : React.createElement(ChevronDownSolidIcon, null)))));
|
|
1439
1439
|
};
|
|
1440
1440
|
|
|
1441
|
-
var css_248z$
|
|
1442
|
-
var styles$
|
|
1443
|
-
styleInject(css_248z$
|
|
1441
|
+
var css_248z$j = ".ExpansionPanel-module_expansionPanel__3krcE {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n}\n.ExpansionPanel-module_expansionPanel__3krcE:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__3krcE:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt {\n margin: 16px 0;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:first-child {\n margin-top: 0;\n}\n.ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:last-child {\n margin-bottom: 0;\n}";
|
|
1442
|
+
var styles$j = {"expansionPanel":"ExpansionPanel-module_expansionPanel__3krcE","isExpanded":"ExpansionPanel-module_isExpanded__1m4Dt"};
|
|
1443
|
+
styleInject(css_248z$j);
|
|
1444
1444
|
|
|
1445
1445
|
const ExpansionPanel = (props) => {
|
|
1446
1446
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1450,9 +1450,9 @@ const ExpansionPanel = (props) => {
|
|
|
1450
1450
|
}, [isExpanded]);
|
|
1451
1451
|
const getCssClasses = () => {
|
|
1452
1452
|
const cssClasses = [];
|
|
1453
|
-
cssClasses.push(styles$
|
|
1453
|
+
cssClasses.push(styles$j.expansionPanel);
|
|
1454
1454
|
if (_isExpanded) {
|
|
1455
|
-
cssClasses.push(styles$
|
|
1455
|
+
cssClasses.push(styles$j.isExpanded);
|
|
1456
1456
|
}
|
|
1457
1457
|
return cssClasses.filter(css => css).join(' ');
|
|
1458
1458
|
};
|
|
@@ -1466,16 +1466,16 @@ const ExpansionPanel = (props) => {
|
|
|
1466
1466
|
React.createElement(ExpansionPanelContent, null, children)));
|
|
1467
1467
|
};
|
|
1468
1468
|
|
|
1469
|
-
var css_248z$
|
|
1470
|
-
var styles$
|
|
1471
|
-
styleInject(css_248z$
|
|
1469
|
+
var css_248z$i = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow);\n}\n.FloatingActionButton-module_fab__3GwiH.FloatingActionButton-module_fixed__17qrv {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000;\n}";
|
|
1470
|
+
var styles$i = {"fab":"FloatingActionButton-module_fab__3GwiH","fixed":"FloatingActionButton-module_fixed__17qrv"};
|
|
1471
|
+
styleInject(css_248z$i);
|
|
1472
1472
|
|
|
1473
1473
|
const FloatingActionButton = (props) => {
|
|
1474
1474
|
const { className, icon, color = COLOR.primary, fixed, size = SIZE.lg, isActive, disabled, onClick } = props;
|
|
1475
1475
|
const getCssClasses = () => {
|
|
1476
1476
|
const cssClasses = [];
|
|
1477
|
-
cssClasses.push(styles$
|
|
1478
|
-
fixed && cssClasses.push(styles$
|
|
1477
|
+
cssClasses.push(styles$i.fab);
|
|
1478
|
+
fixed && cssClasses.push(styles$i['fixed']);
|
|
1479
1479
|
className && cssClasses.push(className);
|
|
1480
1480
|
return cssClasses.filter(css => css).join(' ');
|
|
1481
1481
|
};
|
|
@@ -1537,14 +1537,14 @@ const Link = (props) => {
|
|
|
1537
1537
|
return (React.createElement("a", { className: getCssClasses(), href: url || '#', target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, children));
|
|
1538
1538
|
};
|
|
1539
1539
|
|
|
1540
|
-
var css_248z$
|
|
1541
|
-
var styles$
|
|
1542
|
-
styleInject(css_248z$
|
|
1540
|
+
var css_248z$h = ".LoadingIndicator-module_loadingIndicatorContainer__3e1-3 {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n\n.LoadingIndicator-module_loadingIndicator__tvp5i {\n animation-name: LoadingIndicator-module_spinAnimation__PKRNn;\n animation-duration: 5000ms;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n width: 24px;\n height: 24px;\n}\n\n@keyframes LoadingIndicator-module_spinAnimation__PKRNn {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}";
|
|
1541
|
+
var styles$h = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__3e1-3","loadingIndicator":"LoadingIndicator-module_loadingIndicator__tvp5i","spinAnimation":"LoadingIndicator-module_spinAnimation__PKRNn"};
|
|
1542
|
+
styleInject(css_248z$h);
|
|
1543
1543
|
|
|
1544
1544
|
const LoadingIndicator = () => {
|
|
1545
1545
|
const getCssClasses = () => {
|
|
1546
1546
|
const cssClasses = [];
|
|
1547
|
-
cssClasses.push(styles$
|
|
1547
|
+
cssClasses.push(styles$h.loadingIndicator);
|
|
1548
1548
|
return cssClasses.filter(css => css).join(' ');
|
|
1549
1549
|
};
|
|
1550
1550
|
return (React.createElement("div", { className: getCssClasses() },
|
|
@@ -1554,7 +1554,7 @@ const LoadingIndicator = () => {
|
|
|
1554
1554
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1555
1555
|
const getCssClasses = () => {
|
|
1556
1556
|
const cssClasses = [];
|
|
1557
|
-
cssClasses.push(styles$
|
|
1557
|
+
cssClasses.push(styles$h.loadingIndicatorContainer);
|
|
1558
1558
|
return cssClasses.filter(css => css).join(' ');
|
|
1559
1559
|
};
|
|
1560
1560
|
return (React.createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1584,16 +1584,16 @@ class LoadingIndicatorService {
|
|
|
1584
1584
|
}
|
|
1585
1585
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1586
1586
|
|
|
1587
|
-
var css_248z$
|
|
1588
|
-
var styles$
|
|
1589
|
-
styleInject(css_248z$
|
|
1587
|
+
var css_248z$g = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center;\n}";
|
|
1588
|
+
var styles$g = {"modalHeader":"ModalHeader-module_modalHeader__o5HzE"};
|
|
1589
|
+
styleInject(css_248z$g);
|
|
1590
1590
|
|
|
1591
1591
|
const ModalHeader = (props) => {
|
|
1592
1592
|
const { children, isDismissable = false, onClose } = props;
|
|
1593
1593
|
const handleClick = () => {
|
|
1594
1594
|
onClose && onClose();
|
|
1595
1595
|
};
|
|
1596
|
-
return (React.createElement("div", { className: "modal-header " + styles$
|
|
1596
|
+
return (React.createElement("div", { className: "modal-header " + styles$g.modalHeader },
|
|
1597
1597
|
React.createElement("h5", { className: "modal-title" }, children),
|
|
1598
1598
|
isDismissable &&
|
|
1599
1599
|
React.createElement(IconButton, { icon: React.createElement(TimesSolidIcon, null), variant: VARIANT.text, onClick: handleClick })));
|
|
@@ -1601,24 +1601,24 @@ const ModalHeader = (props) => {
|
|
|
1601
1601
|
|
|
1602
1602
|
const ModalBody = ({ children }) => (React.createElement("div", { className: "modal-body" }, children));
|
|
1603
1603
|
|
|
1604
|
-
var css_248z$
|
|
1605
|
-
var styles$
|
|
1606
|
-
styleInject(css_248z$
|
|
1604
|
+
var css_248z$f = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius);\n}\n.Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0;\n}\n.Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM .Modal-module_modalContent__E2kaP {\n height: auto;\n min-height: 100%;\n max-height: 100%;\n border-radius: 0;\n overflow: auto;\n}\n@media (min-width: 320px) {\n .Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n max-width: 100% !important;\n }\n}\n.Modal-module_modal__1NdMJ .Modal-module_sm__3UfYB {\n max-width: 300px;\n}\n.Modal-module_modal__1NdMJ .Modal-module_md__2uX1a {\n max-width: 500px;\n}\n.Modal-module_modal__1NdMJ .Modal-module_lg__3ux_V {\n max-width: 1140px;\n}\n@media (min-width: 576px) {\n .Modal-module_modal__1NdMJ .Modal-module_modal-dialog__IdJ1c {\n max-width: 600px;\n }\n}";
|
|
1605
|
+
var styles$f = {"modal":"Modal-module_modal__1NdMJ","fullscreen":"Modal-module_fullscreen__3R-sM","modalContent":"Modal-module_modalContent__E2kaP","sm":"Modal-module_sm__3UfYB","md":"Modal-module_md__2uX1a","lg":"Modal-module_lg__3ux_V","modal-dialog":"Modal-module_modal-dialog__IdJ1c"};
|
|
1606
|
+
styleInject(css_248z$f);
|
|
1607
1607
|
|
|
1608
|
-
var css_248z$
|
|
1609
|
-
var styles$
|
|
1610
|
-
styleInject(css_248z$
|
|
1608
|
+
var css_248z$e = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none;\n}";
|
|
1609
|
+
var styles$e = {"modalFooter":"ModalFooter-module_modalFooter__2Et4e"};
|
|
1610
|
+
styleInject(css_248z$e);
|
|
1611
1611
|
|
|
1612
|
-
const ModalFooter = ({ children }) => (React.createElement("div", { className: "modal-footer " + styles$
|
|
1612
|
+
const ModalFooter = ({ children }) => (React.createElement("div", { className: "modal-footer " + styles$e.modalFooter }, children));
|
|
1613
1613
|
|
|
1614
1614
|
const Modal = (props) => {
|
|
1615
1615
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1616
1616
|
const getCssClass = () => {
|
|
1617
1617
|
const cssClasses = [];
|
|
1618
1618
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1619
|
-
cssClasses.push(styles$
|
|
1620
|
-
!!fullScreen && cssClasses.push(styles$
|
|
1621
|
-
size && cssClasses.push(styles$
|
|
1619
|
+
cssClasses.push(styles$f.modal);
|
|
1620
|
+
!!fullScreen && cssClasses.push(styles$f['fullscreen']);
|
|
1621
|
+
size && cssClasses.push(styles$f[size]);
|
|
1622
1622
|
className && cssClasses.push(className);
|
|
1623
1623
|
return cssClasses.filter(r => r).join(' ');
|
|
1624
1624
|
};
|
|
@@ -1632,9 +1632,9 @@ const Modal = (props) => {
|
|
|
1632
1632
|
onBackdropClick && onBackdropClick();
|
|
1633
1633
|
};
|
|
1634
1634
|
return (React.createElement(Fragment, null,
|
|
1635
|
-
React.createElement("div", { className: "modal show " + styles$
|
|
1635
|
+
React.createElement("div", { className: "modal show " + styles$f.modal, style: { display: 'block' } },
|
|
1636
1636
|
React.createElement("div", { className: getCssClass() },
|
|
1637
|
-
React.createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$
|
|
1637
|
+
React.createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$f['modalContent'] : undefined) },
|
|
1638
1638
|
header &&
|
|
1639
1639
|
React.createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1640
1640
|
React.createElement(ModalBody, null, children),
|
|
@@ -1834,25 +1834,25 @@ const Sidebar = (props) => {
|
|
|
1834
1834
|
!item.isCollapsed && item.items && item.items.length > 0 && (React.createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React.createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
|
|
1835
1835
|
};
|
|
1836
1836
|
|
|
1837
|
-
var css_248z$
|
|
1838
|
-
var styles$
|
|
1839
|
-
styleInject(css_248z$
|
|
1837
|
+
var css_248z$d = ".Snackbar-module_snackbar__3AF3D {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__11jAv 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_primary__3Pt9m {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_accent__1iCXk {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_secondary__3ke12 {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_light__3Pi0Y {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Snackbar-module_snackbar__3AF3D.Snackbar-module_dark__3TwXn {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n\n.Snackbar-module_text__2gmW- {\n width: 100%;\n padding: 8px 0;\n}\n\n.Snackbar-module_action__1BXqS {\n margin-left: auto;\n}\n.Snackbar-module_action__1BXqS:hover {\n cursor: pointer;\n}\n\n@keyframes Snackbar-module_bounceIn__11jAv {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0.9;\n }\n 80% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n }\n}";
|
|
1838
|
+
var styles$d = {"snackbar":"Snackbar-module_snackbar__3AF3D","bounceIn":"Snackbar-module_bounceIn__11jAv","primary":"Snackbar-module_primary__3Pt9m","accent":"Snackbar-module_accent__1iCXk","secondary":"Snackbar-module_secondary__3ke12","light":"Snackbar-module_light__3Pi0Y","dark":"Snackbar-module_dark__3TwXn","text":"Snackbar-module_text__2gmW-","action":"Snackbar-module_action__1BXqS"};
|
|
1839
|
+
styleInject(css_248z$d);
|
|
1840
1840
|
|
|
1841
1841
|
const Snackbar = (props) => {
|
|
1842
1842
|
const { message, color = COLOR.dark, actionText = 'ok', onOk } = props;
|
|
1843
1843
|
const getCssClasses = () => {
|
|
1844
1844
|
const cssClasses = [];
|
|
1845
|
-
cssClasses.push(styles$
|
|
1845
|
+
cssClasses.push(styles$d.snackbar);
|
|
1846
1846
|
cssClasses.push(`shadow-lg`);
|
|
1847
|
-
cssClasses.push(styles$
|
|
1847
|
+
cssClasses.push(styles$d[color]);
|
|
1848
1848
|
return cssClasses.filter(css => css).join(' ');
|
|
1849
1849
|
};
|
|
1850
1850
|
const handleClickAction = () => {
|
|
1851
1851
|
onOk && onOk();
|
|
1852
1852
|
};
|
|
1853
1853
|
return (React.createElement("div", { className: getCssClasses() },
|
|
1854
|
-
React.createElement("div", { className: styles$
|
|
1855
|
-
React.createElement("div", { className: styles$
|
|
1854
|
+
React.createElement("div", { className: styles$d.text }, message),
|
|
1855
|
+
React.createElement("div", { className: styles$d.action + " text-accent", onClick: handleClickAction },
|
|
1856
1856
|
React.createElement("span", null, actionText))));
|
|
1857
1857
|
};
|
|
1858
1858
|
|
|
@@ -1890,29 +1890,29 @@ class SnackbarService {
|
|
|
1890
1890
|
}
|
|
1891
1891
|
const snackbarService = new SnackbarService();
|
|
1892
1892
|
|
|
1893
|
-
var css_248z$
|
|
1894
|
-
var styles$
|
|
1895
|
-
styleInject(css_248z$
|
|
1893
|
+
var css_248z$c = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto;\n}";
|
|
1894
|
+
var styles$c = {"speedDialActions":"SpeedDialActions-module_speedDialActions__zLEps"};
|
|
1895
|
+
styleInject(css_248z$c);
|
|
1896
1896
|
|
|
1897
1897
|
const SpeedDialActions = (props) => {
|
|
1898
1898
|
const { children } = props;
|
|
1899
1899
|
const getCssClasses = () => {
|
|
1900
1900
|
const cssClasses = [];
|
|
1901
|
-
cssClasses.push(styles$
|
|
1901
|
+
cssClasses.push(styles$c.speedDialActions);
|
|
1902
1902
|
return cssClasses.filter(css => css).join(' ');
|
|
1903
1903
|
};
|
|
1904
1904
|
return (React.createElement("div", { className: getCssClasses() }, children));
|
|
1905
1905
|
};
|
|
1906
1906
|
|
|
1907
|
-
var css_248z$
|
|
1908
|
-
var styles$
|
|
1909
|
-
styleInject(css_248z$
|
|
1907
|
+
var css_248z$b = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
|
|
1908
|
+
var styles$b = {"speedDial":"SpeedDial-module_speedDial__CQ5x2"};
|
|
1909
|
+
styleInject(css_248z$b);
|
|
1910
1910
|
|
|
1911
1911
|
const SpeedDial = (props) => {
|
|
1912
1912
|
const { children, className, open, onOpen, onClose } = props, rest = __rest(props, ["children", "className", "open", "onOpen", "onClose"]);
|
|
1913
1913
|
const getCssClasses = () => {
|
|
1914
1914
|
const cssClasses = [];
|
|
1915
|
-
cssClasses.push(styles$
|
|
1915
|
+
cssClasses.push(styles$b.speedDial);
|
|
1916
1916
|
className && cssClasses.push(className);
|
|
1917
1917
|
return cssClasses.filter(css => css).join(' ');
|
|
1918
1918
|
};
|
|
@@ -1929,15 +1929,15 @@ const SpeedDial = (props) => {
|
|
|
1929
1929
|
React.createElement(SpeedDialActions, null, children)));
|
|
1930
1930
|
};
|
|
1931
1931
|
|
|
1932
|
-
var css_248z$
|
|
1933
|
-
var styles$
|
|
1934
|
-
styleInject(css_248z$
|
|
1932
|
+
var css_248z$a = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px;\n}";
|
|
1933
|
+
var styles$a = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs"};
|
|
1934
|
+
styleInject(css_248z$a);
|
|
1935
1935
|
|
|
1936
1936
|
const SpeedDialAction = (props) => {
|
|
1937
1937
|
const { icon, onClick, className } = props;
|
|
1938
1938
|
const getCssClasses = () => {
|
|
1939
1939
|
const cssClasses = [];
|
|
1940
|
-
cssClasses.push(styles$
|
|
1940
|
+
cssClasses.push(styles$a.speedDialAction);
|
|
1941
1941
|
className && cssClasses.push(className);
|
|
1942
1942
|
return cssClasses.filter(css => css).join(' ');
|
|
1943
1943
|
};
|
|
@@ -1954,15 +1954,15 @@ const SpeedDialIcon = (props) => {
|
|
|
1954
1954
|
return (React.createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
1955
1955
|
};
|
|
1956
1956
|
|
|
1957
|
-
var css_248z$
|
|
1958
|
-
var styles$
|
|
1959
|
-
styleInject(css_248z$
|
|
1957
|
+
var css_248z$9 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex;\n}";
|
|
1958
|
+
var styles$9 = {"stepperActions":"StepperActions-module_stepperActions__2r5ZT"};
|
|
1959
|
+
styleInject(css_248z$9);
|
|
1960
1960
|
|
|
1961
1961
|
const StepperActions = (props) => {
|
|
1962
1962
|
const { className, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
|
|
1963
1963
|
const getCssClasses = () => {
|
|
1964
1964
|
const cssClasses = [];
|
|
1965
|
-
cssClasses.push(styles$
|
|
1965
|
+
cssClasses.push(styles$9.stepperActions);
|
|
1966
1966
|
className && cssClasses.push(className);
|
|
1967
1967
|
return cssClasses.filter(css => css).join(' ');
|
|
1968
1968
|
};
|
|
@@ -1979,31 +1979,31 @@ const StepPanel = (props) => {
|
|
|
1979
1979
|
return (React.createElement("div", { className: "steppanel" }, children));
|
|
1980
1980
|
};
|
|
1981
1981
|
|
|
1982
|
-
var css_248z$
|
|
1983
|
-
var styles$
|
|
1984
|
-
styleInject(css_248z$
|
|
1982
|
+
var css_248z$8 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px;\n}\n\n.StepConnector-module_stepConnectorLine__jSqG4 {\n display: block;\n border-color: var(--secondary);\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.StepConnector-module_stepConnectorLine__jSqG4.StepConnector-module_isActive__3Yj6N {\n border-color: var(--primary);\n}\n\n.StepConnector-module_stepConnectorLineHorizontal__3R2R8 {\n border-top-style: solid;\n border-top-width: 1px;\n}";
|
|
1983
|
+
var styles$8 = {"stepConnector":"StepConnector-module_stepConnector__2m7Xp","stepConnectorLine":"StepConnector-module_stepConnectorLine__jSqG4","isActive":"StepConnector-module_isActive__3Yj6N","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__3R2R8"};
|
|
1984
|
+
styleInject(css_248z$8);
|
|
1985
1985
|
|
|
1986
1986
|
const StepConnector = (props) => {
|
|
1987
1987
|
const { isActive, isHorizontal = true } = props;
|
|
1988
1988
|
const getCssClassesConnector = () => {
|
|
1989
1989
|
const cssClasses = [];
|
|
1990
|
-
cssClasses.push(styles$
|
|
1990
|
+
cssClasses.push(styles$8.stepConnector);
|
|
1991
1991
|
return cssClasses.filter(css => css).join(' ');
|
|
1992
1992
|
};
|
|
1993
1993
|
const getCssClassesLine = () => {
|
|
1994
1994
|
const cssClasses = [];
|
|
1995
|
-
cssClasses.push(styles$
|
|
1996
|
-
isActive && cssClasses.push(styles$
|
|
1997
|
-
isHorizontal && cssClasses.push(styles$
|
|
1995
|
+
cssClasses.push(styles$8.stepConnectorLine);
|
|
1996
|
+
isActive && cssClasses.push(styles$8['isActive']);
|
|
1997
|
+
isHorizontal && cssClasses.push(styles$8.stepConnectorLineHorizontal);
|
|
1998
1998
|
return cssClasses.filter(css => css).join(' ');
|
|
1999
1999
|
};
|
|
2000
2000
|
return (React.createElement("div", { className: getCssClassesConnector() },
|
|
2001
2001
|
React.createElement("div", { className: getCssClassesLine() })));
|
|
2002
2002
|
};
|
|
2003
2003
|
|
|
2004
|
-
var css_248z$
|
|
2005
|
-
var styles$
|
|
2006
|
-
styleInject(css_248z$
|
|
2004
|
+
var css_248z$7 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px;\n}\n.Stepper-module_stepper__1TOxM.Stepper-module_isHorizontal__3rFHH {\n overflow-x: auto;\n}";
|
|
2005
|
+
var styles$7 = {"stepper":"Stepper-module_stepper__1TOxM","isHorizontal":"Stepper-module_isHorizontal__3rFHH"};
|
|
2006
|
+
styleInject(css_248z$7);
|
|
2007
2007
|
|
|
2008
2008
|
const Stepper = (props) => {
|
|
2009
2009
|
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
|
|
@@ -2091,8 +2091,8 @@ const Stepper = (props) => {
|
|
|
2091
2091
|
};
|
|
2092
2092
|
const getCssClasses = () => {
|
|
2093
2093
|
const cssClasses = [];
|
|
2094
|
-
cssClasses.push(styles$
|
|
2095
|
-
isHorizontal && cssClasses.push(styles$
|
|
2094
|
+
cssClasses.push(styles$7.stepper);
|
|
2095
|
+
isHorizontal && cssClasses.push(styles$7['isHorizontal']);
|
|
2096
2096
|
return cssClasses.filter(css => css).join(' ');
|
|
2097
2097
|
};
|
|
2098
2098
|
return (React.createElement(React.Fragment, null, steps &&
|
|
@@ -2161,9 +2161,9 @@ function useDebounce(callback, timeout, deps) {
|
|
|
2161
2161
|
}, deps);
|
|
2162
2162
|
}
|
|
2163
2163
|
|
|
2164
|
-
var css_248z$
|
|
2165
|
-
var styles$
|
|
2166
|
-
styleInject(css_248z$
|
|
2164
|
+
var css_248z$6 = ".Step-module_stepWrapper__1se3l {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Step-module_stepWrapper__1se3l.Step-module_hasLabel__3cdCU:not(.Step-module_disabled__1R7hh):hover {\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n border-radius: var(--borderRadius);\n}\n\n.Step-module_step__2siYu {\n width: 40px;\n height: 40px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.Step-module_step__2siYu:not(.Step-module_hasLabel__3cdCU):not(.Step-module_disabled__1R7hh):hover {\n border-radius: 100%;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n}\n.Step-module_step__2siYu.Step-module_hasLabel__3cdCU svg {\n width: 18px !important;\n height: 18px !important;\n}\n\n.Step-module_stepIconCircle__3IyDn svg {\n width: 24px;\n height: 24px;\n}\n\n.Step-module_stepValue__2TVrP {\n position: absolute;\n color: var(--secondary-contrast-text);\n}\n.Step-module_stepValue__2TVrP .Step-module_isActive__1QTL4 {\n color: var(--primary-contrast-text);\n}";
|
|
2165
|
+
var styles$6 = {"stepWrapper":"Step-module_stepWrapper__1se3l","hasLabel":"Step-module_hasLabel__3cdCU","disabled":"Step-module_disabled__1R7hh","step":"Step-module_step__2siYu","stepIconCircle":"Step-module_stepIconCircle__3IyDn","stepValue":"Step-module_stepValue__2TVrP","isActive":"Step-module_isActive__1QTL4"};
|
|
2166
|
+
styleInject(css_248z$6);
|
|
2167
2167
|
|
|
2168
2168
|
const Step = (props) => {
|
|
2169
2169
|
const { className, label, showLabel, index, value, isActive, isDone, isDisabled, showProgressCheckIcon, onClick } = props;
|
|
@@ -2175,24 +2175,24 @@ const Step = (props) => {
|
|
|
2175
2175
|
};
|
|
2176
2176
|
const getCssClasses = () => {
|
|
2177
2177
|
const cssClasses = [];
|
|
2178
|
-
cssClasses.push(styles$
|
|
2179
|
-
label && showLabel && cssClasses.push(styles$
|
|
2180
|
-
isDisabled && cssClasses.push(styles$
|
|
2178
|
+
cssClasses.push(styles$6.stepWrapper);
|
|
2179
|
+
label && showLabel && cssClasses.push(styles$6['hasLabel']);
|
|
2180
|
+
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2181
2181
|
className && cssClasses.push(className);
|
|
2182
2182
|
return cssClasses.filter(css => css).join(' ');
|
|
2183
2183
|
};
|
|
2184
2184
|
const getCssClassesStep = () => {
|
|
2185
2185
|
const cssClasses = [];
|
|
2186
|
-
cssClasses.push(styles$
|
|
2187
|
-
label && showLabel && cssClasses.push(styles$
|
|
2188
|
-
isDisabled && cssClasses.push(styles$
|
|
2186
|
+
cssClasses.push(styles$6.step);
|
|
2187
|
+
label && showLabel && cssClasses.push(styles$6['hasLabel']);
|
|
2188
|
+
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2189
2189
|
return cssClasses.filter(css => css).join(' ');
|
|
2190
2190
|
};
|
|
2191
2191
|
return (React.createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
|
|
2192
2192
|
React.createElement("div", { className: getCssClassesStep() },
|
|
2193
|
-
React.createElement(Icon, { className: styles$
|
|
2193
|
+
React.createElement(Icon, { className: styles$6.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? COLOR.primary : COLOR.secondary },
|
|
2194
2194
|
React.createElement(CircleSolidIcon, null)),
|
|
2195
|
-
React.createElement("div", { className: styles$
|
|
2195
|
+
React.createElement("div", { className: styles$6.stepValue + ' ' + (isActive ? (styles$6.stepValue['isActive']) : '') }, showProgressCheckIcon && isActive && isDone ?
|
|
2196
2196
|
React.createElement(Icon, null,
|
|
2197
2197
|
React.createElement(CheckSolidIcon, null))
|
|
2198
2198
|
:
|
|
@@ -2216,16 +2216,16 @@ const Table = (props) => {
|
|
|
2216
2216
|
React.createElement("table", { className: getCssClasses() }, children)));
|
|
2217
2217
|
};
|
|
2218
2218
|
|
|
2219
|
-
var css_248z$
|
|
2220
|
-
var styles$
|
|
2221
|
-
styleInject(css_248z$
|
|
2219
|
+
var css_248z$5 = ".TabIndicator-module_tabIndicator__wj9Qm {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n.TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_primary__2Lc8c {\n background-color: var(--primary);\n}\n.TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_accent__37h0D {\n background-color: var(--accent);\n}";
|
|
2220
|
+
var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__wj9Qm","primary":"TabIndicator-module_primary__2Lc8c","accent":"TabIndicator-module_accent__37h0D"};
|
|
2221
|
+
styleInject(css_248z$5);
|
|
2222
2222
|
|
|
2223
2223
|
const TabIndicator = (props) => {
|
|
2224
2224
|
const { color = COLOR.accent, width, amount, index } = props;
|
|
2225
2225
|
const getCssClasses = () => {
|
|
2226
2226
|
const cssClasses = [];
|
|
2227
|
-
cssClasses.push(styles$
|
|
2228
|
-
cssClasses.push(styles$
|
|
2227
|
+
cssClasses.push(styles$5.tabIndicator);
|
|
2228
|
+
cssClasses.push(styles$5[color]);
|
|
2229
2229
|
return cssClasses.filter(css => css).join(' ');
|
|
2230
2230
|
};
|
|
2231
2231
|
return (React.createElement("span", { className: getCssClasses(), style: {
|
|
@@ -2234,9 +2234,9 @@ const TabIndicator = (props) => {
|
|
|
2234
2234
|
} }));
|
|
2235
2235
|
};
|
|
2236
2236
|
|
|
2237
|
-
var css_248z$
|
|
2238
|
-
var styles$
|
|
2239
|
-
styleInject(css_248z$
|
|
2237
|
+
var css_248z$4 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative;\n}";
|
|
2238
|
+
var styles$4 = {"tabs":"Tabs-module_tabs__2azkC"};
|
|
2239
|
+
styleInject(css_248z$4);
|
|
2240
2240
|
|
|
2241
2241
|
const Tabs = (props) => {
|
|
2242
2242
|
const { children, className, fixed, indicatorColor, onChange, value } = props;
|
|
@@ -2251,7 +2251,7 @@ const Tabs = (props) => {
|
|
|
2251
2251
|
}, [children, value]);
|
|
2252
2252
|
const getCssClasses = () => {
|
|
2253
2253
|
const cssClasses = [];
|
|
2254
|
-
cssClasses.push(styles$
|
|
2254
|
+
cssClasses.push(styles$4.tabs);
|
|
2255
2255
|
className && cssClasses.push(className);
|
|
2256
2256
|
return cssClasses.filter(css => css).join(' ');
|
|
2257
2257
|
};
|
|
@@ -2275,15 +2275,15 @@ const Tabs = (props) => {
|
|
|
2275
2275
|
React.createElement(TabIndicator, { color: indicatorColor, width: (100 / React.Children.toArray(children).length) + '%', index: selectedIndex, amount: React.Children.toArray(children).length }))));
|
|
2276
2276
|
};
|
|
2277
2277
|
|
|
2278
|
-
var css_248z$
|
|
2279
|
-
var styles$
|
|
2280
|
-
styleInject(css_248z$
|
|
2278
|
+
var css_248z$3 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
|
|
2279
|
+
var styles$3 = {"tab":"Tab-module_tab__31Fjd"};
|
|
2280
|
+
styleInject(css_248z$3);
|
|
2281
2281
|
|
|
2282
2282
|
const Tab = (props) => {
|
|
2283
2283
|
const { label, className, isActive, disabled, value, onClick } = props;
|
|
2284
2284
|
const getCssClasses = () => {
|
|
2285
2285
|
const cssClasses = [];
|
|
2286
|
-
cssClasses.push(styles$
|
|
2286
|
+
cssClasses.push(styles$3.tab);
|
|
2287
2287
|
if (isActive) {
|
|
2288
2288
|
cssClasses.push(`show active`);
|
|
2289
2289
|
}
|
|
@@ -2298,9 +2298,9 @@ const TabPanel = (props) => {
|
|
|
2298
2298
|
return (React.createElement("div", Object.assign({ role: "tabpanel", hidden: value !== index, id: `tabpanel-${index}`, "aria-labelledby": `wrapped-tab-${index}` }, rest), value === index && children));
|
|
2299
2299
|
};
|
|
2300
2300
|
|
|
2301
|
-
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}";
|
|
2302
|
-
var styles = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2303
|
-
styleInject(css_248z);
|
|
2301
|
+
var css_248z$2 = ".Tooltip-module_tooltipContainer__3SPVX {\n display: inline;\n}\n\n.Tooltip-module_tooltip__1AML3 {\n background-color: #333;\n color: white;\n padding: 5px 10px;\n border-radius: 4px;\n font-size: 13px;\n position: absolute;\n left: -1000000px;\n z-index: 1100;\n}\n.Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL,\n.Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL::before {\n position: absolute;\n width: 8px;\n height: 8px;\n z-index: -1;\n}\n.Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL::before {\n content: \"\";\n transform: rotate(45deg);\n background: #333;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=top] > #Tooltip-module_arrow__2c3YL {\n bottom: -4px;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=bottom] > #Tooltip-module_arrow__2c3YL {\n top: -4px;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=left] > #Tooltip-module_arrow__2c3YL {\n right: -4px;\n}\n.Tooltip-module_tooltip__1AML3[data-popper-placement^=right] > #Tooltip-module_arrow__2c3YL {\n left: -4px;\n}";
|
|
2302
|
+
var styles$2 = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2303
|
+
styleInject(css_248z$2);
|
|
2304
2304
|
|
|
2305
2305
|
const Tooltip = (props) => {
|
|
2306
2306
|
const { children, text, placement = 'bottom' } = props;
|
|
@@ -2328,12 +2328,12 @@ const Tooltip = (props) => {
|
|
|
2328
2328
|
setShow(false);
|
|
2329
2329
|
};
|
|
2330
2330
|
return (React.createElement(Fragment, null,
|
|
2331
|
-
React.createElement("div", { className: styles.tooltipContainer, ref: refChild, id: "tooltip-container" }, cloneElement(children, {
|
|
2331
|
+
React.createElement("div", { className: styles$2.tooltipContainer, ref: refChild, id: "tooltip-container" }, cloneElement(children, {
|
|
2332
2332
|
onMouseOver: handleMouseOver,
|
|
2333
2333
|
onMouseLeave: handleMouseLeave,
|
|
2334
2334
|
})),
|
|
2335
2335
|
show &&
|
|
2336
|
-
React.createElement("div", { className: styles.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2336
|
+
React.createElement("div", { className: styles$2.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2337
2337
|
text,
|
|
2338
2338
|
React.createElement("div", { id: "arrow", "data-popper-arrow": true }))));
|
|
2339
2339
|
};
|
|
@@ -2477,88 +2477,59 @@ const TimeSelect = (props) => {
|
|
|
2477
2477
|
React.createElement(MilliSecondSelect, { className: "form-control", value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, TIMEMODE.MILLISECONDS) }))));
|
|
2478
2478
|
};
|
|
2479
2479
|
|
|
2480
|
-
|
|
2481
|
-
|
|
2482
|
-
|
|
2483
|
-
hasChildren &&
|
|
2484
|
-
React.createElement(IconButton, { onClick: () => onToggleExpand(id), icon: !isExpanded ? React.createElement(ChevronRightSolidIcon, null) : React.createElement(ChevronDownSolidIcon, null) }),
|
|
2485
|
-
React.createElement(Checkbox, { checked: isSelected, onChange: () => onClickSelect(id) }),
|
|
2486
|
-
label));
|
|
2487
|
-
};
|
|
2480
|
+
var css_248z$1 = ".TreeView-module_treeview__2vaBA {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important;\n}\n.TreeView-module_treeview__2vaBA ul {\n padding-left: 48px !important;\n}";
|
|
2481
|
+
var styles$1 = {"treeview":"TreeView-module_treeview__2vaBA"};
|
|
2482
|
+
styleInject(css_248z$1);
|
|
2488
2483
|
|
|
2489
2484
|
const TreeView = (props) => {
|
|
2490
|
-
const {
|
|
2491
|
-
const
|
|
2492
|
-
|
|
2493
|
-
|
|
2494
|
-
|
|
2495
|
-
|
|
2496
|
-
result = arr1.reduce((acc, val) => {
|
|
2497
|
-
return (Array.isArray(val.children) ?
|
|
2498
|
-
acc.concat([
|
|
2499
|
-
{ id: val.id, label: val.label, level: level, hasChildren: true, parentId: parentId },
|
|
2500
|
-
...flattenDeep(val.children, val.id, level + 1)
|
|
2501
|
-
]) :
|
|
2502
|
-
acc.concat([{ id: val.id, label: val.label, level: level, hasChildren: false, parentId: parentId }]));
|
|
2503
|
-
}, []);
|
|
2504
|
-
return result;
|
|
2505
|
-
};
|
|
2506
|
-
useEffect(() => {
|
|
2507
|
-
setFlattenData(flattenDeep(data));
|
|
2508
|
-
}, [data]);
|
|
2509
|
-
const handleOnToggleExpand = (item) => {
|
|
2510
|
-
if (item.hasChildren) {
|
|
2511
|
-
let newExpandedItems = [...expandedItems];
|
|
2512
|
-
if (isExpanded(item.id)) {
|
|
2513
|
-
newExpandedItems = collapseRecursive(item, [...expandedItems]);
|
|
2514
|
-
onCollapse && onCollapse(item.id);
|
|
2515
|
-
}
|
|
2516
|
-
else {
|
|
2517
|
-
newExpandedItems.push(item);
|
|
2518
|
-
onExpand && onExpand(item.id);
|
|
2519
|
-
}
|
|
2520
|
-
setExpandedItems(newExpandedItems);
|
|
2521
|
-
}
|
|
2522
|
-
};
|
|
2523
|
-
const collapseRecursive = (item, expandedItems) => {
|
|
2524
|
-
let expandedItemIds = expandedItems.map(i => i.id);
|
|
2525
|
-
if (expandedItemIds.indexOf(item.id) >= 0) {
|
|
2526
|
-
expandedItems = expandedItems.filter(i => i.id !== item.id);
|
|
2527
|
-
}
|
|
2528
|
-
if (item.hasChildren) {
|
|
2529
|
-
let children = expandedItems.filter(child => child.parentId === item.id);
|
|
2530
|
-
for (let child of children) {
|
|
2531
|
-
expandedItems = collapseRecursive(child, expandedItems);
|
|
2532
|
-
}
|
|
2533
|
-
}
|
|
2534
|
-
return expandedItems;
|
|
2535
|
-
};
|
|
2536
|
-
const isExpanded = (id) => {
|
|
2537
|
-
return expandedItems.map(i => i.id).indexOf(id) >= 0;
|
|
2485
|
+
const { children, className } = props;
|
|
2486
|
+
const getCssClasses = () => {
|
|
2487
|
+
const cssClasses = [];
|
|
2488
|
+
cssClasses.push(styles$1.treeView);
|
|
2489
|
+
className && cssClasses.push(className);
|
|
2490
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2538
2491
|
};
|
|
2539
|
-
|
|
2540
|
-
|
|
2492
|
+
return (React.createElement("ul", { className: getCssClasses() }, children));
|
|
2493
|
+
};
|
|
2494
|
+
|
|
2495
|
+
var css_248z = ".TreeItem-module_treeItem__2FtLe {\n display: flex;\n flex-direction: column;\n}";
|
|
2496
|
+
var styles = {"treeItem":"TreeItem-module_treeItem__2FtLe"};
|
|
2497
|
+
styleInject(css_248z);
|
|
2498
|
+
|
|
2499
|
+
const TreeItem = (props) => {
|
|
2500
|
+
const { nodeId, label, children, className, isExpanded, isSelected, onToggleExpand, onSelect } = props;
|
|
2501
|
+
const [_isExpanded, setIsExpanded] = useState(false);
|
|
2502
|
+
const [_isSelected, setIsSelected] = useState(false);
|
|
2503
|
+
const getCssClasses = () => {
|
|
2504
|
+
const cssClasses = [];
|
|
2505
|
+
cssClasses.push(styles.treeItem);
|
|
2506
|
+
className && cssClasses.push(className);
|
|
2507
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2541
2508
|
};
|
|
2542
|
-
|
|
2543
|
-
|
|
2544
|
-
|
|
2545
|
-
|
|
2546
|
-
|
|
2547
|
-
|
|
2548
|
-
|
|
2549
|
-
|
|
2550
|
-
|
|
2551
|
-
|
|
2552
|
-
|
|
2509
|
+
useEffect(() => {
|
|
2510
|
+
if (isExpanded !== undefined)
|
|
2511
|
+
setIsExpanded(isExpanded);
|
|
2512
|
+
}, [isExpanded]);
|
|
2513
|
+
useEffect(() => {
|
|
2514
|
+
if (isSelected !== undefined)
|
|
2515
|
+
setIsSelected(isSelected);
|
|
2516
|
+
}, [isSelected]);
|
|
2517
|
+
const handleOnToggleExpand = (nodeId) => {
|
|
2518
|
+
setIsExpanded(!_isExpanded);
|
|
2519
|
+
onToggleExpand && onToggleExpand(nodeId);
|
|
2553
2520
|
};
|
|
2554
|
-
const
|
|
2555
|
-
|
|
2521
|
+
const handleOnSelect = (nodeId) => {
|
|
2522
|
+
setIsSelected(!_isSelected);
|
|
2523
|
+
onSelect && onSelect(nodeId, !_isSelected);
|
|
2556
2524
|
};
|
|
2557
|
-
return (React.createElement("
|
|
2558
|
-
|
|
2559
|
-
|
|
2560
|
-
|
|
2525
|
+
return (React.createElement("li", { className: getCssClasses(), style: { paddingLeft: `${(48 * (children ? 0 : 1))}px` } },
|
|
2526
|
+
React.createElement("div", { className: "d-flex align-items-center" },
|
|
2527
|
+
children &&
|
|
2528
|
+
React.createElement(IconButton, { onClick: () => handleOnToggleExpand(nodeId), icon: !_isExpanded ? React.createElement(ChevronRightSolidIcon, null) : React.createElement(ChevronDownSolidIcon, null) }),
|
|
2529
|
+
React.createElement(Checkbox, { checked: _isSelected, onChange: () => handleOnSelect(nodeId) }),
|
|
2530
|
+
label),
|
|
2531
|
+
children && _isExpanded ? React.createElement("ul", null, children) : null));
|
|
2561
2532
|
};
|
|
2562
2533
|
|
|
2563
|
-
export { Alert, AppBar, AppBarTitle, AutoComplete, Backdrop, Badge, Breadcrumb, BreadcrumbItem, Button, ButtonGroup, COLOR, Card, CardBody, CardFooter, CardImage, CardSubtitle, CardText, CardTitle, CaretDownSolidIcon, CheckSolidIcon, CheckSquareRegularIcon, Checkbox, ChevronDownSolidIcon, ChevronLeftSolidIcon, ChevronRightSolidIcon, ChevronUpSolidIcon, Chip, CircleSolidIcon, Column, ConditionalWrapper, DATEMODE, DateSelect, DaySelect, Drawer, EmailValidator, ExpansionPanel, ExpansionPanelContent, ExpansionPanelHeader, FileInput, FloatingActionButton, Form, FormControl, FormError, FormGroup, FormHint, FormInput, FormLabel, GlobalModal, HomeSolidIcon, HourSelect, Icon, IconButton, IsEmptyValidator, IsEqualValidator, Link, List, ListItem, ListItemAction, ListItemAvatar, ListItemIcon, ListItemText, LoadingIndicator, LoadingIndicatorContainer, MODALBUTTONTYPE, MODALTYPE, Menu, MenuBody, MenuDivider, MenuItem, MenuToggle, MilliSecondSelect, MinuteSelect, Modal, ModalBody, ModalFooter, ModalHeader, MonthSelect, NumberSelect, POSITION, PlusSolidIcon, Row, SIZE, STATUS, SecondSelect, Select, Sidebar, Snackbar, SpeedDial, SpeedDialAction, SpeedDialIcon, SpinnerSolidIcon, SquareRegularIcon, Step, Stepper, StepperActions, TIMEMODE, Tab, TabPanel, Table, Tabs, Textarea, TimeSelect, TimesCircleSolidIcon, TimesSolidIcon, Tooltip, TreeView, Typography, VARIANT, YearSelect, loadingIndicatorService, modalService, snackbarService, useConstructor, useDebounce, useHover, useWindowSize };
|
|
2534
|
+
export { Alert, AppBar, AppBarTitle, AutoComplete, Backdrop, Badge, Breadcrumb, BreadcrumbItem, Button, ButtonGroup, COLOR, Card, CardBody, CardFooter, CardImage, CardSubtitle, CardText, CardTitle, CaretDownSolidIcon, CheckSolidIcon, CheckSquareRegularIcon, Checkbox, ChevronDownSolidIcon, ChevronLeftSolidIcon, ChevronRightSolidIcon, ChevronUpSolidIcon, Chip, CircleSolidIcon, Column, ConditionalWrapper, DATEMODE, DateSelect, DaySelect, Drawer, EmailValidator, ExpansionPanel, ExpansionPanelContent, ExpansionPanelHeader, FileInput, FloatingActionButton, Form, FormControl, FormError, FormGroup, FormHint, FormInput, FormLabel, GlobalModal, HomeSolidIcon, HourSelect, Icon, IconButton, IsEmptyValidator, IsEqualValidator, Link, List, ListItem, ListItemAction, ListItemAvatar, ListItemIcon, ListItemText, LoadingIndicator, LoadingIndicatorContainer, MODALBUTTONTYPE, MODALTYPE, Menu, MenuBody, MenuDivider, MenuItem, MenuToggle, MilliSecondSelect, MinuteSelect, Modal, ModalBody, ModalFooter, ModalHeader, MonthSelect, NumberSelect, POSITION, PlusSolidIcon, Row, SIZE, STATUS, SecondSelect, Select, Sidebar, Snackbar, SpeedDial, SpeedDialAction, SpeedDialIcon, SpinnerSolidIcon, SquareRegularIcon, Step, Stepper, StepperActions, TIMEMODE, Tab, TabPanel, Table, Tabs, Textarea, TimeSelect, TimesCircleSolidIcon, TimesSolidIcon, Tooltip, TreeItem, TreeView, Typography, VARIANT, YearSelect, loadingIndicatorService, modalService, snackbarService, useConstructor, useDebounce, useHover, useWindowSize };
|
|
2564
2535
|
//# sourceMappingURL=index.es.js.map
|