react-asc 25.1.1 → 25.2.1
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/Stepper/Dot/Dot.d.ts +7 -0
- package/components/Stepper/Dot/index.d.ts +1 -0
- package/components/Stepper/Stepper.d.ts +2 -0
- package/components/Stepper/index.d.ts +1 -0
- package/index.es.js +323 -303
- package/index.js +323 -302
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -70,93 +70,93 @@ function styleInject(css, ref) {
|
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
72
|
|
|
73
|
-
var css_248z$
|
|
74
|
-
var styles$
|
|
75
|
-
styleInject(css_248z$
|
|
73
|
+
var css_248z$14 = ".Alert-module_alert__b4tbk {\n border-radius: var(--borderRadius);\n padding: 6px 16px;\n}\n.Alert-module_alert__b4tbk.Alert-module_shadow__5bz-7 {\n box-shadow: var(--shadow);\n}\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\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}";
|
|
74
|
+
var styles$14 = {"alert":"Alert-module_alert__b4tbk","shadow":"Alert-module_shadow__5bz-7","contained":"Alert-module_contained__EM0x6","primary":"Alert-module_primary__q4pNj","accent":"Alert-module_accent__a2WIl","secondary":"Alert-module_secondary__syXKX","light":"Alert-module_light__VKCXF","dark":"Alert-module_dark__3c-Hm","outline":"Alert-module_outline__T2262"};
|
|
75
|
+
styleInject(css_248z$14);
|
|
76
76
|
|
|
77
77
|
const Alert = (props) => {
|
|
78
78
|
const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true, ...rest } = props;
|
|
79
79
|
const getCssClasses = () => {
|
|
80
80
|
const cssClasses = [];
|
|
81
|
-
cssClasses.push(styles$
|
|
81
|
+
cssClasses.push(styles$14.alert);
|
|
82
82
|
if (variant === exports.VARIANT.contained) {
|
|
83
|
-
cssClasses.push(styles$
|
|
84
|
-
cssClasses.push(styles$
|
|
83
|
+
cssClasses.push(styles$14.contained);
|
|
84
|
+
cssClasses.push(styles$14[color]);
|
|
85
85
|
}
|
|
86
86
|
if (variant === exports.VARIANT.outline) {
|
|
87
|
-
cssClasses.push(styles$
|
|
88
|
-
cssClasses.push(styles$
|
|
87
|
+
cssClasses.push(styles$14.outline);
|
|
88
|
+
cssClasses.push(styles$14[color]);
|
|
89
89
|
}
|
|
90
|
-
shadow && cssClasses.push(styles$
|
|
90
|
+
shadow && cssClasses.push(styles$14['shadow']);
|
|
91
91
|
className && cssClasses.push(className);
|
|
92
92
|
return cssClasses.filter(r => r).join(' ');
|
|
93
93
|
};
|
|
94
94
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
95
95
|
};
|
|
96
96
|
|
|
97
|
-
var css_248z$
|
|
98
|
-
var styles$
|
|
99
|
-
styleInject(css_248z$
|
|
97
|
+
var css_248z$13 = ".AppBar-module_appbar__Neyh3 {\n padding: 0.5rem var(--1);\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0;\n}\n.AppBar-module_appbar__Neyh3.AppBar-module_primary__xMqXD {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.AppBar-module_appbar__Neyh3.AppBar-module_secondary__8MkLA {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.AppBar-module_appbar__Neyh3.AppBar-module_accent__vHbkp {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.AppBar-module_appbar__Neyh3.AppBar-module_light__HGy3y {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.AppBar-module_appbar__Neyh3.AppBar-module_dark__ILq96 {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.AppBar-module_appbar__Neyh3.AppBar-module_shadow__gQN8s {\n box-shadow: 0 4px 2px -2px var(--sadowColor);\n}";
|
|
98
|
+
var styles$13 = {"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"};
|
|
99
|
+
styleInject(css_248z$13);
|
|
100
100
|
|
|
101
101
|
const AppBar = (props) => {
|
|
102
102
|
const { children, className, color = exports.COLOR.primary, shadow = true, ...rest } = props;
|
|
103
103
|
const getCssClasses = () => {
|
|
104
104
|
const cssClasses = [];
|
|
105
|
-
cssClasses.push(styles$
|
|
106
|
-
cssClasses.push(styles$
|
|
107
|
-
shadow && cssClasses.push(styles$
|
|
105
|
+
cssClasses.push(styles$13[color]);
|
|
106
|
+
cssClasses.push(styles$13.appbar);
|
|
107
|
+
shadow && cssClasses.push(styles$13['shadow']);
|
|
108
108
|
className && cssClasses.push(className);
|
|
109
109
|
return cssClasses.filter(r => r).join(' ');
|
|
110
110
|
};
|
|
111
111
|
return (React__default["default"].createElement("nav", { className: getCssClasses(), ...rest }, children));
|
|
112
112
|
};
|
|
113
113
|
|
|
114
|
-
var css_248z$
|
|
115
|
-
var styles$
|
|
116
|
-
styleInject(css_248z$
|
|
114
|
+
var css_248z$12 = ".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}\n.AppBarTitle-module_appbarTitle__RsFg5:hover {\n cursor: pointer;\n}";
|
|
115
|
+
var styles$12 = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
|
|
116
|
+
styleInject(css_248z$12);
|
|
117
117
|
|
|
118
118
|
const AppBarTitle = (props) => {
|
|
119
119
|
const { children, className, onClick } = props;
|
|
120
120
|
const getCssClass = () => {
|
|
121
121
|
const cssClasses = [];
|
|
122
|
-
cssClasses.push(styles$
|
|
122
|
+
cssClasses.push(styles$12.appbarTitle);
|
|
123
123
|
className && cssClasses.push(className);
|
|
124
124
|
return cssClasses.filter(r => r).join(' ');
|
|
125
125
|
};
|
|
126
126
|
return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
127
127
|
};
|
|
128
128
|
|
|
129
|
-
var css_248z$
|
|
130
|
-
var styles$
|
|
131
|
-
styleInject(css_248z$
|
|
129
|
+
var css_248z$11 = ".Icon-module_icon__lFKCA {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px;\n}\n.Icon-module_icon__lFKCA svg {\n width: inherit;\n height: inherit;\n}\n.Icon-module_icon__lFKCA.Icon-module_primary__3fID- {\n color: var(--primary);\n}\n.Icon-module_icon__lFKCA.Icon-module_accent__aZXGb {\n color: var(--accent);\n}\n.Icon-module_icon__lFKCA.Icon-module_secondary__HKKop {\n color: var(--secondary);\n}\n.Icon-module_icon__lFKCA.Icon-module_light__-ApMm {\n color: var(--light);\n}\n.Icon-module_icon__lFKCA.Icon-module_dark__DpCIK {\n color: var(--dark);\n}";
|
|
130
|
+
var styles$11 = {"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"};
|
|
131
|
+
styleInject(css_248z$11);
|
|
132
132
|
|
|
133
133
|
const Icon = (props) => {
|
|
134
134
|
const { children, iconColor, className, ...rest } = props;
|
|
135
135
|
const getCssClasses = () => {
|
|
136
136
|
const cssClasses = [];
|
|
137
|
-
cssClasses.push(styles$
|
|
138
|
-
iconColor && cssClasses.push(styles$
|
|
137
|
+
cssClasses.push(styles$11.icon);
|
|
138
|
+
iconColor && cssClasses.push(styles$11[iconColor]);
|
|
139
139
|
className && cssClasses.push(className);
|
|
140
140
|
return cssClasses.filter(css => css).join(' ');
|
|
141
141
|
};
|
|
142
142
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
143
143
|
};
|
|
144
144
|
|
|
145
|
-
var css_248z
|
|
146
|
-
var styles
|
|
147
|
-
styleInject(css_248z
|
|
145
|
+
var css_248z$10 = ".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}\n.IconButton-module_iconButton__rpCPQ:hover {\n cursor: pointer;\n}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_shadow__Uw0RK {\n box-shadow: var(--shadow);\n}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_md__XnuSk {\n width: 48px;\n height: 48px;\n}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_lg__arEvo {\n width: 56px;\n height: 56px;\n}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag {\n padding: 0;\n background: transparent;\n color: inherit;\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G {\n color: var(--primary);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY {\n color: var(--secondary);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2 {\n color: var(--accent);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO {\n color: var(--light);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH {\n color: var(--dark);\n}\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}\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}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G {\n background-color: var(--primary);\n color: var(--white);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY {\n background-color: var(--secondary);\n color: var(--white);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2 {\n background-color: var(--accent);\n color: var(--white);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO {\n background-color: var(--light);\n color: var(--dark);\n}\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}\n.IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH {\n background-color: var(--dark);\n color: var(--white);\n}\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}\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}\n.IconButton-module_iconButton__rpCPQ:focus:not(.IconButton-module_iconButton__rpCPQ.IconButton-module_disabled__QB0ZV) {\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039), 0 0 0 0.25rem rgba(13, 110, 253, 0.2509803922);\n}";
|
|
146
|
+
var styles$10 = {"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"};
|
|
147
|
+
styleInject(css_248z$10);
|
|
148
148
|
|
|
149
149
|
const IconButton = (props) => {
|
|
150
150
|
const { children, icon, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow, ...rest } = props;
|
|
151
151
|
const getCssClasses = () => {
|
|
152
152
|
const cssClasses = [];
|
|
153
|
-
cssClasses.push(styles
|
|
154
|
-
cssClasses.push(styles
|
|
155
|
-
cssClasses.push(styles
|
|
156
|
-
cssClasses.push(styles
|
|
157
|
-
isActive && cssClasses.push(styles
|
|
158
|
-
disabled && cssClasses.push(styles
|
|
159
|
-
shadow && cssClasses.push(styles
|
|
153
|
+
cssClasses.push(styles$10[color]);
|
|
154
|
+
cssClasses.push(styles$10[variant]);
|
|
155
|
+
cssClasses.push(styles$10[size]);
|
|
156
|
+
cssClasses.push(styles$10.iconButton);
|
|
157
|
+
isActive && cssClasses.push(styles$10.active);
|
|
158
|
+
disabled && cssClasses.push(styles$10.disabled);
|
|
159
|
+
shadow && cssClasses.push(styles$10.shadow);
|
|
160
160
|
className && cssClasses.push(className);
|
|
161
161
|
return cssClasses.filter(css => css).join(' ');
|
|
162
162
|
};
|
|
@@ -301,9 +301,9 @@ const Portal = ({ children, target = document.body, className }) => {
|
|
|
301
301
|
return reactDom.createPortal(children, containerEl);
|
|
302
302
|
};
|
|
303
303
|
|
|
304
|
-
var css_248z
|
|
305
|
-
var styles
|
|
306
|
-
styleInject(css_248z
|
|
304
|
+
var css_248z$$ = ".Backdrop-module_backdrop__IRMoL {\n height: 100%;\n width: 100%;\n position: absolute;\n opacity: 0.5;\n z-index: 1040;\n top: 0;\n left: 0;\n background-color: #000;\n}\n.Backdrop-module_backdrop__IRMoL.Backdrop-module_isTransparent__F5nA5 {\n opacity: 0;\n}";
|
|
305
|
+
var styles$$ = {"backdrop":"Backdrop-module_backdrop__IRMoL","isTransparent":"Backdrop-module_isTransparent__F5nA5"};
|
|
306
|
+
styleInject(css_248z$$);
|
|
307
307
|
|
|
308
308
|
const Backdrop = (props) => {
|
|
309
309
|
const { target = document.body, isTransparent = false, onClick, style, ...rest } = props;
|
|
@@ -313,8 +313,8 @@ const Backdrop = (props) => {
|
|
|
313
313
|
};
|
|
314
314
|
const getCssClasses = () => {
|
|
315
315
|
const cssClasses = [];
|
|
316
|
-
cssClasses.push(styles
|
|
317
|
-
isTransparent && cssClasses.push(styles
|
|
316
|
+
cssClasses.push(styles$$.backdrop);
|
|
317
|
+
isTransparent && cssClasses.push(styles$$['isTransparent']);
|
|
318
318
|
return cssClasses.filter(css => css).join(' ');
|
|
319
319
|
};
|
|
320
320
|
const getStyles = () => {
|
|
@@ -324,34 +324,34 @@ const Backdrop = (props) => {
|
|
|
324
324
|
React__default["default"].createElement("div", { className: getCssClasses(), onClick: handleClick, style: getStyles(), ...rest })));
|
|
325
325
|
};
|
|
326
326
|
|
|
327
|
-
var css_248z$
|
|
328
|
-
var styles$
|
|
329
|
-
styleInject(css_248z$
|
|
327
|
+
var css_248z$_ = ".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}";
|
|
328
|
+
var styles$_ = {"list":"List-module_list__gpZ41"};
|
|
329
|
+
styleInject(css_248z$_);
|
|
330
330
|
|
|
331
331
|
const List = (props) => {
|
|
332
332
|
const { children, className, isFlush, ...rest } = props;
|
|
333
333
|
const getCssClasses = () => {
|
|
334
334
|
const cssClasses = [];
|
|
335
|
-
isFlush && cssClasses.push(styles$
|
|
336
|
-
cssClasses.push(styles$
|
|
335
|
+
isFlush && cssClasses.push(styles$_.flush);
|
|
336
|
+
cssClasses.push(styles$_.list);
|
|
337
337
|
className && cssClasses.push(className);
|
|
338
338
|
return cssClasses.filter(css => css).join(' ');
|
|
339
339
|
};
|
|
340
340
|
return (React__default["default"].createElement("ul", { className: getCssClasses(), ...rest }, children));
|
|
341
341
|
};
|
|
342
342
|
|
|
343
|
-
var css_248z$
|
|
344
|
-
var styles$
|
|
345
|
-
styleInject(css_248z$
|
|
343
|
+
var css_248z$Z = ".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}\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}\n.ListItem-module_listItem__Pk1AP + .ListItem-module_listItem__Pk1AP {\n border-top-width: 0;\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_primary__F6Qja {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_accent__pg3Ha {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_secondary__d0drD {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_light__37kby {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_dark__ZxQTF {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl {\n color: rgba(0, 0, 0, 0.26);\n}\n.ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl:hover {\n cursor: not-allowed;\n background-color: inherit;\n}";
|
|
344
|
+
var styles$Z = {"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"};
|
|
345
|
+
styleInject(css_248z$Z);
|
|
346
346
|
|
|
347
347
|
const ListItem = (props) => {
|
|
348
348
|
const { children, color, active, className, disabled, onClick, ...rest } = props;
|
|
349
349
|
const getCssClasses = () => {
|
|
350
350
|
const cssClasses = [];
|
|
351
|
-
cssClasses.push(styles$
|
|
352
|
-
color && cssClasses.push(styles$
|
|
353
|
-
active && cssClasses.push(styles$
|
|
354
|
-
disabled && cssClasses.push(styles$
|
|
351
|
+
cssClasses.push(styles$Z.listItem);
|
|
352
|
+
color && cssClasses.push(styles$Z[color]);
|
|
353
|
+
active && cssClasses.push(styles$Z['active']);
|
|
354
|
+
disabled && cssClasses.push(styles$Z['disabled']);
|
|
355
355
|
className && cssClasses.push(className);
|
|
356
356
|
return cssClasses.filter(css => css).join(' ');
|
|
357
357
|
};
|
|
@@ -361,32 +361,32 @@ const ListItem = (props) => {
|
|
|
361
361
|
return (React__default["default"].createElement("li", { onClick: handleClick, className: getCssClasses(), ...rest }, children));
|
|
362
362
|
};
|
|
363
363
|
|
|
364
|
-
var css_248z$
|
|
365
|
-
var styles$
|
|
364
|
+
var css_248z$Y = ".ListItemAvatar-module_avatar__sVWfR {\n display: flex;\n align-items: center;\n margin-right: 16px;\n}\n.ListItemAvatar-module_avatar__sVWfR svg, .ListItemAvatar-module_avatar__sVWfR img {\n width: 24px;\n height: 24px;\n}\n.ListItemAvatar-module_avatar__sVWfR img {\n border-radius: 50%;\n}";
|
|
365
|
+
var styles$Y = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
|
|
366
|
+
styleInject(css_248z$Y);
|
|
367
|
+
|
|
368
|
+
const ListItemAvatar = ({ avatar, ...rest }) => (React__default["default"].createElement("div", { className: styles$Y.avatar, ...rest }, avatar));
|
|
369
|
+
|
|
370
|
+
var css_248z$X = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px;\n}\n.ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px;\n}";
|
|
371
|
+
var styles$X = {"icon":"ListItemIcon-module_icon__cCvEv"};
|
|
366
372
|
styleInject(css_248z$X);
|
|
367
373
|
|
|
368
|
-
const
|
|
374
|
+
const ListItemIcon = ({ icon, ...rest }) => (React__default["default"].createElement("div", { className: styles$X.icon, ...rest }, icon));
|
|
369
375
|
|
|
370
|
-
var css_248z$W = ".
|
|
371
|
-
var styles$W = {"
|
|
376
|
+
var css_248z$W = ".ListItemAction-module_listItemAction__gAQRj {\n display: flex;\n justify-content: center;\n min-width: 40px;\n}\n.ListItemAction-module_listItemAction__gAQRj svg {\n width: 20px;\n height: 20px;\n}";
|
|
377
|
+
var styles$W = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
|
|
372
378
|
styleInject(css_248z$W);
|
|
373
379
|
|
|
374
|
-
const
|
|
380
|
+
const ListItemAction = ({ children, onClick, ...rest }) => (React__default["default"].createElement("div", { className: styles$W.listItemAction, onClick: (e) => onClick && onClick(e), ...rest }, children));
|
|
375
381
|
|
|
376
|
-
var css_248z$V = ".
|
|
377
|
-
var styles$V = {"
|
|
382
|
+
var css_248z$V = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1;\n}";
|
|
383
|
+
var styles$V = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
378
384
|
styleInject(css_248z$V);
|
|
379
385
|
|
|
380
|
-
const ListItemAction = ({ children, onClick, ...rest }) => (React__default["default"].createElement("div", { className: styles$V.listItemAction, onClick: (e) => onClick && onClick(e), ...rest }, children));
|
|
381
|
-
|
|
382
|
-
var css_248z$U = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1;\n}";
|
|
383
|
-
var styles$U = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
384
|
-
styleInject(css_248z$U);
|
|
385
|
-
|
|
386
386
|
const ListItemText = ({ primary, secondary, ...rest }) => {
|
|
387
387
|
const getCssClasses = () => {
|
|
388
388
|
const cssClasses = [];
|
|
389
|
-
cssClasses.push(styles$
|
|
389
|
+
cssClasses.push(styles$V.listItemText);
|
|
390
390
|
return cssClasses.filter(css => css).join(' ');
|
|
391
391
|
};
|
|
392
392
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest },
|
|
@@ -397,9 +397,9 @@ const ListItemText = ({ primary, secondary, ...rest }) => {
|
|
|
397
397
|
const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
|
|
398
398
|
const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
399
399
|
|
|
400
|
-
var css_248z$
|
|
401
|
-
var styles$
|
|
402
|
-
styleInject(css_248z$
|
|
400
|
+
var css_248z$U = ".AutoComplete-module_selectContainer__1kA85 {\n position: relative;\n}\n\n.AutoComplete-module_select__NNYOi {\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid #ced4da;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n}\n.AutoComplete-module_select__NNYOi:hover {\n cursor: pointer;\n}\n.AutoComplete-module_select__NNYOi:focus:not(.AutoComplete-module_select__NNYOi.AutoComplete-module_disabled__CbGP4) {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039), 0 0 0 0.25rem rgba(13, 110, 253, 0.2509803922);\n}\n.AutoComplete-module_select__NNYOi:disabled, .AutoComplete-module_select__NNYOi:read-only {\n background-color: #e9ecef;\n}\n.AutoComplete-module_select__NNYOi:disabled:hover {\n cursor: not-allowed;\n}\n.AutoComplete-module_select__NNYOi:read-only:hover {\n cursor: inherit;\n}\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}";
|
|
401
|
+
var styles$U = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","disabled":"AutoComplete-module_disabled__CbGP4","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
402
|
+
styleInject(css_248z$U);
|
|
403
403
|
|
|
404
404
|
// preset value
|
|
405
405
|
// enter -> delay? -> show results
|
|
@@ -447,7 +447,7 @@ const AutoComplete = (props) => {
|
|
|
447
447
|
const getCssClass = () => {
|
|
448
448
|
const cssClasses = [];
|
|
449
449
|
className && cssClasses.push(className);
|
|
450
|
-
cssClasses.push(styles$
|
|
450
|
+
cssClasses.push(styles$U.select);
|
|
451
451
|
return cssClasses.filter(r => r).join(' ');
|
|
452
452
|
};
|
|
453
453
|
const show = () => setIsShow(true);
|
|
@@ -471,28 +471,28 @@ const AutoComplete = (props) => {
|
|
|
471
471
|
setModel('');
|
|
472
472
|
setSearchText('');
|
|
473
473
|
};
|
|
474
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
474
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$U.selectContainer },
|
|
475
475
|
React__default["default"].createElement("div", { className: "d-flex" },
|
|
476
476
|
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 }),
|
|
477
477
|
showClearButton && model?.length > 0 &&
|
|
478
478
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
479
479
|
isShow &&
|
|
480
480
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
481
|
-
React__default["default"].createElement("div", { className: styles$
|
|
481
|
+
React__default["default"].createElement("div", { className: styles$U.selectMenu },
|
|
482
482
|
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), disabled: !option.value },
|
|
483
483
|
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
484
484
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
485
485
|
};
|
|
486
486
|
|
|
487
|
-
var css_248z$
|
|
488
|
-
var styles$
|
|
489
|
-
styleInject(css_248z$
|
|
487
|
+
var css_248z$T = ".Badge-module_badgeContainer__3nZBs {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle;\n}\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}\n.Badge-module_badge__9ImR0.Badge-module_primary__41U-t {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Badge-module_badge__9ImR0.Badge-module_accent__OQy2- {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Badge-module_badge__9ImR0.Badge-module_secondary__a9Jfh {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Badge-module_badge__9ImR0.Badge-module_light__4QvQ5 {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Badge-module_badge__9ImR0.Badge-module_dark__g1yUJ {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}";
|
|
488
|
+
var styles$T = {"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"};
|
|
489
|
+
styleInject(css_248z$T);
|
|
490
490
|
|
|
491
491
|
const Badge = (props) => {
|
|
492
492
|
const { children, content, className, color = exports.COLOR.primary, ...rest } = props;
|
|
493
493
|
const [cssClassName] = useCssClasses([
|
|
494
|
-
styles$
|
|
495
|
-
styles$
|
|
494
|
+
styles$T.badge,
|
|
495
|
+
styles$T[color],
|
|
496
496
|
className
|
|
497
497
|
]);
|
|
498
498
|
return (React__default["default"].createElement(BadgeContainer, null,
|
|
@@ -502,15 +502,15 @@ const Badge = (props) => {
|
|
|
502
502
|
const BadgeContainer = (props) => {
|
|
503
503
|
const { children, className, ...rest } = props;
|
|
504
504
|
const [cssClassName] = useCssClasses([
|
|
505
|
-
styles$
|
|
505
|
+
styles$T.badgeContainer,
|
|
506
506
|
className,
|
|
507
507
|
]);
|
|
508
508
|
return (React__default["default"].createElement("div", { className: cssClassName, ...rest }, children));
|
|
509
509
|
};
|
|
510
510
|
|
|
511
|
-
var css_248z$
|
|
512
|
-
var styles$
|
|
513
|
-
styleInject(css_248z$
|
|
511
|
+
var css_248z$S = ".Button-module_button__qeIer {\n text-transform: uppercase;\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}\n.Button-module_button__qeIer.Button-module_shadow__6N2nE {\n box-shadow: var(--shadow);\n}\n.Button-module_button__qeIer.Button-module_block__JIazf {\n width: 100%;\n}\n.Button-module_button__qeIer:hover:not(:disabled) {\n cursor: pointer;\n}\n.Button-module_button__qeIer:focus:not(:disabled) {\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039), 0 0 0 0.25rem rgba(13, 110, 253, 0.2509803922);\n}\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover:not(:disabled) {\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}\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover:not(:disabled) {\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}\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover:not(:disabled) {\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}\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover:not(:disabled) {\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}\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover:not(:disabled) {\n background-color: var(--dark-dark);\n}\n.Button-module_btnContained__16y5l:disabled {\n color: rgba(0, 0, 0, 0.26);\n box-shadow: none;\n background-color: rgba(0, 0, 0, 0.12);\n}\n.Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed;\n}\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none;\n}\n.Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary);\n}\n.Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover:not(:disabled) {\n text-decoration: none;\n background: var(--primary-highlight);\n}\n.Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary);\n}\n.Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover:not(:disabled) {\n text-decoration: none;\n background: var(--secondary-highlight);\n}\n.Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent);\n}\n.Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover:not(:disabled) {\n text-decoration: none;\n background: var(--accent-highlight);\n}\n.Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n}\n.Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover:not(:disabled) {\n text-decoration: none;\n background: var(--light-highlight);\n}\n.Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark);\n}\n.Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover:not(:disabled) {\n text-decoration: none;\n background: var(--dark-highlight);\n}\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none;\n}\n.Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary);\n border-color: var(--primary);\n}\n.Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover:not(:disabled) {\n background: var(--primary-highlight);\n}\n.Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary);\n border-color: var(--secondary);\n}\n.Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover:not(:disabled) {\n background: var(--secondary-highlight);\n}\n.Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent);\n border-color: var(--accent);\n}\n.Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover:not(:disabled) {\n background: var(--accent-highlight);\n}\n.Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n border-color: var(--light);\n}\n.Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover:not(:disabled) {\n background: var(--light-highlight);\n}\n.Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark);\n border-color: var(--dark);\n}\n.Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover:not(:disabled) {\n background: var(--dark-highlight);\n}\n.Button-module_btnOutline__CCFPI:disabled {\n color: rgba(0, 0, 0, 0.26);\n border: 1px solid rgba(0, 0, 0, 0.12);\n}\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px;\n}\n.Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px;\n}\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px;\n}\n.Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px;\n}";
|
|
512
|
+
var styles$S = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","block":"Button-module_block__JIazf","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"};
|
|
513
|
+
styleInject(css_248z$S);
|
|
514
514
|
|
|
515
515
|
const ButtonContext = React.createContext({
|
|
516
516
|
color: null
|
|
@@ -522,19 +522,19 @@ const Button = (props) => {
|
|
|
522
522
|
const buttonContext = useButtonContext();
|
|
523
523
|
const getCssClasses = () => {
|
|
524
524
|
const cssClasses = [];
|
|
525
|
-
cssClasses.push(styles$
|
|
525
|
+
cssClasses.push(styles$S.button);
|
|
526
526
|
const buttonColor = buttonContext.color || color;
|
|
527
527
|
if (variant !== 'outline' && variant !== 'text') {
|
|
528
|
-
cssClasses.push(styles$
|
|
529
|
-
cssClasses.push(styles$
|
|
528
|
+
cssClasses.push(styles$S.btnContained);
|
|
529
|
+
cssClasses.push(styles$S[buttonColor]);
|
|
530
530
|
}
|
|
531
531
|
if (variant === 'outline') {
|
|
532
|
-
cssClasses.push(styles$
|
|
533
|
-
cssClasses.push(styles$
|
|
532
|
+
cssClasses.push(styles$S.btnOutline);
|
|
533
|
+
cssClasses.push(styles$S[buttonColor]);
|
|
534
534
|
}
|
|
535
535
|
if (variant === 'text') {
|
|
536
|
-
cssClasses.push(styles$
|
|
537
|
-
cssClasses.push(styles$
|
|
536
|
+
cssClasses.push(styles$S.btnText);
|
|
537
|
+
cssClasses.push(styles$S[buttonColor]);
|
|
538
538
|
}
|
|
539
539
|
if (isRounded && variant !== 'text') {
|
|
540
540
|
cssClasses.push(`rounded-pill`);
|
|
@@ -542,29 +542,29 @@ const Button = (props) => {
|
|
|
542
542
|
if (isActive) {
|
|
543
543
|
cssClasses.push('active');
|
|
544
544
|
}
|
|
545
|
-
shadow && cssClasses.push(styles$
|
|
546
|
-
block && cssClasses.push(styles$
|
|
545
|
+
shadow && cssClasses.push(styles$S.shadow);
|
|
546
|
+
block && cssClasses.push(styles$S.block);
|
|
547
547
|
className && cssClasses.push(className);
|
|
548
548
|
return cssClasses.filter(css => css).join(' ');
|
|
549
549
|
};
|
|
550
550
|
return (React__default["default"].createElement("button", { type: "button", className: getCssClasses(), ...rest },
|
|
551
551
|
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
552
552
|
startIcon &&
|
|
553
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
553
|
+
React__default["default"].createElement(Icon, { className: styles$S.startIcon }, startIcon),
|
|
554
554
|
children,
|
|
555
555
|
endIcon &&
|
|
556
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
556
|
+
React__default["default"].createElement(Icon, { className: styles$S.endIcon }, endIcon))));
|
|
557
557
|
};
|
|
558
558
|
|
|
559
|
-
var css_248z$
|
|
560
|
-
var styles$
|
|
561
|
-
styleInject(css_248z$
|
|
559
|
+
var css_248z$R = ".ButtonGroup-module_buttonGroup__w6iB- {\n display: inline-flex;\n border-radius: 4px;\n box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);\n}\n.ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n.ButtonGroup-module_buttonGroup__w6iB- button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n.ButtonGroup-module_buttonGroup__w6iB- button:not(:last-of-type) {\n border-right: 1px solid #bdbdbd;\n}";
|
|
560
|
+
var styles$R = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
561
|
+
styleInject(css_248z$R);
|
|
562
562
|
|
|
563
563
|
const ButtonGroup = (props) => {
|
|
564
564
|
const { children, className, color, ...rest } = props;
|
|
565
565
|
const getCssClasses = () => {
|
|
566
566
|
const cssClasses = [];
|
|
567
|
-
cssClasses.push(styles$
|
|
567
|
+
cssClasses.push(styles$R.buttonGroup);
|
|
568
568
|
className && cssClasses.push(className);
|
|
569
569
|
return cssClasses.filter(css => css).join(' ');
|
|
570
570
|
};
|
|
@@ -572,15 +572,15 @@ const ButtonGroup = (props) => {
|
|
|
572
572
|
React__default["default"].createElement("div", { className: getCssClasses(), role: "group", ...rest }, children)));
|
|
573
573
|
};
|
|
574
574
|
|
|
575
|
-
var css_248z$
|
|
576
|
-
var styles$
|
|
577
|
-
styleInject(css_248z$
|
|
575
|
+
var css_248z$Q = ".Breadcrumb-module_breadcrumb__-pvAn {\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n list-style: none;\n margin: 0;\n}";
|
|
576
|
+
var styles$Q = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
|
|
577
|
+
styleInject(css_248z$Q);
|
|
578
578
|
|
|
579
579
|
const Breadcrumb = (props) => {
|
|
580
580
|
const { children, className, ...rest } = props;
|
|
581
581
|
const getCssClasses = () => {
|
|
582
582
|
const cssClasses = [];
|
|
583
|
-
cssClasses.push(styles$
|
|
583
|
+
cssClasses.push(styles$Q.breadcrumb);
|
|
584
584
|
className && cssClasses.push(className);
|
|
585
585
|
return cssClasses.filter(css => css).join(' ');
|
|
586
586
|
};
|
|
@@ -590,15 +590,15 @@ const Breadcrumb = (props) => {
|
|
|
590
590
|
|
|
591
591
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
592
592
|
|
|
593
|
-
var css_248z$
|
|
594
|
-
var styles$
|
|
595
|
-
styleInject(css_248z$
|
|
593
|
+
var css_248z$P = ".BreadcrumbItem-module_breadcrumbItem__zsUq- {\n display: flex;\n align-items: center;\n}\n.BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq- {\n padding-left: 0.5rem;\n}\n.BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq-::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\";\n}\n.BreadcrumbItem-module_breadcrumbItem__zsUq- a:not([href]):not([class]) {\n color: var(--primary);\n}\n.BreadcrumbItem-module_breadcrumbItem__zsUq-:hover {\n cursor: pointer;\n}\n.BreadcrumbItem-module_breadcrumbItem__zsUq-.BreadcrumbItem-module_active__Kn1dA:hover {\n cursor: unset;\n}";
|
|
594
|
+
var styles$P = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
|
|
595
|
+
styleInject(css_248z$P);
|
|
596
596
|
|
|
597
597
|
const BreadcrumbItem = (props) => {
|
|
598
598
|
const { children, className, isActive, onClick } = props;
|
|
599
599
|
const getCssClasses = () => {
|
|
600
600
|
const cssClasses = [];
|
|
601
|
-
cssClasses.push(styles$
|
|
601
|
+
cssClasses.push(styles$P.breadcrumbItem);
|
|
602
602
|
className && cssClasses.push(className);
|
|
603
603
|
isActive && cssClasses.push('active');
|
|
604
604
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -610,115 +610,115 @@ const BreadcrumbItem = (props) => {
|
|
|
610
610
|
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: (label) => React__default["default"].createElement("a", null, label) }, children)));
|
|
611
611
|
};
|
|
612
612
|
|
|
613
|
-
var css_248z$
|
|
614
|
-
var styles$
|
|
615
|
-
styleInject(css_248z$
|
|
613
|
+
var css_248z$O = ".Card-module_card__TQdQq {\n background: var(--white);\n border-radius: var(--borderRadius);\n}\n.Card-module_card__TQdQq.Card-module_shadow__NxDVz {\n box-shadow: var(--shadow);\n}";
|
|
614
|
+
var styles$O = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
|
|
615
|
+
styleInject(css_248z$O);
|
|
616
616
|
|
|
617
617
|
const Card = (props) => {
|
|
618
618
|
const { children, className, shadow = true, ...rest } = props;
|
|
619
619
|
const getCssClasses = () => {
|
|
620
620
|
const cssClasses = [];
|
|
621
|
-
cssClasses.push(styles$
|
|
622
|
-
shadow && cssClasses.push(styles$
|
|
621
|
+
cssClasses.push(styles$O.card);
|
|
622
|
+
shadow && cssClasses.push(styles$O.shadow);
|
|
623
623
|
className && cssClasses.push(className);
|
|
624
624
|
return cssClasses.filter(css => css).join(' ');
|
|
625
625
|
};
|
|
626
626
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
627
627
|
};
|
|
628
628
|
|
|
629
|
-
var css_248z$
|
|
630
|
-
var styles$
|
|
631
|
-
styleInject(css_248z$
|
|
629
|
+
var css_248z$N = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
630
|
+
var styles$N = {"cardBody":"CardBody-module_cardBody__X52VY"};
|
|
631
|
+
styleInject(css_248z$N);
|
|
632
632
|
|
|
633
633
|
const CardBody = (props) => {
|
|
634
634
|
const { children, className, ...rest } = props;
|
|
635
635
|
const getCssClasses = () => {
|
|
636
636
|
const cssClasses = [];
|
|
637
|
-
cssClasses.push(styles$
|
|
637
|
+
cssClasses.push(styles$N.cardBody);
|
|
638
638
|
className && cssClasses.push(className);
|
|
639
639
|
return cssClasses.filter(css => css).join(' ');
|
|
640
640
|
};
|
|
641
641
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
642
642
|
};
|
|
643
643
|
|
|
644
|
-
var css_248z$
|
|
645
|
-
var styles$
|
|
646
|
-
styleInject(css_248z$
|
|
644
|
+
var css_248z$M = ".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}\n.CardFooter-module_cardFooter__BpOTG:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);\n}";
|
|
645
|
+
var styles$M = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
|
|
646
|
+
styleInject(css_248z$M);
|
|
647
647
|
|
|
648
648
|
const CardFooter = (props) => {
|
|
649
649
|
const { children, className, ...rest } = props;
|
|
650
650
|
const getCssClasses = () => {
|
|
651
651
|
const cssClasses = [];
|
|
652
|
-
cssClasses.push(styles$
|
|
652
|
+
cssClasses.push(styles$M.cardFooter);
|
|
653
653
|
className && cssClasses.push(className);
|
|
654
654
|
return cssClasses.filter(css => css).join(' ');
|
|
655
655
|
};
|
|
656
656
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
657
657
|
};
|
|
658
658
|
|
|
659
|
-
var css_248z$
|
|
660
|
-
var styles$
|
|
661
|
-
styleInject(css_248z$
|
|
659
|
+
var css_248z$L = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important;\n}";
|
|
660
|
+
var styles$L = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
|
|
661
|
+
styleInject(css_248z$L);
|
|
662
662
|
|
|
663
663
|
const CardSubtitle = (props) => {
|
|
664
664
|
const { children, className, ...rest } = props;
|
|
665
665
|
const getCssClasses = () => {
|
|
666
666
|
const cssClasses = [];
|
|
667
|
-
cssClasses.push(styles$
|
|
667
|
+
cssClasses.push(styles$L.cardSubtitle);
|
|
668
668
|
className && cssClasses.push(className);
|
|
669
669
|
return cssClasses.filter(css => css).join(' ');
|
|
670
670
|
};
|
|
671
671
|
return (React__default["default"].createElement("p", { className: getCssClasses(), ...rest }, children));
|
|
672
672
|
};
|
|
673
673
|
|
|
674
|
-
var css_248z$
|
|
675
|
-
var styles$
|
|
676
|
-
styleInject(css_248z$
|
|
674
|
+
var css_248z$K = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0;\n}";
|
|
675
|
+
var styles$K = {"cardText":"CardText-module_cardText__UtYd9"};
|
|
676
|
+
styleInject(css_248z$K);
|
|
677
677
|
|
|
678
678
|
const CardText = (props) => {
|
|
679
679
|
const { children, className, ...rest } = props;
|
|
680
680
|
const getCssClasses = () => {
|
|
681
681
|
const cssClasses = [];
|
|
682
|
-
cssClasses.push(styles$
|
|
682
|
+
cssClasses.push(styles$K.cardText);
|
|
683
683
|
className && cssClasses.push(className);
|
|
684
684
|
return cssClasses.filter(css => css).join(' ');
|
|
685
685
|
};
|
|
686
686
|
return (React__default["default"].createElement("p", { className: getCssClasses(), ...rest }, children));
|
|
687
687
|
};
|
|
688
688
|
|
|
689
|
-
var css_248z$
|
|
690
|
-
var styles$
|
|
691
|
-
styleInject(css_248z$
|
|
689
|
+
var css_248z$J = ".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}";
|
|
690
|
+
var styles$J = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
|
|
691
|
+
styleInject(css_248z$J);
|
|
692
692
|
|
|
693
693
|
const CardTitle = (props) => {
|
|
694
694
|
const { children, className, as: As = 'div', ...rest } = props;
|
|
695
695
|
const getCssClasses = () => {
|
|
696
696
|
const cssClasses = [];
|
|
697
|
-
cssClasses.push(styles$
|
|
697
|
+
cssClasses.push(styles$J.cardTitle);
|
|
698
698
|
className && cssClasses.push(className);
|
|
699
699
|
return cssClasses.filter(css => css).join(' ');
|
|
700
700
|
};
|
|
701
701
|
return (React__default["default"].createElement(As, { className: getCssClasses(), ...rest }, children));
|
|
702
702
|
};
|
|
703
703
|
|
|
704
|
-
var css_248z$
|
|
705
|
-
var styles$
|
|
706
|
-
styleInject(css_248z$
|
|
704
|
+
var css_248z$I = ".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}";
|
|
705
|
+
var styles$I = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
|
|
706
|
+
styleInject(css_248z$I);
|
|
707
707
|
|
|
708
708
|
const CardImage = (props) => {
|
|
709
709
|
const { src, alt, className, ...rest } = props;
|
|
710
710
|
const getCssClasses = () => {
|
|
711
711
|
const cssClasses = [];
|
|
712
|
-
cssClasses.push(styles$
|
|
712
|
+
cssClasses.push(styles$I.cardImage);
|
|
713
713
|
className && cssClasses.push(className);
|
|
714
714
|
return cssClasses.filter(css => css).join(' ');
|
|
715
715
|
};
|
|
716
716
|
return (React__default["default"].createElement("img", { className: getCssClasses(), src: src, alt: alt, ...rest }));
|
|
717
717
|
};
|
|
718
718
|
|
|
719
|
-
var css_248z$
|
|
720
|
-
var styles$
|
|
721
|
-
styleInject(css_248z$
|
|
719
|
+
var css_248z$H = ".Checkbox-module_checkboxContainer__x2GCi {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n\n.Checkbox-module_checkboxLabel__nPY4k:hover {\n cursor: pointer;\n}\n.Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed;\n}\n.Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG:hover {\n cursor: not-allowed;\n}";
|
|
720
|
+
var styles$H = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
|
|
721
|
+
styleInject(css_248z$H);
|
|
722
722
|
|
|
723
723
|
const Checkbox = (props) => {
|
|
724
724
|
const { id, checked, className, label, name, value = 'off', disabled, readOnly, ...rest } = props;
|
|
@@ -747,8 +747,8 @@ const Checkbox = (props) => {
|
|
|
747
747
|
};
|
|
748
748
|
const getCssClassesLabel = () => {
|
|
749
749
|
const cssClasses = [];
|
|
750
|
-
cssClasses.push(styles$
|
|
751
|
-
disabled && cssClasses.push(styles$
|
|
750
|
+
cssClasses.push(styles$H.checkboxLabel);
|
|
751
|
+
disabled && cssClasses.push(styles$H['disabled']);
|
|
752
752
|
return cssClasses.filter(css => css).join(' ');
|
|
753
753
|
};
|
|
754
754
|
const getIcon = () => {
|
|
@@ -760,24 +760,24 @@ const Checkbox = (props) => {
|
|
|
760
760
|
checkboxElement?.current?.click();
|
|
761
761
|
}
|
|
762
762
|
};
|
|
763
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
763
|
+
return (React__default["default"].createElement("div", { className: styles$H.checkboxContainer },
|
|
764
764
|
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
765
765
|
React__default["default"].createElement("label", { onClick: handleClick, className: getCssClassesLabel() }, label),
|
|
766
766
|
React__default["default"].createElement("input", { type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value, ...rest })));
|
|
767
767
|
};
|
|
768
768
|
|
|
769
|
-
var css_248z$
|
|
770
|
-
var styles$
|
|
771
|
-
styleInject(css_248z$
|
|
769
|
+
var css_248z$G = ".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}\n.Chip-module_chip__dZ5qz span {\n margin-bottom: 2px;\n}\n.Chip-module_chip__dZ5qz svg {\n width: 18px;\n height: 18px;\n}\n.Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx {\n margin-left: 5px;\n}\n.Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx:hover {\n cursor: pointer;\n}\n.Chip-module_chip__dZ5qz.Chip-module_primary__YVDi9 {\n background: var(--primary);\n color: var(--primary-contrast-text);\n}\n.Chip-module_chip__dZ5qz.Chip-module_secondary__-e4xP {\n background: var(--secondary);\n color: var(--secondary-contrast-text);\n}\n.Chip-module_chip__dZ5qz.Chip-module_accent__ZCTwu {\n background: var(--accent);\n color: var(--accent-contrast-text);\n}\n.Chip-module_chip__dZ5qz.Chip-module_light__vKs7O {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Chip-module_chip__dZ5qz.Chip-module_dark__G-FLQ {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n.Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover {\n cursor: pointer;\n}\n.Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_primary__YVDi9 {\n background: var(--primary-dark);\n}\n.Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_secondary__-e4xP {\n background: var(--secondary-dark);\n}\n.Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_accent__ZCTwu {\n background: var(--accent-dark);\n}\n.Chip-module_chip__dZ5qz.Chip-module_shadow__v11NF {\n box-shadow: var(--shadow);\n}";
|
|
770
|
+
var styles$G = {"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"};
|
|
771
|
+
styleInject(css_248z$G);
|
|
772
772
|
|
|
773
773
|
const Chip = (props) => {
|
|
774
774
|
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default["default"].createElement(TimesCircleSolidIcon, null), style, ...rest } = props;
|
|
775
775
|
const getCssClass = () => {
|
|
776
776
|
const cssClasses = [];
|
|
777
|
-
cssClasses.push(styles$
|
|
778
|
-
cssClasses.push(styles$
|
|
779
|
-
shadow && cssClasses.push(styles$
|
|
780
|
-
onClick && cssClasses.push(styles$
|
|
777
|
+
cssClasses.push(styles$G.chip);
|
|
778
|
+
cssClasses.push(styles$G[color]);
|
|
779
|
+
shadow && cssClasses.push(styles$G['shadow']);
|
|
780
|
+
onClick && cssClasses.push(styles$G['clickable']);
|
|
781
781
|
className && cssClasses.push(className);
|
|
782
782
|
return cssClasses.filter(r => r).join(' ');
|
|
783
783
|
};
|
|
@@ -787,7 +787,7 @@ const Chip = (props) => {
|
|
|
787
787
|
};
|
|
788
788
|
return (React__default["default"].createElement("div", { className: getCssClass(), ...rest, style: style },
|
|
789
789
|
React__default["default"].createElement("span", null, children),
|
|
790
|
-
isDeletable && (React__default["default"].createElement("div", { className: styles$
|
|
790
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$G.deleteIcon, onClick: (e) => handleClickOnDelete(e) }, deleteIcon))));
|
|
791
791
|
};
|
|
792
792
|
|
|
793
793
|
const CssTransition = (props) => {
|
|
@@ -865,29 +865,29 @@ const CssTransition = (props) => {
|
|
|
865
865
|
React__default["default"].createElement("div", { ref: transitionConainter, className: getCssClasses() }, children)));
|
|
866
866
|
};
|
|
867
867
|
|
|
868
|
-
var css_248z$
|
|
869
|
-
var styles$
|
|
870
|
-
styleInject(css_248z$
|
|
868
|
+
var css_248z$F = ".Column-module_column__fcTgl {\n flex: 1 0 0%;\n}\n\n@media (max-width: 575.98px) {\n .Column-module_column__fcTgl {\n flex: 1;\n }\n}";
|
|
869
|
+
var styles$F = {"column":"Column-module_column__fcTgl"};
|
|
870
|
+
styleInject(css_248z$F);
|
|
871
871
|
|
|
872
872
|
const Column = (props) => {
|
|
873
873
|
const { children, className, ...rest } = props;
|
|
874
874
|
const getCssClasses = () => {
|
|
875
875
|
const cssClasses = [];
|
|
876
|
-
cssClasses.push(styles$
|
|
876
|
+
cssClasses.push(styles$F.column);
|
|
877
877
|
className && cssClasses.push(className);
|
|
878
878
|
return cssClasses.filter(css => css).join(' ');
|
|
879
879
|
};
|
|
880
880
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
881
881
|
};
|
|
882
882
|
|
|
883
|
-
var css_248z$
|
|
884
|
-
var styles$
|
|
885
|
-
styleInject(css_248z$
|
|
883
|
+
var css_248z$E = ".Row-module_row__bTIWp {\n display: flex;\n gap: 15px;\n flex-wrap: wrap;\n}\n.Row-module_row__bTIWp > * {\n flex-shrink: 0;\n width: 100%;\n min-width: 0;\n max-width: 100%;\n}";
|
|
884
|
+
var styles$E = {"row":"Row-module_row__bTIWp"};
|
|
885
|
+
styleInject(css_248z$E);
|
|
886
886
|
|
|
887
887
|
const Row = ({ children, direction = 'row', className, ...rest }) => {
|
|
888
888
|
const getCssClasses = () => {
|
|
889
889
|
const cssClasses = [];
|
|
890
|
-
cssClasses.push(styles$
|
|
890
|
+
cssClasses.push(styles$E.row);
|
|
891
891
|
className && cssClasses.push(className);
|
|
892
892
|
direction && cssClasses.push(`flex-${direction}`);
|
|
893
893
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -895,14 +895,14 @@ const Row = ({ children, direction = 'row', className, ...rest }) => {
|
|
|
895
895
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }, children));
|
|
896
896
|
};
|
|
897
897
|
|
|
898
|
-
var css_248z$
|
|
899
|
-
var styles$
|
|
900
|
-
styleInject(css_248z$
|
|
898
|
+
var css_248z$D = ".FormLabel-module_formLabel__TXcHc {\n display: inline-block;\n margin-bottom: 0.5rem;\n}";
|
|
899
|
+
var styles$D = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
900
|
+
styleInject(css_248z$D);
|
|
901
901
|
|
|
902
902
|
const FormLabel = ({ children, className, htmlFor, ...rest }) => {
|
|
903
903
|
const getCssClasses = () => {
|
|
904
904
|
const cssClasses = [];
|
|
905
|
-
cssClasses.push(styles$
|
|
905
|
+
cssClasses.push(styles$D.formLabel);
|
|
906
906
|
className && cssClasses.push(className);
|
|
907
907
|
return cssClasses.filter(css => css).join(' ');
|
|
908
908
|
};
|
|
@@ -939,9 +939,9 @@ const FileInput = (props) => {
|
|
|
939
939
|
React__default["default"].createElement("input", { 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 })));
|
|
940
940
|
};
|
|
941
941
|
|
|
942
|
-
var css_248z$
|
|
943
|
-
var styles$
|
|
944
|
-
styleInject(css_248z$
|
|
942
|
+
var css_248z$C = ".Select-module_selectContainer__DHFDZ {\n position: relative;\n}\n\n.Select-module_select__Fbn38 {\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid #ced4da;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n align-items: center;\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex;\n flex-wrap: wrap;\n}\n.Select-module_select__Fbn38 > span {\n flex: 1;\n}\n.Select-module_select__Fbn38:hover {\n cursor: pointer;\n}\n.Select-module_select__Fbn38:focus:not(.Select-module_select__Fbn38.Select-module_disabled__2XXut) {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039), 0 0 0 0.25rem rgba(13, 110, 253, 0.2509803922);\n}\n.Select-module_select__Fbn38.Select-module_disabled__2XXut, .Select-module_select__Fbn38.Select-module_readOnly__VoTER {\n background-color: #e9ecef;\n}\n.Select-module_select__Fbn38.Select-module_disabled__2XXut:hover {\n cursor: not-allowed;\n}\n.Select-module_select__Fbn38.Select-module_readOnly__VoTER:hover {\n cursor: inherit;\n}\n\n.Select-module_chipContainer__1poFF {\n gap: 10px;\n flex: 1;\n display: inline-flex;\n flex-wrap: wrap;\n}\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}";
|
|
943
|
+
var styles$C = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","disabled":"Select-module_disabled__2XXut","readOnly":"Select-module_readOnly__VoTER","chipContainer":"Select-module_chipContainer__1poFF","selectMenu":"Select-module_selectMenu__8y4kQ"};
|
|
944
|
+
styleInject(css_248z$C);
|
|
945
945
|
|
|
946
946
|
const Select = (props) => {
|
|
947
947
|
const { id, className, options = [], value, multiple, multipleMaxCountItems = 5, disabled, readOnly, onChange, onKeyDown } = props;
|
|
@@ -953,9 +953,9 @@ const Select = (props) => {
|
|
|
953
953
|
const getCssClass = () => {
|
|
954
954
|
const cssClasses = [];
|
|
955
955
|
className && cssClasses.push(className);
|
|
956
|
-
disabled && cssClasses.push(styles$
|
|
957
|
-
readOnly && cssClasses.push(styles$
|
|
958
|
-
cssClasses.push(styles$
|
|
956
|
+
disabled && cssClasses.push(styles$C['disabled']);
|
|
957
|
+
readOnly && cssClasses.push(styles$C['readOnly']);
|
|
958
|
+
cssClasses.push(styles$C.select);
|
|
959
959
|
return cssClasses.filter(r => r).join(' ');
|
|
960
960
|
};
|
|
961
961
|
React.useEffect(() => {
|
|
@@ -1077,17 +1077,17 @@ const Select = (props) => {
|
|
|
1077
1077
|
}
|
|
1078
1078
|
}
|
|
1079
1079
|
};
|
|
1080
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
1080
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$C.selectContainer },
|
|
1081
1081
|
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: (e) => handleOnKeyDown(e) },
|
|
1082
1082
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1083
1083
|
!multiple && renderSingleViewModel(),
|
|
1084
1084
|
multiple &&
|
|
1085
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1085
|
+
React__default["default"].createElement("div", { className: styles$C.chipContainer }, renderMultipleViewModel()),
|
|
1086
1086
|
React__default["default"].createElement(Icon, { className: "ml-auto" },
|
|
1087
1087
|
React__default["default"].createElement(ChevronDownSolidIcon, null)))),
|
|
1088
1088
|
isShow &&
|
|
1089
1089
|
React__default["default"].createElement(Portal, { className: 'backdrop-root' },
|
|
1090
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1090
|
+
React__default["default"].createElement("div", { className: styles$C.selectMenu, style: { left: selectConainter.current?.getBoundingClientRect().x, top: selectConainter.current?.getBoundingClientRect().y, width: selectConainter.current?.getBoundingClientRect().width } },
|
|
1091
1091
|
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) },
|
|
1092
1092
|
multiple &&
|
|
1093
1093
|
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -1095,33 +1095,33 @@ const Select = (props) => {
|
|
|
1095
1095
|
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() }))));
|
|
1096
1096
|
};
|
|
1097
1097
|
|
|
1098
|
-
var css_248z$
|
|
1099
|
-
var styles$
|
|
1100
|
-
styleInject(css_248z$
|
|
1098
|
+
var css_248z$B = ".Textarea-module_textarea__L5zqa {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n resize: vertical;\n color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.0745098039);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: 1px solid #ced4da;\n}\n.Textarea-module_textarea__L5zqa:focus:not(.Textarea-module_textarea__L5zqa.Textarea-module_disabled__OqqOF) {\n outline: none !important;\n border-color: var(--primary);\n}\n.Textarea-module_textarea__L5zqa.Textarea-module_isInvalid__JI01W {\n border-color: #dc3545;\n box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.2509803922);\n}";
|
|
1099
|
+
var styles$B = {"textarea":"Textarea-module_textarea__L5zqa","disabled":"Textarea-module_disabled__OqqOF","isInvalid":"Textarea-module_isInvalid__JI01W"};
|
|
1100
|
+
styleInject(css_248z$B);
|
|
1101
1101
|
|
|
1102
1102
|
const Textarea = (props) => {
|
|
1103
1103
|
const { className, error, ...rest } = props;
|
|
1104
1104
|
const getCssClass = () => {
|
|
1105
1105
|
const cssClasses = [];
|
|
1106
|
-
cssClasses.push(styles$
|
|
1106
|
+
cssClasses.push(styles$B.textarea);
|
|
1107
1107
|
className && cssClasses.push(className);
|
|
1108
|
-
error && cssClasses.push(styles$
|
|
1108
|
+
error && cssClasses.push(styles$B['isInvalid']);
|
|
1109
1109
|
return cssClasses.filter(r => r).join(' ');
|
|
1110
1110
|
};
|
|
1111
1111
|
return (React__default["default"].createElement("textarea", { className: getCssClass(), ...rest }));
|
|
1112
1112
|
};
|
|
1113
1113
|
|
|
1114
|
-
var css_248z$
|
|
1115
|
-
var styles$
|
|
1116
|
-
styleInject(css_248z$
|
|
1114
|
+
var css_248z$A = ".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}\n.FormInput-module_formInput__VXZip:focus:not(.FormInput-module_formInput__VXZip.FormInput-module_disabled__EjdD9) {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);\n}\n.FormInput-module_formInput__VXZip.FormInput-module_isInvalid__vQDuz {\n border-color: #dc3545;\n box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.2509803922);\n}";
|
|
1115
|
+
var styles$A = {"formInput":"FormInput-module_formInput__VXZip","disabled":"FormInput-module_disabled__EjdD9","isInvalid":"FormInput-module_isInvalid__vQDuz"};
|
|
1116
|
+
styleInject(css_248z$A);
|
|
1117
1117
|
|
|
1118
1118
|
const FormInput = (props) => {
|
|
1119
1119
|
const { value, name, type, placeholder, className, isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
1120
1120
|
const getCssClasses = () => {
|
|
1121
1121
|
const cssClasses = [];
|
|
1122
|
-
cssClasses.push(styles$
|
|
1122
|
+
cssClasses.push(styles$A.formInput);
|
|
1123
1123
|
className && cssClasses.push(className);
|
|
1124
|
-
!isValid && cssClasses.push(styles$
|
|
1124
|
+
!isValid && cssClasses.push(styles$A['isInvalid']);
|
|
1125
1125
|
return cssClasses.filter(css => css).join(' ');
|
|
1126
1126
|
};
|
|
1127
1127
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -1169,12 +1169,12 @@ const FormHint = (props) => {
|
|
|
1169
1169
|
return (React__default["default"].createElement("small", { className: getCssClasses() }, children));
|
|
1170
1170
|
};
|
|
1171
1171
|
|
|
1172
|
-
var css_248z$
|
|
1173
|
-
var styles$
|
|
1174
|
-
styleInject(css_248z$
|
|
1172
|
+
var css_248z$z = ".FormError-module_isInvalid__tO1Sw {\n width: 100%;\n margin-top: 0.25rem;\n font-size: 0.875em;\n color: #dc3545;\n}";
|
|
1173
|
+
var styles$z = {"isInvalid":"FormError-module_isInvalid__tO1Sw"};
|
|
1174
|
+
styleInject(css_248z$z);
|
|
1175
1175
|
|
|
1176
1176
|
const FormError = (props) => {
|
|
1177
|
-
const { className = styles$
|
|
1177
|
+
const { className = styles$z.isInvalid, errors = [] } = props;
|
|
1178
1178
|
return (React__default["default"].createElement(React.Fragment, null, errors &&
|
|
1179
1179
|
React__default["default"].createElement("div", { className: className }, errors.map(e => React__default["default"].createElement("div", { key: e.validator }, e.message)))));
|
|
1180
1180
|
};
|
|
@@ -1508,16 +1508,16 @@ const DateSelect = (props) => {
|
|
|
1508
1508
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1509
1509
|
// };
|
|
1510
1510
|
|
|
1511
|
-
var css_248z$
|
|
1512
|
-
var styles$
|
|
1513
|
-
styleInject(css_248z$
|
|
1511
|
+
var css_248z$y = ".Drawer-module_drawer__kdQCk {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 320px;\n overflow-y: auto;\n}\n.Drawer-module_drawer__kdQCk.Drawer-module_permanent__c-y8y {\n position: inherit;\n z-index: 0;\n}\n.Drawer-module_drawer__kdQCk.Drawer-module_left__loQVO {\n order: 0;\n left: 0;\n}\n.Drawer-module_drawer__kdQCk.Drawer-module_right__sJ3mZ {\n order: 2;\n right: 0;\n}\n.Drawer-module_drawer__kdQCk.Drawer-module_shadow__Myo3n {\n box-shadow: var(--shadow);\n}\n\n.Drawer-module_drawerOpen__07ptP {\n overflow: hidden;\n}";
|
|
1512
|
+
var styles$y = {"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"};
|
|
1513
|
+
styleInject(css_248z$y);
|
|
1514
1514
|
|
|
1515
1515
|
const Drawer = (props) => {
|
|
1516
1516
|
const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop, ...rest } = props;
|
|
1517
1517
|
React.useEffect(() => {
|
|
1518
|
-
document.body.classList.add(styles$
|
|
1518
|
+
document.body.classList.add(styles$y.drawerOpen);
|
|
1519
1519
|
return () => {
|
|
1520
|
-
document.body.classList.remove(styles$
|
|
1520
|
+
document.body.classList.remove(styles$y.drawerOpen);
|
|
1521
1521
|
};
|
|
1522
1522
|
}, []);
|
|
1523
1523
|
const handleClickBackdrop = () => {
|
|
@@ -1531,10 +1531,10 @@ const DrawerContent = (props) => {
|
|
|
1531
1531
|
const { children, className, position = 'left', permanent = false, shadow, ...rest } = props;
|
|
1532
1532
|
const getCssClasses = () => {
|
|
1533
1533
|
const cssClasses = [];
|
|
1534
|
-
cssClasses.push(styles$
|
|
1535
|
-
shadow && cssClasses.push(styles$
|
|
1536
|
-
!!permanent && cssClasses.push(styles$
|
|
1537
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1534
|
+
cssClasses.push(styles$y.drawer);
|
|
1535
|
+
shadow && cssClasses.push(styles$y.shadow);
|
|
1536
|
+
!!permanent && cssClasses.push(styles$y['permanent']);
|
|
1537
|
+
position === 'left' ? cssClasses.push(styles$y['left']) : cssClasses.push(styles$y['right']);
|
|
1538
1538
|
className && cssClasses.push(className);
|
|
1539
1539
|
return cssClasses.filter(css => css).join(' ');
|
|
1540
1540
|
};
|
|
@@ -1548,9 +1548,9 @@ const DrawerContent = (props) => {
|
|
|
1548
1548
|
return (React__default["default"].createElement("div", { className: getCssClasses(), style: getStyles(), ...rest }, children));
|
|
1549
1549
|
};
|
|
1550
1550
|
|
|
1551
|
-
var css_248z$
|
|
1552
|
-
var styles$
|
|
1553
|
-
styleInject(css_248z$
|
|
1551
|
+
var css_248z$x = ".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: 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}\n.MenuBody-module_menuBody__u4FIQ.MenuBody-module_shadow__OBp-f {\n box-shadow: var(--shadow);\n}";
|
|
1552
|
+
var styles$x = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
|
|
1553
|
+
styleInject(css_248z$x);
|
|
1554
1554
|
|
|
1555
1555
|
const MenuBody = (props) => {
|
|
1556
1556
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1581,8 +1581,8 @@ const MenuBody = (props) => {
|
|
|
1581
1581
|
}, [menuBodyRef]);
|
|
1582
1582
|
const getCssClasses = () => {
|
|
1583
1583
|
const cssClasses = [];
|
|
1584
|
-
cssClasses.push(styles$
|
|
1585
|
-
shadow && cssClasses.push(styles$
|
|
1584
|
+
cssClasses.push(styles$x.menuBody);
|
|
1585
|
+
shadow && cssClasses.push(styles$x.shadow);
|
|
1586
1586
|
className && cssClasses.push(className);
|
|
1587
1587
|
return cssClasses.filter(css => css).join(' ');
|
|
1588
1588
|
};
|
|
@@ -1630,23 +1630,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1630
1630
|
return children;
|
|
1631
1631
|
};
|
|
1632
1632
|
|
|
1633
|
-
var css_248z$
|
|
1634
|
-
var styles$
|
|
1635
|
-
styleInject(css_248z$
|
|
1633
|
+
var css_248z$w = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef;\n}";
|
|
1634
|
+
var styles$w = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
|
|
1635
|
+
styleInject(css_248z$w);
|
|
1636
1636
|
|
|
1637
|
-
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$
|
|
1637
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$w.menuItemDivider });
|
|
1638
1638
|
|
|
1639
|
-
var css_248z$
|
|
1640
|
-
var styles$
|
|
1641
|
-
styleInject(css_248z$
|
|
1639
|
+
var css_248z$v = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px;\n}";
|
|
1640
|
+
var styles$v = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
|
|
1641
|
+
styleInject(css_248z$v);
|
|
1642
1642
|
|
|
1643
1643
|
const ExpansionPanelContent = ({ children }) => {
|
|
1644
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1644
|
+
return (React__default["default"].createElement("div", { className: styles$v.expansionPanelContent }, children));
|
|
1645
1645
|
};
|
|
1646
1646
|
|
|
1647
|
-
var css_248z$
|
|
1648
|
-
var styles$
|
|
1649
|
-
styleInject(css_248z$
|
|
1647
|
+
var css_248z$u = ".ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px;\n}\n.ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq:hover {\n cursor: pointer;\n background-color: var(--highlight);\n}";
|
|
1648
|
+
var styles$u = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
|
|
1649
|
+
styleInject(css_248z$u);
|
|
1650
1650
|
|
|
1651
1651
|
const ExpansionPanelHeader = (props) => {
|
|
1652
1652
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1654,15 +1654,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1654
1654
|
e.stopPropagation();
|
|
1655
1655
|
onClick && onClick(e);
|
|
1656
1656
|
};
|
|
1657
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1657
|
+
return (React__default["default"].createElement("div", { className: styles$u.expansionPanelHeader, onClick: handleClick },
|
|
1658
1658
|
children,
|
|
1659
1659
|
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1660
1660
|
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1661
1661
|
};
|
|
1662
1662
|
|
|
1663
|
-
var css_248z$
|
|
1664
|
-
var styles$
|
|
1665
|
-
styleInject(css_248z$
|
|
1663
|
+
var css_248z$t = ".ExpansionPanel-module_expansionPanel__m1yQq {\n background-color: var(--white);\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}\n.ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_shadow__zIjJ6 {\n box-shadow: var(--shadow);\n}\n.ExpansionPanel-module_expansionPanel__m1yQq:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__m1yQq:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n}\n.ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:first-child {\n margin-top: 0;\n}\n.ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:last-child {\n margin-bottom: 0;\n}";
|
|
1664
|
+
var styles$t = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","shadow":"ExpansionPanel-module_shadow__zIjJ6","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
|
|
1665
|
+
styleInject(css_248z$t);
|
|
1666
1666
|
|
|
1667
1667
|
const ExpansionPanel = (props) => {
|
|
1668
1668
|
const { header, children, isExpanded = false, shadow, onChange } = props;
|
|
@@ -1672,11 +1672,11 @@ const ExpansionPanel = (props) => {
|
|
|
1672
1672
|
}, [isExpanded]);
|
|
1673
1673
|
const getCssClasses = () => {
|
|
1674
1674
|
const cssClasses = [];
|
|
1675
|
-
cssClasses.push(styles$
|
|
1675
|
+
cssClasses.push(styles$t.expansionPanel);
|
|
1676
1676
|
if (_isExpanded) {
|
|
1677
|
-
cssClasses.push(styles$
|
|
1677
|
+
cssClasses.push(styles$t.isExpanded);
|
|
1678
1678
|
}
|
|
1679
|
-
shadow && cssClasses.push(styles$
|
|
1679
|
+
shadow && cssClasses.push(styles$t.shadow);
|
|
1680
1680
|
return cssClasses.filter(css => css).join(' ');
|
|
1681
1681
|
};
|
|
1682
1682
|
const handleClickHeader = (event) => {
|
|
@@ -1689,17 +1689,17 @@ const ExpansionPanel = (props) => {
|
|
|
1689
1689
|
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1690
1690
|
};
|
|
1691
1691
|
|
|
1692
|
-
var css_248z$
|
|
1693
|
-
var styles$
|
|
1694
|
-
styleInject(css_248z$
|
|
1692
|
+
var css_248z$s = ".FloatingActionButton-module_fab__Rw3kd {\n box-shadow: var(--shadow);\n}\n\n.FloatingActionButton-module_fixed__XQOkG {\n position: fixed;\n z-index: 1000;\n}\n.FloatingActionButton-module_fixed__XQOkG.FloatingActionButton-module_leftTop__ZiHQN {\n top: 16px;\n left: 16px;\n}\n.FloatingActionButton-module_fixed__XQOkG.FloatingActionButton-module_leftBottom__210sl {\n bottom: 16px;\n left: 16px;\n}\n.FloatingActionButton-module_fixed__XQOkG.FloatingActionButton-module_rightTop__VUsvT {\n top: 64px;\n right: 16px;\n}\n.FloatingActionButton-module_fixed__XQOkG.FloatingActionButton-module_rightBottom__FaUFl {\n bottom: 16px;\n right: 16px;\n}";
|
|
1693
|
+
var styles$s = {"fab":"FloatingActionButton-module_fab__Rw3kd","fixed":"FloatingActionButton-module_fixed__XQOkG","leftTop":"FloatingActionButton-module_leftTop__ZiHQN","leftBottom":"FloatingActionButton-module_leftBottom__210sl","rightTop":"FloatingActionButton-module_rightTop__VUsvT","rightBottom":"FloatingActionButton-module_rightBottom__FaUFl"};
|
|
1694
|
+
styleInject(css_248z$s);
|
|
1695
1695
|
|
|
1696
1696
|
const FloatingActionButton = (props) => {
|
|
1697
1697
|
const { className, icon, color = exports.COLOR.primary, fixed, position = 'rightBottom', size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1698
1698
|
const getCssClasses = () => {
|
|
1699
1699
|
const cssClasses = [];
|
|
1700
|
-
cssClasses.push(styles$
|
|
1701
|
-
fixed && cssClasses.push(styles$
|
|
1702
|
-
position && fixed && cssClasses.push(styles$
|
|
1700
|
+
cssClasses.push(styles$s.fab);
|
|
1701
|
+
fixed && cssClasses.push(styles$s.fixed);
|
|
1702
|
+
position && fixed && cssClasses.push(styles$s[position]);
|
|
1703
1703
|
className && cssClasses.push(className);
|
|
1704
1704
|
return cssClasses.filter(css => css).join(' ');
|
|
1705
1705
|
};
|
|
@@ -1710,14 +1710,14 @@ const FloatingActionButton = (props) => {
|
|
|
1710
1710
|
return (React__default["default"].createElement(IconButton, { className: getCssClasses(), color: color, size: size, isActive: isActive, disabled: disabled, icon: icon, variant: exports.VARIANT.contained, onClick: handleClick }));
|
|
1711
1711
|
};
|
|
1712
1712
|
|
|
1713
|
-
var css_248z$
|
|
1714
|
-
var styles$
|
|
1715
|
-
styleInject(css_248z$
|
|
1713
|
+
var css_248z$r = ".Link-module_link__YlJQl {\n color: var(--primary);\n text-decoration: underline;\n}\n.Link-module_link__YlJQl:hover {\n color: var(--primary-dark);\n}";
|
|
1714
|
+
var styles$r = {"link":"Link-module_link__YlJQl"};
|
|
1715
|
+
styleInject(css_248z$r);
|
|
1716
1716
|
|
|
1717
1717
|
const Link = (props) => {
|
|
1718
1718
|
const { href = '#', className, target, children, ...rest } = props;
|
|
1719
1719
|
const [status, setStatus] = React.useState(exports.STATUS.NORMAL);
|
|
1720
|
-
const [cssClassName] = useCssClasses([styles$
|
|
1720
|
+
const [cssClassName] = useCssClasses([styles$r.link, className, status]);
|
|
1721
1721
|
const onMouseEnter = () => {
|
|
1722
1722
|
setStatus(exports.STATUS.HOVERED);
|
|
1723
1723
|
};
|
|
@@ -1727,14 +1727,14 @@ const Link = (props) => {
|
|
|
1727
1727
|
return (React__default["default"].createElement("a", { className: cssClassName, href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, ...rest }, children));
|
|
1728
1728
|
};
|
|
1729
1729
|
|
|
1730
|
-
var css_248z$
|
|
1731
|
-
var styles$
|
|
1732
|
-
styleInject(css_248z$
|
|
1730
|
+
var css_248z$q = ".LoadingIndicator-module_loadingIndicatorContainer__GS9OG {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n.LoadingIndicator-module_loadingIndicatorContainer__GS9OG.LoadingIndicator-module_isFixed__WCFNG {\n position: fixed;\n top: 0;\n left: 0;\n}\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\n@keyframes LoadingIndicator-module_spinAnimation__LeY4Z {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}";
|
|
1731
|
+
var styles$q = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","isFixed":"LoadingIndicator-module_isFixed__WCFNG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
|
|
1732
|
+
styleInject(css_248z$q);
|
|
1733
1733
|
|
|
1734
1734
|
const LoadingIndicator = ({ ...rest }) => {
|
|
1735
1735
|
const getCssClasses = () => {
|
|
1736
1736
|
const cssClasses = [];
|
|
1737
|
-
cssClasses.push(styles$
|
|
1737
|
+
cssClasses.push(styles$q.loadingIndicator);
|
|
1738
1738
|
return cssClasses.filter(css => css).join(' ');
|
|
1739
1739
|
};
|
|
1740
1740
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest },
|
|
@@ -1744,8 +1744,8 @@ const LoadingIndicator = ({ ...rest }) => {
|
|
|
1744
1744
|
const LoadingIndicatorContainer = ({ children, isFixed }) => {
|
|
1745
1745
|
const getCssClasses = () => {
|
|
1746
1746
|
const cssClasses = [];
|
|
1747
|
-
cssClasses.push(styles$
|
|
1748
|
-
isFixed && cssClasses.push(styles$
|
|
1747
|
+
cssClasses.push(styles$q.loadingIndicatorContainer);
|
|
1748
|
+
isFixed && cssClasses.push(styles$q.isFixed);
|
|
1749
1749
|
return cssClasses.filter(css => css).join(' ');
|
|
1750
1750
|
};
|
|
1751
1751
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1807,45 +1807,45 @@ class LoadingIndicatorService {
|
|
|
1807
1807
|
}
|
|
1808
1808
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1809
1809
|
|
|
1810
|
-
var css_248z$
|
|
1811
|
-
var styles$
|
|
1812
|
-
styleInject(css_248z$
|
|
1810
|
+
var css_248z$p = ".ModalHeader-module_modalHeader__tw-u- {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n padding: 1rem 1rem;\n border-top-left-radius: calc(0.3rem - 1px);\n border-top-right-radius: calc(0.3rem - 1px);\n border-bottom: none;\n align-items: center;\n}\n\n.ModalHeader-module_modalTitle__2xShH {\n margin-bottom: 0;\n line-height: 1.5;\n}";
|
|
1811
|
+
var styles$p = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-","modalTitle":"ModalHeader-module_modalTitle__2xShH"};
|
|
1812
|
+
styleInject(css_248z$p);
|
|
1813
1813
|
|
|
1814
1814
|
const ModalHeader = (props) => {
|
|
1815
1815
|
const { children, isDismissable = false, onClose, ...rest } = props;
|
|
1816
1816
|
const handleClick = () => {
|
|
1817
1817
|
onClose && onClose();
|
|
1818
1818
|
};
|
|
1819
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1820
|
-
React__default["default"].createElement("h5", { className: styles$
|
|
1819
|
+
return (React__default["default"].createElement("div", { className: styles$p.modalHeader, ...rest },
|
|
1820
|
+
React__default["default"].createElement("h5", { className: styles$p.modalTitle }, children),
|
|
1821
1821
|
isDismissable &&
|
|
1822
1822
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
1823
1823
|
};
|
|
1824
1824
|
|
|
1825
|
-
var css_248z$
|
|
1826
|
-
var styles$
|
|
1827
|
-
styleInject(css_248z$
|
|
1825
|
+
var css_248z$o = ".ModalBody-module_modalBody__D-gk2 {\n position: relative;\n flex: 1 1 auto;\n padding: 1rem;\n}";
|
|
1826
|
+
var styles$o = {"modalBody":"ModalBody-module_modalBody__D-gk2"};
|
|
1827
|
+
styleInject(css_248z$o);
|
|
1828
1828
|
|
|
1829
|
-
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: styles$
|
|
1829
|
+
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: styles$o.modalBody }, children));
|
|
1830
1830
|
|
|
1831
|
-
var css_248z$
|
|
1832
|
-
var styles$
|
|
1833
|
-
styleInject(css_248z$
|
|
1831
|
+
var css_248z$n = ".ModalFooter-module_modalFooter__SNm-f {\n display: flex;\n flex-wrap: wrap;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n padding: 0.75rem;\n border-bottom-right-radius: calc(0.3rem - 1px);\n border-bottom-left-radius: calc(0.3rem - 1px);\n}\n.ModalFooter-module_modalFooter__SNm-f > * {\n margin: 0.25rem;\n}";
|
|
1832
|
+
var styles$n = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1833
|
+
styleInject(css_248z$n);
|
|
1834
1834
|
|
|
1835
|
-
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: styles$
|
|
1835
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: styles$n.modalFooter }, children));
|
|
1836
1836
|
|
|
1837
|
-
var css_248z$
|
|
1838
|
-
var styles$
|
|
1839
|
-
styleInject(css_248z$
|
|
1837
|
+
var css_248z$m = ".Modal-module_modal__HMxWV {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n z-index: 1111 !important;\n border-radius: var(--borderRadius);\n}\n.Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf .Modal-module_sm__CsR6U {\n max-width: 300px;\n}\n.Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf .Modal-module_md__lNggx {\n max-width: 500px;\n}\n.Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf .Modal-module_lg__6dtT2 {\n max-width: 1140px;\n}\n@media (min-width: 576px) {\n .Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf {\n max-width: 600px;\n }\n}\n\n.Modal-module_modalDialog__fNqyK {\n position: relative;\n width: auto;\n pointer-events: none;\n}\n\n.Modal-module_modalDialogCentered__sa2wv {\n min-height: calc(100% - 3.5rem);\n display: flex;\n align-items: center;\n}\n\n.Modal-module_modalContent__9wAwB {\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%;\n pointer-events: auto;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid rgba(0, 0, 0, 0.2);\n border-radius: 0.3rem;\n box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.08);\n outline: 0;\n}\n@media (min-width: 576px) {\n .Modal-module_modalContent__9wAwB {\n max-width: 500px;\n margin: 1.75rem auto;\n }\n}\n\n.Modal-module_fullscreen__iepGa {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0;\n}\n.Modal-module_fullscreen__iepGa .Modal-module_modalContent__9wAwB {\n height: auto;\n min-height: 100%;\n max-height: 100%;\n border-radius: 0;\n overflow: auto;\n max-width: 100%;\n}\n@media (min-width: 320px) {\n .Modal-module_fullscreen__iepGa {\n max-width: 100% !important;\n }\n}";
|
|
1838
|
+
var styles$m = {"modal":"Modal-module_modal__HMxWV","modal-dialog":"Modal-module_modal-dialog__U2wGf","sm":"Modal-module_sm__CsR6U","md":"Modal-module_md__lNggx","lg":"Modal-module_lg__6dtT2","modalDialog":"Modal-module_modalDialog__fNqyK","modalDialogCentered":"Modal-module_modalDialogCentered__sa2wv","modalContent":"Modal-module_modalContent__9wAwB","fullscreen":"Modal-module_fullscreen__iepGa"};
|
|
1839
|
+
styleInject(css_248z$m);
|
|
1840
1840
|
|
|
1841
1841
|
const Modal = (props) => {
|
|
1842
1842
|
const { target = document.body, className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1843
1843
|
const getCssClass = () => {
|
|
1844
1844
|
const cssClasses = [];
|
|
1845
|
-
cssClasses.push(styles$
|
|
1846
|
-
cssClasses.push(styles$
|
|
1847
|
-
fullScreen && cssClasses.push(styles$
|
|
1848
|
-
size && cssClasses.push(styles$
|
|
1845
|
+
cssClasses.push(styles$m.modalDialog);
|
|
1846
|
+
cssClasses.push(styles$m.modalDialogCentered);
|
|
1847
|
+
fullScreen && cssClasses.push(styles$m.fullscreen);
|
|
1848
|
+
size && cssClasses.push(styles$m[size]);
|
|
1849
1849
|
className && cssClasses.push(className);
|
|
1850
1850
|
return cssClasses.filter(r => r).join(' ');
|
|
1851
1851
|
};
|
|
@@ -1860,9 +1860,9 @@ const Modal = (props) => {
|
|
|
1860
1860
|
};
|
|
1861
1861
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1862
1862
|
React__default["default"].createElement(Portal, { className: 'modal-root', target: target },
|
|
1863
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1863
|
+
React__default["default"].createElement("div", { className: styles$m.modal },
|
|
1864
1864
|
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1865
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1865
|
+
React__default["default"].createElement("div", { className: styles$m.modalContent },
|
|
1866
1866
|
header &&
|
|
1867
1867
|
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1868
1868
|
React__default["default"].createElement(ModalBody, null, children),
|
|
@@ -2004,9 +2004,9 @@ const NumberSelect = (props) => {
|
|
|
2004
2004
|
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: numberOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
2005
2005
|
};
|
|
2006
2006
|
|
|
2007
|
-
var css_248z$
|
|
2008
|
-
var styles$
|
|
2009
|
-
styleInject(css_248z$
|
|
2007
|
+
var css_248z$l = ".Tooltip-module_tooltipContainer__9ZWx3 {\n display: inline;\n}\n\n.Tooltip-module_tooltip__x5HOu {\n background-color: #333;\n color: white;\n padding: 5px 10px;\n border-radius: 4px;\n font-size: 13px;\n position: absolute;\n left: -1000000px;\n z-index: 1100;\n}\n.Tooltip-module_tooltip__x5HOu #Tooltip-module_arrow__B6lfe,\n.Tooltip-module_tooltip__x5HOu #Tooltip-module_arrow__B6lfe::before {\n position: absolute;\n width: 8px;\n height: 8px;\n z-index: -1;\n}\n.Tooltip-module_tooltip__x5HOu #Tooltip-module_arrow__B6lfe::before {\n content: \"\";\n transform: rotate(45deg);\n background: #333;\n}\n.Tooltip-module_tooltip__x5HOu[data-popper-placement^=top] > #Tooltip-module_arrow__B6lfe {\n bottom: -4px;\n}\n.Tooltip-module_tooltip__x5HOu[data-popper-placement^=bottom] > #Tooltip-module_arrow__B6lfe {\n top: -4px;\n}\n.Tooltip-module_tooltip__x5HOu[data-popper-placement^=left] > #Tooltip-module_arrow__B6lfe {\n right: -4px;\n}\n.Tooltip-module_tooltip__x5HOu[data-popper-placement^=right] > #Tooltip-module_arrow__B6lfe {\n left: -4px;\n}";
|
|
2008
|
+
var styles$l = {"tooltipContainer":"Tooltip-module_tooltipContainer__9ZWx3","tooltip":"Tooltip-module_tooltip__x5HOu","arrow":"Tooltip-module_arrow__B6lfe"};
|
|
2009
|
+
styleInject(css_248z$l);
|
|
2010
2010
|
|
|
2011
2011
|
const Tooltip = (props) => {
|
|
2012
2012
|
const { children, text, placement = 'bottom' } = props;
|
|
@@ -2034,19 +2034,19 @@ const Tooltip = (props) => {
|
|
|
2034
2034
|
setShow(false);
|
|
2035
2035
|
};
|
|
2036
2036
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
2037
|
-
React__default["default"].createElement("div", { className: styles$
|
|
2037
|
+
React__default["default"].createElement("div", { className: styles$l.tooltipContainer, ref: refChild, id: "tooltip-container" }, React.cloneElement(children, {
|
|
2038
2038
|
onMouseOver: handleMouseOver,
|
|
2039
2039
|
onMouseLeave: handleMouseLeave,
|
|
2040
2040
|
})),
|
|
2041
2041
|
show && text &&
|
|
2042
|
-
React__default["default"].createElement("div", { className: styles$
|
|
2042
|
+
React__default["default"].createElement("div", { className: styles$l.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2043
2043
|
text,
|
|
2044
2044
|
React__default["default"].createElement("div", { id: "arrow", "data-popper-arrow": true }))));
|
|
2045
2045
|
};
|
|
2046
2046
|
|
|
2047
|
-
var css_248z$
|
|
2048
|
-
var styles$
|
|
2049
|
-
styleInject(css_248z$
|
|
2047
|
+
var css_248z$k = ":root {\n --progress-height: 0.5rem;\n --progress-bg: #e9ecef;\n --progress-box-shadow: var(--shadow);\n --progress-bar-color: #fff;\n --progress-bar-bg: var(--primary);\n --progress-bar-transition: width 0.6s ease;\n}\n\n.ProgressBar-module_progressBarContainer__vtbBw {\n display: flex;\n height: var(--progress-height);\n overflow: hidden;\n background-color: var(--progress-bg);\n}\n\n.ProgressBar-module_progressBar__hr8I8 {\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n color: var(--progress-bar-color);\n text-align: center;\n white-space: nowrap;\n transition: var(--progress-bar-transition);\n background-color: var(--progress-bar-bg);\n}\n.ProgressBar-module_progressBar__hr8I8.ProgressBar-module_indeterminate__WcQdD {\n width: 100%;\n height: 100%;\n animation: ProgressBar-module_indeterminateAnimation__SlBFt 1s infinite linear;\n transform-origin: 0% 50%;\n}\n\n@keyframes ProgressBar-module_indeterminateAnimation__SlBFt {\n 0% {\n transform: translateX(0) scaleX(0);\n }\n 40% {\n transform: translateX(0) scaleX(0.4);\n }\n 100% {\n transform: translateX(100%) scaleX(0.5);\n }\n}";
|
|
2048
|
+
var styles$k = {"progressBarContainer":"ProgressBar-module_progressBarContainer__vtbBw","progressBar":"ProgressBar-module_progressBar__hr8I8","indeterminate":"ProgressBar-module_indeterminate__WcQdD","indeterminateAnimation":"ProgressBar-module_indeterminateAnimation__SlBFt"};
|
|
2049
|
+
styleInject(css_248z$k);
|
|
2050
2050
|
|
|
2051
2051
|
const ProgressBar = (props) => {
|
|
2052
2052
|
const { className, color = exports.COLOR.primary, value, indeterminate, ...rest } = props;
|
|
@@ -2066,14 +2066,14 @@ const ProgressBar = (props) => {
|
|
|
2066
2066
|
}, [value]);
|
|
2067
2067
|
const getCssClasses = () => {
|
|
2068
2068
|
const cssClasses = [];
|
|
2069
|
-
cssClasses.push(styles$
|
|
2069
|
+
cssClasses.push(styles$k.progressBarContainer);
|
|
2070
2070
|
className && cssClasses.push(className);
|
|
2071
2071
|
return cssClasses.filter(r => r).join(' ');
|
|
2072
2072
|
};
|
|
2073
2073
|
const getCssClassesBar = () => {
|
|
2074
2074
|
const cssClasses = [];
|
|
2075
|
-
cssClasses.push(styles$
|
|
2076
|
-
indeterminate && cssClasses.push(styles$
|
|
2075
|
+
cssClasses.push(styles$k.progressBar);
|
|
2076
|
+
indeterminate && cssClasses.push(styles$k['indeterminate']);
|
|
2077
2077
|
return cssClasses.filter(r => r).join(' ');
|
|
2078
2078
|
};
|
|
2079
2079
|
const getStyle = () => {
|
|
@@ -2165,25 +2165,25 @@ const Sidebar = (props) => {
|
|
|
2165
2165
|
!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)))))))))));
|
|
2166
2166
|
};
|
|
2167
2167
|
|
|
2168
|
-
var css_248z$
|
|
2169
|
-
var styles$
|
|
2170
|
-
styleInject(css_248z$
|
|
2168
|
+
var css_248z$j = ".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}\n.Snackbar-module_snackbar__O5T2b.Snackbar-module_primary__ZBOTN {\n color: var(--primary-contrast-text);\n background-color: var(--primary);\n}\n.Snackbar-module_snackbar__O5T2b.Snackbar-module_accent__0MnFy {\n color: var(--accent-contrast-text);\n background-color: var(--accent);\n}\n.Snackbar-module_snackbar__O5T2b.Snackbar-module_secondary__s8-ez {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary);\n}\n.Snackbar-module_snackbar__O5T2b.Snackbar-module_light__Vrd7o {\n color: var(--light-contrast-text);\n background-color: var(--light);\n}\n.Snackbar-module_snackbar__O5T2b.Snackbar-module_dark__U-5io {\n color: var(--dark-contrast-text);\n background-color: var(--dark);\n}\n\n.Snackbar-module_text__G5r5D {\n width: 100%;\n padding: 8px 0;\n}\n\n.Snackbar-module_action__vus2Y {\n margin-left: auto;\n}\n.Snackbar-module_action__vus2Y:hover {\n cursor: pointer;\n}\n\n@keyframes Snackbar-module_bounceIn__E47iD {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 0.9;\n }\n 80% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n }\n}";
|
|
2169
|
+
var styles$j = {"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"};
|
|
2170
|
+
styleInject(css_248z$j);
|
|
2171
2171
|
|
|
2172
2172
|
const Snackbar = (props) => {
|
|
2173
2173
|
const { children, color = exports.COLOR.dark, actionText = 'ok', onOk, ...rest } = props;
|
|
2174
2174
|
const getCssClasses = () => {
|
|
2175
2175
|
const cssClasses = [];
|
|
2176
|
-
cssClasses.push(styles$
|
|
2176
|
+
cssClasses.push(styles$j.snackbar);
|
|
2177
2177
|
cssClasses.push(`shadow-lg`);
|
|
2178
|
-
cssClasses.push(styles$
|
|
2178
|
+
cssClasses.push(styles$j[color]);
|
|
2179
2179
|
return cssClasses.filter(css => css).join(' ');
|
|
2180
2180
|
};
|
|
2181
2181
|
const handleClickAction = (e) => {
|
|
2182
2182
|
onOk && onOk(e);
|
|
2183
2183
|
};
|
|
2184
2184
|
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest },
|
|
2185
|
-
React__default["default"].createElement("div", { className: styles$
|
|
2186
|
-
React__default["default"].createElement("div", { className: styles$
|
|
2185
|
+
React__default["default"].createElement("div", { className: styles$j.text }, children),
|
|
2186
|
+
React__default["default"].createElement("div", { className: styles$j.action + ' text-accent', onClick: handleClickAction },
|
|
2187
2187
|
React__default["default"].createElement("span", null, actionText))));
|
|
2188
2188
|
};
|
|
2189
2189
|
|
|
@@ -2222,29 +2222,29 @@ class SnackbarService {
|
|
|
2222
2222
|
}
|
|
2223
2223
|
const snackbarService = new SnackbarService();
|
|
2224
2224
|
|
|
2225
|
-
var css_248z$
|
|
2226
|
-
var styles$
|
|
2227
|
-
styleInject(css_248z$
|
|
2225
|
+
var css_248z$i = ".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}";
|
|
2226
|
+
var styles$i = {"speedDialActions":"SpeedDialActions-module_speedDialActions__cY2i3"};
|
|
2227
|
+
styleInject(css_248z$i);
|
|
2228
2228
|
|
|
2229
2229
|
const SpeedDialActions = (props) => {
|
|
2230
2230
|
const { children } = props;
|
|
2231
2231
|
const getCssClasses = () => {
|
|
2232
2232
|
const cssClasses = [];
|
|
2233
|
-
cssClasses.push(styles$
|
|
2233
|
+
cssClasses.push(styles$i.speedDialActions);
|
|
2234
2234
|
return cssClasses.filter(css => css).join(' ');
|
|
2235
2235
|
};
|
|
2236
2236
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
2237
2237
|
};
|
|
2238
2238
|
|
|
2239
|
-
var css_248z$
|
|
2240
|
-
var styles$
|
|
2241
|
-
styleInject(css_248z$
|
|
2239
|
+
var css_248z$h = ".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}";
|
|
2240
|
+
var styles$h = {"speedDial":"SpeedDial-module_speedDial__W3VN2"};
|
|
2241
|
+
styleInject(css_248z$h);
|
|
2242
2242
|
|
|
2243
2243
|
const SpeedDial = (props) => {
|
|
2244
2244
|
const { children, className, open, onOpen, onClose, ...rest } = props;
|
|
2245
2245
|
const getCssClasses = () => {
|
|
2246
2246
|
const cssClasses = [];
|
|
2247
|
-
cssClasses.push(styles$
|
|
2247
|
+
cssClasses.push(styles$h.speedDial);
|
|
2248
2248
|
className && cssClasses.push(className);
|
|
2249
2249
|
return cssClasses.filter(css => css).join(' ');
|
|
2250
2250
|
};
|
|
@@ -2263,15 +2263,15 @@ const SpeedDial = (props) => {
|
|
|
2263
2263
|
React__default["default"].createElement(SpeedDialActions, null, children)));
|
|
2264
2264
|
};
|
|
2265
2265
|
|
|
2266
|
-
var css_248z$
|
|
2267
|
-
var styles$
|
|
2268
|
-
styleInject(css_248z$
|
|
2266
|
+
var css_248z$g = ".SpeedDialAction-module_speedDialAction__kJLpz + .SpeedDialAction-module_speedDialAction__kJLpz {\n margin-bottom: 10px;\n}";
|
|
2267
|
+
var styles$g = {"speedDialAction":"SpeedDialAction-module_speedDialAction__kJLpz"};
|
|
2268
|
+
styleInject(css_248z$g);
|
|
2269
2269
|
|
|
2270
2270
|
const SpeedDialAction = (props) => {
|
|
2271
2271
|
const { icon, color = exports.COLOR.light, onClick, className } = props;
|
|
2272
2272
|
const getCssClasses = () => {
|
|
2273
2273
|
const cssClasses = [];
|
|
2274
|
-
cssClasses.push(styles$
|
|
2274
|
+
cssClasses.push(styles$g.speedDialAction);
|
|
2275
2275
|
className && cssClasses.push(className);
|
|
2276
2276
|
return cssClasses.filter(css => css).join(' ');
|
|
2277
2277
|
};
|
|
@@ -2288,15 +2288,15 @@ const SpeedDialIcon = (props) => {
|
|
|
2288
2288
|
return (React__default["default"].createElement(Icon, { className: getCssClasses(), ...rest }, children));
|
|
2289
2289
|
};
|
|
2290
2290
|
|
|
2291
|
-
var css_248z$
|
|
2292
|
-
var styles$
|
|
2293
|
-
styleInject(css_248z$
|
|
2291
|
+
var css_248z$f = ".StepperActions-module_stepperActions__hBUkh {\n display: flex;\n}";
|
|
2292
|
+
var styles$f = {"stepperActions":"StepperActions-module_stepperActions__hBUkh"};
|
|
2293
|
+
styleInject(css_248z$f);
|
|
2294
2294
|
|
|
2295
2295
|
const StepperActions = (props) => {
|
|
2296
2296
|
const { className, showDoneButton, showResetButton, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
|
|
2297
2297
|
const getCssClasses = () => {
|
|
2298
2298
|
const cssClasses = [];
|
|
2299
|
-
cssClasses.push(styles$
|
|
2299
|
+
cssClasses.push(styles$f.stepperActions);
|
|
2300
2300
|
className && cssClasses.push(className);
|
|
2301
2301
|
return cssClasses.filter(css => css).join(' ');
|
|
2302
2302
|
};
|
|
@@ -2317,34 +2317,51 @@ const StepPanel = (props) => {
|
|
|
2317
2317
|
return (React__default["default"].createElement("div", { className: "steppanel" }, children));
|
|
2318
2318
|
};
|
|
2319
2319
|
|
|
2320
|
-
var css_248z$
|
|
2321
|
-
var styles$
|
|
2322
|
-
styleInject(css_248z$
|
|
2320
|
+
var css_248z$e = ".StepConnector-module_stepConnector__A7A-7 {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px;\n}\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}\n.StepConnector-module_stepConnectorLine__8rQxv.StepConnector-module_isActive__TUIKV {\n border-color: var(--primary);\n}\n\n.StepConnector-module_stepConnectorLineHorizontal__i09K0 {\n border-top-style: solid;\n border-top-width: 1px;\n}";
|
|
2321
|
+
var styles$e = {"stepConnector":"StepConnector-module_stepConnector__A7A-7","stepConnectorLine":"StepConnector-module_stepConnectorLine__8rQxv","isActive":"StepConnector-module_isActive__TUIKV","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__i09K0"};
|
|
2322
|
+
styleInject(css_248z$e);
|
|
2323
2323
|
|
|
2324
2324
|
const StepConnector = (props) => {
|
|
2325
2325
|
const { isActive, isHorizontal = true } = props;
|
|
2326
2326
|
const getCssClassesConnector = () => {
|
|
2327
2327
|
const cssClasses = [];
|
|
2328
|
-
cssClasses.push(styles$
|
|
2328
|
+
cssClasses.push(styles$e.stepConnector);
|
|
2329
2329
|
return cssClasses.filter(css => css).join(' ');
|
|
2330
2330
|
};
|
|
2331
2331
|
const getCssClassesLine = () => {
|
|
2332
2332
|
const cssClasses = [];
|
|
2333
|
-
cssClasses.push(styles$
|
|
2334
|
-
isActive && cssClasses.push(styles$
|
|
2335
|
-
isHorizontal && cssClasses.push(styles$
|
|
2333
|
+
cssClasses.push(styles$e.stepConnectorLine);
|
|
2334
|
+
isActive && cssClasses.push(styles$e['isActive']);
|
|
2335
|
+
isHorizontal && cssClasses.push(styles$e.stepConnectorLineHorizontal);
|
|
2336
2336
|
return cssClasses.filter(css => css).join(' ');
|
|
2337
2337
|
};
|
|
2338
2338
|
return (React__default["default"].createElement("div", { className: getCssClassesConnector() },
|
|
2339
2339
|
React__default["default"].createElement("div", { className: getCssClassesLine() })));
|
|
2340
2340
|
};
|
|
2341
2341
|
|
|
2342
|
-
var css_248z$
|
|
2343
|
-
var styles$
|
|
2342
|
+
var css_248z$d = ".Stepper-module_stepper__V6odG {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px;\n}\n.Stepper-module_stepper__V6odG.Stepper-module_isHorizontal__Q-3Wu {\n overflow-x: auto;\n}";
|
|
2343
|
+
var styles$d = {"stepper":"Stepper-module_stepper__V6odG","isHorizontal":"Stepper-module_isHorizontal__Q-3Wu"};
|
|
2344
|
+
styleInject(css_248z$d);
|
|
2345
|
+
|
|
2346
|
+
var css_248z$c = ".Dot-module_dot__w59yb {\n transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n border-radius: 50%;\n width: 8px;\n height: 8px;\n margin: 0px 2px;\n background-color: var(--secondary);\n}\n.Dot-module_dot__w59yb.Dot-module_isActive__V74RJ {\n background-color: var(--primary);\n}";
|
|
2347
|
+
var styles$c = {"dot":"Dot-module_dot__w59yb","isActive":"Dot-module_isActive__V74RJ"};
|
|
2344
2348
|
styleInject(css_248z$c);
|
|
2345
2349
|
|
|
2350
|
+
const Dot = (props) => {
|
|
2351
|
+
const { className, color = exports.COLOR.primary, isActive, ...rest } = props;
|
|
2352
|
+
const getCssClasses = () => {
|
|
2353
|
+
const cssClasses = [];
|
|
2354
|
+
cssClasses.push(styles$c.dot);
|
|
2355
|
+
cssClasses.push(styles$c[color]);
|
|
2356
|
+
isActive && cssClasses.push(styles$c.isActive);
|
|
2357
|
+
className && cssClasses.push(className);
|
|
2358
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2359
|
+
};
|
|
2360
|
+
return (React__default["default"].createElement("div", { className: getCssClasses(), ...rest }));
|
|
2361
|
+
};
|
|
2362
|
+
|
|
2346
2363
|
const Stepper = (props) => {
|
|
2347
|
-
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, showDoneButton, showResetButton, onChange, onFinish } = props;
|
|
2364
|
+
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, showDoneButton, showResetButton, showSteps = true, showDots, onChange, onFinish } = props;
|
|
2348
2365
|
const [steps, setSteps] = React.useState();
|
|
2349
2366
|
const [activeIndex, setActiveIndex] = React__default["default"].useState(0);
|
|
2350
2367
|
const [skipped, setSkipped] = React__default["default"].useState(new Set());
|
|
@@ -2429,18 +2446,21 @@ const Stepper = (props) => {
|
|
|
2429
2446
|
};
|
|
2430
2447
|
const getCssClasses = () => {
|
|
2431
2448
|
const cssClasses = [];
|
|
2432
|
-
cssClasses.push(styles$
|
|
2433
|
-
isHorizontal && cssClasses.push(styles$
|
|
2449
|
+
cssClasses.push(styles$d.stepper);
|
|
2450
|
+
isHorizontal && cssClasses.push(styles$d['isHorizontal']);
|
|
2434
2451
|
return cssClasses.filter(css => css).join(' ');
|
|
2435
2452
|
};
|
|
2436
2453
|
return (React__default["default"].createElement(React__default["default"].Fragment, null, steps &&
|
|
2437
2454
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
2438
|
-
|
|
2439
|
-
|
|
2440
|
-
|
|
2455
|
+
showSteps &&
|
|
2456
|
+
React__default["default"].createElement("div", { className: getCssClasses() }, steps.map((child, index) => (React__default["default"].createElement(React.Fragment, { key: child.props.value },
|
|
2457
|
+
renderSteps(child, index),
|
|
2458
|
+
index !== steps.length - 1 && React__default["default"].createElement(StepConnector, { isActive: activeIndex > index }))))),
|
|
2441
2459
|
steps && steps.map((step, index) => React__default["default"].createElement(React.Fragment, { key: step.props.value }, index === activeIndex &&
|
|
2442
2460
|
React__default["default"].createElement(StepPanel, null, step.props.children))),
|
|
2443
|
-
React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset, showDoneButton: showDoneButton, showResetButton: showResetButton })
|
|
2461
|
+
React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset, showDoneButton: showDoneButton, showResetButton: showResetButton }),
|
|
2462
|
+
steps && showDots &&
|
|
2463
|
+
React__default["default"].createElement("div", { className: 'd-flex mt-2 align-items-center justify-content-center' }, steps.map((step, index) => React__default["default"].createElement(Dot, { key: index, isActive: activeIndex >= index }))))));
|
|
2444
2464
|
};
|
|
2445
2465
|
|
|
2446
2466
|
var css_248z$b = ".Typography-module_typography__sw-td {\n font-family: var(--fontFamily);\n}\n.Typography-module_typography__sw-td.Typography-module_wrap__W7G0R {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\nh1 {\n font-size: calc(1.375rem + 1.5vw);\n}\n\nh2 {\n font-size: calc(1.325rem + 0.9vw);\n}\n\nh3 {\n font-size: calc(1.3rem + 0.6vw);\n}\n\nh4 {\n font-size: calc(1.275rem + 0.3vw);\n}\n\nh5 {\n font-size: 1.25rem;\n}\n\nh6 {\n font-size: 1rem;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-weight: 500 !important;\n margin-top: 0;\n margin-bottom: 0.5rem;\n line-height: 1.2;\n}";
|
|
@@ -2940,6 +2960,7 @@ exports.ConditionalWrapper = ConditionalWrapper;
|
|
|
2940
2960
|
exports.CssTransition = CssTransition;
|
|
2941
2961
|
exports.DateSelect = DateSelect;
|
|
2942
2962
|
exports.DaySelect = DaySelect;
|
|
2963
|
+
exports.Dot = Dot;
|
|
2943
2964
|
exports.Drawer = Drawer;
|
|
2944
2965
|
exports.EmailValidator = EmailValidator;
|
|
2945
2966
|
exports.ExpansionPanel = ExpansionPanel;
|