react-asc 18.8.5 → 18.9.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/Alert/Alert.d.ts +2 -2
- package/components/AppBar/AppBar.d.ts +2 -2
- package/components/AppBar/AppBarTitle.d.ts +2 -4
- package/components/Backdrop/Backdrop.d.ts +1 -3
- package/components/Badge/Badge.d.ts +1 -2
- package/components/Breadcrumb/Breadcrumb.d.ts +2 -3
- package/components/Button/Button.d.ts +2 -3
- package/components/ButtonGroup/ButtonGroup.d.ts +1 -1
- package/components/Card/Card.d.ts +1 -2
- package/components/Card/CardBody.d.ts +1 -1
- package/components/Card/CardFooter.d.ts +1 -1
- package/components/Card/CardImage.d.ts +1 -4
- package/components/Card/CardSubtitle.d.ts +1 -1
- package/components/Card/CardText.d.ts +1 -1
- package/components/Card/CardTitle.d.ts +1 -1
- package/components/Checkbox/Checkbox.d.ts +1 -6
- package/components/Chip/Chip.d.ts +2 -5
- package/components/Form/FormHint/FormHint.d.ts +5 -0
- package/components/Form/FormHint/index.d.ts +1 -0
- package/components/Form/{FormInput.d.ts → FormInput/FormInput.d.ts} +9 -3
- package/components/Form/FormInput/index.d.ts +1 -0
- package/components/Form/FormLabel/FormLabel.d.ts +4 -0
- package/components/Form/FormLabel/index.d.ts +1 -0
- package/components/Icon/Icon.d.ts +2 -3
- package/components/Snackbar/Snackbar.d.ts +3 -4
- package/components/Snackbar/snackbar.service.d.ts +3 -2
- package/components/SpeedDial/SpeedDialAction.d.ts +2 -0
- package/index.es.js +244 -209
- package/index.es.js.map +1 -1
- package/index.js +244 -209
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/components/Button/Button.template.d.ts +0 -3
- package/components/Form/FormHint.d.ts +0 -7
- package/components/Form/FormLabel.d.ts +0 -7
package/index.es.js
CHANGED
|
@@ -87,67 +87,67 @@ 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$V = ".Alert-module_alert__2yOUn {\n border-radius: var(--borderRadius);\n padding: 6px 16px; }\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.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$V = {"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$V);
|
|
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$V.alert);
|
|
99
99
|
if (variant === VARIANT.contained) {
|
|
100
|
-
cssClasses.push(styles$
|
|
101
|
-
cssClasses.push(styles$
|
|
100
|
+
cssClasses.push(styles$V.contained);
|
|
101
|
+
cssClasses.push(styles$V[color]);
|
|
102
102
|
}
|
|
103
103
|
if (variant === VARIANT.outline) {
|
|
104
|
-
cssClasses.push(styles$
|
|
105
|
-
cssClasses.push(styles$
|
|
104
|
+
cssClasses.push(styles$V.outline);
|
|
105
|
+
cssClasses.push(styles$V[color]);
|
|
106
106
|
}
|
|
107
|
-
shadow && cssClasses.push(styles$
|
|
107
|
+
shadow && cssClasses.push(styles$V['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$U = ".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 .AppBar-module_appbar__1S8G1.AppBar-module_primary__3CiO7 {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .AppBar-module_appbar__1S8G1.AppBar-module_secondary__1W4qT {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .AppBar-module_appbar__1S8G1.AppBar-module_accent__Mgcwx {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .AppBar-module_appbar__1S8G1.AppBar-module_light__1FxmL {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .AppBar-module_appbar__1S8G1.AppBar-module_dark__3n5rm {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .AppBar-module_appbar__1S8G1.AppBar-module_shadow__2c8iH {\n box-shadow: var(--shadow); }\n";
|
|
115
|
+
var styles$U = {"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$U);
|
|
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$U[color]);
|
|
123
|
+
cssClasses.push(styles$U.appbar);
|
|
124
|
+
shadow && cssClasses.push(styles$U['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$T = ".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 .AppBarTitle-module_appbarTitle__3J-Z1:hover {\n cursor: pointer; }\n";
|
|
132
|
+
var styles$T = {"appbarTitle":"AppBarTitle-module_appbarTitle__3J-Z1"};
|
|
133
|
+
styleInject(css_248z$T);
|
|
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$T.appbarTitle);
|
|
140
140
|
className && cssClasses.push(className);
|
|
141
141
|
return cssClasses.filter(r => r).join(' ');
|
|
142
142
|
};
|
|
143
|
-
return (React.createElement("div", { className: getCssClass(), onClick:
|
|
143
|
+
return (React.createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
144
144
|
};
|
|
145
145
|
|
|
146
146
|
const Backdrop = (props) => {
|
|
147
|
-
const { target = document.body, isTransparent = false, onClick, style } = props;
|
|
147
|
+
const { target = document.body, isTransparent = false, onClick, style } = props, rest = __rest(props, ["target", "isTransparent", "onClick", "style"]);
|
|
148
148
|
const handleClick = (e) => {
|
|
149
149
|
e.stopPropagation();
|
|
150
|
-
onClick && onClick();
|
|
150
|
+
onClick && onClick(e);
|
|
151
151
|
};
|
|
152
152
|
const getCssClasses = () => {
|
|
153
153
|
const cssClasses = [];
|
|
@@ -161,43 +161,43 @@ const Backdrop = (props) => {
|
|
|
161
161
|
const styles = Object.assign({ height: '100%', width: '100%', position: 'absolute' }, style);
|
|
162
162
|
return styles;
|
|
163
163
|
};
|
|
164
|
-
return (createPortal(React.createElement("div", { className: getCssClasses(), onClick: handleClick, style: getStyles() }), target));
|
|
164
|
+
return (createPortal(React.createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
165
165
|
};
|
|
166
166
|
|
|
167
|
-
var css_248z$
|
|
168
|
-
var styles$
|
|
169
|
-
styleInject(css_248z$
|
|
167
|
+
var css_248z$S = ".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$S = {"list":"List-module_list__1ax9w"};
|
|
169
|
+
styleInject(css_248z$S);
|
|
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$S.flush);
|
|
177
177
|
}
|
|
178
|
-
cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$S.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$R = ".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 .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 .ListItem-module_listItem__3hAZb + .ListItem-module_listItem__3hAZb {\n border-top-width: 0; }\n .ListItem-module_listItem__3hAZb.ListItem-module_primary__2OJAg {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .ListItem-module_listItem__3hAZb.ListItem-module_accent__2RXHe {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .ListItem-module_listItem__3hAZb.ListItem-module_secondary__3EVjH {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .ListItem-module_listItem__3hAZb.ListItem-module_light__3CJBB {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .ListItem-module_listItem__3hAZb.ListItem-module_dark__SazkE {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .ListItem-module_listItem__3hAZb.ListItem-module_disabled__2Kh0o {\n color: rgba(0, 0, 0, 0.26); }\n .ListItem-module_listItem__3hAZb.ListItem-module_disabled__2Kh0o:hover {\n cursor: not-allowed;\n background-color: inherit; }\n";
|
|
186
|
+
var styles$R = {"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","disabled":"ListItem-module_disabled__2Kh0o"};
|
|
187
|
+
styleInject(css_248z$R);
|
|
188
188
|
|
|
189
189
|
const ListItem = (props) => {
|
|
190
190
|
const { id, children, color, active, className, isHoverable, disabled, onClick } = props;
|
|
191
191
|
const getCssClasses = () => {
|
|
192
192
|
const cssClasses = [];
|
|
193
193
|
if (active) {
|
|
194
|
-
cssClasses.push(styles$
|
|
194
|
+
cssClasses.push(styles$R['active']);
|
|
195
195
|
}
|
|
196
196
|
if (disabled) {
|
|
197
|
-
cssClasses.push(styles$
|
|
197
|
+
cssClasses.push(styles$R['disabled']);
|
|
198
198
|
}
|
|
199
|
-
color && cssClasses.push(styles$
|
|
200
|
-
cssClasses.push(styles$
|
|
199
|
+
color && cssClasses.push(styles$R[color]);
|
|
200
|
+
cssClasses.push(styles$R.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$Q = ".ListItemAvatar-module_avatar__1fjSE {\n margin-right: 16px; }\n .ListItemAvatar-module_avatar__1fjSE svg, .ListItemAvatar-module_avatar__1fjSE img {\n width: 24px;\n height: 24px; }\n .ListItemAvatar-module_avatar__1fjSE img {\n border-radius: 50%; }\n";
|
|
211
|
+
var styles$Q = {"avatar":"ListItemAvatar-module_avatar__1fjSE"};
|
|
212
|
+
styleInject(css_248z$Q);
|
|
213
213
|
|
|
214
|
-
const ListItemAvatar = ({ avatar }) => (React.createElement("div", { className: styles$
|
|
214
|
+
const ListItemAvatar = ({ avatar }) => (React.createElement("div", { className: styles$Q.avatar }, avatar));
|
|
215
215
|
|
|
216
|
-
var css_248z$
|
|
217
|
-
var styles$
|
|
218
|
-
styleInject(css_248z$
|
|
216
|
+
var css_248z$P = ".ListItemIcon-module_icon__-nsUy {\n margin-right: 32px; }\n .ListItemIcon-module_icon__-nsUy svg {\n width: 24px;\n height: 24px; }\n";
|
|
217
|
+
var styles$P = {"icon":"ListItemIcon-module_icon__-nsUy"};
|
|
218
|
+
styleInject(css_248z$P);
|
|
219
219
|
|
|
220
|
-
const ListItemIcon = ({ icon }) => (React.createElement("div", { className: styles$
|
|
220
|
+
const ListItemIcon = ({ icon }) => (React.createElement("div", { className: styles$P.icon }, icon));
|
|
221
221
|
|
|
222
|
-
var css_248z$
|
|
223
|
-
var styles$
|
|
224
|
-
styleInject(css_248z$
|
|
222
|
+
var css_248z$O = ".ListItemAction-module_listItemAction__26S66 {\n display: flex;\n justify-content: center;\n min-width: 40px; }\n .ListItemAction-module_listItemAction__26S66 svg {\n width: 20px;\n height: 20px; }\n";
|
|
223
|
+
var styles$O = {"listItemAction":"ListItemAction-module_listItemAction__26S66"};
|
|
224
|
+
styleInject(css_248z$O);
|
|
225
225
|
|
|
226
|
-
const ListItemAction = ({ children, onClick }) => (React.createElement("div", { className: styles$
|
|
226
|
+
const ListItemAction = ({ children, onClick }) => (React.createElement("div", { className: styles$O.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
227
227
|
|
|
228
|
-
var css_248z$
|
|
229
|
-
var styles$
|
|
230
|
-
styleInject(css_248z$
|
|
228
|
+
var css_248z$N = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1; }\n";
|
|
229
|
+
var styles$N = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
230
|
+
styleInject(css_248z$N);
|
|
231
231
|
|
|
232
232
|
const ListItemText = ({ primary, secondary }) => {
|
|
233
233
|
const getCssClasses = () => {
|
|
234
234
|
const cssClasses = [];
|
|
235
|
-
cssClasses.push(styles$
|
|
235
|
+
cssClasses.push(styles$N.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$M = ".AutoComplete-module_selectContainer__SyqtX {\n position: relative; }\n\n.AutoComplete-module_select__2_7JD {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .AutoComplete-module_select__2_7JD:hover {\n cursor: pointer; }\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$M = {"selectContainer":"AutoComplete-module_selectContainer__SyqtX","select":"AutoComplete-module_select__2_7JD","selectMenu":"AutoComplete-module_selectMenu__2_ybA"};
|
|
248
|
+
styleInject(css_248z$M);
|
|
249
249
|
|
|
250
250
|
// preset value
|
|
251
251
|
// enter -> delay? -> show results
|
|
@@ -301,7 +301,7 @@ const AutoComplete = (props) => {
|
|
|
301
301
|
const getCssClass = () => {
|
|
302
302
|
const cssClasses = [];
|
|
303
303
|
className && cssClasses.push(className);
|
|
304
|
-
cssClasses.push(styles$
|
|
304
|
+
cssClasses.push(styles$M.select);
|
|
305
305
|
return cssClasses.filter(r => r).join(' ');
|
|
306
306
|
};
|
|
307
307
|
const show = () => setIsShow(true);
|
|
@@ -325,36 +325,35 @@ const AutoComplete = (props) => {
|
|
|
325
325
|
setModel('');
|
|
326
326
|
setSearchText('');
|
|
327
327
|
};
|
|
328
|
-
return (React.createElement(
|
|
329
|
-
React.createElement("div", {
|
|
330
|
-
React.createElement("
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
React.createElement(
|
|
336
|
-
React.createElement(
|
|
337
|
-
React.createElement(
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
var
|
|
343
|
-
|
|
344
|
-
styleInject(css_248z$J);
|
|
328
|
+
return (React.createElement("div", { ref: selectConainter, className: styles$M.selectContainer },
|
|
329
|
+
React.createElement("div", { className: "d-flex" },
|
|
330
|
+
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 }),
|
|
331
|
+
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
332
|
+
React.createElement(IconButton, { icon: React.createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
333
|
+
isShow &&
|
|
334
|
+
React.createElement(React.Fragment, null,
|
|
335
|
+
React.createElement("div", { className: styles$M.selectMenu },
|
|
336
|
+
React.createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React.createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), disabled: !option.value },
|
|
337
|
+
React.createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
338
|
+
React.createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
339
|
+
};
|
|
340
|
+
|
|
341
|
+
var css_248z$L = ".Badge-module_badgeContainer__1QtTD {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle; }\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 .Badge-module_badge__2Y_LO.Badge-module_primary__2mn7_ {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Badge-module_badge__2Y_LO.Badge-module_accent__8Hg8z {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Badge-module_badge__2Y_LO.Badge-module_secondary__1QqDc {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Badge-module_badge__2Y_LO.Badge-module_light__3Z7JO {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Badge-module_badge__2Y_LO.Badge-module_dark__2qWe_ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n";
|
|
342
|
+
var styles$L = {"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_"};
|
|
343
|
+
styleInject(css_248z$L);
|
|
345
344
|
|
|
346
345
|
const Badge = (props) => {
|
|
347
346
|
const { children, content, className, color = COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
348
347
|
const getCssClassesBadgeContainer = () => {
|
|
349
348
|
const cssClasses = [];
|
|
350
|
-
cssClasses.push(styles$
|
|
349
|
+
cssClasses.push(styles$L.badgeContainer);
|
|
351
350
|
className && cssClasses.push(className);
|
|
352
351
|
return cssClasses.filter(css => css).join(' ');
|
|
353
352
|
};
|
|
354
353
|
const getCssClassesBadge = () => {
|
|
355
354
|
const cssClasses = [];
|
|
356
|
-
cssClasses.push(styles$
|
|
357
|
-
cssClasses.push(styles$
|
|
355
|
+
cssClasses.push(styles$L.badge);
|
|
356
|
+
cssClasses.push(styles$L[color]);
|
|
358
357
|
return cssClasses.filter(css => css).join(' ');
|
|
359
358
|
};
|
|
360
359
|
return (React.createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -362,42 +361,26 @@ const Badge = (props) => {
|
|
|
362
361
|
React.createElement("span", { className: getCssClassesBadge() }, content)));
|
|
363
362
|
};
|
|
364
363
|
|
|
365
|
-
var css_248z$
|
|
366
|
-
var styles$
|
|
367
|
-
styleInject(css_248z$
|
|
368
|
-
|
|
369
|
-
const Icon = (props) => {
|
|
370
|
-
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
371
|
-
const getCssClasses = () => {
|
|
372
|
-
const cssClasses = [];
|
|
373
|
-
cssClasses.push(styles$I.icon);
|
|
374
|
-
iconColor && cssClasses.push(styles$I[iconColor]);
|
|
375
|
-
className && cssClasses.push(className);
|
|
376
|
-
return cssClasses.filter(css => css).join(' ');
|
|
377
|
-
};
|
|
378
|
-
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
379
|
-
};
|
|
380
|
-
|
|
381
|
-
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.Button-module_btnContained__8Q4uL.Button-module_primary__2soUg {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\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 .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 .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 .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 .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.Button-module_btnText__32H44 {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__32H44.Button-module_primary__2soUg {\n color: var(--primary) !important; }\n .Button-module_btnText__32H44.Button-module_primary__2soUg:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_secondary__psAvb {\n color: var(--secondary) !important; }\n .Button-module_btnText__32H44.Button-module_secondary__psAvb:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_accent__1_cP6 {\n color: var(--accent) !important; }\n .Button-module_btnText__32H44.Button-module_accent__1_cP6:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important; }\n .Button-module_btnText__32H44.Button-module_light__JVK1z:hover {\n text-decoration: none;\n background: var(--light-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_dark__O89wU {\n color: var(--dark) !important; }\n .Button-module_btnText__32H44.Button-module_dark__O89wU:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important; }\n\n.Button-module_btnOutline__2drkn {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__2drkn.Button-module_primary__2soUg {\n color: var(--primary) !important;\n border-color: var(--primary) !important; }\n .Button-module_btnOutline__2drkn.Button-module_primary__2soUg:hover {\n background: var(--primary-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_secondary__psAvb {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important; }\n .Button-module_btnOutline__2drkn.Button-module_secondary__psAvb:hover {\n background: var(--secondary-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_accent__1_cP6 {\n color: var(--accent) !important;\n border-color: var(--accent) !important; }\n .Button-module_btnOutline__2drkn.Button-module_accent__1_cP6:hover {\n background: var(--accent-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important; }\n .Button-module_btnOutline__2drkn.Button-module_light__JVK1z:hover {\n background: var(--light-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_dark__O89wU {\n color: var(--dark) !important;\n border-color: var(--dark) !important; }\n .Button-module_btnOutline__2drkn.Button-module_dark__O89wU:hover {\n background: var(--dark-highlight) !important; }\n\n.Button-module_startIcon__1TN-G {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__1TN-G svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__3uZjE {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__3uZjE svg {\n width: 18px;\n height: 18px; }\n";
|
|
382
|
-
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"};
|
|
383
|
-
styleInject(css_248z$H);
|
|
364
|
+
var css_248z$K = ".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.Button-module_btnContained__8Q4uL.Button-module_primary__2soUg {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\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 .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 .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 .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 .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.Button-module_btnText__32H44 {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__32H44.Button-module_primary__2soUg {\n color: var(--primary) !important; }\n .Button-module_btnText__32H44.Button-module_primary__2soUg:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_secondary__psAvb {\n color: var(--secondary) !important; }\n .Button-module_btnText__32H44.Button-module_secondary__psAvb:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_accent__1_cP6 {\n color: var(--accent) !important; }\n .Button-module_btnText__32H44.Button-module_accent__1_cP6:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important; }\n .Button-module_btnText__32H44.Button-module_light__JVK1z:hover {\n text-decoration: none;\n background: var(--light-highlight) !important; }\n .Button-module_btnText__32H44.Button-module_dark__O89wU {\n color: var(--dark) !important; }\n .Button-module_btnText__32H44.Button-module_dark__O89wU:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important; }\n\n.Button-module_btnOutline__2drkn {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__2drkn.Button-module_primary__2soUg {\n color: var(--primary) !important;\n border-color: var(--primary) !important; }\n .Button-module_btnOutline__2drkn.Button-module_primary__2soUg:hover {\n background: var(--primary-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_secondary__psAvb {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important; }\n .Button-module_btnOutline__2drkn.Button-module_secondary__psAvb:hover {\n background: var(--secondary-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_accent__1_cP6 {\n color: var(--accent) !important;\n border-color: var(--accent) !important; }\n .Button-module_btnOutline__2drkn.Button-module_accent__1_cP6:hover {\n background: var(--accent-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_light__JVK1z {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important; }\n .Button-module_btnOutline__2drkn.Button-module_light__JVK1z:hover {\n background: var(--light-highlight) !important; }\n .Button-module_btnOutline__2drkn.Button-module_dark__O89wU {\n color: var(--dark) !important;\n border-color: var(--dark) !important; }\n .Button-module_btnOutline__2drkn.Button-module_dark__O89wU:hover {\n background: var(--dark-highlight) !important; }\n\n.Button-module_startIcon__1TN-G {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__1TN-G svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__3uZjE {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__3uZjE svg {\n width: 18px;\n height: 18px; }\n";
|
|
365
|
+
var styles$K = {"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"};
|
|
366
|
+
styleInject(css_248z$K);
|
|
384
367
|
|
|
385
|
-
const
|
|
368
|
+
const Button = (props) => {
|
|
386
369
|
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"]);
|
|
387
370
|
const getCssClasses = () => {
|
|
388
371
|
const cssClasses = [];
|
|
389
|
-
cssClasses.push(styles$
|
|
372
|
+
cssClasses.push(styles$K.button);
|
|
390
373
|
if (variant !== 'outline' && variant !== 'text') {
|
|
391
|
-
cssClasses.push(styles$
|
|
392
|
-
cssClasses.push(styles$
|
|
374
|
+
cssClasses.push(styles$K.btnContained);
|
|
375
|
+
cssClasses.push(styles$K[color]);
|
|
393
376
|
}
|
|
394
377
|
if (variant === 'outline') {
|
|
395
|
-
cssClasses.push(styles$
|
|
396
|
-
cssClasses.push(styles$
|
|
378
|
+
cssClasses.push(styles$K.btnOutline);
|
|
379
|
+
cssClasses.push(styles$K[color]);
|
|
397
380
|
}
|
|
398
381
|
if (variant === 'text') {
|
|
399
|
-
cssClasses.push(styles$
|
|
400
|
-
cssClasses.push(styles$
|
|
382
|
+
cssClasses.push(styles$K.btnText);
|
|
383
|
+
cssClasses.push(styles$K[color]);
|
|
401
384
|
}
|
|
402
385
|
if (isRounded && variant !== 'text') {
|
|
403
386
|
cssClasses.push(`rounded-pill`);
|
|
@@ -411,58 +394,54 @@ const ButtonTemplate = (props) => {
|
|
|
411
394
|
return (React.createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
412
395
|
React.createElement("span", { className: "d-flex justify-content-center" },
|
|
413
396
|
startIcon &&
|
|
414
|
-
React.createElement(Icon, { className: styles$
|
|
397
|
+
React.createElement(Icon, { className: styles$K.startIcon }, startIcon),
|
|
415
398
|
children,
|
|
416
399
|
endIcon &&
|
|
417
|
-
React.createElement(Icon, { className: styles$
|
|
418
|
-
};
|
|
419
|
-
|
|
420
|
-
const Button = (props) => {
|
|
421
|
-
return (React.createElement(ButtonTemplate, Object.assign({}, props)));
|
|
400
|
+
React.createElement(Icon, { className: styles$K.endIcon }, endIcon))));
|
|
422
401
|
};
|
|
423
402
|
|
|
424
|
-
var css_248z$
|
|
425
|
-
var styles$
|
|
426
|
-
styleInject(css_248z$
|
|
403
|
+
var css_248z$J = ".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";
|
|
404
|
+
var styles$J = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
405
|
+
styleInject(css_248z$J);
|
|
427
406
|
|
|
428
407
|
const ButtonGroup = (props) => {
|
|
429
408
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
430
409
|
const getCssClasses = () => {
|
|
431
410
|
const cssClasses = [];
|
|
432
|
-
cssClasses.push(styles$
|
|
411
|
+
cssClasses.push(styles$J.buttonGroup);
|
|
433
412
|
className && cssClasses.push(className);
|
|
434
413
|
return cssClasses.filter(css => css).join(' ');
|
|
435
414
|
};
|
|
436
415
|
return (React.createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
437
416
|
};
|
|
438
417
|
|
|
439
|
-
var css_248z$
|
|
440
|
-
var styles$
|
|
441
|
-
styleInject(css_248z$
|
|
418
|
+
var css_248z$I = ".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";
|
|
419
|
+
var styles$I = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
420
|
+
styleInject(css_248z$I);
|
|
442
421
|
|
|
443
422
|
const Breadcrumb = (props) => {
|
|
444
|
-
const { children, className } = props;
|
|
423
|
+
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
445
424
|
const getCssClasses = () => {
|
|
446
425
|
const cssClasses = [];
|
|
447
|
-
cssClasses.push(styles$
|
|
426
|
+
cssClasses.push(styles$I.breadcrumb);
|
|
448
427
|
className && cssClasses.push(className);
|
|
449
428
|
return cssClasses.filter(css => css).join(' ');
|
|
450
429
|
};
|
|
451
|
-
return (React.createElement("nav",
|
|
430
|
+
return (React.createElement("nav", Object.assign({}, rest),
|
|
452
431
|
React.createElement("ol", { className: getCssClasses() }, children)));
|
|
453
432
|
};
|
|
454
433
|
|
|
455
434
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
456
435
|
|
|
457
|
-
var css_248z$
|
|
458
|
-
var styles$
|
|
459
|
-
styleInject(css_248z$
|
|
436
|
+
var css_248z$H = ".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";
|
|
437
|
+
var styles$H = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
438
|
+
styleInject(css_248z$H);
|
|
460
439
|
|
|
461
440
|
const BreadcrumbItem = (props) => {
|
|
462
441
|
const { children, className, isActive, onClick } = props;
|
|
463
442
|
const getCssClasses = () => {
|
|
464
443
|
const cssClasses = [];
|
|
465
|
-
cssClasses.push(styles$
|
|
444
|
+
cssClasses.push(styles$H.breadcrumbItem);
|
|
466
445
|
className && cssClasses.push(className);
|
|
467
446
|
isActive && cssClasses.push('active');
|
|
468
447
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -476,106 +455,106 @@ const BreadcrumbItem = (props) => {
|
|
|
476
455
|
wrapper: label => React.createElement("a", null, label) }, children)));
|
|
477
456
|
};
|
|
478
457
|
|
|
479
|
-
var css_248z$
|
|
480
|
-
var styles$
|
|
481
|
-
styleInject(css_248z$
|
|
458
|
+
var css_248z$G = ".Card-module_card__31o3Z {\n background: var(--white);\n border-radius: var(--borderRadius); }\n .Card-module_card__31o3Z.Card-module_shadow__2lpYq {\n box-shadow: var(--shadow); }\n";
|
|
459
|
+
var styles$G = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
460
|
+
styleInject(css_248z$G);
|
|
482
461
|
|
|
483
462
|
const Card = (props) => {
|
|
484
463
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
485
464
|
const getCssClasses = () => {
|
|
486
465
|
const cssClasses = [];
|
|
487
|
-
cssClasses.push(styles$
|
|
488
|
-
shadow && cssClasses.push(styles$
|
|
466
|
+
cssClasses.push(styles$G.card);
|
|
467
|
+
shadow && cssClasses.push(styles$G.shadow);
|
|
489
468
|
className && cssClasses.push(className);
|
|
490
469
|
return cssClasses.filter(css => css).join(' ');
|
|
491
470
|
};
|
|
492
471
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
493
472
|
};
|
|
494
473
|
|
|
495
|
-
var css_248z$
|
|
496
|
-
var styles$
|
|
497
|
-
styleInject(css_248z$
|
|
474
|
+
var css_248z$F = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
|
|
475
|
+
var styles$F = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
476
|
+
styleInject(css_248z$F);
|
|
498
477
|
|
|
499
478
|
const CardBody = (props) => {
|
|
500
479
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
501
480
|
const getCssClasses = () => {
|
|
502
481
|
const cssClasses = [];
|
|
503
|
-
cssClasses.push(styles$
|
|
482
|
+
cssClasses.push(styles$F.cardBody);
|
|
504
483
|
className && cssClasses.push(className);
|
|
505
484
|
return cssClasses.filter(css => css).join(' ');
|
|
506
485
|
};
|
|
507
486
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
508
487
|
};
|
|
509
488
|
|
|
510
|
-
var css_248z$
|
|
511
|
-
var styles$
|
|
512
|
-
styleInject(css_248z$
|
|
489
|
+
var css_248z$E = ".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 .CardFooter-module_cardFooter__3dYKa:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); }\n";
|
|
490
|
+
var styles$E = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
491
|
+
styleInject(css_248z$E);
|
|
513
492
|
|
|
514
493
|
const CardFooter = (props) => {
|
|
515
494
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
516
495
|
const getCssClasses = () => {
|
|
517
496
|
const cssClasses = [];
|
|
518
|
-
cssClasses.push(styles$
|
|
497
|
+
cssClasses.push(styles$E.cardFooter);
|
|
519
498
|
className && cssClasses.push(className);
|
|
520
499
|
return cssClasses.filter(css => css).join(' ');
|
|
521
500
|
};
|
|
522
501
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
523
502
|
};
|
|
524
503
|
|
|
525
|
-
var css_248z$
|
|
526
|
-
var styles$
|
|
527
|
-
styleInject(css_248z$
|
|
504
|
+
var css_248z$D = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important; }\n";
|
|
505
|
+
var styles$D = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
506
|
+
styleInject(css_248z$D);
|
|
528
507
|
|
|
529
508
|
const CardSubtitle = (props) => {
|
|
530
509
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
531
510
|
const getCssClasses = () => {
|
|
532
511
|
const cssClasses = [];
|
|
533
|
-
cssClasses.push(styles$
|
|
512
|
+
cssClasses.push(styles$D.cardSubtitle);
|
|
534
513
|
className && cssClasses.push(className);
|
|
535
514
|
return cssClasses.filter(css => css).join(' ');
|
|
536
515
|
};
|
|
537
516
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
538
517
|
};
|
|
539
518
|
|
|
540
|
-
var css_248z$
|
|
541
|
-
var styles$
|
|
542
|
-
styleInject(css_248z$
|
|
519
|
+
var css_248z$C = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0; }\n";
|
|
520
|
+
var styles$C = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
521
|
+
styleInject(css_248z$C);
|
|
543
522
|
|
|
544
523
|
const CardText = (props) => {
|
|
545
524
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
546
525
|
const getCssClasses = () => {
|
|
547
526
|
const cssClasses = [];
|
|
548
|
-
cssClasses.push(styles$
|
|
527
|
+
cssClasses.push(styles$C.cardText);
|
|
549
528
|
className && cssClasses.push(className);
|
|
550
529
|
return cssClasses.filter(css => css).join(' ');
|
|
551
530
|
};
|
|
552
531
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
553
532
|
};
|
|
554
533
|
|
|
555
|
-
var css_248z$
|
|
556
|
-
var styles$
|
|
557
|
-
styleInject(css_248z$
|
|
534
|
+
var css_248z$B = ".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";
|
|
535
|
+
var styles$B = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
536
|
+
styleInject(css_248z$B);
|
|
558
537
|
|
|
559
538
|
const CardTitle = (props) => {
|
|
560
539
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
561
540
|
const getCssClasses = () => {
|
|
562
541
|
const cssClasses = [];
|
|
563
|
-
cssClasses.push(styles$
|
|
542
|
+
cssClasses.push(styles$B.cardTitle);
|
|
564
543
|
className && cssClasses.push(className);
|
|
565
544
|
return cssClasses.filter(css => css).join(' ');
|
|
566
545
|
};
|
|
567
546
|
return (React.createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
568
547
|
};
|
|
569
548
|
|
|
570
|
-
var css_248z$
|
|
571
|
-
var styles$
|
|
572
|
-
styleInject(css_248z$
|
|
549
|
+
var css_248z$A = ".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";
|
|
550
|
+
var styles$A = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
551
|
+
styleInject(css_248z$A);
|
|
573
552
|
|
|
574
553
|
const CardImage = (props) => {
|
|
575
554
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
576
555
|
const getCssClasses = () => {
|
|
577
556
|
const cssClasses = [];
|
|
578
|
-
cssClasses.push(styles$
|
|
557
|
+
cssClasses.push(styles$A.cardImage);
|
|
579
558
|
className && cssClasses.push(className);
|
|
580
559
|
return cssClasses.filter(css => css).join(' ');
|
|
581
560
|
};
|
|
@@ -624,15 +603,31 @@ const CircleSolidIcon = () => (React.createElement("svg", { "aria-hidden": "true
|
|
|
624
603
|
const ChevronLeftSolidIcon = () => (React.createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
625
604
|
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" })));
|
|
626
605
|
|
|
627
|
-
var css_248z$
|
|
628
|
-
var styles$
|
|
629
|
-
styleInject(css_248z$
|
|
606
|
+
var css_248z$z = ".Icon-module_icon__2etAT {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px; }\n .Icon-module_icon__2etAT svg {\n width: inherit;\n height: inherit; }\n .Icon-module_icon__2etAT.Icon-module_primary__32Mh4 {\n color: var(--primary); }\n .Icon-module_icon__2etAT.Icon-module_accent__2U_no {\n color: var(--accent); }\n .Icon-module_icon__2etAT.Icon-module_secondary__3cMmx {\n color: var(--secondary); }\n .Icon-module_icon__2etAT.Icon-module_light__2SugS {\n color: var(--light); }\n .Icon-module_icon__2etAT.Icon-module_dark__GWMzb {\n color: var(--dark); }\n";
|
|
607
|
+
var styles$z = {"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"};
|
|
608
|
+
styleInject(css_248z$z);
|
|
609
|
+
|
|
610
|
+
const Icon = (props) => {
|
|
611
|
+
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
612
|
+
const getCssClasses = () => {
|
|
613
|
+
const cssClasses = [];
|
|
614
|
+
cssClasses.push(styles$z.icon);
|
|
615
|
+
iconColor && cssClasses.push(styles$z[iconColor]);
|
|
616
|
+
className && cssClasses.push(className);
|
|
617
|
+
return cssClasses.filter(css => css).join(' ');
|
|
618
|
+
};
|
|
619
|
+
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
620
|
+
};
|
|
621
|
+
|
|
622
|
+
var css_248z$y = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important; }\n";
|
|
623
|
+
var styles$y = {"typography":"Typography-module_typography__2bM6E"};
|
|
624
|
+
styleInject(css_248z$y);
|
|
630
625
|
|
|
631
626
|
const Wrapper = (props) => {
|
|
632
627
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
633
628
|
const getCssClasses = () => {
|
|
634
629
|
const cssClasses = [];
|
|
635
|
-
cssClasses.push(styles$
|
|
630
|
+
cssClasses.push(styles$y.typography);
|
|
636
631
|
className && cssClasses.push(className);
|
|
637
632
|
return cssClasses.filter(css => css).join(' ');
|
|
638
633
|
};
|
|
@@ -643,21 +638,21 @@ const Typography = (_a) => {
|
|
|
643
638
|
return (React.createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
644
639
|
};
|
|
645
640
|
|
|
646
|
-
var css_248z$
|
|
647
|
-
var styles$
|
|
648
|
-
styleInject(css_248z$
|
|
641
|
+
var css_248z$x = ".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 .IconButton-module_iconButton__1xqrL:hover {\n cursor: pointer; }\n .IconButton-module_iconButton__1xqrL.IconButton-module_shadow__5U4-_ {\n box-shadow: var(--shadow); }\n .IconButton-module_iconButton__1xqrL.IconButton-module_md__1lmDL {\n width: 48px;\n height: 48px; }\n .IconButton-module_iconButton__1xqrL.IconButton-module_lg__1O2Uy {\n width: 56px;\n height: 56px; }\n .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG {\n padding: 0;\n background: transparent;\n color: inherit; }\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 .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_primary__qRw4T {\n color: var(--primary); }\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-dark); }\n .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_secondary__1lzNL {\n color: var(--secondary); }\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-dark); }\n .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_accent__exm5t {\n color: var(--accent); }\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-dark); }\n .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_light__2nWhD {\n color: var(--light); }\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-dark); }\n .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_dark__1e6bR {\n color: var(--dark); }\n .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_dark__1e6bR:hover, .IconButton-module_iconButton__1xqrL.IconButton-module_text__33RrG.IconButton-module_dark__1e6bR.IconButton-module_active__2tJut {\n color: var(--dark-dark); }\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 .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 .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_primary__qRw4T {\n background-color: var(--primary);\n color: var(--white); }\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 .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_secondary__1lzNL {\n background-color: var(--secondary);\n color: var(--white); }\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 .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_accent__exm5t {\n background-color: var(--accent);\n color: var(--white); }\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 .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_light__2nWhD {\n background-color: var(--light);\n color: var(--dark); }\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 .IconButton-module_iconButton__1xqrL.IconButton-module_contained__gWulJ.IconButton-module_dark__1e6bR {\n background-color: var(--dark);\n color: var(--white); }\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 .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";
|
|
642
|
+
var styles$x = {"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"};
|
|
643
|
+
styleInject(css_248z$x);
|
|
649
644
|
|
|
650
645
|
const IconButton = (props) => {
|
|
651
646
|
const { children, icon, label, variant = VARIANT.text, color = COLOR.dark, size = SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "label", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
652
647
|
const getCssClasses = () => {
|
|
653
648
|
const cssClasses = [];
|
|
654
|
-
cssClasses.push(styles$
|
|
655
|
-
cssClasses.push(styles$
|
|
656
|
-
cssClasses.push(styles$
|
|
657
|
-
cssClasses.push(styles$
|
|
658
|
-
isActive && cssClasses.push(styles$
|
|
659
|
-
disabled && cssClasses.push(styles$
|
|
660
|
-
shadow && cssClasses.push(styles$
|
|
649
|
+
cssClasses.push(styles$x[color]);
|
|
650
|
+
cssClasses.push(styles$x[variant]);
|
|
651
|
+
cssClasses.push(styles$x[size]);
|
|
652
|
+
cssClasses.push(styles$x.iconButton);
|
|
653
|
+
isActive && cssClasses.push(styles$x.active);
|
|
654
|
+
disabled && cssClasses.push(styles$x.disabled);
|
|
655
|
+
shadow && cssClasses.push(styles$x.shadow);
|
|
661
656
|
className && cssClasses.push(className);
|
|
662
657
|
return cssClasses.filter(css => css).join(' ');
|
|
663
658
|
};
|
|
@@ -666,9 +661,9 @@ const IconButton = (props) => {
|
|
|
666
661
|
label && React.createElement(Typography, null, label)));
|
|
667
662
|
};
|
|
668
663
|
|
|
669
|
-
var css_248z$
|
|
670
|
-
var styles$
|
|
671
|
-
styleInject(css_248z$
|
|
664
|
+
var css_248z$w = ".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 .Checkbox-module_checkboxContainer__2oWhu label {\n margin-bottom: 0;\n margin-left: 0; }\n .Checkbox-module_checkboxContainer__2oWhu label:hover {\n cursor: pointer; }\n\n.Checkbox-module_checkboxLabel__27Y6U.Checkbox-module_disabled__3EXUd {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed; }\n";
|
|
665
|
+
var styles$w = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
666
|
+
styleInject(css_248z$w);
|
|
672
667
|
|
|
673
668
|
const Checkbox = (props) => {
|
|
674
669
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -700,27 +695,29 @@ const Checkbox = (props) => {
|
|
|
700
695
|
};
|
|
701
696
|
const handleClick = () => {
|
|
702
697
|
var _a;
|
|
703
|
-
|
|
704
|
-
|
|
698
|
+
if (!disabled && !readOnly) {
|
|
699
|
+
setIsChecked(!isChecked);
|
|
700
|
+
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
701
|
+
}
|
|
705
702
|
};
|
|
706
|
-
return (React.createElement("div", { className: styles$
|
|
703
|
+
return (React.createElement("div", { className: styles$w.checkboxContainer },
|
|
707
704
|
React.createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
708
|
-
React.createElement("label", { onClick: handleClick, className: styles$
|
|
705
|
+
React.createElement("label", { onClick: handleClick, className: styles$w.checkboxLabel + ' ' + (disabled ? styles$w['disabled'] : undefined) }, label),
|
|
709
706
|
React.createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
710
707
|
};
|
|
711
708
|
|
|
712
|
-
var css_248z$
|
|
713
|
-
var styles$
|
|
714
|
-
styleInject(css_248z$
|
|
709
|
+
var css_248z$v = ".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 .Chip-module_chip__1cghp svg {\n width: 18px;\n height: 18px; }\n .Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c {\n margin-left: 5px; }\n .Chip-module_chip__1cghp .Chip-module_deleteIcon__34X9c:hover {\n cursor: pointer; }\n .Chip-module_chip__1cghp.Chip-module_primary__198Dq {\n background: var(--primary);\n color: var(--primary-contrast-text); }\n .Chip-module_chip__1cghp.Chip-module_secondary__14H0b {\n background: var(--secondary);\n color: var(--secondary-contrast-text); }\n .Chip-module_chip__1cghp.Chip-module_accent__2LkWr {\n background: var(--accent);\n color: var(--accent-contrast-text); }\n .Chip-module_chip__1cghp.Chip-module_light__2zVYs {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Chip-module_chip__1cghp.Chip-module_dark__2Bg-S {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover {\n cursor: pointer; }\n .Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_primary__198Dq {\n background: var(--primary-dark); }\n .Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_secondary__14H0b {\n background: var(--secondary-dark); }\n .Chip-module_chip__1cghp.Chip-module_clickable__2Y4x7:hover.Chip-module_accent__2LkWr {\n background: var(--accent-dark); }\n .Chip-module_chip__1cghp.Chip-module_shadow__3TYny {\n box-shadow: var(--shadow); }\n";
|
|
710
|
+
var styles$v = {"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"};
|
|
711
|
+
styleInject(css_248z$v);
|
|
715
712
|
|
|
716
713
|
const Chip = (props) => {
|
|
717
714
|
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"]);
|
|
718
715
|
const getCssClass = () => {
|
|
719
716
|
const cssClasses = [];
|
|
720
|
-
cssClasses.push(styles$
|
|
721
|
-
cssClasses.push(styles$
|
|
722
|
-
shadow && cssClasses.push(styles$
|
|
723
|
-
onClick && cssClasses.push(styles$
|
|
717
|
+
cssClasses.push(styles$v.chip);
|
|
718
|
+
cssClasses.push(styles$v[color]);
|
|
719
|
+
shadow && cssClasses.push(styles$v['shadow']);
|
|
720
|
+
onClick && cssClasses.push(styles$v['clickable']);
|
|
724
721
|
className && cssClasses.push(className);
|
|
725
722
|
return cssClasses.filter(r => r).join(' ');
|
|
726
723
|
};
|
|
@@ -730,10 +727,23 @@ const Chip = (props) => {
|
|
|
730
727
|
};
|
|
731
728
|
return (React.createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
732
729
|
React.createElement("div", null, children),
|
|
733
|
-
isDeletable && (React.createElement("div", { className: styles$
|
|
730
|
+
isDeletable && (React.createElement("div", { className: styles$v.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
734
731
|
};
|
|
735
732
|
|
|
736
|
-
|
|
733
|
+
var css_248z$u = ".FormLabel-module_formLabel__1Zv0W {\n margin-bottom: .5rem; }\n";
|
|
734
|
+
var styles$u = {"formLabel":"FormLabel-module_formLabel__1Zv0W"};
|
|
735
|
+
styleInject(css_248z$u);
|
|
736
|
+
|
|
737
|
+
const FormLabel = (props) => {
|
|
738
|
+
const { children, className, htmlFor } = props, rest = __rest(props, ["children", "className", "htmlFor"]);
|
|
739
|
+
const getCssClasses = () => {
|
|
740
|
+
const cssClasses = [];
|
|
741
|
+
cssClasses.push(styles$u.formLabel);
|
|
742
|
+
className && cssClasses.push(className);
|
|
743
|
+
return cssClasses.filter(css => css).join(' ');
|
|
744
|
+
};
|
|
745
|
+
return (React.createElement("label", Object.assign({ htmlFor: htmlFor, className: getCssClasses() }, rest), children));
|
|
746
|
+
};
|
|
737
747
|
|
|
738
748
|
const FormGroup = (props) => {
|
|
739
749
|
const { children, className = 'mb-1' } = props;
|
|
@@ -766,9 +776,9 @@ const FileInput = (props) => {
|
|
|
766
776
|
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))));
|
|
767
777
|
};
|
|
768
778
|
|
|
769
|
-
var css_248z$
|
|
770
|
-
var styles$
|
|
771
|
-
styleInject(css_248z$
|
|
779
|
+
var css_248z$t = ".Select-module_selectContainer__2oizY {\n position: relative; }\n\n.Select-module_select__MSqgU {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .Select-module_select__MSqgU:hover {\n cursor: pointer; }\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";
|
|
780
|
+
var styles$t = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
781
|
+
styleInject(css_248z$t);
|
|
772
782
|
|
|
773
783
|
const Select = (props) => {
|
|
774
784
|
var _a, _b, _c;
|
|
@@ -781,7 +791,7 @@ const Select = (props) => {
|
|
|
781
791
|
const getCssClass = () => {
|
|
782
792
|
const cssClasses = [];
|
|
783
793
|
className && cssClasses.push(className);
|
|
784
|
-
cssClasses.push(styles$
|
|
794
|
+
cssClasses.push(styles$t.select);
|
|
785
795
|
return cssClasses.filter(r => r).join(' ');
|
|
786
796
|
};
|
|
787
797
|
useEffect(() => {
|
|
@@ -900,7 +910,7 @@ const Select = (props) => {
|
|
|
900
910
|
}
|
|
901
911
|
};
|
|
902
912
|
return (React.createElement(React.Fragment, null,
|
|
903
|
-
React.createElement("div", { ref: selectConainter, className: styles$
|
|
913
|
+
React.createElement("div", { ref: selectConainter, className: styles$t.selectContainer },
|
|
904
914
|
React.createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
905
915
|
!multiple && renderSingleViewModel(),
|
|
906
916
|
multiple && renderMultipleViewModel(),
|
|
@@ -908,7 +918,7 @@ const Select = (props) => {
|
|
|
908
918
|
React.createElement(ChevronDownSolidIcon, null))),
|
|
909
919
|
isShow &&
|
|
910
920
|
createPortal(React.createElement(React.Fragment, null,
|
|
911
|
-
React.createElement("div", { className: styles$
|
|
921
|
+
React.createElement("div", { className: styles$t.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 } },
|
|
912
922
|
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) },
|
|
913
923
|
multiple &&
|
|
914
924
|
React.createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -916,23 +926,40 @@ const Select = (props) => {
|
|
|
916
926
|
React.createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
917
927
|
};
|
|
918
928
|
|
|
919
|
-
var css_248z$
|
|
920
|
-
var styles$
|
|
921
|
-
styleInject(css_248z$
|
|
929
|
+
var css_248z$s = "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 textarea:focus {\n outline: none !important;\n border-color: var(--primary); }\n";
|
|
930
|
+
var styles$s = {};
|
|
931
|
+
styleInject(css_248z$s);
|
|
922
932
|
|
|
923
933
|
const Textarea = (props) => {
|
|
924
934
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
925
935
|
const getCssClass = () => {
|
|
926
936
|
const cssClasses = [];
|
|
927
|
-
cssClasses.push(styles$
|
|
937
|
+
cssClasses.push(styles$s.textarea);
|
|
928
938
|
className && cssClasses.push(className);
|
|
929
939
|
return cssClasses.filter(r => r).join(' ');
|
|
930
940
|
};
|
|
931
941
|
return (React.createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
932
942
|
};
|
|
933
943
|
|
|
944
|
+
var css_248z$r = ".FormInput-module_formInput__1gAYi {\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 color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid #ced4da;\n -webkit-appearance: none;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.08);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n .FormInput-module_formInput__1gAYi:focus {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }\n";
|
|
945
|
+
var styles$r = {"formInput":"FormInput-module_formInput__1gAYi"};
|
|
946
|
+
styleInject(css_248z$r);
|
|
947
|
+
|
|
934
948
|
const FormInput = (props) => {
|
|
935
|
-
const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onChange, onBlur, onKeyDown } = props;
|
|
949
|
+
const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
950
|
+
const getCssClasses = () => {
|
|
951
|
+
const cssClasses = [];
|
|
952
|
+
cssClasses.push(styles$r.formInput);
|
|
953
|
+
className && cssClasses.push(className);
|
|
954
|
+
!isValid && cssClasses.push('is-invalid');
|
|
955
|
+
return cssClasses.filter(css => css).join(' ');
|
|
956
|
+
};
|
|
957
|
+
const handleOnInput = (value, type, name) => {
|
|
958
|
+
onInput && onInput({ value, type, name });
|
|
959
|
+
};
|
|
960
|
+
const handleOnChange = (value, type, name) => {
|
|
961
|
+
onChange && onChange({ value, type, name });
|
|
962
|
+
};
|
|
936
963
|
return (React.createElement(Fragment, null,
|
|
937
964
|
(type === 'text' ||
|
|
938
965
|
type === 'date' ||
|
|
@@ -943,24 +970,32 @@ const FormInput = (props) => {
|
|
|
943
970
|
type === 'color' ||
|
|
944
971
|
type === 'time')
|
|
945
972
|
&&
|
|
946
|
-
React.createElement("input", { id: name, name: name, type: type, className:
|
|
973
|
+
React.createElement("input", { id: name, name: name, type: type, className: getCssClasses(), value: value, autoFocus: autoFocus, onInput: e => handleOnInput(e.target.value, type, name), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), onBlur: onBlur, placeholder: placeholder, readOnly: readonly, disabled: disabled, onKeyDown: onKeyDown }),
|
|
947
974
|
type === 'file' &&
|
|
948
|
-
React.createElement(FileInput, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus, readOnly: readonly, disabled: disabled, onChange: e =>
|
|
975
|
+
React.createElement(FileInput, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus, readOnly: readonly, disabled: disabled, onChange: e => handleOnChange(e.target.value, type, name) }, "choose a file"),
|
|
949
976
|
type === 'textarea' &&
|
|
950
|
-
React.createElement(Textarea, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus,
|
|
977
|
+
React.createElement(Textarea, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus, onInput: e => handleOnInput(e.target.value, type, name), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), placeholder: placeholder, rows: textareaOptions === null || textareaOptions === void 0 ? void 0 : textareaOptions.rows, style: (textareaOptions === null || textareaOptions === void 0 ? void 0 : textareaOptions.resize) !== false ? undefined : { resize: 'none' } }),
|
|
951
978
|
type === 'select' &&
|
|
952
|
-
React.createElement(Select, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, multiple: selectOptions === null || selectOptions === void 0 ? void 0 : selectOptions.multiple, onChange: e =>
|
|
979
|
+
React.createElement(Select, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, multiple: selectOptions === null || selectOptions === void 0 ? void 0 : selectOptions.multiple, onChange: e => handleOnChange(e, type, name), onKeyDown: onKeyDown, options: options }),
|
|
953
980
|
type === 'autocomplete' &&
|
|
954
|
-
React.createElement(AutoComplete, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, openOnFocus: autoCompleteOptions === null || autoCompleteOptions === void 0 ? void 0 : autoCompleteOptions.openOnFocus, onChange: e =>
|
|
981
|
+
React.createElement(AutoComplete, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, openOnFocus: autoCompleteOptions === null || autoCompleteOptions === void 0 ? void 0 : autoCompleteOptions.openOnFocus, onChange: e => handleOnChange(e, type, name), onKeyDown: onKeyDown, options: options }),
|
|
955
982
|
type === 'checkbox' &&
|
|
956
|
-
React.createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''), onChange: e =>
|
|
983
|
+
React.createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).checked, type, name), checked: value, onKeyDown: onKeyDown }),
|
|
957
984
|
type === 'radio' &&
|
|
958
985
|
React.createElement(Fragment, null, options.map((option) => React.createElement("div", { className: "form-check", key: option.id },
|
|
959
|
-
React.createElement("input", { id: option.id ? option.id : option.value, name: name, type: "radio", className: "form-check-input", onChange: e =>
|
|
986
|
+
React.createElement("input", { id: option.id ? option.id : option.value, name: name, type: "radio", className: "form-check-input", onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), value: option.value, checked: value === option.value, onKeyDown: onKeyDown }),
|
|
960
987
|
React.createElement("label", { className: "form-check-label", htmlFor: option.id }, option.label))))));
|
|
961
988
|
};
|
|
962
989
|
|
|
963
|
-
const FormHint = (
|
|
990
|
+
const FormHint = (props) => {
|
|
991
|
+
const { children, className = 'form-text text-muted' } = props;
|
|
992
|
+
const getCssClasses = () => {
|
|
993
|
+
const cssClasses = [];
|
|
994
|
+
className && cssClasses.push(className);
|
|
995
|
+
return cssClasses.filter(css => css).join(' ');
|
|
996
|
+
};
|
|
997
|
+
return (React.createElement("small", { className: getCssClasses() }, children));
|
|
998
|
+
};
|
|
964
999
|
|
|
965
1000
|
const FormError = (props) => {
|
|
966
1001
|
const { className = 'invalid-feedback', errors = [] } = props;
|
|
@@ -1139,11 +1174,11 @@ class Form extends Component {
|
|
|
1139
1174
|
return (React.createElement(FormGroup, { key: fieldKey, className: this.getFormGroupCssClass(fieldKey) },
|
|
1140
1175
|
this.getControl(fieldKey).config.labelPosition !== 'behind' && this.getControl(fieldKey).type !== 'checkbox' &&
|
|
1141
1176
|
this.renderLabel(fieldKey, this.getControl(fieldKey).config.label, this.getControl(fieldKey).config.labelClassName),
|
|
1142
|
-
React.createElement(FormInput, { autoFocus: this.getControl(fieldKey).config.autoFocus, className: this.getControl(fieldKey).config.formControlClassName, isValid: !this.isInvalid(fieldKey), label: this.getControl(fieldKey).config.label, name: fieldKey, options: this.getControl(fieldKey).config.options, placeholder: this.getControl(fieldKey).config.placeholder, textareaOptions: this.getControl(fieldKey).config.textareaOptions, selectOptions: this.getControl(fieldKey).config.selectOptions, autoCompleteOptions: this.getControl(fieldKey).config.autoCompleteOptions, type: this.getControl(fieldKey).type, value: this.getControl(fieldKey).value, disabled: this.getControl(fieldKey).config.disabled, readonly: this.getControl(fieldKey).config.readonly, onChange: (name, value, type) => this.handleInputChange(name, value, type), onBlur: (e) => this.handleOnBlur(e), onKeyDown: (e) => this.handleOnKeyDown(e) }),
|
|
1177
|
+
React.createElement(FormInput, { autoFocus: this.getControl(fieldKey).config.autoFocus, className: this.getControl(fieldKey).config.formControlClassName, isValid: !this.isInvalid(fieldKey), label: this.getControl(fieldKey).config.label, name: fieldKey, options: this.getControl(fieldKey).config.options, placeholder: this.getControl(fieldKey).config.placeholder, textareaOptions: this.getControl(fieldKey).config.textareaOptions, selectOptions: this.getControl(fieldKey).config.selectOptions, autoCompleteOptions: this.getControl(fieldKey).config.autoCompleteOptions, type: this.getControl(fieldKey).type, value: this.getControl(fieldKey).value, disabled: this.getControl(fieldKey).config.disabled, readonly: this.getControl(fieldKey).config.readonly, onChange: ({ name, value, type }) => this.handleInputChange(name, value, type), onBlur: (e) => this.handleOnBlur(e), onKeyDown: (e) => this.handleOnKeyDown(e) }),
|
|
1143
1178
|
this.getControl(fieldKey).config.labelPosition === 'behind' && this.getControl(fieldKey).type !== 'checkbox' &&
|
|
1144
1179
|
this.renderLabel(fieldKey, this.getControl(fieldKey).config.label, this.getControl(fieldKey).config.labelClassName),
|
|
1145
1180
|
this.getControl(fieldKey).config.hint &&
|
|
1146
|
-
React.createElement(FormHint,
|
|
1181
|
+
React.createElement(FormHint, null, this.getControl(fieldKey).config.hint),
|
|
1147
1182
|
this.getControl(fieldKey).errors &&
|
|
1148
1183
|
React.createElement(FormError, { errors: this.getControl(fieldKey).errors })));
|
|
1149
1184
|
})));
|
|
@@ -1846,7 +1881,7 @@ var styles$d = {"snackbar":"Snackbar-module_snackbar__3AF3D","bounceIn":"Snackba
|
|
|
1846
1881
|
styleInject(css_248z$d);
|
|
1847
1882
|
|
|
1848
1883
|
const Snackbar = (props) => {
|
|
1849
|
-
const {
|
|
1884
|
+
const { children, color = COLOR.dark, actionText = 'ok', onOk } = props;
|
|
1850
1885
|
const getCssClasses = () => {
|
|
1851
1886
|
const cssClasses = [];
|
|
1852
1887
|
cssClasses.push(styles$d.snackbar);
|
|
@@ -1854,11 +1889,11 @@ const Snackbar = (props) => {
|
|
|
1854
1889
|
cssClasses.push(styles$d[color]);
|
|
1855
1890
|
return cssClasses.filter(css => css).join(' ');
|
|
1856
1891
|
};
|
|
1857
|
-
const handleClickAction = () => {
|
|
1858
|
-
onOk && onOk();
|
|
1892
|
+
const handleClickAction = (e) => {
|
|
1893
|
+
onOk && onOk(e);
|
|
1859
1894
|
};
|
|
1860
1895
|
return (React.createElement("div", { className: getCssClasses() },
|
|
1861
|
-
React.createElement("div", { className: styles$d.text },
|
|
1896
|
+
React.createElement("div", { className: styles$d.text }, children),
|
|
1862
1897
|
React.createElement("div", { className: styles$d.action + " text-accent", onClick: handleClickAction },
|
|
1863
1898
|
React.createElement("span", null, actionText))));
|
|
1864
1899
|
};
|
|
@@ -1883,7 +1918,7 @@ class SnackbarService {
|
|
|
1883
1918
|
resolve();
|
|
1884
1919
|
this.hide();
|
|
1885
1920
|
};
|
|
1886
|
-
render(React.createElement(Snackbar, {
|
|
1921
|
+
render(React.createElement(Snackbar, { color: mergedOptions.color, actionText: mergedOptions.actionText, onOk: handleOk }, message), this.container);
|
|
1887
1922
|
});
|
|
1888
1923
|
}
|
|
1889
1924
|
hide() {
|
|
@@ -1941,14 +1976,14 @@ var styles$a = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs
|
|
|
1941
1976
|
styleInject(css_248z$a);
|
|
1942
1977
|
|
|
1943
1978
|
const SpeedDialAction = (props) => {
|
|
1944
|
-
const { icon, onClick, className } = props;
|
|
1979
|
+
const { icon, color = COLOR.light, onClick, className } = props;
|
|
1945
1980
|
const getCssClasses = () => {
|
|
1946
1981
|
const cssClasses = [];
|
|
1947
1982
|
cssClasses.push(styles$a.speedDialAction);
|
|
1948
1983
|
className && cssClasses.push(className);
|
|
1949
1984
|
return cssClasses.filter(css => css).join(' ');
|
|
1950
1985
|
};
|
|
1951
|
-
return (React.createElement(IconButton, { className: getCssClasses(), icon: icon, color:
|
|
1986
|
+
return (React.createElement(IconButton, { className: getCssClasses(), icon: icon, color: color, variant: VARIANT.contained, shadow: true, onClick: onClick }));
|
|
1952
1987
|
};
|
|
1953
1988
|
|
|
1954
1989
|
const SpeedDialIcon = (props) => {
|