react-asc 19.0.7 → 21.0.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/Grid/Row/Row.d.ts +4 -1
- package/components/Select/Select.d.ts +1 -0
- package/components/Textarea/Textarea.d.ts +4 -1
- package/index.es.js +249 -221
- package/index.js +249 -221
- package/package.json +3 -4
- package/react-asc.scss +95 -3
- package/readme.md +3 -5
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:not(.IconButton-module_iconButton__rpCPQ.IconButton-module_disabled__QB0ZV) {\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,9 +282,9 @@ function useDebounce(callback, timeout, deps) {
|
|
|
282
282
|
}, deps);
|
|
283
283
|
}
|
|
284
284
|
|
|
285
|
-
var css_248z$
|
|
286
|
-
var styles$
|
|
287
|
-
styleInject(css_248z$
|
|
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 .Backdrop-module_backdrop__IRMoL.Backdrop-module_isTransparent__F5nA5 {\n opacity: 0; }\n";
|
|
286
|
+
var styles$X = {"backdrop":"Backdrop-module_backdrop__IRMoL","isTransparent":"Backdrop-module_isTransparent__F5nA5"};
|
|
287
|
+
styleInject(css_248z$X);
|
|
288
288
|
|
|
289
289
|
const Backdrop = (props) => {
|
|
290
290
|
const { target = document.body, isTransparent = false, onClick, style } = props, rest = __rest(props, ["target", "isTransparent", "onClick", "style"]);
|
|
@@ -294,8 +294,8 @@ const Backdrop = (props) => {
|
|
|
294
294
|
};
|
|
295
295
|
const getCssClasses = () => {
|
|
296
296
|
const cssClasses = [];
|
|
297
|
-
cssClasses.push(styles$
|
|
298
|
-
isTransparent && cssClasses.push(
|
|
297
|
+
cssClasses.push(styles$X.backdrop);
|
|
298
|
+
isTransparent && cssClasses.push(styles$X['isTransparent']);
|
|
299
299
|
return cssClasses.filter(css => css).join(' ');
|
|
300
300
|
};
|
|
301
301
|
const getStyles = () => {
|
|
@@ -305,34 +305,34 @@ const Backdrop = (props) => {
|
|
|
305
305
|
return (createPortal(React.createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
306
306
|
};
|
|
307
307
|
|
|
308
|
-
var css_248z$
|
|
309
|
-
var styles$
|
|
310
|
-
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);
|
|
311
311
|
|
|
312
312
|
const List = (props) => {
|
|
313
313
|
const { children, className, isFlush } = props, rest = __rest(props, ["children", "className", "isFlush"]);
|
|
314
314
|
const getCssClasses = () => {
|
|
315
315
|
const cssClasses = [];
|
|
316
|
-
isFlush && cssClasses.push(styles$
|
|
317
|
-
cssClasses.push(styles$
|
|
316
|
+
isFlush && cssClasses.push(styles$W.flush);
|
|
317
|
+
cssClasses.push(styles$W.list);
|
|
318
318
|
className && cssClasses.push(className);
|
|
319
319
|
return cssClasses.filter(css => css).join(' ');
|
|
320
320
|
};
|
|
321
321
|
return (React.createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
|
|
322
322
|
};
|
|
323
323
|
|
|
324
|
-
var css_248z$
|
|
325
|
-
var styles$
|
|
326
|
-
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);
|
|
327
327
|
|
|
328
328
|
const ListItem = (props) => {
|
|
329
329
|
const { children, color, active, className, disabled, onClick } = props, rest = __rest(props, ["children", "color", "active", "className", "disabled", "onClick"]);
|
|
330
330
|
const getCssClasses = () => {
|
|
331
331
|
const cssClasses = [];
|
|
332
|
-
cssClasses.push(styles$
|
|
333
|
-
color && cssClasses.push(styles$
|
|
334
|
-
active && cssClasses.push(styles$
|
|
335
|
-
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']);
|
|
336
336
|
className && cssClasses.push(className);
|
|
337
337
|
return cssClasses.filter(css => css).join(' ');
|
|
338
338
|
};
|
|
@@ -342,42 +342,42 @@ const ListItem = (props) => {
|
|
|
342
342
|
return (React.createElement("li", Object.assign({ onClick: handleClick, className: getCssClasses() }, rest), children));
|
|
343
343
|
};
|
|
344
344
|
|
|
345
|
-
var css_248z$
|
|
346
|
-
var styles$
|
|
347
|
-
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);
|
|
348
348
|
|
|
349
349
|
const ListItemAvatar = (_a) => {
|
|
350
350
|
var { avatar } = _a, rest = __rest(_a, ["avatar"]);
|
|
351
|
-
return (React.createElement("div", Object.assign({ className: styles$
|
|
351
|
+
return (React.createElement("div", Object.assign({ className: styles$U.avatar }, rest), avatar));
|
|
352
352
|
};
|
|
353
353
|
|
|
354
|
-
var css_248z$
|
|
355
|
-
var styles$
|
|
356
|
-
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);
|
|
357
357
|
|
|
358
358
|
const ListItemIcon = (_a) => {
|
|
359
359
|
var { icon } = _a, rest = __rest(_a, ["icon"]);
|
|
360
|
-
return (React.createElement("div", Object.assign({ className: styles$
|
|
360
|
+
return (React.createElement("div", Object.assign({ className: styles$T.icon }, rest), icon));
|
|
361
361
|
};
|
|
362
362
|
|
|
363
|
-
var css_248z$
|
|
364
|
-
var styles$
|
|
365
|
-
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);
|
|
366
366
|
|
|
367
367
|
const ListItemAction = (_a) => {
|
|
368
368
|
var { children, onClick } = _a, rest = __rest(_a, ["children", "onClick"]);
|
|
369
|
-
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));
|
|
370
370
|
};
|
|
371
371
|
|
|
372
|
-
var css_248z$
|
|
373
|
-
var styles$
|
|
374
|
-
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);
|
|
375
375
|
|
|
376
376
|
const ListItemText = (_a) => {
|
|
377
377
|
var { primary, secondary } = _a, rest = __rest(_a, ["primary", "secondary"]);
|
|
378
378
|
const getCssClasses = () => {
|
|
379
379
|
const cssClasses = [];
|
|
380
|
-
cssClasses.push(styles$
|
|
380
|
+
cssClasses.push(styles$R.listItemText);
|
|
381
381
|
return cssClasses.filter(css => css).join(' ');
|
|
382
382
|
};
|
|
383
383
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -388,9 +388,9 @@ const ListItemText = (_a) => {
|
|
|
388
388
|
const ListItemTextPrimary = ({ children }) => (React.createElement("div", { className: "list-item-text-primary" }, children));
|
|
389
389
|
const ListItemTextSecondary = ({ children }) => (React.createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
390
390
|
|
|
391
|
-
var css_248z$
|
|
392
|
-
var styles$
|
|
393
|
-
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:not(.AutoComplete-module_select__NNYOi.AutoComplete-module_disabled__CbGP4) {\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 .AutoComplete-module_select__NNYOi:disabled, .AutoComplete-module_select__NNYOi:read-only {\n background-color: #e9ecef; }\n .AutoComplete-module_select__NNYOi:disabled:hover {\n cursor: not-allowed; }\n .AutoComplete-module_select__NNYOi:read-only:hover {\n cursor: inherit; }\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","disabled":"AutoComplete-module_disabled__CbGP4","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
393
|
+
styleInject(css_248z$Q);
|
|
394
394
|
|
|
395
395
|
// preset value
|
|
396
396
|
// enter -> delay? -> show results
|
|
@@ -446,7 +446,7 @@ const AutoComplete = (props) => {
|
|
|
446
446
|
const getCssClass = () => {
|
|
447
447
|
const cssClasses = [];
|
|
448
448
|
className && cssClasses.push(className);
|
|
449
|
-
cssClasses.push(styles$
|
|
449
|
+
cssClasses.push(styles$Q.select);
|
|
450
450
|
return cssClasses.filter(r => r).join(' ');
|
|
451
451
|
};
|
|
452
452
|
const show = () => setIsShow(true);
|
|
@@ -470,35 +470,35 @@ const AutoComplete = (props) => {
|
|
|
470
470
|
setModel('');
|
|
471
471
|
setSearchText('');
|
|
472
472
|
};
|
|
473
|
-
return (React.createElement("div", { ref: selectConainter, className: styles$
|
|
473
|
+
return (React.createElement("div", { ref: selectConainter, className: styles$Q.selectContainer },
|
|
474
474
|
React.createElement("div", { className: "d-flex" },
|
|
475
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 }),
|
|
476
476
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
477
477
|
React.createElement(IconButton, { icon: React.createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
478
478
|
isShow &&
|
|
479
479
|
React.createElement(React.Fragment, null,
|
|
480
|
-
React.createElement("div", { className: styles$
|
|
480
|
+
React.createElement("div", { className: styles$Q.selectMenu },
|
|
481
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 },
|
|
482
482
|
React.createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
483
483
|
React.createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
484
484
|
};
|
|
485
485
|
|
|
486
|
-
var css_248z$
|
|
487
|
-
var styles$
|
|
488
|
-
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);
|
|
489
489
|
|
|
490
490
|
const Badge = (props) => {
|
|
491
491
|
const { children, content, className, color = COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
492
492
|
const getCssClassesBadgeContainer = () => {
|
|
493
493
|
const cssClasses = [];
|
|
494
|
-
cssClasses.push(styles$
|
|
494
|
+
cssClasses.push(styles$P.badgeContainer);
|
|
495
495
|
className && cssClasses.push(className);
|
|
496
496
|
return cssClasses.filter(css => css).join(' ');
|
|
497
497
|
};
|
|
498
498
|
const getCssClassesBadge = () => {
|
|
499
499
|
const cssClasses = [];
|
|
500
|
-
cssClasses.push(styles$
|
|
501
|
-
cssClasses.push(styles$
|
|
500
|
+
cssClasses.push(styles$P.badge);
|
|
501
|
+
cssClasses.push(styles$P[color]);
|
|
502
502
|
return cssClasses.filter(css => css).join(' ');
|
|
503
503
|
};
|
|
504
504
|
return (React.createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -506,26 +506,26 @@ const Badge = (props) => {
|
|
|
506
506
|
React.createElement("span", { className: getCssClassesBadge() }, content)));
|
|
507
507
|
};
|
|
508
508
|
|
|
509
|
-
var css_248z$
|
|
510
|
-
var styles$
|
|
511
|
-
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,\r 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:not(.Button-module_button__qeIer.Button-module_disabled__jiOqa) {\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","disabled":"Button-module_disabled__jiOqa","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);
|
|
512
512
|
|
|
513
513
|
const Button = (props) => {
|
|
514
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"]);
|
|
515
515
|
const getCssClasses = () => {
|
|
516
516
|
const cssClasses = [];
|
|
517
|
-
cssClasses.push(styles$
|
|
517
|
+
cssClasses.push(styles$O.button);
|
|
518
518
|
if (variant !== 'outline' && variant !== 'text') {
|
|
519
|
-
cssClasses.push(styles$
|
|
520
|
-
cssClasses.push(styles$
|
|
519
|
+
cssClasses.push(styles$O.btnContained);
|
|
520
|
+
cssClasses.push(styles$O[color]);
|
|
521
521
|
}
|
|
522
522
|
if (variant === 'outline') {
|
|
523
|
-
cssClasses.push(styles$
|
|
524
|
-
cssClasses.push(styles$
|
|
523
|
+
cssClasses.push(styles$O.btnOutline);
|
|
524
|
+
cssClasses.push(styles$O[color]);
|
|
525
525
|
}
|
|
526
526
|
if (variant === 'text') {
|
|
527
|
-
cssClasses.push(styles$
|
|
528
|
-
cssClasses.push(styles$
|
|
527
|
+
cssClasses.push(styles$O.btnText);
|
|
528
|
+
cssClasses.push(styles$O[color]);
|
|
529
529
|
}
|
|
530
530
|
if (isRounded && variant !== 'text') {
|
|
531
531
|
cssClasses.push(`rounded-pill`);
|
|
@@ -533,43 +533,43 @@ const Button = (props) => {
|
|
|
533
533
|
if (isActive) {
|
|
534
534
|
cssClasses.push('active');
|
|
535
535
|
}
|
|
536
|
-
shadow && cssClasses.push(styles$
|
|
536
|
+
shadow && cssClasses.push(styles$O.shadow);
|
|
537
537
|
className && cssClasses.push(className);
|
|
538
538
|
return cssClasses.filter(css => css).join(' ');
|
|
539
539
|
};
|
|
540
540
|
return (React.createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
541
541
|
React.createElement("span", { className: "d-flex justify-content-center" },
|
|
542
542
|
startIcon &&
|
|
543
|
-
React.createElement(Icon, { className: styles$
|
|
543
|
+
React.createElement(Icon, { className: styles$O.startIcon }, startIcon),
|
|
544
544
|
children,
|
|
545
545
|
endIcon &&
|
|
546
|
-
React.createElement(Icon, { className: styles$
|
|
546
|
+
React.createElement(Icon, { className: styles$O.endIcon }, endIcon))));
|
|
547
547
|
};
|
|
548
548
|
|
|
549
|
-
var css_248z$
|
|
550
|
-
var styles$
|
|
551
|
-
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);
|
|
552
552
|
|
|
553
553
|
const ButtonGroup = (props) => {
|
|
554
554
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
555
555
|
const getCssClasses = () => {
|
|
556
556
|
const cssClasses = [];
|
|
557
|
-
cssClasses.push(styles$
|
|
557
|
+
cssClasses.push(styles$N.buttonGroup);
|
|
558
558
|
className && cssClasses.push(className);
|
|
559
559
|
return cssClasses.filter(css => css).join(' ');
|
|
560
560
|
};
|
|
561
561
|
return (React.createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
562
562
|
};
|
|
563
563
|
|
|
564
|
-
var css_248z$
|
|
565
|
-
var styles$
|
|
566
|
-
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);
|
|
567
567
|
|
|
568
568
|
const Breadcrumb = (props) => {
|
|
569
569
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
570
570
|
const getCssClasses = () => {
|
|
571
571
|
const cssClasses = [];
|
|
572
|
-
cssClasses.push(styles$
|
|
572
|
+
cssClasses.push(styles$M.breadcrumb);
|
|
573
573
|
className && cssClasses.push(className);
|
|
574
574
|
return cssClasses.filter(css => css).join(' ');
|
|
575
575
|
};
|
|
@@ -579,15 +579,15 @@ const Breadcrumb = (props) => {
|
|
|
579
579
|
|
|
580
580
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
581
581
|
|
|
582
|
-
var css_248z$
|
|
583
|
-
var styles$
|
|
584
|
-
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);
|
|
585
585
|
|
|
586
586
|
const BreadcrumbItem = (props) => {
|
|
587
587
|
const { children, className, isActive, onClick } = props;
|
|
588
588
|
const getCssClasses = () => {
|
|
589
589
|
const cssClasses = [];
|
|
590
|
-
cssClasses.push(styles$
|
|
590
|
+
cssClasses.push(styles$L.breadcrumbItem);
|
|
591
591
|
className && cssClasses.push(className);
|
|
592
592
|
isActive && cssClasses.push('active');
|
|
593
593
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -599,115 +599,115 @@ const BreadcrumbItem = (props) => {
|
|
|
599
599
|
React.createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React.createElement("a", null, label) }, children)));
|
|
600
600
|
};
|
|
601
601
|
|
|
602
|
-
var css_248z$
|
|
603
|
-
var styles$
|
|
604
|
-
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);
|
|
605
605
|
|
|
606
606
|
const Card = (props) => {
|
|
607
607
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
608
608
|
const getCssClasses = () => {
|
|
609
609
|
const cssClasses = [];
|
|
610
|
-
cssClasses.push(styles$
|
|
611
|
-
shadow && cssClasses.push(styles$
|
|
610
|
+
cssClasses.push(styles$K.card);
|
|
611
|
+
shadow && cssClasses.push(styles$K.shadow);
|
|
612
612
|
className && cssClasses.push(className);
|
|
613
613
|
return cssClasses.filter(css => css).join(' ');
|
|
614
614
|
};
|
|
615
615
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
616
616
|
};
|
|
617
617
|
|
|
618
|
-
var css_248z$
|
|
619
|
-
var styles$
|
|
620
|
-
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);
|
|
621
621
|
|
|
622
622
|
const CardBody = (props) => {
|
|
623
623
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
624
624
|
const getCssClasses = () => {
|
|
625
625
|
const cssClasses = [];
|
|
626
|
-
cssClasses.push(styles$
|
|
626
|
+
cssClasses.push(styles$J.cardBody);
|
|
627
627
|
className && cssClasses.push(className);
|
|
628
628
|
return cssClasses.filter(css => css).join(' ');
|
|
629
629
|
};
|
|
630
630
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
631
631
|
};
|
|
632
632
|
|
|
633
|
-
var css_248z$
|
|
634
|
-
var styles$
|
|
635
|
-
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);
|
|
636
636
|
|
|
637
637
|
const CardFooter = (props) => {
|
|
638
638
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
639
639
|
const getCssClasses = () => {
|
|
640
640
|
const cssClasses = [];
|
|
641
|
-
cssClasses.push(styles$
|
|
641
|
+
cssClasses.push(styles$I.cardFooter);
|
|
642
642
|
className && cssClasses.push(className);
|
|
643
643
|
return cssClasses.filter(css => css).join(' ');
|
|
644
644
|
};
|
|
645
645
|
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
646
646
|
};
|
|
647
647
|
|
|
648
|
-
var css_248z$
|
|
649
|
-
var styles$
|
|
650
|
-
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);
|
|
651
651
|
|
|
652
652
|
const CardSubtitle = (props) => {
|
|
653
653
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
654
654
|
const getCssClasses = () => {
|
|
655
655
|
const cssClasses = [];
|
|
656
|
-
cssClasses.push(styles$
|
|
656
|
+
cssClasses.push(styles$H.cardSubtitle);
|
|
657
657
|
className && cssClasses.push(className);
|
|
658
658
|
return cssClasses.filter(css => css).join(' ');
|
|
659
659
|
};
|
|
660
660
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
661
661
|
};
|
|
662
662
|
|
|
663
|
-
var css_248z$
|
|
664
|
-
var styles$
|
|
665
|
-
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);
|
|
666
666
|
|
|
667
667
|
const CardText = (props) => {
|
|
668
668
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
669
669
|
const getCssClasses = () => {
|
|
670
670
|
const cssClasses = [];
|
|
671
|
-
cssClasses.push(styles$
|
|
671
|
+
cssClasses.push(styles$G.cardText);
|
|
672
672
|
className && cssClasses.push(className);
|
|
673
673
|
return cssClasses.filter(css => css).join(' ');
|
|
674
674
|
};
|
|
675
675
|
return (React.createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
676
676
|
};
|
|
677
677
|
|
|
678
|
-
var css_248z$
|
|
679
|
-
var styles$
|
|
680
|
-
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);
|
|
681
681
|
|
|
682
682
|
const CardTitle = (props) => {
|
|
683
683
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
684
684
|
const getCssClasses = () => {
|
|
685
685
|
const cssClasses = [];
|
|
686
|
-
cssClasses.push(styles$
|
|
686
|
+
cssClasses.push(styles$F.cardTitle);
|
|
687
687
|
className && cssClasses.push(className);
|
|
688
688
|
return cssClasses.filter(css => css).join(' ');
|
|
689
689
|
};
|
|
690
690
|
return (React.createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
691
691
|
};
|
|
692
692
|
|
|
693
|
-
var css_248z$
|
|
694
|
-
var styles$
|
|
695
|
-
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);
|
|
696
696
|
|
|
697
697
|
const CardImage = (props) => {
|
|
698
698
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
699
699
|
const getCssClasses = () => {
|
|
700
700
|
const cssClasses = [];
|
|
701
|
-
cssClasses.push(styles$
|
|
701
|
+
cssClasses.push(styles$E.cardImage);
|
|
702
702
|
className && cssClasses.push(className);
|
|
703
703
|
return cssClasses.filter(css => css).join(' ');
|
|
704
704
|
};
|
|
705
705
|
return (React.createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
706
706
|
};
|
|
707
707
|
|
|
708
|
-
var css_248z$
|
|
709
|
-
var styles$
|
|
710
|
-
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);
|
|
711
711
|
|
|
712
712
|
const Checkbox = (props) => {
|
|
713
713
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -734,6 +734,12 @@ const Checkbox = (props) => {
|
|
|
734
734
|
className && cssClasses.push(className);
|
|
735
735
|
return cssClasses.filter(css => css).join(' ');
|
|
736
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
|
+
};
|
|
737
743
|
const getIcon = () => {
|
|
738
744
|
return isChecked ? icons.selected : icons.default;
|
|
739
745
|
};
|
|
@@ -744,24 +750,24 @@ const Checkbox = (props) => {
|
|
|
744
750
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
745
751
|
}
|
|
746
752
|
};
|
|
747
|
-
return (React.createElement("div", { className: styles$
|
|
753
|
+
return (React.createElement("div", { className: styles$D.checkboxContainer },
|
|
748
754
|
React.createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
749
|
-
React.createElement("label", { onClick: handleClick, className:
|
|
755
|
+
React.createElement("label", { onClick: handleClick, className: getCssClassesLabel() }, label),
|
|
750
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))));
|
|
751
757
|
};
|
|
752
758
|
|
|
753
|
-
var css_248z$
|
|
754
|
-
var styles$
|
|
755
|
-
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);
|
|
756
762
|
|
|
757
763
|
const Chip = (props) => {
|
|
758
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"]);
|
|
759
765
|
const getCssClass = () => {
|
|
760
766
|
const cssClasses = [];
|
|
761
|
-
cssClasses.push(styles$
|
|
762
|
-
cssClasses.push(styles$
|
|
763
|
-
shadow && cssClasses.push(styles$
|
|
764
|
-
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']);
|
|
765
771
|
className && cssClasses.push(className);
|
|
766
772
|
return cssClasses.filter(r => r).join(' ');
|
|
767
773
|
};
|
|
@@ -771,18 +777,61 @@ const Chip = (props) => {
|
|
|
771
777
|
};
|
|
772
778
|
return (React.createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
773
779
|
React.createElement("div", null, children),
|
|
774
|
-
isDeletable && (React.createElement("div", { className: styles$
|
|
780
|
+
isDeletable && (React.createElement("div", { className: styles$C.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
775
781
|
};
|
|
776
782
|
|
|
777
|
-
var css_248z$
|
|
778
|
-
var styles$
|
|
779
|
-
styleInject(css_248z$
|
|
783
|
+
var css_248z$B = ".Column-module_column__fcTgl {\n flex: 1 0 0%; }\n";
|
|
784
|
+
var styles$B = {"column":"Column-module_column__fcTgl"};
|
|
785
|
+
styleInject(css_248z$B);
|
|
786
|
+
|
|
787
|
+
const Column = (props) => {
|
|
788
|
+
const { children, className } = props,
|
|
789
|
+
// xs,
|
|
790
|
+
// sm,
|
|
791
|
+
// md,
|
|
792
|
+
// lg,
|
|
793
|
+
// xl,
|
|
794
|
+
rest = __rest(props, ["children", "className"]);
|
|
795
|
+
const getCssClasses = () => {
|
|
796
|
+
const cssClasses = [];
|
|
797
|
+
// !xs && !sm && !md && !lg && !xl && cssClasses.push('col');
|
|
798
|
+
// if (xs) cssClasses.push(`col-${xs.toString()}`);
|
|
799
|
+
// if (sm) cssClasses.push(`col-sm-${sm.toString()}`);
|
|
800
|
+
// if (md) cssClasses.push(`col-md-${md.toString()}`);
|
|
801
|
+
// if (lg) cssClasses.push(`col-lg-${lg.toString()}`);
|
|
802
|
+
// if (xl) cssClasses.push(`col-xl-${xl.toString()}`);
|
|
803
|
+
cssClasses.push(styles$B.column);
|
|
804
|
+
className && cssClasses.push(className);
|
|
805
|
+
return cssClasses.filter(css => css).join(' ');
|
|
806
|
+
};
|
|
807
|
+
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
808
|
+
};
|
|
809
|
+
|
|
810
|
+
var css_248z$A = ".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";
|
|
811
|
+
var styles$A = {"row":"Row-module_row__bTIWp"};
|
|
812
|
+
styleInject(css_248z$A);
|
|
813
|
+
|
|
814
|
+
const Row = (_a) => {
|
|
815
|
+
var { children, direction = 'row', className } = _a, rest = __rest(_a, ["children", "direction", "className"]);
|
|
816
|
+
const getCssClasses = () => {
|
|
817
|
+
const cssClasses = [];
|
|
818
|
+
cssClasses.push(styles$A.row);
|
|
819
|
+
className && cssClasses.push(className);
|
|
820
|
+
direction && cssClasses.push(`flex-${direction}`);
|
|
821
|
+
return cssClasses.filter(css => css).join(' ');
|
|
822
|
+
};
|
|
823
|
+
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
824
|
+
};
|
|
825
|
+
|
|
826
|
+
var css_248z$z = ".FormLabel-module_formLabel__TXcHc {\n display: inline-block;\n margin-bottom: 0.5rem; }\n";
|
|
827
|
+
var styles$z = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
828
|
+
styleInject(css_248z$z);
|
|
780
829
|
|
|
781
830
|
const FormLabel = (_a) => {
|
|
782
831
|
var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
|
|
783
832
|
const getCssClasses = () => {
|
|
784
833
|
const cssClasses = [];
|
|
785
|
-
cssClasses.push(styles$
|
|
834
|
+
cssClasses.push(styles$z.formLabel);
|
|
786
835
|
className && cssClasses.push(className);
|
|
787
836
|
return cssClasses.filter(css => css).join(' ');
|
|
788
837
|
};
|
|
@@ -819,13 +868,13 @@ const FileInput = (props) => {
|
|
|
819
868
|
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))));
|
|
820
869
|
};
|
|
821
870
|
|
|
822
|
-
var css_248z$
|
|
823
|
-
var styles$
|
|
824
|
-
styleInject(css_248z$
|
|
871
|
+
var css_248z$y = ".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:not(.Select-module_select__Fbn38.Select-module_disabled__2XXut) {\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 .Select-module_select__Fbn38.Select-module_disabled__2XXut, .Select-module_select__Fbn38.Select-module_readOnly__VoTER {\n background-color: #e9ecef; }\n .Select-module_select__Fbn38.Select-module_disabled__2XXut:hover {\n cursor: not-allowed; }\n .Select-module_select__Fbn38.Select-module_readOnly__VoTER:hover {\n cursor: inherit; }\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";
|
|
872
|
+
var styles$y = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","disabled":"Select-module_disabled__2XXut","readOnly":"Select-module_readOnly__VoTER","selectMenu":"Select-module_selectMenu__8y4kQ"};
|
|
873
|
+
styleInject(css_248z$y);
|
|
825
874
|
|
|
826
875
|
const Select = (props) => {
|
|
827
876
|
var _a, _b, _c;
|
|
828
|
-
const { id, className, options = [], value, multiple, multipleMaxCountItems = 5, onChange, onKeyDown } = props;
|
|
877
|
+
const { id, className, options = [], value, multiple, multipleMaxCountItems = 5, disabled, readOnly, onChange, onKeyDown } = props;
|
|
829
878
|
const [model, setModel] = useState('');
|
|
830
879
|
const [hoverIndex, setHoverIndex] = useState(null);
|
|
831
880
|
const [isShow, setIsShow] = useState(false);
|
|
@@ -834,7 +883,9 @@ const Select = (props) => {
|
|
|
834
883
|
const getCssClass = () => {
|
|
835
884
|
const cssClasses = [];
|
|
836
885
|
className && cssClasses.push(className);
|
|
837
|
-
cssClasses.push(styles$
|
|
886
|
+
disabled && cssClasses.push(styles$y['disabled']);
|
|
887
|
+
readOnly && cssClasses.push(styles$y['readOnly']);
|
|
888
|
+
cssClasses.push(styles$y.select);
|
|
838
889
|
return cssClasses.filter(r => r).join(' ');
|
|
839
890
|
};
|
|
840
891
|
useEffect(() => {
|
|
@@ -894,7 +945,11 @@ const Select = (props) => {
|
|
|
894
945
|
}
|
|
895
946
|
writeValue(newValue);
|
|
896
947
|
};
|
|
897
|
-
const show = () =>
|
|
948
|
+
const show = () => {
|
|
949
|
+
if (!disabled && !readOnly) {
|
|
950
|
+
setIsShow(true);
|
|
951
|
+
}
|
|
952
|
+
};
|
|
898
953
|
const hide = () => setIsShow(false);
|
|
899
954
|
const isActive = (option) => {
|
|
900
955
|
return selectedOptions.indexOf(option) >= 0 || hoverIndex === options.indexOf(option);
|
|
@@ -952,7 +1007,7 @@ const Select = (props) => {
|
|
|
952
1007
|
}
|
|
953
1008
|
}
|
|
954
1009
|
};
|
|
955
|
-
return (React.createElement("div", { ref: selectConainter, className: styles$
|
|
1010
|
+
return (React.createElement("div", { ref: selectConainter, className: styles$y.selectContainer },
|
|
956
1011
|
React.createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
957
1012
|
!multiple && renderSingleViewModel(),
|
|
958
1013
|
multiple && renderMultipleViewModel(),
|
|
@@ -960,7 +1015,7 @@ const Select = (props) => {
|
|
|
960
1015
|
React.createElement(ChevronDownSolidIcon, null))),
|
|
961
1016
|
isShow &&
|
|
962
1017
|
createPortal(React.createElement(React.Fragment, null,
|
|
963
|
-
React.createElement("div", { className: styles$
|
|
1018
|
+
React.createElement("div", { className: styles$y.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 } },
|
|
964
1019
|
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) },
|
|
965
1020
|
multiple &&
|
|
966
1021
|
React.createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -968,32 +1023,33 @@ const Select = (props) => {
|
|
|
968
1023
|
React.createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
|
|
969
1024
|
};
|
|
970
1025
|
|
|
971
|
-
var css_248z$
|
|
972
|
-
var styles$
|
|
973
|
-
styleInject(css_248z$
|
|
1026
|
+
var css_248z$x = ".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:not(.Textarea-module_textarea__L5zqa.Textarea-module_disabled__OqqOF) {\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";
|
|
1027
|
+
var styles$x = {"textarea":"Textarea-module_textarea__L5zqa","disabled":"Textarea-module_disabled__OqqOF","isInvalid":"Textarea-module_isInvalid__JI01W"};
|
|
1028
|
+
styleInject(css_248z$x);
|
|
974
1029
|
|
|
975
1030
|
const Textarea = (props) => {
|
|
976
|
-
const { className } = props, rest = __rest(props, ["className"]);
|
|
1031
|
+
const { className, error } = props, rest = __rest(props, ["className", "error"]);
|
|
977
1032
|
const getCssClass = () => {
|
|
978
1033
|
const cssClasses = [];
|
|
979
|
-
cssClasses.push(styles$
|
|
1034
|
+
cssClasses.push(styles$x.textarea);
|
|
980
1035
|
className && cssClasses.push(className);
|
|
1036
|
+
error && cssClasses.push(styles$x['isInvalid']);
|
|
981
1037
|
return cssClasses.filter(r => r).join(' ');
|
|
982
1038
|
};
|
|
983
1039
|
return (React.createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
984
1040
|
};
|
|
985
1041
|
|
|
986
|
-
var css_248z$
|
|
987
|
-
var styles$
|
|
988
|
-
styleInject(css_248z$
|
|
1042
|
+
var css_248z$w = ".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:not(.FormInput-module_formInput__VXZip.FormInput-module_disabled__EjdD9) {\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";
|
|
1043
|
+
var styles$w = {"formInput":"FormInput-module_formInput__VXZip","disabled":"FormInput-module_disabled__EjdD9","isInvalid":"FormInput-module_isInvalid__vQDuz"};
|
|
1044
|
+
styleInject(css_248z$w);
|
|
989
1045
|
|
|
990
1046
|
const FormInput = (props) => {
|
|
991
|
-
const { value, name, type, placeholder, className
|
|
1047
|
+
const { value, name, type, placeholder, className, isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
992
1048
|
const getCssClasses = () => {
|
|
993
1049
|
const cssClasses = [];
|
|
994
|
-
cssClasses.push(styles$
|
|
1050
|
+
cssClasses.push(styles$w.formInput);
|
|
995
1051
|
className && cssClasses.push(className);
|
|
996
|
-
!isValid && cssClasses.push('
|
|
1052
|
+
!isValid && cssClasses.push(styles$w['isInvalid']);
|
|
997
1053
|
return cssClasses.filter(css => css).join(' ');
|
|
998
1054
|
};
|
|
999
1055
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -1018,7 +1074,7 @@ const FormInput = (props) => {
|
|
|
1018
1074
|
type === 'file' &&
|
|
1019
1075
|
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"),
|
|
1020
1076
|
type === 'textarea' &&
|
|
1021
|
-
React.createElement(Textarea, { id: name, name: name, className: className
|
|
1077
|
+
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' } }),
|
|
1022
1078
|
type === 'select' &&
|
|
1023
1079
|
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),
|
|
1024
1080
|
// onKeyDown={e => onKeyDown(e)}
|
|
@@ -1043,8 +1099,12 @@ const FormHint = (props) => {
|
|
|
1043
1099
|
return (React.createElement("small", { className: getCssClasses() }, children));
|
|
1044
1100
|
};
|
|
1045
1101
|
|
|
1102
|
+
var css_248z$v = ".FormError-module_isInvalid__tO1Sw {\n width: 100%;\n margin-top: 0.25rem;\n font-size: 0.875em;\n color: #dc3545; }\n";
|
|
1103
|
+
var styles$v = {"isInvalid":"FormError-module_isInvalid__tO1Sw"};
|
|
1104
|
+
styleInject(css_248z$v);
|
|
1105
|
+
|
|
1046
1106
|
const FormError = (props) => {
|
|
1047
|
-
const { className =
|
|
1107
|
+
const { className = styles$v.isInvalid, errors = [] } = props;
|
|
1048
1108
|
return (React.createElement(Fragment, null, errors &&
|
|
1049
1109
|
React.createElement("div", { className: className }, errors.map(e => React.createElement("div", { key: e.validator }, e.message)))));
|
|
1050
1110
|
};
|
|
@@ -1339,16 +1399,16 @@ const DateSelect = (props) => {
|
|
|
1339
1399
|
setCurrDate(newDate);
|
|
1340
1400
|
onChange && onChange(newDate);
|
|
1341
1401
|
};
|
|
1342
|
-
return (React.createElement(
|
|
1343
|
-
React.createElement(
|
|
1402
|
+
return (React.createElement(Row, { className: getCssClasses() },
|
|
1403
|
+
React.createElement(Column, null,
|
|
1344
1404
|
React.createElement(FormLabel, null, "Year"),
|
|
1345
|
-
React.createElement(YearSelect, {
|
|
1346
|
-
React.createElement(
|
|
1405
|
+
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) })),
|
|
1406
|
+
React.createElement(Column, null,
|
|
1347
1407
|
React.createElement(FormLabel, null, "Month"),
|
|
1348
|
-
React.createElement(MonthSelect, {
|
|
1349
|
-
React.createElement(
|
|
1408
|
+
React.createElement(MonthSelect, { value: currDate.getMonth(), disabled: disabled, onChange: e => handleOnChange(e, DATEMODE.MONTH) })),
|
|
1409
|
+
React.createElement(Column, null,
|
|
1350
1410
|
React.createElement(FormLabel, null, "Day"),
|
|
1351
|
-
React.createElement(DaySelect, {
|
|
1411
|
+
React.createElement(DaySelect, { day: currDate.getDate(), month: currDate.getMonth(), year: currDate.getFullYear(), disabled: disabled, onChange: e => handleOnChange(e, DATEMODE.DAY) }))));
|
|
1352
1412
|
};
|
|
1353
1413
|
/*
|
|
1354
1414
|
* result = { year, month, day, dayOfWeek, weekNumber }
|
|
@@ -1574,38 +1634,6 @@ const FloatingActionButton = (props) => {
|
|
|
1574
1634
|
return (React.createElement(IconButton, { className: getCssClasses(), color: color, size: size, isActive: isActive, disabled: disabled, icon: icon, variant: VARIANT.contained, onClick: handleClick }));
|
|
1575
1635
|
};
|
|
1576
1636
|
|
|
1577
|
-
const Column = (props) => {
|
|
1578
|
-
const { children, className, xs, sm, md, lg, xl } = props, rest = __rest(props, ["children", "className", "xs", "sm", "md", "lg", "xl"]);
|
|
1579
|
-
const getCssClasses = () => {
|
|
1580
|
-
const cssClasses = [];
|
|
1581
|
-
!xs && !sm && !md && !lg && !xl && cssClasses.push('col');
|
|
1582
|
-
if (xs)
|
|
1583
|
-
cssClasses.push(`col-${xs.toString()}`);
|
|
1584
|
-
if (sm)
|
|
1585
|
-
cssClasses.push(`col-sm-${sm.toString()}`);
|
|
1586
|
-
if (md)
|
|
1587
|
-
cssClasses.push(`col-md-${md.toString()}`);
|
|
1588
|
-
if (lg)
|
|
1589
|
-
cssClasses.push(`col-lg-${lg.toString()}`);
|
|
1590
|
-
if (xl)
|
|
1591
|
-
cssClasses.push(`col-xl-${xl.toString()}`);
|
|
1592
|
-
className && cssClasses.push(className);
|
|
1593
|
-
return cssClasses.filter(css => css).join(' ');
|
|
1594
|
-
};
|
|
1595
|
-
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1596
|
-
};
|
|
1597
|
-
|
|
1598
|
-
const Row = (props) => {
|
|
1599
|
-
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
1600
|
-
const getCssClasses = () => {
|
|
1601
|
-
const cssClasses = [];
|
|
1602
|
-
cssClasses.push('row');
|
|
1603
|
-
className && cssClasses.push(className);
|
|
1604
|
-
return cssClasses.filter(css => css).join(' ');
|
|
1605
|
-
};
|
|
1606
|
-
return (React.createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1607
|
-
};
|
|
1608
|
-
|
|
1609
1637
|
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";
|
|
1610
1638
|
var styles$l = {"link":"Link-module_link__YlJQl"};
|
|
1611
1639
|
styleInject(css_248z$l);
|
|
@@ -1844,7 +1872,6 @@ const NumberSelect = (props) => {
|
|
|
1844
1872
|
}, [from, to]);
|
|
1845
1873
|
const getCssClasses = () => {
|
|
1846
1874
|
const cssClasses = [];
|
|
1847
|
-
cssClasses.push('form-control');
|
|
1848
1875
|
className && cssClasses.push(className);
|
|
1849
1876
|
return cssClasses.filter(css => css).join(' ');
|
|
1850
1877
|
};
|
|
@@ -2203,7 +2230,7 @@ const Stepper = (props) => {
|
|
|
2203
2230
|
React.createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset }))));
|
|
2204
2231
|
};
|
|
2205
2232
|
|
|
2206
|
-
var css_248z$8 = ".Typography-module_typography__sw-td {\n text-overflow: ellipsis;\n
|
|
2233
|
+
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";
|
|
2207
2234
|
var styles$8 = {"typography":"Typography-module_typography__sw-td"};
|
|
2208
2235
|
styleInject(css_248z$8);
|
|
2209
2236
|
|
|
@@ -2212,6 +2239,7 @@ const Wrapper = (props) => {
|
|
|
2212
2239
|
const getCssClasses = () => {
|
|
2213
2240
|
const cssClasses = [];
|
|
2214
2241
|
cssClasses.push(styles$8.typography);
|
|
2242
|
+
cssClasses.push(styles$8.as);
|
|
2215
2243
|
className && cssClasses.push(className);
|
|
2216
2244
|
return cssClasses.filter(css => css).join(' ');
|
|
2217
2245
|
};
|
|
@@ -2530,23 +2558,23 @@ const TimeSelect = (props) => {
|
|
|
2530
2558
|
setCurrDate(newDate);
|
|
2531
2559
|
onChange && onChange(newDate);
|
|
2532
2560
|
};
|
|
2533
|
-
return (React.createElement(
|
|
2561
|
+
return (React.createElement(Row, { className: getCssClasses() },
|
|
2534
2562
|
showHours &&
|
|
2535
|
-
React.createElement(
|
|
2563
|
+
React.createElement(Column, null,
|
|
2536
2564
|
React.createElement(FormLabel, null, "Hours"),
|
|
2537
|
-
React.createElement(HourSelect, {
|
|
2565
|
+
React.createElement(HourSelect, { value: currDate.getHours(), disabled: disabled, onChange: e => handleOnChange(e, TIMEMODE.HOUR) })),
|
|
2538
2566
|
showMinutes &&
|
|
2539
|
-
React.createElement(
|
|
2567
|
+
React.createElement(Column, null,
|
|
2540
2568
|
React.createElement(FormLabel, null, "Minutes"),
|
|
2541
|
-
React.createElement(MinuteSelect, {
|
|
2569
|
+
React.createElement(MinuteSelect, { value: currDate.getMinutes(), disabled: disabled, onChange: e => handleOnChange(e, TIMEMODE.MINUTE) })),
|
|
2542
2570
|
showSeconds &&
|
|
2543
|
-
React.createElement(
|
|
2571
|
+
React.createElement(Column, null,
|
|
2544
2572
|
React.createElement(FormLabel, null, "Seconds"),
|
|
2545
|
-
React.createElement(SecondSelect, {
|
|
2573
|
+
React.createElement(SecondSelect, { value: currDate.getSeconds(), disabled: disabled, onChange: e => handleOnChange(e, TIMEMODE.SECONDS) })),
|
|
2546
2574
|
showMilliSeconds &&
|
|
2547
|
-
React.createElement(
|
|
2575
|
+
React.createElement(Column, null,
|
|
2548
2576
|
React.createElement(FormLabel, null, "Milliseconds"),
|
|
2549
|
-
React.createElement(MilliSecondSelect, {
|
|
2577
|
+
React.createElement(MilliSecondSelect, { value: currDate.getMilliseconds(), disabled: disabled, onChange: e => handleOnChange(e, TIMEMODE.MILLISECONDS) }))));
|
|
2550
2578
|
};
|
|
2551
2579
|
|
|
2552
2580
|
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";
|