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