react-asc 18.8.4 → 18.8.8
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/AutoComplete/AutoComplete.d.ts +1 -0
- 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 +6 -0
- package/components/Form/FormLabel/index.d.ts +1 -0
- package/components/List/ListItem.d.ts +1 -1
- package/components/SpeedDial/SpeedDialAction.d.ts +2 -0
- package/index.es.js +277 -237
- package/index.es.js.map +1 -1
- package/index.js +516 -476
- 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.js
CHANGED
|
@@ -95,67 +95,67 @@ function styleInject(css, ref) {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
|
|
98
|
-
var css_248z$
|
|
99
|
-
var styles$
|
|
100
|
-
styleInject(css_248z$
|
|
98
|
+
var css_248z$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";
|
|
99
|
+
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"};
|
|
100
|
+
styleInject(css_248z$V);
|
|
101
101
|
|
|
102
102
|
const Alert = (props) => {
|
|
103
103
|
const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
104
104
|
const getCssClasses = () => {
|
|
105
105
|
const cssClasses = [];
|
|
106
|
-
cssClasses.push(styles$
|
|
106
|
+
cssClasses.push(styles$V.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$V.contained);
|
|
109
|
+
cssClasses.push(styles$V[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$V.outline);
|
|
113
|
+
cssClasses.push(styles$V[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$V['shadow']);
|
|
116
116
|
className && cssClasses.push(className);
|
|
117
117
|
return cssClasses.filter(r => r).join(' ');
|
|
118
118
|
};
|
|
119
|
-
return (React__default[
|
|
119
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var css_248z$
|
|
123
|
-
var styles$
|
|
124
|
-
styleInject(css_248z$
|
|
122
|
+
var css_248z$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";
|
|
123
|
+
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"};
|
|
124
|
+
styleInject(css_248z$U);
|
|
125
125
|
|
|
126
126
|
const AppBar = (props) => {
|
|
127
127
|
const { children, className, color = exports.COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
128
128
|
const getCssClasses = () => {
|
|
129
129
|
const cssClasses = [];
|
|
130
|
-
cssClasses.push(styles$
|
|
131
|
-
cssClasses.push(styles$
|
|
132
|
-
shadow && cssClasses.push(styles$
|
|
130
|
+
cssClasses.push(styles$U[color]);
|
|
131
|
+
cssClasses.push(styles$U.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$U['shadow']);
|
|
133
133
|
className && cssClasses.push(className);
|
|
134
134
|
return cssClasses.filter(r => r).join(' ');
|
|
135
135
|
};
|
|
136
|
-
return (React__default[
|
|
136
|
+
return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
137
137
|
};
|
|
138
138
|
|
|
139
|
-
var css_248z$
|
|
140
|
-
var styles$
|
|
141
|
-
styleInject(css_248z$
|
|
139
|
+
var css_248z$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";
|
|
140
|
+
var styles$T = {"appbarTitle":"AppBarTitle-module_appbarTitle__3J-Z1"};
|
|
141
|
+
styleInject(css_248z$T);
|
|
142
142
|
|
|
143
143
|
const AppBarTitle = (props) => {
|
|
144
144
|
const { children, className, onClick } = props;
|
|
145
145
|
const getCssClass = () => {
|
|
146
146
|
const cssClasses = [];
|
|
147
|
-
cssClasses.push(styles$
|
|
147
|
+
cssClasses.push(styles$T.appbarTitle);
|
|
148
148
|
className && cssClasses.push(className);
|
|
149
149
|
return cssClasses.filter(r => r).join(' ');
|
|
150
150
|
};
|
|
151
|
-
return (React__default[
|
|
151
|
+
return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
152
152
|
};
|
|
153
153
|
|
|
154
154
|
const Backdrop = (props) => {
|
|
155
|
-
const { target = document.body, isTransparent = false, onClick, style } = props;
|
|
155
|
+
const { target = document.body, isTransparent = false, onClick, style } = props, rest = __rest(props, ["target", "isTransparent", "onClick", "style"]);
|
|
156
156
|
const handleClick = (e) => {
|
|
157
157
|
e.stopPropagation();
|
|
158
|
-
onClick && onClick();
|
|
158
|
+
onClick && onClick(e);
|
|
159
159
|
};
|
|
160
160
|
const getCssClasses = () => {
|
|
161
161
|
const cssClasses = [];
|
|
@@ -169,91 +169,91 @@ const Backdrop = (props) => {
|
|
|
169
169
|
const styles = Object.assign({ height: '100%', width: '100%', position: 'absolute' }, style);
|
|
170
170
|
return styles;
|
|
171
171
|
};
|
|
172
|
-
return (reactDom.createPortal(React__default[
|
|
172
|
+
return (reactDom.createPortal(React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
173
173
|
};
|
|
174
174
|
|
|
175
|
-
var css_248z$
|
|
176
|
-
var styles$
|
|
177
|
-
styleInject(css_248z$
|
|
175
|
+
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";
|
|
176
|
+
var styles$S = {"list":"List-module_list__1ax9w"};
|
|
177
|
+
styleInject(css_248z$S);
|
|
178
178
|
|
|
179
179
|
const List = (props) => {
|
|
180
180
|
const { children, className, isFlush } = props;
|
|
181
181
|
const getCssClasses = () => {
|
|
182
182
|
const cssClasses = [];
|
|
183
183
|
if (isFlush) {
|
|
184
|
-
cssClasses.push(styles$
|
|
184
|
+
cssClasses.push(styles$S.flush);
|
|
185
185
|
}
|
|
186
|
-
cssClasses.push(styles$
|
|
186
|
+
cssClasses.push(styles$S.list);
|
|
187
187
|
className && cssClasses.push(className);
|
|
188
188
|
return cssClasses.filter(css => css).join(' ');
|
|
189
189
|
};
|
|
190
|
-
return (React__default[
|
|
190
|
+
return (React__default["default"].createElement("ul", { className: getCssClasses() }, children));
|
|
191
191
|
};
|
|
192
192
|
|
|
193
|
-
var css_248z$
|
|
194
|
-
var styles$
|
|
195
|
-
styleInject(css_248z$
|
|
193
|
+
var css_248z$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";
|
|
194
|
+
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"};
|
|
195
|
+
styleInject(css_248z$R);
|
|
196
196
|
|
|
197
197
|
const ListItem = (props) => {
|
|
198
|
-
const { id, children, color, active, className, isHoverable,
|
|
198
|
+
const { id, children, color, active, className, isHoverable, disabled, onClick } = props;
|
|
199
199
|
const getCssClasses = () => {
|
|
200
200
|
const cssClasses = [];
|
|
201
201
|
if (active) {
|
|
202
|
-
cssClasses.push(styles$
|
|
202
|
+
cssClasses.push(styles$R['active']);
|
|
203
203
|
}
|
|
204
|
-
if (
|
|
205
|
-
cssClasses.push(
|
|
204
|
+
if (disabled) {
|
|
205
|
+
cssClasses.push(styles$R['disabled']);
|
|
206
206
|
}
|
|
207
|
-
color && cssClasses.push(styles$
|
|
208
|
-
cssClasses.push(styles$
|
|
207
|
+
color && cssClasses.push(styles$R[color]);
|
|
208
|
+
cssClasses.push(styles$R.listItem);
|
|
209
209
|
className && cssClasses.push(className);
|
|
210
210
|
return cssClasses.filter(css => css).join(' ');
|
|
211
211
|
};
|
|
212
212
|
const handleClick = (e) => {
|
|
213
|
-
onClick && onClick(e);
|
|
213
|
+
!disabled && onClick && onClick(e);
|
|
214
214
|
};
|
|
215
|
-
return (React__default[
|
|
215
|
+
return (React__default["default"].createElement("li", { id: id, onClick: handleClick, className: getCssClasses() }, children));
|
|
216
216
|
};
|
|
217
217
|
|
|
218
|
-
var css_248z$
|
|
219
|
-
var styles$
|
|
220
|
-
styleInject(css_248z$
|
|
218
|
+
var css_248z$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";
|
|
219
|
+
var styles$Q = {"avatar":"ListItemAvatar-module_avatar__1fjSE"};
|
|
220
|
+
styleInject(css_248z$Q);
|
|
221
221
|
|
|
222
|
-
const ListItemAvatar = ({ avatar }) => (React__default[
|
|
222
|
+
const ListItemAvatar = ({ avatar }) => (React__default["default"].createElement("div", { className: styles$Q.avatar }, avatar));
|
|
223
223
|
|
|
224
|
-
var css_248z$
|
|
225
|
-
var styles$
|
|
226
|
-
styleInject(css_248z$
|
|
224
|
+
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";
|
|
225
|
+
var styles$P = {"icon":"ListItemIcon-module_icon__-nsUy"};
|
|
226
|
+
styleInject(css_248z$P);
|
|
227
227
|
|
|
228
|
-
const ListItemIcon = ({ icon }) => (React__default[
|
|
228
|
+
const ListItemIcon = ({ icon }) => (React__default["default"].createElement("div", { className: styles$P.icon }, icon));
|
|
229
229
|
|
|
230
|
-
var css_248z$
|
|
231
|
-
var styles$
|
|
232
|
-
styleInject(css_248z$
|
|
230
|
+
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";
|
|
231
|
+
var styles$O = {"listItemAction":"ListItemAction-module_listItemAction__26S66"};
|
|
232
|
+
styleInject(css_248z$O);
|
|
233
233
|
|
|
234
|
-
const ListItemAction = ({ children, onClick }) => (React__default[
|
|
234
|
+
const ListItemAction = ({ children, onClick }) => (React__default["default"].createElement("div", { className: styles$O.listItemAction, onClick: e => onClick && onClick(e) }, children));
|
|
235
235
|
|
|
236
|
-
var css_248z$
|
|
237
|
-
var styles$
|
|
238
|
-
styleInject(css_248z$
|
|
236
|
+
var css_248z$N = ".ListItemTextIcon-module_listItemText__ZUWxQ {\n flex: 1; }\n";
|
|
237
|
+
var styles$N = {"listItemText":"ListItemTextIcon-module_listItemText__ZUWxQ"};
|
|
238
|
+
styleInject(css_248z$N);
|
|
239
239
|
|
|
240
240
|
const ListItemText = ({ primary, secondary }) => {
|
|
241
241
|
const getCssClasses = () => {
|
|
242
242
|
const cssClasses = [];
|
|
243
|
-
cssClasses.push(styles$
|
|
243
|
+
cssClasses.push(styles$N.listItemText);
|
|
244
244
|
return cssClasses.filter(css => css).join(' ');
|
|
245
245
|
};
|
|
246
|
-
return (React__default[
|
|
247
|
-
React__default[
|
|
246
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
247
|
+
React__default["default"].createElement(ListItemTextPrimary, null, primary),
|
|
248
248
|
secondary &&
|
|
249
|
-
React__default[
|
|
249
|
+
React__default["default"].createElement(ListItemTextSecondary, null, secondary)));
|
|
250
250
|
};
|
|
251
|
-
const ListItemTextPrimary = ({ children }) => (React__default[
|
|
252
|
-
const ListItemTextSecondary = ({ children }) => (React__default[
|
|
251
|
+
const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
|
|
252
|
+
const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
253
253
|
|
|
254
|
-
var css_248z$
|
|
255
|
-
var styles$
|
|
256
|
-
styleInject(css_248z$
|
|
254
|
+
var css_248z$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";
|
|
255
|
+
var styles$M = {"selectContainer":"AutoComplete-module_selectContainer__SyqtX","select":"AutoComplete-module_select__2_7JD","selectMenu":"AutoComplete-module_selectMenu__2_ybA"};
|
|
256
|
+
styleInject(css_248z$M);
|
|
257
257
|
|
|
258
258
|
// preset value
|
|
259
259
|
// enter -> delay? -> show results
|
|
@@ -261,7 +261,7 @@ styleInject(css_248z$K);
|
|
|
261
261
|
// multiple
|
|
262
262
|
// custom template render items
|
|
263
263
|
const AutoComplete = (props) => {
|
|
264
|
-
const { id, name, className, options = [], openOnFocus = true, disabled, readOnly, debounce = 0, placeholder, showClearButton, onChange, onSelect, value } = props;
|
|
264
|
+
const { id, name, className, options = [], openOnFocus = true, disabled, readOnly, debounce = 0, placeholder, showNoEntry = true, showClearButton, onChange, onSelect, value } = props;
|
|
265
265
|
const [model, setModel] = React.useState('');
|
|
266
266
|
const [searchText, setSearchText] = React.useState('');
|
|
267
267
|
const [isShow, setIsShow] = React.useState(false);
|
|
@@ -278,7 +278,12 @@ const AutoComplete = (props) => {
|
|
|
278
278
|
const optionsOrigin = JSON.parse(JSON.stringify(options));
|
|
279
279
|
const regex = new RegExp(searchText.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'), 'gi');
|
|
280
280
|
const optionsFiltered = optionsOrigin.filter(o => { var _a; return (_a = o.label) === null || _a === void 0 ? void 0 : _a.match(regex); });
|
|
281
|
-
|
|
281
|
+
if (optionsFiltered.length === 0 && showNoEntry) {
|
|
282
|
+
setOptionsTemp([{ value: '', label: '- no entry found -' }]);
|
|
283
|
+
}
|
|
284
|
+
else {
|
|
285
|
+
setOptionsTemp(optionsFiltered);
|
|
286
|
+
}
|
|
282
287
|
}
|
|
283
288
|
}, [options]);
|
|
284
289
|
useDebounce(() => { onChange && onChange(searchText); }, debounce, [searchText]);
|
|
@@ -304,7 +309,7 @@ const AutoComplete = (props) => {
|
|
|
304
309
|
const getCssClass = () => {
|
|
305
310
|
const cssClasses = [];
|
|
306
311
|
className && cssClasses.push(className);
|
|
307
|
-
cssClasses.push(styles$
|
|
312
|
+
cssClasses.push(styles$M.select);
|
|
308
313
|
return cssClasses.filter(r => r).join(' ');
|
|
309
314
|
};
|
|
310
315
|
const show = () => setIsShow(true);
|
|
@@ -328,79 +333,62 @@ const AutoComplete = (props) => {
|
|
|
328
333
|
setModel('');
|
|
329
334
|
setSearchText('');
|
|
330
335
|
};
|
|
331
|
-
return (React__default[
|
|
332
|
-
React__default[
|
|
333
|
-
React__default[
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
React__default[
|
|
339
|
-
React__default[
|
|
340
|
-
React__default[
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
var
|
|
346
|
-
|
|
347
|
-
styleInject(css_248z$J);
|
|
336
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$M.selectContainer },
|
|
337
|
+
React__default["default"].createElement("div", { className: "d-flex" },
|
|
338
|
+
React__default["default"].createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, placeholder: placeholder, value: model }),
|
|
339
|
+
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
340
|
+
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
341
|
+
isShow &&
|
|
342
|
+
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
343
|
+
React__default["default"].createElement("div", { className: styles$M.selectMenu },
|
|
344
|
+
React__default["default"].createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), disabled: !option.value },
|
|
345
|
+
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
346
|
+
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
347
|
+
};
|
|
348
|
+
|
|
349
|
+
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";
|
|
350
|
+
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_"};
|
|
351
|
+
styleInject(css_248z$L);
|
|
348
352
|
|
|
349
353
|
const Badge = (props) => {
|
|
350
354
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
351
355
|
const getCssClassesBadgeContainer = () => {
|
|
352
356
|
const cssClasses = [];
|
|
353
|
-
cssClasses.push(styles$
|
|
357
|
+
cssClasses.push(styles$L.badgeContainer);
|
|
354
358
|
className && cssClasses.push(className);
|
|
355
359
|
return cssClasses.filter(css => css).join(' ');
|
|
356
360
|
};
|
|
357
361
|
const getCssClassesBadge = () => {
|
|
358
362
|
const cssClasses = [];
|
|
359
|
-
cssClasses.push(styles$
|
|
360
|
-
cssClasses.push(styles$
|
|
363
|
+
cssClasses.push(styles$L.badge);
|
|
364
|
+
cssClasses.push(styles$L[color]);
|
|
361
365
|
return cssClasses.filter(css => css).join(' ');
|
|
362
366
|
};
|
|
363
|
-
return (React__default[
|
|
367
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
364
368
|
children,
|
|
365
|
-
React__default[
|
|
366
|
-
};
|
|
367
|
-
|
|
368
|
-
var css_248z$I = ".Icon-module_icon__2etAT {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px;\n}\n.Icon-module_icon__2etAT svg {\n width: inherit;\n height: inherit;\n}\n.Icon-module_icon__2etAT.Icon-module_primary__32Mh4 {\n color: var(--primary);\n}\n.Icon-module_icon__2etAT.Icon-module_accent__2U_no {\n color: var(--accent);\n}\n.Icon-module_icon__2etAT.Icon-module_secondary__3cMmx {\n color: var(--secondary);\n}\n.Icon-module_icon__2etAT.Icon-module_light__2SugS {\n color: var(--light);\n}\n.Icon-module_icon__2etAT.Icon-module_dark__GWMzb {\n color: var(--dark);\n}";
|
|
369
|
-
var styles$I = {"icon":"Icon-module_icon__2etAT","primary":"Icon-module_primary__32Mh4","accent":"Icon-module_accent__2U_no","secondary":"Icon-module_secondary__3cMmx","light":"Icon-module_light__2SugS","dark":"Icon-module_dark__GWMzb"};
|
|
370
|
-
styleInject(css_248z$I);
|
|
371
|
-
|
|
372
|
-
const Icon = (props) => {
|
|
373
|
-
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
374
|
-
const getCssClasses = () => {
|
|
375
|
-
const cssClasses = [];
|
|
376
|
-
cssClasses.push(styles$I.icon);
|
|
377
|
-
iconColor && cssClasses.push(styles$I[iconColor]);
|
|
378
|
-
className && cssClasses.push(className);
|
|
379
|
-
return cssClasses.filter(css => css).join(' ');
|
|
380
|
-
};
|
|
381
|
-
return (React__default['default'].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
369
|
+
React__default["default"].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
382
370
|
};
|
|
383
371
|
|
|
384
|
-
var css_248z$
|
|
385
|
-
var styles$
|
|
386
|
-
styleInject(css_248z$
|
|
372
|
+
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";
|
|
373
|
+
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"};
|
|
374
|
+
styleInject(css_248z$K);
|
|
387
375
|
|
|
388
|
-
const
|
|
376
|
+
const Button = (props) => {
|
|
389
377
|
const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon"]);
|
|
390
378
|
const getCssClasses = () => {
|
|
391
379
|
const cssClasses = [];
|
|
392
|
-
cssClasses.push(styles$
|
|
380
|
+
cssClasses.push(styles$K.button);
|
|
393
381
|
if (variant !== 'outline' && variant !== 'text') {
|
|
394
|
-
cssClasses.push(styles$
|
|
395
|
-
cssClasses.push(styles$
|
|
382
|
+
cssClasses.push(styles$K.btnContained);
|
|
383
|
+
cssClasses.push(styles$K[color]);
|
|
396
384
|
}
|
|
397
385
|
if (variant === 'outline') {
|
|
398
|
-
cssClasses.push(styles$
|
|
399
|
-
cssClasses.push(styles$
|
|
386
|
+
cssClasses.push(styles$K.btnOutline);
|
|
387
|
+
cssClasses.push(styles$K[color]);
|
|
400
388
|
}
|
|
401
389
|
if (variant === 'text') {
|
|
402
|
-
cssClasses.push(styles$
|
|
403
|
-
cssClasses.push(styles$
|
|
390
|
+
cssClasses.push(styles$K.btnText);
|
|
391
|
+
cssClasses.push(styles$K[color]);
|
|
404
392
|
}
|
|
405
393
|
if (isRounded && variant !== 'text') {
|
|
406
394
|
cssClasses.push(`rounded-pill`);
|
|
@@ -411,61 +399,57 @@ const ButtonTemplate = (props) => {
|
|
|
411
399
|
className && cssClasses.push(className);
|
|
412
400
|
return cssClasses.filter(css => css).join(' ');
|
|
413
401
|
};
|
|
414
|
-
return (React__default[
|
|
415
|
-
React__default[
|
|
402
|
+
return (React__default["default"].createElement("button", Object.assign({ className: getCssClasses() }, rest),
|
|
403
|
+
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
416
404
|
startIcon &&
|
|
417
|
-
React__default[
|
|
405
|
+
React__default["default"].createElement(Icon, { className: styles$K.startIcon }, startIcon),
|
|
418
406
|
children,
|
|
419
407
|
endIcon &&
|
|
420
|
-
React__default[
|
|
408
|
+
React__default["default"].createElement(Icon, { className: styles$K.endIcon }, endIcon))));
|
|
421
409
|
};
|
|
422
410
|
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
var css_248z$G = ".ButtonGroup-module_buttonGroup__2RS71 button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.ButtonGroup-module_buttonGroup__2RS71 button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}";
|
|
428
|
-
var styles$G = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
429
|
-
styleInject(css_248z$G);
|
|
411
|
+
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";
|
|
412
|
+
var styles$J = {"buttonGroup":"ButtonGroup-module_buttonGroup__2RS71"};
|
|
413
|
+
styleInject(css_248z$J);
|
|
430
414
|
|
|
431
415
|
const ButtonGroup = (props) => {
|
|
432
416
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
433
417
|
const getCssClasses = () => {
|
|
434
418
|
const cssClasses = [];
|
|
435
|
-
cssClasses.push(styles$
|
|
419
|
+
cssClasses.push(styles$J.buttonGroup);
|
|
436
420
|
className && cssClasses.push(className);
|
|
437
421
|
return cssClasses.filter(css => css).join(' ');
|
|
438
422
|
};
|
|
439
|
-
return (React__default[
|
|
423
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
440
424
|
};
|
|
441
425
|
|
|
442
|
-
var css_248z$
|
|
443
|
-
var styles$
|
|
444
|
-
styleInject(css_248z$
|
|
426
|
+
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";
|
|
427
|
+
var styles$I = {"breadcrumb":"Breadcrumb-module_breadcrumb__2BHXS"};
|
|
428
|
+
styleInject(css_248z$I);
|
|
445
429
|
|
|
446
430
|
const Breadcrumb = (props) => {
|
|
447
|
-
const { children, className } = props;
|
|
431
|
+
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
448
432
|
const getCssClasses = () => {
|
|
449
433
|
const cssClasses = [];
|
|
450
|
-
cssClasses.push(styles$
|
|
434
|
+
cssClasses.push(styles$I.breadcrumb);
|
|
451
435
|
className && cssClasses.push(className);
|
|
452
436
|
return cssClasses.filter(css => css).join(' ');
|
|
453
437
|
};
|
|
454
|
-
return (React__default[
|
|
455
|
-
React__default[
|
|
438
|
+
return (React__default["default"].createElement("nav", Object.assign({}, rest),
|
|
439
|
+
React__default["default"].createElement("ol", { className: getCssClasses() }, children)));
|
|
456
440
|
};
|
|
457
441
|
|
|
458
442
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
459
443
|
|
|
460
|
-
var css_248z$
|
|
461
|
-
var styles$
|
|
462
|
-
styleInject(css_248z$
|
|
444
|
+
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";
|
|
445
|
+
var styles$H = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__1yy-D","active":"BreadcrumbItem-module_active__3iVU2"};
|
|
446
|
+
styleInject(css_248z$H);
|
|
463
447
|
|
|
464
448
|
const BreadcrumbItem = (props) => {
|
|
465
449
|
const { children, className, isActive, onClick } = props;
|
|
466
450
|
const getCssClasses = () => {
|
|
467
451
|
const cssClasses = [];
|
|
468
|
-
cssClasses.push(styles$
|
|
452
|
+
cssClasses.push(styles$H.breadcrumbItem);
|
|
469
453
|
className && cssClasses.push(className);
|
|
470
454
|
isActive && cssClasses.push('active');
|
|
471
455
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -473,205 +457,221 @@ const BreadcrumbItem = (props) => {
|
|
|
473
457
|
const handleClick = (event) => {
|
|
474
458
|
onClick && onClick(event);
|
|
475
459
|
};
|
|
476
|
-
return (React__default[
|
|
477
|
-
React__default[
|
|
460
|
+
return (React__default["default"].createElement("li", { className: getCssClasses(), onClick: handleClick },
|
|
461
|
+
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive,
|
|
478
462
|
// eslint-disable-next-line jsx-a11y/anchor-is-valid
|
|
479
|
-
wrapper: label => React__default[
|
|
463
|
+
wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
480
464
|
};
|
|
481
465
|
|
|
482
|
-
var css_248z$
|
|
483
|
-
var styles$
|
|
484
|
-
styleInject(css_248z$
|
|
466
|
+
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";
|
|
467
|
+
var styles$G = {"card":"Card-module_card__31o3Z","shadow":"Card-module_shadow__2lpYq"};
|
|
468
|
+
styleInject(css_248z$G);
|
|
485
469
|
|
|
486
470
|
const Card = (props) => {
|
|
487
471
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
488
472
|
const getCssClasses = () => {
|
|
489
473
|
const cssClasses = [];
|
|
490
|
-
cssClasses.push(styles$
|
|
491
|
-
shadow && cssClasses.push(styles$
|
|
474
|
+
cssClasses.push(styles$G.card);
|
|
475
|
+
shadow && cssClasses.push(styles$G.shadow);
|
|
492
476
|
className && cssClasses.push(className);
|
|
493
477
|
return cssClasses.filter(css => css).join(' ');
|
|
494
478
|
};
|
|
495
|
-
return (React__default[
|
|
479
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
496
480
|
};
|
|
497
481
|
|
|
498
|
-
var css_248z$
|
|
499
|
-
var styles$
|
|
500
|
-
styleInject(css_248z$
|
|
482
|
+
var css_248z$F = ".CardBody-module_cardBody__N8z-L {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
|
|
483
|
+
var styles$F = {"cardBody":"CardBody-module_cardBody__N8z-L"};
|
|
484
|
+
styleInject(css_248z$F);
|
|
501
485
|
|
|
502
486
|
const CardBody = (props) => {
|
|
503
487
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
504
488
|
const getCssClasses = () => {
|
|
505
489
|
const cssClasses = [];
|
|
506
|
-
cssClasses.push(styles$
|
|
490
|
+
cssClasses.push(styles$F.cardBody);
|
|
507
491
|
className && cssClasses.push(className);
|
|
508
492
|
return cssClasses.filter(css => css).join(' ');
|
|
509
493
|
};
|
|
510
|
-
return (React__default[
|
|
494
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
511
495
|
};
|
|
512
496
|
|
|
513
|
-
var css_248z$
|
|
514
|
-
var styles$
|
|
515
|
-
styleInject(css_248z$
|
|
497
|
+
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";
|
|
498
|
+
var styles$E = {"cardFooter":"CardFooter-module_cardFooter__3dYKa"};
|
|
499
|
+
styleInject(css_248z$E);
|
|
516
500
|
|
|
517
501
|
const CardFooter = (props) => {
|
|
518
502
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
519
503
|
const getCssClasses = () => {
|
|
520
504
|
const cssClasses = [];
|
|
521
|
-
cssClasses.push(styles$
|
|
505
|
+
cssClasses.push(styles$E.cardFooter);
|
|
522
506
|
className && cssClasses.push(className);
|
|
523
507
|
return cssClasses.filter(css => css).join(' ');
|
|
524
508
|
};
|
|
525
|
-
return (React__default[
|
|
509
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
526
510
|
};
|
|
527
511
|
|
|
528
|
-
var css_248z$
|
|
529
|
-
var styles$
|
|
530
|
-
styleInject(css_248z$
|
|
512
|
+
var css_248z$D = ".CardSubtitle-module_cardSubtitle__2WWHW {\n color: #6c757d !important; }\n";
|
|
513
|
+
var styles$D = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__2WWHW"};
|
|
514
|
+
styleInject(css_248z$D);
|
|
531
515
|
|
|
532
516
|
const CardSubtitle = (props) => {
|
|
533
517
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
534
518
|
const getCssClasses = () => {
|
|
535
519
|
const cssClasses = [];
|
|
536
|
-
cssClasses.push(styles$
|
|
520
|
+
cssClasses.push(styles$D.cardSubtitle);
|
|
537
521
|
className && cssClasses.push(className);
|
|
538
522
|
return cssClasses.filter(css => css).join(' ');
|
|
539
523
|
};
|
|
540
|
-
return (React__default[
|
|
524
|
+
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
541
525
|
};
|
|
542
526
|
|
|
543
|
-
var css_248z$
|
|
544
|
-
var styles$
|
|
545
|
-
styleInject(css_248z$
|
|
527
|
+
var css_248z$C = ".CardText-module_cardText__1LWJi:last-child {\n margin-bottom: 0; }\n";
|
|
528
|
+
var styles$C = {"cardText":"CardText-module_cardText__1LWJi"};
|
|
529
|
+
styleInject(css_248z$C);
|
|
546
530
|
|
|
547
531
|
const CardText = (props) => {
|
|
548
532
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
549
533
|
const getCssClasses = () => {
|
|
550
534
|
const cssClasses = [];
|
|
551
|
-
cssClasses.push(styles$
|
|
535
|
+
cssClasses.push(styles$C.cardText);
|
|
552
536
|
className && cssClasses.push(className);
|
|
553
537
|
return cssClasses.filter(css => css).join(' ');
|
|
554
538
|
};
|
|
555
|
-
return (React__default[
|
|
539
|
+
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), props.children));
|
|
556
540
|
};
|
|
557
541
|
|
|
558
|
-
var css_248z$
|
|
559
|
-
var styles$
|
|
560
|
-
styleInject(css_248z$
|
|
542
|
+
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";
|
|
543
|
+
var styles$B = {"cardTitle":"CardTitle-module_cardTitle__24Amb"};
|
|
544
|
+
styleInject(css_248z$B);
|
|
561
545
|
|
|
562
546
|
const CardTitle = (props) => {
|
|
563
547
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
564
548
|
const getCssClasses = () => {
|
|
565
549
|
const cssClasses = [];
|
|
566
|
-
cssClasses.push(styles$
|
|
550
|
+
cssClasses.push(styles$B.cardTitle);
|
|
567
551
|
className && cssClasses.push(className);
|
|
568
552
|
return cssClasses.filter(css => css).join(' ');
|
|
569
553
|
};
|
|
570
|
-
return (React__default[
|
|
554
|
+
return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
571
555
|
};
|
|
572
556
|
|
|
573
|
-
var css_248z$
|
|
574
|
-
var styles$
|
|
575
|
-
styleInject(css_248z$
|
|
557
|
+
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";
|
|
558
|
+
var styles$A = {"cardImage":"CardImage-module_cardImage__1tZM4"};
|
|
559
|
+
styleInject(css_248z$A);
|
|
576
560
|
|
|
577
561
|
const CardImage = (props) => {
|
|
578
562
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
579
563
|
const getCssClasses = () => {
|
|
580
564
|
const cssClasses = [];
|
|
581
|
-
cssClasses.push(styles$
|
|
565
|
+
cssClasses.push(styles$A.cardImage);
|
|
582
566
|
className && cssClasses.push(className);
|
|
583
567
|
return cssClasses.filter(css => css).join(' ');
|
|
584
568
|
};
|
|
585
|
-
return (React__default[
|
|
569
|
+
return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
586
570
|
};
|
|
587
571
|
|
|
588
|
-
const CaretDownSolidIcon = () => (React__default[
|
|
589
|
-
React__default[
|
|
572
|
+
const CaretDownSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "caret-down", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
573
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z" })));
|
|
590
574
|
|
|
591
|
-
const CheckSquareRegularIcon = () => (React__default[
|
|
592
|
-
React__default[
|
|
575
|
+
const CheckSquareRegularIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "far", "data-icon": "check-square", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
|
|
576
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M400 32H48C21.49 32 0 53.49 0 80v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48zm0 400H48V80h352v352zm-35.864-241.724L191.547 361.48c-4.705 4.667-12.303 4.637-16.97-.068l-90.781-91.516c-4.667-4.705-4.637-12.303.069-16.971l22.719-22.536c4.705-4.667 12.303-4.637 16.97.069l59.792 60.277 141.352-140.216c4.705-4.667 12.303-4.637 16.97.068l22.536 22.718c4.667 4.706 4.637 12.304-.068 16.971z" })));
|
|
593
577
|
|
|
594
|
-
const ChevronDownSolidIcon = () => (React__default[
|
|
595
|
-
React__default[
|
|
578
|
+
const ChevronDownSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "chevron-down", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
|
|
579
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z" })));
|
|
596
580
|
|
|
597
|
-
const ChevronRightSolidIcon = () => (React__default[
|
|
598
|
-
React__default[
|
|
581
|
+
const ChevronRightSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "chevron-right", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
582
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z" })));
|
|
599
583
|
|
|
600
|
-
const ChevronUpSolidIcon = () => (React__default[
|
|
601
|
-
React__default[
|
|
584
|
+
const ChevronUpSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "chevron-up", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
|
|
585
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z" })));
|
|
602
586
|
|
|
603
|
-
const HomeSolidIcon = () => (React__default[
|
|
604
|
-
React__default[
|
|
587
|
+
const HomeSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "home", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 576 512" },
|
|
588
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M280.37 148.26L96 300.11V464a16 16 0 0 0 16 16l112.06-.29a16 16 0 0 0 15.92-16V368a16 16 0 0 1 16-16h64a16 16 0 0 1 16 16v95.64a16 16 0 0 0 16 16.05L464 480a16 16 0 0 0 16-16V300L295.67 148.26a12.19 12.19 0 0 0-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 0 0-12-12h-56a12 12 0 0 0-12 12v72.61L318.47 43a48 48 0 0 0-61 0L4.34 251.47a12 12 0 0 0-1.6 16.9l25.5 31A12 12 0 0 0 45.15 301l235.22-193.74a12.19 12.19 0 0 1 15.3 0L530.9 301a12 12 0 0 0 16.9-1.6l25.5-31a12 12 0 0 0-1.7-16.93z" })));
|
|
605
589
|
|
|
606
|
-
const SquareRegularIcon = () => (React__default[
|
|
607
|
-
React__default[
|
|
590
|
+
const SquareRegularIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "far", "data-icon": "square", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
|
|
591
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zm-6 400H54c-3.3 0-6-2.7-6-6V86c0-3.3 2.7-6 6-6h340c3.3 0 6 2.7 6 6v340c0 3.3-2.7 6-6 6z" })));
|
|
608
592
|
|
|
609
|
-
const TimesCircleSolidIcon = () => (React__default[
|
|
610
|
-
React__default[
|
|
593
|
+
const TimesCircleSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
|
|
594
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm121.6 313.1c4.7 4.7 4.7 12.3 0 17L338 377.6c-4.7 4.7-12.3 4.7-17 0L256 312l-65.1 65.6c-4.7 4.7-12.3 4.7-17 0L134.4 338c-4.7-4.7-4.7-12.3 0-17l65.6-65-65.6-65.1c-4.7-4.7-4.7-12.3 0-17l39.6-39.6c4.7-4.7 12.3-4.7 17 0l65 65.7 65.1-65.6c4.7-4.7 12.3-4.7 17 0l39.6 39.6c4.7 4.7 4.7 12.3 0 17L312 256l65.6 65.1z" })));
|
|
611
595
|
|
|
612
|
-
const TimesSolidIcon = () => (React__default[
|
|
613
|
-
React__default[
|
|
596
|
+
const TimesSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 352 512" },
|
|
597
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z" })));
|
|
614
598
|
|
|
615
|
-
const SpinnerSolidIcon = () => (React__default[
|
|
616
|
-
React__default[
|
|
599
|
+
const SpinnerSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", "data-prefix": "fas", "data-icon": "spinner", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
|
|
600
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M304 48c0 26.51-21.49 48-48 48s-48-21.49-48-48 21.49-48 48-48 48 21.49 48 48zm-48 368c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zm208-208c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zM96 256c0-26.51-21.49-48-48-48S0 229.49 0 256s21.49 48 48 48 48-21.49 48-48zm12.922 99.078c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.491-48-48-48zm294.156 0c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.49-48-48-48zM108.922 60.922c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.491-48-48-48z" })));
|
|
617
601
|
|
|
618
|
-
const PlusSolidIcon = () => (React__default[
|
|
619
|
-
React__default[
|
|
602
|
+
const PlusSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" },
|
|
603
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z" })));
|
|
620
604
|
|
|
621
|
-
const CheckSolidIcon = () => (React__default[
|
|
622
|
-
React__default[
|
|
605
|
+
const CheckSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
|
|
606
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" })));
|
|
623
607
|
|
|
624
|
-
const CircleSolidIcon = () => (React__default[
|
|
625
|
-
React__default[
|
|
608
|
+
const CircleSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512" },
|
|
609
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8z" })));
|
|
626
610
|
|
|
627
|
-
const ChevronLeftSolidIcon = () => (React__default[
|
|
628
|
-
React__default[
|
|
611
|
+
const ChevronLeftSolidIcon = () => (React__default["default"].createElement("svg", { "aria-hidden": "true", focusable: "false", role: "img", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 320 512" },
|
|
612
|
+
React__default["default"].createElement("path", { fill: "currentColor", d: "M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z" })));
|
|
629
613
|
|
|
630
|
-
var css_248z$
|
|
631
|
-
var styles$
|
|
632
|
-
styleInject(css_248z$
|
|
614
|
+
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";
|
|
615
|
+
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"};
|
|
616
|
+
styleInject(css_248z$z);
|
|
617
|
+
|
|
618
|
+
const Icon = (props) => {
|
|
619
|
+
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
620
|
+
const getCssClasses = () => {
|
|
621
|
+
const cssClasses = [];
|
|
622
|
+
cssClasses.push(styles$z.icon);
|
|
623
|
+
iconColor && cssClasses.push(styles$z[iconColor]);
|
|
624
|
+
className && cssClasses.push(className);
|
|
625
|
+
return cssClasses.filter(css => css).join(' ');
|
|
626
|
+
};
|
|
627
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
628
|
+
};
|
|
629
|
+
|
|
630
|
+
var css_248z$y = ".Typography-module_typography__2bM6E {\n text-overflow: ellipsis;\n overflow: hidden !important; }\n";
|
|
631
|
+
var styles$y = {"typography":"Typography-module_typography__2bM6E"};
|
|
632
|
+
styleInject(css_248z$y);
|
|
633
633
|
|
|
634
634
|
const Wrapper = (props) => {
|
|
635
635
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
636
636
|
const getCssClasses = () => {
|
|
637
637
|
const cssClasses = [];
|
|
638
|
-
cssClasses.push(styles$
|
|
638
|
+
cssClasses.push(styles$y.typography);
|
|
639
639
|
className && cssClasses.push(className);
|
|
640
640
|
return cssClasses.filter(css => css).join(' ');
|
|
641
641
|
};
|
|
642
|
-
return React__default[
|
|
642
|
+
return React__default["default"].createElement(as, Object.assign(Object.assign({}, rest), { className: getCssClasses() }), children);
|
|
643
643
|
};
|
|
644
644
|
const Typography = (_a) => {
|
|
645
645
|
var { children, as = 'span' } = _a, rest = __rest(_a, ["children", "as"]);
|
|
646
|
-
return (React__default[
|
|
646
|
+
return (React__default["default"].createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
647
647
|
};
|
|
648
648
|
|
|
649
|
-
var css_248z$
|
|
650
|
-
var styles$
|
|
651
|
-
styleInject(css_248z$
|
|
649
|
+
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";
|
|
650
|
+
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"};
|
|
651
|
+
styleInject(css_248z$x);
|
|
652
652
|
|
|
653
653
|
const IconButton = (props) => {
|
|
654
654
|
const { children, icon, label, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "label", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
655
655
|
const getCssClasses = () => {
|
|
656
656
|
const cssClasses = [];
|
|
657
|
-
cssClasses.push(styles$
|
|
658
|
-
cssClasses.push(styles$
|
|
659
|
-
cssClasses.push(styles$
|
|
660
|
-
cssClasses.push(styles$
|
|
661
|
-
isActive && cssClasses.push(styles$
|
|
662
|
-
disabled && cssClasses.push(styles$
|
|
663
|
-
shadow && cssClasses.push(styles$
|
|
657
|
+
cssClasses.push(styles$x[color]);
|
|
658
|
+
cssClasses.push(styles$x[variant]);
|
|
659
|
+
cssClasses.push(styles$x[size]);
|
|
660
|
+
cssClasses.push(styles$x.iconButton);
|
|
661
|
+
isActive && cssClasses.push(styles$x.active);
|
|
662
|
+
disabled && cssClasses.push(styles$x.disabled);
|
|
663
|
+
shadow && cssClasses.push(styles$x.shadow);
|
|
664
664
|
className && cssClasses.push(className);
|
|
665
665
|
return cssClasses.filter(css => css).join(' ');
|
|
666
666
|
};
|
|
667
|
-
return (React__default[
|
|
668
|
-
icon && React__default[
|
|
669
|
-
label && React__default[
|
|
667
|
+
return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses(), disabled: disabled }, rest),
|
|
668
|
+
icon && React__default["default"].createElement(Icon, null, icon),
|
|
669
|
+
label && React__default["default"].createElement(Typography, null, label)));
|
|
670
670
|
};
|
|
671
671
|
|
|
672
|
-
var css_248z$
|
|
673
|
-
var styles$
|
|
674
|
-
styleInject(css_248z$
|
|
672
|
+
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";
|
|
673
|
+
var styles$w = {"checkboxContainer":"Checkbox-module_checkboxContainer__2oWhu","checkboxLabel":"Checkbox-module_checkboxLabel__27Y6U","disabled":"Checkbox-module_disabled__3EXUd"};
|
|
674
|
+
styleInject(css_248z$w);
|
|
675
675
|
|
|
676
676
|
const Checkbox = (props) => {
|
|
677
677
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -689,8 +689,8 @@ const Checkbox = (props) => {
|
|
|
689
689
|
}
|
|
690
690
|
}, [checked]);
|
|
691
691
|
const icons = {
|
|
692
|
-
default: React__default[
|
|
693
|
-
selected: React__default[
|
|
692
|
+
default: React__default["default"].createElement(SquareRegularIcon, null),
|
|
693
|
+
selected: React__default["default"].createElement(CheckSquareRegularIcon, null)
|
|
694
694
|
};
|
|
695
695
|
const getCssClasses = () => {
|
|
696
696
|
const cssClasses = [];
|
|
@@ -703,27 +703,29 @@ const Checkbox = (props) => {
|
|
|
703
703
|
};
|
|
704
704
|
const handleClick = () => {
|
|
705
705
|
var _a;
|
|
706
|
-
|
|
707
|
-
|
|
706
|
+
if (!disabled && !readOnly) {
|
|
707
|
+
setIsChecked(!isChecked);
|
|
708
|
+
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
709
|
+
}
|
|
708
710
|
};
|
|
709
|
-
return (React__default[
|
|
710
|
-
React__default[
|
|
711
|
-
React__default[
|
|
712
|
-
React__default[
|
|
711
|
+
return (React__default["default"].createElement("div", { className: styles$w.checkboxContainer },
|
|
712
|
+
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
713
|
+
React__default["default"].createElement("label", { onClick: handleClick, className: styles$w.checkboxLabel + ' ' + (disabled ? styles$w['disabled'] : undefined) }, label),
|
|
714
|
+
React__default["default"].createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
713
715
|
};
|
|
714
716
|
|
|
715
|
-
var css_248z$
|
|
716
|
-
var styles$
|
|
717
|
-
styleInject(css_248z$
|
|
717
|
+
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";
|
|
718
|
+
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"};
|
|
719
|
+
styleInject(css_248z$v);
|
|
718
720
|
|
|
719
721
|
const Chip = (props) => {
|
|
720
|
-
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default[
|
|
722
|
+
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default["default"].createElement(TimesCircleSolidIcon, null), style } = props, rest = __rest(props, ["children", "color", "className", "shadow", "onClick", "isDeletable", "onDelete", "deleteIcon", "style"]);
|
|
721
723
|
const getCssClass = () => {
|
|
722
724
|
const cssClasses = [];
|
|
723
|
-
cssClasses.push(styles$
|
|
724
|
-
cssClasses.push(styles$
|
|
725
|
-
shadow && cssClasses.push(styles$
|
|
726
|
-
onClick && cssClasses.push(styles$
|
|
725
|
+
cssClasses.push(styles$v.chip);
|
|
726
|
+
cssClasses.push(styles$v[color]);
|
|
727
|
+
shadow && cssClasses.push(styles$v['shadow']);
|
|
728
|
+
onClick && cssClasses.push(styles$v['clickable']);
|
|
727
729
|
className && cssClasses.push(className);
|
|
728
730
|
return cssClasses.filter(r => r).join(' ');
|
|
729
731
|
};
|
|
@@ -731,16 +733,29 @@ const Chip = (props) => {
|
|
|
731
733
|
e.stopPropagation();
|
|
732
734
|
onDelete && onDelete(e);
|
|
733
735
|
};
|
|
734
|
-
return (React__default[
|
|
735
|
-
React__default[
|
|
736
|
-
isDeletable && (React__default[
|
|
736
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
737
|
+
React__default["default"].createElement("div", null, children),
|
|
738
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$v.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
737
739
|
};
|
|
738
740
|
|
|
739
|
-
|
|
741
|
+
var css_248z$u = ".FormLabel-module_formLabel__1Zv0W {\n margin-bottom: .5rem; }\n";
|
|
742
|
+
var styles$u = {"formLabel":"FormLabel-module_formLabel__1Zv0W"};
|
|
743
|
+
styleInject(css_248z$u);
|
|
744
|
+
|
|
745
|
+
const FormLabel = (props) => {
|
|
746
|
+
const { children, className, htmlFor } = props, rest = __rest(props, ["children", "className", "htmlFor"]);
|
|
747
|
+
const getCssClasses = () => {
|
|
748
|
+
const cssClasses = [];
|
|
749
|
+
cssClasses.push(styles$u.formLabel);
|
|
750
|
+
className && cssClasses.push(className);
|
|
751
|
+
return cssClasses.filter(css => css).join(' ');
|
|
752
|
+
};
|
|
753
|
+
return (React__default["default"].createElement("label", Object.assign({ htmlFor: htmlFor, className: getCssClasses() }, rest), children));
|
|
754
|
+
};
|
|
740
755
|
|
|
741
756
|
const FormGroup = (props) => {
|
|
742
757
|
const { children, className = 'mb-1' } = props;
|
|
743
|
-
return (React__default[
|
|
758
|
+
return (React__default["default"].createElement("div", { className: className }, children));
|
|
744
759
|
};
|
|
745
760
|
|
|
746
761
|
const FileInput = (props) => {
|
|
@@ -763,15 +778,15 @@ const FileInput = (props) => {
|
|
|
763
778
|
// TODO - setModel
|
|
764
779
|
alert('coming soon');
|
|
765
780
|
};
|
|
766
|
-
return (React__default[
|
|
767
|
-
React__default[
|
|
768
|
-
React__default[
|
|
769
|
-
React__default[
|
|
781
|
+
return (React__default["default"].createElement("div", { className: "d-flex align-items-start" },
|
|
782
|
+
React__default["default"].createElement(Button, { className: "flex-wrap", disabled: disabled, onClick: () => { var _a; return (_a = inputFileElement.current) === null || _a === void 0 ? void 0 : _a.click(); } }, children),
|
|
783
|
+
React__default["default"].createElement("div", { className: "d-flex align-items-center flex-wrap ml-1" }, fileList && Array.from(fileList).map((file) => React__default["default"].createElement(Chip, { key: file.name, isDeletable: deletable, onDelete: () => handleOnDelete() }, file.name))),
|
|
784
|
+
React__default["default"].createElement("input", Object.assign({ type: "file", ref: inputFileElement, className: getCssClasses(), id: id, name: name, multiple: multiple, accept: accept, disabled: disabled, readOnly: readOnly, hidden: true, onChange: handleOnChange, value: model }, rest))));
|
|
770
785
|
};
|
|
771
786
|
|
|
772
|
-
var css_248z$
|
|
773
|
-
var styles$
|
|
774
|
-
styleInject(css_248z$
|
|
787
|
+
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";
|
|
788
|
+
var styles$t = {"selectContainer":"Select-module_selectContainer__2oizY","select":"Select-module_select__MSqgU","selectMenu":"Select-module_selectMenu__2vhJt"};
|
|
789
|
+
styleInject(css_248z$t);
|
|
775
790
|
|
|
776
791
|
const Select = (props) => {
|
|
777
792
|
var _a, _b, _c;
|
|
@@ -784,7 +799,7 @@ const Select = (props) => {
|
|
|
784
799
|
const getCssClass = () => {
|
|
785
800
|
const cssClasses = [];
|
|
786
801
|
className && cssClasses.push(className);
|
|
787
|
-
cssClasses.push(styles$
|
|
802
|
+
cssClasses.push(styles$t.select);
|
|
788
803
|
return cssClasses.filter(r => r).join(' ');
|
|
789
804
|
};
|
|
790
805
|
React.useEffect(() => {
|
|
@@ -852,7 +867,7 @@ const Select = (props) => {
|
|
|
852
867
|
const renderSingleViewModel = () => {
|
|
853
868
|
let result = null;
|
|
854
869
|
if (selectedOptions.length > 0) {
|
|
855
|
-
result = React__default[
|
|
870
|
+
result = React__default["default"].createElement("span", null, selectedOptions[0].label);
|
|
856
871
|
}
|
|
857
872
|
return result;
|
|
858
873
|
};
|
|
@@ -860,10 +875,10 @@ const Select = (props) => {
|
|
|
860
875
|
let result = null;
|
|
861
876
|
if (selectedOptions.length <= multipleMaxCountItems && selectedOptions.length > 0) {
|
|
862
877
|
result = selectedOptions
|
|
863
|
-
.map(o => React__default[
|
|
878
|
+
.map(o => React__default["default"].createElement(Chip, { key: o.value, className: "mr-2", color: exports.COLOR.primary, isDeletable: true, onDelete: (e) => handleOnDelete(e, o) }, o.label));
|
|
864
879
|
}
|
|
865
880
|
else {
|
|
866
|
-
result = React__default[
|
|
881
|
+
result = React__default["default"].createElement("span", null,
|
|
867
882
|
selectedOptions.length,
|
|
868
883
|
" Items selected");
|
|
869
884
|
}
|
|
@@ -902,41 +917,58 @@ const Select = (props) => {
|
|
|
902
917
|
}
|
|
903
918
|
}
|
|
904
919
|
};
|
|
905
|
-
return (React__default[
|
|
906
|
-
React__default[
|
|
907
|
-
React__default[
|
|
920
|
+
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
921
|
+
React__default["default"].createElement("div", { ref: selectConainter, className: styles$t.selectContainer },
|
|
922
|
+
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
908
923
|
!multiple && renderSingleViewModel(),
|
|
909
924
|
multiple && renderMultipleViewModel(),
|
|
910
|
-
React__default[
|
|
911
|
-
React__default[
|
|
925
|
+
React__default["default"].createElement(Icon, { className: "ml-auto" },
|
|
926
|
+
React__default["default"].createElement(ChevronDownSolidIcon, null))),
|
|
912
927
|
isShow &&
|
|
913
|
-
reactDom.createPortal(React__default[
|
|
914
|
-
React__default[
|
|
915
|
-
React__default[
|
|
928
|
+
reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
929
|
+
React__default["default"].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 } },
|
|
930
|
+
React__default["default"].createElement(List, null, options && options.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), active: isActive(option) },
|
|
916
931
|
multiple &&
|
|
917
|
-
React__default[
|
|
918
|
-
React__default[
|
|
919
|
-
React__default[
|
|
932
|
+
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
933
|
+
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
934
|
+
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body))));
|
|
920
935
|
};
|
|
921
936
|
|
|
922
|
-
var css_248z$
|
|
923
|
-
var styles$
|
|
924
|
-
styleInject(css_248z$
|
|
937
|
+
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";
|
|
938
|
+
var styles$s = {};
|
|
939
|
+
styleInject(css_248z$s);
|
|
925
940
|
|
|
926
941
|
const Textarea = (props) => {
|
|
927
942
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
928
943
|
const getCssClass = () => {
|
|
929
944
|
const cssClasses = [];
|
|
930
|
-
cssClasses.push(styles$
|
|
945
|
+
cssClasses.push(styles$s.textarea);
|
|
931
946
|
className && cssClasses.push(className);
|
|
932
947
|
return cssClasses.filter(r => r).join(' ');
|
|
933
948
|
};
|
|
934
|
-
return (React__default[
|
|
949
|
+
return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
935
950
|
};
|
|
936
951
|
|
|
952
|
+
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";
|
|
953
|
+
var styles$r = {"formInput":"FormInput-module_formInput__1gAYi"};
|
|
954
|
+
styleInject(css_248z$r);
|
|
955
|
+
|
|
937
956
|
const FormInput = (props) => {
|
|
938
|
-
const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onChange, onBlur, onKeyDown } = props;
|
|
939
|
-
|
|
957
|
+
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;
|
|
958
|
+
const getCssClasses = () => {
|
|
959
|
+
const cssClasses = [];
|
|
960
|
+
cssClasses.push(styles$r.formInput);
|
|
961
|
+
className && cssClasses.push(className);
|
|
962
|
+
!isValid && cssClasses.push('is-invalid');
|
|
963
|
+
return cssClasses.filter(css => css).join(' ');
|
|
964
|
+
};
|
|
965
|
+
const handleOnInput = (value, type, name) => {
|
|
966
|
+
onInput && onInput({ value, type, name });
|
|
967
|
+
};
|
|
968
|
+
const handleOnChange = (value, type, name) => {
|
|
969
|
+
onChange && onChange({ value, type, name });
|
|
970
|
+
};
|
|
971
|
+
return (React__default["default"].createElement(React.Fragment, null,
|
|
940
972
|
(type === 'text' ||
|
|
941
973
|
type === 'date' ||
|
|
942
974
|
type === 'datetime-local' ||
|
|
@@ -946,29 +978,37 @@ const FormInput = (props) => {
|
|
|
946
978
|
type === 'color' ||
|
|
947
979
|
type === 'time')
|
|
948
980
|
&&
|
|
949
|
-
React__default[
|
|
981
|
+
React__default["default"].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 }),
|
|
950
982
|
type === 'file' &&
|
|
951
|
-
React__default[
|
|
983
|
+
React__default["default"].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"),
|
|
952
984
|
type === 'textarea' &&
|
|
953
|
-
React__default[
|
|
985
|
+
React__default["default"].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' } }),
|
|
954
986
|
type === 'select' &&
|
|
955
|
-
React__default[
|
|
987
|
+
React__default["default"].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 }),
|
|
956
988
|
type === 'autocomplete' &&
|
|
957
|
-
React__default[
|
|
989
|
+
React__default["default"].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 }),
|
|
958
990
|
type === 'checkbox' &&
|
|
959
|
-
React__default[
|
|
991
|
+
React__default["default"].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 }),
|
|
960
992
|
type === 'radio' &&
|
|
961
|
-
React__default[
|
|
962
|
-
React__default[
|
|
963
|
-
React__default[
|
|
993
|
+
React__default["default"].createElement(React.Fragment, null, options.map((option) => React__default["default"].createElement("div", { className: "form-check", key: option.id },
|
|
994
|
+
React__default["default"].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 }),
|
|
995
|
+
React__default["default"].createElement("label", { className: "form-check-label", htmlFor: option.id }, option.label))))));
|
|
964
996
|
};
|
|
965
997
|
|
|
966
|
-
const FormHint = (
|
|
998
|
+
const FormHint = (props) => {
|
|
999
|
+
const { children, className = 'form-text text-muted' } = props;
|
|
1000
|
+
const getCssClasses = () => {
|
|
1001
|
+
const cssClasses = [];
|
|
1002
|
+
className && cssClasses.push(className);
|
|
1003
|
+
return cssClasses.filter(css => css).join(' ');
|
|
1004
|
+
};
|
|
1005
|
+
return (React__default["default"].createElement("small", { className: getCssClasses() }, children));
|
|
1006
|
+
};
|
|
967
1007
|
|
|
968
1008
|
const FormError = (props) => {
|
|
969
1009
|
const { className = 'invalid-feedback', errors = [] } = props;
|
|
970
|
-
return (React__default[
|
|
971
|
-
React__default[
|
|
1010
|
+
return (React__default["default"].createElement(React.Fragment, null, errors &&
|
|
1011
|
+
React__default["default"].createElement("div", { className: className }, errors.map(e => React__default["default"].createElement("div", { key: e.validator }, e.message)))));
|
|
972
1012
|
};
|
|
973
1013
|
|
|
974
1014
|
const IsEmptyValidator = (value) => value === '' || value === null || value === undefined;
|
|
@@ -1090,7 +1130,7 @@ class Form extends React.Component {
|
|
|
1090
1130
|
}
|
|
1091
1131
|
renderLabel(fieldKey, label, labelClassName = 'form-label') {
|
|
1092
1132
|
const cssClasses = [labelClassName, this.isRequired(fieldKey) ? 'required' : undefined];
|
|
1093
|
-
return React__default[
|
|
1133
|
+
return React__default["default"].createElement(FormLabel, { htmlFor: fieldKey, className: cssClasses.join(' ') }, label);
|
|
1094
1134
|
}
|
|
1095
1135
|
;
|
|
1096
1136
|
// trigger via ref
|
|
@@ -1138,17 +1178,17 @@ class Form extends React.Component {
|
|
|
1138
1178
|
return result;
|
|
1139
1179
|
}
|
|
1140
1180
|
render() {
|
|
1141
|
-
return (React__default[
|
|
1142
|
-
return (React__default[
|
|
1181
|
+
return (React__default["default"].createElement("form", { ref: this.myForm }, this.state && this.state.controls && Object.keys(this.state.controls).map((fieldKey) => {
|
|
1182
|
+
return (React__default["default"].createElement(FormGroup, { key: fieldKey, className: this.getFormGroupCssClass(fieldKey) },
|
|
1143
1183
|
this.getControl(fieldKey).config.labelPosition !== 'behind' && this.getControl(fieldKey).type !== 'checkbox' &&
|
|
1144
1184
|
this.renderLabel(fieldKey, this.getControl(fieldKey).config.label, this.getControl(fieldKey).config.labelClassName),
|
|
1145
|
-
React__default[
|
|
1185
|
+
React__default["default"].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) }),
|
|
1146
1186
|
this.getControl(fieldKey).config.labelPosition === 'behind' && this.getControl(fieldKey).type !== 'checkbox' &&
|
|
1147
1187
|
this.renderLabel(fieldKey, this.getControl(fieldKey).config.label, this.getControl(fieldKey).config.labelClassName),
|
|
1148
1188
|
this.getControl(fieldKey).config.hint &&
|
|
1149
|
-
React__default[
|
|
1189
|
+
React__default["default"].createElement(FormHint, null, this.getControl(fieldKey).config.hint),
|
|
1150
1190
|
this.getControl(fieldKey).errors &&
|
|
1151
|
-
React__default[
|
|
1191
|
+
React__default["default"].createElement(FormError, { errors: this.getControl(fieldKey).errors })));
|
|
1152
1192
|
})));
|
|
1153
1193
|
}
|
|
1154
1194
|
}
|
|
@@ -1192,7 +1232,7 @@ const DaySelect = (props) => {
|
|
|
1192
1232
|
setValue(e);
|
|
1193
1233
|
onChange && onChange(e);
|
|
1194
1234
|
};
|
|
1195
|
-
return (React__default[
|
|
1235
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: dayOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: value.toString() }));
|
|
1196
1236
|
};
|
|
1197
1237
|
|
|
1198
1238
|
const MonthSelect = (props) => {
|
|
@@ -1212,7 +1252,7 @@ const MonthSelect = (props) => {
|
|
|
1212
1252
|
setNewValue(e);
|
|
1213
1253
|
onChange && onChange(e);
|
|
1214
1254
|
};
|
|
1215
|
-
return (React__default[
|
|
1255
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: monthOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
1216
1256
|
};
|
|
1217
1257
|
|
|
1218
1258
|
const YearSelect = (props) => {
|
|
@@ -1235,7 +1275,7 @@ const YearSelect = (props) => {
|
|
|
1235
1275
|
setNewValue(e);
|
|
1236
1276
|
onChange && onChange(parseInt(e));
|
|
1237
1277
|
};
|
|
1238
|
-
return (React__default[
|
|
1278
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: years, onChange: handleOnChange, disabled: disabled, value: newValue }));
|
|
1239
1279
|
};
|
|
1240
1280
|
|
|
1241
1281
|
exports.DATEMODE = void 0;
|
|
@@ -1261,16 +1301,16 @@ const DateSelect = (props) => {
|
|
|
1261
1301
|
setCurrDate(newDate);
|
|
1262
1302
|
onChange && onChange(newDate);
|
|
1263
1303
|
};
|
|
1264
|
-
return (React__default[
|
|
1265
|
-
React__default[
|
|
1266
|
-
React__default[
|
|
1267
|
-
React__default[
|
|
1268
|
-
React__default[
|
|
1269
|
-
React__default[
|
|
1270
|
-
React__default[
|
|
1271
|
-
React__default[
|
|
1272
|
-
React__default[
|
|
1273
|
-
React__default[
|
|
1304
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
1305
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
1306
|
+
React__default["default"].createElement(FormLabel, null, "Year"),
|
|
1307
|
+
React__default["default"].createElement(YearSelect, { className: "form-control", value: currDate.getFullYear(), disabled: disabled, from: yearConfig === null || yearConfig === void 0 ? void 0 : yearConfig.from, to: yearConfig === null || yearConfig === void 0 ? void 0 : yearConfig.to, onChange: e => handleOnChange(e, exports.DATEMODE.YEAR) })),
|
|
1308
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
1309
|
+
React__default["default"].createElement(FormLabel, null, "Month"),
|
|
1310
|
+
React__default["default"].createElement(MonthSelect, { className: "form-control", value: currDate.getMonth(), disabled: disabled, onChange: e => handleOnChange(e, exports.DATEMODE.MONTH) })),
|
|
1311
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
1312
|
+
React__default["default"].createElement(FormLabel, null, "Day"),
|
|
1313
|
+
React__default["default"].createElement(DaySelect, { className: "form-control", day: currDate.getDate(), month: currDate.getMonth(), year: currDate.getFullYear(), disabled: disabled, onChange: e => handleOnChange(e, exports.DATEMODE.DAY) }))));
|
|
1274
1314
|
};
|
|
1275
1315
|
/*
|
|
1276
1316
|
* result = { year, month, day, dayOfWeek, weekNumber }
|
|
@@ -1283,7 +1323,7 @@ const DateSelect = (props) => {
|
|
|
1283
1323
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1284
1324
|
// };
|
|
1285
1325
|
|
|
1286
|
-
var css_248z$q = ".Drawer-module_drawer__36R2P {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto
|
|
1326
|
+
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 .Drawer-module_drawer__36R2P.Drawer-module_permanent__AW5Df {\n position: inherit;\n z-index: 0; }\n .Drawer-module_drawer__36R2P.Drawer-module_left__1KKcY {\n order: 0; }\n .Drawer-module_drawer__36R2P.Drawer-module_right__2gESb {\n order: 2; }\n\n.Drawer-module_drawerOpen__euFdW {\n overflow: hidden; }\n";
|
|
1287
1327
|
var styles$q = {"drawer":"Drawer-module_drawer__36R2P","permanent":"Drawer-module_permanent__AW5Df","left":"Drawer-module_left__1KKcY","right":"Drawer-module_right__2gESb","drawerOpen":"Drawer-module_drawerOpen__euFdW"};
|
|
1288
1328
|
styleInject(css_248z$q);
|
|
1289
1329
|
|
|
@@ -1298,9 +1338,9 @@ const Drawer = (props) => {
|
|
|
1298
1338
|
const handleClickBackdrop = () => {
|
|
1299
1339
|
onClickBackdrop && onClickBackdrop();
|
|
1300
1340
|
};
|
|
1301
|
-
return reactDom.createPortal(React__default[
|
|
1302
|
-
React__default[
|
|
1303
|
-
!permanent && React__default[
|
|
1341
|
+
return reactDom.createPortal(React__default["default"].createElement(React.Fragment, null,
|
|
1342
|
+
React__default["default"].createElement(DrawerContent, { className: className, position: position, permanent: permanent }, children),
|
|
1343
|
+
!permanent && React__default["default"].createElement(Backdrop, { onClick: handleClickBackdrop })), target);
|
|
1304
1344
|
};
|
|
1305
1345
|
const DrawerContent = (props) => {
|
|
1306
1346
|
const { children, className, position = 'left', permanent = false } = props;
|
|
@@ -1319,10 +1359,10 @@ const DrawerContent = (props) => {
|
|
|
1319
1359
|
const getStyles = () => {
|
|
1320
1360
|
return !permanent ? positionStyles[position] : undefined;
|
|
1321
1361
|
};
|
|
1322
|
-
return (React__default[
|
|
1362
|
+
return (React__default["default"].createElement("div", { className: getCssClasses(), style: getStyles() }, children));
|
|
1323
1363
|
};
|
|
1324
1364
|
|
|
1325
|
-
var css_248z$p = ".MenuBody-module_menuBody__3cPsp {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius)
|
|
1365
|
+
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 .MenuBody-module_menuBody__3cPsp.MenuBody-module_shadow__AF_9C {\n box-shadow: var(--shadow); }\n";
|
|
1326
1366
|
var styles$p = {"menuBody":"MenuBody-module_menuBody__3cPsp","shadow":"MenuBody-module_shadow__AF_9C"};
|
|
1327
1367
|
styleInject(css_248z$p);
|
|
1328
1368
|
|
|
@@ -1362,12 +1402,12 @@ const MenuBody = (props) => {
|
|
|
1362
1402
|
const handleClickBackdrop = () => {
|
|
1363
1403
|
onClickBackdrop && onClickBackdrop();
|
|
1364
1404
|
};
|
|
1365
|
-
return (reactDom.createPortal(React__default[
|
|
1366
|
-
React__default[
|
|
1367
|
-
React__default[
|
|
1405
|
+
return (reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1406
|
+
React__default["default"].createElement("div", { ref: menuBodyRef, className: getCssClasses() }, children),
|
|
1407
|
+
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1368
1408
|
};
|
|
1369
1409
|
|
|
1370
|
-
var css_248z$o = ".Menu-module_menu__23BYG {\n display: flex
|
|
1410
|
+
var css_248z$o = ".Menu-module_menu__23BYG {\n display: flex; }\n";
|
|
1371
1411
|
var styles$o = {"menu":"Menu-module_menu__23BYG"};
|
|
1372
1412
|
styleInject(css_248z$o);
|
|
1373
1413
|
|
|
@@ -1384,13 +1424,13 @@ const Menu = (props) => {
|
|
|
1384
1424
|
const handleClickBackdrop = () => {
|
|
1385
1425
|
onClickBackdrop && onClickBackdrop();
|
|
1386
1426
|
};
|
|
1387
|
-
return (React__default[
|
|
1388
|
-
React__default[
|
|
1427
|
+
return (React__default["default"].createElement("div", Object.assign({ ref: menuContainer, className: getCssClasses() }, rest),
|
|
1428
|
+
React__default["default"].createElement("div", { ref: toggleContainerRef }, toggle),
|
|
1389
1429
|
open &&
|
|
1390
|
-
React__default[
|
|
1430
|
+
React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1391
1431
|
};
|
|
1392
1432
|
|
|
1393
|
-
var css_248z$n = ".MenuItem-module_menuItem__kvauR {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0
|
|
1433
|
+
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 .MenuItem-module_menuItem__kvauR.MenuItem-module_menuItemHeader__mp7wc {\n margin-bottom: 0;\n font-size: 0.875rem; }\n .MenuItem-module_menuItem__kvauR:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04); }\n";
|
|
1394
1434
|
var styles$n = {"menuItem":"MenuItem-module_menuItem__kvauR","menuItemHeader":"MenuItem-module_menuItemHeader__mp7wc"};
|
|
1395
1435
|
styleInject(css_248z$n);
|
|
1396
1436
|
|
|
@@ -1408,31 +1448,31 @@ const MenuItem = (props) => {
|
|
|
1408
1448
|
e.stopPropagation();
|
|
1409
1449
|
onClick && onClick(e);
|
|
1410
1450
|
};
|
|
1411
|
-
return (React__default[
|
|
1451
|
+
return (React__default["default"].createElement(ConditionalWrapper, { condition: true, wrapper: children => ((type === 'item' ? (
|
|
1412
1452
|
// eslint-disable-next-line jsx-a11y/anchor-is-valid
|
|
1413
|
-
React__default[
|
|
1414
|
-
React__default[
|
|
1453
|
+
React__default["default"].createElement("a", { className: getCssClasses(), onClick: handleClick }, children)) :
|
|
1454
|
+
React__default["default"].createElement("div", { className: getCssClasses(), onClick: handleClick }, children))) }, children));
|
|
1415
1455
|
};
|
|
1416
1456
|
|
|
1417
1457
|
const MenuToggle = ({ children }) => {
|
|
1418
|
-
return (React__default[
|
|
1458
|
+
return (React__default["default"].createElement(React.Fragment, null, children));
|
|
1419
1459
|
};
|
|
1420
1460
|
|
|
1421
|
-
var css_248z$m = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef
|
|
1461
|
+
var css_248z$m = ".MenuDivider-module_menuItemDivider__JnLsC {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef; }\n";
|
|
1422
1462
|
var styles$m = {"menuItemDivider":"MenuDivider-module_menuItemDivider__JnLsC"};
|
|
1423
1463
|
styleInject(css_248z$m);
|
|
1424
1464
|
|
|
1425
|
-
const MenuDivider = () => React__default[
|
|
1465
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$m.menuItemDivider });
|
|
1426
1466
|
|
|
1427
|
-
var css_248z$l = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px
|
|
1467
|
+
var css_248z$l = ".ExpansionPanelContent-module_expansionPanelContent__3H62L {\n padding: 8px 16px 16px; }\n";
|
|
1428
1468
|
var styles$l = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__3H62L"};
|
|
1429
1469
|
styleInject(css_248z$l);
|
|
1430
1470
|
|
|
1431
1471
|
const ExpansionPanelContent = ({ children }) => {
|
|
1432
|
-
return (React__default[
|
|
1472
|
+
return (React__default["default"].createElement("div", { className: styles$l.expansionPanelContent }, children));
|
|
1433
1473
|
};
|
|
1434
1474
|
|
|
1435
|
-
var css_248z$k = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px
|
|
1475
|
+
var css_248z$k = ".ExpansionPanelHeader-module_expansionPanelHeader__3hrsI {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px; }\n .ExpansionPanelHeader-module_expansionPanelHeader__3hrsI:hover {\n cursor: pointer;\n background-color: var(--highlight); }\n";
|
|
1436
1476
|
var styles$k = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__3hrsI"};
|
|
1437
1477
|
styleInject(css_248z$k);
|
|
1438
1478
|
|
|
@@ -1442,13 +1482,13 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1442
1482
|
e.stopPropagation();
|
|
1443
1483
|
onClick && onClick(e);
|
|
1444
1484
|
};
|
|
1445
|
-
return (React__default[
|
|
1485
|
+
return (React__default["default"].createElement("div", { className: styles$k.expansionPanelHeader, onClick: handleClick },
|
|
1446
1486
|
children,
|
|
1447
|
-
React__default[
|
|
1448
|
-
React__default[
|
|
1487
|
+
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1488
|
+
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1449
1489
|
};
|
|
1450
1490
|
|
|
1451
|
-
var css_248z$j = ".ExpansionPanel-module_expansionPanel__3krcE {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out
|
|
1491
|
+
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 .ExpansionPanel-module_expansionPanel__3krcE:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__3krcE:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt {\n margin: 16px 0; }\n .ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:first-child {\n margin-top: 0; }\n .ExpansionPanel-module_expansionPanel__3krcE.ExpansionPanel-module_isExpanded__1m4Dt:last-child {\n margin-bottom: 0; }\n";
|
|
1452
1492
|
var styles$j = {"expansionPanel":"ExpansionPanel-module_expansionPanel__3krcE","isExpanded":"ExpansionPanel-module_isExpanded__1m4Dt"};
|
|
1453
1493
|
styleInject(css_248z$j);
|
|
1454
1494
|
|
|
@@ -1470,13 +1510,13 @@ const ExpansionPanel = (props) => {
|
|
|
1470
1510
|
setIsExpanded(!_isExpanded);
|
|
1471
1511
|
onChange && onChange(event, !_isExpanded);
|
|
1472
1512
|
};
|
|
1473
|
-
return (React__default[
|
|
1474
|
-
React__default[
|
|
1513
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
1514
|
+
React__default["default"].createElement(ExpansionPanelHeader, { isExpanded: _isExpanded, onClick: handleClickHeader }, header),
|
|
1475
1515
|
_isExpanded &&
|
|
1476
|
-
React__default[
|
|
1516
|
+
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1477
1517
|
};
|
|
1478
1518
|
|
|
1479
|
-
var css_248z$i = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow)
|
|
1519
|
+
var css_248z$i = ".FloatingActionButton-module_fab__3GwiH {\n box-shadow: var(--shadow); }\n .FloatingActionButton-module_fab__3GwiH.FloatingActionButton-module_fixed__17qrv {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000; }\n";
|
|
1480
1520
|
var styles$i = {"fab":"FloatingActionButton-module_fab__3GwiH","fixed":"FloatingActionButton-module_fixed__17qrv"};
|
|
1481
1521
|
styleInject(css_248z$i);
|
|
1482
1522
|
|
|
@@ -1493,7 +1533,7 @@ const FloatingActionButton = (props) => {
|
|
|
1493
1533
|
e.stopPropagation();
|
|
1494
1534
|
onClick && onClick(e);
|
|
1495
1535
|
};
|
|
1496
|
-
return (React__default[
|
|
1536
|
+
return (React__default["default"].createElement(IconButton, { className: getCssClasses(), color: color, size: size, isActive: isActive, disabled: disabled, icon: icon, variant: exports.VARIANT.contained, onClick: handleClick }));
|
|
1497
1537
|
};
|
|
1498
1538
|
|
|
1499
1539
|
const Column = (props) => {
|
|
@@ -1514,7 +1554,7 @@ const Column = (props) => {
|
|
|
1514
1554
|
className && cssClasses.push(className);
|
|
1515
1555
|
return cssClasses.filter(css => css).join(' ');
|
|
1516
1556
|
};
|
|
1517
|
-
return (React__default[
|
|
1557
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1518
1558
|
};
|
|
1519
1559
|
|
|
1520
1560
|
const Row = (props) => {
|
|
@@ -1525,7 +1565,7 @@ const Row = (props) => {
|
|
|
1525
1565
|
className && cssClasses.push(className);
|
|
1526
1566
|
return cssClasses.filter(css => css).join(' ');
|
|
1527
1567
|
};
|
|
1528
|
-
return (React__default[
|
|
1568
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1529
1569
|
};
|
|
1530
1570
|
|
|
1531
1571
|
const Link = (props) => {
|
|
@@ -1544,10 +1584,10 @@ const Link = (props) => {
|
|
|
1544
1584
|
const onMouseLeave = () => {
|
|
1545
1585
|
setStatus(STATUS.NORMAL);
|
|
1546
1586
|
};
|
|
1547
|
-
return (React__default[
|
|
1587
|
+
return (React__default["default"].createElement("a", { className: getCssClasses(), href: url || '#', target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, children));
|
|
1548
1588
|
};
|
|
1549
1589
|
|
|
1550
|
-
var css_248z$h = ".LoadingIndicator-module_loadingIndicatorContainer__3e1-3 {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100
|
|
1590
|
+
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.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@keyframes LoadingIndicator-module_spinAnimation__PKRNn {\n from {\n transform: rotate(0deg); }\n to {\n transform: rotate(360deg); } }\n";
|
|
1551
1591
|
var styles$h = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__3e1-3","loadingIndicator":"LoadingIndicator-module_loadingIndicator__tvp5i","spinAnimation":"LoadingIndicator-module_spinAnimation__PKRNn"};
|
|
1552
1592
|
styleInject(css_248z$h);
|
|
1553
1593
|
|
|
@@ -1557,8 +1597,8 @@ const LoadingIndicator = () => {
|
|
|
1557
1597
|
cssClasses.push(styles$h.loadingIndicator);
|
|
1558
1598
|
return cssClasses.filter(css => css).join(' ');
|
|
1559
1599
|
};
|
|
1560
|
-
return (React__default[
|
|
1561
|
-
React__default[
|
|
1600
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
1601
|
+
React__default["default"].createElement(SpinnerSolidIcon, null)));
|
|
1562
1602
|
};
|
|
1563
1603
|
|
|
1564
1604
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
@@ -1567,7 +1607,7 @@ const LoadingIndicatorContainer = ({ children }) => {
|
|
|
1567
1607
|
cssClasses.push(styles$h.loadingIndicatorContainer);
|
|
1568
1608
|
return cssClasses.filter(css => css).join(' ');
|
|
1569
1609
|
};
|
|
1570
|
-
return (React__default[
|
|
1610
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
1571
1611
|
};
|
|
1572
1612
|
|
|
1573
1613
|
class LoadingIndicatorService {
|
|
@@ -1579,8 +1619,8 @@ class LoadingIndicatorService {
|
|
|
1579
1619
|
this.container = document.createElement('div');
|
|
1580
1620
|
this.container.classList.add('snackbar-container');
|
|
1581
1621
|
document.body.appendChild(this.container);
|
|
1582
|
-
reactDom.render(React__default[
|
|
1583
|
-
React__default[
|
|
1622
|
+
reactDom.render(React__default["default"].createElement(LoadingIndicatorContainer, null,
|
|
1623
|
+
React__default["default"].createElement(LoadingIndicator, null)), this.container);
|
|
1584
1624
|
});
|
|
1585
1625
|
}
|
|
1586
1626
|
hide() {
|
|
@@ -1594,7 +1634,7 @@ class LoadingIndicatorService {
|
|
|
1594
1634
|
}
|
|
1595
1635
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1596
1636
|
|
|
1597
|
-
var css_248z$g = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center
|
|
1637
|
+
var css_248z$g = ".ModalHeader-module_modalHeader__o5HzE {\n border-bottom: none;\n align-items: center; }\n";
|
|
1598
1638
|
var styles$g = {"modalHeader":"ModalHeader-module_modalHeader__o5HzE"};
|
|
1599
1639
|
styleInject(css_248z$g);
|
|
1600
1640
|
|
|
@@ -1603,23 +1643,23 @@ const ModalHeader = (props) => {
|
|
|
1603
1643
|
const handleClick = () => {
|
|
1604
1644
|
onClose && onClose();
|
|
1605
1645
|
};
|
|
1606
|
-
return (React__default[
|
|
1607
|
-
React__default[
|
|
1646
|
+
return (React__default["default"].createElement("div", { className: "modal-header " + styles$g.modalHeader },
|
|
1647
|
+
React__default["default"].createElement("h5", { className: "modal-title" }, children),
|
|
1608
1648
|
isDismissable &&
|
|
1609
|
-
React__default[
|
|
1649
|
+
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
1610
1650
|
};
|
|
1611
1651
|
|
|
1612
|
-
const ModalBody = ({ children }) => (React__default[
|
|
1652
|
+
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: "modal-body" }, children));
|
|
1613
1653
|
|
|
1614
|
-
var css_248z$f = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius)
|
|
1654
|
+
var css_248z$f = ".Modal-module_modal__1NdMJ {\n z-index: 1111 !important;\n border-radius: var(--borderRadius); }\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 .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 @media (min-width: 320px) {\n .Modal-module_modal__1NdMJ.Modal-module_fullscreen__3R-sM {\n max-width: 100% !important; } }\n .Modal-module_modal__1NdMJ .Modal-module_sm__3UfYB {\n max-width: 300px; }\n .Modal-module_modal__1NdMJ .Modal-module_md__2uX1a {\n max-width: 500px; }\n .Modal-module_modal__1NdMJ .Modal-module_lg__3ux_V {\n max-width: 1140px; }\n @media (min-width: 576px) {\n .Modal-module_modal__1NdMJ .Modal-module_modal-dialog__IdJ1c {\n max-width: 600px; } }\n";
|
|
1615
1655
|
var styles$f = {"modal":"Modal-module_modal__1NdMJ","fullscreen":"Modal-module_fullscreen__3R-sM","modalContent":"Modal-module_modalContent__E2kaP","sm":"Modal-module_sm__3UfYB","md":"Modal-module_md__2uX1a","lg":"Modal-module_lg__3ux_V","modal-dialog":"Modal-module_modal-dialog__IdJ1c"};
|
|
1616
1656
|
styleInject(css_248z$f);
|
|
1617
1657
|
|
|
1618
|
-
var css_248z$e = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none
|
|
1658
|
+
var css_248z$e = ".ModalFooter-module_modalFooter__2Et4e {\n border-top: none; }\n";
|
|
1619
1659
|
var styles$e = {"modalFooter":"ModalFooter-module_modalFooter__2Et4e"};
|
|
1620
1660
|
styleInject(css_248z$e);
|
|
1621
1661
|
|
|
1622
|
-
const ModalFooter = ({ children }) => (React__default[
|
|
1662
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: "modal-footer " + styles$e.modalFooter }, children));
|
|
1623
1663
|
|
|
1624
1664
|
const Modal = (props) => {
|
|
1625
1665
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
@@ -1641,16 +1681,16 @@ const Modal = (props) => {
|
|
|
1641
1681
|
const handleClickBackdrop = () => {
|
|
1642
1682
|
onBackdropClick && onBackdropClick();
|
|
1643
1683
|
};
|
|
1644
|
-
return (React__default[
|
|
1645
|
-
React__default[
|
|
1646
|
-
React__default[
|
|
1647
|
-
React__default[
|
|
1684
|
+
return (React__default["default"].createElement(React.Fragment, null,
|
|
1685
|
+
React__default["default"].createElement("div", { className: "modal show " + styles$f.modal, style: { display: 'block' } },
|
|
1686
|
+
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1687
|
+
React__default["default"].createElement("div", { className: 'modal-content ' + (!!fullScreen ? styles$f['modalContent'] : undefined) },
|
|
1648
1688
|
header &&
|
|
1649
|
-
React__default[
|
|
1650
|
-
React__default[
|
|
1689
|
+
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1690
|
+
React__default["default"].createElement(ModalBody, null, children),
|
|
1651
1691
|
footer &&
|
|
1652
|
-
React__default[
|
|
1653
|
-
React__default[
|
|
1692
|
+
React__default["default"].createElement(ModalFooter, null, footer)))),
|
|
1693
|
+
React__default["default"].createElement(Backdrop, { onClick: handleClickBackdrop })));
|
|
1654
1694
|
};
|
|
1655
1695
|
|
|
1656
1696
|
// export enum MODALRESULT { OK = 'OK', CANCEL = 'CANCEL', DELETE = 'DELETE' }
|
|
@@ -1708,11 +1748,11 @@ const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismi
|
|
|
1708
1748
|
}
|
|
1709
1749
|
button.handler && button.handler();
|
|
1710
1750
|
};
|
|
1711
|
-
return (React__default[
|
|
1712
|
-
description && React__default[
|
|
1751
|
+
return (React__default["default"].createElement(Modal, { size: size, fullScreen: fullScreen, header: title, onHeaderCloseClick: onCancel, isDismissable: isDismissable, footer: React__default["default"].createElement(React.Fragment, null, buttons.map((button, index) => (React__default["default"].createElement(Button, { key: index, variant: button.variant, color: button.color, autoFocus: button.autoFocus, onClick: () => handleClickButton(button) }, button.label)))) },
|
|
1752
|
+
description && React__default["default"].createElement("div", null, description),
|
|
1713
1753
|
modalType === exports.MODALTYPE.FORM &&
|
|
1714
|
-
React__default[
|
|
1715
|
-
React__default[
|
|
1754
|
+
React__default["default"].createElement(React.Fragment, null,
|
|
1755
|
+
React__default["default"].createElement(Form, { ref: myForm, controls: myControls, validateOnBlur: true, onSubmit: onSubmit }))));
|
|
1716
1756
|
};
|
|
1717
1757
|
|
|
1718
1758
|
class ModalService {
|
|
@@ -1729,7 +1769,7 @@ class ModalService {
|
|
|
1729
1769
|
reject();
|
|
1730
1770
|
this.hide();
|
|
1731
1771
|
};
|
|
1732
|
-
reactDom.render(React__default[
|
|
1772
|
+
reactDom.render(React__default["default"].createElement(GlobalModal, { fullScreen: options && options.fullScreen, size: options && options.size, title: title, description: description, formControls: options && options.formControls, onCancel: handleCancel, onOk: handleOk, isDismissable: options && options.isDismissable, buttons: options && options.buttons }), this.container);
|
|
1733
1773
|
}
|
|
1734
1774
|
});
|
|
1735
1775
|
}
|
|
@@ -1767,7 +1807,7 @@ const NumberSelect = (props) => {
|
|
|
1767
1807
|
setNewValue(e);
|
|
1768
1808
|
onChange && onChange(e);
|
|
1769
1809
|
};
|
|
1770
|
-
return (React__default[
|
|
1810
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: numberOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
1771
1811
|
};
|
|
1772
1812
|
|
|
1773
1813
|
class SidebarItemModel {
|
|
@@ -1830,21 +1870,21 @@ const Sidebar = (props) => {
|
|
|
1830
1870
|
const handleClickSubItem = (itemPath, subItemPath, e) => {
|
|
1831
1871
|
navigate(e, `/${itemPath}/${subItemPath}`);
|
|
1832
1872
|
};
|
|
1833
|
-
return (React__default[
|
|
1834
|
-
React__default[
|
|
1835
|
-
React__default[
|
|
1836
|
-
React__default[
|
|
1873
|
+
return (React__default["default"].createElement("nav", { className: "sidebar" },
|
|
1874
|
+
React__default["default"].createElement(List, null, menuItems.map(item => (React__default["default"].createElement(React__default["default"].Fragment, { key: item.id },
|
|
1875
|
+
React__default["default"].createElement(ListItem, { active: isMenuItemActive(item.path), onClick: (e) => handleClickItem(item, e) },
|
|
1876
|
+
React__default["default"].createElement(ListItemText, { primary: React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1837
1877
|
item.label,
|
|
1838
|
-
item.items && item.items.length > 0 && (React__default[
|
|
1878
|
+
item.items && item.items.length > 0 && (React__default["default"].createElement("small", { className: "ml-2" },
|
|
1839
1879
|
"(",
|
|
1840
1880
|
item.items.length,
|
|
1841
1881
|
")"))) }),
|
|
1842
1882
|
item.items && item.items.length > 0 &&
|
|
1843
|
-
React__default[
|
|
1844
|
-
!item.isCollapsed && item.items && item.items.length > 0 && (React__default[
|
|
1883
|
+
React__default["default"].createElement(ListItemAction, null, item.isCollapsed ? React__default["default"].createElement(ChevronDownSolidIcon, null) : React__default["default"].createElement(ChevronUpSolidIcon, null))),
|
|
1884
|
+
!item.isCollapsed && item.items && item.items.length > 0 && (React__default["default"].createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React__default["default"].createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
|
|
1845
1885
|
};
|
|
1846
1886
|
|
|
1847
|
-
var css_248z$d = ".Snackbar-module_snackbar__3AF3D {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__11jAv 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius)
|
|
1887
|
+
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 .Snackbar-module_snackbar__3AF3D.Snackbar-module_primary__3Pt9m {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Snackbar-module_snackbar__3AF3D.Snackbar-module_accent__1iCXk {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Snackbar-module_snackbar__3AF3D.Snackbar-module_secondary__3ke12 {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Snackbar-module_snackbar__3AF3D.Snackbar-module_light__3Pi0Y {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Snackbar-module_snackbar__3AF3D.Snackbar-module_dark__3TwXn {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Snackbar-module_text__2gmW- {\n width: 100%;\n padding: 8px 0; }\n\n.Snackbar-module_action__1BXqS {\n margin-left: auto; }\n .Snackbar-module_action__1BXqS:hover {\n cursor: pointer; }\n\n@keyframes Snackbar-module_bounceIn__11jAv {\n 0% {\n opacity: 0; }\n 50% {\n opacity: 0.9; }\n 80% {\n opacity: 1; }\n 100% {\n opacity: 1; } }\n";
|
|
1848
1888
|
var styles$d = {"snackbar":"Snackbar-module_snackbar__3AF3D","bounceIn":"Snackbar-module_bounceIn__11jAv","primary":"Snackbar-module_primary__3Pt9m","accent":"Snackbar-module_accent__1iCXk","secondary":"Snackbar-module_secondary__3ke12","light":"Snackbar-module_light__3Pi0Y","dark":"Snackbar-module_dark__3TwXn","text":"Snackbar-module_text__2gmW-","action":"Snackbar-module_action__1BXqS"};
|
|
1849
1889
|
styleInject(css_248z$d);
|
|
1850
1890
|
|
|
@@ -1860,10 +1900,10 @@ const Snackbar = (props) => {
|
|
|
1860
1900
|
const handleClickAction = () => {
|
|
1861
1901
|
onOk && onOk();
|
|
1862
1902
|
};
|
|
1863
|
-
return (React__default[
|
|
1864
|
-
React__default[
|
|
1865
|
-
React__default[
|
|
1866
|
-
React__default[
|
|
1903
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
1904
|
+
React__default["default"].createElement("div", { className: styles$d.text }, message),
|
|
1905
|
+
React__default["default"].createElement("div", { className: styles$d.action + " text-accent", onClick: handleClickAction },
|
|
1906
|
+
React__default["default"].createElement("span", null, actionText))));
|
|
1867
1907
|
};
|
|
1868
1908
|
|
|
1869
1909
|
class SnackbarService {
|
|
@@ -1886,7 +1926,7 @@ class SnackbarService {
|
|
|
1886
1926
|
resolve();
|
|
1887
1927
|
this.hide();
|
|
1888
1928
|
};
|
|
1889
|
-
reactDom.render(React__default[
|
|
1929
|
+
reactDom.render(React__default["default"].createElement(Snackbar, { message: message, color: mergedOptions.color, actionText: mergedOptions.actionText, onOk: handleOk }), this.container);
|
|
1890
1930
|
});
|
|
1891
1931
|
}
|
|
1892
1932
|
hide() {
|
|
@@ -1900,7 +1940,7 @@ class SnackbarService {
|
|
|
1900
1940
|
}
|
|
1901
1941
|
const snackbarService = new SnackbarService();
|
|
1902
1942
|
|
|
1903
|
-
var css_248z$c = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto
|
|
1943
|
+
var css_248z$c = ".SpeedDialActions-module_speedDialActions__zLEps {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto; }\n";
|
|
1904
1944
|
var styles$c = {"speedDialActions":"SpeedDialActions-module_speedDialActions__zLEps"};
|
|
1905
1945
|
styleInject(css_248z$c);
|
|
1906
1946
|
|
|
@@ -1911,10 +1951,10 @@ const SpeedDialActions = (props) => {
|
|
|
1911
1951
|
cssClasses.push(styles$c.speedDialActions);
|
|
1912
1952
|
return cssClasses.filter(css => css).join(' ');
|
|
1913
1953
|
};
|
|
1914
|
-
return (React__default[
|
|
1954
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
1915
1955
|
};
|
|
1916
1956
|
|
|
1917
|
-
var css_248z$b = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
1957
|
+
var css_248z$b = ".SpeedDial-module_speedDial__CQ5x2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n";
|
|
1918
1958
|
var styles$b = {"speedDial":"SpeedDial-module_speedDial__CQ5x2"};
|
|
1919
1959
|
styleInject(css_248z$b);
|
|
1920
1960
|
|
|
@@ -1932,26 +1972,26 @@ const SpeedDial = (props) => {
|
|
|
1932
1972
|
else
|
|
1933
1973
|
onOpen && onOpen(e);
|
|
1934
1974
|
};
|
|
1935
|
-
return (React__default[
|
|
1936
|
-
React__default[
|
|
1937
|
-
React__default[
|
|
1975
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
1976
|
+
React__default["default"].createElement("div", { style: { 'transform': open ? 'rotate(45deg)' : undefined } },
|
|
1977
|
+
React__default["default"].createElement(FloatingActionButton, { icon: React__default["default"].createElement(PlusSolidIcon, null), onClick: handleClick })),
|
|
1938
1978
|
open &&
|
|
1939
|
-
React__default[
|
|
1979
|
+
React__default["default"].createElement(SpeedDialActions, null, children)));
|
|
1940
1980
|
};
|
|
1941
1981
|
|
|
1942
|
-
var css_248z$a = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px
|
|
1982
|
+
var css_248z$a = ".SpeedDialAction-module_speedDialAction__qmExs + .SpeedDialAction-module_speedDialAction__qmExs {\n margin-bottom: 10px; }\n";
|
|
1943
1983
|
var styles$a = {"speedDialAction":"SpeedDialAction-module_speedDialAction__qmExs"};
|
|
1944
1984
|
styleInject(css_248z$a);
|
|
1945
1985
|
|
|
1946
1986
|
const SpeedDialAction = (props) => {
|
|
1947
|
-
const { icon, onClick, className } = props;
|
|
1987
|
+
const { icon, color = exports.COLOR.light, onClick, className } = props;
|
|
1948
1988
|
const getCssClasses = () => {
|
|
1949
1989
|
const cssClasses = [];
|
|
1950
1990
|
cssClasses.push(styles$a.speedDialAction);
|
|
1951
1991
|
className && cssClasses.push(className);
|
|
1952
1992
|
return cssClasses.filter(css => css).join(' ');
|
|
1953
1993
|
};
|
|
1954
|
-
return (React__default[
|
|
1994
|
+
return (React__default["default"].createElement(IconButton, { className: getCssClasses(), icon: icon, color: color, variant: exports.VARIANT.contained, shadow: true, onClick: onClick }));
|
|
1955
1995
|
};
|
|
1956
1996
|
|
|
1957
1997
|
const SpeedDialIcon = (props) => {
|
|
@@ -1961,10 +2001,10 @@ const SpeedDialIcon = (props) => {
|
|
|
1961
2001
|
className && cssClasses.push(className);
|
|
1962
2002
|
return cssClasses.filter(css => css).join(' ');
|
|
1963
2003
|
};
|
|
1964
|
-
return (React__default[
|
|
2004
|
+
return (React__default["default"].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
1965
2005
|
};
|
|
1966
2006
|
|
|
1967
|
-
var css_248z$9 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex
|
|
2007
|
+
var css_248z$9 = ".StepperActions-module_stepperActions__2r5ZT {\n display: flex; }\n";
|
|
1968
2008
|
var styles$9 = {"stepperActions":"StepperActions-module_stepperActions__2r5ZT"};
|
|
1969
2009
|
styleInject(css_248z$9);
|
|
1970
2010
|
|
|
@@ -1976,20 +2016,20 @@ const StepperActions = (props) => {
|
|
|
1976
2016
|
className && cssClasses.push(className);
|
|
1977
2017
|
return cssClasses.filter(css => css).join(' ');
|
|
1978
2018
|
};
|
|
1979
|
-
return (React__default[
|
|
1980
|
-
React__default[
|
|
1981
|
-
React__default[
|
|
1982
|
-
isCompleted && (React__default[
|
|
1983
|
-
isStepOptional && (React__default[
|
|
1984
|
-
React__default[
|
|
2019
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
2020
|
+
React__default["default"].createElement(Button, { className: "mr-2", variant: exports.VARIANT.outline, disabled: isFirstStep, startIcon: !isFirstStep ? React__default["default"].createElement(ChevronLeftSolidIcon, null) : undefined, onClick: () => onBack && onBack() }, "Back"),
|
|
2021
|
+
React__default["default"].createElement("div", { className: "ml-auto" },
|
|
2022
|
+
isCompleted && (React__default["default"].createElement(Button, { className: "mr-2", color: exports.COLOR.secondary, variant: exports.VARIANT.text, onClick: () => onReset && onReset() }, "Reset")),
|
|
2023
|
+
isStepOptional && (React__default["default"].createElement(Button, { className: "mr-2", variant: exports.VARIANT.contained, color: exports.COLOR.primary, onClick: () => onSkip && onSkip() }, "Skip")),
|
|
2024
|
+
React__default["default"].createElement(Button, { variant: exports.VARIANT.contained, color: exports.COLOR.primary, startIcon: isCompleted ? React__default["default"].createElement(CheckSolidIcon, null) : undefined, endIcon: !isCompleted ? React__default["default"].createElement(ChevronRightSolidIcon, null) : undefined, onClick: () => onNext && onNext() }, isCompleted ? 'Done' : 'Next'))));
|
|
1985
2025
|
};
|
|
1986
2026
|
|
|
1987
2027
|
const StepPanel = (props) => {
|
|
1988
2028
|
const { children } = props;
|
|
1989
|
-
return (React__default[
|
|
2029
|
+
return (React__default["default"].createElement("div", { className: "steppanel" }, children));
|
|
1990
2030
|
};
|
|
1991
2031
|
|
|
1992
|
-
var css_248z$8 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px
|
|
2032
|
+
var css_248z$8 = ".StepConnector-module_stepConnector__2m7Xp {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px; }\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 .StepConnector-module_stepConnectorLine__jSqG4.StepConnector-module_isActive__3Yj6N {\n border-color: var(--primary); }\n\n.StepConnector-module_stepConnectorLineHorizontal__3R2R8 {\n border-top-style: solid;\n border-top-width: 1px; }\n";
|
|
1993
2033
|
var styles$8 = {"stepConnector":"StepConnector-module_stepConnector__2m7Xp","stepConnectorLine":"StepConnector-module_stepConnectorLine__jSqG4","isActive":"StepConnector-module_isActive__3Yj6N","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__3R2R8"};
|
|
1994
2034
|
styleInject(css_248z$8);
|
|
1995
2035
|
|
|
@@ -2007,22 +2047,22 @@ const StepConnector = (props) => {
|
|
|
2007
2047
|
isHorizontal && cssClasses.push(styles$8.stepConnectorLineHorizontal);
|
|
2008
2048
|
return cssClasses.filter(css => css).join(' ');
|
|
2009
2049
|
};
|
|
2010
|
-
return (React__default[
|
|
2011
|
-
React__default[
|
|
2050
|
+
return (React__default["default"].createElement("div", { className: getCssClassesConnector() },
|
|
2051
|
+
React__default["default"].createElement("div", { className: getCssClassesLine() })));
|
|
2012
2052
|
};
|
|
2013
2053
|
|
|
2014
|
-
var css_248z$7 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px
|
|
2054
|
+
var css_248z$7 = ".Stepper-module_stepper__1TOxM {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px; }\n .Stepper-module_stepper__1TOxM.Stepper-module_isHorizontal__3rFHH {\n overflow-x: auto; }\n";
|
|
2015
2055
|
var styles$7 = {"stepper":"Stepper-module_stepper__1TOxM","isHorizontal":"Stepper-module_isHorizontal__3rFHH"};
|
|
2016
2056
|
styleInject(css_248z$7);
|
|
2017
2057
|
|
|
2018
2058
|
const Stepper = (props) => {
|
|
2019
2059
|
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
|
|
2020
2060
|
const [steps, setSteps] = React.useState();
|
|
2021
|
-
const [activeIndex, setActiveIndex] = React__default[
|
|
2022
|
-
const [skipped, setSkipped] = React__default[
|
|
2061
|
+
const [activeIndex, setActiveIndex] = React__default["default"].useState(0);
|
|
2062
|
+
const [skipped, setSkipped] = React__default["default"].useState(new Set());
|
|
2023
2063
|
React.useEffect(() => {
|
|
2024
2064
|
if (children) {
|
|
2025
|
-
setSteps(React__default[
|
|
2065
|
+
setSteps(React__default["default"].Children.toArray(children));
|
|
2026
2066
|
}
|
|
2027
2067
|
}, [children]);
|
|
2028
2068
|
React.useEffect(() => {
|
|
@@ -2040,7 +2080,7 @@ const Stepper = (props) => {
|
|
|
2040
2080
|
});
|
|
2041
2081
|
};
|
|
2042
2082
|
const renderSteps = (child, index) => {
|
|
2043
|
-
return React__default[
|
|
2083
|
+
return React__default["default"].isValidElement(child) &&
|
|
2044
2084
|
React.cloneElement(child, {
|
|
2045
2085
|
index: index,
|
|
2046
2086
|
isActive: activeIndex >= index,
|
|
@@ -2105,14 +2145,14 @@ const Stepper = (props) => {
|
|
|
2105
2145
|
isHorizontal && cssClasses.push(styles$7['isHorizontal']);
|
|
2106
2146
|
return cssClasses.filter(css => css).join(' ');
|
|
2107
2147
|
};
|
|
2108
|
-
return (React__default[
|
|
2109
|
-
React__default[
|
|
2110
|
-
React__default[
|
|
2148
|
+
return (React__default["default"].createElement(React__default["default"].Fragment, null, steps &&
|
|
2149
|
+
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
2150
|
+
React__default["default"].createElement("div", { className: getCssClasses() }, steps.map((child, index) => (React__default["default"].createElement(React__default["default"].Fragment, { key: child.props.value },
|
|
2111
2151
|
renderSteps(child, index),
|
|
2112
|
-
index !== steps.length - 1 && React__default[
|
|
2113
|
-
steps && steps.map((step, index) => React__default[
|
|
2114
|
-
React__default[
|
|
2115
|
-
React__default[
|
|
2152
|
+
index !== steps.length - 1 && React__default["default"].createElement(StepConnector, { isActive: activeIndex > index }))))),
|
|
2153
|
+
steps && steps.map((step, index) => React__default["default"].createElement(React.Fragment, { key: step.props.value }, index === activeIndex &&
|
|
2154
|
+
React__default["default"].createElement(StepPanel, null, step.props.children))),
|
|
2155
|
+
React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset }))));
|
|
2116
2156
|
};
|
|
2117
2157
|
|
|
2118
2158
|
function useWindowSize() {
|
|
@@ -2171,7 +2211,7 @@ function useDebounce(callback, timeout, deps) {
|
|
|
2171
2211
|
}, deps);
|
|
2172
2212
|
}
|
|
2173
2213
|
|
|
2174
|
-
var css_248z$6 = ".Step-module_stepWrapper__1se3l {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2214
|
+
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 .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.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 .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 .Step-module_step__2siYu.Step-module_hasLabel__3cdCU svg {\n width: 18px !important;\n height: 18px !important; }\n\n.Step-module_stepIconCircle__3IyDn svg {\n width: 24px;\n height: 24px; }\n\n.Step-module_stepValue__2TVrP {\n position: absolute;\n color: var(--secondary-contrast-text); }\n .Step-module_stepValue__2TVrP .Step-module_isActive__1QTL4 {\n color: var(--primary-contrast-text); }\n";
|
|
2175
2215
|
var styles$6 = {"stepWrapper":"Step-module_stepWrapper__1se3l","hasLabel":"Step-module_hasLabel__3cdCU","disabled":"Step-module_disabled__1R7hh","step":"Step-module_step__2siYu","stepIconCircle":"Step-module_stepIconCircle__3IyDn","stepValue":"Step-module_stepValue__2TVrP","isActive":"Step-module_isActive__1QTL4"};
|
|
2176
2216
|
styleInject(css_248z$6);
|
|
2177
2217
|
|
|
@@ -2198,17 +2238,17 @@ const Step = (props) => {
|
|
|
2198
2238
|
isDisabled && cssClasses.push(styles$6['disabled']);
|
|
2199
2239
|
return cssClasses.filter(css => css).join(' ');
|
|
2200
2240
|
};
|
|
2201
|
-
return (React__default[
|
|
2202
|
-
React__default[
|
|
2203
|
-
React__default[
|
|
2204
|
-
React__default[
|
|
2205
|
-
React__default[
|
|
2206
|
-
React__default[
|
|
2207
|
-
React__default[
|
|
2241
|
+
return (React__default["default"].createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
|
|
2242
|
+
React__default["default"].createElement("div", { className: getCssClassesStep() },
|
|
2243
|
+
React__default["default"].createElement(Icon, { className: styles$6.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? exports.COLOR.primary : exports.COLOR.secondary },
|
|
2244
|
+
React__default["default"].createElement(CircleSolidIcon, null)),
|
|
2245
|
+
React__default["default"].createElement("div", { className: styles$6.stepValue + ' ' + (isActive ? (styles$6.stepValue['isActive']) : '') }, showProgressCheckIcon && isActive && isDone ?
|
|
2246
|
+
React__default["default"].createElement(Icon, null,
|
|
2247
|
+
React__default["default"].createElement(CheckSolidIcon, null))
|
|
2208
2248
|
:
|
|
2209
|
-
React__default[
|
|
2249
|
+
React__default["default"].createElement(Typography, null, index + 1))),
|
|
2210
2250
|
label && showLabel &&
|
|
2211
|
-
React__default[
|
|
2251
|
+
React__default["default"].createElement(Typography, { className: "flex-shrink-0" }, label)));
|
|
2212
2252
|
};
|
|
2213
2253
|
|
|
2214
2254
|
const Table = (props) => {
|
|
@@ -2222,11 +2262,11 @@ const Table = (props) => {
|
|
|
2222
2262
|
className && cssClasses.push(className);
|
|
2223
2263
|
return cssClasses.filter(css => css).join(' ');
|
|
2224
2264
|
};
|
|
2225
|
-
return (React__default[
|
|
2226
|
-
React__default[
|
|
2265
|
+
return (React__default["default"].createElement(ConditionalWrapper, { condition: responsive, wrapper: children => React__default["default"].createElement("div", { className: "table-responsive" }, children) },
|
|
2266
|
+
React__default["default"].createElement("table", { className: getCssClasses() }, children)));
|
|
2227
2267
|
};
|
|
2228
2268
|
|
|
2229
|
-
var css_248z$5 = ".TabIndicator-module_tabIndicator__wj9Qm {\n bottom: 0;\n height: 2px;\n position: absolute;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2269
|
+
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 .TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_primary__2Lc8c {\n background-color: var(--primary); }\n .TabIndicator-module_tabIndicator__wj9Qm.TabIndicator-module_accent__37h0D {\n background-color: var(--accent); }\n";
|
|
2230
2270
|
var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__wj9Qm","primary":"TabIndicator-module_primary__2Lc8c","accent":"TabIndicator-module_accent__37h0D"};
|
|
2231
2271
|
styleInject(css_248z$5);
|
|
2232
2272
|
|
|
@@ -2238,13 +2278,13 @@ const TabIndicator = (props) => {
|
|
|
2238
2278
|
cssClasses.push(styles$5[color]);
|
|
2239
2279
|
return cssClasses.filter(css => css).join(' ');
|
|
2240
2280
|
};
|
|
2241
|
-
return (React__default[
|
|
2281
|
+
return (React__default["default"].createElement("span", { className: getCssClasses(), style: {
|
|
2242
2282
|
width: width,
|
|
2243
2283
|
left: `calc(calc(100% / ${amount}) * ${index})`
|
|
2244
2284
|
} }));
|
|
2245
2285
|
};
|
|
2246
2286
|
|
|
2247
|
-
var css_248z$4 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative
|
|
2287
|
+
var css_248z$4 = ".Tabs-module_tabs__2azkC {\n display: flex;\n position: relative; }\n";
|
|
2248
2288
|
var styles$4 = {"tabs":"Tabs-module_tabs__2azkC"};
|
|
2249
2289
|
styleInject(css_248z$4);
|
|
2250
2290
|
|
|
@@ -2253,7 +2293,7 @@ const Tabs = (props) => {
|
|
|
2253
2293
|
const [selectedValue, setSelectedValue] = React.useState(value);
|
|
2254
2294
|
const [selectedIndex, setSelectedIndex] = React.useState();
|
|
2255
2295
|
React.useEffect(() => {
|
|
2256
|
-
React__default[
|
|
2296
|
+
React__default["default"].Children.toArray(children).forEach((child, index) => {
|
|
2257
2297
|
if (child.props.value === value) {
|
|
2258
2298
|
setSelectedIndex(index);
|
|
2259
2299
|
}
|
|
@@ -2271,21 +2311,21 @@ const Tabs = (props) => {
|
|
|
2271
2311
|
onChange && onChange(event, newValue);
|
|
2272
2312
|
};
|
|
2273
2313
|
const renderTabs = (child, index) => {
|
|
2274
|
-
return React__default[
|
|
2314
|
+
return React__default["default"].isValidElement(child) && React.cloneElement(child, {
|
|
2275
2315
|
key: child.props.value,
|
|
2276
2316
|
isActive: child.props.value === selectedValue,
|
|
2277
2317
|
fixed: fixed,
|
|
2278
2318
|
onClick: (event, newValue) => handleClickTab(event, newValue, index),
|
|
2279
2319
|
});
|
|
2280
2320
|
};
|
|
2281
|
-
return (React__default[
|
|
2282
|
-
React__default[
|
|
2283
|
-
children && React__default[
|
|
2321
|
+
return (React__default["default"].createElement(React.Fragment, null,
|
|
2322
|
+
React__default["default"].createElement("div", { className: getCssClasses() },
|
|
2323
|
+
children && React__default["default"].Children.toArray(children).map((child, index) => renderTabs(child, index)),
|
|
2284
2324
|
children &&
|
|
2285
|
-
React__default[
|
|
2325
|
+
React__default["default"].createElement(TabIndicator, { color: indicatorColor, width: (100 / React__default["default"].Children.toArray(children).length) + '%', index: selectedIndex, amount: React__default["default"].Children.toArray(children).length }))));
|
|
2286
2326
|
};
|
|
2287
2327
|
|
|
2288
|
-
var css_248z$3 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms
|
|
2328
|
+
var css_248z$3 = ".Tab-module_tab__31Fjd {\n padding: 6px 12px;\n overflow: hidden;\n position: relative;\n font-size: 0.875rem;\n min-width: 72px;\n box-sizing: border-box;\n min-height: 48px;\n text-align: center;\n font-weight: 500;\n line-height: 1.75;\n white-space: normal;\n letter-spacing: 0.02857em;\n text-transform: uppercase;\n border-radius: 0;\n flex-grow: 1;\n flex-basis: 0;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n";
|
|
2289
2329
|
var styles$3 = {"tab":"Tab-module_tab__31Fjd"};
|
|
2290
2330
|
styleInject(css_248z$3);
|
|
2291
2331
|
|
|
@@ -2300,15 +2340,15 @@ const Tab = (props) => {
|
|
|
2300
2340
|
className && cssClasses.push(className);
|
|
2301
2341
|
return cssClasses.filter(css => css).join(' ');
|
|
2302
2342
|
};
|
|
2303
|
-
return (React__default[
|
|
2343
|
+
return (React__default["default"].createElement(Button, { className: getCssClasses(), onClick: (event) => onClick && onClick(event, value), isActive: isActive, disabled: disabled }, label));
|
|
2304
2344
|
};
|
|
2305
2345
|
|
|
2306
2346
|
const TabPanel = (props) => {
|
|
2307
2347
|
const { children, className, value, index } = props, rest = __rest(props, ["children", "className", "value", "index"]);
|
|
2308
|
-
return (React__default[
|
|
2348
|
+
return (React__default["default"].createElement("div", Object.assign({ role: "tabpanel", hidden: value !== index, id: `tabpanel-${index}`, "aria-labelledby": `wrapped-tab-${index}` }, rest), value === index && children));
|
|
2309
2349
|
};
|
|
2310
2350
|
|
|
2311
|
-
var css_248z$2 = ".Tooltip-module_tooltipContainer__3SPVX {\n display: inline
|
|
2351
|
+
var css_248z$2 = ".Tooltip-module_tooltipContainer__3SPVX {\n display: inline; }\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 .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 .Tooltip-module_tooltip__1AML3 #Tooltip-module_arrow__2c3YL::before {\n content: \"\";\n transform: rotate(45deg);\n background: #333; }\n .Tooltip-module_tooltip__1AML3[data-popper-placement^=\"top\"] > #Tooltip-module_arrow__2c3YL {\n bottom: -4px; }\n .Tooltip-module_tooltip__1AML3[data-popper-placement^=\"bottom\"] > #Tooltip-module_arrow__2c3YL {\n top: -4px; }\n .Tooltip-module_tooltip__1AML3[data-popper-placement^=\"left\"] > #Tooltip-module_arrow__2c3YL {\n right: -4px; }\n .Tooltip-module_tooltip__1AML3[data-popper-placement^=\"right\"] > #Tooltip-module_arrow__2c3YL {\n left: -4px; }\n";
|
|
2312
2352
|
var styles$2 = {"tooltipContainer":"Tooltip-module_tooltipContainer__3SPVX","tooltip":"Tooltip-module_tooltip__1AML3","arrow":"Tooltip-module_arrow__2c3YL"};
|
|
2313
2353
|
styleInject(css_248z$2);
|
|
2314
2354
|
|
|
@@ -2337,15 +2377,15 @@ const Tooltip = (props) => {
|
|
|
2337
2377
|
const handleMouseLeave = () => {
|
|
2338
2378
|
setShow(false);
|
|
2339
2379
|
};
|
|
2340
|
-
return (React__default[
|
|
2341
|
-
React__default[
|
|
2380
|
+
return (React__default["default"].createElement(React.Fragment, null,
|
|
2381
|
+
React__default["default"].createElement("div", { className: styles$2.tooltipContainer, ref: refChild, id: "tooltip-container" }, React.cloneElement(children, {
|
|
2342
2382
|
onMouseOver: handleMouseOver,
|
|
2343
2383
|
onMouseLeave: handleMouseLeave,
|
|
2344
2384
|
})),
|
|
2345
2385
|
show &&
|
|
2346
|
-
React__default[
|
|
2386
|
+
React__default["default"].createElement("div", { className: styles$2.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2347
2387
|
text,
|
|
2348
|
-
React__default[
|
|
2388
|
+
React__default["default"].createElement("div", { id: "arrow", "data-popper-arrow": true }))));
|
|
2349
2389
|
};
|
|
2350
2390
|
|
|
2351
2391
|
const HourSelect = (props) => {
|
|
@@ -2368,7 +2408,7 @@ const HourSelect = (props) => {
|
|
|
2368
2408
|
setNewValue(e);
|
|
2369
2409
|
onChange && onChange(e);
|
|
2370
2410
|
};
|
|
2371
|
-
return (React__default[
|
|
2411
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: hourOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
2372
2412
|
};
|
|
2373
2413
|
|
|
2374
2414
|
const MilliSecondSelect = (props) => {
|
|
@@ -2391,7 +2431,7 @@ const MilliSecondSelect = (props) => {
|
|
|
2391
2431
|
setNewValue(e);
|
|
2392
2432
|
onChange && onChange(e);
|
|
2393
2433
|
};
|
|
2394
|
-
return (React__default[
|
|
2434
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: milliSecondOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
2395
2435
|
};
|
|
2396
2436
|
|
|
2397
2437
|
const MinuteSelect = (props) => {
|
|
@@ -2414,7 +2454,7 @@ const MinuteSelect = (props) => {
|
|
|
2414
2454
|
setNewValue(e);
|
|
2415
2455
|
onChange && onChange(e);
|
|
2416
2456
|
};
|
|
2417
|
-
return (React__default[
|
|
2457
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: minuteOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
2418
2458
|
};
|
|
2419
2459
|
|
|
2420
2460
|
const SecondSelect = (props) => {
|
|
@@ -2437,7 +2477,7 @@ const SecondSelect = (props) => {
|
|
|
2437
2477
|
setNewValue(e);
|
|
2438
2478
|
onChange && onChange(e);
|
|
2439
2479
|
};
|
|
2440
|
-
return (React__default[
|
|
2480
|
+
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: secondOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
2441
2481
|
};
|
|
2442
2482
|
|
|
2443
2483
|
exports.TIMEMODE = void 0;
|
|
@@ -2468,26 +2508,26 @@ const TimeSelect = (props) => {
|
|
|
2468
2508
|
setCurrDate(newDate);
|
|
2469
2509
|
onChange && onChange(newDate);
|
|
2470
2510
|
};
|
|
2471
|
-
return (React__default[
|
|
2511
|
+
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
2472
2512
|
showHours &&
|
|
2473
|
-
React__default[
|
|
2474
|
-
React__default[
|
|
2475
|
-
React__default[
|
|
2513
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2514
|
+
React__default["default"].createElement(FormLabel, null, "Hours"),
|
|
2515
|
+
React__default["default"].createElement(HourSelect, { className: "form-control", value: currDate.getHours(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.HOUR) })),
|
|
2476
2516
|
showMinutes &&
|
|
2477
|
-
React__default[
|
|
2478
|
-
React__default[
|
|
2479
|
-
React__default[
|
|
2517
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2518
|
+
React__default["default"].createElement(FormLabel, null, "Minutes"),
|
|
2519
|
+
React__default["default"].createElement(MinuteSelect, { className: "form-control", value: currDate.getMinutes(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MINUTE) })),
|
|
2480
2520
|
showSeconds &&
|
|
2481
|
-
React__default[
|
|
2482
|
-
React__default[
|
|
2483
|
-
React__default[
|
|
2521
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2522
|
+
React__default["default"].createElement(FormLabel, null, "Seconds"),
|
|
2523
|
+
React__default["default"].createElement(SecondSelect, { className: "form-control", value: currDate.getSeconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.SECONDS) })),
|
|
2484
2524
|
showMilliSeconds &&
|
|
2485
|
-
React__default[
|
|
2486
|
-
React__default[
|
|
2487
|
-
React__default[
|
|
2525
|
+
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2526
|
+
React__default["default"].createElement(FormLabel, null, "Milliseconds"),
|
|
2527
|
+
React__default["default"].createElement(MilliSecondSelect, { className: "form-control", value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MILLISECONDS) }))));
|
|
2488
2528
|
};
|
|
2489
2529
|
|
|
2490
|
-
var css_248z$1 = ".TreeView-module_treeView__3kmGm {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important
|
|
2530
|
+
var css_248z$1 = ".TreeView-module_treeView__3kmGm {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important; }\n .TreeView-module_treeView__3kmGm ul {\n padding-left: 48px !important; }\n";
|
|
2491
2531
|
var styles$1 = {"treeView":"TreeView-module_treeView__3kmGm"};
|
|
2492
2532
|
styleInject(css_248z$1);
|
|
2493
2533
|
|
|
@@ -2499,10 +2539,10 @@ const TreeView = (props) => {
|
|
|
2499
2539
|
className && cssClasses.push(className);
|
|
2500
2540
|
return cssClasses.filter(css => css).join(' ');
|
|
2501
2541
|
};
|
|
2502
|
-
return (React__default[
|
|
2542
|
+
return (React__default["default"].createElement("ul", { className: getCssClasses() }, children));
|
|
2503
2543
|
};
|
|
2504
2544
|
|
|
2505
|
-
var css_248z = ".TreeItem-module_treeItem__2FtLe {\n display: flex;\n flex-direction: column;\n min-height: 48px;\n justify-content: center
|
|
2545
|
+
var css_248z = ".TreeItem-module_treeItem__2FtLe {\n display: flex;\n flex-direction: column;\n min-height: 48px;\n justify-content: center; }\n";
|
|
2506
2546
|
var styles = {"treeItem":"TreeItem-module_treeItem__2FtLe"};
|
|
2507
2547
|
styleInject(css_248z);
|
|
2508
2548
|
|
|
@@ -2532,14 +2572,14 @@ const TreeItem = (props) => {
|
|
|
2532
2572
|
setIsSelected(!_isSelected);
|
|
2533
2573
|
onSelect && onSelect(nodeId, !_isSelected);
|
|
2534
2574
|
};
|
|
2535
|
-
return (React__default[
|
|
2536
|
-
React__default[
|
|
2575
|
+
return (React__default["default"].createElement("li", { className: getCssClasses(), style: { paddingLeft: `${(48 * (children ? 0 : 1))}px` } },
|
|
2576
|
+
React__default["default"].createElement("div", { className: "d-flex align-items-center" },
|
|
2537
2577
|
children &&
|
|
2538
|
-
React__default[
|
|
2578
|
+
React__default["default"].createElement(IconButton, { onClick: () => handleOnToggleExpand(nodeId), icon: !_isExpanded ? React__default["default"].createElement(ChevronRightSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null) }),
|
|
2539
2579
|
isSelectable &&
|
|
2540
|
-
React__default[
|
|
2580
|
+
React__default["default"].createElement(Checkbox, { checked: _isSelected, onChange: () => handleOnSelect(nodeId) }),
|
|
2541
2581
|
label),
|
|
2542
|
-
children && _isExpanded ? React__default[
|
|
2582
|
+
children && _isExpanded ? React__default["default"].createElement("ul", null, children) : null));
|
|
2543
2583
|
};
|
|
2544
2584
|
|
|
2545
2585
|
exports.Alert = Alert;
|