react-asc 19.0.5 → 20.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Button/Button.d.ts +1 -0
- package/components/Grid/Row/Row.d.ts +4 -1
- package/components/Modal/ModalFooter.d.ts +2 -6
- package/components/Modal/modal.interfaces.d.ts +1 -0
- package/components/Textarea/Textarea.d.ts +4 -1
- package/index.es.js +298 -269
- package/index.js +298 -269
- package/package.json +3 -2
- package/react-asc.scss +33 -6
package/index.js
CHANGED
|
@@ -95,93 +95,93 @@ 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$10 = ".Alert-module_alert__b4tbk {\n border-radius: var(--borderRadius);\n padding: 6px 16px; }\n .Alert-module_alert__b4tbk.Alert-module_shadow__5bz-7 {\n box-shadow: var(--shadow); }\n\n.Alert-module_contained__EM0x6.Alert-module_primary__q4pNj {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n\n.Alert-module_contained__EM0x6.Alert-module_accent__a2WIl {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n\n.Alert-module_contained__EM0x6.Alert-module_secondary__syXKX {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n\n.Alert-module_contained__EM0x6.Alert-module_light__VKCXF {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n\n.Alert-module_contained__EM0x6.Alert-module_dark__3c-Hm {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Alert-module_outline__T2262.Alert-module_primary__q4pNj {\n color: var(--primary) !important;\n border: 1px solid var(--primary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_secondary__syXKX {\n color: var(--secondary) !important;\n border: 1px solid var(--secondary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_accent__a2WIl {\n color: var(--accent) !important;\n border: 1px solid var(--accent) !important; }\n\n.Alert-module_outline__T2262.Alert-module_light__VKCXF {\n color: var(--light-contrast-text) !important;\n border: 1px solid var(--light) !important; }\n\n.Alert-module_outline__T2262.Alert-module_dark__3c-Hm {\n color: var(--dark) !important;\n border: 1px solid var(--dark) !important; }\n";
|
|
99
|
+
var styles$10 = {"alert":"Alert-module_alert__b4tbk","shadow":"Alert-module_shadow__5bz-7","contained":"Alert-module_contained__EM0x6","primary":"Alert-module_primary__q4pNj","accent":"Alert-module_accent__a2WIl","secondary":"Alert-module_secondary__syXKX","light":"Alert-module_light__VKCXF","dark":"Alert-module_dark__3c-Hm","outline":"Alert-module_outline__T2262"};
|
|
100
|
+
styleInject(css_248z$10);
|
|
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$10.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$10.contained);
|
|
109
|
+
cssClasses.push(styles$10[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$10.outline);
|
|
113
|
+
cssClasses.push(styles$10[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$10['shadow']);
|
|
116
116
|
className && cssClasses.push(className);
|
|
117
117
|
return cssClasses.filter(r => r).join(' ');
|
|
118
118
|
};
|
|
119
119
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var css_248z
|
|
123
|
-
var styles
|
|
124
|
-
styleInject(css_248z
|
|
122
|
+
var css_248z$$ = ".AppBar-module_appbar__Neyh3 {\n padding: 0.5rem 1rem;\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0; }\n .AppBar-module_appbar__Neyh3.AppBar-module_primary__xMqXD {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_secondary__8MkLA {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_accent__vHbkp {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .AppBar-module_appbar__Neyh3.AppBar-module_light__HGy3y {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .AppBar-module_appbar__Neyh3.AppBar-module_dark__ILq96 {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .AppBar-module_appbar__Neyh3.AppBar-module_shadow__gQN8s {\n box-shadow: var(--shadow); }\n";
|
|
123
|
+
var styles$$ = {"appbar":"AppBar-module_appbar__Neyh3","primary":"AppBar-module_primary__xMqXD","secondary":"AppBar-module_secondary__8MkLA","accent":"AppBar-module_accent__vHbkp","light":"AppBar-module_light__HGy3y","dark":"AppBar-module_dark__ILq96","shadow":"AppBar-module_shadow__gQN8s"};
|
|
124
|
+
styleInject(css_248z$$);
|
|
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$$[color]);
|
|
131
|
+
cssClasses.push(styles$$.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$$['shadow']);
|
|
133
133
|
className && cssClasses.push(className);
|
|
134
134
|
return cssClasses.filter(r => r).join(' ');
|
|
135
135
|
};
|
|
136
136
|
return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
137
137
|
};
|
|
138
138
|
|
|
139
|
-
var css_248z$
|
|
140
|
-
var styles$
|
|
141
|
-
styleInject(css_248z$
|
|
139
|
+
var css_248z$_ = ".AppBarTitle-module_appbarTitle__RsFg5 {\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__RsFg5:hover {\n cursor: pointer; }\n";
|
|
140
|
+
var styles$_ = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
|
|
141
|
+
styleInject(css_248z$_);
|
|
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$_.appbarTitle);
|
|
148
148
|
className && cssClasses.push(className);
|
|
149
149
|
return cssClasses.filter(r => r).join(' ');
|
|
150
150
|
};
|
|
151
151
|
return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
152
152
|
};
|
|
153
153
|
|
|
154
|
-
var css_248z$
|
|
155
|
-
var styles$
|
|
156
|
-
styleInject(css_248z$
|
|
154
|
+
var css_248z$Z = ".Icon-module_icon__lFKCA {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px; }\n .Icon-module_icon__lFKCA svg {\n width: inherit;\n height: inherit; }\n .Icon-module_icon__lFKCA.Icon-module_primary__3fID- {\n color: var(--primary); }\n .Icon-module_icon__lFKCA.Icon-module_accent__aZXGb {\n color: var(--accent); }\n .Icon-module_icon__lFKCA.Icon-module_secondary__HKKop {\n color: var(--secondary); }\n .Icon-module_icon__lFKCA.Icon-module_light__-ApMm {\n color: var(--light); }\n .Icon-module_icon__lFKCA.Icon-module_dark__DpCIK {\n color: var(--dark); }\n";
|
|
155
|
+
var styles$Z = {"icon":"Icon-module_icon__lFKCA","primary":"Icon-module_primary__3fID-","accent":"Icon-module_accent__aZXGb","secondary":"Icon-module_secondary__HKKop","light":"Icon-module_light__-ApMm","dark":"Icon-module_dark__DpCIK"};
|
|
156
|
+
styleInject(css_248z$Z);
|
|
157
157
|
|
|
158
158
|
const Icon = (props) => {
|
|
159
159
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
160
160
|
const getCssClasses = () => {
|
|
161
161
|
const cssClasses = [];
|
|
162
|
-
cssClasses.push(styles$
|
|
163
|
-
iconColor && cssClasses.push(styles$
|
|
162
|
+
cssClasses.push(styles$Z.icon);
|
|
163
|
+
iconColor && cssClasses.push(styles$Z[iconColor]);
|
|
164
164
|
className && cssClasses.push(className);
|
|
165
165
|
return cssClasses.filter(css => css).join(' ');
|
|
166
166
|
};
|
|
167
167
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
168
168
|
};
|
|
169
169
|
|
|
170
|
-
var css_248z$
|
|
171
|
-
var styles$
|
|
172
|
-
styleInject(css_248z$
|
|
170
|
+
var css_248z$Y = ".IconButton-module_iconButton__rpCPQ {\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__rpCPQ:hover {\n cursor: pointer; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_shadow__Uw0RK {\n box-shadow: var(--shadow); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_md__XnuSk {\n width: 48px;\n height: 48px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_lg__arEvo {\n width: 56px;\n height: 56px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag {\n padding: 0;\n background: transparent;\n color: inherit; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G {\n color: var(--primary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY {\n color: var(--secondary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2 {\n color: var(--accent); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO {\n color: var(--light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH {\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n color: var(--dark-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G {\n background-color: var(--primary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n background-color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY {\n background-color: var(--secondary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n background-color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2 {\n background-color: var(--accent);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n background-color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO {\n background-color: var(--light);\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n background-color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH {\n background-color: var(--dark);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n background-color: var(--dark-light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n .IconButton-module_iconButton__rpCPQ:focus {\n color: #212529;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px #00000013, 0 0 0 0.25rem #0d6efd40; }\n";
|
|
171
|
+
var styles$Y = {"iconButton":"IconButton-module_iconButton__rpCPQ","shadow":"IconButton-module_shadow__Uw0RK","md":"IconButton-module_md__XnuSk","lg":"IconButton-module_lg__arEvo","text":"IconButton-module_text__Ualag","active":"IconButton-module_active__VIqU9","primary":"IconButton-module_primary__vbo-G","secondary":"IconButton-module_secondary__AiNAY","accent":"IconButton-module_accent__QRzM2","light":"IconButton-module_light__YNEiO","dark":"IconButton-module_dark__gnbUH","disabled":"IconButton-module_disabled__QB0ZV","contained":"IconButton-module_contained__k7vGA"};
|
|
172
|
+
styleInject(css_248z$Y);
|
|
173
173
|
|
|
174
174
|
const IconButton = (props) => {
|
|
175
175
|
const { children, icon, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
176
176
|
const getCssClasses = () => {
|
|
177
177
|
const cssClasses = [];
|
|
178
|
-
cssClasses.push(styles$
|
|
179
|
-
cssClasses.push(styles$
|
|
180
|
-
cssClasses.push(styles$
|
|
181
|
-
cssClasses.push(styles$
|
|
182
|
-
isActive && cssClasses.push(styles$
|
|
183
|
-
disabled && cssClasses.push(styles$
|
|
184
|
-
shadow && cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$Y[color]);
|
|
179
|
+
cssClasses.push(styles$Y[variant]);
|
|
180
|
+
cssClasses.push(styles$Y[size]);
|
|
181
|
+
cssClasses.push(styles$Y.iconButton);
|
|
182
|
+
isActive && cssClasses.push(styles$Y.active);
|
|
183
|
+
disabled && cssClasses.push(styles$Y.disabled);
|
|
184
|
+
shadow && cssClasses.push(styles$Y.shadow);
|
|
185
185
|
className && cssClasses.push(className);
|
|
186
186
|
return cssClasses.filter(css => css).join(' ');
|
|
187
187
|
};
|
|
@@ -290,6 +290,10 @@ function useDebounce(callback, timeout, deps) {
|
|
|
290
290
|
}, deps);
|
|
291
291
|
}
|
|
292
292
|
|
|
293
|
+
var css_248z$X = ".Backdrop-module_backdrop__IRMoL {\n height: 100%;\n width: 100%;\n position: absolute;\n opacity: 0.5;\n z-index: 1040;\n top: 0;\n left: 0;\n background-color: #000; }\n";
|
|
294
|
+
var styles$X = {"backdrop":"Backdrop-module_backdrop__IRMoL"};
|
|
295
|
+
styleInject(css_248z$X);
|
|
296
|
+
|
|
293
297
|
const Backdrop = (props) => {
|
|
294
298
|
const { target = document.body, isTransparent = false, onClick, style } = props, rest = __rest(props, ["target", "isTransparent", "onClick", "style"]);
|
|
295
299
|
const handleClick = (e) => {
|
|
@@ -298,10 +302,8 @@ const Backdrop = (props) => {
|
|
|
298
302
|
};
|
|
299
303
|
const getCssClasses = () => {
|
|
300
304
|
const cssClasses = [];
|
|
301
|
-
cssClasses.push(
|
|
302
|
-
|
|
303
|
-
cssClasses.push(`bg-transparent`);
|
|
304
|
-
}
|
|
305
|
+
cssClasses.push(styles$X.backdrop);
|
|
306
|
+
isTransparent && cssClasses.push(`bg-transparent`);
|
|
305
307
|
return cssClasses.filter(css => css).join(' ');
|
|
306
308
|
};
|
|
307
309
|
const getStyles = () => {
|
|
@@ -311,34 +313,34 @@ const Backdrop = (props) => {
|
|
|
311
313
|
return (reactDom.createPortal(React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
312
314
|
};
|
|
313
315
|
|
|
314
|
-
var css_248z$
|
|
315
|
-
var styles$
|
|
316
|
-
styleInject(css_248z$
|
|
316
|
+
var css_248z$W = ".List-module_list__gpZ41 {\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";
|
|
317
|
+
var styles$W = {"list":"List-module_list__gpZ41"};
|
|
318
|
+
styleInject(css_248z$W);
|
|
317
319
|
|
|
318
320
|
const List = (props) => {
|
|
319
321
|
const { children, className, isFlush } = props, rest = __rest(props, ["children", "className", "isFlush"]);
|
|
320
322
|
const getCssClasses = () => {
|
|
321
323
|
const cssClasses = [];
|
|
322
|
-
isFlush && cssClasses.push(styles$
|
|
323
|
-
cssClasses.push(styles$
|
|
324
|
+
isFlush && cssClasses.push(styles$W.flush);
|
|
325
|
+
cssClasses.push(styles$W.list);
|
|
324
326
|
className && cssClasses.push(className);
|
|
325
327
|
return cssClasses.filter(css => css).join(' ');
|
|
326
328
|
};
|
|
327
329
|
return (React__default["default"].createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
|
|
328
330
|
};
|
|
329
331
|
|
|
330
|
-
var css_248z$
|
|
331
|
-
var styles$
|
|
332
|
-
styleInject(css_248z$
|
|
332
|
+
var css_248z$V = ".ListItem-module_listItem__Pk1AP {\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__Pk1AP:hover, .ListItem-module_listItem__Pk1AP.ListItem-module_active__zm2q8 {\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__Pk1AP + .ListItem-module_listItem__Pk1AP {\n border-top-width: 0; }\n .ListItem-module_listItem__Pk1AP.ListItem-module_primary__F6Qja {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_accent__pg3Ha {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_secondary__d0drD {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_light__37kby {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_dark__ZxQTF {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl {\n color: rgba(0, 0, 0, 0.26); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl:hover {\n cursor: not-allowed;\n background-color: inherit; }\n";
|
|
333
|
+
var styles$V = {"listItem":"ListItem-module_listItem__Pk1AP","active":"ListItem-module_active__zm2q8","primary":"ListItem-module_primary__F6Qja","accent":"ListItem-module_accent__pg3Ha","secondary":"ListItem-module_secondary__d0drD","light":"ListItem-module_light__37kby","dark":"ListItem-module_dark__ZxQTF","disabled":"ListItem-module_disabled__DQLKl"};
|
|
334
|
+
styleInject(css_248z$V);
|
|
333
335
|
|
|
334
336
|
const ListItem = (props) => {
|
|
335
337
|
const { children, color, active, className, disabled, onClick } = props, rest = __rest(props, ["children", "color", "active", "className", "disabled", "onClick"]);
|
|
336
338
|
const getCssClasses = () => {
|
|
337
339
|
const cssClasses = [];
|
|
338
|
-
cssClasses.push(styles$
|
|
339
|
-
color && cssClasses.push(styles$
|
|
340
|
-
active && cssClasses.push(styles$
|
|
341
|
-
disabled && cssClasses.push(styles$
|
|
340
|
+
cssClasses.push(styles$V.listItem);
|
|
341
|
+
color && cssClasses.push(styles$V[color]);
|
|
342
|
+
active && cssClasses.push(styles$V['active']);
|
|
343
|
+
disabled && cssClasses.push(styles$V['disabled']);
|
|
342
344
|
className && cssClasses.push(className);
|
|
343
345
|
return cssClasses.filter(css => css).join(' ');
|
|
344
346
|
};
|
|
@@ -348,42 +350,42 @@ const ListItem = (props) => {
|
|
|
348
350
|
return (React__default["default"].createElement("li", Object.assign({ onClick: handleClick, className: getCssClasses() }, rest), children));
|
|
349
351
|
};
|
|
350
352
|
|
|
351
|
-
var css_248z$
|
|
352
|
-
var styles$
|
|
353
|
-
styleInject(css_248z$
|
|
353
|
+
var css_248z$U = ".ListItemAvatar-module_avatar__sVWfR {\n margin-right: 16px; }\n .ListItemAvatar-module_avatar__sVWfR svg, .ListItemAvatar-module_avatar__sVWfR img {\n width: 24px;\n height: 24px; }\n .ListItemAvatar-module_avatar__sVWfR img {\n border-radius: 50%; }\n";
|
|
354
|
+
var styles$U = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
|
|
355
|
+
styleInject(css_248z$U);
|
|
354
356
|
|
|
355
357
|
const ListItemAvatar = (_a) => {
|
|
356
358
|
var { avatar } = _a, rest = __rest(_a, ["avatar"]);
|
|
357
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
359
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$U.avatar }, rest), avatar));
|
|
358
360
|
};
|
|
359
361
|
|
|
360
|
-
var css_248z$
|
|
361
|
-
var styles$
|
|
362
|
-
styleInject(css_248z$
|
|
362
|
+
var css_248z$T = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px; }\n .ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px; }\n";
|
|
363
|
+
var styles$T = {"icon":"ListItemIcon-module_icon__cCvEv"};
|
|
364
|
+
styleInject(css_248z$T);
|
|
363
365
|
|
|
364
366
|
const ListItemIcon = (_a) => {
|
|
365
367
|
var { icon } = _a, rest = __rest(_a, ["icon"]);
|
|
366
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
368
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$T.icon }, rest), icon));
|
|
367
369
|
};
|
|
368
370
|
|
|
369
|
-
var css_248z$
|
|
370
|
-
var styles$
|
|
371
|
-
styleInject(css_248z$
|
|
371
|
+
var css_248z$S = ".ListItemAction-module_listItemAction__gAQRj {\n display: flex;\n justify-content: center;\n min-width: 40px; }\n .ListItemAction-module_listItemAction__gAQRj svg {\n width: 20px;\n height: 20px; }\n";
|
|
372
|
+
var styles$S = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
|
|
373
|
+
styleInject(css_248z$S);
|
|
372
374
|
|
|
373
375
|
const ListItemAction = (_a) => {
|
|
374
376
|
var { children, onClick } = _a, rest = __rest(_a, ["children", "onClick"]);
|
|
375
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
377
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$S.listItemAction, onClick: e => onClick && onClick(e) }, rest), children));
|
|
376
378
|
};
|
|
377
379
|
|
|
378
|
-
var css_248z$
|
|
379
|
-
var styles$
|
|
380
|
-
styleInject(css_248z$
|
|
380
|
+
var css_248z$R = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1; }\n";
|
|
381
|
+
var styles$R = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
382
|
+
styleInject(css_248z$R);
|
|
381
383
|
|
|
382
384
|
const ListItemText = (_a) => {
|
|
383
385
|
var { primary, secondary } = _a, rest = __rest(_a, ["primary", "secondary"]);
|
|
384
386
|
const getCssClasses = () => {
|
|
385
387
|
const cssClasses = [];
|
|
386
|
-
cssClasses.push(styles$
|
|
388
|
+
cssClasses.push(styles$R.listItemText);
|
|
387
389
|
return cssClasses.filter(css => css).join(' ');
|
|
388
390
|
};
|
|
389
391
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -394,9 +396,9 @@ const ListItemText = (_a) => {
|
|
|
394
396
|
const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
|
|
395
397
|
const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
396
398
|
|
|
397
|
-
var css_248z$
|
|
398
|
-
var styles$
|
|
399
|
-
styleInject(css_248z$
|
|
399
|
+
var css_248z$Q = ".AutoComplete-module_selectContainer__1kA85 {\n position: relative; }\n\n.AutoComplete-module_select__NNYOi {\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 appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px #00000013;\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .AutoComplete-module_select__NNYOi:hover {\n cursor: pointer; }\n .AutoComplete-module_select__NNYOi:focus {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px #00000013, 0 0 0 0.25rem #0d6efd40; }\n\n.AutoComplete-module_selectMenu__Gu81L {\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";
|
|
400
|
+
var styles$Q = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
401
|
+
styleInject(css_248z$Q);
|
|
400
402
|
|
|
401
403
|
// preset value
|
|
402
404
|
// enter -> delay? -> show results
|
|
@@ -452,7 +454,7 @@ const AutoComplete = (props) => {
|
|
|
452
454
|
const getCssClass = () => {
|
|
453
455
|
const cssClasses = [];
|
|
454
456
|
className && cssClasses.push(className);
|
|
455
|
-
cssClasses.push(styles$
|
|
457
|
+
cssClasses.push(styles$Q.select);
|
|
456
458
|
return cssClasses.filter(r => r).join(' ');
|
|
457
459
|
};
|
|
458
460
|
const show = () => setIsShow(true);
|
|
@@ -476,35 +478,35 @@ const AutoComplete = (props) => {
|
|
|
476
478
|
setModel('');
|
|
477
479
|
setSearchText('');
|
|
478
480
|
};
|
|
479
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
481
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$Q.selectContainer },
|
|
480
482
|
React__default["default"].createElement("div", { className: "d-flex" },
|
|
481
483
|
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 }),
|
|
482
484
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
483
485
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
484
486
|
isShow &&
|
|
485
487
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
486
|
-
React__default["default"].createElement("div", { className: styles$
|
|
488
|
+
React__default["default"].createElement("div", { className: styles$Q.selectMenu },
|
|
487
489
|
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 },
|
|
488
490
|
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
489
491
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
490
492
|
};
|
|
491
493
|
|
|
492
|
-
var css_248z$
|
|
493
|
-
var styles$
|
|
494
|
-
styleInject(css_248z$
|
|
494
|
+
var css_248z$P = ".Badge-module_badgeContainer__3nZBs {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle; }\n\n.Badge-module_badge__9ImR0 {\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__9ImR0.Badge-module_primary__41U-t {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Badge-module_badge__9ImR0.Badge-module_accent__OQy2- {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Badge-module_badge__9ImR0.Badge-module_secondary__a9Jfh {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Badge-module_badge__9ImR0.Badge-module_light__4QvQ5 {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Badge-module_badge__9ImR0.Badge-module_dark__g1yUJ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n";
|
|
495
|
+
var styles$P = {"badgeContainer":"Badge-module_badgeContainer__3nZBs","badge":"Badge-module_badge__9ImR0","primary":"Badge-module_primary__41U-t","accent":"Badge-module_accent__OQy2-","secondary":"Badge-module_secondary__a9Jfh","light":"Badge-module_light__4QvQ5","dark":"Badge-module_dark__g1yUJ"};
|
|
496
|
+
styleInject(css_248z$P);
|
|
495
497
|
|
|
496
498
|
const Badge = (props) => {
|
|
497
499
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
498
500
|
const getCssClassesBadgeContainer = () => {
|
|
499
501
|
const cssClasses = [];
|
|
500
|
-
cssClasses.push(styles$
|
|
502
|
+
cssClasses.push(styles$P.badgeContainer);
|
|
501
503
|
className && cssClasses.push(className);
|
|
502
504
|
return cssClasses.filter(css => css).join(' ');
|
|
503
505
|
};
|
|
504
506
|
const getCssClassesBadge = () => {
|
|
505
507
|
const cssClasses = [];
|
|
506
|
-
cssClasses.push(styles$
|
|
507
|
-
cssClasses.push(styles$
|
|
508
|
+
cssClasses.push(styles$P.badge);
|
|
509
|
+
cssClasses.push(styles$P[color]);
|
|
508
510
|
return cssClasses.filter(css => css).join(' ');
|
|
509
511
|
};
|
|
510
512
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -512,26 +514,26 @@ const Badge = (props) => {
|
|
|
512
514
|
React__default["default"].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
513
515
|
};
|
|
514
516
|
|
|
515
|
-
var css_248z$
|
|
516
|
-
var styles$
|
|
517
|
-
styleInject(css_248z$
|
|
517
|
+
var css_248z$O = ".Button-module_button__qeIer {\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 .Button-module_button__qeIer.Button-module_shadow__6N2nE {\n box-shadow: var(--shadow); }\n .Button-module_button__qeIer:hover {\n cursor: pointer; }\n .Button-module_button__qeIer:focus {\n color: #212529;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px #00000013, 0 0 0 0.25rem #0d6efd40; }\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover {\n background-color: var(--primary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover {\n background-color: var(--accent-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover {\n background-color: var(--secondary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover {\n background-color: var(--light-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover {\n background-color: var(--dark-dark); }\n\n.Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed; }\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary) !important; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover {\n text-decoration: none;\n background: var(--light-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important; }\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary) !important;\n border-color: var(--primary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover {\n background: var(--primary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover {\n background: var(--secondary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent) !important;\n border-color: var(--accent) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover {\n background: var(--accent-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover {\n background: var(--light-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark) !important;\n border-color: var(--dark) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover {\n background: var(--dark-highlight) !important; }\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px; }\n";
|
|
518
|
+
var styles$O = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","btnContained":"Button-module_btnContained__16y5l","primary":"Button-module_primary__EUyOu","accent":"Button-module_accent__opVgQ","secondary":"Button-module_secondary__zKoGk","light":"Button-module_light__LXeZy","dark":"Button-module_dark__5oFOT","btnText":"Button-module_btnText__N5Gys","btnOutline":"Button-module_btnOutline__CCFPI","startIcon":"Button-module_startIcon__Eylwr","endIcon":"Button-module_endIcon__pCffL"};
|
|
519
|
+
styleInject(css_248z$O);
|
|
518
520
|
|
|
519
521
|
const Button = (props) => {
|
|
520
|
-
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"]);
|
|
522
|
+
const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon, shadow = true } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon", "shadow"]);
|
|
521
523
|
const getCssClasses = () => {
|
|
522
524
|
const cssClasses = [];
|
|
523
|
-
cssClasses.push(styles$
|
|
525
|
+
cssClasses.push(styles$O.button);
|
|
524
526
|
if (variant !== 'outline' && variant !== 'text') {
|
|
525
|
-
cssClasses.push(styles$
|
|
526
|
-
cssClasses.push(styles$
|
|
527
|
+
cssClasses.push(styles$O.btnContained);
|
|
528
|
+
cssClasses.push(styles$O[color]);
|
|
527
529
|
}
|
|
528
530
|
if (variant === 'outline') {
|
|
529
|
-
cssClasses.push(styles$
|
|
530
|
-
cssClasses.push(styles$
|
|
531
|
+
cssClasses.push(styles$O.btnOutline);
|
|
532
|
+
cssClasses.push(styles$O[color]);
|
|
531
533
|
}
|
|
532
534
|
if (variant === 'text') {
|
|
533
|
-
cssClasses.push(styles$
|
|
534
|
-
cssClasses.push(styles$
|
|
535
|
+
cssClasses.push(styles$O.btnText);
|
|
536
|
+
cssClasses.push(styles$O[color]);
|
|
535
537
|
}
|
|
536
538
|
if (isRounded && variant !== 'text') {
|
|
537
539
|
cssClasses.push(`rounded-pill`);
|
|
@@ -539,42 +541,43 @@ const Button = (props) => {
|
|
|
539
541
|
if (isActive) {
|
|
540
542
|
cssClasses.push('active');
|
|
541
543
|
}
|
|
544
|
+
shadow && cssClasses.push(styles$O.shadow);
|
|
542
545
|
className && cssClasses.push(className);
|
|
543
546
|
return cssClasses.filter(css => css).join(' ');
|
|
544
547
|
};
|
|
545
548
|
return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
546
549
|
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
547
550
|
startIcon &&
|
|
548
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
551
|
+
React__default["default"].createElement(Icon, { className: styles$O.startIcon }, startIcon),
|
|
549
552
|
children,
|
|
550
553
|
endIcon &&
|
|
551
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
554
|
+
React__default["default"].createElement(Icon, { className: styles$O.endIcon }, endIcon))));
|
|
552
555
|
};
|
|
553
556
|
|
|
554
|
-
var css_248z$
|
|
555
|
-
var styles$
|
|
556
|
-
styleInject(css_248z$
|
|
557
|
+
var css_248z$N = ".ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0; }\n\n.ButtonGroup-module_buttonGroup__w6iB- button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0; }\n";
|
|
558
|
+
var styles$N = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
559
|
+
styleInject(css_248z$N);
|
|
557
560
|
|
|
558
561
|
const ButtonGroup = (props) => {
|
|
559
562
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
560
563
|
const getCssClasses = () => {
|
|
561
564
|
const cssClasses = [];
|
|
562
|
-
cssClasses.push(styles$
|
|
565
|
+
cssClasses.push(styles$N.buttonGroup);
|
|
563
566
|
className && cssClasses.push(className);
|
|
564
567
|
return cssClasses.filter(css => css).join(' ');
|
|
565
568
|
};
|
|
566
569
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
567
570
|
};
|
|
568
571
|
|
|
569
|
-
var css_248z$
|
|
570
|
-
var styles$
|
|
571
|
-
styleInject(css_248z$
|
|
572
|
+
var css_248z$M = ".Breadcrumb-module_breadcrumb__-pvAn {\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n margin-bottom: 0;\n list-style: none;\n margin-bottom: 1rem; }\n";
|
|
573
|
+
var styles$M = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
|
|
574
|
+
styleInject(css_248z$M);
|
|
572
575
|
|
|
573
576
|
const Breadcrumb = (props) => {
|
|
574
577
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
575
578
|
const getCssClasses = () => {
|
|
576
579
|
const cssClasses = [];
|
|
577
|
-
cssClasses.push(styles$
|
|
580
|
+
cssClasses.push(styles$M.breadcrumb);
|
|
578
581
|
className && cssClasses.push(className);
|
|
579
582
|
return cssClasses.filter(css => css).join(' ');
|
|
580
583
|
};
|
|
@@ -584,15 +587,15 @@ const Breadcrumb = (props) => {
|
|
|
584
587
|
|
|
585
588
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
586
589
|
|
|
587
|
-
var css_248z$
|
|
588
|
-
var styles$
|
|
589
|
-
styleInject(css_248z$
|
|
590
|
+
var css_248z$L = ".BreadcrumbItem-module_breadcrumbItem__zsUq- {\n display: flex;\n align-items: center; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq- {\n padding-left: 0.5rem; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq-::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\"; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- a:not([href]):not([class]) {\n color: var(--primary); }\n .BreadcrumbItem-module_breadcrumbItem__zsUq-:hover {\n cursor: pointer; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq-.BreadcrumbItem-module_active__Kn1dA:hover {\n cursor: unset; }\n";
|
|
591
|
+
var styles$L = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
|
|
592
|
+
styleInject(css_248z$L);
|
|
590
593
|
|
|
591
594
|
const BreadcrumbItem = (props) => {
|
|
592
595
|
const { children, className, isActive, onClick } = props;
|
|
593
596
|
const getCssClasses = () => {
|
|
594
597
|
const cssClasses = [];
|
|
595
|
-
cssClasses.push(styles$
|
|
598
|
+
cssClasses.push(styles$L.breadcrumbItem);
|
|
596
599
|
className && cssClasses.push(className);
|
|
597
600
|
isActive && cssClasses.push('active');
|
|
598
601
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -604,115 +607,115 @@ const BreadcrumbItem = (props) => {
|
|
|
604
607
|
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
605
608
|
};
|
|
606
609
|
|
|
607
|
-
var css_248z$
|
|
608
|
-
var styles$
|
|
609
|
-
styleInject(css_248z$
|
|
610
|
+
var css_248z$K = ".Card-module_card__TQdQq {\n background: var(--white);\n border-radius: var(--borderRadius); }\n .Card-module_card__TQdQq.Card-module_shadow__NxDVz {\n box-shadow: var(--shadow); }\n";
|
|
611
|
+
var styles$K = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
|
|
612
|
+
styleInject(css_248z$K);
|
|
610
613
|
|
|
611
614
|
const Card = (props) => {
|
|
612
615
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
613
616
|
const getCssClasses = () => {
|
|
614
617
|
const cssClasses = [];
|
|
615
|
-
cssClasses.push(styles$
|
|
616
|
-
shadow && cssClasses.push(styles$
|
|
618
|
+
cssClasses.push(styles$K.card);
|
|
619
|
+
shadow && cssClasses.push(styles$K.shadow);
|
|
617
620
|
className && cssClasses.push(className);
|
|
618
621
|
return cssClasses.filter(css => css).join(' ');
|
|
619
622
|
};
|
|
620
623
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
621
624
|
};
|
|
622
625
|
|
|
623
|
-
var css_248z$
|
|
624
|
-
var styles$
|
|
625
|
-
styleInject(css_248z$
|
|
626
|
+
var css_248z$J = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
|
|
627
|
+
var styles$J = {"cardBody":"CardBody-module_cardBody__X52VY"};
|
|
628
|
+
styleInject(css_248z$J);
|
|
626
629
|
|
|
627
630
|
const CardBody = (props) => {
|
|
628
631
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
629
632
|
const getCssClasses = () => {
|
|
630
633
|
const cssClasses = [];
|
|
631
|
-
cssClasses.push(styles$
|
|
634
|
+
cssClasses.push(styles$J.cardBody);
|
|
632
635
|
className && cssClasses.push(className);
|
|
633
636
|
return cssClasses.filter(css => css).join(' ');
|
|
634
637
|
};
|
|
635
638
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
636
639
|
};
|
|
637
640
|
|
|
638
|
-
var css_248z$
|
|
639
|
-
var styles$
|
|
640
|
-
styleInject(css_248z$
|
|
641
|
+
var css_248z$I = ".CardFooter-module_cardFooter__BpOTG {\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__BpOTG:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); }\n";
|
|
642
|
+
var styles$I = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
|
|
643
|
+
styleInject(css_248z$I);
|
|
641
644
|
|
|
642
645
|
const CardFooter = (props) => {
|
|
643
646
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
644
647
|
const getCssClasses = () => {
|
|
645
648
|
const cssClasses = [];
|
|
646
|
-
cssClasses.push(styles$
|
|
649
|
+
cssClasses.push(styles$I.cardFooter);
|
|
647
650
|
className && cssClasses.push(className);
|
|
648
651
|
return cssClasses.filter(css => css).join(' ');
|
|
649
652
|
};
|
|
650
653
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
651
654
|
};
|
|
652
655
|
|
|
653
|
-
var css_248z$
|
|
654
|
-
var styles$
|
|
655
|
-
styleInject(css_248z$
|
|
656
|
+
var css_248z$H = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important; }\n";
|
|
657
|
+
var styles$H = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
|
|
658
|
+
styleInject(css_248z$H);
|
|
656
659
|
|
|
657
660
|
const CardSubtitle = (props) => {
|
|
658
661
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
659
662
|
const getCssClasses = () => {
|
|
660
663
|
const cssClasses = [];
|
|
661
|
-
cssClasses.push(styles$
|
|
664
|
+
cssClasses.push(styles$H.cardSubtitle);
|
|
662
665
|
className && cssClasses.push(className);
|
|
663
666
|
return cssClasses.filter(css => css).join(' ');
|
|
664
667
|
};
|
|
665
668
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
666
669
|
};
|
|
667
670
|
|
|
668
|
-
var css_248z$
|
|
669
|
-
var styles$
|
|
670
|
-
styleInject(css_248z$
|
|
671
|
+
var css_248z$G = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0; }\n";
|
|
672
|
+
var styles$G = {"cardText":"CardText-module_cardText__UtYd9"};
|
|
673
|
+
styleInject(css_248z$G);
|
|
671
674
|
|
|
672
675
|
const CardText = (props) => {
|
|
673
676
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
674
677
|
const getCssClasses = () => {
|
|
675
678
|
const cssClasses = [];
|
|
676
|
-
cssClasses.push(styles$
|
|
679
|
+
cssClasses.push(styles$G.cardText);
|
|
677
680
|
className && cssClasses.push(className);
|
|
678
681
|
return cssClasses.filter(css => css).join(' ');
|
|
679
682
|
};
|
|
680
683
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
681
684
|
};
|
|
682
685
|
|
|
683
|
-
var css_248z$
|
|
684
|
-
var styles$
|
|
685
|
-
styleInject(css_248z$
|
|
686
|
+
var css_248z$F = ".CardTitle-module_cardTitle__aiPSE {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em; }\n";
|
|
687
|
+
var styles$F = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
|
|
688
|
+
styleInject(css_248z$F);
|
|
686
689
|
|
|
687
690
|
const CardTitle = (props) => {
|
|
688
691
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
689
692
|
const getCssClasses = () => {
|
|
690
693
|
const cssClasses = [];
|
|
691
|
-
cssClasses.push(styles$
|
|
694
|
+
cssClasses.push(styles$F.cardTitle);
|
|
692
695
|
className && cssClasses.push(className);
|
|
693
696
|
return cssClasses.filter(css => css).join(' ');
|
|
694
697
|
};
|
|
695
698
|
return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
696
699
|
};
|
|
697
700
|
|
|
698
|
-
var css_248z$
|
|
699
|
-
var styles$
|
|
700
|
-
styleInject(css_248z$
|
|
701
|
+
var css_248z$E = ".CardImage-module_cardImage__Z6JWW {\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";
|
|
702
|
+
var styles$E = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
|
|
703
|
+
styleInject(css_248z$E);
|
|
701
704
|
|
|
702
705
|
const CardImage = (props) => {
|
|
703
706
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
704
707
|
const getCssClasses = () => {
|
|
705
708
|
const cssClasses = [];
|
|
706
|
-
cssClasses.push(styles$
|
|
709
|
+
cssClasses.push(styles$E.cardImage);
|
|
707
710
|
className && cssClasses.push(className);
|
|
708
711
|
return cssClasses.filter(css => css).join(' ');
|
|
709
712
|
};
|
|
710
713
|
return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
711
714
|
};
|
|
712
715
|
|
|
713
|
-
var css_248z$
|
|
714
|
-
var styles$
|
|
715
|
-
styleInject(css_248z$
|
|
716
|
+
var css_248z$D = ".Checkbox-module_checkboxContainer__x2GCi {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n\n.Checkbox-module_checkboxLabel__nPY4k:hover {\n cursor: pointer; }\n\n.Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed; }\n .Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG:hover {\n cursor: not-allowed; }\n";
|
|
717
|
+
var styles$D = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
|
|
718
|
+
styleInject(css_248z$D);
|
|
716
719
|
|
|
717
720
|
const Checkbox = (props) => {
|
|
718
721
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -739,6 +742,12 @@ const Checkbox = (props) => {
|
|
|
739
742
|
className && cssClasses.push(className);
|
|
740
743
|
return cssClasses.filter(css => css).join(' ');
|
|
741
744
|
};
|
|
745
|
+
const getCssClassesLabel = () => {
|
|
746
|
+
const cssClasses = [];
|
|
747
|
+
cssClasses.push(styles$D.checkboxLabel);
|
|
748
|
+
disabled && cssClasses.push(styles$D['disabled']);
|
|
749
|
+
return cssClasses.filter(css => css).join(' ');
|
|
750
|
+
};
|
|
742
751
|
const getIcon = () => {
|
|
743
752
|
return isChecked ? icons.selected : icons.default;
|
|
744
753
|
};
|
|
@@ -749,24 +758,24 @@ const Checkbox = (props) => {
|
|
|
749
758
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
750
759
|
}
|
|
751
760
|
};
|
|
752
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
761
|
+
return (React__default["default"].createElement("div", { className: styles$D.checkboxContainer },
|
|
753
762
|
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
754
|
-
React__default["default"].createElement("label", { onClick: handleClick, className:
|
|
763
|
+
React__default["default"].createElement("label", { onClick: handleClick, className: getCssClassesLabel() }, label),
|
|
755
764
|
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))));
|
|
756
765
|
};
|
|
757
766
|
|
|
758
|
-
var css_248z$
|
|
759
|
-
var styles$
|
|
760
|
-
styleInject(css_248z$
|
|
767
|
+
var css_248z$C = ".Chip-module_chip__dZ5qz {\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__dZ5qz svg {\n width: 18px;\n height: 18px; }\n .Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx {\n margin-left: 5px; }\n .Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx:hover {\n cursor: pointer; }\n .Chip-module_chip__dZ5qz.Chip-module_primary__YVDi9 {\n background: var(--primary);\n color: var(--primary-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_secondary__-e4xP {\n background: var(--secondary);\n color: var(--secondary-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_accent__ZCTwu {\n background: var(--accent);\n color: var(--accent-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_light__vKs7O {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Chip-module_chip__dZ5qz.Chip-module_dark__G-FLQ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover {\n cursor: pointer; }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_primary__YVDi9 {\n background: var(--primary-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_secondary__-e4xP {\n background: var(--secondary-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_accent__ZCTwu {\n background: var(--accent-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_shadow__v11NF {\n box-shadow: var(--shadow); }\n";
|
|
768
|
+
var styles$C = {"chip":"Chip-module_chip__dZ5qz","deleteIcon":"Chip-module_deleteIcon__--rUx","primary":"Chip-module_primary__YVDi9","secondary":"Chip-module_secondary__-e4xP","accent":"Chip-module_accent__ZCTwu","light":"Chip-module_light__vKs7O","dark":"Chip-module_dark__G-FLQ","clickable":"Chip-module_clickable__qAqVH","shadow":"Chip-module_shadow__v11NF"};
|
|
769
|
+
styleInject(css_248z$C);
|
|
761
770
|
|
|
762
771
|
const Chip = (props) => {
|
|
763
772
|
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"]);
|
|
764
773
|
const getCssClass = () => {
|
|
765
774
|
const cssClasses = [];
|
|
766
|
-
cssClasses.push(styles$
|
|
767
|
-
cssClasses.push(styles$
|
|
768
|
-
shadow && cssClasses.push(styles$
|
|
769
|
-
onClick && cssClasses.push(styles$
|
|
775
|
+
cssClasses.push(styles$C.chip);
|
|
776
|
+
cssClasses.push(styles$C[color]);
|
|
777
|
+
shadow && cssClasses.push(styles$C['shadow']);
|
|
778
|
+
onClick && cssClasses.push(styles$C['clickable']);
|
|
770
779
|
className && cssClasses.push(className);
|
|
771
780
|
return cssClasses.filter(r => r).join(' ');
|
|
772
781
|
};
|
|
@@ -776,18 +785,18 @@ const Chip = (props) => {
|
|
|
776
785
|
};
|
|
777
786
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
778
787
|
React__default["default"].createElement("div", null, children),
|
|
779
|
-
isDeletable && (React__default["default"].createElement("div", { className: styles$
|
|
788
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$C.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
780
789
|
};
|
|
781
790
|
|
|
782
|
-
var css_248z$
|
|
783
|
-
var styles$
|
|
784
|
-
styleInject(css_248z$
|
|
791
|
+
var css_248z$B = ".FormLabel-module_formLabel__TXcHc {\n display: inline-block;\n margin-bottom: 0.5rem; }\n";
|
|
792
|
+
var styles$B = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
793
|
+
styleInject(css_248z$B);
|
|
785
794
|
|
|
786
795
|
const FormLabel = (_a) => {
|
|
787
796
|
var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
|
|
788
797
|
const getCssClasses = () => {
|
|
789
798
|
const cssClasses = [];
|
|
790
|
-
cssClasses.push(styles$
|
|
799
|
+
cssClasses.push(styles$B.formLabel);
|
|
791
800
|
className && cssClasses.push(className);
|
|
792
801
|
return cssClasses.filter(css => css).join(' ');
|
|
793
802
|
};
|
|
@@ -824,9 +833,9 @@ const FileInput = (props) => {
|
|
|
824
833
|
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))));
|
|
825
834
|
};
|
|
826
835
|
|
|
827
|
-
var css_248z$
|
|
828
|
-
var styles$
|
|
829
|
-
styleInject(css_248z$
|
|
836
|
+
var css_248z$A = ".Select-module_selectContainer__DHFDZ {\n position: relative; }\n\n.Select-module_select__Fbn38 {\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 appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px #00000013;\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n align-items: center;\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .Select-module_select__Fbn38:hover {\n cursor: pointer; }\n .Select-module_select__Fbn38:focus {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px #00000013, 0 0 0 0.25rem #0d6efd40; }\n\n.Select-module_selectMenu__8y4kQ {\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";
|
|
837
|
+
var styles$A = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","selectMenu":"Select-module_selectMenu__8y4kQ"};
|
|
838
|
+
styleInject(css_248z$A);
|
|
830
839
|
|
|
831
840
|
const Select = (props) => {
|
|
832
841
|
var _a, _b, _c;
|
|
@@ -839,7 +848,7 @@ const Select = (props) => {
|
|
|
839
848
|
const getCssClass = () => {
|
|
840
849
|
const cssClasses = [];
|
|
841
850
|
className && cssClasses.push(className);
|
|
842
|
-
cssClasses.push(styles$
|
|
851
|
+
cssClasses.push(styles$A.select);
|
|
843
852
|
return cssClasses.filter(r => r).join(' ');
|
|
844
853
|
};
|
|
845
854
|
React.useEffect(() => {
|
|
@@ -957,7 +966,7 @@ const Select = (props) => {
|
|
|
957
966
|
}
|
|
958
967
|
}
|
|
959
968
|
};
|
|
960
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
969
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$A.selectContainer },
|
|
961
970
|
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
962
971
|
!multiple && renderSingleViewModel(),
|
|
963
972
|
multiple && renderMultipleViewModel(),
|
|
@@ -965,7 +974,7 @@ const Select = (props) => {
|
|
|
965
974
|
React__default["default"].createElement(ChevronDownSolidIcon, null))),
|
|
966
975
|
isShow &&
|
|
967
976
|
reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
968
|
-
React__default["default"].createElement("div", { className: styles$
|
|
977
|
+
React__default["default"].createElement("div", { className: styles$A.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 } },
|
|
969
978
|
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) },
|
|
970
979
|
multiple &&
|
|
971
980
|
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -973,32 +982,33 @@ const Select = (props) => {
|
|
|
973
982
|
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
|
|
974
983
|
};
|
|
975
984
|
|
|
976
|
-
var css_248z$
|
|
977
|
-
var styles$
|
|
978
|
-
styleInject(css_248z$
|
|
985
|
+
var css_248z$z = ".Textarea-module_textarea__L5zqa {\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 resize: vertical;\n color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px #00000013;\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: 1px solid #ced4da; }\n .Textarea-module_textarea__L5zqa:focus {\n outline: none !important;\n border-color: var(--primary); }\n .Textarea-module_textarea__L5zqa.Textarea-module_isInvalid__JI01W {\n border-color: #dc3545;\n box-shadow: 0 0 0 0.25rem #dc354540; }\n";
|
|
986
|
+
var styles$z = {"textarea":"Textarea-module_textarea__L5zqa","isInvalid":"Textarea-module_isInvalid__JI01W"};
|
|
987
|
+
styleInject(css_248z$z);
|
|
979
988
|
|
|
980
989
|
const Textarea = (props) => {
|
|
981
|
-
const { className } = props, rest = __rest(props, ["className"]);
|
|
990
|
+
const { className, error } = props, rest = __rest(props, ["className", "error"]);
|
|
982
991
|
const getCssClass = () => {
|
|
983
992
|
const cssClasses = [];
|
|
984
|
-
cssClasses.push(styles$
|
|
993
|
+
cssClasses.push(styles$z.textarea);
|
|
985
994
|
className && cssClasses.push(className);
|
|
995
|
+
error && cssClasses.push(styles$z['isInvalid']);
|
|
986
996
|
return cssClasses.filter(r => r).join(' ');
|
|
987
997
|
};
|
|
988
998
|
return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
989
999
|
};
|
|
990
1000
|
|
|
991
|
-
var css_248z$
|
|
992
|
-
var styles$
|
|
993
|
-
styleInject(css_248z$
|
|
1001
|
+
var css_248z$y = ".FormInput-module_formInput__VXZip {\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__VXZip: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 .FormInput-module_formInput__VXZip.FormInput-module_isInvalid__vQDuz {\n border-color: #dc3545;\n box-shadow: 0 0 0 0.25rem #dc354540; }\n";
|
|
1002
|
+
var styles$y = {"formInput":"FormInput-module_formInput__VXZip","isInvalid":"FormInput-module_isInvalid__vQDuz"};
|
|
1003
|
+
styleInject(css_248z$y);
|
|
994
1004
|
|
|
995
1005
|
const FormInput = (props) => {
|
|
996
|
-
const { value, name, type, placeholder, className
|
|
1006
|
+
const { value, name, type, placeholder, className, isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
997
1007
|
const getCssClasses = () => {
|
|
998
1008
|
const cssClasses = [];
|
|
999
|
-
cssClasses.push(styles$
|
|
1009
|
+
cssClasses.push(styles$y.formInput);
|
|
1000
1010
|
className && cssClasses.push(className);
|
|
1001
|
-
!isValid && cssClasses.push('
|
|
1011
|
+
!isValid && cssClasses.push(styles$y['isInvalid']);
|
|
1002
1012
|
return cssClasses.filter(css => css).join(' ');
|
|
1003
1013
|
};
|
|
1004
1014
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -1023,7 +1033,7 @@ const FormInput = (props) => {
|
|
|
1023
1033
|
type === 'file' &&
|
|
1024
1034
|
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"),
|
|
1025
1035
|
type === 'textarea' &&
|
|
1026
|
-
React__default["default"].createElement(Textarea, { id: name, name: name, className: className
|
|
1036
|
+
React__default["default"].createElement(Textarea, { id: name, name: name, className: className, error: !isValid, value: value, autoFocus: autoFocus, onInput: e => handleOnInput(e.target.value, type, name), onChange: e => handleOnChange(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' } }),
|
|
1027
1037
|
type === 'select' &&
|
|
1028
1038
|
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),
|
|
1029
1039
|
// onKeyDown={e => onKeyDown(e)}
|
|
@@ -1031,7 +1041,7 @@ const FormInput = (props) => {
|
|
|
1031
1041
|
type === 'autocomplete' &&
|
|
1032
1042
|
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), options: options }),
|
|
1033
1043
|
type === 'checkbox' &&
|
|
1034
|
-
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
|
|
1044
|
+
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 }),
|
|
1035
1045
|
type === 'radio' &&
|
|
1036
1046
|
React__default["default"].createElement(React__default["default"].Fragment, null, options.map((option) => React__default["default"].createElement("div", { className: "form-check", key: option.id },
|
|
1037
1047
|
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 }),
|
|
@@ -1048,8 +1058,12 @@ const FormHint = (props) => {
|
|
|
1048
1058
|
return (React__default["default"].createElement("small", { className: getCssClasses() }, children));
|
|
1049
1059
|
};
|
|
1050
1060
|
|
|
1061
|
+
var css_248z$x = ".FormError-module_isInvalid__tO1Sw {\n width: 100%;\n margin-top: 0.25rem;\n font-size: 0.875em;\n color: #dc3545; }\n";
|
|
1062
|
+
var styles$x = {"isInvalid":"FormError-module_isInvalid__tO1Sw"};
|
|
1063
|
+
styleInject(css_248z$x);
|
|
1064
|
+
|
|
1051
1065
|
const FormError = (props) => {
|
|
1052
|
-
const { className =
|
|
1066
|
+
const { className = styles$x.isInvalid, errors = [] } = props;
|
|
1053
1067
|
return (React__default["default"].createElement(React.Fragment, null, errors &&
|
|
1054
1068
|
React__default["default"].createElement("div", { className: className }, errors.map(e => React__default["default"].createElement("div", { key: e.validator }, e.message)))));
|
|
1055
1069
|
};
|
|
@@ -1347,13 +1361,13 @@ const DateSelect = (props) => {
|
|
|
1347
1361
|
return (React__default["default"].createElement("div", { className: getCssClasses() },
|
|
1348
1362
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
1349
1363
|
React__default["default"].createElement(FormLabel, null, "Year"),
|
|
1350
|
-
React__default["default"].createElement(YearSelect, {
|
|
1364
|
+
React__default["default"].createElement(YearSelect, { 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) })),
|
|
1351
1365
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
1352
1366
|
React__default["default"].createElement(FormLabel, null, "Month"),
|
|
1353
|
-
React__default["default"].createElement(MonthSelect, {
|
|
1367
|
+
React__default["default"].createElement(MonthSelect, { value: currDate.getMonth(), disabled: disabled, onChange: e => handleOnChange(e, exports.DATEMODE.MONTH) })),
|
|
1354
1368
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
1355
1369
|
React__default["default"].createElement(FormLabel, null, "Day"),
|
|
1356
|
-
React__default["default"].createElement(DaySelect, {
|
|
1370
|
+
React__default["default"].createElement(DaySelect, { day: currDate.getDate(), month: currDate.getMonth(), year: currDate.getFullYear(), disabled: disabled, onChange: e => handleOnChange(e, exports.DATEMODE.DAY) }))));
|
|
1357
1371
|
};
|
|
1358
1372
|
/*
|
|
1359
1373
|
* result = { year, month, day, dayOfWeek, weekNumber }
|
|
@@ -1366,16 +1380,16 @@ const DateSelect = (props) => {
|
|
|
1366
1380
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1367
1381
|
// };
|
|
1368
1382
|
|
|
1369
|
-
var css_248z$
|
|
1370
|
-
var styles$
|
|
1371
|
-
styleInject(css_248z$
|
|
1383
|
+
var css_248z$w = ".Drawer-module_drawer__kdQCk {\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__kdQCk.Drawer-module_permanent__c-y8y {\n position: inherit;\n z-index: 0; }\n .Drawer-module_drawer__kdQCk.Drawer-module_left__loQVO {\n order: 0; }\n .Drawer-module_drawer__kdQCk.Drawer-module_right__sJ3mZ {\n order: 2; }\n .Drawer-module_drawer__kdQCk.Drawer-module_shadow__Myo3n {\n box-shadow: var(--shadow); }\n\n.Drawer-module_drawerOpen__07ptP {\n overflow: hidden; }\n";
|
|
1384
|
+
var styles$w = {"drawer":"Drawer-module_drawer__kdQCk","permanent":"Drawer-module_permanent__c-y8y","left":"Drawer-module_left__loQVO","right":"Drawer-module_right__sJ3mZ","shadow":"Drawer-module_shadow__Myo3n","drawerOpen":"Drawer-module_drawerOpen__07ptP"};
|
|
1385
|
+
styleInject(css_248z$w);
|
|
1372
1386
|
|
|
1373
1387
|
const Drawer = (props) => {
|
|
1374
1388
|
const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop } = props, rest = __rest(props, ["children", "className", "position", "permanent", "target", "shadow", "onClickBackdrop"]);
|
|
1375
1389
|
React.useEffect(() => {
|
|
1376
|
-
document.body.classList.add(styles$
|
|
1390
|
+
document.body.classList.add(styles$w.drawerOpen);
|
|
1377
1391
|
return () => {
|
|
1378
|
-
document.body.classList.remove(styles$
|
|
1392
|
+
document.body.classList.remove(styles$w.drawerOpen);
|
|
1379
1393
|
};
|
|
1380
1394
|
}, []);
|
|
1381
1395
|
const handleClickBackdrop = () => {
|
|
@@ -1389,10 +1403,10 @@ const DrawerContent = (props) => {
|
|
|
1389
1403
|
const { children, className, position = 'left', permanent = false, shadow } = props, rest = __rest(props, ["children", "className", "position", "permanent", "shadow"]);
|
|
1390
1404
|
const getCssClasses = () => {
|
|
1391
1405
|
const cssClasses = [];
|
|
1392
|
-
cssClasses.push(styles$
|
|
1393
|
-
shadow && cssClasses.push(styles$
|
|
1394
|
-
!!permanent && cssClasses.push(styles$
|
|
1395
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1406
|
+
cssClasses.push(styles$w.drawer);
|
|
1407
|
+
shadow && cssClasses.push(styles$w.shadow);
|
|
1408
|
+
!!permanent && cssClasses.push(styles$w['permanent']);
|
|
1409
|
+
position === 'left' ? cssClasses.push(styles$w['left']) : cssClasses.push(styles$w['right']);
|
|
1396
1410
|
className && cssClasses.push(className);
|
|
1397
1411
|
return cssClasses.filter(css => css).join(' ');
|
|
1398
1412
|
};
|
|
@@ -1406,9 +1420,9 @@ const DrawerContent = (props) => {
|
|
|
1406
1420
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), style: getStyles() }, rest), children));
|
|
1407
1421
|
};
|
|
1408
1422
|
|
|
1409
|
-
var css_248z$
|
|
1410
|
-
var styles$
|
|
1411
|
-
styleInject(css_248z$
|
|
1423
|
+
var css_248z$v = ".MenuBody-module_menuBody__u4FIQ {\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__u4FIQ.MenuBody-module_shadow__OBp-f {\n box-shadow: var(--shadow); }\n";
|
|
1424
|
+
var styles$v = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
|
|
1425
|
+
styleInject(css_248z$v);
|
|
1412
1426
|
|
|
1413
1427
|
const MenuBody = (props) => {
|
|
1414
1428
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1439,8 +1453,8 @@ const MenuBody = (props) => {
|
|
|
1439
1453
|
}, [menuBodyRef]);
|
|
1440
1454
|
const getCssClasses = () => {
|
|
1441
1455
|
const cssClasses = [];
|
|
1442
|
-
cssClasses.push(styles$
|
|
1443
|
-
shadow && cssClasses.push(styles$
|
|
1456
|
+
cssClasses.push(styles$v.menuBody);
|
|
1457
|
+
shadow && cssClasses.push(styles$v.shadow);
|
|
1444
1458
|
className && cssClasses.push(className);
|
|
1445
1459
|
return cssClasses.filter(css => css).join(' ');
|
|
1446
1460
|
};
|
|
@@ -1452,9 +1466,9 @@ const MenuBody = (props) => {
|
|
|
1452
1466
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1453
1467
|
};
|
|
1454
1468
|
|
|
1455
|
-
var css_248z$
|
|
1456
|
-
var styles$
|
|
1457
|
-
styleInject(css_248z$
|
|
1469
|
+
var css_248z$u = ".Menu-module_menu__p8QL- {\n display: flex; }\n";
|
|
1470
|
+
var styles$u = {"menu":"Menu-module_menu__p8QL-"};
|
|
1471
|
+
styleInject(css_248z$u);
|
|
1458
1472
|
|
|
1459
1473
|
const Menu = (props) => {
|
|
1460
1474
|
const { toggle, children, className, open, menuPosition, onClickBackdrop } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop"]);
|
|
@@ -1462,7 +1476,7 @@ const Menu = (props) => {
|
|
|
1462
1476
|
const toggleContainerRef = React.useRef(null);
|
|
1463
1477
|
const getCssClasses = () => {
|
|
1464
1478
|
const cssClasses = [];
|
|
1465
|
-
cssClasses.push(styles$
|
|
1479
|
+
cssClasses.push(styles$u.menu);
|
|
1466
1480
|
className && cssClasses.push(className);
|
|
1467
1481
|
return cssClasses.filter(css => css).join(' ');
|
|
1468
1482
|
};
|
|
@@ -1475,17 +1489,17 @@ const Menu = (props) => {
|
|
|
1475
1489
|
React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1476
1490
|
};
|
|
1477
1491
|
|
|
1478
|
-
var css_248z$
|
|
1479
|
-
var styles$
|
|
1480
|
-
styleInject(css_248z$
|
|
1492
|
+
var css_248z$t = ".MenuItem-module_menuItem__MeBxN {\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__MeBxN.MenuItem-module_menuItemHeader__2l732 {\n margin-bottom: 0;\n font-size: 0.875rem; }\n .MenuItem-module_menuItem__MeBxN:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04); }\n";
|
|
1493
|
+
var styles$t = {"menuItem":"MenuItem-module_menuItem__MeBxN","menuItemHeader":"MenuItem-module_menuItemHeader__2l732"};
|
|
1494
|
+
styleInject(css_248z$t);
|
|
1481
1495
|
|
|
1482
1496
|
const MenuItem = (props) => {
|
|
1483
1497
|
const { children, onClick, type = 'item' } = props;
|
|
1484
1498
|
const getCssClasses = () => {
|
|
1485
1499
|
const cssClasses = [];
|
|
1486
|
-
cssClasses.push(styles$
|
|
1500
|
+
cssClasses.push(styles$t.menuItem);
|
|
1487
1501
|
if (type === 'header') {
|
|
1488
|
-
cssClasses.push(styles$
|
|
1502
|
+
cssClasses.push(styles$t.menuItemHeader);
|
|
1489
1503
|
}
|
|
1490
1504
|
return cssClasses.filter(css => css).join(' ');
|
|
1491
1505
|
};
|
|
@@ -1501,23 +1515,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1501
1515
|
return (React__default["default"].createElement(React.Fragment, null, children));
|
|
1502
1516
|
};
|
|
1503
1517
|
|
|
1504
|
-
var css_248z$
|
|
1505
|
-
var styles$
|
|
1506
|
-
styleInject(css_248z$
|
|
1518
|
+
var css_248z$s = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef; }\n";
|
|
1519
|
+
var styles$s = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
|
|
1520
|
+
styleInject(css_248z$s);
|
|
1507
1521
|
|
|
1508
|
-
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$
|
|
1522
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$s.menuItemDivider });
|
|
1509
1523
|
|
|
1510
|
-
var css_248z$
|
|
1511
|
-
var styles$
|
|
1512
|
-
styleInject(css_248z$
|
|
1524
|
+
var css_248z$r = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px; }\n";
|
|
1525
|
+
var styles$r = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
|
|
1526
|
+
styleInject(css_248z$r);
|
|
1513
1527
|
|
|
1514
1528
|
const ExpansionPanelContent = ({ children }) => {
|
|
1515
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1529
|
+
return (React__default["default"].createElement("div", { className: styles$r.expansionPanelContent }, children));
|
|
1516
1530
|
};
|
|
1517
1531
|
|
|
1518
|
-
var css_248z$
|
|
1519
|
-
var styles$
|
|
1520
|
-
styleInject(css_248z$
|
|
1532
|
+
var css_248z$q = ".ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px; }\n .ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq:hover {\n cursor: pointer;\n background-color: var(--highlight); }\n";
|
|
1533
|
+
var styles$q = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
|
|
1534
|
+
styleInject(css_248z$q);
|
|
1521
1535
|
|
|
1522
1536
|
const ExpansionPanelHeader = (props) => {
|
|
1523
1537
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1525,15 +1539,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1525
1539
|
e.stopPropagation();
|
|
1526
1540
|
onClick && onClick(e);
|
|
1527
1541
|
};
|
|
1528
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1542
|
+
return (React__default["default"].createElement("div", { className: styles$q.expansionPanelHeader, onClick: handleClick },
|
|
1529
1543
|
children,
|
|
1530
1544
|
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1531
1545
|
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1532
1546
|
};
|
|
1533
1547
|
|
|
1534
|
-
var css_248z$
|
|
1535
|
-
var styles$
|
|
1536
|
-
styleInject(css_248z$
|
|
1548
|
+
var css_248z$p = ".ExpansionPanel-module_expansionPanel__m1yQq {\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__m1yQq:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__m1yQq:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph {\n margin: 16px 0; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:first-child {\n margin-top: 0; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:last-child {\n margin-bottom: 0; }\n";
|
|
1549
|
+
var styles$p = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
|
|
1550
|
+
styleInject(css_248z$p);
|
|
1537
1551
|
|
|
1538
1552
|
const ExpansionPanel = (props) => {
|
|
1539
1553
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1543,9 +1557,9 @@ const ExpansionPanel = (props) => {
|
|
|
1543
1557
|
}, [isExpanded]);
|
|
1544
1558
|
const getCssClasses = () => {
|
|
1545
1559
|
const cssClasses = [];
|
|
1546
|
-
cssClasses.push(styles$
|
|
1560
|
+
cssClasses.push(styles$p.expansionPanel);
|
|
1547
1561
|
if (_isExpanded) {
|
|
1548
|
-
cssClasses.push(styles$
|
|
1562
|
+
cssClasses.push(styles$p.isExpanded);
|
|
1549
1563
|
}
|
|
1550
1564
|
return cssClasses.filter(css => css).join(' ');
|
|
1551
1565
|
};
|
|
@@ -1559,16 +1573,16 @@ const ExpansionPanel = (props) => {
|
|
|
1559
1573
|
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1560
1574
|
};
|
|
1561
1575
|
|
|
1562
|
-
var css_248z$
|
|
1563
|
-
var styles$
|
|
1564
|
-
styleInject(css_248z$
|
|
1576
|
+
var css_248z$o = ".FloatingActionButton-module_fab__Rw3kd {\n box-shadow: var(--shadow); }\n .FloatingActionButton-module_fab__Rw3kd.FloatingActionButton-module_fixed__XQOkG {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000; }\n";
|
|
1577
|
+
var styles$o = {"fab":"FloatingActionButton-module_fab__Rw3kd","fixed":"FloatingActionButton-module_fixed__XQOkG"};
|
|
1578
|
+
styleInject(css_248z$o);
|
|
1565
1579
|
|
|
1566
1580
|
const FloatingActionButton = (props) => {
|
|
1567
1581
|
const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1568
1582
|
const getCssClasses = () => {
|
|
1569
1583
|
const cssClasses = [];
|
|
1570
|
-
cssClasses.push(styles$
|
|
1571
|
-
fixed && cssClasses.push(styles$
|
|
1584
|
+
cssClasses.push(styles$o.fab);
|
|
1585
|
+
fixed && cssClasses.push(styles$o['fixed']);
|
|
1572
1586
|
className && cssClasses.push(className);
|
|
1573
1587
|
return cssClasses.filter(css => css).join(' ');
|
|
1574
1588
|
};
|
|
@@ -1579,48 +1593,59 @@ const FloatingActionButton = (props) => {
|
|
|
1579
1593
|
return (React__default["default"].createElement(IconButton, { className: getCssClasses(), color: color, size: size, isActive: isActive, disabled: disabled, icon: icon, variant: exports.VARIANT.contained, onClick: handleClick }));
|
|
1580
1594
|
};
|
|
1581
1595
|
|
|
1596
|
+
var css_248z$n = ".Column-module_column__fcTgl {\n flex: 1 0 0%; }\n";
|
|
1597
|
+
var styles$n = {"column":"Column-module_column__fcTgl"};
|
|
1598
|
+
styleInject(css_248z$n);
|
|
1599
|
+
|
|
1582
1600
|
const Column = (props) => {
|
|
1583
|
-
const { children, className
|
|
1601
|
+
const { children, className } = props,
|
|
1602
|
+
// xs,
|
|
1603
|
+
// sm,
|
|
1604
|
+
// md,
|
|
1605
|
+
// lg,
|
|
1606
|
+
// xl,
|
|
1607
|
+
rest = __rest(props, ["children", "className"]);
|
|
1584
1608
|
const getCssClasses = () => {
|
|
1585
1609
|
const cssClasses = [];
|
|
1586
|
-
!xs && !sm && !md && !lg && !xl && cssClasses.push('col');
|
|
1587
|
-
if (xs)
|
|
1588
|
-
|
|
1589
|
-
if (
|
|
1590
|
-
|
|
1591
|
-
if (
|
|
1592
|
-
|
|
1593
|
-
if (lg)
|
|
1594
|
-
cssClasses.push(`col-lg-${lg.toString()}`);
|
|
1595
|
-
if (xl)
|
|
1596
|
-
cssClasses.push(`col-xl-${xl.toString()}`);
|
|
1610
|
+
// !xs && !sm && !md && !lg && !xl && cssClasses.push('col');
|
|
1611
|
+
// if (xs) cssClasses.push(`col-${xs.toString()}`);
|
|
1612
|
+
// if (sm) cssClasses.push(`col-sm-${sm.toString()}`);
|
|
1613
|
+
// if (md) cssClasses.push(`col-md-${md.toString()}`);
|
|
1614
|
+
// if (lg) cssClasses.push(`col-lg-${lg.toString()}`);
|
|
1615
|
+
// if (xl) cssClasses.push(`col-xl-${xl.toString()}`);
|
|
1616
|
+
cssClasses.push(styles$n.column);
|
|
1597
1617
|
className && cssClasses.push(className);
|
|
1598
1618
|
return cssClasses.filter(css => css).join(' ');
|
|
1599
1619
|
};
|
|
1600
1620
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1601
1621
|
};
|
|
1602
1622
|
|
|
1603
|
-
|
|
1604
|
-
|
|
1623
|
+
var css_248z$m = ".Row-module_row__bTIWp {\n display: flex;\n gap: 15px;\n flex-wrap: wrap; }\n .Row-module_row__bTIWp > * {\n flex-shrink: 0;\n width: 100%;\n min-width: 0;\n max-width: 100%; }\n";
|
|
1624
|
+
var styles$m = {"row":"Row-module_row__bTIWp"};
|
|
1625
|
+
styleInject(css_248z$m);
|
|
1626
|
+
|
|
1627
|
+
const Row = (_a) => {
|
|
1628
|
+
var { children, direction = 'row', className } = _a, rest = __rest(_a, ["children", "direction", "className"]);
|
|
1605
1629
|
const getCssClasses = () => {
|
|
1606
1630
|
const cssClasses = [];
|
|
1607
|
-
cssClasses.push(
|
|
1631
|
+
cssClasses.push(styles$m.row);
|
|
1608
1632
|
className && cssClasses.push(className);
|
|
1633
|
+
direction && cssClasses.push(`flex-${direction}`);
|
|
1609
1634
|
return cssClasses.filter(css => css).join(' ');
|
|
1610
1635
|
};
|
|
1611
1636
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1612
1637
|
};
|
|
1613
1638
|
|
|
1614
|
-
var css_248z$
|
|
1615
|
-
var styles$
|
|
1616
|
-
styleInject(css_248z$
|
|
1639
|
+
var css_248z$l = ".Link-module_link__YlJQl {\n color: var(--primary);\n text-decoration: underline; }\n .Link-module_link__YlJQl:hover {\n color: var(--primary-dark); }\n";
|
|
1640
|
+
var styles$l = {"link":"Link-module_link__YlJQl"};
|
|
1641
|
+
styleInject(css_248z$l);
|
|
1617
1642
|
|
|
1618
1643
|
const Link = (props) => {
|
|
1619
1644
|
const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
|
|
1620
1645
|
const [status, setStatus] = React.useState(STATUS.NORMAL);
|
|
1621
1646
|
const getCssClasses = () => {
|
|
1622
1647
|
const cssClasses = [];
|
|
1623
|
-
cssClasses.push(styles$
|
|
1648
|
+
cssClasses.push(styles$l.link);
|
|
1624
1649
|
className && cssClasses.push(className);
|
|
1625
1650
|
status !== STATUS.NORMAL && cssClasses.push(status);
|
|
1626
1651
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -1634,15 +1659,15 @@ const Link = (props) => {
|
|
|
1634
1659
|
return (React__default["default"].createElement("a", Object.assign({ className: getCssClasses(), href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
|
|
1635
1660
|
};
|
|
1636
1661
|
|
|
1637
|
-
var css_248z$
|
|
1638
|
-
var styles$
|
|
1639
|
-
styleInject(css_248z$
|
|
1662
|
+
var css_248z$k = ".LoadingIndicator-module_loadingIndicatorContainer__GS9OG {\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__EC9sx {\n animation-name: LoadingIndicator-module_spinAnimation__LeY4Z;\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__LeY4Z {\n from {\n transform: rotate(0deg); }\n to {\n transform: rotate(360deg); } }\n";
|
|
1663
|
+
var styles$k = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
|
|
1664
|
+
styleInject(css_248z$k);
|
|
1640
1665
|
|
|
1641
1666
|
const LoadingIndicator = (_a) => {
|
|
1642
1667
|
var rest = __rest(_a, []);
|
|
1643
1668
|
const getCssClasses = () => {
|
|
1644
1669
|
const cssClasses = [];
|
|
1645
|
-
cssClasses.push(styles$
|
|
1670
|
+
cssClasses.push(styles$k.loadingIndicator);
|
|
1646
1671
|
return cssClasses.filter(css => css).join(' ');
|
|
1647
1672
|
};
|
|
1648
1673
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -1652,7 +1677,7 @@ const LoadingIndicator = (_a) => {
|
|
|
1652
1677
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1653
1678
|
const getCssClasses = () => {
|
|
1654
1679
|
const cssClasses = [];
|
|
1655
|
-
cssClasses.push(styles$
|
|
1680
|
+
cssClasses.push(styles$k.loadingIndicatorContainer);
|
|
1656
1681
|
return cssClasses.filter(css => css).join(' ');
|
|
1657
1682
|
};
|
|
1658
1683
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1680,41 +1705,45 @@ class LoadingIndicatorService {
|
|
|
1680
1705
|
}
|
|
1681
1706
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1682
1707
|
|
|
1683
|
-
var css_248z$
|
|
1684
|
-
var styles$
|
|
1685
|
-
styleInject(css_248z$
|
|
1708
|
+
var css_248z$j = ".ModalHeader-module_modalHeader__tw-u- {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n padding: 1rem 1rem;\n border-top-left-radius: calc(0.3rem - 1px);\n border-top-right-radius: calc(0.3rem - 1px);\n border-bottom: none;\n align-items: center; }\n\n.ModalHeader-module_modalTitle__2xShH {\n margin-bottom: 0;\n line-height: 1.5; }\n";
|
|
1709
|
+
var styles$j = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-","modalTitle":"ModalHeader-module_modalTitle__2xShH"};
|
|
1710
|
+
styleInject(css_248z$j);
|
|
1686
1711
|
|
|
1687
1712
|
const ModalHeader = (props) => {
|
|
1688
1713
|
const { children, isDismissable = false, onClose } = props, rest = __rest(props, ["children", "isDismissable", "onClose"]);
|
|
1689
1714
|
const handleClick = () => {
|
|
1690
1715
|
onClose && onClose();
|
|
1691
1716
|
};
|
|
1692
|
-
return (React__default["default"].createElement("div", Object.assign({ className:
|
|
1693
|
-
React__default["default"].createElement("h5", { className:
|
|
1717
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$j.modalHeader }, rest),
|
|
1718
|
+
React__default["default"].createElement("h5", { className: styles$j.modalTitle }, children),
|
|
1694
1719
|
isDismissable &&
|
|
1695
1720
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
1696
1721
|
};
|
|
1697
1722
|
|
|
1698
|
-
|
|
1723
|
+
var css_248z$i = ".ModalBody-module_modalBody__D-gk2 {\n position: relative;\n flex: 1 1 auto;\n padding: 1rem; }\n";
|
|
1724
|
+
var styles$i = {"modalBody":"ModalBody-module_modalBody__D-gk2"};
|
|
1725
|
+
styleInject(css_248z$i);
|
|
1726
|
+
|
|
1727
|
+
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: styles$i.modalBody }, children));
|
|
1699
1728
|
|
|
1700
|
-
var css_248z$h = ".
|
|
1701
|
-
var styles$h = {"
|
|
1729
|
+
var css_248z$h = ".ModalFooter-module_modalFooter__SNm-f {\n display: flex;\n flex-wrap: wrap;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n padding: 0.75rem;\n border-bottom-right-radius: calc(0.3rem - 1px);\n border-bottom-left-radius: calc(0.3rem - 1px); }\n .ModalFooter-module_modalFooter__SNm-f > * {\n margin: 0.25rem; }\n";
|
|
1730
|
+
var styles$h = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1702
1731
|
styleInject(css_248z$h);
|
|
1703
1732
|
|
|
1704
|
-
|
|
1705
|
-
var styles$g = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1706
|
-
styleInject(css_248z$g);
|
|
1733
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: styles$h.modalFooter }, children));
|
|
1707
1734
|
|
|
1708
|
-
|
|
1735
|
+
var css_248z$g = ".Modal-module_modal__HMxWV {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n z-index: 1111 !important;\n border-radius: var(--borderRadius); }\n .Modal-module_modal__HMxWV .Modal-module_sm__CsR6U {\n max-width: 300px; }\n .Modal-module_modal__HMxWV .Modal-module_md__lNggx {\n max-width: 500px; }\n .Modal-module_modal__HMxWV .Modal-module_lg__6dtT2 {\n max-width: 1140px; }\n @media (min-width: 576px) {\n .Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf {\n max-width: 600px; } }\n\n.Modal-module_modalDialog__fNqyK {\n position: relative;\n width: auto;\n pointer-events: none; }\n @media (min-width: 576px) {\n .Modal-module_modalDialog__fNqyK {\n max-width: 500px;\n margin: 1.75rem auto; } }\n\n.Modal-module_modalDialogCentered__sa2wv {\n min-height: calc(100% - 3.5rem);\n display: flex;\n align-items: center; }\n\n.Modal-module_modalContent__9wAwB {\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%;\n pointer-events: auto;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 0.3rem;\n box-shadow: 0 0.125rem 0.25rem black;\n outline: 0; }\n\n.Modal-module_fullscreen__iepGa {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0; }\n .Modal-module_fullscreen__iepGa .Modal-module_modalContent__9wAwB {\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_fullscreen__iepGa {\n max-width: 100% !important; } }\n";
|
|
1736
|
+
var styles$g = {"modal":"Modal-module_modal__HMxWV","sm":"Modal-module_sm__CsR6U","md":"Modal-module_md__lNggx","lg":"Modal-module_lg__6dtT2","modal-dialog":"Modal-module_modal-dialog__U2wGf","modalDialog":"Modal-module_modalDialog__fNqyK","modalDialogCentered":"Modal-module_modalDialogCentered__sa2wv","modalContent":"Modal-module_modalContent__9wAwB","fullscreen":"Modal-module_fullscreen__iepGa"};
|
|
1737
|
+
styleInject(css_248z$g);
|
|
1709
1738
|
|
|
1710
1739
|
const Modal = (props) => {
|
|
1711
1740
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1712
1741
|
const getCssClass = () => {
|
|
1713
1742
|
const cssClasses = [];
|
|
1714
|
-
cssClasses.push(
|
|
1715
|
-
cssClasses.push(styles$
|
|
1716
|
-
|
|
1717
|
-
size && cssClasses.push(styles$
|
|
1743
|
+
cssClasses.push(styles$g.modalDialog);
|
|
1744
|
+
cssClasses.push(styles$g.modalDialogCentered);
|
|
1745
|
+
fullScreen && cssClasses.push(styles$g.fullscreen);
|
|
1746
|
+
size && cssClasses.push(styles$g[size]);
|
|
1718
1747
|
className && cssClasses.push(className);
|
|
1719
1748
|
return cssClasses.filter(r => r).join(' ');
|
|
1720
1749
|
};
|
|
@@ -1727,10 +1756,10 @@ const Modal = (props) => {
|
|
|
1727
1756
|
const handleClickBackdrop = () => {
|
|
1728
1757
|
onBackdropClick && onBackdropClick();
|
|
1729
1758
|
};
|
|
1730
|
-
return (React__default["default"].createElement(
|
|
1731
|
-
React__default["default"].createElement("div", { className:
|
|
1759
|
+
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1760
|
+
React__default["default"].createElement("div", { className: styles$g.modal },
|
|
1732
1761
|
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1733
|
-
React__default["default"].createElement("div", { className:
|
|
1762
|
+
React__default["default"].createElement("div", { className: styles$g.modalContent },
|
|
1734
1763
|
header &&
|
|
1735
1764
|
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1736
1765
|
React__default["default"].createElement(ModalBody, null, children),
|
|
@@ -1754,8 +1783,8 @@ exports.MODALBUTTONTYPE = void 0;
|
|
|
1754
1783
|
})(exports.MODALBUTTONTYPE || (exports.MODALBUTTONTYPE = {}));
|
|
1755
1784
|
|
|
1756
1785
|
const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismissable = false, buttons = [
|
|
1757
|
-
{ label: 'Cancel', type: exports.MODALBUTTONTYPE.CANCEL, color: exports.COLOR.secondary, variant: exports.VARIANT.text,
|
|
1758
|
-
{ label: 'Ok', type: exports.MODALBUTTONTYPE.OK, variant: exports.VARIANT.contained },
|
|
1786
|
+
{ label: 'Cancel', type: exports.MODALBUTTONTYPE.CANCEL, color: exports.COLOR.secondary, variant: exports.VARIANT.text, shadow: false },
|
|
1787
|
+
{ label: 'Ok', type: exports.MODALBUTTONTYPE.OK, variant: exports.VARIANT.contained, focus: true },
|
|
1759
1788
|
], size = exports.SIZE.md, fullScreen = false }) => {
|
|
1760
1789
|
// workaround for getDerivedStateFromProps
|
|
1761
1790
|
const [myControls, setMyControls] = React.useState(null);
|
|
@@ -1794,7 +1823,7 @@ const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismi
|
|
|
1794
1823
|
}
|
|
1795
1824
|
button.handler && button.handler();
|
|
1796
1825
|
};
|
|
1797
|
-
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)))) },
|
|
1826
|
+
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, shadow: button.shadow, onClick: () => handleClickButton(button) }, button.label)))) },
|
|
1798
1827
|
description && React__default["default"].createElement("div", null, description),
|
|
1799
1828
|
modalType === exports.MODALTYPE.FORM &&
|
|
1800
1829
|
React__default["default"].createElement(React.Fragment, null,
|
|
@@ -1845,7 +1874,6 @@ const NumberSelect = (props) => {
|
|
|
1845
1874
|
}, [from, to]);
|
|
1846
1875
|
const getCssClasses = () => {
|
|
1847
1876
|
const cssClasses = [];
|
|
1848
|
-
cssClasses.push('form-control');
|
|
1849
1877
|
className && cssClasses.push(className);
|
|
1850
1878
|
return cssClasses.filter(css => css).join(' ');
|
|
1851
1879
|
};
|
|
@@ -2204,7 +2232,7 @@ const Stepper = (props) => {
|
|
|
2204
2232
|
React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset }))));
|
|
2205
2233
|
};
|
|
2206
2234
|
|
|
2207
|
-
var css_248z$8 = ".Typography-module_typography__sw-td {\n text-overflow: ellipsis;\n
|
|
2235
|
+
var css_248z$8 = ".Typography-module_typography__sw-td {\n text-overflow: ellipsis;\n font-family: var(--fontFamily); }\n\nh1 {\n font-size: 2.5rem; }\n\nh2 {\n font-size: 2rem; }\n\nh3 {\n font-size: 1.75rem; }\n\nh4 {\n font-size: 1.5rem; }\n\nh5 {\n font-size: 1.25rem; }\n\nh6 {\n font-size: 1rem; }\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-weight: 500 !important;\n margin-top: 0;\n margin-bottom: 0.5rem;\n line-height: 1.2; }\n";
|
|
2208
2236
|
var styles$8 = {"typography":"Typography-module_typography__sw-td"};
|
|
2209
2237
|
styleInject(css_248z$8);
|
|
2210
2238
|
|
|
@@ -2213,6 +2241,7 @@ const Wrapper = (props) => {
|
|
|
2213
2241
|
const getCssClasses = () => {
|
|
2214
2242
|
const cssClasses = [];
|
|
2215
2243
|
cssClasses.push(styles$8.typography);
|
|
2244
|
+
cssClasses.push(styles$8.as);
|
|
2216
2245
|
className && cssClasses.push(className);
|
|
2217
2246
|
return cssClasses.filter(css => css).join(' ');
|
|
2218
2247
|
};
|
|
@@ -2535,19 +2564,19 @@ const TimeSelect = (props) => {
|
|
|
2535
2564
|
showHours &&
|
|
2536
2565
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2537
2566
|
React__default["default"].createElement(FormLabel, null, "Hours"),
|
|
2538
|
-
React__default["default"].createElement(HourSelect, {
|
|
2567
|
+
React__default["default"].createElement(HourSelect, { value: currDate.getHours(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.HOUR) })),
|
|
2539
2568
|
showMinutes &&
|
|
2540
2569
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2541
2570
|
React__default["default"].createElement(FormLabel, null, "Minutes"),
|
|
2542
|
-
React__default["default"].createElement(MinuteSelect, {
|
|
2571
|
+
React__default["default"].createElement(MinuteSelect, { value: currDate.getMinutes(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MINUTE) })),
|
|
2543
2572
|
showSeconds &&
|
|
2544
2573
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2545
2574
|
React__default["default"].createElement(FormLabel, null, "Seconds"),
|
|
2546
|
-
React__default["default"].createElement(SecondSelect, {
|
|
2575
|
+
React__default["default"].createElement(SecondSelect, { value: currDate.getSeconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.SECONDS) })),
|
|
2547
2576
|
showMilliSeconds &&
|
|
2548
2577
|
React__default["default"].createElement(FormGroup, { className: "col" },
|
|
2549
2578
|
React__default["default"].createElement(FormLabel, null, "Milliseconds"),
|
|
2550
|
-
React__default["default"].createElement(MilliSecondSelect, {
|
|
2579
|
+
React__default["default"].createElement(MilliSecondSelect, { value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, exports.TIMEMODE.MILLISECONDS) }))));
|
|
2551
2580
|
};
|
|
2552
2581
|
|
|
2553
2582
|
var css_248z$1 = ".TreeView-module_treeView__VVj-4 {\n list-style-type: none;\n margin-bottom: 0;\n padding-left: 0px !important; }\n .TreeView-module_treeView__VVj-4 ul {\n padding-left: 48px !important; }\n";
|