react-asc 23.4.1 → 23.5.2
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/Form/validators/MaxValidator.d.ts +1 -0
- package/components/Form/validators/index.d.ts +1 -0
- package/components/ProgressBar/ProgressBar.d.ts +9 -0
- package/components/ProgressBar/index.d.ts +1 -0
- package/components/index.d.ts +1 -0
- package/index.es.js +296 -264
- package/index.js +297 -263
- package/package.json +1 -1
- package/react-asc.scss +11 -0
package/index.js
CHANGED
|
@@ -95,93 +95,93 @@ function styleInject(css, ref) {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
|
|
98
|
-
var css_248z$
|
|
99
|
-
var styles$
|
|
100
|
-
styleInject(css_248z$
|
|
98
|
+
var css_248z$11 = ".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}";
|
|
99
|
+
var styles$11 = {"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"};
|
|
100
|
+
styleInject(css_248z$11);
|
|
101
101
|
|
|
102
102
|
const Alert = (props) => {
|
|
103
103
|
const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
104
104
|
const getCssClasses = () => {
|
|
105
105
|
const cssClasses = [];
|
|
106
|
-
cssClasses.push(styles$
|
|
106
|
+
cssClasses.push(styles$11.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$11.contained);
|
|
109
|
+
cssClasses.push(styles$11[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$11.outline);
|
|
113
|
+
cssClasses.push(styles$11[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$11['shadow']);
|
|
116
116
|
className && cssClasses.push(className);
|
|
117
117
|
return cssClasses.filter(r => r).join(' ');
|
|
118
118
|
};
|
|
119
119
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var css_248z
|
|
123
|
-
var styles
|
|
124
|
-
styleInject(css_248z
|
|
122
|
+
var css_248z$10 = ".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: var(--shadow);\n}";
|
|
123
|
+
var styles$10 = {"appbar":"AppBar-module_appbar__Neyh3","primary":"AppBar-module_primary__xMqXD","secondary":"AppBar-module_secondary__8MkLA","accent":"AppBar-module_accent__vHbkp","light":"AppBar-module_light__HGy3y","dark":"AppBar-module_dark__ILq96","shadow":"AppBar-module_shadow__gQN8s"};
|
|
124
|
+
styleInject(css_248z$10);
|
|
125
125
|
|
|
126
126
|
const AppBar = (props) => {
|
|
127
127
|
const { children, className, color = exports.COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
128
128
|
const getCssClasses = () => {
|
|
129
129
|
const cssClasses = [];
|
|
130
|
-
cssClasses.push(styles
|
|
131
|
-
cssClasses.push(styles
|
|
132
|
-
shadow && cssClasses.push(styles
|
|
130
|
+
cssClasses.push(styles$10[color]);
|
|
131
|
+
cssClasses.push(styles$10.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$10['shadow']);
|
|
133
133
|
className && cssClasses.push(className);
|
|
134
134
|
return cssClasses.filter(r => r).join(' ');
|
|
135
135
|
};
|
|
136
136
|
return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
137
137
|
};
|
|
138
138
|
|
|
139
|
-
var css_248z
|
|
140
|
-
var styles
|
|
141
|
-
styleInject(css_248z
|
|
139
|
+
var css_248z$$ = ".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}";
|
|
140
|
+
var styles$$ = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
|
|
141
|
+
styleInject(css_248z$$);
|
|
142
142
|
|
|
143
143
|
const AppBarTitle = (props) => {
|
|
144
144
|
const { children, className, onClick } = props;
|
|
145
145
|
const getCssClass = () => {
|
|
146
146
|
const cssClasses = [];
|
|
147
|
-
cssClasses.push(styles
|
|
147
|
+
cssClasses.push(styles$$.appbarTitle);
|
|
148
148
|
className && cssClasses.push(className);
|
|
149
149
|
return cssClasses.filter(r => r).join(' ');
|
|
150
150
|
};
|
|
151
151
|
return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
152
152
|
};
|
|
153
153
|
|
|
154
|
-
var css_248z$
|
|
155
|
-
var styles$
|
|
156
|
-
styleInject(css_248z$
|
|
154
|
+
var css_248z$_ = ".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}";
|
|
155
|
+
var styles$_ = {"icon":"Icon-module_icon__lFKCA","primary":"Icon-module_primary__3fID-","accent":"Icon-module_accent__aZXGb","secondary":"Icon-module_secondary__HKKop","light":"Icon-module_light__-ApMm","dark":"Icon-module_dark__DpCIK"};
|
|
156
|
+
styleInject(css_248z$_);
|
|
157
157
|
|
|
158
158
|
const Icon = (props) => {
|
|
159
159
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
160
160
|
const getCssClasses = () => {
|
|
161
161
|
const cssClasses = [];
|
|
162
|
-
cssClasses.push(styles$
|
|
163
|
-
iconColor && cssClasses.push(styles$
|
|
162
|
+
cssClasses.push(styles$_.icon);
|
|
163
|
+
iconColor && cssClasses.push(styles$_[iconColor]);
|
|
164
164
|
className && cssClasses.push(className);
|
|
165
165
|
return cssClasses.filter(css => css).join(' ');
|
|
166
166
|
};
|
|
167
167
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
168
168
|
};
|
|
169
169
|
|
|
170
|
-
var css_248z$
|
|
171
|
-
var styles$
|
|
172
|
-
styleInject(css_248z$
|
|
170
|
+
var css_248z$Z = ".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}";
|
|
171
|
+
var styles$Z = {"iconButton":"IconButton-module_iconButton__rpCPQ","shadow":"IconButton-module_shadow__Uw0RK","md":"IconButton-module_md__XnuSk","lg":"IconButton-module_lg__arEvo","text":"IconButton-module_text__Ualag","active":"IconButton-module_active__VIqU9","primary":"IconButton-module_primary__vbo-G","secondary":"IconButton-module_secondary__AiNAY","accent":"IconButton-module_accent__QRzM2","light":"IconButton-module_light__YNEiO","dark":"IconButton-module_dark__gnbUH","disabled":"IconButton-module_disabled__QB0ZV","contained":"IconButton-module_contained__k7vGA"};
|
|
172
|
+
styleInject(css_248z$Z);
|
|
173
173
|
|
|
174
174
|
const IconButton = (props) => {
|
|
175
175
|
const { children, icon, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
176
176
|
const getCssClasses = () => {
|
|
177
177
|
const cssClasses = [];
|
|
178
|
-
cssClasses.push(styles$
|
|
179
|
-
cssClasses.push(styles$
|
|
180
|
-
cssClasses.push(styles$
|
|
181
|
-
cssClasses.push(styles$
|
|
182
|
-
isActive && cssClasses.push(styles$
|
|
183
|
-
disabled && cssClasses.push(styles$
|
|
184
|
-
shadow && cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$Z[color]);
|
|
179
|
+
cssClasses.push(styles$Z[variant]);
|
|
180
|
+
cssClasses.push(styles$Z[size]);
|
|
181
|
+
cssClasses.push(styles$Z.iconButton);
|
|
182
|
+
isActive && cssClasses.push(styles$Z.active);
|
|
183
|
+
disabled && cssClasses.push(styles$Z.disabled);
|
|
184
|
+
shadow && cssClasses.push(styles$Z.shadow);
|
|
185
185
|
className && cssClasses.push(className);
|
|
186
186
|
return cssClasses.filter(css => css).join(' ');
|
|
187
187
|
};
|
|
@@ -316,9 +316,9 @@ const useOnDestroy = (callBack) => {
|
|
|
316
316
|
}, []);
|
|
317
317
|
};
|
|
318
318
|
|
|
319
|
-
var css_248z$
|
|
320
|
-
var styles$
|
|
321
|
-
styleInject(css_248z$
|
|
319
|
+
var css_248z$Y = ".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}";
|
|
320
|
+
var styles$Y = {"backdrop":"Backdrop-module_backdrop__IRMoL","isTransparent":"Backdrop-module_isTransparent__F5nA5"};
|
|
321
|
+
styleInject(css_248z$Y);
|
|
322
322
|
|
|
323
323
|
const Backdrop = (props) => {
|
|
324
324
|
const { target = document.body, isTransparent = false, onClick, style } = props, rest = __rest(props, ["target", "isTransparent", "onClick", "style"]);
|
|
@@ -328,8 +328,8 @@ const Backdrop = (props) => {
|
|
|
328
328
|
};
|
|
329
329
|
const getCssClasses = () => {
|
|
330
330
|
const cssClasses = [];
|
|
331
|
-
cssClasses.push(styles$
|
|
332
|
-
isTransparent && cssClasses.push(styles$
|
|
331
|
+
cssClasses.push(styles$Y.backdrop);
|
|
332
|
+
isTransparent && cssClasses.push(styles$Y['isTransparent']);
|
|
333
333
|
return cssClasses.filter(css => css).join(' ');
|
|
334
334
|
};
|
|
335
335
|
const getStyles = () => {
|
|
@@ -339,34 +339,34 @@ const Backdrop = (props) => {
|
|
|
339
339
|
return (reactDom.createPortal(React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
340
340
|
};
|
|
341
341
|
|
|
342
|
-
var css_248z$
|
|
343
|
-
var styles$
|
|
344
|
-
styleInject(css_248z$
|
|
342
|
+
var css_248z$X = ".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}";
|
|
343
|
+
var styles$X = {"list":"List-module_list__gpZ41"};
|
|
344
|
+
styleInject(css_248z$X);
|
|
345
345
|
|
|
346
346
|
const List = (props) => {
|
|
347
347
|
const { children, className, isFlush } = props, rest = __rest(props, ["children", "className", "isFlush"]);
|
|
348
348
|
const getCssClasses = () => {
|
|
349
349
|
const cssClasses = [];
|
|
350
|
-
isFlush && cssClasses.push(styles$
|
|
351
|
-
cssClasses.push(styles$
|
|
350
|
+
isFlush && cssClasses.push(styles$X.flush);
|
|
351
|
+
cssClasses.push(styles$X.list);
|
|
352
352
|
className && cssClasses.push(className);
|
|
353
353
|
return cssClasses.filter(css => css).join(' ');
|
|
354
354
|
};
|
|
355
355
|
return (React__default["default"].createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
|
|
356
356
|
};
|
|
357
357
|
|
|
358
|
-
var css_248z$
|
|
359
|
-
var styles$
|
|
360
|
-
styleInject(css_248z$
|
|
358
|
+
var css_248z$W = ".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}";
|
|
359
|
+
var styles$W = {"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"};
|
|
360
|
+
styleInject(css_248z$W);
|
|
361
361
|
|
|
362
362
|
const ListItem = (props) => {
|
|
363
363
|
const { children, color, active, className, disabled, onClick } = props, rest = __rest(props, ["children", "color", "active", "className", "disabled", "onClick"]);
|
|
364
364
|
const getCssClasses = () => {
|
|
365
365
|
const cssClasses = [];
|
|
366
|
-
cssClasses.push(styles$
|
|
367
|
-
color && cssClasses.push(styles$
|
|
368
|
-
active && cssClasses.push(styles$
|
|
369
|
-
disabled && cssClasses.push(styles$
|
|
366
|
+
cssClasses.push(styles$W.listItem);
|
|
367
|
+
color && cssClasses.push(styles$W[color]);
|
|
368
|
+
active && cssClasses.push(styles$W['active']);
|
|
369
|
+
disabled && cssClasses.push(styles$W['disabled']);
|
|
370
370
|
className && cssClasses.push(className);
|
|
371
371
|
return cssClasses.filter(css => css).join(' ');
|
|
372
372
|
};
|
|
@@ -376,42 +376,42 @@ const ListItem = (props) => {
|
|
|
376
376
|
return (React__default["default"].createElement("li", Object.assign({ onClick: handleClick, className: getCssClasses() }, rest), children));
|
|
377
377
|
};
|
|
378
378
|
|
|
379
|
-
var css_248z$
|
|
380
|
-
var styles$
|
|
381
|
-
styleInject(css_248z$
|
|
379
|
+
var css_248z$V = ".ListItemAvatar-module_avatar__sVWfR {\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}";
|
|
380
|
+
var styles$V = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
|
|
381
|
+
styleInject(css_248z$V);
|
|
382
382
|
|
|
383
383
|
const ListItemAvatar = (_a) => {
|
|
384
384
|
var { avatar } = _a, rest = __rest(_a, ["avatar"]);
|
|
385
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
385
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$V.avatar }, rest), avatar));
|
|
386
386
|
};
|
|
387
387
|
|
|
388
|
-
var css_248z$
|
|
389
|
-
var styles$
|
|
390
|
-
styleInject(css_248z$
|
|
388
|
+
var css_248z$U = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px;\n}\n.ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px;\n}";
|
|
389
|
+
var styles$U = {"icon":"ListItemIcon-module_icon__cCvEv"};
|
|
390
|
+
styleInject(css_248z$U);
|
|
391
391
|
|
|
392
392
|
const ListItemIcon = (_a) => {
|
|
393
393
|
var { icon } = _a, rest = __rest(_a, ["icon"]);
|
|
394
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
394
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$U.icon }, rest), icon));
|
|
395
395
|
};
|
|
396
396
|
|
|
397
|
-
var css_248z$
|
|
398
|
-
var styles$
|
|
399
|
-
styleInject(css_248z$
|
|
397
|
+
var css_248z$T = ".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}";
|
|
398
|
+
var styles$T = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
|
|
399
|
+
styleInject(css_248z$T);
|
|
400
400
|
|
|
401
401
|
const ListItemAction = (_a) => {
|
|
402
402
|
var { children, onClick } = _a, rest = __rest(_a, ["children", "onClick"]);
|
|
403
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
403
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$T.listItemAction, onClick: e => onClick && onClick(e) }, rest), children));
|
|
404
404
|
};
|
|
405
405
|
|
|
406
|
-
var css_248z$
|
|
407
|
-
var styles$
|
|
408
|
-
styleInject(css_248z$
|
|
406
|
+
var css_248z$S = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1;\n}";
|
|
407
|
+
var styles$S = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
408
|
+
styleInject(css_248z$S);
|
|
409
409
|
|
|
410
410
|
const ListItemText = (_a) => {
|
|
411
411
|
var { primary, secondary } = _a, rest = __rest(_a, ["primary", "secondary"]);
|
|
412
412
|
const getCssClasses = () => {
|
|
413
413
|
const cssClasses = [];
|
|
414
|
-
cssClasses.push(styles$
|
|
414
|
+
cssClasses.push(styles$S.listItemText);
|
|
415
415
|
return cssClasses.filter(css => css).join(' ');
|
|
416
416
|
};
|
|
417
417
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -422,9 +422,9 @@ const ListItemText = (_a) => {
|
|
|
422
422
|
const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
|
|
423
423
|
const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
424
424
|
|
|
425
|
-
var css_248z$
|
|
426
|
-
var styles$
|
|
427
|
-
styleInject(css_248z$
|
|
425
|
+
var css_248z$R = ".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}";
|
|
426
|
+
var styles$R = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","disabled":"AutoComplete-module_disabled__CbGP4","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
427
|
+
styleInject(css_248z$R);
|
|
428
428
|
|
|
429
429
|
// preset value
|
|
430
430
|
// enter -> delay? -> show results
|
|
@@ -470,7 +470,7 @@ const AutoComplete = (props) => {
|
|
|
470
470
|
const getCssClass = () => {
|
|
471
471
|
const cssClasses = [];
|
|
472
472
|
className && cssClasses.push(className);
|
|
473
|
-
cssClasses.push(styles$
|
|
473
|
+
cssClasses.push(styles$R.select);
|
|
474
474
|
return cssClasses.filter(r => r).join(' ');
|
|
475
475
|
};
|
|
476
476
|
const show = () => setIsShow(true);
|
|
@@ -494,28 +494,28 @@ const AutoComplete = (props) => {
|
|
|
494
494
|
setModel('');
|
|
495
495
|
setSearchText('');
|
|
496
496
|
};
|
|
497
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
497
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$R.selectContainer },
|
|
498
498
|
React__default["default"].createElement("div", { className: "d-flex" },
|
|
499
499
|
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 }),
|
|
500
500
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
501
501
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
502
502
|
isShow &&
|
|
503
503
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
504
|
-
React__default["default"].createElement("div", { className: styles$
|
|
504
|
+
React__default["default"].createElement("div", { className: styles$R.selectMenu },
|
|
505
505
|
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 },
|
|
506
506
|
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
507
507
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
508
508
|
};
|
|
509
509
|
|
|
510
|
-
var css_248z$
|
|
511
|
-
var styles$
|
|
512
|
-
styleInject(css_248z$
|
|
510
|
+
var css_248z$Q = ".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}";
|
|
511
|
+
var styles$Q = {"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"};
|
|
512
|
+
styleInject(css_248z$Q);
|
|
513
513
|
|
|
514
514
|
const Badge = (props) => {
|
|
515
515
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
516
516
|
const [cssClassName] = useCssClasses([
|
|
517
|
-
styles$
|
|
518
|
-
styles$
|
|
517
|
+
styles$Q.badge,
|
|
518
|
+
styles$Q[color],
|
|
519
519
|
className
|
|
520
520
|
]);
|
|
521
521
|
return (React__default["default"].createElement(BadgeContainer, null,
|
|
@@ -525,15 +525,15 @@ const Badge = (props) => {
|
|
|
525
525
|
const BadgeContainer = (props) => {
|
|
526
526
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
527
527
|
const [cssClassName] = useCssClasses([
|
|
528
|
-
styles$
|
|
528
|
+
styles$Q.badgeContainer,
|
|
529
529
|
className,
|
|
530
530
|
]);
|
|
531
531
|
return (React__default["default"].createElement("div", Object.assign({ className: cssClassName }, rest), children));
|
|
532
532
|
};
|
|
533
533
|
|
|
534
|
-
var css_248z$
|
|
535
|
-
var styles$
|
|
536
|
-
styleInject(css_248z$
|
|
534
|
+
var css_248z$P = ".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}";
|
|
535
|
+
var styles$P = {"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"};
|
|
536
|
+
styleInject(css_248z$P);
|
|
537
537
|
|
|
538
538
|
const ButtonContext = React.createContext({
|
|
539
539
|
color: null
|
|
@@ -545,19 +545,19 @@ const Button = (props) => {
|
|
|
545
545
|
const buttonContext = useButtonContext();
|
|
546
546
|
const getCssClasses = () => {
|
|
547
547
|
const cssClasses = [];
|
|
548
|
-
cssClasses.push(styles$
|
|
548
|
+
cssClasses.push(styles$P.button);
|
|
549
549
|
const buttonColor = buttonContext.color || color;
|
|
550
550
|
if (variant !== 'outline' && variant !== 'text') {
|
|
551
|
-
cssClasses.push(styles$
|
|
552
|
-
cssClasses.push(styles$
|
|
551
|
+
cssClasses.push(styles$P.btnContained);
|
|
552
|
+
cssClasses.push(styles$P[buttonColor]);
|
|
553
553
|
}
|
|
554
554
|
if (variant === 'outline') {
|
|
555
|
-
cssClasses.push(styles$
|
|
556
|
-
cssClasses.push(styles$
|
|
555
|
+
cssClasses.push(styles$P.btnOutline);
|
|
556
|
+
cssClasses.push(styles$P[buttonColor]);
|
|
557
557
|
}
|
|
558
558
|
if (variant === 'text') {
|
|
559
|
-
cssClasses.push(styles$
|
|
560
|
-
cssClasses.push(styles$
|
|
559
|
+
cssClasses.push(styles$P.btnText);
|
|
560
|
+
cssClasses.push(styles$P[buttonColor]);
|
|
561
561
|
}
|
|
562
562
|
if (isRounded && variant !== 'text') {
|
|
563
563
|
cssClasses.push(`rounded-pill`);
|
|
@@ -565,29 +565,29 @@ const Button = (props) => {
|
|
|
565
565
|
if (isActive) {
|
|
566
566
|
cssClasses.push('active');
|
|
567
567
|
}
|
|
568
|
-
shadow && cssClasses.push(styles$
|
|
569
|
-
block && cssClasses.push(styles$
|
|
568
|
+
shadow && cssClasses.push(styles$P.shadow);
|
|
569
|
+
block && cssClasses.push(styles$P.block);
|
|
570
570
|
className && cssClasses.push(className);
|
|
571
571
|
return cssClasses.filter(css => css).join(' ');
|
|
572
572
|
};
|
|
573
573
|
return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
574
574
|
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
575
575
|
startIcon &&
|
|
576
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
576
|
+
React__default["default"].createElement(Icon, { className: styles$P.startIcon }, startIcon),
|
|
577
577
|
children,
|
|
578
578
|
endIcon &&
|
|
579
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
579
|
+
React__default["default"].createElement(Icon, { className: styles$P.endIcon }, endIcon))));
|
|
580
580
|
};
|
|
581
581
|
|
|
582
|
-
var css_248z$
|
|
583
|
-
var styles$
|
|
584
|
-
styleInject(css_248z$
|
|
582
|
+
var css_248z$O = ".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}";
|
|
583
|
+
var styles$O = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
584
|
+
styleInject(css_248z$O);
|
|
585
585
|
|
|
586
586
|
const ButtonGroup = (props) => {
|
|
587
587
|
const { children, className, color } = props, rest = __rest(props, ["children", "className", "color"]);
|
|
588
588
|
const getCssClasses = () => {
|
|
589
589
|
const cssClasses = [];
|
|
590
|
-
cssClasses.push(styles$
|
|
590
|
+
cssClasses.push(styles$O.buttonGroup);
|
|
591
591
|
className && cssClasses.push(className);
|
|
592
592
|
return cssClasses.filter(css => css).join(' ');
|
|
593
593
|
};
|
|
@@ -595,15 +595,15 @@ const ButtonGroup = (props) => {
|
|
|
595
595
|
React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children)));
|
|
596
596
|
};
|
|
597
597
|
|
|
598
|
-
var css_248z$
|
|
599
|
-
var styles$
|
|
600
|
-
styleInject(css_248z$
|
|
598
|
+
var css_248z$N = ".Breadcrumb-module_breadcrumb__-pvAn {\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n list-style: none;\n margin: 0;\n}";
|
|
599
|
+
var styles$N = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
|
|
600
|
+
styleInject(css_248z$N);
|
|
601
601
|
|
|
602
602
|
const Breadcrumb = (props) => {
|
|
603
603
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
604
604
|
const getCssClasses = () => {
|
|
605
605
|
const cssClasses = [];
|
|
606
|
-
cssClasses.push(styles$
|
|
606
|
+
cssClasses.push(styles$N.breadcrumb);
|
|
607
607
|
className && cssClasses.push(className);
|
|
608
608
|
return cssClasses.filter(css => css).join(' ');
|
|
609
609
|
};
|
|
@@ -613,15 +613,15 @@ const Breadcrumb = (props) => {
|
|
|
613
613
|
|
|
614
614
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
615
615
|
|
|
616
|
-
var css_248z$
|
|
617
|
-
var styles$
|
|
618
|
-
styleInject(css_248z$
|
|
616
|
+
var css_248z$M = ".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}";
|
|
617
|
+
var styles$M = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
|
|
618
|
+
styleInject(css_248z$M);
|
|
619
619
|
|
|
620
620
|
const BreadcrumbItem = (props) => {
|
|
621
621
|
const { children, className, isActive, onClick } = props;
|
|
622
622
|
const getCssClasses = () => {
|
|
623
623
|
const cssClasses = [];
|
|
624
|
-
cssClasses.push(styles$
|
|
624
|
+
cssClasses.push(styles$M.breadcrumbItem);
|
|
625
625
|
className && cssClasses.push(className);
|
|
626
626
|
isActive && cssClasses.push('active');
|
|
627
627
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -633,115 +633,115 @@ const BreadcrumbItem = (props) => {
|
|
|
633
633
|
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
634
634
|
};
|
|
635
635
|
|
|
636
|
-
var css_248z$
|
|
637
|
-
var styles$
|
|
638
|
-
styleInject(css_248z$
|
|
636
|
+
var css_248z$L = ".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}";
|
|
637
|
+
var styles$L = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
|
|
638
|
+
styleInject(css_248z$L);
|
|
639
639
|
|
|
640
640
|
const Card = (props) => {
|
|
641
641
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
642
642
|
const getCssClasses = () => {
|
|
643
643
|
const cssClasses = [];
|
|
644
|
-
cssClasses.push(styles$
|
|
645
|
-
shadow && cssClasses.push(styles$
|
|
644
|
+
cssClasses.push(styles$L.card);
|
|
645
|
+
shadow && cssClasses.push(styles$L.shadow);
|
|
646
646
|
className && cssClasses.push(className);
|
|
647
647
|
return cssClasses.filter(css => css).join(' ');
|
|
648
648
|
};
|
|
649
649
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
650
650
|
};
|
|
651
651
|
|
|
652
|
-
var css_248z$
|
|
653
|
-
var styles$
|
|
654
|
-
styleInject(css_248z$
|
|
652
|
+
var css_248z$K = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem;\n}";
|
|
653
|
+
var styles$K = {"cardBody":"CardBody-module_cardBody__X52VY"};
|
|
654
|
+
styleInject(css_248z$K);
|
|
655
655
|
|
|
656
656
|
const CardBody = (props) => {
|
|
657
657
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
658
658
|
const getCssClasses = () => {
|
|
659
659
|
const cssClasses = [];
|
|
660
|
-
cssClasses.push(styles$
|
|
660
|
+
cssClasses.push(styles$K.cardBody);
|
|
661
661
|
className && cssClasses.push(className);
|
|
662
662
|
return cssClasses.filter(css => css).join(' ');
|
|
663
663
|
};
|
|
664
664
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
665
665
|
};
|
|
666
666
|
|
|
667
|
-
var css_248z$
|
|
668
|
-
var styles$
|
|
669
|
-
styleInject(css_248z$
|
|
667
|
+
var css_248z$J = ".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}";
|
|
668
|
+
var styles$J = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
|
|
669
|
+
styleInject(css_248z$J);
|
|
670
670
|
|
|
671
671
|
const CardFooter = (props) => {
|
|
672
672
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
673
673
|
const getCssClasses = () => {
|
|
674
674
|
const cssClasses = [];
|
|
675
|
-
cssClasses.push(styles$
|
|
675
|
+
cssClasses.push(styles$J.cardFooter);
|
|
676
676
|
className && cssClasses.push(className);
|
|
677
677
|
return cssClasses.filter(css => css).join(' ');
|
|
678
678
|
};
|
|
679
679
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
680
680
|
};
|
|
681
681
|
|
|
682
|
-
var css_248z$
|
|
683
|
-
var styles$
|
|
684
|
-
styleInject(css_248z$
|
|
682
|
+
var css_248z$I = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important;\n}";
|
|
683
|
+
var styles$I = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
|
|
684
|
+
styleInject(css_248z$I);
|
|
685
685
|
|
|
686
686
|
const CardSubtitle = (props) => {
|
|
687
687
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
688
688
|
const getCssClasses = () => {
|
|
689
689
|
const cssClasses = [];
|
|
690
|
-
cssClasses.push(styles$
|
|
690
|
+
cssClasses.push(styles$I.cardSubtitle);
|
|
691
691
|
className && cssClasses.push(className);
|
|
692
692
|
return cssClasses.filter(css => css).join(' ');
|
|
693
693
|
};
|
|
694
694
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
695
695
|
};
|
|
696
696
|
|
|
697
|
-
var css_248z$
|
|
698
|
-
var styles$
|
|
699
|
-
styleInject(css_248z$
|
|
697
|
+
var css_248z$H = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0;\n}";
|
|
698
|
+
var styles$H = {"cardText":"CardText-module_cardText__UtYd9"};
|
|
699
|
+
styleInject(css_248z$H);
|
|
700
700
|
|
|
701
701
|
const CardText = (props) => {
|
|
702
702
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
703
703
|
const getCssClasses = () => {
|
|
704
704
|
const cssClasses = [];
|
|
705
|
-
cssClasses.push(styles$
|
|
705
|
+
cssClasses.push(styles$H.cardText);
|
|
706
706
|
className && cssClasses.push(className);
|
|
707
707
|
return cssClasses.filter(css => css).join(' ');
|
|
708
708
|
};
|
|
709
709
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
710
710
|
};
|
|
711
711
|
|
|
712
|
-
var css_248z$
|
|
713
|
-
var styles$
|
|
714
|
-
styleInject(css_248z$
|
|
712
|
+
var css_248z$G = ".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}";
|
|
713
|
+
var styles$G = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
|
|
714
|
+
styleInject(css_248z$G);
|
|
715
715
|
|
|
716
716
|
const CardTitle = (props) => {
|
|
717
717
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
718
718
|
const getCssClasses = () => {
|
|
719
719
|
const cssClasses = [];
|
|
720
|
-
cssClasses.push(styles$
|
|
720
|
+
cssClasses.push(styles$G.cardTitle);
|
|
721
721
|
className && cssClasses.push(className);
|
|
722
722
|
return cssClasses.filter(css => css).join(' ');
|
|
723
723
|
};
|
|
724
724
|
return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
725
725
|
};
|
|
726
726
|
|
|
727
|
-
var css_248z$
|
|
728
|
-
var styles$
|
|
729
|
-
styleInject(css_248z$
|
|
727
|
+
var css_248z$F = ".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}";
|
|
728
|
+
var styles$F = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
|
|
729
|
+
styleInject(css_248z$F);
|
|
730
730
|
|
|
731
731
|
const CardImage = (props) => {
|
|
732
732
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
733
733
|
const getCssClasses = () => {
|
|
734
734
|
const cssClasses = [];
|
|
735
|
-
cssClasses.push(styles$
|
|
735
|
+
cssClasses.push(styles$F.cardImage);
|
|
736
736
|
className && cssClasses.push(className);
|
|
737
737
|
return cssClasses.filter(css => css).join(' ');
|
|
738
738
|
};
|
|
739
739
|
return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
740
740
|
};
|
|
741
741
|
|
|
742
|
-
var css_248z$
|
|
743
|
-
var styles$
|
|
744
|
-
styleInject(css_248z$
|
|
742
|
+
var css_248z$E = ".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}";
|
|
743
|
+
var styles$E = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
|
|
744
|
+
styleInject(css_248z$E);
|
|
745
745
|
|
|
746
746
|
const Checkbox = (props) => {
|
|
747
747
|
const { id, checked, className, label, name, value = 'off', disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -770,8 +770,8 @@ const Checkbox = (props) => {
|
|
|
770
770
|
};
|
|
771
771
|
const getCssClassesLabel = () => {
|
|
772
772
|
const cssClasses = [];
|
|
773
|
-
cssClasses.push(styles$
|
|
774
|
-
disabled && cssClasses.push(styles$
|
|
773
|
+
cssClasses.push(styles$E.checkboxLabel);
|
|
774
|
+
disabled && cssClasses.push(styles$E['disabled']);
|
|
775
775
|
return cssClasses.filter(css => css).join(' ');
|
|
776
776
|
};
|
|
777
777
|
const getIcon = () => {
|
|
@@ -784,24 +784,24 @@ const Checkbox = (props) => {
|
|
|
784
784
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
785
785
|
}
|
|
786
786
|
};
|
|
787
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
787
|
+
return (React__default["default"].createElement("div", { className: styles$E.checkboxContainer },
|
|
788
788
|
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
789
789
|
React__default["default"].createElement("label", { onClick: handleClick, className: getCssClassesLabel() }, label),
|
|
790
790
|
React__default["default"].createElement("input", Object.assign({ type: "checkbox", ref: checkboxElement, id: id, name: name, checked: isChecked, disabled: disabled, readOnly: readOnly, hidden: true, value: value }, rest))));
|
|
791
791
|
};
|
|
792
792
|
|
|
793
|
-
var css_248z$
|
|
794
|
-
var styles$
|
|
795
|
-
styleInject(css_248z$
|
|
793
|
+
var css_248z$D = ".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}";
|
|
794
|
+
var styles$D = {"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"};
|
|
795
|
+
styleInject(css_248z$D);
|
|
796
796
|
|
|
797
797
|
const Chip = (props) => {
|
|
798
798
|
const { children, color = 'secondary', className, shadow, onClick, isDeletable, onDelete, deleteIcon = React__default["default"].createElement(TimesCircleSolidIcon, null), style } = props, rest = __rest(props, ["children", "color", "className", "shadow", "onClick", "isDeletable", "onDelete", "deleteIcon", "style"]);
|
|
799
799
|
const getCssClass = () => {
|
|
800
800
|
const cssClasses = [];
|
|
801
|
-
cssClasses.push(styles$
|
|
802
|
-
cssClasses.push(styles$
|
|
803
|
-
shadow && cssClasses.push(styles$
|
|
804
|
-
onClick && cssClasses.push(styles$
|
|
801
|
+
cssClasses.push(styles$D.chip);
|
|
802
|
+
cssClasses.push(styles$D[color]);
|
|
803
|
+
shadow && cssClasses.push(styles$D['shadow']);
|
|
804
|
+
onClick && cssClasses.push(styles$D['clickable']);
|
|
805
805
|
className && cssClasses.push(className);
|
|
806
806
|
return cssClasses.filter(r => r).join(' ');
|
|
807
807
|
};
|
|
@@ -811,7 +811,7 @@ const Chip = (props) => {
|
|
|
811
811
|
};
|
|
812
812
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
813
813
|
React__default["default"].createElement("span", null, children),
|
|
814
|
-
isDeletable && (React__default["default"].createElement("div", { className: styles$
|
|
814
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$D.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
815
815
|
};
|
|
816
816
|
|
|
817
817
|
const CssTransition = (props) => {
|
|
@@ -889,9 +889,9 @@ const CssTransition = (props) => {
|
|
|
889
889
|
React__default["default"].createElement("div", { ref: transitionConainter, className: getCssClasses() }, children)));
|
|
890
890
|
};
|
|
891
891
|
|
|
892
|
-
var css_248z$
|
|
893
|
-
var styles$
|
|
894
|
-
styleInject(css_248z$
|
|
892
|
+
var css_248z$C = ".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}";
|
|
893
|
+
var styles$C = {"column":"Column-module_column__fcTgl"};
|
|
894
|
+
styleInject(css_248z$C);
|
|
895
895
|
|
|
896
896
|
const Column = (props) => {
|
|
897
897
|
const { children, className } = props,
|
|
@@ -909,22 +909,22 @@ const Column = (props) => {
|
|
|
909
909
|
// if (md) cssClasses.push(`col-md-${md.toString()}`);
|
|
910
910
|
// if (lg) cssClasses.push(`col-lg-${lg.toString()}`);
|
|
911
911
|
// if (xl) cssClasses.push(`col-xl-${xl.toString()}`);
|
|
912
|
-
cssClasses.push(styles$
|
|
912
|
+
cssClasses.push(styles$C.column);
|
|
913
913
|
className && cssClasses.push(className);
|
|
914
914
|
return cssClasses.filter(css => css).join(' ');
|
|
915
915
|
};
|
|
916
916
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
917
917
|
};
|
|
918
918
|
|
|
919
|
-
var css_248z$
|
|
920
|
-
var styles$
|
|
921
|
-
styleInject(css_248z$
|
|
919
|
+
var css_248z$B = ".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}";
|
|
920
|
+
var styles$B = {"row":"Row-module_row__bTIWp"};
|
|
921
|
+
styleInject(css_248z$B);
|
|
922
922
|
|
|
923
923
|
const Row = (_a) => {
|
|
924
924
|
var { children, direction = 'row', className } = _a, rest = __rest(_a, ["children", "direction", "className"]);
|
|
925
925
|
const getCssClasses = () => {
|
|
926
926
|
const cssClasses = [];
|
|
927
|
-
cssClasses.push(styles$
|
|
927
|
+
cssClasses.push(styles$B.row);
|
|
928
928
|
className && cssClasses.push(className);
|
|
929
929
|
direction && cssClasses.push(`flex-${direction}`);
|
|
930
930
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -932,15 +932,15 @@ const Row = (_a) => {
|
|
|
932
932
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
933
933
|
};
|
|
934
934
|
|
|
935
|
-
var css_248z$
|
|
936
|
-
var styles$
|
|
937
|
-
styleInject(css_248z$
|
|
935
|
+
var css_248z$A = ".FormLabel-module_formLabel__TXcHc {\n display: inline-block;\n margin-bottom: 0.5rem;\n}";
|
|
936
|
+
var styles$A = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
937
|
+
styleInject(css_248z$A);
|
|
938
938
|
|
|
939
939
|
const FormLabel = (_a) => {
|
|
940
940
|
var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
|
|
941
941
|
const getCssClasses = () => {
|
|
942
942
|
const cssClasses = [];
|
|
943
|
-
cssClasses.push(styles$
|
|
943
|
+
cssClasses.push(styles$A.formLabel);
|
|
944
944
|
className && cssClasses.push(className);
|
|
945
945
|
return cssClasses.filter(css => css).join(' ');
|
|
946
946
|
};
|
|
@@ -977,9 +977,9 @@ const FileInput = (props) => {
|
|
|
977
977
|
React__default["default"].createElement("input", Object.assign({ type: "file", ref: inputFileElement, className: getCssClasses(), id: id, name: name, multiple: multiple, accept: accept, disabled: disabled, readOnly: readOnly, hidden: true, onChange: handleOnChange, value: model }, rest))));
|
|
978
978
|
};
|
|
979
979
|
|
|
980
|
-
var css_248z$
|
|
981
|
-
var styles$
|
|
982
|
-
styleInject(css_248z$
|
|
980
|
+
var css_248z$z = ".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}";
|
|
981
|
+
var styles$z = {"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"};
|
|
982
|
+
styleInject(css_248z$z);
|
|
983
983
|
|
|
984
984
|
const Select = (props) => {
|
|
985
985
|
var _a, _b, _c;
|
|
@@ -992,9 +992,9 @@ const Select = (props) => {
|
|
|
992
992
|
const getCssClass = () => {
|
|
993
993
|
const cssClasses = [];
|
|
994
994
|
className && cssClasses.push(className);
|
|
995
|
-
disabled && cssClasses.push(styles$
|
|
996
|
-
readOnly && cssClasses.push(styles$
|
|
997
|
-
cssClasses.push(styles$
|
|
995
|
+
disabled && cssClasses.push(styles$z['disabled']);
|
|
996
|
+
readOnly && cssClasses.push(styles$z['readOnly']);
|
|
997
|
+
cssClasses.push(styles$z.select);
|
|
998
998
|
return cssClasses.filter(r => r).join(' ');
|
|
999
999
|
};
|
|
1000
1000
|
React.useEffect(() => {
|
|
@@ -1116,16 +1116,16 @@ const Select = (props) => {
|
|
|
1116
1116
|
}
|
|
1117
1117
|
}
|
|
1118
1118
|
};
|
|
1119
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
1119
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$z.selectContainer },
|
|
1120
1120
|
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
1121
1121
|
!multiple && renderSingleViewModel(),
|
|
1122
1122
|
multiple &&
|
|
1123
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1123
|
+
React__default["default"].createElement("div", { className: styles$z.chipContainer }, renderMultipleViewModel()),
|
|
1124
1124
|
React__default["default"].createElement(Icon, { className: "ml-2" },
|
|
1125
1125
|
React__default["default"].createElement(ChevronDownSolidIcon, null))),
|
|
1126
1126
|
isShow &&
|
|
1127
1127
|
reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1128
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1128
|
+
React__default["default"].createElement("div", { className: styles$z.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
|
|
1129
1129
|
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) },
|
|
1130
1130
|
multiple &&
|
|
1131
1131
|
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -1133,33 +1133,33 @@ const Select = (props) => {
|
|
|
1133
1133
|
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
|
|
1134
1134
|
};
|
|
1135
1135
|
|
|
1136
|
-
var css_248z$
|
|
1137
|
-
var styles$
|
|
1138
|
-
styleInject(css_248z$
|
|
1136
|
+
var css_248z$y = ".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}";
|
|
1137
|
+
var styles$y = {"textarea":"Textarea-module_textarea__L5zqa","disabled":"Textarea-module_disabled__OqqOF","isInvalid":"Textarea-module_isInvalid__JI01W"};
|
|
1138
|
+
styleInject(css_248z$y);
|
|
1139
1139
|
|
|
1140
1140
|
const Textarea = (props) => {
|
|
1141
1141
|
const { className, error } = props, rest = __rest(props, ["className", "error"]);
|
|
1142
1142
|
const getCssClass = () => {
|
|
1143
1143
|
const cssClasses = [];
|
|
1144
|
-
cssClasses.push(styles$
|
|
1144
|
+
cssClasses.push(styles$y.textarea);
|
|
1145
1145
|
className && cssClasses.push(className);
|
|
1146
|
-
error && cssClasses.push(styles$
|
|
1146
|
+
error && cssClasses.push(styles$y['isInvalid']);
|
|
1147
1147
|
return cssClasses.filter(r => r).join(' ');
|
|
1148
1148
|
};
|
|
1149
1149
|
return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
1150
1150
|
};
|
|
1151
1151
|
|
|
1152
|
-
var css_248z$
|
|
1153
|
-
var styles$
|
|
1154
|
-
styleInject(css_248z$
|
|
1152
|
+
var css_248z$x = ".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}";
|
|
1153
|
+
var styles$x = {"formInput":"FormInput-module_formInput__VXZip","disabled":"FormInput-module_disabled__EjdD9","isInvalid":"FormInput-module_isInvalid__vQDuz"};
|
|
1154
|
+
styleInject(css_248z$x);
|
|
1155
1155
|
|
|
1156
1156
|
const FormInput = (props) => {
|
|
1157
1157
|
const { value, name, type, placeholder, className, isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
1158
1158
|
const getCssClasses = () => {
|
|
1159
1159
|
const cssClasses = [];
|
|
1160
|
-
cssClasses.push(styles$
|
|
1160
|
+
cssClasses.push(styles$x.formInput);
|
|
1161
1161
|
className && cssClasses.push(className);
|
|
1162
|
-
!isValid && cssClasses.push(styles$
|
|
1162
|
+
!isValid && cssClasses.push(styles$x['isInvalid']);
|
|
1163
1163
|
return cssClasses.filter(css => css).join(' ');
|
|
1164
1164
|
};
|
|
1165
1165
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -1207,12 +1207,12 @@ const FormHint = (props) => {
|
|
|
1207
1207
|
return (React__default["default"].createElement("small", { className: getCssClasses() }, children));
|
|
1208
1208
|
};
|
|
1209
1209
|
|
|
1210
|
-
var css_248z$
|
|
1211
|
-
var styles$
|
|
1212
|
-
styleInject(css_248z$
|
|
1210
|
+
var css_248z$w = ".FormError-module_isInvalid__tO1Sw {\n width: 100%;\n margin-top: 0.25rem;\n font-size: 0.875em;\n color: #dc3545;\n}";
|
|
1211
|
+
var styles$w = {"isInvalid":"FormError-module_isInvalid__tO1Sw"};
|
|
1212
|
+
styleInject(css_248z$w);
|
|
1213
1213
|
|
|
1214
1214
|
const FormError = (props) => {
|
|
1215
|
-
const { className = styles$
|
|
1215
|
+
const { className = styles$w.isInvalid, errors = [] } = props;
|
|
1216
1216
|
return (React__default["default"].createElement(React.Fragment, null, errors &&
|
|
1217
1217
|
React__default["default"].createElement("div", { className: className }, errors.map(e => React__default["default"].createElement("div", { key: e.validator }, e.message)))));
|
|
1218
1218
|
};
|
|
@@ -1227,6 +1227,8 @@ const EmailValidator = (value) => {
|
|
|
1227
1227
|
|
|
1228
1228
|
const IsEqualValidator = (valueA, valueB) => valueA === valueB;
|
|
1229
1229
|
|
|
1230
|
+
const MaxValidator = (valueA, valueB) => valueA > valueB;
|
|
1231
|
+
|
|
1230
1232
|
// values, isSubmitting, handleChange, handleBlur, handleSubmit
|
|
1231
1233
|
class Form extends React.Component {
|
|
1232
1234
|
constructor(props) {
|
|
@@ -1276,6 +1278,11 @@ class Form extends React.Component {
|
|
|
1276
1278
|
errors.push({ validator: validatorName, message: 'Email format is wrong' });
|
|
1277
1279
|
}
|
|
1278
1280
|
break;
|
|
1281
|
+
case 'max':
|
|
1282
|
+
if (MaxValidator(fieldValue, parseInt(validatorParam))) {
|
|
1283
|
+
errors.push({ validator: validatorName, message: `Number is greater than ${validatorParam}` });
|
|
1284
|
+
}
|
|
1285
|
+
break;
|
|
1279
1286
|
case 'match':
|
|
1280
1287
|
if (validatorParam) {
|
|
1281
1288
|
const matchControl = this.getControl(validatorParam);
|
|
@@ -1529,16 +1536,16 @@ const DateSelect = (props) => {
|
|
|
1529
1536
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1530
1537
|
// };
|
|
1531
1538
|
|
|
1532
|
-
var css_248z$
|
|
1533
|
-
var styles$
|
|
1534
|
-
styleInject(css_248z$
|
|
1539
|
+
var css_248z$v = ".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}";
|
|
1540
|
+
var styles$v = {"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"};
|
|
1541
|
+
styleInject(css_248z$v);
|
|
1535
1542
|
|
|
1536
1543
|
const Drawer = (props) => {
|
|
1537
1544
|
const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop } = props, rest = __rest(props, ["children", "className", "position", "permanent", "target", "shadow", "onClickBackdrop"]);
|
|
1538
1545
|
React.useEffect(() => {
|
|
1539
|
-
document.body.classList.add(styles$
|
|
1546
|
+
document.body.classList.add(styles$v.drawerOpen);
|
|
1540
1547
|
return () => {
|
|
1541
|
-
document.body.classList.remove(styles$
|
|
1548
|
+
document.body.classList.remove(styles$v.drawerOpen);
|
|
1542
1549
|
};
|
|
1543
1550
|
}, []);
|
|
1544
1551
|
const handleClickBackdrop = () => {
|
|
@@ -1552,10 +1559,10 @@ const DrawerContent = (props) => {
|
|
|
1552
1559
|
const { children, className, position = 'left', permanent = false, shadow } = props, rest = __rest(props, ["children", "className", "position", "permanent", "shadow"]);
|
|
1553
1560
|
const getCssClasses = () => {
|
|
1554
1561
|
const cssClasses = [];
|
|
1555
|
-
cssClasses.push(styles$
|
|
1556
|
-
shadow && cssClasses.push(styles$
|
|
1557
|
-
!!permanent && cssClasses.push(styles$
|
|
1558
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1562
|
+
cssClasses.push(styles$v.drawer);
|
|
1563
|
+
shadow && cssClasses.push(styles$v.shadow);
|
|
1564
|
+
!!permanent && cssClasses.push(styles$v['permanent']);
|
|
1565
|
+
position === 'left' ? cssClasses.push(styles$v['left']) : cssClasses.push(styles$v['right']);
|
|
1559
1566
|
className && cssClasses.push(className);
|
|
1560
1567
|
return cssClasses.filter(css => css).join(' ');
|
|
1561
1568
|
};
|
|
@@ -1569,9 +1576,9 @@ const DrawerContent = (props) => {
|
|
|
1569
1576
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), style: getStyles() }, rest), children));
|
|
1570
1577
|
};
|
|
1571
1578
|
|
|
1572
|
-
var css_248z$
|
|
1573
|
-
var styles$
|
|
1574
|
-
styleInject(css_248z$
|
|
1579
|
+
var css_248z$u = ".MenuBody-module_menuBody__u4FIQ {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius);\n}\n.MenuBody-module_menuBody__u4FIQ.MenuBody-module_shadow__OBp-f {\n box-shadow: var(--shadow);\n}";
|
|
1580
|
+
var styles$u = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
|
|
1581
|
+
styleInject(css_248z$u);
|
|
1575
1582
|
|
|
1576
1583
|
const MenuBody = (props) => {
|
|
1577
1584
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
@@ -1602,8 +1609,8 @@ const MenuBody = (props) => {
|
|
|
1602
1609
|
}, [menuBodyRef]);
|
|
1603
1610
|
const getCssClasses = () => {
|
|
1604
1611
|
const cssClasses = [];
|
|
1605
|
-
cssClasses.push(styles$
|
|
1606
|
-
shadow && cssClasses.push(styles$
|
|
1612
|
+
cssClasses.push(styles$u.menuBody);
|
|
1613
|
+
shadow && cssClasses.push(styles$u.shadow);
|
|
1607
1614
|
className && cssClasses.push(className);
|
|
1608
1615
|
return cssClasses.filter(css => css).join(' ');
|
|
1609
1616
|
};
|
|
@@ -1615,9 +1622,9 @@ const MenuBody = (props) => {
|
|
|
1615
1622
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1616
1623
|
};
|
|
1617
1624
|
|
|
1618
|
-
var css_248z$
|
|
1619
|
-
var styles$
|
|
1620
|
-
styleInject(css_248z$
|
|
1625
|
+
var css_248z$t = ".Menu-module_menu__p8QL- {\n display: flex;\n}";
|
|
1626
|
+
var styles$t = {"menu":"Menu-module_menu__p8QL-"};
|
|
1627
|
+
styleInject(css_248z$t);
|
|
1621
1628
|
|
|
1622
1629
|
const Menu = (props) => {
|
|
1623
1630
|
const { toggle, children, className, open, menuPosition, onClickBackdrop } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop"]);
|
|
@@ -1625,7 +1632,7 @@ const Menu = (props) => {
|
|
|
1625
1632
|
const toggleContainerRef = React.useRef(null);
|
|
1626
1633
|
const getCssClasses = () => {
|
|
1627
1634
|
const cssClasses = [];
|
|
1628
|
-
cssClasses.push(styles$
|
|
1635
|
+
cssClasses.push(styles$t.menu);
|
|
1629
1636
|
className && cssClasses.push(className);
|
|
1630
1637
|
return cssClasses.filter(css => css).join(' ');
|
|
1631
1638
|
};
|
|
@@ -1638,17 +1645,17 @@ const Menu = (props) => {
|
|
|
1638
1645
|
React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1639
1646
|
};
|
|
1640
1647
|
|
|
1641
|
-
var css_248z$
|
|
1642
|
-
var styles$
|
|
1643
|
-
styleInject(css_248z$
|
|
1648
|
+
var css_248z$s = ".MenuItem-module_menuItem__MeBxN {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0;\n}\n.MenuItem-module_menuItem__MeBxN.MenuItem-module_menuItemHeader__2l732 {\n margin-bottom: 0;\n font-size: 0.875rem;\n}\n.MenuItem-module_menuItem__MeBxN:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04);\n}";
|
|
1649
|
+
var styles$s = {"menuItem":"MenuItem-module_menuItem__MeBxN","menuItemHeader":"MenuItem-module_menuItemHeader__2l732"};
|
|
1650
|
+
styleInject(css_248z$s);
|
|
1644
1651
|
|
|
1645
1652
|
const MenuItem = (props) => {
|
|
1646
1653
|
const { children, onClick, type = 'item' } = props;
|
|
1647
1654
|
const getCssClasses = () => {
|
|
1648
1655
|
const cssClasses = [];
|
|
1649
|
-
cssClasses.push(styles$
|
|
1656
|
+
cssClasses.push(styles$s.menuItem);
|
|
1650
1657
|
if (type === 'header') {
|
|
1651
|
-
cssClasses.push(styles$
|
|
1658
|
+
cssClasses.push(styles$s.menuItemHeader);
|
|
1652
1659
|
}
|
|
1653
1660
|
return cssClasses.filter(css => css).join(' ');
|
|
1654
1661
|
};
|
|
@@ -1664,23 +1671,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1664
1671
|
return (React__default["default"].createElement(React.Fragment, null, children));
|
|
1665
1672
|
};
|
|
1666
1673
|
|
|
1667
|
-
var css_248z$
|
|
1668
|
-
var styles$
|
|
1669
|
-
styleInject(css_248z$
|
|
1674
|
+
var css_248z$r = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef;\n}";
|
|
1675
|
+
var styles$r = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
|
|
1676
|
+
styleInject(css_248z$r);
|
|
1670
1677
|
|
|
1671
|
-
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$
|
|
1678
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$r.menuItemDivider });
|
|
1672
1679
|
|
|
1673
|
-
var css_248z$
|
|
1674
|
-
var styles$
|
|
1675
|
-
styleInject(css_248z$
|
|
1680
|
+
var css_248z$q = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px;\n}";
|
|
1681
|
+
var styles$q = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
|
|
1682
|
+
styleInject(css_248z$q);
|
|
1676
1683
|
|
|
1677
1684
|
const ExpansionPanelContent = ({ children }) => {
|
|
1678
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1685
|
+
return (React__default["default"].createElement("div", { className: styles$q.expansionPanelContent }, children));
|
|
1679
1686
|
};
|
|
1680
1687
|
|
|
1681
|
-
var css_248z$
|
|
1682
|
-
var styles$
|
|
1683
|
-
styleInject(css_248z$
|
|
1688
|
+
var css_248z$p = ".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}";
|
|
1689
|
+
var styles$p = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
|
|
1690
|
+
styleInject(css_248z$p);
|
|
1684
1691
|
|
|
1685
1692
|
const ExpansionPanelHeader = (props) => {
|
|
1686
1693
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1688,15 +1695,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1688
1695
|
e.stopPropagation();
|
|
1689
1696
|
onClick && onClick(e);
|
|
1690
1697
|
};
|
|
1691
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1698
|
+
return (React__default["default"].createElement("div", { className: styles$p.expansionPanelHeader, onClick: handleClick },
|
|
1692
1699
|
children,
|
|
1693
1700
|
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1694
1701
|
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1695
1702
|
};
|
|
1696
1703
|
|
|
1697
|
-
var css_248z$
|
|
1698
|
-
var styles$
|
|
1699
|
-
styleInject(css_248z$
|
|
1704
|
+
var css_248z$o = ".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}";
|
|
1705
|
+
var styles$o = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","shadow":"ExpansionPanel-module_shadow__zIjJ6","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
|
|
1706
|
+
styleInject(css_248z$o);
|
|
1700
1707
|
|
|
1701
1708
|
const ExpansionPanel = (props) => {
|
|
1702
1709
|
const { header, children, isExpanded = false, shadow, onChange } = props;
|
|
@@ -1706,11 +1713,11 @@ const ExpansionPanel = (props) => {
|
|
|
1706
1713
|
}, [isExpanded]);
|
|
1707
1714
|
const getCssClasses = () => {
|
|
1708
1715
|
const cssClasses = [];
|
|
1709
|
-
cssClasses.push(styles$
|
|
1716
|
+
cssClasses.push(styles$o.expansionPanel);
|
|
1710
1717
|
if (_isExpanded) {
|
|
1711
|
-
cssClasses.push(styles$
|
|
1718
|
+
cssClasses.push(styles$o.isExpanded);
|
|
1712
1719
|
}
|
|
1713
|
-
shadow && cssClasses.push(styles$
|
|
1720
|
+
shadow && cssClasses.push(styles$o.shadow);
|
|
1714
1721
|
return cssClasses.filter(css => css).join(' ');
|
|
1715
1722
|
};
|
|
1716
1723
|
const handleClickHeader = (event) => {
|
|
@@ -1723,17 +1730,17 @@ const ExpansionPanel = (props) => {
|
|
|
1723
1730
|
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1724
1731
|
};
|
|
1725
1732
|
|
|
1726
|
-
var css_248z$
|
|
1727
|
-
var styles$
|
|
1728
|
-
styleInject(css_248z$
|
|
1733
|
+
var css_248z$n = ".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}";
|
|
1734
|
+
var styles$n = {"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"};
|
|
1735
|
+
styleInject(css_248z$n);
|
|
1729
1736
|
|
|
1730
1737
|
const FloatingActionButton = (props) => {
|
|
1731
1738
|
const { className, icon, color = exports.COLOR.primary, fixed, position = 'rightBottom', size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1732
1739
|
const getCssClasses = () => {
|
|
1733
1740
|
const cssClasses = [];
|
|
1734
|
-
cssClasses.push(styles$
|
|
1735
|
-
fixed && cssClasses.push(styles$
|
|
1736
|
-
position && fixed && cssClasses.push(styles$
|
|
1741
|
+
cssClasses.push(styles$n.fab);
|
|
1742
|
+
fixed && cssClasses.push(styles$n.fixed);
|
|
1743
|
+
position && fixed && cssClasses.push(styles$n[position]);
|
|
1737
1744
|
className && cssClasses.push(className);
|
|
1738
1745
|
return cssClasses.filter(css => css).join(' ');
|
|
1739
1746
|
};
|
|
@@ -1744,14 +1751,14 @@ const FloatingActionButton = (props) => {
|
|
|
1744
1751
|
return (React__default["default"].createElement(IconButton, { className: getCssClasses(), color: color, size: size, isActive: isActive, disabled: disabled, icon: icon, variant: exports.VARIANT.contained, onClick: handleClick }));
|
|
1745
1752
|
};
|
|
1746
1753
|
|
|
1747
|
-
var css_248z$
|
|
1748
|
-
var styles$
|
|
1749
|
-
styleInject(css_248z$
|
|
1754
|
+
var css_248z$m = ".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}";
|
|
1755
|
+
var styles$m = {"link":"Link-module_link__YlJQl"};
|
|
1756
|
+
styleInject(css_248z$m);
|
|
1750
1757
|
|
|
1751
1758
|
const Link = (props) => {
|
|
1752
1759
|
const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
|
|
1753
1760
|
const [status, setStatus] = React.useState(STATUS.NORMAL);
|
|
1754
|
-
const [cssClassName] = useCssClasses([styles$
|
|
1761
|
+
const [cssClassName] = useCssClasses([styles$m.link, className, status]);
|
|
1755
1762
|
const onMouseEnter = () => {
|
|
1756
1763
|
setStatus(STATUS.HOVERED);
|
|
1757
1764
|
};
|
|
@@ -1761,15 +1768,15 @@ const Link = (props) => {
|
|
|
1761
1768
|
return (React__default["default"].createElement("a", Object.assign({ className: cssClassName, href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
|
|
1762
1769
|
};
|
|
1763
1770
|
|
|
1764
|
-
var css_248z$
|
|
1765
|
-
var styles$
|
|
1766
|
-
styleInject(css_248z$
|
|
1771
|
+
var css_248z$l = ".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}";
|
|
1772
|
+
var styles$l = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","isFixed":"LoadingIndicator-module_isFixed__WCFNG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
|
|
1773
|
+
styleInject(css_248z$l);
|
|
1767
1774
|
|
|
1768
1775
|
const LoadingIndicator = (_a) => {
|
|
1769
1776
|
var rest = __rest(_a, []);
|
|
1770
1777
|
const getCssClasses = () => {
|
|
1771
1778
|
const cssClasses = [];
|
|
1772
|
-
cssClasses.push(styles$
|
|
1779
|
+
cssClasses.push(styles$l.loadingIndicator);
|
|
1773
1780
|
return cssClasses.filter(css => css).join(' ');
|
|
1774
1781
|
};
|
|
1775
1782
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -1779,8 +1786,8 @@ const LoadingIndicator = (_a) => {
|
|
|
1779
1786
|
const LoadingIndicatorContainer = ({ children, isFixed }) => {
|
|
1780
1787
|
const getCssClasses = () => {
|
|
1781
1788
|
const cssClasses = [];
|
|
1782
|
-
cssClasses.push(styles$
|
|
1783
|
-
isFixed && cssClasses.push(styles$
|
|
1789
|
+
cssClasses.push(styles$l.loadingIndicatorContainer);
|
|
1790
|
+
isFixed && cssClasses.push(styles$l.isFixed);
|
|
1784
1791
|
return cssClasses.filter(css => css).join(' ');
|
|
1785
1792
|
};
|
|
1786
1793
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1808,45 +1815,45 @@ class LoadingIndicatorService {
|
|
|
1808
1815
|
}
|
|
1809
1816
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1810
1817
|
|
|
1811
|
-
var css_248z$
|
|
1812
|
-
var styles$
|
|
1813
|
-
styleInject(css_248z$
|
|
1818
|
+
var css_248z$k = ".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}";
|
|
1819
|
+
var styles$k = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-","modalTitle":"ModalHeader-module_modalTitle__2xShH"};
|
|
1820
|
+
styleInject(css_248z$k);
|
|
1814
1821
|
|
|
1815
1822
|
const ModalHeader = (props) => {
|
|
1816
1823
|
const { children, isDismissable = false, onClose } = props, rest = __rest(props, ["children", "isDismissable", "onClose"]);
|
|
1817
1824
|
const handleClick = () => {
|
|
1818
1825
|
onClose && onClose();
|
|
1819
1826
|
};
|
|
1820
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
1821
|
-
React__default["default"].createElement("h5", { className: styles$
|
|
1827
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$k.modalHeader }, rest),
|
|
1828
|
+
React__default["default"].createElement("h5", { className: styles$k.modalTitle }, children),
|
|
1822
1829
|
isDismissable &&
|
|
1823
1830
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
1824
1831
|
};
|
|
1825
1832
|
|
|
1826
|
-
var css_248z$
|
|
1827
|
-
var styles$
|
|
1828
|
-
styleInject(css_248z$
|
|
1833
|
+
var css_248z$j = ".ModalBody-module_modalBody__D-gk2 {\n position: relative;\n flex: 1 1 auto;\n padding: 1rem;\n}";
|
|
1834
|
+
var styles$j = {"modalBody":"ModalBody-module_modalBody__D-gk2"};
|
|
1835
|
+
styleInject(css_248z$j);
|
|
1829
1836
|
|
|
1830
|
-
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: styles$
|
|
1837
|
+
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: styles$j.modalBody }, children));
|
|
1831
1838
|
|
|
1832
|
-
var css_248z$
|
|
1833
|
-
var styles$
|
|
1834
|
-
styleInject(css_248z$
|
|
1839
|
+
var css_248z$i = ".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}";
|
|
1840
|
+
var styles$i = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1841
|
+
styleInject(css_248z$i);
|
|
1835
1842
|
|
|
1836
|
-
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: styles$
|
|
1843
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: styles$i.modalFooter }, children));
|
|
1837
1844
|
|
|
1838
|
-
var css_248z$
|
|
1839
|
-
var styles$
|
|
1840
|
-
styleInject(css_248z$
|
|
1845
|
+
var css_248z$h = ".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}";
|
|
1846
|
+
var styles$h = {"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"};
|
|
1847
|
+
styleInject(css_248z$h);
|
|
1841
1848
|
|
|
1842
1849
|
const Modal = (props) => {
|
|
1843
1850
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1844
1851
|
const getCssClass = () => {
|
|
1845
1852
|
const cssClasses = [];
|
|
1846
|
-
cssClasses.push(styles$
|
|
1847
|
-
cssClasses.push(styles$
|
|
1848
|
-
fullScreen && cssClasses.push(styles$
|
|
1849
|
-
size && cssClasses.push(styles$
|
|
1853
|
+
cssClasses.push(styles$h.modalDialog);
|
|
1854
|
+
cssClasses.push(styles$h.modalDialogCentered);
|
|
1855
|
+
fullScreen && cssClasses.push(styles$h.fullscreen);
|
|
1856
|
+
size && cssClasses.push(styles$h[size]);
|
|
1850
1857
|
className && cssClasses.push(className);
|
|
1851
1858
|
return cssClasses.filter(r => r).join(' ');
|
|
1852
1859
|
};
|
|
@@ -1860,9 +1867,9 @@ const Modal = (props) => {
|
|
|
1860
1867
|
onBackdropClick && onBackdropClick();
|
|
1861
1868
|
};
|
|
1862
1869
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
1863
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1870
|
+
React__default["default"].createElement("div", { className: styles$h.modal },
|
|
1864
1871
|
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1865
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1872
|
+
React__default["default"].createElement("div", { className: styles$h.modalContent },
|
|
1866
1873
|
header &&
|
|
1867
1874
|
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1868
1875
|
React__default["default"].createElement(ModalBody, null, children),
|
|
@@ -1987,6 +1994,31 @@ const NumberSelect = (props) => {
|
|
|
1987
1994
|
return (React__default["default"].createElement(Select, { id: id, name: name, className: getCssClasses(), options: numberOptions, onChange: (e) => handleOnChange(parseInt(e)), disabled: disabled, value: newValue.toString() }));
|
|
1988
1995
|
};
|
|
1989
1996
|
|
|
1997
|
+
var css_248z$g = ".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}";
|
|
1998
|
+
var styles$g = {"progressBarContainer":"ProgressBar-module_progressBarContainer__vtbBw","progressBar":"ProgressBar-module_progressBar__hr8I8","indeterminate":"ProgressBar-module_indeterminate__WcQdD","indeterminateAnimation":"ProgressBar-module_indeterminateAnimation__SlBFt"};
|
|
1999
|
+
styleInject(css_248z$g);
|
|
2000
|
+
|
|
2001
|
+
const ProgressBar = (props) => {
|
|
2002
|
+
const { className, color = exports.COLOR.primary, value, indeterminate } = props, rest = __rest(props, ["className", "color", "value", "indeterminate"]);
|
|
2003
|
+
const getCssClasses = () => {
|
|
2004
|
+
const cssClasses = [];
|
|
2005
|
+
cssClasses.push(styles$g.progressBarContainer);
|
|
2006
|
+
className && cssClasses.push(className);
|
|
2007
|
+
return cssClasses.filter(r => r).join(' ');
|
|
2008
|
+
};
|
|
2009
|
+
const getCssClassesBar = () => {
|
|
2010
|
+
const cssClasses = [];
|
|
2011
|
+
cssClasses.push(styles$g.progressBar);
|
|
2012
|
+
indeterminate && cssClasses.push(styles$g['indeterminate']);
|
|
2013
|
+
return cssClasses.filter(r => r).join(' ');
|
|
2014
|
+
};
|
|
2015
|
+
React.useEffect(() => {
|
|
2016
|
+
document.body.style.setProperty('--progress-bar-bg', `var(--${color})`);
|
|
2017
|
+
}, [color]);
|
|
2018
|
+
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
2019
|
+
React__default["default"].createElement("div", { className: getCssClassesBar(), style: { 'width': `${(!indeterminate && value && value > 0) ? value : 100}%` }, role: "progressbar" })));
|
|
2020
|
+
};
|
|
2021
|
+
|
|
1990
2022
|
class SidebarItemModel {
|
|
1991
2023
|
constructor(id, label, path, icon, isActive, items, isCollapsible = false, isCollapsed = false) {
|
|
1992
2024
|
this.id = id;
|
|
@@ -2567,7 +2599,7 @@ const Tooltip = (props) => {
|
|
|
2567
2599
|
onMouseOver: handleMouseOver,
|
|
2568
2600
|
onMouseLeave: handleMouseLeave,
|
|
2569
2601
|
})),
|
|
2570
|
-
show &&
|
|
2602
|
+
show && text &&
|
|
2571
2603
|
React__default["default"].createElement("div", { className: styles$2.tooltip, ref: refTooltip, id: "tooltip" },
|
|
2572
2604
|
text,
|
|
2573
2605
|
React__default["default"].createElement("div", { id: "arrow", "data-popper-arrow": true }))));
|
|
@@ -2830,6 +2862,7 @@ exports.ListItemIcon = ListItemIcon;
|
|
|
2830
2862
|
exports.ListItemText = ListItemText;
|
|
2831
2863
|
exports.LoadingIndicator = LoadingIndicator;
|
|
2832
2864
|
exports.LoadingIndicatorContainer = LoadingIndicatorContainer;
|
|
2865
|
+
exports.MaxValidator = MaxValidator;
|
|
2833
2866
|
exports.Menu = Menu;
|
|
2834
2867
|
exports.MenuBody = MenuBody;
|
|
2835
2868
|
exports.MenuDivider = MenuDivider;
|
|
@@ -2844,6 +2877,7 @@ exports.ModalHeader = ModalHeader;
|
|
|
2844
2877
|
exports.MonthSelect = MonthSelect;
|
|
2845
2878
|
exports.NumberSelect = NumberSelect;
|
|
2846
2879
|
exports.PlusSolidIcon = PlusSolidIcon;
|
|
2880
|
+
exports.ProgressBar = ProgressBar;
|
|
2847
2881
|
exports.Row = Row;
|
|
2848
2882
|
exports.STATUS = STATUS;
|
|
2849
2883
|
exports.SecondSelect = SecondSelect;
|