react-asc 19.0.6 → 19.0.7
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/Modal/ModalFooter.d.ts +2 -6
- package/components/Modal/modal.interfaces.d.ts +1 -0
- package/index.es.js +245 -239
- package/index.js +245 -239
- package/package.json +1 -1
- package/react-asc.scss +2 -2
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$Z = ".Alert-module_alert__b4tbk {\n border-radius: var(--borderRadius);\n padding: 6px 16px; }\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$Z = {"alert":"Alert-module_alert__b4tbk","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$Z);
|
|
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$Z.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$Z.contained);
|
|
109
|
+
cssClasses.push(styles$Z[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$Z.outline);
|
|
113
|
+
cssClasses.push(styles$Z[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$Z['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$Y = ".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$Y = {"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$Y);
|
|
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$Y[color]);
|
|
131
|
+
cssClasses.push(styles$Y.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$Y['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$X = ".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$X = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
|
|
141
|
+
styleInject(css_248z$X);
|
|
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$X.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$W = ".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$W = {"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$W);
|
|
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$W.icon);
|
|
163
|
+
iconColor && cssClasses.push(styles$W[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$V = ".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";
|
|
171
|
+
var styles$V = {"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$V);
|
|
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$V[color]);
|
|
179
|
+
cssClasses.push(styles$V[variant]);
|
|
180
|
+
cssClasses.push(styles$V[size]);
|
|
181
|
+
cssClasses.push(styles$V.iconButton);
|
|
182
|
+
isActive && cssClasses.push(styles$V.active);
|
|
183
|
+
disabled && cssClasses.push(styles$V.disabled);
|
|
184
|
+
shadow && cssClasses.push(styles$V.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$U = ".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$U = {"backdrop":"Backdrop-module_backdrop__IRMoL"};
|
|
295
|
+
styleInject(css_248z$U);
|
|
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$U.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$T = ".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$T = {"list":"List-module_list__gpZ41"};
|
|
318
|
+
styleInject(css_248z$T);
|
|
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$T.flush);
|
|
325
|
+
cssClasses.push(styles$T.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$S = ".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$S = {"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$S);
|
|
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$S.listItem);
|
|
341
|
+
color && cssClasses.push(styles$S[color]);
|
|
342
|
+
active && cssClasses.push(styles$S['active']);
|
|
343
|
+
disabled && cssClasses.push(styles$S['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$R = ".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$R = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
|
|
355
|
+
styleInject(css_248z$R);
|
|
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$R.avatar }, rest), avatar));
|
|
358
360
|
};
|
|
359
361
|
|
|
360
|
-
var css_248z$
|
|
361
|
-
var styles$
|
|
362
|
-
styleInject(css_248z$
|
|
362
|
+
var css_248z$Q = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px; }\n .ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px; }\n";
|
|
363
|
+
var styles$Q = {"icon":"ListItemIcon-module_icon__cCvEv"};
|
|
364
|
+
styleInject(css_248z$Q);
|
|
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$Q.icon }, rest), icon));
|
|
367
369
|
};
|
|
368
370
|
|
|
369
|
-
var css_248z$
|
|
370
|
-
var styles$
|
|
371
|
-
styleInject(css_248z$
|
|
371
|
+
var css_248z$P = ".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$P = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
|
|
373
|
+
styleInject(css_248z$P);
|
|
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$P.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$O = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1; }\n";
|
|
381
|
+
var styles$O = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
382
|
+
styleInject(css_248z$O);
|
|
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$O.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$N = ".AutoComplete-module_selectContainer__1kA85 {\n position: relative; }\n\n.AutoComplete-module_select__NNYOi {\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\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$N = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
401
|
+
styleInject(css_248z$N);
|
|
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$N.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$N.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$N.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$M = ".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$M = {"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$M);
|
|
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$M.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$M.badge);
|
|
509
|
+
cssClasses.push(styles$M[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$L = ".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\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$L = {"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$L);
|
|
518
520
|
|
|
519
521
|
const Button = (props) => {
|
|
520
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$L.button);
|
|
524
526
|
if (variant !== 'outline' && variant !== 'text') {
|
|
525
|
-
cssClasses.push(styles$
|
|
526
|
-
cssClasses.push(styles$
|
|
527
|
+
cssClasses.push(styles$L.btnContained);
|
|
528
|
+
cssClasses.push(styles$L[color]);
|
|
527
529
|
}
|
|
528
530
|
if (variant === 'outline') {
|
|
529
|
-
cssClasses.push(styles$
|
|
530
|
-
cssClasses.push(styles$
|
|
531
|
+
cssClasses.push(styles$L.btnOutline);
|
|
532
|
+
cssClasses.push(styles$L[color]);
|
|
531
533
|
}
|
|
532
534
|
if (variant === 'text') {
|
|
533
|
-
cssClasses.push(styles$
|
|
534
|
-
cssClasses.push(styles$
|
|
535
|
+
cssClasses.push(styles$L.btnText);
|
|
536
|
+
cssClasses.push(styles$L[color]);
|
|
535
537
|
}
|
|
536
538
|
if (isRounded && variant !== 'text') {
|
|
537
539
|
cssClasses.push(`rounded-pill`);
|
|
@@ -539,43 +541,43 @@ const Button = (props) => {
|
|
|
539
541
|
if (isActive) {
|
|
540
542
|
cssClasses.push('active');
|
|
541
543
|
}
|
|
542
|
-
shadow && cssClasses.push(styles$
|
|
544
|
+
shadow && cssClasses.push(styles$L.shadow);
|
|
543
545
|
className && cssClasses.push(className);
|
|
544
546
|
return cssClasses.filter(css => css).join(' ');
|
|
545
547
|
};
|
|
546
548
|
return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
547
549
|
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
548
550
|
startIcon &&
|
|
549
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
551
|
+
React__default["default"].createElement(Icon, { className: styles$L.startIcon }, startIcon),
|
|
550
552
|
children,
|
|
551
553
|
endIcon &&
|
|
552
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
554
|
+
React__default["default"].createElement(Icon, { className: styles$L.endIcon }, endIcon))));
|
|
553
555
|
};
|
|
554
556
|
|
|
555
|
-
var css_248z$
|
|
556
|
-
var styles$
|
|
557
|
-
styleInject(css_248z$
|
|
557
|
+
var css_248z$K = ".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$K = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
559
|
+
styleInject(css_248z$K);
|
|
558
560
|
|
|
559
561
|
const ButtonGroup = (props) => {
|
|
560
562
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
561
563
|
const getCssClasses = () => {
|
|
562
564
|
const cssClasses = [];
|
|
563
|
-
cssClasses.push(styles$
|
|
565
|
+
cssClasses.push(styles$K.buttonGroup);
|
|
564
566
|
className && cssClasses.push(className);
|
|
565
567
|
return cssClasses.filter(css => css).join(' ');
|
|
566
568
|
};
|
|
567
569
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
568
570
|
};
|
|
569
571
|
|
|
570
|
-
var css_248z$
|
|
571
|
-
var styles$
|
|
572
|
-
styleInject(css_248z$
|
|
572
|
+
var css_248z$J = ".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$J = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
|
|
574
|
+
styleInject(css_248z$J);
|
|
573
575
|
|
|
574
576
|
const Breadcrumb = (props) => {
|
|
575
577
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
576
578
|
const getCssClasses = () => {
|
|
577
579
|
const cssClasses = [];
|
|
578
|
-
cssClasses.push(styles$
|
|
580
|
+
cssClasses.push(styles$J.breadcrumb);
|
|
579
581
|
className && cssClasses.push(className);
|
|
580
582
|
return cssClasses.filter(css => css).join(' ');
|
|
581
583
|
};
|
|
@@ -585,15 +587,15 @@ const Breadcrumb = (props) => {
|
|
|
585
587
|
|
|
586
588
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
587
589
|
|
|
588
|
-
var css_248z$
|
|
589
|
-
var styles$
|
|
590
|
-
styleInject(css_248z$
|
|
590
|
+
var css_248z$I = ".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$I = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
|
|
592
|
+
styleInject(css_248z$I);
|
|
591
593
|
|
|
592
594
|
const BreadcrumbItem = (props) => {
|
|
593
595
|
const { children, className, isActive, onClick } = props;
|
|
594
596
|
const getCssClasses = () => {
|
|
595
597
|
const cssClasses = [];
|
|
596
|
-
cssClasses.push(styles$
|
|
598
|
+
cssClasses.push(styles$I.breadcrumbItem);
|
|
597
599
|
className && cssClasses.push(className);
|
|
598
600
|
isActive && cssClasses.push('active');
|
|
599
601
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -605,115 +607,115 @@ const BreadcrumbItem = (props) => {
|
|
|
605
607
|
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
606
608
|
};
|
|
607
609
|
|
|
608
|
-
var css_248z$
|
|
609
|
-
var styles$
|
|
610
|
-
styleInject(css_248z$
|
|
610
|
+
var css_248z$H = ".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$H = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
|
|
612
|
+
styleInject(css_248z$H);
|
|
611
613
|
|
|
612
614
|
const Card = (props) => {
|
|
613
615
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
614
616
|
const getCssClasses = () => {
|
|
615
617
|
const cssClasses = [];
|
|
616
|
-
cssClasses.push(styles$
|
|
617
|
-
shadow && cssClasses.push(styles$
|
|
618
|
+
cssClasses.push(styles$H.card);
|
|
619
|
+
shadow && cssClasses.push(styles$H.shadow);
|
|
618
620
|
className && cssClasses.push(className);
|
|
619
621
|
return cssClasses.filter(css => css).join(' ');
|
|
620
622
|
};
|
|
621
623
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
622
624
|
};
|
|
623
625
|
|
|
624
|
-
var css_248z$
|
|
625
|
-
var styles$
|
|
626
|
-
styleInject(css_248z$
|
|
626
|
+
var css_248z$G = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
|
|
627
|
+
var styles$G = {"cardBody":"CardBody-module_cardBody__X52VY"};
|
|
628
|
+
styleInject(css_248z$G);
|
|
627
629
|
|
|
628
630
|
const CardBody = (props) => {
|
|
629
631
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
630
632
|
const getCssClasses = () => {
|
|
631
633
|
const cssClasses = [];
|
|
632
|
-
cssClasses.push(styles$
|
|
634
|
+
cssClasses.push(styles$G.cardBody);
|
|
633
635
|
className && cssClasses.push(className);
|
|
634
636
|
return cssClasses.filter(css => css).join(' ');
|
|
635
637
|
};
|
|
636
638
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
637
639
|
};
|
|
638
640
|
|
|
639
|
-
var css_248z$
|
|
640
|
-
var styles$
|
|
641
|
-
styleInject(css_248z$
|
|
641
|
+
var css_248z$F = ".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$F = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
|
|
643
|
+
styleInject(css_248z$F);
|
|
642
644
|
|
|
643
645
|
const CardFooter = (props) => {
|
|
644
646
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
645
647
|
const getCssClasses = () => {
|
|
646
648
|
const cssClasses = [];
|
|
647
|
-
cssClasses.push(styles$
|
|
649
|
+
cssClasses.push(styles$F.cardFooter);
|
|
648
650
|
className && cssClasses.push(className);
|
|
649
651
|
return cssClasses.filter(css => css).join(' ');
|
|
650
652
|
};
|
|
651
653
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
652
654
|
};
|
|
653
655
|
|
|
654
|
-
var css_248z$
|
|
655
|
-
var styles$
|
|
656
|
-
styleInject(css_248z$
|
|
656
|
+
var css_248z$E = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important; }\n";
|
|
657
|
+
var styles$E = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
|
|
658
|
+
styleInject(css_248z$E);
|
|
657
659
|
|
|
658
660
|
const CardSubtitle = (props) => {
|
|
659
661
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
660
662
|
const getCssClasses = () => {
|
|
661
663
|
const cssClasses = [];
|
|
662
|
-
cssClasses.push(styles$
|
|
664
|
+
cssClasses.push(styles$E.cardSubtitle);
|
|
663
665
|
className && cssClasses.push(className);
|
|
664
666
|
return cssClasses.filter(css => css).join(' ');
|
|
665
667
|
};
|
|
666
668
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
667
669
|
};
|
|
668
670
|
|
|
669
|
-
var css_248z$
|
|
670
|
-
var styles$
|
|
671
|
-
styleInject(css_248z$
|
|
671
|
+
var css_248z$D = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0; }\n";
|
|
672
|
+
var styles$D = {"cardText":"CardText-module_cardText__UtYd9"};
|
|
673
|
+
styleInject(css_248z$D);
|
|
672
674
|
|
|
673
675
|
const CardText = (props) => {
|
|
674
676
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
675
677
|
const getCssClasses = () => {
|
|
676
678
|
const cssClasses = [];
|
|
677
|
-
cssClasses.push(styles$
|
|
679
|
+
cssClasses.push(styles$D.cardText);
|
|
678
680
|
className && cssClasses.push(className);
|
|
679
681
|
return cssClasses.filter(css => css).join(' ');
|
|
680
682
|
};
|
|
681
683
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
682
684
|
};
|
|
683
685
|
|
|
684
|
-
var css_248z$
|
|
685
|
-
var styles$
|
|
686
|
-
styleInject(css_248z$
|
|
686
|
+
var css_248z$C = ".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$C = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
|
|
688
|
+
styleInject(css_248z$C);
|
|
687
689
|
|
|
688
690
|
const CardTitle = (props) => {
|
|
689
691
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
690
692
|
const getCssClasses = () => {
|
|
691
693
|
const cssClasses = [];
|
|
692
|
-
cssClasses.push(styles$
|
|
694
|
+
cssClasses.push(styles$C.cardTitle);
|
|
693
695
|
className && cssClasses.push(className);
|
|
694
696
|
return cssClasses.filter(css => css).join(' ');
|
|
695
697
|
};
|
|
696
698
|
return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
697
699
|
};
|
|
698
700
|
|
|
699
|
-
var css_248z$
|
|
700
|
-
var styles$
|
|
701
|
-
styleInject(css_248z$
|
|
701
|
+
var css_248z$B = ".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$B = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
|
|
703
|
+
styleInject(css_248z$B);
|
|
702
704
|
|
|
703
705
|
const CardImage = (props) => {
|
|
704
706
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
705
707
|
const getCssClasses = () => {
|
|
706
708
|
const cssClasses = [];
|
|
707
|
-
cssClasses.push(styles$
|
|
709
|
+
cssClasses.push(styles$B.cardImage);
|
|
708
710
|
className && cssClasses.push(className);
|
|
709
711
|
return cssClasses.filter(css => css).join(' ');
|
|
710
712
|
};
|
|
711
713
|
return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
712
714
|
};
|
|
713
715
|
|
|
714
|
-
var css_248z$
|
|
715
|
-
var styles$
|
|
716
|
-
styleInject(css_248z$
|
|
716
|
+
var css_248z$A = ".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 .Checkbox-module_checkboxContainer__x2GCi label {\n margin-bottom: 0;\n margin-left: 0; }\n .Checkbox-module_checkboxContainer__x2GCi label: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";
|
|
717
|
+
var styles$A = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
|
|
718
|
+
styleInject(css_248z$A);
|
|
717
719
|
|
|
718
720
|
const Checkbox = (props) => {
|
|
719
721
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -750,24 +752,24 @@ const Checkbox = (props) => {
|
|
|
750
752
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
751
753
|
}
|
|
752
754
|
};
|
|
753
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
755
|
+
return (React__default["default"].createElement("div", { className: styles$A.checkboxContainer },
|
|
754
756
|
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
755
|
-
React__default["default"].createElement("label", { onClick: handleClick, className: styles$
|
|
757
|
+
React__default["default"].createElement("label", { onClick: handleClick, className: styles$A.checkboxLabel + ' ' + (disabled ? styles$A['disabled'] : undefined) }, label),
|
|
756
758
|
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))));
|
|
757
759
|
};
|
|
758
760
|
|
|
759
|
-
var css_248z$
|
|
760
|
-
var styles$
|
|
761
|
-
styleInject(css_248z$
|
|
761
|
+
var css_248z$z = ".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";
|
|
762
|
+
var styles$z = {"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"};
|
|
763
|
+
styleInject(css_248z$z);
|
|
762
764
|
|
|
763
765
|
const Chip = (props) => {
|
|
764
766
|
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"]);
|
|
765
767
|
const getCssClass = () => {
|
|
766
768
|
const cssClasses = [];
|
|
767
|
-
cssClasses.push(styles$
|
|
768
|
-
cssClasses.push(styles$
|
|
769
|
-
shadow && cssClasses.push(styles$
|
|
770
|
-
onClick && cssClasses.push(styles$
|
|
769
|
+
cssClasses.push(styles$z.chip);
|
|
770
|
+
cssClasses.push(styles$z[color]);
|
|
771
|
+
shadow && cssClasses.push(styles$z['shadow']);
|
|
772
|
+
onClick && cssClasses.push(styles$z['clickable']);
|
|
771
773
|
className && cssClasses.push(className);
|
|
772
774
|
return cssClasses.filter(r => r).join(' ');
|
|
773
775
|
};
|
|
@@ -777,18 +779,18 @@ const Chip = (props) => {
|
|
|
777
779
|
};
|
|
778
780
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
779
781
|
React__default["default"].createElement("div", null, children),
|
|
780
|
-
isDeletable && (React__default["default"].createElement("div", { className: styles$
|
|
782
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$z.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
781
783
|
};
|
|
782
784
|
|
|
783
|
-
var css_248z$
|
|
784
|
-
var styles$
|
|
785
|
-
styleInject(css_248z$
|
|
785
|
+
var css_248z$y = ".FormLabel-module_formLabel__TXcHc {\n margin-bottom: .5rem; }\n";
|
|
786
|
+
var styles$y = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
787
|
+
styleInject(css_248z$y);
|
|
786
788
|
|
|
787
789
|
const FormLabel = (_a) => {
|
|
788
790
|
var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
|
|
789
791
|
const getCssClasses = () => {
|
|
790
792
|
const cssClasses = [];
|
|
791
|
-
cssClasses.push(styles$
|
|
793
|
+
cssClasses.push(styles$y.formLabel);
|
|
792
794
|
className && cssClasses.push(className);
|
|
793
795
|
return cssClasses.filter(css => css).join(' ');
|
|
794
796
|
};
|
|
@@ -825,9 +827,9 @@ const FileInput = (props) => {
|
|
|
825
827
|
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))));
|
|
826
828
|
};
|
|
827
829
|
|
|
828
|
-
var css_248z$
|
|
829
|
-
var styles$
|
|
830
|
-
styleInject(css_248z$
|
|
830
|
+
var css_248z$x = ".Select-module_selectContainer__DHFDZ {\n position: relative; }\n\n.Select-module_select__Fbn38 {\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\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";
|
|
831
|
+
var styles$x = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","selectMenu":"Select-module_selectMenu__8y4kQ"};
|
|
832
|
+
styleInject(css_248z$x);
|
|
831
833
|
|
|
832
834
|
const Select = (props) => {
|
|
833
835
|
var _a, _b, _c;
|
|
@@ -840,7 +842,7 @@ const Select = (props) => {
|
|
|
840
842
|
const getCssClass = () => {
|
|
841
843
|
const cssClasses = [];
|
|
842
844
|
className && cssClasses.push(className);
|
|
843
|
-
cssClasses.push(styles$
|
|
845
|
+
cssClasses.push(styles$x.select);
|
|
844
846
|
return cssClasses.filter(r => r).join(' ');
|
|
845
847
|
};
|
|
846
848
|
React.useEffect(() => {
|
|
@@ -958,7 +960,7 @@ const Select = (props) => {
|
|
|
958
960
|
}
|
|
959
961
|
}
|
|
960
962
|
};
|
|
961
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
963
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$x.selectContainer },
|
|
962
964
|
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
963
965
|
!multiple && renderSingleViewModel(),
|
|
964
966
|
multiple && renderMultipleViewModel(),
|
|
@@ -966,7 +968,7 @@ const Select = (props) => {
|
|
|
966
968
|
React__default["default"].createElement(ChevronDownSolidIcon, null))),
|
|
967
969
|
isShow &&
|
|
968
970
|
reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
969
|
-
React__default["default"].createElement("div", { className: styles$
|
|
971
|
+
React__default["default"].createElement("div", { className: styles$x.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 } },
|
|
970
972
|
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) },
|
|
971
973
|
multiple &&
|
|
972
974
|
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -974,30 +976,30 @@ const Select = (props) => {
|
|
|
974
976
|
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
|
|
975
977
|
};
|
|
976
978
|
|
|
977
|
-
var css_248z$
|
|
978
|
-
var styles$
|
|
979
|
-
styleInject(css_248z$
|
|
979
|
+
var css_248z$w = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical; }\n textarea:focus {\n outline: none !important;\n border-color: var(--primary); }\n";
|
|
980
|
+
var styles$w = {};
|
|
981
|
+
styleInject(css_248z$w);
|
|
980
982
|
|
|
981
983
|
const Textarea = (props) => {
|
|
982
984
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
983
985
|
const getCssClass = () => {
|
|
984
986
|
const cssClasses = [];
|
|
985
|
-
cssClasses.push(styles$
|
|
987
|
+
cssClasses.push(styles$w.textarea);
|
|
986
988
|
className && cssClasses.push(className);
|
|
987
989
|
return cssClasses.filter(r => r).join(' ');
|
|
988
990
|
};
|
|
989
991
|
return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
990
992
|
};
|
|
991
993
|
|
|
992
|
-
var css_248z$
|
|
993
|
-
var styles$
|
|
994
|
-
styleInject(css_248z$
|
|
994
|
+
var css_248z$v = ".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";
|
|
995
|
+
var styles$v = {"formInput":"FormInput-module_formInput__VXZip"};
|
|
996
|
+
styleInject(css_248z$v);
|
|
995
997
|
|
|
996
998
|
const FormInput = (props) => {
|
|
997
999
|
const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
998
1000
|
const getCssClasses = () => {
|
|
999
1001
|
const cssClasses = [];
|
|
1000
|
-
cssClasses.push(styles$
|
|
1002
|
+
cssClasses.push(styles$v.formInput);
|
|
1001
1003
|
className && cssClasses.push(className);
|
|
1002
1004
|
!isValid && cssClasses.push('is-invalid');
|
|
1003
1005
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -1367,16 +1369,16 @@ const DateSelect = (props) => {
|
|
|
1367
1369
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1368
1370
|
// };
|
|
1369
1371
|
|
|
1370
|
-
var css_248z$
|
|
1371
|
-
var styles$
|
|
1372
|
-
styleInject(css_248z$
|
|
1372
|
+
var css_248z$u = ".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";
|
|
1373
|
+
var styles$u = {"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"};
|
|
1374
|
+
styleInject(css_248z$u);
|
|
1373
1375
|
|
|
1374
1376
|
const Drawer = (props) => {
|
|
1375
1377
|
const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop } = props, rest = __rest(props, ["children", "className", "position", "permanent", "target", "shadow", "onClickBackdrop"]);
|
|
1376
1378
|
React.useEffect(() => {
|
|
1377
|
-
document.body.classList.add(styles$
|
|
1379
|
+
document.body.classList.add(styles$u.drawerOpen);
|
|
1378
1380
|
return () => {
|
|
1379
|
-
document.body.classList.remove(styles$
|
|
1381
|
+
document.body.classList.remove(styles$u.drawerOpen);
|
|
1380
1382
|
};
|
|
1381
1383
|
}, []);
|
|
1382
1384
|
const handleClickBackdrop = () => {
|
|
@@ -1390,10 +1392,10 @@ const DrawerContent = (props) => {
|
|
|
1390
1392
|
const { children, className, position = 'left', permanent = false, shadow } = props, rest = __rest(props, ["children", "className", "position", "permanent", "shadow"]);
|
|
1391
1393
|
const getCssClasses = () => {
|
|
1392
1394
|
const cssClasses = [];
|
|
1393
|
-
cssClasses.push(styles$
|
|
1394
|
-
shadow && cssClasses.push(styles$
|
|
1395
|
-
!!permanent && cssClasses.push(styles$
|
|
1396
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1395
|
+
cssClasses.push(styles$u.drawer);
|
|
1396
|
+
shadow && cssClasses.push(styles$u.shadow);
|
|
1397
|
+
!!permanent && cssClasses.push(styles$u['permanent']);
|
|
1398
|
+
position === 'left' ? cssClasses.push(styles$u['left']) : cssClasses.push(styles$u['right']);
|
|
1397
1399
|
className && cssClasses.push(className);
|
|
1398
1400
|
return cssClasses.filter(css => css).join(' ');
|
|
1399
1401
|
};
|
|
@@ -1407,9 +1409,9 @@ const DrawerContent = (props) => {
|
|
|
1407
1409
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), style: getStyles() }, rest), children));
|
|
1408
1410
|
};
|
|
1409
1411
|
|
|
1410
|
-
var css_248z$
|
|
1411
|
-
var styles$
|
|
1412
|
-
styleInject(css_248z$
|
|
1412
|
+
var css_248z$t = ".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";
|
|
1413
|
+
var styles$t = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
|
|
1414
|
+
styleInject(css_248z$t);
|
|
1413
1415
|
|
|
1414
1416
|
const MenuBody = (props) => {
|
|
1415
1417
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1440,8 +1442,8 @@ const MenuBody = (props) => {
|
|
|
1440
1442
|
}, [menuBodyRef]);
|
|
1441
1443
|
const getCssClasses = () => {
|
|
1442
1444
|
const cssClasses = [];
|
|
1443
|
-
cssClasses.push(styles$
|
|
1444
|
-
shadow && cssClasses.push(styles$
|
|
1445
|
+
cssClasses.push(styles$t.menuBody);
|
|
1446
|
+
shadow && cssClasses.push(styles$t.shadow);
|
|
1445
1447
|
className && cssClasses.push(className);
|
|
1446
1448
|
return cssClasses.filter(css => css).join(' ');
|
|
1447
1449
|
};
|
|
@@ -1453,9 +1455,9 @@ const MenuBody = (props) => {
|
|
|
1453
1455
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1454
1456
|
};
|
|
1455
1457
|
|
|
1456
|
-
var css_248z$
|
|
1457
|
-
var styles$
|
|
1458
|
-
styleInject(css_248z$
|
|
1458
|
+
var css_248z$s = ".Menu-module_menu__p8QL- {\n display: flex; }\n";
|
|
1459
|
+
var styles$s = {"menu":"Menu-module_menu__p8QL-"};
|
|
1460
|
+
styleInject(css_248z$s);
|
|
1459
1461
|
|
|
1460
1462
|
const Menu = (props) => {
|
|
1461
1463
|
const { toggle, children, className, open, menuPosition, onClickBackdrop } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop"]);
|
|
@@ -1463,7 +1465,7 @@ const Menu = (props) => {
|
|
|
1463
1465
|
const toggleContainerRef = React.useRef(null);
|
|
1464
1466
|
const getCssClasses = () => {
|
|
1465
1467
|
const cssClasses = [];
|
|
1466
|
-
cssClasses.push(styles$
|
|
1468
|
+
cssClasses.push(styles$s.menu);
|
|
1467
1469
|
className && cssClasses.push(className);
|
|
1468
1470
|
return cssClasses.filter(css => css).join(' ');
|
|
1469
1471
|
};
|
|
@@ -1476,17 +1478,17 @@ const Menu = (props) => {
|
|
|
1476
1478
|
React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1477
1479
|
};
|
|
1478
1480
|
|
|
1479
|
-
var css_248z$
|
|
1480
|
-
var styles$
|
|
1481
|
-
styleInject(css_248z$
|
|
1481
|
+
var css_248z$r = ".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";
|
|
1482
|
+
var styles$r = {"menuItem":"MenuItem-module_menuItem__MeBxN","menuItemHeader":"MenuItem-module_menuItemHeader__2l732"};
|
|
1483
|
+
styleInject(css_248z$r);
|
|
1482
1484
|
|
|
1483
1485
|
const MenuItem = (props) => {
|
|
1484
1486
|
const { children, onClick, type = 'item' } = props;
|
|
1485
1487
|
const getCssClasses = () => {
|
|
1486
1488
|
const cssClasses = [];
|
|
1487
|
-
cssClasses.push(styles$
|
|
1489
|
+
cssClasses.push(styles$r.menuItem);
|
|
1488
1490
|
if (type === 'header') {
|
|
1489
|
-
cssClasses.push(styles$
|
|
1491
|
+
cssClasses.push(styles$r.menuItemHeader);
|
|
1490
1492
|
}
|
|
1491
1493
|
return cssClasses.filter(css => css).join(' ');
|
|
1492
1494
|
};
|
|
@@ -1502,23 +1504,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1502
1504
|
return (React__default["default"].createElement(React.Fragment, null, children));
|
|
1503
1505
|
};
|
|
1504
1506
|
|
|
1505
|
-
var css_248z$
|
|
1506
|
-
var styles$
|
|
1507
|
-
styleInject(css_248z$
|
|
1507
|
+
var css_248z$q = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef; }\n";
|
|
1508
|
+
var styles$q = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
|
|
1509
|
+
styleInject(css_248z$q);
|
|
1508
1510
|
|
|
1509
|
-
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$
|
|
1511
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$q.menuItemDivider });
|
|
1510
1512
|
|
|
1511
|
-
var css_248z$
|
|
1512
|
-
var styles$
|
|
1513
|
-
styleInject(css_248z$
|
|
1513
|
+
var css_248z$p = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px; }\n";
|
|
1514
|
+
var styles$p = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
|
|
1515
|
+
styleInject(css_248z$p);
|
|
1514
1516
|
|
|
1515
1517
|
const ExpansionPanelContent = ({ children }) => {
|
|
1516
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1518
|
+
return (React__default["default"].createElement("div", { className: styles$p.expansionPanelContent }, children));
|
|
1517
1519
|
};
|
|
1518
1520
|
|
|
1519
|
-
var css_248z$
|
|
1520
|
-
var styles$
|
|
1521
|
-
styleInject(css_248z$
|
|
1521
|
+
var css_248z$o = ".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";
|
|
1522
|
+
var styles$o = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
|
|
1523
|
+
styleInject(css_248z$o);
|
|
1522
1524
|
|
|
1523
1525
|
const ExpansionPanelHeader = (props) => {
|
|
1524
1526
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1526,15 +1528,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1526
1528
|
e.stopPropagation();
|
|
1527
1529
|
onClick && onClick(e);
|
|
1528
1530
|
};
|
|
1529
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1531
|
+
return (React__default["default"].createElement("div", { className: styles$o.expansionPanelHeader, onClick: handleClick },
|
|
1530
1532
|
children,
|
|
1531
1533
|
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1532
1534
|
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1533
1535
|
};
|
|
1534
1536
|
|
|
1535
|
-
var css_248z$
|
|
1536
|
-
var styles$
|
|
1537
|
-
styleInject(css_248z$
|
|
1537
|
+
var css_248z$n = ".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";
|
|
1538
|
+
var styles$n = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
|
|
1539
|
+
styleInject(css_248z$n);
|
|
1538
1540
|
|
|
1539
1541
|
const ExpansionPanel = (props) => {
|
|
1540
1542
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1544,9 +1546,9 @@ const ExpansionPanel = (props) => {
|
|
|
1544
1546
|
}, [isExpanded]);
|
|
1545
1547
|
const getCssClasses = () => {
|
|
1546
1548
|
const cssClasses = [];
|
|
1547
|
-
cssClasses.push(styles$
|
|
1549
|
+
cssClasses.push(styles$n.expansionPanel);
|
|
1548
1550
|
if (_isExpanded) {
|
|
1549
|
-
cssClasses.push(styles$
|
|
1551
|
+
cssClasses.push(styles$n.isExpanded);
|
|
1550
1552
|
}
|
|
1551
1553
|
return cssClasses.filter(css => css).join(' ');
|
|
1552
1554
|
};
|
|
@@ -1560,16 +1562,16 @@ const ExpansionPanel = (props) => {
|
|
|
1560
1562
|
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1561
1563
|
};
|
|
1562
1564
|
|
|
1563
|
-
var css_248z$
|
|
1564
|
-
var styles$
|
|
1565
|
-
styleInject(css_248z$
|
|
1565
|
+
var css_248z$m = ".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";
|
|
1566
|
+
var styles$m = {"fab":"FloatingActionButton-module_fab__Rw3kd","fixed":"FloatingActionButton-module_fixed__XQOkG"};
|
|
1567
|
+
styleInject(css_248z$m);
|
|
1566
1568
|
|
|
1567
1569
|
const FloatingActionButton = (props) => {
|
|
1568
1570
|
const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1569
1571
|
const getCssClasses = () => {
|
|
1570
1572
|
const cssClasses = [];
|
|
1571
|
-
cssClasses.push(styles$
|
|
1572
|
-
fixed && cssClasses.push(styles$
|
|
1573
|
+
cssClasses.push(styles$m.fab);
|
|
1574
|
+
fixed && cssClasses.push(styles$m['fixed']);
|
|
1573
1575
|
className && cssClasses.push(className);
|
|
1574
1576
|
return cssClasses.filter(css => css).join(' ');
|
|
1575
1577
|
};
|
|
@@ -1612,16 +1614,16 @@ const Row = (props) => {
|
|
|
1612
1614
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1613
1615
|
};
|
|
1614
1616
|
|
|
1615
|
-
var css_248z$
|
|
1616
|
-
var styles$
|
|
1617
|
-
styleInject(css_248z$
|
|
1617
|
+
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";
|
|
1618
|
+
var styles$l = {"link":"Link-module_link__YlJQl"};
|
|
1619
|
+
styleInject(css_248z$l);
|
|
1618
1620
|
|
|
1619
1621
|
const Link = (props) => {
|
|
1620
1622
|
const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
|
|
1621
1623
|
const [status, setStatus] = React.useState(STATUS.NORMAL);
|
|
1622
1624
|
const getCssClasses = () => {
|
|
1623
1625
|
const cssClasses = [];
|
|
1624
|
-
cssClasses.push(styles$
|
|
1626
|
+
cssClasses.push(styles$l.link);
|
|
1625
1627
|
className && cssClasses.push(className);
|
|
1626
1628
|
status !== STATUS.NORMAL && cssClasses.push(status);
|
|
1627
1629
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -1635,15 +1637,15 @@ const Link = (props) => {
|
|
|
1635
1637
|
return (React__default["default"].createElement("a", Object.assign({ className: getCssClasses(), href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
|
|
1636
1638
|
};
|
|
1637
1639
|
|
|
1638
|
-
var css_248z$
|
|
1639
|
-
var styles$
|
|
1640
|
-
styleInject(css_248z$
|
|
1640
|
+
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";
|
|
1641
|
+
var styles$k = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
|
|
1642
|
+
styleInject(css_248z$k);
|
|
1641
1643
|
|
|
1642
1644
|
const LoadingIndicator = (_a) => {
|
|
1643
1645
|
var rest = __rest(_a, []);
|
|
1644
1646
|
const getCssClasses = () => {
|
|
1645
1647
|
const cssClasses = [];
|
|
1646
|
-
cssClasses.push(styles$
|
|
1648
|
+
cssClasses.push(styles$k.loadingIndicator);
|
|
1647
1649
|
return cssClasses.filter(css => css).join(' ');
|
|
1648
1650
|
};
|
|
1649
1651
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -1653,7 +1655,7 @@ const LoadingIndicator = (_a) => {
|
|
|
1653
1655
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1654
1656
|
const getCssClasses = () => {
|
|
1655
1657
|
const cssClasses = [];
|
|
1656
|
-
cssClasses.push(styles$
|
|
1658
|
+
cssClasses.push(styles$k.loadingIndicatorContainer);
|
|
1657
1659
|
return cssClasses.filter(css => css).join(' ');
|
|
1658
1660
|
};
|
|
1659
1661
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1681,41 +1683,45 @@ class LoadingIndicatorService {
|
|
|
1681
1683
|
}
|
|
1682
1684
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1683
1685
|
|
|
1684
|
-
var css_248z$
|
|
1685
|
-
var styles$
|
|
1686
|
-
styleInject(css_248z$
|
|
1686
|
+
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";
|
|
1687
|
+
var styles$j = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-","modalTitle":"ModalHeader-module_modalTitle__2xShH"};
|
|
1688
|
+
styleInject(css_248z$j);
|
|
1687
1689
|
|
|
1688
1690
|
const ModalHeader = (props) => {
|
|
1689
1691
|
const { children, isDismissable = false, onClose } = props, rest = __rest(props, ["children", "isDismissable", "onClose"]);
|
|
1690
1692
|
const handleClick = () => {
|
|
1691
1693
|
onClose && onClose();
|
|
1692
1694
|
};
|
|
1693
|
-
return (React__default["default"].createElement("div", Object.assign({ className:
|
|
1694
|
-
React__default["default"].createElement("h5", { className:
|
|
1695
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$j.modalHeader }, rest),
|
|
1696
|
+
React__default["default"].createElement("h5", { className: styles$j.modalTitle }, children),
|
|
1695
1697
|
isDismissable &&
|
|
1696
1698
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
1697
1699
|
};
|
|
1698
1700
|
|
|
1699
|
-
|
|
1701
|
+
var css_248z$i = ".ModalBody-module_modalBody__D-gk2 {\n position: relative;\n flex: 1 1 auto;\n padding: 1rem; }\n";
|
|
1702
|
+
var styles$i = {"modalBody":"ModalBody-module_modalBody__D-gk2"};
|
|
1703
|
+
styleInject(css_248z$i);
|
|
1700
1704
|
|
|
1701
|
-
|
|
1702
|
-
|
|
1705
|
+
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: styles$i.modalBody }, children));
|
|
1706
|
+
|
|
1707
|
+
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";
|
|
1708
|
+
var styles$h = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1703
1709
|
styleInject(css_248z$h);
|
|
1704
1710
|
|
|
1705
|
-
|
|
1706
|
-
var styles$g = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1707
|
-
styleInject(css_248z$g);
|
|
1711
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: styles$h.modalFooter }, children));
|
|
1708
1712
|
|
|
1709
|
-
|
|
1713
|
+
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";
|
|
1714
|
+
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"};
|
|
1715
|
+
styleInject(css_248z$g);
|
|
1710
1716
|
|
|
1711
1717
|
const Modal = (props) => {
|
|
1712
1718
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1713
1719
|
const getCssClass = () => {
|
|
1714
1720
|
const cssClasses = [];
|
|
1715
|
-
cssClasses.push(
|
|
1716
|
-
cssClasses.push(styles$
|
|
1717
|
-
|
|
1718
|
-
size && cssClasses.push(styles$
|
|
1721
|
+
cssClasses.push(styles$g.modalDialog);
|
|
1722
|
+
cssClasses.push(styles$g.modalDialogCentered);
|
|
1723
|
+
fullScreen && cssClasses.push(styles$g.fullscreen);
|
|
1724
|
+
size && cssClasses.push(styles$g[size]);
|
|
1719
1725
|
className && cssClasses.push(className);
|
|
1720
1726
|
return cssClasses.filter(r => r).join(' ');
|
|
1721
1727
|
};
|
|
@@ -1728,10 +1734,10 @@ const Modal = (props) => {
|
|
|
1728
1734
|
const handleClickBackdrop = () => {
|
|
1729
1735
|
onBackdropClick && onBackdropClick();
|
|
1730
1736
|
};
|
|
1731
|
-
return (React__default["default"].createElement(
|
|
1732
|
-
React__default["default"].createElement("div", { className:
|
|
1737
|
+
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1738
|
+
React__default["default"].createElement("div", { className: styles$g.modal },
|
|
1733
1739
|
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1734
|
-
React__default["default"].createElement("div", { className:
|
|
1740
|
+
React__default["default"].createElement("div", { className: styles$g.modalContent },
|
|
1735
1741
|
header &&
|
|
1736
1742
|
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1737
1743
|
React__default["default"].createElement(ModalBody, null, children),
|
|
@@ -1755,8 +1761,8 @@ exports.MODALBUTTONTYPE = void 0;
|
|
|
1755
1761
|
})(exports.MODALBUTTONTYPE || (exports.MODALBUTTONTYPE = {}));
|
|
1756
1762
|
|
|
1757
1763
|
const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismissable = false, buttons = [
|
|
1758
|
-
{ label: 'Cancel', type: exports.MODALBUTTONTYPE.CANCEL, color: exports.COLOR.secondary, variant: exports.VARIANT.text,
|
|
1759
|
-
{ label: 'Ok', type: exports.MODALBUTTONTYPE.OK, variant: exports.VARIANT.contained },
|
|
1764
|
+
{ label: 'Cancel', type: exports.MODALBUTTONTYPE.CANCEL, color: exports.COLOR.secondary, variant: exports.VARIANT.text, shadow: false },
|
|
1765
|
+
{ label: 'Ok', type: exports.MODALBUTTONTYPE.OK, variant: exports.VARIANT.contained, focus: true },
|
|
1760
1766
|
], size = exports.SIZE.md, fullScreen = false }) => {
|
|
1761
1767
|
// workaround for getDerivedStateFromProps
|
|
1762
1768
|
const [myControls, setMyControls] = React.useState(null);
|
|
@@ -1795,7 +1801,7 @@ const GlobalModal = ({ title, description, formControls, onOk, onCancel, isDismi
|
|
|
1795
1801
|
}
|
|
1796
1802
|
button.handler && button.handler();
|
|
1797
1803
|
};
|
|
1798
|
-
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)))) },
|
|
1804
|
+
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)))) },
|
|
1799
1805
|
description && React__default["default"].createElement("div", null, description),
|
|
1800
1806
|
modalType === exports.MODALTYPE.FORM &&
|
|
1801
1807
|
React__default["default"].createElement(React.Fragment, null,
|