react-asc 19.0.2 → 19.0.6
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/Form/FormInput/FormInput.d.ts +2 -2
- package/hooks/useHover.d.ts +2 -2
- package/index.es.js +308 -295
- package/index.js +308 -295
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -95,93 +95,93 @@ function styleInject(css, ref) {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
|
|
98
|
-
var css_248z$
|
|
99
|
-
var styles$
|
|
100
|
-
styleInject(css_248z$
|
|
98
|
+
var css_248z$X = ".Alert-module_alert__b4tbk {\n border-radius: var(--borderRadius);\n padding: 6px 16px; }\n\n.Alert-module_contained__EM0x6.Alert-module_primary__q4pNj {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n\n.Alert-module_contained__EM0x6.Alert-module_accent__a2WIl {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n\n.Alert-module_contained__EM0x6.Alert-module_secondary__syXKX {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n\n.Alert-module_contained__EM0x6.Alert-module_light__VKCXF {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n\n.Alert-module_contained__EM0x6.Alert-module_dark__3c-Hm {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Alert-module_outline__T2262.Alert-module_primary__q4pNj {\n color: var(--primary) !important;\n border: 1px solid var(--primary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_secondary__syXKX {\n color: var(--secondary) !important;\n border: 1px solid var(--secondary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_accent__a2WIl {\n color: var(--accent) !important;\n border: 1px solid var(--accent) !important; }\n\n.Alert-module_outline__T2262.Alert-module_light__VKCXF {\n color: var(--light-contrast-text) !important;\n border: 1px solid var(--light) !important; }\n\n.Alert-module_outline__T2262.Alert-module_dark__3c-Hm {\n color: var(--dark) !important;\n border: 1px solid var(--dark) !important; }\n";
|
|
99
|
+
var styles$X = {"alert":"Alert-module_alert__b4tbk","contained":"Alert-module_contained__EM0x6","primary":"Alert-module_primary__q4pNj","accent":"Alert-module_accent__a2WIl","secondary":"Alert-module_secondary__syXKX","light":"Alert-module_light__VKCXF","dark":"Alert-module_dark__3c-Hm","outline":"Alert-module_outline__T2262"};
|
|
100
|
+
styleInject(css_248z$X);
|
|
101
101
|
|
|
102
102
|
const Alert = (props) => {
|
|
103
103
|
const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
104
104
|
const getCssClasses = () => {
|
|
105
105
|
const cssClasses = [];
|
|
106
|
-
cssClasses.push(styles$
|
|
106
|
+
cssClasses.push(styles$X.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$X.contained);
|
|
109
|
+
cssClasses.push(styles$X[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$X.outline);
|
|
113
|
+
cssClasses.push(styles$X[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$X['shadow']);
|
|
116
116
|
className && cssClasses.push(className);
|
|
117
117
|
return cssClasses.filter(r => r).join(' ');
|
|
118
118
|
};
|
|
119
119
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var css_248z$
|
|
123
|
-
var styles$
|
|
124
|
-
styleInject(css_248z$
|
|
122
|
+
var css_248z$W = ".AppBar-module_appbar__Neyh3 {\n padding: 0.5rem 1rem;\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0; }\n .AppBar-module_appbar__Neyh3.AppBar-module_primary__xMqXD {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_secondary__8MkLA {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_accent__vHbkp {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .AppBar-module_appbar__Neyh3.AppBar-module_light__HGy3y {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .AppBar-module_appbar__Neyh3.AppBar-module_dark__ILq96 {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .AppBar-module_appbar__Neyh3.AppBar-module_shadow__gQN8s {\n box-shadow: var(--shadow); }\n";
|
|
123
|
+
var styles$W = {"appbar":"AppBar-module_appbar__Neyh3","primary":"AppBar-module_primary__xMqXD","secondary":"AppBar-module_secondary__8MkLA","accent":"AppBar-module_accent__vHbkp","light":"AppBar-module_light__HGy3y","dark":"AppBar-module_dark__ILq96","shadow":"AppBar-module_shadow__gQN8s"};
|
|
124
|
+
styleInject(css_248z$W);
|
|
125
125
|
|
|
126
126
|
const AppBar = (props) => {
|
|
127
127
|
const { children, className, color = exports.COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
128
128
|
const getCssClasses = () => {
|
|
129
129
|
const cssClasses = [];
|
|
130
|
-
cssClasses.push(styles$
|
|
131
|
-
cssClasses.push(styles$
|
|
132
|
-
shadow && cssClasses.push(styles$
|
|
130
|
+
cssClasses.push(styles$W[color]);
|
|
131
|
+
cssClasses.push(styles$W.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$W['shadow']);
|
|
133
133
|
className && cssClasses.push(className);
|
|
134
134
|
return cssClasses.filter(r => r).join(' ');
|
|
135
135
|
};
|
|
136
136
|
return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
137
137
|
};
|
|
138
138
|
|
|
139
|
-
var css_248z$
|
|
140
|
-
var styles$
|
|
141
|
-
styleInject(css_248z$
|
|
139
|
+
var css_248z$V = ".AppBarTitle-module_appbarTitle__RsFg5 {\n align-items: center;\n padding-top: 0.3125rem;\n padding-bottom: 0.3125rem;\n font-size: 1.25rem;\n line-height: 1.8;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden !important;\n display: inline-block; }\n .AppBarTitle-module_appbarTitle__RsFg5:hover {\n cursor: pointer; }\n";
|
|
140
|
+
var styles$V = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
|
|
141
|
+
styleInject(css_248z$V);
|
|
142
142
|
|
|
143
143
|
const AppBarTitle = (props) => {
|
|
144
144
|
const { children, className, onClick } = props;
|
|
145
145
|
const getCssClass = () => {
|
|
146
146
|
const cssClasses = [];
|
|
147
|
-
cssClasses.push(styles$
|
|
147
|
+
cssClasses.push(styles$V.appbarTitle);
|
|
148
148
|
className && cssClasses.push(className);
|
|
149
149
|
return cssClasses.filter(r => r).join(' ');
|
|
150
150
|
};
|
|
151
151
|
return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
152
152
|
};
|
|
153
153
|
|
|
154
|
-
var css_248z$
|
|
155
|
-
var styles$
|
|
156
|
-
styleInject(css_248z$
|
|
154
|
+
var css_248z$U = ".Icon-module_icon__lFKCA {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px; }\n .Icon-module_icon__lFKCA svg {\n width: inherit;\n height: inherit; }\n .Icon-module_icon__lFKCA.Icon-module_primary__3fID- {\n color: var(--primary); }\n .Icon-module_icon__lFKCA.Icon-module_accent__aZXGb {\n color: var(--accent); }\n .Icon-module_icon__lFKCA.Icon-module_secondary__HKKop {\n color: var(--secondary); }\n .Icon-module_icon__lFKCA.Icon-module_light__-ApMm {\n color: var(--light); }\n .Icon-module_icon__lFKCA.Icon-module_dark__DpCIK {\n color: var(--dark); }\n";
|
|
155
|
+
var styles$U = {"icon":"Icon-module_icon__lFKCA","primary":"Icon-module_primary__3fID-","accent":"Icon-module_accent__aZXGb","secondary":"Icon-module_secondary__HKKop","light":"Icon-module_light__-ApMm","dark":"Icon-module_dark__DpCIK"};
|
|
156
|
+
styleInject(css_248z$U);
|
|
157
157
|
|
|
158
158
|
const Icon = (props) => {
|
|
159
159
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
160
160
|
const getCssClasses = () => {
|
|
161
161
|
const cssClasses = [];
|
|
162
|
-
cssClasses.push(styles$
|
|
163
|
-
iconColor && cssClasses.push(styles$
|
|
162
|
+
cssClasses.push(styles$U.icon);
|
|
163
|
+
iconColor && cssClasses.push(styles$U[iconColor]);
|
|
164
164
|
className && cssClasses.push(className);
|
|
165
165
|
return cssClasses.filter(css => css).join(' ');
|
|
166
166
|
};
|
|
167
167
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
168
168
|
};
|
|
169
169
|
|
|
170
|
-
var css_248z$
|
|
171
|
-
var styles$
|
|
172
|
-
styleInject(css_248z$
|
|
170
|
+
var css_248z$T = ".IconButton-module_iconButton__rpCPQ {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none; }\n .IconButton-module_iconButton__rpCPQ:hover {\n cursor: pointer; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_shadow__Uw0RK {\n box-shadow: var(--shadow); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_md__XnuSk {\n width: 48px;\n height: 48px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_lg__arEvo {\n width: 56px;\n height: 56px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag {\n padding: 0;\n background: transparent;\n color: inherit; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G {\n color: var(--primary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY {\n color: var(--secondary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2 {\n color: var(--accent); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO {\n color: var(--light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH {\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n color: var(--dark-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G {\n background-color: var(--primary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n background-color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY {\n background-color: var(--secondary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n background-color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2 {\n background-color: var(--accent);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n background-color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO {\n background-color: var(--light);\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n background-color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH {\n background-color: var(--dark);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n background-color: var(--dark-light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n";
|
|
171
|
+
var styles$T = {"iconButton":"IconButton-module_iconButton__rpCPQ","shadow":"IconButton-module_shadow__Uw0RK","md":"IconButton-module_md__XnuSk","lg":"IconButton-module_lg__arEvo","text":"IconButton-module_text__Ualag","active":"IconButton-module_active__VIqU9","primary":"IconButton-module_primary__vbo-G","secondary":"IconButton-module_secondary__AiNAY","accent":"IconButton-module_accent__QRzM2","light":"IconButton-module_light__YNEiO","dark":"IconButton-module_dark__gnbUH","disabled":"IconButton-module_disabled__QB0ZV","contained":"IconButton-module_contained__k7vGA"};
|
|
172
|
+
styleInject(css_248z$T);
|
|
173
173
|
|
|
174
174
|
const IconButton = (props) => {
|
|
175
175
|
const { children, icon, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
176
176
|
const getCssClasses = () => {
|
|
177
177
|
const cssClasses = [];
|
|
178
|
-
cssClasses.push(styles$
|
|
179
|
-
cssClasses.push(styles$
|
|
180
|
-
cssClasses.push(styles$
|
|
181
|
-
cssClasses.push(styles$
|
|
182
|
-
isActive && cssClasses.push(styles$
|
|
183
|
-
disabled && cssClasses.push(styles$
|
|
184
|
-
shadow && cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$T[color]);
|
|
179
|
+
cssClasses.push(styles$T[variant]);
|
|
180
|
+
cssClasses.push(styles$T[size]);
|
|
181
|
+
cssClasses.push(styles$T.iconButton);
|
|
182
|
+
isActive && cssClasses.push(styles$T.active);
|
|
183
|
+
disabled && cssClasses.push(styles$T.disabled);
|
|
184
|
+
shadow && cssClasses.push(styles$T.shadow);
|
|
185
185
|
className && cssClasses.push(className);
|
|
186
186
|
return cssClasses.filter(css => css).join(' ');
|
|
187
187
|
};
|
|
@@ -251,22 +251,26 @@ function useWindowSize() {
|
|
|
251
251
|
return windowSize;
|
|
252
252
|
}
|
|
253
253
|
|
|
254
|
-
function useHover(
|
|
254
|
+
function useHover() {
|
|
255
255
|
const [value, setValue] = React.useState(false);
|
|
256
|
+
const ref = React.useRef(null);
|
|
256
257
|
const handleMouseOver = () => setValue(true);
|
|
257
258
|
const handleMouseOut = () => setValue(false);
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
node.
|
|
261
|
-
node
|
|
262
|
-
|
|
259
|
+
React.useEffect(() => {
|
|
260
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
261
|
+
const node = ref.current;
|
|
262
|
+
if (node) {
|
|
263
|
+
node.addEventListener("mouseover", handleMouseOver);
|
|
264
|
+
node.addEventListener("mouseout", handleMouseOut);
|
|
263
265
|
return () => {
|
|
264
266
|
node.removeEventListener("mouseover", handleMouseOver);
|
|
265
267
|
node.removeEventListener("mouseout", handleMouseOut);
|
|
266
268
|
};
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
|
|
269
|
+
}
|
|
270
|
+
return;
|
|
271
|
+
}, [ref.current] // Recall only if ref changes
|
|
272
|
+
);
|
|
273
|
+
return [ref, value];
|
|
270
274
|
}
|
|
271
275
|
|
|
272
276
|
const useConstructor = (callBack) => {
|
|
@@ -307,34 +311,34 @@ const Backdrop = (props) => {
|
|
|
307
311
|
return (reactDom.createPortal(React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
308
312
|
};
|
|
309
313
|
|
|
310
|
-
var css_248z$
|
|
311
|
-
var styles$
|
|
312
|
-
styleInject(css_248z$
|
|
314
|
+
var css_248z$S = ".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";
|
|
315
|
+
var styles$S = {"list":"List-module_list__gpZ41"};
|
|
316
|
+
styleInject(css_248z$S);
|
|
313
317
|
|
|
314
318
|
const List = (props) => {
|
|
315
319
|
const { children, className, isFlush } = props, rest = __rest(props, ["children", "className", "isFlush"]);
|
|
316
320
|
const getCssClasses = () => {
|
|
317
321
|
const cssClasses = [];
|
|
318
|
-
isFlush && cssClasses.push(styles$
|
|
319
|
-
cssClasses.push(styles$
|
|
322
|
+
isFlush && cssClasses.push(styles$S.flush);
|
|
323
|
+
cssClasses.push(styles$S.list);
|
|
320
324
|
className && cssClasses.push(className);
|
|
321
325
|
return cssClasses.filter(css => css).join(' ');
|
|
322
326
|
};
|
|
323
327
|
return (React__default["default"].createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
|
|
324
328
|
};
|
|
325
329
|
|
|
326
|
-
var css_248z$
|
|
327
|
-
var styles$
|
|
328
|
-
styleInject(css_248z$
|
|
330
|
+
var css_248z$R = ".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";
|
|
331
|
+
var styles$R = {"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"};
|
|
332
|
+
styleInject(css_248z$R);
|
|
329
333
|
|
|
330
334
|
const ListItem = (props) => {
|
|
331
335
|
const { children, color, active, className, disabled, onClick } = props, rest = __rest(props, ["children", "color", "active", "className", "disabled", "onClick"]);
|
|
332
336
|
const getCssClasses = () => {
|
|
333
337
|
const cssClasses = [];
|
|
334
|
-
cssClasses.push(styles$
|
|
335
|
-
color && cssClasses.push(styles$
|
|
336
|
-
active && cssClasses.push(styles$
|
|
337
|
-
disabled && cssClasses.push(styles$
|
|
338
|
+
cssClasses.push(styles$R.listItem);
|
|
339
|
+
color && cssClasses.push(styles$R[color]);
|
|
340
|
+
active && cssClasses.push(styles$R['active']);
|
|
341
|
+
disabled && cssClasses.push(styles$R['disabled']);
|
|
338
342
|
className && cssClasses.push(className);
|
|
339
343
|
return cssClasses.filter(css => css).join(' ');
|
|
340
344
|
};
|
|
@@ -344,42 +348,42 @@ const ListItem = (props) => {
|
|
|
344
348
|
return (React__default["default"].createElement("li", Object.assign({ onClick: handleClick, className: getCssClasses() }, rest), children));
|
|
345
349
|
};
|
|
346
350
|
|
|
347
|
-
var css_248z$
|
|
348
|
-
var styles$
|
|
349
|
-
styleInject(css_248z$
|
|
351
|
+
var css_248z$Q = ".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";
|
|
352
|
+
var styles$Q = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
|
|
353
|
+
styleInject(css_248z$Q);
|
|
350
354
|
|
|
351
355
|
const ListItemAvatar = (_a) => {
|
|
352
356
|
var { avatar } = _a, rest = __rest(_a, ["avatar"]);
|
|
353
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
357
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$Q.avatar }, rest), avatar));
|
|
354
358
|
};
|
|
355
359
|
|
|
356
|
-
var css_248z$
|
|
357
|
-
var styles$
|
|
358
|
-
styleInject(css_248z$
|
|
360
|
+
var css_248z$P = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px; }\n .ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px; }\n";
|
|
361
|
+
var styles$P = {"icon":"ListItemIcon-module_icon__cCvEv"};
|
|
362
|
+
styleInject(css_248z$P);
|
|
359
363
|
|
|
360
364
|
const ListItemIcon = (_a) => {
|
|
361
365
|
var { icon } = _a, rest = __rest(_a, ["icon"]);
|
|
362
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
366
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$P.icon }, rest), icon));
|
|
363
367
|
};
|
|
364
368
|
|
|
365
|
-
var css_248z$
|
|
366
|
-
var styles$
|
|
367
|
-
styleInject(css_248z$
|
|
369
|
+
var css_248z$O = ".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";
|
|
370
|
+
var styles$O = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
|
|
371
|
+
styleInject(css_248z$O);
|
|
368
372
|
|
|
369
373
|
const ListItemAction = (_a) => {
|
|
370
374
|
var { children, onClick } = _a, rest = __rest(_a, ["children", "onClick"]);
|
|
371
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
375
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$O.listItemAction, onClick: e => onClick && onClick(e) }, rest), children));
|
|
372
376
|
};
|
|
373
377
|
|
|
374
|
-
var css_248z$
|
|
375
|
-
var styles$
|
|
376
|
-
styleInject(css_248z$
|
|
378
|
+
var css_248z$N = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1; }\n";
|
|
379
|
+
var styles$N = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
380
|
+
styleInject(css_248z$N);
|
|
377
381
|
|
|
378
382
|
const ListItemText = (_a) => {
|
|
379
383
|
var { primary, secondary } = _a, rest = __rest(_a, ["primary", "secondary"]);
|
|
380
384
|
const getCssClasses = () => {
|
|
381
385
|
const cssClasses = [];
|
|
382
|
-
cssClasses.push(styles$
|
|
386
|
+
cssClasses.push(styles$N.listItemText);
|
|
383
387
|
return cssClasses.filter(css => css).join(' ');
|
|
384
388
|
};
|
|
385
389
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -390,9 +394,9 @@ const ListItemText = (_a) => {
|
|
|
390
394
|
const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
|
|
391
395
|
const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
392
396
|
|
|
393
|
-
var css_248z$
|
|
394
|
-
var styles$
|
|
395
|
-
styleInject(css_248z$
|
|
397
|
+
var css_248z$M = ".AutoComplete-module_selectContainer__1kA85 {\n position: relative; }\n\n.AutoComplete-module_select__NNYOi {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .AutoComplete-module_select__NNYOi:hover {\n cursor: pointer; }\n\n.AutoComplete-module_selectMenu__Gu81L {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 38px;\n z-index: 1050;\n max-height: 280px;\n overflow: auto; }\n";
|
|
398
|
+
var styles$M = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
399
|
+
styleInject(css_248z$M);
|
|
396
400
|
|
|
397
401
|
// preset value
|
|
398
402
|
// enter -> delay? -> show results
|
|
@@ -448,7 +452,7 @@ const AutoComplete = (props) => {
|
|
|
448
452
|
const getCssClass = () => {
|
|
449
453
|
const cssClasses = [];
|
|
450
454
|
className && cssClasses.push(className);
|
|
451
|
-
cssClasses.push(styles$
|
|
455
|
+
cssClasses.push(styles$M.select);
|
|
452
456
|
return cssClasses.filter(r => r).join(' ');
|
|
453
457
|
};
|
|
454
458
|
const show = () => setIsShow(true);
|
|
@@ -472,35 +476,35 @@ const AutoComplete = (props) => {
|
|
|
472
476
|
setModel('');
|
|
473
477
|
setSearchText('');
|
|
474
478
|
};
|
|
475
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
479
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$M.selectContainer },
|
|
476
480
|
React__default["default"].createElement("div", { className: "d-flex" },
|
|
477
481
|
React__default["default"].createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, placeholder: placeholder, value: model }),
|
|
478
482
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
479
483
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
480
484
|
isShow &&
|
|
481
485
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
482
|
-
React__default["default"].createElement("div", { className: styles$
|
|
486
|
+
React__default["default"].createElement("div", { className: styles$M.selectMenu },
|
|
483
487
|
React__default["default"].createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), disabled: !option.value },
|
|
484
488
|
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
485
489
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
486
490
|
};
|
|
487
491
|
|
|
488
|
-
var css_248z$
|
|
489
|
-
var styles$
|
|
490
|
-
styleInject(css_248z$
|
|
492
|
+
var css_248z$L = ".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";
|
|
493
|
+
var styles$L = {"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"};
|
|
494
|
+
styleInject(css_248z$L);
|
|
491
495
|
|
|
492
496
|
const Badge = (props) => {
|
|
493
497
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
494
498
|
const getCssClassesBadgeContainer = () => {
|
|
495
499
|
const cssClasses = [];
|
|
496
|
-
cssClasses.push(styles$
|
|
500
|
+
cssClasses.push(styles$L.badgeContainer);
|
|
497
501
|
className && cssClasses.push(className);
|
|
498
502
|
return cssClasses.filter(css => css).join(' ');
|
|
499
503
|
};
|
|
500
504
|
const getCssClassesBadge = () => {
|
|
501
505
|
const cssClasses = [];
|
|
502
|
-
cssClasses.push(styles$
|
|
503
|
-
cssClasses.push(styles$
|
|
506
|
+
cssClasses.push(styles$L.badge);
|
|
507
|
+
cssClasses.push(styles$L[color]);
|
|
504
508
|
return cssClasses.filter(css => css).join(' ');
|
|
505
509
|
};
|
|
506
510
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -508,26 +512,26 @@ const Badge = (props) => {
|
|
|
508
512
|
React__default["default"].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
509
513
|
};
|
|
510
514
|
|
|
511
|
-
var css_248z$
|
|
512
|
-
var styles$
|
|
513
|
-
styleInject(css_248z$
|
|
515
|
+
var css_248z$K = ".Button-module_button__qeIer {\n text-transform: uppercase !important;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius); }\n .Button-module_button__qeIer.Button-module_shadow__6N2nE {\n box-shadow: var(--shadow); }\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover {\n background-color: var(--primary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover {\n background-color: var(--accent-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover {\n background-color: var(--secondary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover {\n background-color: var(--light-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover {\n background-color: var(--dark-dark); }\n\n.Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed; }\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary) !important; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover {\n text-decoration: none;\n background: var(--light-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important; }\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary) !important;\n border-color: var(--primary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover {\n background: var(--primary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover {\n background: var(--secondary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent) !important;\n border-color: var(--accent) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover {\n background: var(--accent-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover {\n background: var(--light-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark) !important;\n border-color: var(--dark) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover {\n background: var(--dark-highlight) !important; }\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px; }\n";
|
|
516
|
+
var styles$K = {"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"};
|
|
517
|
+
styleInject(css_248z$K);
|
|
514
518
|
|
|
515
519
|
const Button = (props) => {
|
|
516
|
-
const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon"]);
|
|
520
|
+
const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon, shadow = true } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon", "shadow"]);
|
|
517
521
|
const getCssClasses = () => {
|
|
518
522
|
const cssClasses = [];
|
|
519
|
-
cssClasses.push(styles$
|
|
523
|
+
cssClasses.push(styles$K.button);
|
|
520
524
|
if (variant !== 'outline' && variant !== 'text') {
|
|
521
|
-
cssClasses.push(styles$
|
|
522
|
-
cssClasses.push(styles$
|
|
525
|
+
cssClasses.push(styles$K.btnContained);
|
|
526
|
+
cssClasses.push(styles$K[color]);
|
|
523
527
|
}
|
|
524
528
|
if (variant === 'outline') {
|
|
525
|
-
cssClasses.push(styles$
|
|
526
|
-
cssClasses.push(styles$
|
|
529
|
+
cssClasses.push(styles$K.btnOutline);
|
|
530
|
+
cssClasses.push(styles$K[color]);
|
|
527
531
|
}
|
|
528
532
|
if (variant === 'text') {
|
|
529
|
-
cssClasses.push(styles$
|
|
530
|
-
cssClasses.push(styles$
|
|
533
|
+
cssClasses.push(styles$K.btnText);
|
|
534
|
+
cssClasses.push(styles$K[color]);
|
|
531
535
|
}
|
|
532
536
|
if (isRounded && variant !== 'text') {
|
|
533
537
|
cssClasses.push(`rounded-pill`);
|
|
@@ -535,42 +539,43 @@ const Button = (props) => {
|
|
|
535
539
|
if (isActive) {
|
|
536
540
|
cssClasses.push('active');
|
|
537
541
|
}
|
|
542
|
+
shadow && cssClasses.push(styles$K.shadow);
|
|
538
543
|
className && cssClasses.push(className);
|
|
539
544
|
return cssClasses.filter(css => css).join(' ');
|
|
540
545
|
};
|
|
541
546
|
return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
542
547
|
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
543
548
|
startIcon &&
|
|
544
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
549
|
+
React__default["default"].createElement(Icon, { className: styles$K.startIcon }, startIcon),
|
|
545
550
|
children,
|
|
546
551
|
endIcon &&
|
|
547
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
552
|
+
React__default["default"].createElement(Icon, { className: styles$K.endIcon }, endIcon))));
|
|
548
553
|
};
|
|
549
554
|
|
|
550
|
-
var css_248z$
|
|
551
|
-
var styles$
|
|
552
|
-
styleInject(css_248z$
|
|
555
|
+
var css_248z$J = ".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";
|
|
556
|
+
var styles$J = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
557
|
+
styleInject(css_248z$J);
|
|
553
558
|
|
|
554
559
|
const ButtonGroup = (props) => {
|
|
555
560
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
556
561
|
const getCssClasses = () => {
|
|
557
562
|
const cssClasses = [];
|
|
558
|
-
cssClasses.push(styles$
|
|
563
|
+
cssClasses.push(styles$J.buttonGroup);
|
|
559
564
|
className && cssClasses.push(className);
|
|
560
565
|
return cssClasses.filter(css => css).join(' ');
|
|
561
566
|
};
|
|
562
567
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
563
568
|
};
|
|
564
569
|
|
|
565
|
-
var css_248z$
|
|
566
|
-
var styles$
|
|
567
|
-
styleInject(css_248z$
|
|
570
|
+
var css_248z$I = ".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";
|
|
571
|
+
var styles$I = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
|
|
572
|
+
styleInject(css_248z$I);
|
|
568
573
|
|
|
569
574
|
const Breadcrumb = (props) => {
|
|
570
575
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
571
576
|
const getCssClasses = () => {
|
|
572
577
|
const cssClasses = [];
|
|
573
|
-
cssClasses.push(styles$
|
|
578
|
+
cssClasses.push(styles$I.breadcrumb);
|
|
574
579
|
className && cssClasses.push(className);
|
|
575
580
|
return cssClasses.filter(css => css).join(' ');
|
|
576
581
|
};
|
|
@@ -580,15 +585,15 @@ const Breadcrumb = (props) => {
|
|
|
580
585
|
|
|
581
586
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
582
587
|
|
|
583
|
-
var css_248z$
|
|
584
|
-
var styles$
|
|
585
|
-
styleInject(css_248z$
|
|
588
|
+
var css_248z$H = ".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";
|
|
589
|
+
var styles$H = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
|
|
590
|
+
styleInject(css_248z$H);
|
|
586
591
|
|
|
587
592
|
const BreadcrumbItem = (props) => {
|
|
588
593
|
const { children, className, isActive, onClick } = props;
|
|
589
594
|
const getCssClasses = () => {
|
|
590
595
|
const cssClasses = [];
|
|
591
|
-
cssClasses.push(styles$
|
|
596
|
+
cssClasses.push(styles$H.breadcrumbItem);
|
|
592
597
|
className && cssClasses.push(className);
|
|
593
598
|
isActive && cssClasses.push('active');
|
|
594
599
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -600,115 +605,115 @@ const BreadcrumbItem = (props) => {
|
|
|
600
605
|
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
601
606
|
};
|
|
602
607
|
|
|
603
|
-
var css_248z$
|
|
604
|
-
var styles$
|
|
605
|
-
styleInject(css_248z$
|
|
608
|
+
var css_248z$G = ".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";
|
|
609
|
+
var styles$G = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
|
|
610
|
+
styleInject(css_248z$G);
|
|
606
611
|
|
|
607
612
|
const Card = (props) => {
|
|
608
613
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
609
614
|
const getCssClasses = () => {
|
|
610
615
|
const cssClasses = [];
|
|
611
|
-
cssClasses.push(styles$
|
|
612
|
-
shadow && cssClasses.push(styles$
|
|
616
|
+
cssClasses.push(styles$G.card);
|
|
617
|
+
shadow && cssClasses.push(styles$G.shadow);
|
|
613
618
|
className && cssClasses.push(className);
|
|
614
619
|
return cssClasses.filter(css => css).join(' ');
|
|
615
620
|
};
|
|
616
621
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
617
622
|
};
|
|
618
623
|
|
|
619
|
-
var css_248z$
|
|
620
|
-
var styles$
|
|
621
|
-
styleInject(css_248z$
|
|
624
|
+
var css_248z$F = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
|
|
625
|
+
var styles$F = {"cardBody":"CardBody-module_cardBody__X52VY"};
|
|
626
|
+
styleInject(css_248z$F);
|
|
622
627
|
|
|
623
628
|
const CardBody = (props) => {
|
|
624
629
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
625
630
|
const getCssClasses = () => {
|
|
626
631
|
const cssClasses = [];
|
|
627
|
-
cssClasses.push(styles$
|
|
632
|
+
cssClasses.push(styles$F.cardBody);
|
|
628
633
|
className && cssClasses.push(className);
|
|
629
634
|
return cssClasses.filter(css => css).join(' ');
|
|
630
635
|
};
|
|
631
636
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
632
637
|
};
|
|
633
638
|
|
|
634
|
-
var css_248z$
|
|
635
|
-
var styles$
|
|
636
|
-
styleInject(css_248z$
|
|
639
|
+
var css_248z$E = ".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";
|
|
640
|
+
var styles$E = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
|
|
641
|
+
styleInject(css_248z$E);
|
|
637
642
|
|
|
638
643
|
const CardFooter = (props) => {
|
|
639
644
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
640
645
|
const getCssClasses = () => {
|
|
641
646
|
const cssClasses = [];
|
|
642
|
-
cssClasses.push(styles$
|
|
647
|
+
cssClasses.push(styles$E.cardFooter);
|
|
643
648
|
className && cssClasses.push(className);
|
|
644
649
|
return cssClasses.filter(css => css).join(' ');
|
|
645
650
|
};
|
|
646
651
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
647
652
|
};
|
|
648
653
|
|
|
649
|
-
var css_248z$
|
|
650
|
-
var styles$
|
|
651
|
-
styleInject(css_248z$
|
|
654
|
+
var css_248z$D = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important; }\n";
|
|
655
|
+
var styles$D = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
|
|
656
|
+
styleInject(css_248z$D);
|
|
652
657
|
|
|
653
658
|
const CardSubtitle = (props) => {
|
|
654
659
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
655
660
|
const getCssClasses = () => {
|
|
656
661
|
const cssClasses = [];
|
|
657
|
-
cssClasses.push(styles$
|
|
662
|
+
cssClasses.push(styles$D.cardSubtitle);
|
|
658
663
|
className && cssClasses.push(className);
|
|
659
664
|
return cssClasses.filter(css => css).join(' ');
|
|
660
665
|
};
|
|
661
666
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
662
667
|
};
|
|
663
668
|
|
|
664
|
-
var css_248z$
|
|
665
|
-
var styles$
|
|
666
|
-
styleInject(css_248z$
|
|
669
|
+
var css_248z$C = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0; }\n";
|
|
670
|
+
var styles$C = {"cardText":"CardText-module_cardText__UtYd9"};
|
|
671
|
+
styleInject(css_248z$C);
|
|
667
672
|
|
|
668
673
|
const CardText = (props) => {
|
|
669
674
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
670
675
|
const getCssClasses = () => {
|
|
671
676
|
const cssClasses = [];
|
|
672
|
-
cssClasses.push(styles$
|
|
677
|
+
cssClasses.push(styles$C.cardText);
|
|
673
678
|
className && cssClasses.push(className);
|
|
674
679
|
return cssClasses.filter(css => css).join(' ');
|
|
675
680
|
};
|
|
676
681
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
677
682
|
};
|
|
678
683
|
|
|
679
|
-
var css_248z$
|
|
680
|
-
var styles$
|
|
681
|
-
styleInject(css_248z$
|
|
684
|
+
var css_248z$B = ".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";
|
|
685
|
+
var styles$B = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
|
|
686
|
+
styleInject(css_248z$B);
|
|
682
687
|
|
|
683
688
|
const CardTitle = (props) => {
|
|
684
689
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
685
690
|
const getCssClasses = () => {
|
|
686
691
|
const cssClasses = [];
|
|
687
|
-
cssClasses.push(styles$
|
|
692
|
+
cssClasses.push(styles$B.cardTitle);
|
|
688
693
|
className && cssClasses.push(className);
|
|
689
694
|
return cssClasses.filter(css => css).join(' ');
|
|
690
695
|
};
|
|
691
696
|
return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
692
697
|
};
|
|
693
698
|
|
|
694
|
-
var css_248z$
|
|
695
|
-
var styles$
|
|
696
|
-
styleInject(css_248z$
|
|
699
|
+
var css_248z$A = ".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";
|
|
700
|
+
var styles$A = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
|
|
701
|
+
styleInject(css_248z$A);
|
|
697
702
|
|
|
698
703
|
const CardImage = (props) => {
|
|
699
704
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
700
705
|
const getCssClasses = () => {
|
|
701
706
|
const cssClasses = [];
|
|
702
|
-
cssClasses.push(styles$
|
|
707
|
+
cssClasses.push(styles$A.cardImage);
|
|
703
708
|
className && cssClasses.push(className);
|
|
704
709
|
return cssClasses.filter(css => css).join(' ');
|
|
705
710
|
};
|
|
706
711
|
return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
707
712
|
};
|
|
708
713
|
|
|
709
|
-
var css_248z$
|
|
710
|
-
var styles$
|
|
711
|
-
styleInject(css_248z$
|
|
714
|
+
var css_248z$z = ".Checkbox-module_checkboxContainer__x2GCi {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Checkbox-module_checkboxContainer__x2GCi label {\n margin-bottom: 0;\n margin-left: 0; }\n .Checkbox-module_checkboxContainer__x2GCi label:hover {\n cursor: pointer; }\n\n.Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed; }\n";
|
|
715
|
+
var styles$z = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
|
|
716
|
+
styleInject(css_248z$z);
|
|
712
717
|
|
|
713
718
|
const Checkbox = (props) => {
|
|
714
719
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -745,24 +750,24 @@ const Checkbox = (props) => {
|
|
|
745
750
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
746
751
|
}
|
|
747
752
|
};
|
|
748
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
753
|
+
return (React__default["default"].createElement("div", { className: styles$z.checkboxContainer },
|
|
749
754
|
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
750
|
-
React__default["default"].createElement("label", { onClick: handleClick, className: styles$
|
|
755
|
+
React__default["default"].createElement("label", { onClick: handleClick, className: styles$z.checkboxLabel + ' ' + (disabled ? styles$z['disabled'] : undefined) }, label),
|
|
751
756
|
React__default["default"].createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
752
757
|
};
|
|
753
758
|
|
|
754
|
-
var css_248z$
|
|
755
|
-
var styles$
|
|
756
|
-
styleInject(css_248z$
|
|
759
|
+
var css_248z$y = ".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$y = {"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$y);
|
|
757
762
|
|
|
758
763
|
const Chip = (props) => {
|
|
759
764
|
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default["default"].createElement(TimesCircleSolidIcon, null), style } = props, rest = __rest(props, ["children", "color", "className", "shadow", "onClick", "isDeletable", "onDelete", "deleteIcon", "style"]);
|
|
760
765
|
const getCssClass = () => {
|
|
761
766
|
const cssClasses = [];
|
|
762
|
-
cssClasses.push(styles$
|
|
763
|
-
cssClasses.push(styles$
|
|
764
|
-
shadow && cssClasses.push(styles$
|
|
765
|
-
onClick && cssClasses.push(styles$
|
|
767
|
+
cssClasses.push(styles$y.chip);
|
|
768
|
+
cssClasses.push(styles$y[color]);
|
|
769
|
+
shadow && cssClasses.push(styles$y['shadow']);
|
|
770
|
+
onClick && cssClasses.push(styles$y['clickable']);
|
|
766
771
|
className && cssClasses.push(className);
|
|
767
772
|
return cssClasses.filter(r => r).join(' ');
|
|
768
773
|
};
|
|
@@ -772,18 +777,18 @@ const Chip = (props) => {
|
|
|
772
777
|
};
|
|
773
778
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
774
779
|
React__default["default"].createElement("div", null, children),
|
|
775
|
-
isDeletable && (React__default["default"].createElement("div", { className: styles$
|
|
780
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$y.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
776
781
|
};
|
|
777
782
|
|
|
778
|
-
var css_248z$
|
|
779
|
-
var styles$
|
|
780
|
-
styleInject(css_248z$
|
|
783
|
+
var css_248z$x = ".FormLabel-module_formLabel__TXcHc {\n margin-bottom: .5rem; }\n";
|
|
784
|
+
var styles$x = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
785
|
+
styleInject(css_248z$x);
|
|
781
786
|
|
|
782
787
|
const FormLabel = (_a) => {
|
|
783
788
|
var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
|
|
784
789
|
const getCssClasses = () => {
|
|
785
790
|
const cssClasses = [];
|
|
786
|
-
cssClasses.push(styles$
|
|
791
|
+
cssClasses.push(styles$x.formLabel);
|
|
787
792
|
className && cssClasses.push(className);
|
|
788
793
|
return cssClasses.filter(css => css).join(' ');
|
|
789
794
|
};
|
|
@@ -820,9 +825,9 @@ const FileInput = (props) => {
|
|
|
820
825
|
React__default["default"].createElement("input", Object.assign({ type: "file", ref: inputFileElement, className: getCssClasses(), id: id, name: name, multiple: multiple, accept: accept, disabled: disabled, readOnly: readOnly, hidden: true, onChange: handleOnChange, value: model }, rest))));
|
|
821
826
|
};
|
|
822
827
|
|
|
823
|
-
var css_248z$
|
|
824
|
-
var styles$
|
|
825
|
-
styleInject(css_248z$
|
|
828
|
+
var css_248z$w = ".Select-module_selectContainer__DHFDZ {\n position: relative; }\n\n.Select-module_select__Fbn38 {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .Select-module_select__Fbn38:hover {\n cursor: pointer; }\n\n.Select-module_selectMenu__8y4kQ {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 2px;\n z-index: 1112;\n max-height: 280px;\n overflow: auto; }\n";
|
|
829
|
+
var styles$w = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","selectMenu":"Select-module_selectMenu__8y4kQ"};
|
|
830
|
+
styleInject(css_248z$w);
|
|
826
831
|
|
|
827
832
|
const Select = (props) => {
|
|
828
833
|
var _a, _b, _c;
|
|
@@ -835,7 +840,7 @@ const Select = (props) => {
|
|
|
835
840
|
const getCssClass = () => {
|
|
836
841
|
const cssClasses = [];
|
|
837
842
|
className && cssClasses.push(className);
|
|
838
|
-
cssClasses.push(styles$
|
|
843
|
+
cssClasses.push(styles$w.select);
|
|
839
844
|
return cssClasses.filter(r => r).join(' ');
|
|
840
845
|
};
|
|
841
846
|
React.useEffect(() => {
|
|
@@ -953,7 +958,7 @@ const Select = (props) => {
|
|
|
953
958
|
}
|
|
954
959
|
}
|
|
955
960
|
};
|
|
956
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
961
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$w.selectContainer },
|
|
957
962
|
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
958
963
|
!multiple && renderSingleViewModel(),
|
|
959
964
|
multiple && renderMultipleViewModel(),
|
|
@@ -961,7 +966,7 @@ const Select = (props) => {
|
|
|
961
966
|
React__default["default"].createElement(ChevronDownSolidIcon, null))),
|
|
962
967
|
isShow &&
|
|
963
968
|
reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
964
|
-
React__default["default"].createElement("div", { className: styles$
|
|
969
|
+
React__default["default"].createElement("div", { className: styles$w.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 } },
|
|
965
970
|
React__default["default"].createElement(List, null, options && options.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), active: isActive(option) },
|
|
966
971
|
multiple &&
|
|
967
972
|
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -969,37 +974,39 @@ const Select = (props) => {
|
|
|
969
974
|
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
|
|
970
975
|
};
|
|
971
976
|
|
|
972
|
-
var css_248z$
|
|
973
|
-
var styles$
|
|
974
|
-
styleInject(css_248z$
|
|
977
|
+
var css_248z$v = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical; }\n textarea:focus {\n outline: none !important;\n border-color: var(--primary); }\n";
|
|
978
|
+
var styles$v = {};
|
|
979
|
+
styleInject(css_248z$v);
|
|
975
980
|
|
|
976
981
|
const Textarea = (props) => {
|
|
977
982
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
978
983
|
const getCssClass = () => {
|
|
979
984
|
const cssClasses = [];
|
|
980
|
-
cssClasses.push(styles$
|
|
985
|
+
cssClasses.push(styles$v.textarea);
|
|
981
986
|
className && cssClasses.push(className);
|
|
982
987
|
return cssClasses.filter(r => r).join(' ');
|
|
983
988
|
};
|
|
984
989
|
return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
985
990
|
};
|
|
986
991
|
|
|
987
|
-
var css_248z$
|
|
988
|
-
var styles$
|
|
989
|
-
styleInject(css_248z$
|
|
992
|
+
var css_248z$u = ".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";
|
|
993
|
+
var styles$u = {"formInput":"FormInput-module_formInput__VXZip"};
|
|
994
|
+
styleInject(css_248z$u);
|
|
990
995
|
|
|
991
996
|
const FormInput = (props) => {
|
|
992
997
|
const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
993
998
|
const getCssClasses = () => {
|
|
994
999
|
const cssClasses = [];
|
|
995
|
-
cssClasses.push(styles$
|
|
1000
|
+
cssClasses.push(styles$u.formInput);
|
|
996
1001
|
className && cssClasses.push(className);
|
|
997
1002
|
!isValid && cssClasses.push('is-invalid');
|
|
998
1003
|
return cssClasses.filter(css => css).join(' ');
|
|
999
1004
|
};
|
|
1005
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1000
1006
|
const handleOnInput = (value, type, name) => {
|
|
1001
1007
|
onInput && onInput({ value, type, name });
|
|
1002
1008
|
};
|
|
1009
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1003
1010
|
const handleOnChange = (value, type, name) => {
|
|
1004
1011
|
onChange && onChange({ value, type, name });
|
|
1005
1012
|
};
|
|
@@ -1025,9 +1032,7 @@ const FormInput = (props) => {
|
|
|
1025
1032
|
type === 'autocomplete' &&
|
|
1026
1033
|
React__default["default"].createElement(AutoComplete, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, openOnFocus: autoCompleteOptions === null || autoCompleteOptions === void 0 ? void 0 : autoCompleteOptions.openOnFocus, onChange: e => handleOnChange(e, type, name), options: options }),
|
|
1027
1034
|
type === 'checkbox' &&
|
|
1028
|
-
React__default["default"].createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''),
|
|
1029
|
-
// onChange={e => handleOnChange((e?.target as HTMLInputElement).checked, type, name as string)}
|
|
1030
|
-
checked: value === 'true' ? true : false }),
|
|
1035
|
+
React__default["default"].createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).checked, type, name), checked: value }),
|
|
1031
1036
|
type === 'radio' &&
|
|
1032
1037
|
React__default["default"].createElement(React__default["default"].Fragment, null, options.map((option) => React__default["default"].createElement("div", { className: "form-check", key: option.id },
|
|
1033
1038
|
React__default["default"].createElement("input", { id: option.id ? option.id : option.value, name: name, type: "radio", className: "form-check-input", onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), value: option.value, checked: value === option.value, onKeyDown: onKeyDown }),
|
|
@@ -1362,16 +1367,16 @@ const DateSelect = (props) => {
|
|
|
1362
1367
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1363
1368
|
// };
|
|
1364
1369
|
|
|
1365
|
-
var css_248z$
|
|
1366
|
-
var styles$
|
|
1367
|
-
styleInject(css_248z$
|
|
1370
|
+
var css_248z$t = ".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";
|
|
1371
|
+
var styles$t = {"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"};
|
|
1372
|
+
styleInject(css_248z$t);
|
|
1368
1373
|
|
|
1369
1374
|
const Drawer = (props) => {
|
|
1370
1375
|
const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop } = props, rest = __rest(props, ["children", "className", "position", "permanent", "target", "shadow", "onClickBackdrop"]);
|
|
1371
1376
|
React.useEffect(() => {
|
|
1372
|
-
document.body.classList.add(styles$
|
|
1377
|
+
document.body.classList.add(styles$t.drawerOpen);
|
|
1373
1378
|
return () => {
|
|
1374
|
-
document.body.classList.remove(styles$
|
|
1379
|
+
document.body.classList.remove(styles$t.drawerOpen);
|
|
1375
1380
|
};
|
|
1376
1381
|
}, []);
|
|
1377
1382
|
const handleClickBackdrop = () => {
|
|
@@ -1385,10 +1390,10 @@ const DrawerContent = (props) => {
|
|
|
1385
1390
|
const { children, className, position = 'left', permanent = false, shadow } = props, rest = __rest(props, ["children", "className", "position", "permanent", "shadow"]);
|
|
1386
1391
|
const getCssClasses = () => {
|
|
1387
1392
|
const cssClasses = [];
|
|
1388
|
-
cssClasses.push(styles$
|
|
1389
|
-
shadow && cssClasses.push(styles$
|
|
1390
|
-
!!permanent && cssClasses.push(styles$
|
|
1391
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1393
|
+
cssClasses.push(styles$t.drawer);
|
|
1394
|
+
shadow && cssClasses.push(styles$t.shadow);
|
|
1395
|
+
!!permanent && cssClasses.push(styles$t['permanent']);
|
|
1396
|
+
position === 'left' ? cssClasses.push(styles$t['left']) : cssClasses.push(styles$t['right']);
|
|
1392
1397
|
className && cssClasses.push(className);
|
|
1393
1398
|
return cssClasses.filter(css => css).join(' ');
|
|
1394
1399
|
};
|
|
@@ -1402,9 +1407,9 @@ const DrawerContent = (props) => {
|
|
|
1402
1407
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), style: getStyles() }, rest), children));
|
|
1403
1408
|
};
|
|
1404
1409
|
|
|
1405
|
-
var css_248z$
|
|
1406
|
-
var styles$
|
|
1407
|
-
styleInject(css_248z$
|
|
1410
|
+
var css_248z$s = ".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";
|
|
1411
|
+
var styles$s = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
|
|
1412
|
+
styleInject(css_248z$s);
|
|
1408
1413
|
|
|
1409
1414
|
const MenuBody = (props) => {
|
|
1410
1415
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1435,8 +1440,8 @@ const MenuBody = (props) => {
|
|
|
1435
1440
|
}, [menuBodyRef]);
|
|
1436
1441
|
const getCssClasses = () => {
|
|
1437
1442
|
const cssClasses = [];
|
|
1438
|
-
cssClasses.push(styles$
|
|
1439
|
-
shadow && cssClasses.push(styles$
|
|
1443
|
+
cssClasses.push(styles$s.menuBody);
|
|
1444
|
+
shadow && cssClasses.push(styles$s.shadow);
|
|
1440
1445
|
className && cssClasses.push(className);
|
|
1441
1446
|
return cssClasses.filter(css => css).join(' ');
|
|
1442
1447
|
};
|
|
@@ -1448,9 +1453,9 @@ const MenuBody = (props) => {
|
|
|
1448
1453
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1449
1454
|
};
|
|
1450
1455
|
|
|
1451
|
-
var css_248z$
|
|
1452
|
-
var styles$
|
|
1453
|
-
styleInject(css_248z$
|
|
1456
|
+
var css_248z$r = ".Menu-module_menu__p8QL- {\n display: flex; }\n";
|
|
1457
|
+
var styles$r = {"menu":"Menu-module_menu__p8QL-"};
|
|
1458
|
+
styleInject(css_248z$r);
|
|
1454
1459
|
|
|
1455
1460
|
const Menu = (props) => {
|
|
1456
1461
|
const { toggle, children, className, open, menuPosition, onClickBackdrop } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop"]);
|
|
@@ -1458,7 +1463,7 @@ const Menu = (props) => {
|
|
|
1458
1463
|
const toggleContainerRef = React.useRef(null);
|
|
1459
1464
|
const getCssClasses = () => {
|
|
1460
1465
|
const cssClasses = [];
|
|
1461
|
-
cssClasses.push(styles$
|
|
1466
|
+
cssClasses.push(styles$r.menu);
|
|
1462
1467
|
className && cssClasses.push(className);
|
|
1463
1468
|
return cssClasses.filter(css => css).join(' ');
|
|
1464
1469
|
};
|
|
@@ -1471,17 +1476,17 @@ const Menu = (props) => {
|
|
|
1471
1476
|
React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1472
1477
|
};
|
|
1473
1478
|
|
|
1474
|
-
var css_248z$
|
|
1475
|
-
var styles$
|
|
1476
|
-
styleInject(css_248z$
|
|
1479
|
+
var css_248z$q = ".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";
|
|
1480
|
+
var styles$q = {"menuItem":"MenuItem-module_menuItem__MeBxN","menuItemHeader":"MenuItem-module_menuItemHeader__2l732"};
|
|
1481
|
+
styleInject(css_248z$q);
|
|
1477
1482
|
|
|
1478
1483
|
const MenuItem = (props) => {
|
|
1479
1484
|
const { children, onClick, type = 'item' } = props;
|
|
1480
1485
|
const getCssClasses = () => {
|
|
1481
1486
|
const cssClasses = [];
|
|
1482
|
-
cssClasses.push(styles$
|
|
1487
|
+
cssClasses.push(styles$q.menuItem);
|
|
1483
1488
|
if (type === 'header') {
|
|
1484
|
-
cssClasses.push(styles$
|
|
1489
|
+
cssClasses.push(styles$q.menuItemHeader);
|
|
1485
1490
|
}
|
|
1486
1491
|
return cssClasses.filter(css => css).join(' ');
|
|
1487
1492
|
};
|
|
@@ -1497,23 +1502,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1497
1502
|
return (React__default["default"].createElement(React.Fragment, null, children));
|
|
1498
1503
|
};
|
|
1499
1504
|
|
|
1500
|
-
var css_248z$
|
|
1501
|
-
var styles$
|
|
1502
|
-
styleInject(css_248z$
|
|
1505
|
+
var css_248z$p = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef; }\n";
|
|
1506
|
+
var styles$p = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
|
|
1507
|
+
styleInject(css_248z$p);
|
|
1503
1508
|
|
|
1504
|
-
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$
|
|
1509
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$p.menuItemDivider });
|
|
1505
1510
|
|
|
1506
|
-
var css_248z$
|
|
1507
|
-
var styles$
|
|
1508
|
-
styleInject(css_248z$
|
|
1511
|
+
var css_248z$o = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px; }\n";
|
|
1512
|
+
var styles$o = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
|
|
1513
|
+
styleInject(css_248z$o);
|
|
1509
1514
|
|
|
1510
1515
|
const ExpansionPanelContent = ({ children }) => {
|
|
1511
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1516
|
+
return (React__default["default"].createElement("div", { className: styles$o.expansionPanelContent }, children));
|
|
1512
1517
|
};
|
|
1513
1518
|
|
|
1514
|
-
var css_248z$
|
|
1515
|
-
var styles$
|
|
1516
|
-
styleInject(css_248z$
|
|
1519
|
+
var css_248z$n = ".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";
|
|
1520
|
+
var styles$n = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
|
|
1521
|
+
styleInject(css_248z$n);
|
|
1517
1522
|
|
|
1518
1523
|
const ExpansionPanelHeader = (props) => {
|
|
1519
1524
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1521,15 +1526,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1521
1526
|
e.stopPropagation();
|
|
1522
1527
|
onClick && onClick(e);
|
|
1523
1528
|
};
|
|
1524
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1529
|
+
return (React__default["default"].createElement("div", { className: styles$n.expansionPanelHeader, onClick: handleClick },
|
|
1525
1530
|
children,
|
|
1526
1531
|
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1527
1532
|
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1528
1533
|
};
|
|
1529
1534
|
|
|
1530
|
-
var css_248z$
|
|
1531
|
-
var styles$
|
|
1532
|
-
styleInject(css_248z$
|
|
1535
|
+
var css_248z$m = ".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";
|
|
1536
|
+
var styles$m = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
|
|
1537
|
+
styleInject(css_248z$m);
|
|
1533
1538
|
|
|
1534
1539
|
const ExpansionPanel = (props) => {
|
|
1535
1540
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1539,9 +1544,9 @@ const ExpansionPanel = (props) => {
|
|
|
1539
1544
|
}, [isExpanded]);
|
|
1540
1545
|
const getCssClasses = () => {
|
|
1541
1546
|
const cssClasses = [];
|
|
1542
|
-
cssClasses.push(styles$
|
|
1547
|
+
cssClasses.push(styles$m.expansionPanel);
|
|
1543
1548
|
if (_isExpanded) {
|
|
1544
|
-
cssClasses.push(styles$
|
|
1549
|
+
cssClasses.push(styles$m.isExpanded);
|
|
1545
1550
|
}
|
|
1546
1551
|
return cssClasses.filter(css => css).join(' ');
|
|
1547
1552
|
};
|
|
@@ -1555,16 +1560,16 @@ const ExpansionPanel = (props) => {
|
|
|
1555
1560
|
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1556
1561
|
};
|
|
1557
1562
|
|
|
1558
|
-
var css_248z$
|
|
1559
|
-
var styles$
|
|
1560
|
-
styleInject(css_248z$
|
|
1563
|
+
var css_248z$l = ".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";
|
|
1564
|
+
var styles$l = {"fab":"FloatingActionButton-module_fab__Rw3kd","fixed":"FloatingActionButton-module_fixed__XQOkG"};
|
|
1565
|
+
styleInject(css_248z$l);
|
|
1561
1566
|
|
|
1562
1567
|
const FloatingActionButton = (props) => {
|
|
1563
1568
|
const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1564
1569
|
const getCssClasses = () => {
|
|
1565
1570
|
const cssClasses = [];
|
|
1566
|
-
cssClasses.push(styles$
|
|
1567
|
-
fixed && cssClasses.push(styles$
|
|
1571
|
+
cssClasses.push(styles$l.fab);
|
|
1572
|
+
fixed && cssClasses.push(styles$l['fixed']);
|
|
1568
1573
|
className && cssClasses.push(className);
|
|
1569
1574
|
return cssClasses.filter(css => css).join(' ');
|
|
1570
1575
|
};
|
|
@@ -1607,11 +1612,16 @@ const Row = (props) => {
|
|
|
1607
1612
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1608
1613
|
};
|
|
1609
1614
|
|
|
1615
|
+
var css_248z$k = ".Link-module_link__YlJQl {\n color: var(--primary);\n text-decoration: underline; }\n .Link-module_link__YlJQl:hover {\n color: var(--primary-dark); }\n";
|
|
1616
|
+
var styles$k = {"link":"Link-module_link__YlJQl"};
|
|
1617
|
+
styleInject(css_248z$k);
|
|
1618
|
+
|
|
1610
1619
|
const Link = (props) => {
|
|
1611
1620
|
const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
|
|
1612
1621
|
const [status, setStatus] = React.useState(STATUS.NORMAL);
|
|
1613
1622
|
const getCssClasses = () => {
|
|
1614
1623
|
const cssClasses = [];
|
|
1624
|
+
cssClasses.push(styles$k.link);
|
|
1615
1625
|
className && cssClasses.push(className);
|
|
1616
1626
|
status !== STATUS.NORMAL && cssClasses.push(status);
|
|
1617
1627
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -1625,15 +1635,15 @@ const Link = (props) => {
|
|
|
1625
1635
|
return (React__default["default"].createElement("a", Object.assign({ className: getCssClasses(), href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
|
|
1626
1636
|
};
|
|
1627
1637
|
|
|
1628
|
-
var css_248z$
|
|
1629
|
-
var styles$
|
|
1630
|
-
styleInject(css_248z$
|
|
1638
|
+
var css_248z$j = ".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";
|
|
1639
|
+
var styles$j = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
|
|
1640
|
+
styleInject(css_248z$j);
|
|
1631
1641
|
|
|
1632
1642
|
const LoadingIndicator = (_a) => {
|
|
1633
1643
|
var rest = __rest(_a, []);
|
|
1634
1644
|
const getCssClasses = () => {
|
|
1635
1645
|
const cssClasses = [];
|
|
1636
|
-
cssClasses.push(styles$
|
|
1646
|
+
cssClasses.push(styles$j.loadingIndicator);
|
|
1637
1647
|
return cssClasses.filter(css => css).join(' ');
|
|
1638
1648
|
};
|
|
1639
1649
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -1643,7 +1653,7 @@ const LoadingIndicator = (_a) => {
|
|
|
1643
1653
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1644
1654
|
const getCssClasses = () => {
|
|
1645
1655
|
const cssClasses = [];
|
|
1646
|
-
cssClasses.push(styles$
|
|
1656
|
+
cssClasses.push(styles$j.loadingIndicatorContainer);
|
|
1647
1657
|
return cssClasses.filter(css => css).join(' ');
|
|
1648
1658
|
};
|
|
1649
1659
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1671,16 +1681,16 @@ class LoadingIndicatorService {
|
|
|
1671
1681
|
}
|
|
1672
1682
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1673
1683
|
|
|
1674
|
-
var css_248z$
|
|
1675
|
-
var styles$
|
|
1676
|
-
styleInject(css_248z$
|
|
1684
|
+
var css_248z$i = ".ModalHeader-module_modalHeader__tw-u- {\n border-bottom: none;\n align-items: center; }\n";
|
|
1685
|
+
var styles$i = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-"};
|
|
1686
|
+
styleInject(css_248z$i);
|
|
1677
1687
|
|
|
1678
1688
|
const ModalHeader = (props) => {
|
|
1679
1689
|
const { children, isDismissable = false, onClose } = props, rest = __rest(props, ["children", "isDismissable", "onClose"]);
|
|
1680
1690
|
const handleClick = () => {
|
|
1681
1691
|
onClose && onClose();
|
|
1682
1692
|
};
|
|
1683
|
-
return (React__default["default"].createElement("div", Object.assign({ className: "modal-header " + styles$
|
|
1693
|
+
return (React__default["default"].createElement("div", Object.assign({ className: "modal-header " + styles$i.modalHeader }, rest),
|
|
1684
1694
|
React__default["default"].createElement("h5", { className: "modal-title" }, children),
|
|
1685
1695
|
isDismissable &&
|
|
1686
1696
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
@@ -1688,24 +1698,24 @@ const ModalHeader = (props) => {
|
|
|
1688
1698
|
|
|
1689
1699
|
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: "modal-body" }, children));
|
|
1690
1700
|
|
|
1691
|
-
var css_248z$
|
|
1692
|
-
var styles$
|
|
1693
|
-
styleInject(css_248z$
|
|
1701
|
+
var css_248z$h = ".Modal-module_modal__HMxWV {\n z-index: 1111 !important;\n border-radius: var(--borderRadius); }\n .Modal-module_modal__HMxWV.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_modal__HMxWV.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_modal__HMxWV.Modal-module_fullscreen__iepGa {\n max-width: 100% !important; } }\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";
|
|
1702
|
+
var styles$h = {"modal":"Modal-module_modal__HMxWV","fullscreen":"Modal-module_fullscreen__iepGa","modalContent":"Modal-module_modalContent__9wAwB","sm":"Modal-module_sm__CsR6U","md":"Modal-module_md__lNggx","lg":"Modal-module_lg__6dtT2","modal-dialog":"Modal-module_modal-dialog__U2wGf"};
|
|
1703
|
+
styleInject(css_248z$h);
|
|
1694
1704
|
|
|
1695
|
-
var css_248z$
|
|
1696
|
-
var styles$
|
|
1697
|
-
styleInject(css_248z$
|
|
1705
|
+
var css_248z$g = ".ModalFooter-module_modalFooter__SNm-f {\n border-top: none; }\n";
|
|
1706
|
+
var styles$g = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1707
|
+
styleInject(css_248z$g);
|
|
1698
1708
|
|
|
1699
|
-
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: "modal-footer " + styles$
|
|
1709
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: "modal-footer " + styles$g.modalFooter }, children));
|
|
1700
1710
|
|
|
1701
1711
|
const Modal = (props) => {
|
|
1702
1712
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1703
1713
|
const getCssClass = () => {
|
|
1704
1714
|
const cssClasses = [];
|
|
1705
1715
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1706
|
-
cssClasses.push(styles$
|
|
1707
|
-
!!fullScreen && cssClasses.push(styles$
|
|
1708
|
-
size && cssClasses.push(styles$
|
|
1716
|
+
cssClasses.push(styles$h.modal);
|
|
1717
|
+
!!fullScreen && cssClasses.push(styles$h['fullscreen']);
|
|
1718
|
+
size && cssClasses.push(styles$h[size]);
|
|
1709
1719
|
className && cssClasses.push(className);
|
|
1710
1720
|
return cssClasses.filter(r => r).join(' ');
|
|
1711
1721
|
};
|
|
@@ -1719,9 +1729,9 @@ const Modal = (props) => {
|
|
|
1719
1729
|
onBackdropClick && onBackdropClick();
|
|
1720
1730
|
};
|
|
1721
1731
|
return (React__default["default"].createElement(React.Fragment, null,
|
|
1722
|
-
React__default["default"].createElement("div", { className: "modal show " + styles$
|
|
1732
|
+
React__default["default"].createElement("div", { className: "modal show " + styles$h.modal, style: { display: 'block' } },
|
|
1723
1733
|
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1724
|
-
React__default["default"].createElement("div", { className: 'modal-content ' + (fullScreen ? styles$
|
|
1734
|
+
React__default["default"].createElement("div", { className: 'modal-content ' + (fullScreen ? styles$h['modalContent'] : undefined) },
|
|
1725
1735
|
header &&
|
|
1726
1736
|
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1727
1737
|
React__default["default"].createElement(ModalBody, null, children),
|
|
@@ -1924,25 +1934,25 @@ const Sidebar = (props) => {
|
|
|
1924
1934
|
!item.isCollapsed && item.items && item.items.length > 0 && (React__default["default"].createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React__default["default"].createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
|
|
1925
1935
|
};
|
|
1926
1936
|
|
|
1927
|
-
var css_248z$
|
|
1928
|
-
var styles$
|
|
1929
|
-
styleInject(css_248z$
|
|
1937
|
+
var css_248z$f = ".Snackbar-module_snackbar__O5T2b {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__E47iD 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_primary__ZBOTN {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_accent__0MnFy {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_secondary__s8-ez {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_light__Vrd7o {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_dark__U-5io {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Snackbar-module_text__G5r5D {\n width: 100%;\n padding: 8px 0; }\n\n.Snackbar-module_action__vus2Y {\n margin-left: auto; }\n .Snackbar-module_action__vus2Y:hover {\n cursor: pointer; }\n\n@keyframes Snackbar-module_bounceIn__E47iD {\n 0% {\n opacity: 0; }\n 50% {\n opacity: 0.9; }\n 80% {\n opacity: 1; }\n 100% {\n opacity: 1; } }\n";
|
|
1938
|
+
var styles$f = {"snackbar":"Snackbar-module_snackbar__O5T2b","bounceIn":"Snackbar-module_bounceIn__E47iD","primary":"Snackbar-module_primary__ZBOTN","accent":"Snackbar-module_accent__0MnFy","secondary":"Snackbar-module_secondary__s8-ez","light":"Snackbar-module_light__Vrd7o","dark":"Snackbar-module_dark__U-5io","text":"Snackbar-module_text__G5r5D","action":"Snackbar-module_action__vus2Y"};
|
|
1939
|
+
styleInject(css_248z$f);
|
|
1930
1940
|
|
|
1931
1941
|
const Snackbar = (props) => {
|
|
1932
1942
|
const { children, color = exports.COLOR.dark, actionText = 'ok', onOk } = props, rest = __rest(props, ["children", "color", "actionText", "onOk"]);
|
|
1933
1943
|
const getCssClasses = () => {
|
|
1934
1944
|
const cssClasses = [];
|
|
1935
|
-
cssClasses.push(styles$
|
|
1945
|
+
cssClasses.push(styles$f.snackbar);
|
|
1936
1946
|
cssClasses.push(`shadow-lg`);
|
|
1937
|
-
cssClasses.push(styles$
|
|
1947
|
+
cssClasses.push(styles$f[color]);
|
|
1938
1948
|
return cssClasses.filter(css => css).join(' ');
|
|
1939
1949
|
};
|
|
1940
1950
|
const handleClickAction = (e) => {
|
|
1941
1951
|
onOk && onOk(e);
|
|
1942
1952
|
};
|
|
1943
1953
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
1944
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1945
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1954
|
+
React__default["default"].createElement("div", { className: styles$f.text }, children),
|
|
1955
|
+
React__default["default"].createElement("div", { className: styles$f.action + " text-accent", onClick: handleClickAction },
|
|
1946
1956
|
React__default["default"].createElement("span", null, actionText))));
|
|
1947
1957
|
};
|
|
1948
1958
|
|
|
@@ -1980,29 +1990,29 @@ class SnackbarService {
|
|
|
1980
1990
|
}
|
|
1981
1991
|
const snackbarService = new SnackbarService();
|
|
1982
1992
|
|
|
1983
|
-
var css_248z$
|
|
1984
|
-
var styles$
|
|
1985
|
-
styleInject(css_248z$
|
|
1993
|
+
var css_248z$e = ".SpeedDialActions-module_speedDialActions__cY2i3 {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto; }\n";
|
|
1994
|
+
var styles$e = {"speedDialActions":"SpeedDialActions-module_speedDialActions__cY2i3"};
|
|
1995
|
+
styleInject(css_248z$e);
|
|
1986
1996
|
|
|
1987
1997
|
const SpeedDialActions = (props) => {
|
|
1988
1998
|
const { children } = props;
|
|
1989
1999
|
const getCssClasses = () => {
|
|
1990
2000
|
const cssClasses = [];
|
|
1991
|
-
cssClasses.push(styles$
|
|
2001
|
+
cssClasses.push(styles$e.speedDialActions);
|
|
1992
2002
|
return cssClasses.filter(css => css).join(' ');
|
|
1993
2003
|
};
|
|
1994
2004
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
1995
2005
|
};
|
|
1996
2006
|
|
|
1997
|
-
var css_248z$
|
|
1998
|
-
var styles$
|
|
1999
|
-
styleInject(css_248z$
|
|
2007
|
+
var css_248z$d = ".SpeedDial-module_speedDial__W3VN2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n";
|
|
2008
|
+
var styles$d = {"speedDial":"SpeedDial-module_speedDial__W3VN2"};
|
|
2009
|
+
styleInject(css_248z$d);
|
|
2000
2010
|
|
|
2001
2011
|
const SpeedDial = (props) => {
|
|
2002
2012
|
const { children, className, open, onOpen, onClose } = props, rest = __rest(props, ["children", "className", "open", "onOpen", "onClose"]);
|
|
2003
2013
|
const getCssClasses = () => {
|
|
2004
2014
|
const cssClasses = [];
|
|
2005
|
-
cssClasses.push(styles$
|
|
2015
|
+
cssClasses.push(styles$d.speedDial);
|
|
2006
2016
|
className && cssClasses.push(className);
|
|
2007
2017
|
return cssClasses.filter(css => css).join(' ');
|
|
2008
2018
|
};
|
|
@@ -2019,15 +2029,15 @@ const SpeedDial = (props) => {
|
|
|
2019
2029
|
React__default["default"].createElement(SpeedDialActions, null, children)));
|
|
2020
2030
|
};
|
|
2021
2031
|
|
|
2022
|
-
var css_248z$
|
|
2023
|
-
var styles$
|
|
2024
|
-
styleInject(css_248z$
|
|
2032
|
+
var css_248z$c = ".SpeedDialAction-module_speedDialAction__kJLpz + .SpeedDialAction-module_speedDialAction__kJLpz {\n margin-bottom: 10px; }\n";
|
|
2033
|
+
var styles$c = {"speedDialAction":"SpeedDialAction-module_speedDialAction__kJLpz"};
|
|
2034
|
+
styleInject(css_248z$c);
|
|
2025
2035
|
|
|
2026
2036
|
const SpeedDialAction = (props) => {
|
|
2027
2037
|
const { icon, color = exports.COLOR.light, onClick, className } = props;
|
|
2028
2038
|
const getCssClasses = () => {
|
|
2029
2039
|
const cssClasses = [];
|
|
2030
|
-
cssClasses.push(styles$
|
|
2040
|
+
cssClasses.push(styles$c.speedDialAction);
|
|
2031
2041
|
className && cssClasses.push(className);
|
|
2032
2042
|
return cssClasses.filter(css => css).join(' ');
|
|
2033
2043
|
};
|
|
@@ -2044,15 +2054,15 @@ const SpeedDialIcon = (props) => {
|
|
|
2044
2054
|
return (React__default["default"].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
2045
2055
|
};
|
|
2046
2056
|
|
|
2047
|
-
var css_248z$
|
|
2048
|
-
var styles$
|
|
2049
|
-
styleInject(css_248z$
|
|
2057
|
+
var css_248z$b = ".StepperActions-module_stepperActions__hBUkh {\n display: flex; }\n";
|
|
2058
|
+
var styles$b = {"stepperActions":"StepperActions-module_stepperActions__hBUkh"};
|
|
2059
|
+
styleInject(css_248z$b);
|
|
2050
2060
|
|
|
2051
2061
|
const StepperActions = (props) => {
|
|
2052
2062
|
const { className, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
|
|
2053
2063
|
const getCssClasses = () => {
|
|
2054
2064
|
const cssClasses = [];
|
|
2055
|
-
cssClasses.push(styles$
|
|
2065
|
+
cssClasses.push(styles$b.stepperActions);
|
|
2056
2066
|
className && cssClasses.push(className);
|
|
2057
2067
|
return cssClasses.filter(css => css).join(' ');
|
|
2058
2068
|
};
|
|
@@ -2069,31 +2079,31 @@ const StepPanel = (props) => {
|
|
|
2069
2079
|
return (React__default["default"].createElement("div", { className: "steppanel" }, children));
|
|
2070
2080
|
};
|
|
2071
2081
|
|
|
2072
|
-
var css_248z$
|
|
2073
|
-
var styles$
|
|
2074
|
-
styleInject(css_248z$
|
|
2082
|
+
var css_248z$a = ".StepConnector-module_stepConnector__A7A-7 {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px; }\n\n.StepConnector-module_stepConnectorLine__8rQxv {\n display: block;\n border-color: var(--secondary);\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .StepConnector-module_stepConnectorLine__8rQxv.StepConnector-module_isActive__TUIKV {\n border-color: var(--primary); }\n\n.StepConnector-module_stepConnectorLineHorizontal__i09K0 {\n border-top-style: solid;\n border-top-width: 1px; }\n";
|
|
2083
|
+
var styles$a = {"stepConnector":"StepConnector-module_stepConnector__A7A-7","stepConnectorLine":"StepConnector-module_stepConnectorLine__8rQxv","isActive":"StepConnector-module_isActive__TUIKV","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__i09K0"};
|
|
2084
|
+
styleInject(css_248z$a);
|
|
2075
2085
|
|
|
2076
2086
|
const StepConnector = (props) => {
|
|
2077
2087
|
const { isActive, isHorizontal = true } = props;
|
|
2078
2088
|
const getCssClassesConnector = () => {
|
|
2079
2089
|
const cssClasses = [];
|
|
2080
|
-
cssClasses.push(styles$
|
|
2090
|
+
cssClasses.push(styles$a.stepConnector);
|
|
2081
2091
|
return cssClasses.filter(css => css).join(' ');
|
|
2082
2092
|
};
|
|
2083
2093
|
const getCssClassesLine = () => {
|
|
2084
2094
|
const cssClasses = [];
|
|
2085
|
-
cssClasses.push(styles$
|
|
2086
|
-
isActive && cssClasses.push(styles$
|
|
2087
|
-
isHorizontal && cssClasses.push(styles$
|
|
2095
|
+
cssClasses.push(styles$a.stepConnectorLine);
|
|
2096
|
+
isActive && cssClasses.push(styles$a['isActive']);
|
|
2097
|
+
isHorizontal && cssClasses.push(styles$a.stepConnectorLineHorizontal);
|
|
2088
2098
|
return cssClasses.filter(css => css).join(' ');
|
|
2089
2099
|
};
|
|
2090
2100
|
return (React__default["default"].createElement("div", { className: getCssClassesConnector() },
|
|
2091
2101
|
React__default["default"].createElement("div", { className: getCssClassesLine() })));
|
|
2092
2102
|
};
|
|
2093
2103
|
|
|
2094
|
-
var css_248z$
|
|
2095
|
-
var styles$
|
|
2096
|
-
styleInject(css_248z$
|
|
2104
|
+
var css_248z$9 = ".Stepper-module_stepper__V6odG {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px; }\n .Stepper-module_stepper__V6odG.Stepper-module_isHorizontal__Q-3Wu {\n overflow-x: auto; }\n";
|
|
2105
|
+
var styles$9 = {"stepper":"Stepper-module_stepper__V6odG","isHorizontal":"Stepper-module_isHorizontal__Q-3Wu"};
|
|
2106
|
+
styleInject(css_248z$9);
|
|
2097
2107
|
|
|
2098
2108
|
const Stepper = (props) => {
|
|
2099
2109
|
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
|
|
@@ -2181,8 +2191,8 @@ const Stepper = (props) => {
|
|
|
2181
2191
|
};
|
|
2182
2192
|
const getCssClasses = () => {
|
|
2183
2193
|
const cssClasses = [];
|
|
2184
|
-
cssClasses.push(styles$
|
|
2185
|
-
isHorizontal && cssClasses.push(styles$
|
|
2194
|
+
cssClasses.push(styles$9.stepper);
|
|
2195
|
+
isHorizontal && cssClasses.push(styles$9['isHorizontal']);
|
|
2186
2196
|
return cssClasses.filter(css => css).join(' ');
|
|
2187
2197
|
};
|
|
2188
2198
|
return (React__default["default"].createElement(React__default["default"].Fragment, null, steps &&
|
|
@@ -2195,15 +2205,15 @@ const Stepper = (props) => {
|
|
|
2195
2205
|
React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset }))));
|
|
2196
2206
|
};
|
|
2197
2207
|
|
|
2198
|
-
var css_248z$
|
|
2199
|
-
var styles$
|
|
2200
|
-
styleInject(css_248z$
|
|
2208
|
+
var css_248z$8 = ".Typography-module_typography__sw-td {\n text-overflow: ellipsis;\n overflow: hidden !important; }\n";
|
|
2209
|
+
var styles$8 = {"typography":"Typography-module_typography__sw-td"};
|
|
2210
|
+
styleInject(css_248z$8);
|
|
2201
2211
|
|
|
2202
2212
|
const Wrapper = (props) => {
|
|
2203
2213
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
2204
2214
|
const getCssClasses = () => {
|
|
2205
2215
|
const cssClasses = [];
|
|
2206
|
-
cssClasses.push(styles$
|
|
2216
|
+
cssClasses.push(styles$8.typography);
|
|
2207
2217
|
className && cssClasses.push(className);
|
|
2208
2218
|
return cssClasses.filter(css => css).join(' ');
|
|
2209
2219
|
};
|
|
@@ -2214,14 +2224,13 @@ const Typography = (_a) => {
|
|
|
2214
2224
|
return (React__default["default"].createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
2215
2225
|
};
|
|
2216
2226
|
|
|
2217
|
-
var css_248z$
|
|
2218
|
-
var styles$
|
|
2219
|
-
styleInject(css_248z$
|
|
2227
|
+
var css_248z$7 = ".Step-module_stepWrapper__IQwq1 {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Step-module_stepWrapper__IQwq1.Step-module_hasLabel__LZNvd:not(.Step-module_disabled__JnxUP):hover {\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n border-radius: var(--borderRadius); }\n\n.Step-module_step__k42go {\n width: 40px;\n height: 40px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Step-module_step__k42go:not(.Step-module_hasLabel__LZNvd):not(.Step-module_disabled__JnxUP):hover {\n border-radius: 100%;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04); }\n .Step-module_step__k42go.Step-module_hasLabel__LZNvd svg {\n width: 18px !important;\n height: 18px !important; }\n\n.Step-module_stepIconCircle__hnxIV svg {\n width: 24px;\n height: 24px; }\n\n.Step-module_stepValue__B0-xv {\n position: absolute;\n color: var(--secondary-contrast-text); }\n .Step-module_stepValue__B0-xv .Step-module_isActive__3GGcl {\n color: var(--primary-contrast-text); }\n";
|
|
2228
|
+
var styles$7 = {"stepWrapper":"Step-module_stepWrapper__IQwq1","hasLabel":"Step-module_hasLabel__LZNvd","disabled":"Step-module_disabled__JnxUP","step":"Step-module_step__k42go","stepIconCircle":"Step-module_stepIconCircle__hnxIV","stepValue":"Step-module_stepValue__B0-xv","isActive":"Step-module_isActive__3GGcl"};
|
|
2229
|
+
styleInject(css_248z$7);
|
|
2220
2230
|
|
|
2221
2231
|
const Step = (props) => {
|
|
2222
2232
|
const { className, label, showLabel, index, value, isActive, isDone, isDisabled, showProgressCheckIcon, onClick } = props;
|
|
2223
|
-
const hoverRef =
|
|
2224
|
-
const isHover = useHover(hoverRef);
|
|
2233
|
+
const [hoverRef, isHovered] = useHover();
|
|
2225
2234
|
const handleClick = (event) => {
|
|
2226
2235
|
if (!isDisabled) {
|
|
2227
2236
|
onClick && onClick({ event, value });
|
|
@@ -2229,29 +2238,29 @@ const Step = (props) => {
|
|
|
2229
2238
|
};
|
|
2230
2239
|
const getCssClasses = () => {
|
|
2231
2240
|
const cssClasses = [];
|
|
2232
|
-
cssClasses.push(styles$
|
|
2233
|
-
label && showLabel && cssClasses.push(styles$
|
|
2234
|
-
isDisabled && cssClasses.push(styles$
|
|
2241
|
+
cssClasses.push(styles$7.stepWrapper);
|
|
2242
|
+
label && showLabel && cssClasses.push(styles$7['hasLabel']);
|
|
2243
|
+
isDisabled && cssClasses.push(styles$7['disabled']);
|
|
2235
2244
|
className && cssClasses.push(className);
|
|
2236
2245
|
return cssClasses.filter(css => css).join(' ');
|
|
2237
2246
|
};
|
|
2238
2247
|
const getCssClassesStep = () => {
|
|
2239
2248
|
const cssClasses = [];
|
|
2240
|
-
cssClasses.push(styles$
|
|
2241
|
-
label && showLabel && cssClasses.push(styles$
|
|
2242
|
-
isDisabled && cssClasses.push(styles$
|
|
2249
|
+
cssClasses.push(styles$7.step);
|
|
2250
|
+
label && showLabel && cssClasses.push(styles$7['hasLabel']);
|
|
2251
|
+
isDisabled && cssClasses.push(styles$7['disabled']);
|
|
2243
2252
|
return cssClasses.filter(css => css).join(' ');
|
|
2244
2253
|
};
|
|
2245
2254
|
const getCssClassesStepValue = () => {
|
|
2246
2255
|
const cssClasses = [];
|
|
2247
|
-
cssClasses.push(styles$
|
|
2256
|
+
cssClasses.push(styles$7.stepValue);
|
|
2248
2257
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2249
|
-
isActive && cssClasses.push(styles$
|
|
2258
|
+
isActive && cssClasses.push(styles$7.stepValue['isActive']);
|
|
2250
2259
|
return cssClasses.filter(css => css).join(' ');
|
|
2251
2260
|
};
|
|
2252
2261
|
return (React__default["default"].createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
|
|
2253
2262
|
React__default["default"].createElement("div", { className: getCssClassesStep() },
|
|
2254
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
2263
|
+
React__default["default"].createElement(Icon, { className: styles$7.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? exports.COLOR.primary : exports.COLOR.secondary },
|
|
2255
2264
|
React__default["default"].createElement(CircleSolidIcon, null)),
|
|
2256
2265
|
React__default["default"].createElement("div", { className: getCssClassesStepValue() }, showProgressCheckIcon && isActive && isDone ?
|
|
2257
2266
|
React__default["default"].createElement(Icon, null,
|
|
@@ -2262,18 +2271,22 @@ const Step = (props) => {
|
|
|
2262
2271
|
React__default["default"].createElement(Typography, { className: "flex-shrink-0" }, label)));
|
|
2263
2272
|
};
|
|
2264
2273
|
|
|
2274
|
+
var css_248z$6 = ".Table-module_table__DHKNv {\n --bs-table-bg: transparent;\n --bs-table-accent-bg: transparent;\n --bs-table-striped-color: #212529;\n --bs-table-striped-bg: rgba(0, 0, 0, 0.05);\n --bs-table-active-color: #212529;\n --bs-table-active-bg: rgba(0, 0, 0, 0.1);\n --bs-table-hover-color: #212529;\n --bs-table-hover-bg: rgba(0, 0, 0, 0.075);\n width: 100%;\n margin-bottom: 1rem;\n color: #212529;\n vertical-align: top;\n border-color: #dee2e6; }\n .Table-module_table__DHKNv thead {\n vertical-align: bottom; }\n .Table-module_table__DHKNv > :not(caption) > * > * {\n padding: 0.5rem 0.5rem;\n background-color: var(--bs-table-bg);\n border-bottom-width: 1px;\n box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); }\n .Table-module_table__DHKNv > :not(:first-child) {\n border-top: 2px solid currentColor; }\n\n.Table-module_bordered__1Kp1p > :not(caption) > * > * {\n border-width: 0 1px; }\n\n.Table-module_bordered__1Kp1p > :not(caption) > * {\n border-width: 1px 0; }\n\n.Table-module_striped__jmxgE > tbody > tr:nth-of-type(odd) > * {\n --bs-table-accent-bg: var(--bs-table-striped-bg);\n color: var(--bs-table-striped-color); }\n\n.Table-module_hover__P6r3y > tbody > tr:hover > * {\n --bs-table-accent-bg: var(--bs-table-hover-bg);\n color: var(--bs-table-hover-color); }\n\n.Table-module_tableResponsive__ykttB {\n overflow-x: auto; }\n";
|
|
2275
|
+
var styles$6 = {"table":"Table-module_table__DHKNv","bordered":"Table-module_bordered__1Kp1p","striped":"Table-module_striped__jmxgE","hover":"Table-module_hover__P6r3y","tableResponsive":"Table-module_tableResponsive__ykttB"};
|
|
2276
|
+
styleInject(css_248z$6);
|
|
2277
|
+
|
|
2265
2278
|
const Table = (props) => {
|
|
2266
2279
|
const { children, className, bordered, striped, hover, responsive = false } = props;
|
|
2267
2280
|
const getCssClasses = () => {
|
|
2268
2281
|
const cssClasses = [];
|
|
2269
|
-
cssClasses.push(
|
|
2270
|
-
bordered && cssClasses.push('
|
|
2271
|
-
striped && cssClasses.push('
|
|
2272
|
-
hover && cssClasses.push('
|
|
2282
|
+
cssClasses.push(styles$6.table);
|
|
2283
|
+
bordered && cssClasses.push(styles$6['bordered']);
|
|
2284
|
+
striped && cssClasses.push(styles$6['striped']);
|
|
2285
|
+
hover && cssClasses.push(styles$6['hover']);
|
|
2273
2286
|
className && cssClasses.push(className);
|
|
2274
2287
|
return cssClasses.filter(css => css).join(' ');
|
|
2275
2288
|
};
|
|
2276
|
-
return (React__default["default"].createElement(ConditionalWrapper, { condition: responsive, wrapper: children => React__default["default"].createElement("div", { className:
|
|
2289
|
+
return (React__default["default"].createElement(ConditionalWrapper, { condition: responsive, wrapper: children => React__default["default"].createElement("div", { className: styles$6.tableResponsive }, children) },
|
|
2277
2290
|
React__default["default"].createElement("table", { className: getCssClasses() }, children)));
|
|
2278
2291
|
};
|
|
2279
2292
|
|