react-asc 19.0.1 → 19.0.5
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/AutoComplete/AutoComplete.d.ts +0 -1
- package/components/Badge/Badge.d.ts +1 -1
- package/components/Breadcrumb/BreadcrumbItem.d.ts +2 -5
- package/components/ButtonGroup/ButtonGroup.d.ts +1 -3
- package/components/Card/CardBody.d.ts +1 -4
- package/components/Card/CardFooter.d.ts +1 -4
- package/components/Card/CardImage.d.ts +1 -4
- package/components/Card/CardSubtitle.d.ts +1 -4
- package/components/Card/CardText.d.ts +1 -4
- package/components/Chip/Chip.d.ts +1 -1
- package/components/ConditionalWrapper/ConditionalWrapper.d.ts +3 -3
- package/components/FloatingActionButton/FloatingActionButton.d.ts +1 -1
- package/components/Form/Form.d.ts +1 -1
- package/components/Form/FormHint/FormHint.d.ts +1 -4
- package/components/Form/FormInput/FormInput.d.ts +3 -3
- package/components/Form/FormLabel/FormLabel.d.ts +2 -4
- package/components/Form/form.interfaces.d.ts +1 -1
- package/components/Form/form.models.d.ts +2 -2
- package/components/Form/validators/IsEmptyValidator.d.ts +1 -1
- package/components/Form/validators/IsEqualValidator.d.ts +1 -1
- package/components/List/list.models.d.ts +2 -2
- package/components/LoadingIndicator/LoadingIndicator.d.ts +0 -2
- package/components/LoadingIndicator/loading-indicator.service.d.ts +2 -4
- package/components/Menu/Menu.d.ts +0 -1
- package/components/Menu/MenuBody.d.ts +1 -1
- package/components/Modal/Modal.d.ts +2 -2
- package/components/Modal/ModalHeader.d.ts +3 -4
- package/components/Select/Select.d.ts +2 -2
- package/components/SpeedDial/SpeedDialActions.d.ts +2 -6
- package/components/Stepper/Step/Step.d.ts +5 -2
- package/components/Tabs/Tab.d.ts +5 -2
- package/components/Tabs/TabIndicator.d.ts +2 -2
- package/components/Tabs/TabPanel.d.ts +0 -1
- package/components/TreeView/TreeItem.d.ts +6 -5
- package/hooks/useConstructor.d.ts +1 -1
- package/hooks/useDebounce.d.ts +2 -1
- package/index.es.js +347 -332
- package/index.js +347 -332
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -95,93 +95,93 @@ function styleInject(css, ref) {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
|
|
98
|
-
var css_248z$
|
|
99
|
-
var styles$
|
|
100
|
-
styleInject(css_248z$
|
|
98
|
+
var css_248z$X = ".Alert-module_alert__b4tbk {\n border-radius: var(--borderRadius);\n padding: 6px 16px; }\n\n.Alert-module_contained__EM0x6.Alert-module_primary__q4pNj {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n\n.Alert-module_contained__EM0x6.Alert-module_accent__a2WIl {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n\n.Alert-module_contained__EM0x6.Alert-module_secondary__syXKX {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n\n.Alert-module_contained__EM0x6.Alert-module_light__VKCXF {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n\n.Alert-module_contained__EM0x6.Alert-module_dark__3c-Hm {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Alert-module_outline__T2262.Alert-module_primary__q4pNj {\n color: var(--primary) !important;\n border: 1px solid var(--primary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_secondary__syXKX {\n color: var(--secondary) !important;\n border: 1px solid var(--secondary) !important; }\n\n.Alert-module_outline__T2262.Alert-module_accent__a2WIl {\n color: var(--accent) !important;\n border: 1px solid var(--accent) !important; }\n\n.Alert-module_outline__T2262.Alert-module_light__VKCXF {\n color: var(--light-contrast-text) !important;\n border: 1px solid var(--light) !important; }\n\n.Alert-module_outline__T2262.Alert-module_dark__3c-Hm {\n color: var(--dark) !important;\n border: 1px solid var(--dark) !important; }\n";
|
|
99
|
+
var styles$X = {"alert":"Alert-module_alert__b4tbk","contained":"Alert-module_contained__EM0x6","primary":"Alert-module_primary__q4pNj","accent":"Alert-module_accent__a2WIl","secondary":"Alert-module_secondary__syXKX","light":"Alert-module_light__VKCXF","dark":"Alert-module_dark__3c-Hm","outline":"Alert-module_outline__T2262"};
|
|
100
|
+
styleInject(css_248z$X);
|
|
101
101
|
|
|
102
102
|
const Alert = (props) => {
|
|
103
103
|
const { children, className, color = exports.COLOR.primary, variant = exports.VARIANT.contained, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "variant", "shadow"]);
|
|
104
104
|
const getCssClasses = () => {
|
|
105
105
|
const cssClasses = [];
|
|
106
|
-
cssClasses.push(styles$
|
|
106
|
+
cssClasses.push(styles$X.alert);
|
|
107
107
|
if (variant === exports.VARIANT.contained) {
|
|
108
|
-
cssClasses.push(styles$
|
|
109
|
-
cssClasses.push(styles$
|
|
108
|
+
cssClasses.push(styles$X.contained);
|
|
109
|
+
cssClasses.push(styles$X[color]);
|
|
110
110
|
}
|
|
111
111
|
if (variant === exports.VARIANT.outline) {
|
|
112
|
-
cssClasses.push(styles$
|
|
113
|
-
cssClasses.push(styles$
|
|
112
|
+
cssClasses.push(styles$X.outline);
|
|
113
|
+
cssClasses.push(styles$X[color]);
|
|
114
114
|
}
|
|
115
|
-
shadow && cssClasses.push(styles$
|
|
115
|
+
shadow && cssClasses.push(styles$X['shadow']);
|
|
116
116
|
className && cssClasses.push(className);
|
|
117
117
|
return cssClasses.filter(r => r).join(' ');
|
|
118
118
|
};
|
|
119
119
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
120
120
|
};
|
|
121
121
|
|
|
122
|
-
var css_248z$
|
|
123
|
-
var styles$
|
|
124
|
-
styleInject(css_248z$
|
|
122
|
+
var css_248z$W = ".AppBar-module_appbar__Neyh3 {\n padding: 0.5rem 1rem;\n display: flex;\n z-index: 1000;\n min-height: 64px;\n flex-shrink: 0; }\n .AppBar-module_appbar__Neyh3.AppBar-module_primary__xMqXD {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_secondary__8MkLA {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .AppBar-module_appbar__Neyh3.AppBar-module_accent__vHbkp {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .AppBar-module_appbar__Neyh3.AppBar-module_light__HGy3y {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .AppBar-module_appbar__Neyh3.AppBar-module_dark__ILq96 {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .AppBar-module_appbar__Neyh3.AppBar-module_shadow__gQN8s {\n box-shadow: var(--shadow); }\n";
|
|
123
|
+
var styles$W = {"appbar":"AppBar-module_appbar__Neyh3","primary":"AppBar-module_primary__xMqXD","secondary":"AppBar-module_secondary__8MkLA","accent":"AppBar-module_accent__vHbkp","light":"AppBar-module_light__HGy3y","dark":"AppBar-module_dark__ILq96","shadow":"AppBar-module_shadow__gQN8s"};
|
|
124
|
+
styleInject(css_248z$W);
|
|
125
125
|
|
|
126
126
|
const AppBar = (props) => {
|
|
127
127
|
const { children, className, color = exports.COLOR.primary, shadow = true } = props, rest = __rest(props, ["children", "className", "color", "shadow"]);
|
|
128
128
|
const getCssClasses = () => {
|
|
129
129
|
const cssClasses = [];
|
|
130
|
-
cssClasses.push(styles$
|
|
131
|
-
cssClasses.push(styles$
|
|
132
|
-
shadow && cssClasses.push(styles$
|
|
130
|
+
cssClasses.push(styles$W[color]);
|
|
131
|
+
cssClasses.push(styles$W.appbar);
|
|
132
|
+
shadow && cssClasses.push(styles$W['shadow']);
|
|
133
133
|
className && cssClasses.push(className);
|
|
134
134
|
return cssClasses.filter(r => r).join(' ');
|
|
135
135
|
};
|
|
136
136
|
return (React__default["default"].createElement("nav", Object.assign({ className: getCssClasses() }, rest), children));
|
|
137
137
|
};
|
|
138
138
|
|
|
139
|
-
var css_248z$
|
|
140
|
-
var styles$
|
|
141
|
-
styleInject(css_248z$
|
|
139
|
+
var css_248z$V = ".AppBarTitle-module_appbarTitle__RsFg5 {\n align-items: center;\n padding-top: 0.3125rem;\n padding-bottom: 0.3125rem;\n font-size: 1.25rem;\n line-height: 1.8;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden !important;\n display: inline-block; }\n .AppBarTitle-module_appbarTitle__RsFg5:hover {\n cursor: pointer; }\n";
|
|
140
|
+
var styles$V = {"appbarTitle":"AppBarTitle-module_appbarTitle__RsFg5"};
|
|
141
|
+
styleInject(css_248z$V);
|
|
142
142
|
|
|
143
143
|
const AppBarTitle = (props) => {
|
|
144
144
|
const { children, className, onClick } = props;
|
|
145
145
|
const getCssClass = () => {
|
|
146
146
|
const cssClasses = [];
|
|
147
|
-
cssClasses.push(styles$
|
|
147
|
+
cssClasses.push(styles$V.appbarTitle);
|
|
148
148
|
className && cssClasses.push(className);
|
|
149
149
|
return cssClasses.filter(r => r).join(' ');
|
|
150
150
|
};
|
|
151
151
|
return (React__default["default"].createElement("div", { className: getCssClass(), onClick: onClick }, children));
|
|
152
152
|
};
|
|
153
153
|
|
|
154
|
-
var css_248z$
|
|
155
|
-
var styles$
|
|
156
|
-
styleInject(css_248z$
|
|
154
|
+
var css_248z$U = ".Icon-module_icon__lFKCA {\n align-items: center;\n justify-content: center;\n display: flex;\n width: 20px;\n height: 20px; }\n .Icon-module_icon__lFKCA svg {\n width: inherit;\n height: inherit; }\n .Icon-module_icon__lFKCA.Icon-module_primary__3fID- {\n color: var(--primary); }\n .Icon-module_icon__lFKCA.Icon-module_accent__aZXGb {\n color: var(--accent); }\n .Icon-module_icon__lFKCA.Icon-module_secondary__HKKop {\n color: var(--secondary); }\n .Icon-module_icon__lFKCA.Icon-module_light__-ApMm {\n color: var(--light); }\n .Icon-module_icon__lFKCA.Icon-module_dark__DpCIK {\n color: var(--dark); }\n";
|
|
155
|
+
var styles$U = {"icon":"Icon-module_icon__lFKCA","primary":"Icon-module_primary__3fID-","accent":"Icon-module_accent__aZXGb","secondary":"Icon-module_secondary__HKKop","light":"Icon-module_light__-ApMm","dark":"Icon-module_dark__DpCIK"};
|
|
156
|
+
styleInject(css_248z$U);
|
|
157
157
|
|
|
158
158
|
const Icon = (props) => {
|
|
159
159
|
const { children, iconColor, className } = props, rest = __rest(props, ["children", "iconColor", "className"]);
|
|
160
160
|
const getCssClasses = () => {
|
|
161
161
|
const cssClasses = [];
|
|
162
|
-
cssClasses.push(styles$
|
|
163
|
-
iconColor && cssClasses.push(styles$
|
|
162
|
+
cssClasses.push(styles$U.icon);
|
|
163
|
+
iconColor && cssClasses.push(styles$U[iconColor]);
|
|
164
164
|
className && cssClasses.push(className);
|
|
165
165
|
return cssClasses.filter(css => css).join(' ');
|
|
166
166
|
};
|
|
167
167
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
168
168
|
};
|
|
169
169
|
|
|
170
|
-
var css_248z$
|
|
171
|
-
var styles$
|
|
172
|
-
styleInject(css_248z$
|
|
170
|
+
var css_248z$T = ".IconButton-module_iconButton__rpCPQ {\n border-radius: 100%;\n padding: 0px;\n display: flex;\n flex-shrink: 0;\n justify-content: center;\n align-items: center;\n min-width: auto;\n box-shadow: none;\n font-weight: 400;\n text-align: center;\n vertical-align: middle;\n -webkit-user-select: none;\n user-select: none;\n background-color: transparent;\n font-size: 1rem;\n line-height: 1.5;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n border: none; }\n .IconButton-module_iconButton__rpCPQ:hover {\n cursor: pointer; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_shadow__Uw0RK {\n box-shadow: var(--shadow); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_md__XnuSk {\n width: 48px;\n height: 48px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_lg__arEvo {\n width: 56px;\n height: 56px; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag {\n padding: 0;\n background: transparent;\n color: inherit; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G {\n color: var(--primary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY {\n color: var(--secondary); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2 {\n color: var(--accent); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO {\n color: var(--light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH {\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n color: var(--dark-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_text__Ualag.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_active__VIqU9 {\n background-color: rgba(0, 0, 0, 0.04); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G {\n background-color: var(--primary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_primary__vbo-G.IconButton-module_active__VIqU9 {\n background-color: var(--primary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY {\n background-color: var(--secondary);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_secondary__AiNAY.IconButton-module_active__VIqU9 {\n background-color: var(--secondary-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2 {\n background-color: var(--accent);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_accent__QRzM2.IconButton-module_active__VIqU9 {\n background-color: var(--accent-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO {\n background-color: var(--light);\n color: var(--dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_light__YNEiO.IconButton-module_active__VIqU9 {\n background-color: var(--light-dark); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH {\n background-color: var(--dark);\n color: var(--white); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH:hover, .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_dark__gnbUH.IconButton-module_active__VIqU9 {\n background-color: var(--dark-light); }\n .IconButton-module_iconButton__rpCPQ.IconButton-module_contained__k7vGA.IconButton-module_disabled__QB0ZV {\n color: rgba(0, 0, 0, 0.26);\n background-color: transparent;\n cursor: default;\n pointer-events: none; }\n";
|
|
171
|
+
var styles$T = {"iconButton":"IconButton-module_iconButton__rpCPQ","shadow":"IconButton-module_shadow__Uw0RK","md":"IconButton-module_md__XnuSk","lg":"IconButton-module_lg__arEvo","text":"IconButton-module_text__Ualag","active":"IconButton-module_active__VIqU9","primary":"IconButton-module_primary__vbo-G","secondary":"IconButton-module_secondary__AiNAY","accent":"IconButton-module_accent__QRzM2","light":"IconButton-module_light__YNEiO","dark":"IconButton-module_dark__gnbUH","disabled":"IconButton-module_disabled__QB0ZV","contained":"IconButton-module_contained__k7vGA"};
|
|
172
|
+
styleInject(css_248z$T);
|
|
173
173
|
|
|
174
174
|
const IconButton = (props) => {
|
|
175
175
|
const { children, icon, variant = exports.VARIANT.text, color = exports.COLOR.dark, size = exports.SIZE.md, isActive, disabled, className, shadow } = props, rest = __rest(props, ["children", "icon", "variant", "color", "size", "isActive", "disabled", "className", "shadow"]);
|
|
176
176
|
const getCssClasses = () => {
|
|
177
177
|
const cssClasses = [];
|
|
178
|
-
cssClasses.push(styles$
|
|
179
|
-
cssClasses.push(styles$
|
|
180
|
-
cssClasses.push(styles$
|
|
181
|
-
cssClasses.push(styles$
|
|
182
|
-
isActive && cssClasses.push(styles$
|
|
183
|
-
disabled && cssClasses.push(styles$
|
|
184
|
-
shadow && cssClasses.push(styles$
|
|
178
|
+
cssClasses.push(styles$T[color]);
|
|
179
|
+
cssClasses.push(styles$T[variant]);
|
|
180
|
+
cssClasses.push(styles$T[size]);
|
|
181
|
+
cssClasses.push(styles$T.iconButton);
|
|
182
|
+
isActive && cssClasses.push(styles$T.active);
|
|
183
|
+
disabled && cssClasses.push(styles$T.disabled);
|
|
184
|
+
shadow && cssClasses.push(styles$T.shadow);
|
|
185
185
|
className && cssClasses.push(className);
|
|
186
186
|
return cssClasses.filter(css => css).join(' ');
|
|
187
187
|
};
|
|
@@ -257,6 +257,7 @@ function useHover() {
|
|
|
257
257
|
const handleMouseOver = () => setValue(true);
|
|
258
258
|
const handleMouseOut = () => setValue(false);
|
|
259
259
|
React.useEffect(() => {
|
|
260
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
260
261
|
const node = ref.current;
|
|
261
262
|
if (node) {
|
|
262
263
|
node.addEventListener("mouseover", handleMouseOver);
|
|
@@ -272,7 +273,7 @@ function useHover() {
|
|
|
272
273
|
return [ref, value];
|
|
273
274
|
}
|
|
274
275
|
|
|
275
|
-
const useConstructor = (callBack
|
|
276
|
+
const useConstructor = (callBack) => {
|
|
276
277
|
const [hasBeenCalled, setHasBeenCalled] = React.useState(false);
|
|
277
278
|
if (hasBeenCalled)
|
|
278
279
|
return;
|
|
@@ -310,34 +311,34 @@ const Backdrop = (props) => {
|
|
|
310
311
|
return (reactDom.createPortal(React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), onClick: handleClick, style: getStyles() }, rest)), target));
|
|
311
312
|
};
|
|
312
313
|
|
|
313
|
-
var css_248z$
|
|
314
|
-
var styles$
|
|
315
|
-
styleInject(css_248z$
|
|
314
|
+
var css_248z$S = ".List-module_list__gpZ41 {\n width: 100%;\n display: flex;\n flex-direction: column;\n padding-left: 0;\n margin-bottom: 0;\n margin-top: 0;\n background-color: var(--white); }\n";
|
|
315
|
+
var styles$S = {"list":"List-module_list__gpZ41"};
|
|
316
|
+
styleInject(css_248z$S);
|
|
316
317
|
|
|
317
318
|
const List = (props) => {
|
|
318
319
|
const { children, className, isFlush } = props, rest = __rest(props, ["children", "className", "isFlush"]);
|
|
319
320
|
const getCssClasses = () => {
|
|
320
321
|
const cssClasses = [];
|
|
321
|
-
isFlush && cssClasses.push(styles$
|
|
322
|
-
cssClasses.push(styles$
|
|
322
|
+
isFlush && cssClasses.push(styles$S.flush);
|
|
323
|
+
cssClasses.push(styles$S.list);
|
|
323
324
|
className && cssClasses.push(className);
|
|
324
325
|
return cssClasses.filter(css => css).join(' ');
|
|
325
326
|
};
|
|
326
327
|
return (React__default["default"].createElement("ul", Object.assign({ className: getCssClasses() }, rest), children));
|
|
327
328
|
};
|
|
328
329
|
|
|
329
|
-
var css_248z$
|
|
330
|
-
var styles$
|
|
331
|
-
styleInject(css_248z$
|
|
330
|
+
var css_248z$R = ".ListItem-module_listItem__Pk1AP {\n display: flex;\n align-items: center;\n position: relative;\n padding: 0.75rem 1.25rem;\n min-width: 100%;\n color: var(--bodyColor);\n text-align: inherit;\n transition: background 0.5s ease; }\n .ListItem-module_listItem__Pk1AP:hover, .ListItem-module_listItem__Pk1AP.ListItem-module_active__zm2q8 {\n cursor: pointer;\n z-index: 1;\n text-decoration: none;\n background-color: rgba(0, 0, 0, 0.04);\n color: var(--primary); }\n .ListItem-module_listItem__Pk1AP + .ListItem-module_listItem__Pk1AP {\n border-top-width: 0; }\n .ListItem-module_listItem__Pk1AP.ListItem-module_primary__F6Qja {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_accent__pg3Ha {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_secondary__d0drD {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_light__37kby {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_dark__ZxQTF {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl {\n color: rgba(0, 0, 0, 0.26); }\n .ListItem-module_listItem__Pk1AP.ListItem-module_disabled__DQLKl:hover {\n cursor: not-allowed;\n background-color: inherit; }\n";
|
|
331
|
+
var styles$R = {"listItem":"ListItem-module_listItem__Pk1AP","active":"ListItem-module_active__zm2q8","primary":"ListItem-module_primary__F6Qja","accent":"ListItem-module_accent__pg3Ha","secondary":"ListItem-module_secondary__d0drD","light":"ListItem-module_light__37kby","dark":"ListItem-module_dark__ZxQTF","disabled":"ListItem-module_disabled__DQLKl"};
|
|
332
|
+
styleInject(css_248z$R);
|
|
332
333
|
|
|
333
334
|
const ListItem = (props) => {
|
|
334
335
|
const { children, color, active, className, disabled, onClick } = props, rest = __rest(props, ["children", "color", "active", "className", "disabled", "onClick"]);
|
|
335
336
|
const getCssClasses = () => {
|
|
336
337
|
const cssClasses = [];
|
|
337
|
-
cssClasses.push(styles$
|
|
338
|
-
color && cssClasses.push(styles$
|
|
339
|
-
active && cssClasses.push(styles$
|
|
340
|
-
disabled && cssClasses.push(styles$
|
|
338
|
+
cssClasses.push(styles$R.listItem);
|
|
339
|
+
color && cssClasses.push(styles$R[color]);
|
|
340
|
+
active && cssClasses.push(styles$R['active']);
|
|
341
|
+
disabled && cssClasses.push(styles$R['disabled']);
|
|
341
342
|
className && cssClasses.push(className);
|
|
342
343
|
return cssClasses.filter(css => css).join(' ');
|
|
343
344
|
};
|
|
@@ -347,42 +348,42 @@ const ListItem = (props) => {
|
|
|
347
348
|
return (React__default["default"].createElement("li", Object.assign({ onClick: handleClick, className: getCssClasses() }, rest), children));
|
|
348
349
|
};
|
|
349
350
|
|
|
350
|
-
var css_248z$
|
|
351
|
-
var styles$
|
|
352
|
-
styleInject(css_248z$
|
|
351
|
+
var css_248z$Q = ".ListItemAvatar-module_avatar__sVWfR {\n margin-right: 16px; }\n .ListItemAvatar-module_avatar__sVWfR svg, .ListItemAvatar-module_avatar__sVWfR img {\n width: 24px;\n height: 24px; }\n .ListItemAvatar-module_avatar__sVWfR img {\n border-radius: 50%; }\n";
|
|
352
|
+
var styles$Q = {"avatar":"ListItemAvatar-module_avatar__sVWfR"};
|
|
353
|
+
styleInject(css_248z$Q);
|
|
353
354
|
|
|
354
355
|
const ListItemAvatar = (_a) => {
|
|
355
356
|
var { avatar } = _a, rest = __rest(_a, ["avatar"]);
|
|
356
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
357
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$Q.avatar }, rest), avatar));
|
|
357
358
|
};
|
|
358
359
|
|
|
359
|
-
var css_248z$
|
|
360
|
-
var styles$
|
|
361
|
-
styleInject(css_248z$
|
|
360
|
+
var css_248z$P = ".ListItemIcon-module_icon__cCvEv {\n margin-right: 32px; }\n .ListItemIcon-module_icon__cCvEv svg {\n width: 24px;\n height: 24px; }\n";
|
|
361
|
+
var styles$P = {"icon":"ListItemIcon-module_icon__cCvEv"};
|
|
362
|
+
styleInject(css_248z$P);
|
|
362
363
|
|
|
363
364
|
const ListItemIcon = (_a) => {
|
|
364
365
|
var { icon } = _a, rest = __rest(_a, ["icon"]);
|
|
365
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
366
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$P.icon }, rest), icon));
|
|
366
367
|
};
|
|
367
368
|
|
|
368
|
-
var css_248z$
|
|
369
|
-
var styles$
|
|
370
|
-
styleInject(css_248z$
|
|
369
|
+
var css_248z$O = ".ListItemAction-module_listItemAction__gAQRj {\n display: flex;\n justify-content: center;\n min-width: 40px; }\n .ListItemAction-module_listItemAction__gAQRj svg {\n width: 20px;\n height: 20px; }\n";
|
|
370
|
+
var styles$O = {"listItemAction":"ListItemAction-module_listItemAction__gAQRj"};
|
|
371
|
+
styleInject(css_248z$O);
|
|
371
372
|
|
|
372
373
|
const ListItemAction = (_a) => {
|
|
373
374
|
var { children, onClick } = _a, rest = __rest(_a, ["children", "onClick"]);
|
|
374
|
-
return (React__default["default"].createElement("div", Object.assign({ className: styles$
|
|
375
|
+
return (React__default["default"].createElement("div", Object.assign({ className: styles$O.listItemAction, onClick: e => onClick && onClick(e) }, rest), children));
|
|
375
376
|
};
|
|
376
377
|
|
|
377
|
-
var css_248z$
|
|
378
|
-
var styles$
|
|
379
|
-
styleInject(css_248z$
|
|
378
|
+
var css_248z$N = ".ListItemTextIcon-module_listItemText__xCBLW {\n flex: 1; }\n";
|
|
379
|
+
var styles$N = {"listItemText":"ListItemTextIcon-module_listItemText__xCBLW"};
|
|
380
|
+
styleInject(css_248z$N);
|
|
380
381
|
|
|
381
382
|
const ListItemText = (_a) => {
|
|
382
383
|
var { primary, secondary } = _a, rest = __rest(_a, ["primary", "secondary"]);
|
|
383
384
|
const getCssClasses = () => {
|
|
384
385
|
const cssClasses = [];
|
|
385
|
-
cssClasses.push(styles$
|
|
386
|
+
cssClasses.push(styles$N.listItemText);
|
|
386
387
|
return cssClasses.filter(css => css).join(' ');
|
|
387
388
|
};
|
|
388
389
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -393,9 +394,9 @@ const ListItemText = (_a) => {
|
|
|
393
394
|
const ListItemTextPrimary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-primary" }, children));
|
|
394
395
|
const ListItemTextSecondary = ({ children }) => (React__default["default"].createElement("div", { className: "list-item-text-secondary text-muted", style: { fontSize: '0.875rem' } }, children));
|
|
395
396
|
|
|
396
|
-
var css_248z$
|
|
397
|
-
var styles$
|
|
398
|
-
styleInject(css_248z$
|
|
397
|
+
var css_248z$M = ".AutoComplete-module_selectContainer__1kA85 {\n position: relative; }\n\n.AutoComplete-module_select__NNYOi {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .AutoComplete-module_select__NNYOi:hover {\n cursor: pointer; }\n\n.AutoComplete-module_selectMenu__Gu81L {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 38px;\n z-index: 1050;\n max-height: 280px;\n overflow: auto; }\n";
|
|
398
|
+
var styles$M = {"selectContainer":"AutoComplete-module_selectContainer__1kA85","select":"AutoComplete-module_select__NNYOi","selectMenu":"AutoComplete-module_selectMenu__Gu81L"};
|
|
399
|
+
styleInject(css_248z$M);
|
|
399
400
|
|
|
400
401
|
// preset value
|
|
401
402
|
// enter -> delay? -> show results
|
|
@@ -451,7 +452,7 @@ const AutoComplete = (props) => {
|
|
|
451
452
|
const getCssClass = () => {
|
|
452
453
|
const cssClasses = [];
|
|
453
454
|
className && cssClasses.push(className);
|
|
454
|
-
cssClasses.push(styles$
|
|
455
|
+
cssClasses.push(styles$M.select);
|
|
455
456
|
return cssClasses.filter(r => r).join(' ');
|
|
456
457
|
};
|
|
457
458
|
const show = () => setIsShow(true);
|
|
@@ -475,35 +476,35 @@ const AutoComplete = (props) => {
|
|
|
475
476
|
setModel('');
|
|
476
477
|
setSearchText('');
|
|
477
478
|
};
|
|
478
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
479
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$M.selectContainer },
|
|
479
480
|
React__default["default"].createElement("div", { className: "d-flex" },
|
|
480
481
|
React__default["default"].createElement("input", { type: "text", className: getCssClass(), id: id, name: name, tabIndex: 0, readOnly: readOnly, disabled: disabled, onChange: handleOnChange, onFocus: handleOnFocus, placeholder: placeholder, value: model }),
|
|
481
482
|
showClearButton && (model === null || model === void 0 ? void 0 : model.length) > 0 &&
|
|
482
483
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), onClick: handleClickReset })),
|
|
483
484
|
isShow &&
|
|
484
485
|
React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
485
|
-
React__default["default"].createElement("div", { className: styles$
|
|
486
|
+
React__default["default"].createElement("div", { className: styles$M.selectMenu },
|
|
486
487
|
React__default["default"].createElement(List, null, optionsTemp && optionsTemp.map((option, index) => React__default["default"].createElement(ListItem, { id: `list-item-${index}`, key: option.value, onClick: () => handleOnClick(option), disabled: !option.value },
|
|
487
488
|
React__default["default"].createElement(ListItemText, { primary: option.label ? option.label : option.value }))))),
|
|
488
489
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: () => hide() }))));
|
|
489
490
|
};
|
|
490
491
|
|
|
491
|
-
var css_248z$
|
|
492
|
-
var styles$
|
|
493
|
-
styleInject(css_248z$
|
|
492
|
+
var css_248z$L = ".Badge-module_badgeContainer__3nZBs {\n display: inline-flex;\n position: relative;\n flex-shrink: 0;\n vertical-align: middle; }\n\n.Badge-module_badge__9ImR0 {\n top: 0;\n right: 0;\n transform: scale(1) translate(50%, -50%);\n transform-origin: 100% 0%;\n height: 20px;\n display: flex;\n padding: 0 6px;\n z-index: 1;\n position: absolute;\n flex-wrap: wrap;\n font-size: 0.75rem;\n min-width: 20px;\n align-items: center;\n font-weight: 500;\n line-height: 1;\n align-content: center;\n flex-direction: row;\n justify-content: center;\n border-radius: 10px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Badge-module_badge__9ImR0.Badge-module_primary__41U-t {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Badge-module_badge__9ImR0.Badge-module_accent__OQy2- {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Badge-module_badge__9ImR0.Badge-module_secondary__a9Jfh {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Badge-module_badge__9ImR0.Badge-module_light__4QvQ5 {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Badge-module_badge__9ImR0.Badge-module_dark__g1yUJ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n";
|
|
493
|
+
var styles$L = {"badgeContainer":"Badge-module_badgeContainer__3nZBs","badge":"Badge-module_badge__9ImR0","primary":"Badge-module_primary__41U-t","accent":"Badge-module_accent__OQy2-","secondary":"Badge-module_secondary__a9Jfh","light":"Badge-module_light__4QvQ5","dark":"Badge-module_dark__g1yUJ"};
|
|
494
|
+
styleInject(css_248z$L);
|
|
494
495
|
|
|
495
496
|
const Badge = (props) => {
|
|
496
497
|
const { children, content, className, color = exports.COLOR.primary } = props, rest = __rest(props, ["children", "content", "className", "color"]);
|
|
497
498
|
const getCssClassesBadgeContainer = () => {
|
|
498
499
|
const cssClasses = [];
|
|
499
|
-
cssClasses.push(styles$
|
|
500
|
+
cssClasses.push(styles$L.badgeContainer);
|
|
500
501
|
className && cssClasses.push(className);
|
|
501
502
|
return cssClasses.filter(css => css).join(' ');
|
|
502
503
|
};
|
|
503
504
|
const getCssClassesBadge = () => {
|
|
504
505
|
const cssClasses = [];
|
|
505
|
-
cssClasses.push(styles$
|
|
506
|
-
cssClasses.push(styles$
|
|
506
|
+
cssClasses.push(styles$L.badge);
|
|
507
|
+
cssClasses.push(styles$L[color]);
|
|
507
508
|
return cssClasses.filter(css => css).join(' ');
|
|
508
509
|
};
|
|
509
510
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClassesBadgeContainer() }, rest),
|
|
@@ -511,26 +512,26 @@ const Badge = (props) => {
|
|
|
511
512
|
React__default["default"].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
512
513
|
};
|
|
513
514
|
|
|
514
|
-
var css_248z$
|
|
515
|
-
var styles$
|
|
516
|
-
styleInject(css_248z$
|
|
515
|
+
var css_248z$K = ".Button-module_button__qeIer {\n text-transform: uppercase !important;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius);\n box-shadow: var(--shadow); }\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover {\n background-color: var(--primary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover {\n background-color: var(--accent-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover {\n background-color: var(--secondary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover {\n background-color: var(--light-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover {\n background-color: var(--dark-dark); }\n\n.Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed; }\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary) !important; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover {\n text-decoration: none;\n background: var(--primary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary) !important; }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover {\n text-decoration: none;\n background: var(--secondary-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent) !important; }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover {\n text-decoration: none;\n background: var(--accent-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important; }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover {\n text-decoration: none;\n background: var(--light-highlight) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark) !important; }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover {\n text-decoration: none;\n background: var(--dark-highlight) !important; }\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary) !important;\n border-color: var(--primary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover {\n background: var(--primary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary) !important;\n border-color: var(--secondary) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover {\n background: var(--secondary-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent) !important;\n border-color: var(--accent) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover {\n background: var(--accent-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text) !important;\n border-color: var(--light) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover {\n background: var(--light-highlight) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark) !important;\n border-color: var(--dark) !important; }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover {\n background: var(--dark-highlight) !important; }\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px; }\n";
|
|
516
|
+
var styles$K = {"button":"Button-module_button__qeIer","btnContained":"Button-module_btnContained__16y5l","primary":"Button-module_primary__EUyOu","accent":"Button-module_accent__opVgQ","secondary":"Button-module_secondary__zKoGk","light":"Button-module_light__LXeZy","dark":"Button-module_dark__5oFOT","btnText":"Button-module_btnText__N5Gys","btnOutline":"Button-module_btnOutline__CCFPI","startIcon":"Button-module_startIcon__Eylwr","endIcon":"Button-module_endIcon__pCffL"};
|
|
517
|
+
styleInject(css_248z$K);
|
|
517
518
|
|
|
518
519
|
const Button = (props) => {
|
|
519
520
|
const { children, variant = exports.VARIANT.contained, color = exports.COLOR.primary, isRounded, isActive, className, startIcon, endIcon } = props, rest = __rest(props, ["children", "variant", "color", "isRounded", "isActive", "className", "startIcon", "endIcon"]);
|
|
520
521
|
const getCssClasses = () => {
|
|
521
522
|
const cssClasses = [];
|
|
522
|
-
cssClasses.push(styles$
|
|
523
|
+
cssClasses.push(styles$K.button);
|
|
523
524
|
if (variant !== 'outline' && variant !== 'text') {
|
|
524
|
-
cssClasses.push(styles$
|
|
525
|
-
cssClasses.push(styles$
|
|
525
|
+
cssClasses.push(styles$K.btnContained);
|
|
526
|
+
cssClasses.push(styles$K[color]);
|
|
526
527
|
}
|
|
527
528
|
if (variant === 'outline') {
|
|
528
|
-
cssClasses.push(styles$
|
|
529
|
-
cssClasses.push(styles$
|
|
529
|
+
cssClasses.push(styles$K.btnOutline);
|
|
530
|
+
cssClasses.push(styles$K[color]);
|
|
530
531
|
}
|
|
531
532
|
if (variant === 'text') {
|
|
532
|
-
cssClasses.push(styles$
|
|
533
|
-
cssClasses.push(styles$
|
|
533
|
+
cssClasses.push(styles$K.btnText);
|
|
534
|
+
cssClasses.push(styles$K[color]);
|
|
534
535
|
}
|
|
535
536
|
if (isRounded && variant !== 'text') {
|
|
536
537
|
cssClasses.push(`rounded-pill`);
|
|
@@ -544,36 +545,36 @@ const Button = (props) => {
|
|
|
544
545
|
return (React__default["default"].createElement("button", Object.assign({ type: "button", className: getCssClasses() }, rest),
|
|
545
546
|
React__default["default"].createElement("span", { className: "d-flex justify-content-center" },
|
|
546
547
|
startIcon &&
|
|
547
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
548
|
+
React__default["default"].createElement(Icon, { className: styles$K.startIcon }, startIcon),
|
|
548
549
|
children,
|
|
549
550
|
endIcon &&
|
|
550
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
551
|
+
React__default["default"].createElement(Icon, { className: styles$K.endIcon }, endIcon))));
|
|
551
552
|
};
|
|
552
553
|
|
|
553
|
-
var css_248z$
|
|
554
|
-
var styles$
|
|
555
|
-
styleInject(css_248z$
|
|
554
|
+
var css_248z$J = ".ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0; }\n\n.ButtonGroup-module_buttonGroup__w6iB- button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0; }\n";
|
|
555
|
+
var styles$J = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
556
|
+
styleInject(css_248z$J);
|
|
556
557
|
|
|
557
558
|
const ButtonGroup = (props) => {
|
|
558
559
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
559
560
|
const getCssClasses = () => {
|
|
560
561
|
const cssClasses = [];
|
|
561
|
-
cssClasses.push(styles$
|
|
562
|
+
cssClasses.push(styles$J.buttonGroup);
|
|
562
563
|
className && cssClasses.push(className);
|
|
563
564
|
return cssClasses.filter(css => css).join(' ');
|
|
564
565
|
};
|
|
565
566
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), role: "group" }, rest), children));
|
|
566
567
|
};
|
|
567
568
|
|
|
568
|
-
var css_248z$
|
|
569
|
-
var styles$
|
|
570
|
-
styleInject(css_248z$
|
|
569
|
+
var css_248z$I = ".Breadcrumb-module_breadcrumb__-pvAn {\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n margin-bottom: 0;\n list-style: none;\n margin-bottom: 1rem; }\n";
|
|
570
|
+
var styles$I = {"breadcrumb":"Breadcrumb-module_breadcrumb__-pvAn"};
|
|
571
|
+
styleInject(css_248z$I);
|
|
571
572
|
|
|
572
573
|
const Breadcrumb = (props) => {
|
|
573
574
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
574
575
|
const getCssClasses = () => {
|
|
575
576
|
const cssClasses = [];
|
|
576
|
-
cssClasses.push(styles$
|
|
577
|
+
cssClasses.push(styles$I.breadcrumb);
|
|
577
578
|
className && cssClasses.push(className);
|
|
578
579
|
return cssClasses.filter(css => css).join(' ');
|
|
579
580
|
};
|
|
@@ -583,15 +584,15 @@ const Breadcrumb = (props) => {
|
|
|
583
584
|
|
|
584
585
|
const ConditionalWrapper = ({ condition, wrapper, children }) => condition ? wrapper(children) : children;
|
|
585
586
|
|
|
586
|
-
var css_248z$
|
|
587
|
-
var styles$
|
|
588
|
-
styleInject(css_248z$
|
|
587
|
+
var css_248z$H = ".BreadcrumbItem-module_breadcrumbItem__zsUq- {\n display: flex;\n align-items: center; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq- {\n padding-left: 0.5rem; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- + .BreadcrumbItem-module_breadcrumbItem__zsUq-::before {\n float: left;\n padding-right: 0.5rem;\n color: #6c757d;\n content: \"/\"; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq- a:not([href]):not([class]) {\n color: var(--primary); }\n .BreadcrumbItem-module_breadcrumbItem__zsUq-:hover {\n cursor: pointer; }\n .BreadcrumbItem-module_breadcrumbItem__zsUq-.BreadcrumbItem-module_active__Kn1dA:hover {\n cursor: unset; }\n";
|
|
588
|
+
var styles$H = {"breadcrumbItem":"BreadcrumbItem-module_breadcrumbItem__zsUq-","active":"BreadcrumbItem-module_active__Kn1dA"};
|
|
589
|
+
styleInject(css_248z$H);
|
|
589
590
|
|
|
590
591
|
const BreadcrumbItem = (props) => {
|
|
591
592
|
const { children, className, isActive, onClick } = props;
|
|
592
593
|
const getCssClasses = () => {
|
|
593
594
|
const cssClasses = [];
|
|
594
|
-
cssClasses.push(styles$
|
|
595
|
+
cssClasses.push(styles$H.breadcrumbItem);
|
|
595
596
|
className && cssClasses.push(className);
|
|
596
597
|
isActive && cssClasses.push('active');
|
|
597
598
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -600,120 +601,118 @@ const BreadcrumbItem = (props) => {
|
|
|
600
601
|
onClick && onClick(event);
|
|
601
602
|
};
|
|
602
603
|
return (React__default["default"].createElement("li", { className: getCssClasses(), onClick: handleClick },
|
|
603
|
-
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive,
|
|
604
|
-
// eslint-disable-next-line jsx-a11y/anchor-is-valid
|
|
605
|
-
wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
604
|
+
React__default["default"].createElement(ConditionalWrapper, { condition: !isActive, wrapper: label => React__default["default"].createElement("a", null, label) }, children)));
|
|
606
605
|
};
|
|
607
606
|
|
|
608
|
-
var css_248z$
|
|
609
|
-
var styles$
|
|
610
|
-
styleInject(css_248z$
|
|
607
|
+
var css_248z$G = ".Card-module_card__TQdQq {\n background: var(--white);\n border-radius: var(--borderRadius); }\n .Card-module_card__TQdQq.Card-module_shadow__NxDVz {\n box-shadow: var(--shadow); }\n";
|
|
608
|
+
var styles$G = {"card":"Card-module_card__TQdQq","shadow":"Card-module_shadow__NxDVz"};
|
|
609
|
+
styleInject(css_248z$G);
|
|
611
610
|
|
|
612
611
|
const Card = (props) => {
|
|
613
612
|
const { children, className, shadow = true } = props, rest = __rest(props, ["children", "className", "shadow"]);
|
|
614
613
|
const getCssClasses = () => {
|
|
615
614
|
const cssClasses = [];
|
|
616
|
-
cssClasses.push(styles$
|
|
617
|
-
shadow && cssClasses.push(styles$
|
|
615
|
+
cssClasses.push(styles$G.card);
|
|
616
|
+
shadow && cssClasses.push(styles$G.shadow);
|
|
618
617
|
className && cssClasses.push(className);
|
|
619
618
|
return cssClasses.filter(css => css).join(' ');
|
|
620
619
|
};
|
|
621
620
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
622
621
|
};
|
|
623
622
|
|
|
624
|
-
var css_248z$
|
|
625
|
-
var styles$
|
|
626
|
-
styleInject(css_248z$
|
|
623
|
+
var css_248z$F = ".CardBody-module_cardBody__X52VY {\n flex: 1 1 auto;\n min-height: 1px;\n padding: 1.25rem; }\n";
|
|
624
|
+
var styles$F = {"cardBody":"CardBody-module_cardBody__X52VY"};
|
|
625
|
+
styleInject(css_248z$F);
|
|
627
626
|
|
|
628
627
|
const CardBody = (props) => {
|
|
629
628
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
630
629
|
const getCssClasses = () => {
|
|
631
630
|
const cssClasses = [];
|
|
632
|
-
cssClasses.push(styles$
|
|
631
|
+
cssClasses.push(styles$F.cardBody);
|
|
633
632
|
className && cssClasses.push(className);
|
|
634
633
|
return cssClasses.filter(css => css).join(' ');
|
|
635
634
|
};
|
|
636
635
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
637
636
|
};
|
|
638
637
|
|
|
639
|
-
var css_248z$
|
|
640
|
-
var styles$
|
|
641
|
-
styleInject(css_248z$
|
|
638
|
+
var css_248z$E = ".CardFooter-module_cardFooter__BpOTG {\n padding: 0.75rem 1.25rem;\n background-color: rgba(0, 0, 0, 0.03);\n border-top: 1px solid rgba(0, 0, 0, 0.125); }\n .CardFooter-module_cardFooter__BpOTG:last-child {\n border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); }\n";
|
|
639
|
+
var styles$E = {"cardFooter":"CardFooter-module_cardFooter__BpOTG"};
|
|
640
|
+
styleInject(css_248z$E);
|
|
642
641
|
|
|
643
642
|
const CardFooter = (props) => {
|
|
644
643
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
645
644
|
const getCssClasses = () => {
|
|
646
645
|
const cssClasses = [];
|
|
647
|
-
cssClasses.push(styles$
|
|
646
|
+
cssClasses.push(styles$E.cardFooter);
|
|
648
647
|
className && cssClasses.push(className);
|
|
649
648
|
return cssClasses.filter(css => css).join(' ');
|
|
650
649
|
};
|
|
651
650
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
652
651
|
};
|
|
653
652
|
|
|
654
|
-
var css_248z$
|
|
655
|
-
var styles$
|
|
656
|
-
styleInject(css_248z$
|
|
653
|
+
var css_248z$D = ".CardSubtitle-module_cardSubtitle__YdoRM {\n color: #6c757d !important; }\n";
|
|
654
|
+
var styles$D = {"cardSubtitle":"CardSubtitle-module_cardSubtitle__YdoRM"};
|
|
655
|
+
styleInject(css_248z$D);
|
|
657
656
|
|
|
658
657
|
const CardSubtitle = (props) => {
|
|
659
658
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
660
659
|
const getCssClasses = () => {
|
|
661
660
|
const cssClasses = [];
|
|
662
|
-
cssClasses.push(styles$
|
|
661
|
+
cssClasses.push(styles$D.cardSubtitle);
|
|
663
662
|
className && cssClasses.push(className);
|
|
664
663
|
return cssClasses.filter(css => css).join(' ');
|
|
665
664
|
};
|
|
666
665
|
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
667
666
|
};
|
|
668
667
|
|
|
669
|
-
var css_248z$
|
|
670
|
-
var styles$
|
|
671
|
-
styleInject(css_248z$
|
|
668
|
+
var css_248z$C = ".CardText-module_cardText__UtYd9:last-child {\n margin-bottom: 0; }\n";
|
|
669
|
+
var styles$C = {"cardText":"CardText-module_cardText__UtYd9"};
|
|
670
|
+
styleInject(css_248z$C);
|
|
672
671
|
|
|
673
672
|
const CardText = (props) => {
|
|
674
673
|
const { children, className } = props, rest = __rest(props, ["children", "className"]);
|
|
675
674
|
const getCssClasses = () => {
|
|
676
675
|
const cssClasses = [];
|
|
677
|
-
cssClasses.push(styles$
|
|
676
|
+
cssClasses.push(styles$C.cardText);
|
|
678
677
|
className && cssClasses.push(className);
|
|
679
678
|
return cssClasses.filter(css => css).join(' ');
|
|
680
679
|
};
|
|
681
|
-
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest),
|
|
680
|
+
return (React__default["default"].createElement("p", Object.assign({ className: getCssClasses() }, rest), children));
|
|
682
681
|
};
|
|
683
682
|
|
|
684
|
-
var css_248z$
|
|
685
|
-
var styles$
|
|
686
|
-
styleInject(css_248z$
|
|
683
|
+
var css_248z$B = ".CardTitle-module_cardTitle__aiPSE {\n margin-bottom: 0;\n font-size: 1.5rem;\n font-weight: 400;\n line-height: 1.334;\n letter-spacing: 0em; }\n";
|
|
684
|
+
var styles$B = {"cardTitle":"CardTitle-module_cardTitle__aiPSE"};
|
|
685
|
+
styleInject(css_248z$B);
|
|
687
686
|
|
|
688
687
|
const CardTitle = (props) => {
|
|
689
688
|
const { children, className, as: As = 'div' } = props, rest = __rest(props, ["children", "className", "as"]);
|
|
690
689
|
const getCssClasses = () => {
|
|
691
690
|
const cssClasses = [];
|
|
692
|
-
cssClasses.push(styles$
|
|
691
|
+
cssClasses.push(styles$B.cardTitle);
|
|
693
692
|
className && cssClasses.push(className);
|
|
694
693
|
return cssClasses.filter(css => css).join(' ');
|
|
695
694
|
};
|
|
696
695
|
return (React__default["default"].createElement(As, Object.assign({ className: getCssClasses() }, rest), children));
|
|
697
696
|
};
|
|
698
697
|
|
|
699
|
-
var css_248z$
|
|
700
|
-
var styles$
|
|
701
|
-
styleInject(css_248z$
|
|
698
|
+
var css_248z$A = ".CardImage-module_cardImage__Z6JWW {\n flex-shrink: 0;\n width: 100%;\n border-top-left-radius: calc(0.25rem - 1px);\n border-top-right-radius: calc(0.25rem - 1px); }\n";
|
|
699
|
+
var styles$A = {"cardImage":"CardImage-module_cardImage__Z6JWW"};
|
|
700
|
+
styleInject(css_248z$A);
|
|
702
701
|
|
|
703
702
|
const CardImage = (props) => {
|
|
704
703
|
const { src, alt, className } = props, rest = __rest(props, ["src", "alt", "className"]);
|
|
705
704
|
const getCssClasses = () => {
|
|
706
705
|
const cssClasses = [];
|
|
707
|
-
cssClasses.push(styles$
|
|
706
|
+
cssClasses.push(styles$A.cardImage);
|
|
708
707
|
className && cssClasses.push(className);
|
|
709
708
|
return cssClasses.filter(css => css).join(' ');
|
|
710
709
|
};
|
|
711
710
|
return (React__default["default"].createElement("img", Object.assign({ className: getCssClasses(), src: src, alt: alt }, rest)));
|
|
712
711
|
};
|
|
713
712
|
|
|
714
|
-
var css_248z$
|
|
715
|
-
var styles$
|
|
716
|
-
styleInject(css_248z$
|
|
713
|
+
var css_248z$z = ".Checkbox-module_checkboxContainer__x2GCi {\n display: flex;\n align-items: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Checkbox-module_checkboxContainer__x2GCi label {\n margin-bottom: 0;\n margin-left: 0; }\n .Checkbox-module_checkboxContainer__x2GCi label:hover {\n cursor: pointer; }\n\n.Checkbox-module_checkboxLabel__nPY4k.Checkbox-module_disabled__wnFIG {\n color: rgba(0, 0, 0, 0.26);\n cursor: not-allowed; }\n";
|
|
714
|
+
var styles$z = {"checkboxContainer":"Checkbox-module_checkboxContainer__x2GCi","checkboxLabel":"Checkbox-module_checkboxLabel__nPY4k","disabled":"Checkbox-module_disabled__wnFIG"};
|
|
715
|
+
styleInject(css_248z$z);
|
|
717
716
|
|
|
718
717
|
const Checkbox = (props) => {
|
|
719
718
|
const { id, checked, className, label, name, value = "off", disabled, readOnly } = props, rest = __rest(props, ["id", "checked", "className", "label", "name", "value", "disabled", "readOnly"]);
|
|
@@ -750,24 +749,24 @@ const Checkbox = (props) => {
|
|
|
750
749
|
(_a = checkboxElement === null || checkboxElement === void 0 ? void 0 : checkboxElement.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
751
750
|
}
|
|
752
751
|
};
|
|
753
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
752
|
+
return (React__default["default"].createElement("div", { className: styles$z.checkboxContainer },
|
|
754
753
|
React__default["default"].createElement(IconButton, { className: getCssClasses(), onClick: handleClick, icon: getIcon(), disabled: disabled || readOnly }),
|
|
755
|
-
React__default["default"].createElement("label", { onClick: handleClick, className: styles$
|
|
754
|
+
React__default["default"].createElement("label", { onClick: handleClick, className: styles$z.checkboxLabel + ' ' + (disabled ? styles$z['disabled'] : undefined) }, label),
|
|
756
755
|
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))));
|
|
757
756
|
};
|
|
758
757
|
|
|
759
|
-
var css_248z$
|
|
760
|
-
var styles$
|
|
761
|
-
styleInject(css_248z$
|
|
758
|
+
var css_248z$y = ".Chip-module_chip__dZ5qz {\n display: inline-flex;\n align-items: center;\n padding: 0.5rem;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n font-size: 75%;\n font-weight: 700;\n border-radius: 10rem;\n line-height: 1; }\n .Chip-module_chip__dZ5qz svg {\n width: 18px;\n height: 18px; }\n .Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx {\n margin-left: 5px; }\n .Chip-module_chip__dZ5qz .Chip-module_deleteIcon__--rUx:hover {\n cursor: pointer; }\n .Chip-module_chip__dZ5qz.Chip-module_primary__YVDi9 {\n background: var(--primary);\n color: var(--primary-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_secondary__-e4xP {\n background: var(--secondary);\n color: var(--secondary-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_accent__ZCTwu {\n background: var(--accent);\n color: var(--accent-contrast-text); }\n .Chip-module_chip__dZ5qz.Chip-module_light__vKs7O {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Chip-module_chip__dZ5qz.Chip-module_dark__G-FLQ {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover {\n cursor: pointer; }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_primary__YVDi9 {\n background: var(--primary-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_secondary__-e4xP {\n background: var(--secondary-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_clickable__qAqVH:hover.Chip-module_accent__ZCTwu {\n background: var(--accent-dark); }\n .Chip-module_chip__dZ5qz.Chip-module_shadow__v11NF {\n box-shadow: var(--shadow); }\n";
|
|
759
|
+
var styles$y = {"chip":"Chip-module_chip__dZ5qz","deleteIcon":"Chip-module_deleteIcon__--rUx","primary":"Chip-module_primary__YVDi9","secondary":"Chip-module_secondary__-e4xP","accent":"Chip-module_accent__ZCTwu","light":"Chip-module_light__vKs7O","dark":"Chip-module_dark__G-FLQ","clickable":"Chip-module_clickable__qAqVH","shadow":"Chip-module_shadow__v11NF"};
|
|
760
|
+
styleInject(css_248z$y);
|
|
762
761
|
|
|
763
762
|
const Chip = (props) => {
|
|
764
763
|
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"]);
|
|
765
764
|
const getCssClass = () => {
|
|
766
765
|
const cssClasses = [];
|
|
767
|
-
cssClasses.push(styles$
|
|
768
|
-
cssClasses.push(styles$
|
|
769
|
-
shadow && cssClasses.push(styles$
|
|
770
|
-
onClick && cssClasses.push(styles$
|
|
766
|
+
cssClasses.push(styles$y.chip);
|
|
767
|
+
cssClasses.push(styles$y[color]);
|
|
768
|
+
shadow && cssClasses.push(styles$y['shadow']);
|
|
769
|
+
onClick && cssClasses.push(styles$y['clickable']);
|
|
771
770
|
className && cssClasses.push(className);
|
|
772
771
|
return cssClasses.filter(r => r).join(' ');
|
|
773
772
|
};
|
|
@@ -777,18 +776,18 @@ const Chip = (props) => {
|
|
|
777
776
|
};
|
|
778
777
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClass() }, rest, { style: style }),
|
|
779
778
|
React__default["default"].createElement("div", null, children),
|
|
780
|
-
isDeletable && (React__default["default"].createElement("div", { className: styles$
|
|
779
|
+
isDeletable && (React__default["default"].createElement("div", { className: styles$y.deleteIcon, onClick: e => handleClickOnDelete(e) }, deleteIcon))));
|
|
781
780
|
};
|
|
782
781
|
|
|
783
|
-
var css_248z$
|
|
784
|
-
var styles$
|
|
785
|
-
styleInject(css_248z$
|
|
782
|
+
var css_248z$x = ".FormLabel-module_formLabel__TXcHc {\n margin-bottom: .5rem; }\n";
|
|
783
|
+
var styles$x = {"formLabel":"FormLabel-module_formLabel__TXcHc"};
|
|
784
|
+
styleInject(css_248z$x);
|
|
786
785
|
|
|
787
|
-
const FormLabel = (
|
|
788
|
-
|
|
786
|
+
const FormLabel = (_a) => {
|
|
787
|
+
var { children, className, htmlFor } = _a, rest = __rest(_a, ["children", "className", "htmlFor"]);
|
|
789
788
|
const getCssClasses = () => {
|
|
790
789
|
const cssClasses = [];
|
|
791
|
-
cssClasses.push(styles$
|
|
790
|
+
cssClasses.push(styles$x.formLabel);
|
|
792
791
|
className && cssClasses.push(className);
|
|
793
792
|
return cssClasses.filter(css => css).join(' ');
|
|
794
793
|
};
|
|
@@ -801,7 +800,7 @@ const FormGroup = (props) => {
|
|
|
801
800
|
};
|
|
802
801
|
|
|
803
802
|
const FileInput = (props) => {
|
|
804
|
-
const { id,
|
|
803
|
+
const { id, className, children, name, multiple = false, accept, disabled, onChange, readOnly, value, deletable = false } = props, rest = __rest(props, ["id", "className", "children", "name", "multiple", "accept", "disabled", "onChange", "readOnly", "value", "deletable"]);
|
|
805
804
|
const inputFileElement = React.useRef(null);
|
|
806
805
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
807
806
|
const [model, setModel] = React.useState(value);
|
|
@@ -816,8 +815,7 @@ const FileInput = (props) => {
|
|
|
816
815
|
setFileList(values);
|
|
817
816
|
onChange && onChange(event);
|
|
818
817
|
};
|
|
819
|
-
const handleOnDelete = (
|
|
820
|
-
// TODO - setModel
|
|
818
|
+
const handleOnDelete = () => {
|
|
821
819
|
alert('coming soon');
|
|
822
820
|
};
|
|
823
821
|
return (React__default["default"].createElement("div", { className: "d-flex align-items-start" },
|
|
@@ -826,9 +824,9 @@ const FileInput = (props) => {
|
|
|
826
824
|
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))));
|
|
827
825
|
};
|
|
828
826
|
|
|
829
|
-
var css_248z$
|
|
830
|
-
var styles$
|
|
831
|
-
styleInject(css_248z$
|
|
827
|
+
var css_248z$w = ".Select-module_selectContainer__DHFDZ {\n position: relative; }\n\n.Select-module_select__Fbn38 {\n min-height: calc(1.5em + 0.75rem + 2px);\n height: auto;\n display: flex; }\n .Select-module_select__Fbn38:hover {\n cursor: pointer; }\n\n.Select-module_selectMenu__8y4kQ {\n background-color: var(--light);\n position: absolute;\n box-shadow: var(--shadow);\n border-radius: var(--borderRadius);\n width: 100%;\n top: 2px;\n z-index: 1112;\n max-height: 280px;\n overflow: auto; }\n";
|
|
828
|
+
var styles$w = {"selectContainer":"Select-module_selectContainer__DHFDZ","select":"Select-module_select__Fbn38","selectMenu":"Select-module_selectMenu__8y4kQ"};
|
|
829
|
+
styleInject(css_248z$w);
|
|
832
830
|
|
|
833
831
|
const Select = (props) => {
|
|
834
832
|
var _a, _b, _c;
|
|
@@ -841,11 +839,11 @@ const Select = (props) => {
|
|
|
841
839
|
const getCssClass = () => {
|
|
842
840
|
const cssClasses = [];
|
|
843
841
|
className && cssClasses.push(className);
|
|
844
|
-
cssClasses.push(styles$
|
|
842
|
+
cssClasses.push(styles$w.select);
|
|
845
843
|
return cssClasses.filter(r => r).join(' ');
|
|
846
844
|
};
|
|
847
845
|
React.useEffect(() => {
|
|
848
|
-
const newValue =
|
|
846
|
+
const newValue = value ? value : '';
|
|
849
847
|
writeValue(newValue);
|
|
850
848
|
if (newValue) {
|
|
851
849
|
const option = options.find(o => o.value === newValue);
|
|
@@ -917,7 +915,7 @@ const Select = (props) => {
|
|
|
917
915
|
let result = null;
|
|
918
916
|
if (selectedOptions.length <= multipleMaxCountItems && selectedOptions.length > 0) {
|
|
919
917
|
result = selectedOptions
|
|
920
|
-
.map(
|
|
918
|
+
.map(option => React__default["default"].createElement(Chip, { key: option.value, className: "mr-2", color: exports.COLOR.primary, isDeletable: true, onDelete: (e) => handleOnDelete(e, option) }, option.label));
|
|
921
919
|
}
|
|
922
920
|
else {
|
|
923
921
|
result = React__default["default"].createElement("span", null,
|
|
@@ -959,7 +957,7 @@ const Select = (props) => {
|
|
|
959
957
|
}
|
|
960
958
|
}
|
|
961
959
|
};
|
|
962
|
-
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$
|
|
960
|
+
return (React__default["default"].createElement("div", { ref: selectConainter, className: styles$w.selectContainer },
|
|
963
961
|
React__default["default"].createElement("div", { id: id, className: getCssClass(), onClick: () => show(), tabIndex: 0, onKeyDown: e => handleOnKeyDown(e) },
|
|
964
962
|
!multiple && renderSingleViewModel(),
|
|
965
963
|
multiple && renderMultipleViewModel(),
|
|
@@ -967,7 +965,7 @@ const Select = (props) => {
|
|
|
967
965
|
React__default["default"].createElement(ChevronDownSolidIcon, null))),
|
|
968
966
|
isShow &&
|
|
969
967
|
reactDom.createPortal(React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
970
|
-
React__default["default"].createElement("div", { className: styles$
|
|
968
|
+
React__default["default"].createElement("div", { className: styles$w.selectMenu, style: { left: (_a = selectConainter.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().x, top: (_b = selectConainter.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().y, width: (_c = selectConainter.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().width } },
|
|
971
969
|
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) },
|
|
972
970
|
multiple &&
|
|
973
971
|
React__default["default"].createElement(Checkbox, { checked: isActive(option), onChange: () => handleOnClick(option) }),
|
|
@@ -975,37 +973,39 @@ const Select = (props) => {
|
|
|
975
973
|
React__default["default"].createElement(Backdrop, { style: { zIndex: 1111 }, isTransparent: true, onClick: () => hide() })), document.body)));
|
|
976
974
|
};
|
|
977
975
|
|
|
978
|
-
var css_248z$
|
|
979
|
-
var styles$
|
|
980
|
-
styleInject(css_248z$
|
|
976
|
+
var css_248z$v = "textarea {\n min-height: calc(10em + 0.75rem + 2px);\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n background-clip: padding-box;\n border: 2px solid var(--input-border-color);\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n border-radius: var(--borderRadius);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n resize: vertical; }\n textarea:focus {\n outline: none !important;\n border-color: var(--primary); }\n";
|
|
977
|
+
var styles$v = {};
|
|
978
|
+
styleInject(css_248z$v);
|
|
981
979
|
|
|
982
980
|
const Textarea = (props) => {
|
|
983
981
|
const { className } = props, rest = __rest(props, ["className"]);
|
|
984
982
|
const getCssClass = () => {
|
|
985
983
|
const cssClasses = [];
|
|
986
|
-
cssClasses.push(styles$
|
|
984
|
+
cssClasses.push(styles$v.textarea);
|
|
987
985
|
className && cssClasses.push(className);
|
|
988
986
|
return cssClasses.filter(r => r).join(' ');
|
|
989
987
|
};
|
|
990
988
|
return (React__default["default"].createElement("textarea", Object.assign({ className: getCssClass() }, rest)));
|
|
991
989
|
};
|
|
992
990
|
|
|
993
|
-
var css_248z$
|
|
994
|
-
var styles$
|
|
995
|
-
styleInject(css_248z$
|
|
991
|
+
var css_248z$u = ".FormInput-module_formInput__VXZip {\n display: block;\n width: 100%;\n padding: 0.375rem 0.75rem;\n font-size: 1rem;\n font-weight: 400;\n line-height: 1.5;\n color: #212529;\n background-color: #fff;\n background-clip: padding-box;\n border: 1px solid #ced4da;\n -webkit-appearance: none;\n appearance: none;\n border-radius: 0.25rem;\n box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.08);\n transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n .FormInput-module_formInput__VXZip:focus {\n color: #212529;\n background-color: #fff;\n border-color: #86b7fe;\n outline: 0;\n box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25); }\n";
|
|
992
|
+
var styles$u = {"formInput":"FormInput-module_formInput__VXZip"};
|
|
993
|
+
styleInject(css_248z$u);
|
|
996
994
|
|
|
997
995
|
const FormInput = (props) => {
|
|
998
996
|
const { value, name, type, placeholder, className = 'form-control', isValid = true, options = [], textareaOptions, selectOptions, autoCompleteOptions, autoFocus, label, disabled = false, readonly = false, onInput, onChange, onBlur, onKeyDown } = props;
|
|
999
997
|
const getCssClasses = () => {
|
|
1000
998
|
const cssClasses = [];
|
|
1001
|
-
cssClasses.push(styles$
|
|
999
|
+
cssClasses.push(styles$u.formInput);
|
|
1002
1000
|
className && cssClasses.push(className);
|
|
1003
1001
|
!isValid && cssClasses.push('is-invalid');
|
|
1004
1002
|
return cssClasses.filter(css => css).join(' ');
|
|
1005
1003
|
};
|
|
1004
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1006
1005
|
const handleOnInput = (value, type, name) => {
|
|
1007
1006
|
onInput && onInput({ value, type, name });
|
|
1008
1007
|
};
|
|
1008
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1009
1009
|
const handleOnChange = (value, type, name) => {
|
|
1010
1010
|
onChange && onChange({ value, type, name });
|
|
1011
1011
|
};
|
|
@@ -1025,15 +1025,15 @@ const FormInput = (props) => {
|
|
|
1025
1025
|
type === 'textarea' &&
|
|
1026
1026
|
React__default["default"].createElement(Textarea, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, autoFocus: autoFocus, onInput: e => handleOnInput(e.target.value, type, name), onChange: e => handleOnChange(e.target.value, type, name), placeholder: placeholder, rows: textareaOptions === null || textareaOptions === void 0 ? void 0 : textareaOptions.rows, style: (textareaOptions === null || textareaOptions === void 0 ? void 0 : textareaOptions.resize) !== false ? undefined : { resize: 'none' } }),
|
|
1027
1027
|
type === 'select' &&
|
|
1028
|
-
React__default["default"].createElement(Select, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, multiple: selectOptions === null || selectOptions === void 0 ? void 0 : selectOptions.multiple, onChange: e => handleOnChange(e, type, name),
|
|
1028
|
+
React__default["default"].createElement(Select, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, multiple: selectOptions === null || selectOptions === void 0 ? void 0 : selectOptions.multiple, onChange: e => handleOnChange(e, type, name),
|
|
1029
|
+
// onKeyDown={e => onKeyDown(e)}
|
|
1030
|
+
options: options }),
|
|
1029
1031
|
type === 'autocomplete' &&
|
|
1030
|
-
React__default["default"].createElement(AutoComplete, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, openOnFocus: autoCompleteOptions === null || autoCompleteOptions === void 0 ? void 0 : autoCompleteOptions.openOnFocus, onChange: e => handleOnChange(e, type, name),
|
|
1032
|
+
React__default["default"].createElement(AutoComplete, { id: name, name: name, className: className + (!isValid ? ' is-invalid' : ''), value: value, openOnFocus: autoCompleteOptions === null || autoCompleteOptions === void 0 ? void 0 : autoCompleteOptions.openOnFocus, onChange: e => handleOnChange(e, type, name), options: options }),
|
|
1031
1033
|
type === 'checkbox' &&
|
|
1032
|
-
React__default["default"].createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''),
|
|
1033
|
-
// onChange={e => handleOnChange((e?.target as HTMLInputElement).checked, type, name as string)}
|
|
1034
|
-
checked: value === 'true' ? true : false }),
|
|
1034
|
+
React__default["default"].createElement(Checkbox, { id: name, name: name, label: label, className: (!isValid ? ' is-invalid' : ''), onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).checked, type, name), checked: value === 'true' ? true : false }),
|
|
1035
1035
|
type === 'radio' &&
|
|
1036
|
-
React__default["default"].createElement(
|
|
1036
|
+
React__default["default"].createElement(React__default["default"].Fragment, null, options.map((option) => React__default["default"].createElement("div", { className: "form-check", key: option.id },
|
|
1037
1037
|
React__default["default"].createElement("input", { id: option.id ? option.id : option.value, name: name, type: "radio", className: "form-check-input", onChange: e => handleOnChange((e === null || e === void 0 ? void 0 : e.target).value, type, name), value: option.value, checked: value === option.value, onKeyDown: onKeyDown }),
|
|
1038
1038
|
React__default["default"].createElement("label", { className: "form-check-label", htmlFor: option.id }, option.label))))));
|
|
1039
1039
|
};
|
|
@@ -1054,7 +1054,7 @@ const FormError = (props) => {
|
|
|
1054
1054
|
React__default["default"].createElement("div", { className: className }, errors.map(e => React__default["default"].createElement("div", { key: e.validator }, e.message)))));
|
|
1055
1055
|
};
|
|
1056
1056
|
|
|
1057
|
-
const IsEmptyValidator = (value) => value === '' || value === null || value === undefined;
|
|
1057
|
+
const IsEmptyValidator = (value) => value.trim() === '' || value === null || value === undefined;
|
|
1058
1058
|
|
|
1059
1059
|
const EmailValidator = (value) => {
|
|
1060
1060
|
const isInvalidEmailFormat = value.match(/^([\w.%+-]+)@([\w-]+\.)+([\w]{2,})$/i) === null;
|
|
@@ -1084,7 +1084,7 @@ class Form extends React.Component {
|
|
|
1084
1084
|
const values = keys.reduce((obj, f) => {
|
|
1085
1085
|
const control = this.getControl(f);
|
|
1086
1086
|
// TODO - refactor
|
|
1087
|
-
const newValue = ((control.type === 'date' || control.type === 'datetime-local') && control.value && isValidDate(control.value)) ? new Date(control.value).toISOString() : control.value;
|
|
1087
|
+
const newValue = ((control.type === 'date' || control.type === 'datetime-local') && control.value && isValidDate((control.value))) ? new Date((control.value)).toISOString() : control.value;
|
|
1088
1088
|
return (Object.assign(Object.assign({}, obj), { [f]: newValue }));
|
|
1089
1089
|
}, {});
|
|
1090
1090
|
if (this.state.isValid && this.state.isSubmitted) {
|
|
@@ -1238,7 +1238,9 @@ function isValidDate(dateObject) {
|
|
|
1238
1238
|
}
|
|
1239
1239
|
|
|
1240
1240
|
class FormControl {
|
|
1241
|
-
constructor(
|
|
1241
|
+
constructor(
|
|
1242
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1243
|
+
value, validators = [], type, config) {
|
|
1242
1244
|
this.value = value;
|
|
1243
1245
|
this.validators = validators;
|
|
1244
1246
|
this.type = type;
|
|
@@ -1255,7 +1257,7 @@ const DaySelect = (props) => {
|
|
|
1255
1257
|
init();
|
|
1256
1258
|
}, [month, year]);
|
|
1257
1259
|
const init = () => {
|
|
1258
|
-
|
|
1260
|
+
const daysInMonth = new Date(year, month + 1, 0).getDate();
|
|
1259
1261
|
const newDays = [];
|
|
1260
1262
|
for (let i = 1; i <= daysInMonth; i++) {
|
|
1261
1263
|
newDays.push({ value: i.toString(), label: i.toString() });
|
|
@@ -1364,16 +1366,16 @@ const DateSelect = (props) => {
|
|
|
1364
1366
|
// return Math.ceil((((d - yearStart) / 86400000) + 1) / 7)
|
|
1365
1367
|
// };
|
|
1366
1368
|
|
|
1367
|
-
var css_248z$
|
|
1368
|
-
var styles$
|
|
1369
|
-
styleInject(css_248z$
|
|
1369
|
+
var css_248z$t = ".Drawer-module_drawer__kdQCk {\n height: 100%;\n z-index: 1101;\n bottom: 0;\n position: fixed;\n background: white;\n min-width: 280px;\n overflow-y: auto; }\n .Drawer-module_drawer__kdQCk.Drawer-module_permanent__c-y8y {\n position: inherit;\n z-index: 0; }\n .Drawer-module_drawer__kdQCk.Drawer-module_left__loQVO {\n order: 0; }\n .Drawer-module_drawer__kdQCk.Drawer-module_right__sJ3mZ {\n order: 2; }\n .Drawer-module_drawer__kdQCk.Drawer-module_shadow__Myo3n {\n box-shadow: var(--shadow); }\n\n.Drawer-module_drawerOpen__07ptP {\n overflow: hidden; }\n";
|
|
1370
|
+
var styles$t = {"drawer":"Drawer-module_drawer__kdQCk","permanent":"Drawer-module_permanent__c-y8y","left":"Drawer-module_left__loQVO","right":"Drawer-module_right__sJ3mZ","shadow":"Drawer-module_shadow__Myo3n","drawerOpen":"Drawer-module_drawerOpen__07ptP"};
|
|
1371
|
+
styleInject(css_248z$t);
|
|
1370
1372
|
|
|
1371
1373
|
const Drawer = (props) => {
|
|
1372
1374
|
const { children, className, position = 'left', permanent = false, target = document.body, shadow = true, onClickBackdrop } = props, rest = __rest(props, ["children", "className", "position", "permanent", "target", "shadow", "onClickBackdrop"]);
|
|
1373
1375
|
React.useEffect(() => {
|
|
1374
|
-
document.body.classList.add(styles$
|
|
1376
|
+
document.body.classList.add(styles$t.drawerOpen);
|
|
1375
1377
|
return () => {
|
|
1376
|
-
document.body.classList.remove(styles$
|
|
1378
|
+
document.body.classList.remove(styles$t.drawerOpen);
|
|
1377
1379
|
};
|
|
1378
1380
|
}, []);
|
|
1379
1381
|
const handleClickBackdrop = () => {
|
|
@@ -1387,10 +1389,10 @@ const DrawerContent = (props) => {
|
|
|
1387
1389
|
const { children, className, position = 'left', permanent = false, shadow } = props, rest = __rest(props, ["children", "className", "position", "permanent", "shadow"]);
|
|
1388
1390
|
const getCssClasses = () => {
|
|
1389
1391
|
const cssClasses = [];
|
|
1390
|
-
cssClasses.push(styles$
|
|
1391
|
-
shadow && cssClasses.push(styles$
|
|
1392
|
-
!!permanent && cssClasses.push(styles$
|
|
1393
|
-
position === 'left' ? cssClasses.push(styles$
|
|
1392
|
+
cssClasses.push(styles$t.drawer);
|
|
1393
|
+
shadow && cssClasses.push(styles$t.shadow);
|
|
1394
|
+
!!permanent && cssClasses.push(styles$t['permanent']);
|
|
1395
|
+
position === 'left' ? cssClasses.push(styles$t['left']) : cssClasses.push(styles$t['right']);
|
|
1394
1396
|
className && cssClasses.push(className);
|
|
1395
1397
|
return cssClasses.filter(css => css).join(' ');
|
|
1396
1398
|
};
|
|
@@ -1404,22 +1406,23 @@ const DrawerContent = (props) => {
|
|
|
1404
1406
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses(), style: getStyles() }, rest), children));
|
|
1405
1407
|
};
|
|
1406
1408
|
|
|
1407
|
-
var css_248z$
|
|
1408
|
-
var styles$
|
|
1409
|
-
styleInject(css_248z$
|
|
1409
|
+
var css_248z$s = ".MenuBody-module_menuBody__u4FIQ {\n z-index: 1111;\n margin: 0;\n position: absolute;\n top: 100%;\n left: 0;\n min-width: 10rem;\n padding: 8px 0px;\n font-size: 1rem;\n color: #212529;\n text-align: left;\n list-style: none;\n background-color: #fff;\n background-clip: padding-box;\n border-radius: var(--borderRadius); }\n .MenuBody-module_menuBody__u4FIQ.MenuBody-module_shadow__OBp-f {\n box-shadow: var(--shadow); }\n";
|
|
1410
|
+
var styles$s = {"menuBody":"MenuBody-module_menuBody__u4FIQ","shadow":"MenuBody-module_shadow__OBp-f"};
|
|
1411
|
+
styleInject(css_248z$s);
|
|
1410
1412
|
|
|
1411
1413
|
const MenuBody = (props) => {
|
|
1412
1414
|
const { parentRef, children, className, shadow = true, menuPosition = 'left', onClickBackdrop } = props;
|
|
1413
1415
|
const menuBodyRef = React.useRef(null);
|
|
1414
1416
|
React.useEffect(() => {
|
|
1415
|
-
if (menuBodyRef) {
|
|
1417
|
+
if (menuBodyRef && parentRef.current && menuBodyRef.current) {
|
|
1416
1418
|
core.createPopper(parentRef.current, menuBodyRef.current, {
|
|
1417
1419
|
placement: `${menuPosition}-start`,
|
|
1418
1420
|
modifiers: [
|
|
1419
1421
|
{
|
|
1420
1422
|
name: 'offset',
|
|
1421
1423
|
options: {
|
|
1422
|
-
|
|
1424
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
1425
|
+
offset: ({ placement, popper }) => {
|
|
1423
1426
|
if (placement === 'left-start') {
|
|
1424
1427
|
return [0, -popper.width]; // y, x
|
|
1425
1428
|
}
|
|
@@ -1436,8 +1439,8 @@ const MenuBody = (props) => {
|
|
|
1436
1439
|
}, [menuBodyRef]);
|
|
1437
1440
|
const getCssClasses = () => {
|
|
1438
1441
|
const cssClasses = [];
|
|
1439
|
-
cssClasses.push(styles$
|
|
1440
|
-
shadow && cssClasses.push(styles$
|
|
1442
|
+
cssClasses.push(styles$s.menuBody);
|
|
1443
|
+
shadow && cssClasses.push(styles$s.shadow);
|
|
1441
1444
|
className && cssClasses.push(className);
|
|
1442
1445
|
return cssClasses.filter(css => css).join(' ');
|
|
1443
1446
|
};
|
|
@@ -1449,17 +1452,17 @@ const MenuBody = (props) => {
|
|
|
1449
1452
|
React__default["default"].createElement(Backdrop, { isTransparent: true, onClick: handleClickBackdrop })), document.body));
|
|
1450
1453
|
};
|
|
1451
1454
|
|
|
1452
|
-
var css_248z$
|
|
1453
|
-
var styles$
|
|
1454
|
-
styleInject(css_248z$
|
|
1455
|
+
var css_248z$r = ".Menu-module_menu__p8QL- {\n display: flex; }\n";
|
|
1456
|
+
var styles$r = {"menu":"Menu-module_menu__p8QL-"};
|
|
1457
|
+
styleInject(css_248z$r);
|
|
1455
1458
|
|
|
1456
1459
|
const Menu = (props) => {
|
|
1457
|
-
const { toggle, children, className, open, menuPosition, onClickBackdrop
|
|
1460
|
+
const { toggle, children, className, open, menuPosition, onClickBackdrop } = props, rest = __rest(props, ["toggle", "children", "className", "open", "menuPosition", "onClickBackdrop"]);
|
|
1458
1461
|
const menuContainer = React.useRef(null);
|
|
1459
1462
|
const toggleContainerRef = React.useRef(null);
|
|
1460
1463
|
const getCssClasses = () => {
|
|
1461
1464
|
const cssClasses = [];
|
|
1462
|
-
cssClasses.push(styles$
|
|
1465
|
+
cssClasses.push(styles$r.menu);
|
|
1463
1466
|
className && cssClasses.push(className);
|
|
1464
1467
|
return cssClasses.filter(css => css).join(' ');
|
|
1465
1468
|
};
|
|
@@ -1472,17 +1475,17 @@ const Menu = (props) => {
|
|
|
1472
1475
|
React__default["default"].createElement(MenuBody, { parentRef: toggleContainerRef, menuPosition: menuPosition, onClickBackdrop: handleClickBackdrop }, children)));
|
|
1473
1476
|
};
|
|
1474
1477
|
|
|
1475
|
-
var css_248z$
|
|
1476
|
-
var styles$
|
|
1477
|
-
styleInject(css_248z$
|
|
1478
|
+
var css_248z$q = ".MenuItem-module_menuItem__MeBxN {\n display: flex;\n width: 100%;\n padding: 0.25rem 1.5rem;\n clear: both;\n font-weight: 400;\n color: #212529;\n text-align: inherit;\n text-decoration: none;\n white-space: nowrap;\n background-color: transparent;\n border: 0; }\n .MenuItem-module_menuItem__MeBxN.MenuItem-module_menuItemHeader__2l732 {\n margin-bottom: 0;\n font-size: 0.875rem; }\n .MenuItem-module_menuItem__MeBxN:hover {\n cursor: pointer;\n color: #1e2125;\n background-color: rgba(0, 0, 0, 0.04); }\n";
|
|
1479
|
+
var styles$q = {"menuItem":"MenuItem-module_menuItem__MeBxN","menuItemHeader":"MenuItem-module_menuItemHeader__2l732"};
|
|
1480
|
+
styleInject(css_248z$q);
|
|
1478
1481
|
|
|
1479
1482
|
const MenuItem = (props) => {
|
|
1480
1483
|
const { children, onClick, type = 'item' } = props;
|
|
1481
1484
|
const getCssClasses = () => {
|
|
1482
1485
|
const cssClasses = [];
|
|
1483
|
-
cssClasses.push(styles$
|
|
1486
|
+
cssClasses.push(styles$q.menuItem);
|
|
1484
1487
|
if (type === 'header') {
|
|
1485
|
-
cssClasses.push(styles$
|
|
1488
|
+
cssClasses.push(styles$q.menuItemHeader);
|
|
1486
1489
|
}
|
|
1487
1490
|
return cssClasses.filter(css => css).join(' ');
|
|
1488
1491
|
};
|
|
@@ -1490,9 +1493,7 @@ const MenuItem = (props) => {
|
|
|
1490
1493
|
e.stopPropagation();
|
|
1491
1494
|
onClick && onClick(e);
|
|
1492
1495
|
};
|
|
1493
|
-
return (React__default["default"].createElement(ConditionalWrapper, { condition: true, wrapper: children => ((type === 'item' ? (
|
|
1494
|
-
// eslint-disable-next-line jsx-a11y/anchor-is-valid
|
|
1495
|
-
React__default["default"].createElement("a", { className: getCssClasses(), onClick: handleClick }, children)) :
|
|
1496
|
+
return (React__default["default"].createElement(ConditionalWrapper, { condition: true, wrapper: children => ((type === 'item' ? (React__default["default"].createElement("a", { className: getCssClasses(), onClick: handleClick }, children)) :
|
|
1496
1497
|
React__default["default"].createElement("div", { className: getCssClasses(), onClick: handleClick }, children))) }, children));
|
|
1497
1498
|
};
|
|
1498
1499
|
|
|
@@ -1500,23 +1501,23 @@ const MenuToggle = ({ children }) => {
|
|
|
1500
1501
|
return (React__default["default"].createElement(React.Fragment, null, children));
|
|
1501
1502
|
};
|
|
1502
1503
|
|
|
1503
|
-
var css_248z$
|
|
1504
|
-
var styles$
|
|
1505
|
-
styleInject(css_248z$
|
|
1504
|
+
var css_248z$p = ".MenuDivider-module_menuItemDivider__oRP-j {\n height: 0;\n margin: 0.5rem 0;\n overflow: hidden;\n border-top: 1px solid #e9ecef; }\n";
|
|
1505
|
+
var styles$p = {"menuItemDivider":"MenuDivider-module_menuItemDivider__oRP-j"};
|
|
1506
|
+
styleInject(css_248z$p);
|
|
1506
1507
|
|
|
1507
|
-
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$
|
|
1508
|
+
const MenuDivider = () => React__default["default"].createElement("div", { className: styles$p.menuItemDivider });
|
|
1508
1509
|
|
|
1509
|
-
var css_248z$
|
|
1510
|
-
var styles$
|
|
1511
|
-
styleInject(css_248z$
|
|
1510
|
+
var css_248z$o = ".ExpansionPanelContent-module_expansionPanelContent__aXNfH {\n padding: 8px 16px 16px; }\n";
|
|
1511
|
+
var styles$o = {"expansionPanelContent":"ExpansionPanelContent-module_expansionPanelContent__aXNfH"};
|
|
1512
|
+
styleInject(css_248z$o);
|
|
1512
1513
|
|
|
1513
1514
|
const ExpansionPanelContent = ({ children }) => {
|
|
1514
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1515
|
+
return (React__default["default"].createElement("div", { className: styles$o.expansionPanelContent }, children));
|
|
1515
1516
|
};
|
|
1516
1517
|
|
|
1517
|
-
var css_248z$
|
|
1518
|
-
var styles$
|
|
1519
|
-
styleInject(css_248z$
|
|
1518
|
+
var css_248z$n = ".ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq {\n display: flex;\n align-items: center;\n padding: 12px 16px;\n min-height: 48px; }\n .ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq:hover {\n cursor: pointer;\n background-color: var(--highlight); }\n";
|
|
1519
|
+
var styles$n = {"expansionPanelHeader":"ExpansionPanelHeader-module_expansionPanelHeader__Wy6Pq"};
|
|
1520
|
+
styleInject(css_248z$n);
|
|
1520
1521
|
|
|
1521
1522
|
const ExpansionPanelHeader = (props) => {
|
|
1522
1523
|
const { children, isExpanded, onClick } = props;
|
|
@@ -1524,15 +1525,15 @@ const ExpansionPanelHeader = (props) => {
|
|
|
1524
1525
|
e.stopPropagation();
|
|
1525
1526
|
onClick && onClick(e);
|
|
1526
1527
|
};
|
|
1527
|
-
return (React__default["default"].createElement("div", { className: styles$
|
|
1528
|
+
return (React__default["default"].createElement("div", { className: styles$n.expansionPanelHeader, onClick: handleClick },
|
|
1528
1529
|
children,
|
|
1529
1530
|
React__default["default"].createElement("span", { className: "ml-auto text-muted" },
|
|
1530
1531
|
React__default["default"].createElement(Icon, null, isExpanded ? React__default["default"].createElement(ChevronUpSolidIcon, null) : React__default["default"].createElement(ChevronDownSolidIcon, null)))));
|
|
1531
1532
|
};
|
|
1532
1533
|
|
|
1533
|
-
var css_248z$
|
|
1534
|
-
var styles$
|
|
1535
|
-
styleInject(css_248z$
|
|
1534
|
+
var css_248z$m = ".ExpansionPanel-module_expansionPanel__m1yQq {\n background-color: var(--white);\n box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }\n .ExpansionPanel-module_expansionPanel__m1yQq:first-child {\n border-top-left-radius: 4px;\n border-top-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__m1yQq:last-child {\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph {\n margin: 16px 0; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:first-child {\n margin-top: 0; }\n .ExpansionPanel-module_expansionPanel__m1yQq.ExpansionPanel-module_isExpanded__TS1ph:last-child {\n margin-bottom: 0; }\n";
|
|
1535
|
+
var styles$m = {"expansionPanel":"ExpansionPanel-module_expansionPanel__m1yQq","isExpanded":"ExpansionPanel-module_isExpanded__TS1ph"};
|
|
1536
|
+
styleInject(css_248z$m);
|
|
1536
1537
|
|
|
1537
1538
|
const ExpansionPanel = (props) => {
|
|
1538
1539
|
const { header, children, isExpanded = false, onChange } = props;
|
|
@@ -1542,9 +1543,9 @@ const ExpansionPanel = (props) => {
|
|
|
1542
1543
|
}, [isExpanded]);
|
|
1543
1544
|
const getCssClasses = () => {
|
|
1544
1545
|
const cssClasses = [];
|
|
1545
|
-
cssClasses.push(styles$
|
|
1546
|
+
cssClasses.push(styles$m.expansionPanel);
|
|
1546
1547
|
if (_isExpanded) {
|
|
1547
|
-
cssClasses.push(styles$
|
|
1548
|
+
cssClasses.push(styles$m.isExpanded);
|
|
1548
1549
|
}
|
|
1549
1550
|
return cssClasses.filter(css => css).join(' ');
|
|
1550
1551
|
};
|
|
@@ -1558,16 +1559,16 @@ const ExpansionPanel = (props) => {
|
|
|
1558
1559
|
React__default["default"].createElement(ExpansionPanelContent, null, children)));
|
|
1559
1560
|
};
|
|
1560
1561
|
|
|
1561
|
-
var css_248z$
|
|
1562
|
-
var styles$
|
|
1563
|
-
styleInject(css_248z$
|
|
1562
|
+
var css_248z$l = ".FloatingActionButton-module_fab__Rw3kd {\n box-shadow: var(--shadow); }\n .FloatingActionButton-module_fab__Rw3kd.FloatingActionButton-module_fixed__XQOkG {\n position: fixed;\n bottom: 16px;\n right: 16px;\n z-index: 1000; }\n";
|
|
1563
|
+
var styles$l = {"fab":"FloatingActionButton-module_fab__Rw3kd","fixed":"FloatingActionButton-module_fixed__XQOkG"};
|
|
1564
|
+
styleInject(css_248z$l);
|
|
1564
1565
|
|
|
1565
1566
|
const FloatingActionButton = (props) => {
|
|
1566
1567
|
const { className, icon, color = exports.COLOR.primary, fixed, size = exports.SIZE.lg, isActive, disabled, onClick } = props;
|
|
1567
1568
|
const getCssClasses = () => {
|
|
1568
1569
|
const cssClasses = [];
|
|
1569
|
-
cssClasses.push(styles$
|
|
1570
|
-
fixed && cssClasses.push(styles$
|
|
1570
|
+
cssClasses.push(styles$l.fab);
|
|
1571
|
+
fixed && cssClasses.push(styles$l['fixed']);
|
|
1571
1572
|
className && cssClasses.push(className);
|
|
1572
1573
|
return cssClasses.filter(css => css).join(' ');
|
|
1573
1574
|
};
|
|
@@ -1610,11 +1611,16 @@ const Row = (props) => {
|
|
|
1610
1611
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest), children));
|
|
1611
1612
|
};
|
|
1612
1613
|
|
|
1614
|
+
var css_248z$k = ".Link-module_link__YlJQl {\n color: var(--primary);\n text-decoration: underline; }\n .Link-module_link__YlJQl:hover {\n color: var(--primary-dark); }\n";
|
|
1615
|
+
var styles$k = {"link":"Link-module_link__YlJQl"};
|
|
1616
|
+
styleInject(css_248z$k);
|
|
1617
|
+
|
|
1613
1618
|
const Link = (props) => {
|
|
1614
1619
|
const { href = '#', className, target, children } = props, rest = __rest(props, ["href", "className", "target", "children"]);
|
|
1615
1620
|
const [status, setStatus] = React.useState(STATUS.NORMAL);
|
|
1616
1621
|
const getCssClasses = () => {
|
|
1617
1622
|
const cssClasses = [];
|
|
1623
|
+
cssClasses.push(styles$k.link);
|
|
1618
1624
|
className && cssClasses.push(className);
|
|
1619
1625
|
status !== STATUS.NORMAL && cssClasses.push(status);
|
|
1620
1626
|
return cssClasses.filter(css => css).join(' ');
|
|
@@ -1628,15 +1634,15 @@ const Link = (props) => {
|
|
|
1628
1634
|
return (React__default["default"].createElement("a", Object.assign({ className: getCssClasses(), href: href, target: target, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave }, rest), children));
|
|
1629
1635
|
};
|
|
1630
1636
|
|
|
1631
|
-
var css_248z$
|
|
1632
|
-
var styles$
|
|
1633
|
-
styleInject(css_248z$
|
|
1637
|
+
var css_248z$j = ".LoadingIndicator-module_loadingIndicatorContainer__GS9OG {\n position: fixed;\n top: 0;\n left: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%; }\n\n.LoadingIndicator-module_loadingIndicator__EC9sx {\n animation-name: LoadingIndicator-module_spinAnimation__LeY4Z;\n animation-duration: 5000ms;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n width: 24px;\n height: 24px; }\n\n@keyframes LoadingIndicator-module_spinAnimation__LeY4Z {\n from {\n transform: rotate(0deg); }\n to {\n transform: rotate(360deg); } }\n";
|
|
1638
|
+
var styles$j = {"loadingIndicatorContainer":"LoadingIndicator-module_loadingIndicatorContainer__GS9OG","loadingIndicator":"LoadingIndicator-module_loadingIndicator__EC9sx","spinAnimation":"LoadingIndicator-module_spinAnimation__LeY4Z"};
|
|
1639
|
+
styleInject(css_248z$j);
|
|
1634
1640
|
|
|
1635
1641
|
const LoadingIndicator = (_a) => {
|
|
1636
1642
|
var rest = __rest(_a, []);
|
|
1637
1643
|
const getCssClasses = () => {
|
|
1638
1644
|
const cssClasses = [];
|
|
1639
|
-
cssClasses.push(styles$
|
|
1645
|
+
cssClasses.push(styles$j.loadingIndicator);
|
|
1640
1646
|
return cssClasses.filter(css => css).join(' ');
|
|
1641
1647
|
};
|
|
1642
1648
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
@@ -1646,7 +1652,7 @@ const LoadingIndicator = (_a) => {
|
|
|
1646
1652
|
const LoadingIndicatorContainer = ({ children }) => {
|
|
1647
1653
|
const getCssClasses = () => {
|
|
1648
1654
|
const cssClasses = [];
|
|
1649
|
-
cssClasses.push(styles$
|
|
1655
|
+
cssClasses.push(styles$j.loadingIndicatorContainer);
|
|
1650
1656
|
return cssClasses.filter(css => css).join(' ');
|
|
1651
1657
|
};
|
|
1652
1658
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
@@ -1654,38 +1660,36 @@ const LoadingIndicatorContainer = ({ children }) => {
|
|
|
1654
1660
|
|
|
1655
1661
|
class LoadingIndicatorService {
|
|
1656
1662
|
show() {
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
React__default["default"].createElement(LoadingIndicator, null)), this.container);
|
|
1666
|
-
});
|
|
1663
|
+
if (this.container) {
|
|
1664
|
+
this.hide();
|
|
1665
|
+
}
|
|
1666
|
+
this.container = document.createElement('div');
|
|
1667
|
+
this.container.classList.add('snackbar-container');
|
|
1668
|
+
document.body.appendChild(this.container);
|
|
1669
|
+
reactDom.render(React__default["default"].createElement(LoadingIndicatorContainer, null,
|
|
1670
|
+
React__default["default"].createElement(LoadingIndicator, null)), this.container);
|
|
1667
1671
|
}
|
|
1668
1672
|
hide() {
|
|
1669
1673
|
if (this.container) {
|
|
1670
1674
|
reactDom.unmountComponentAtNode(this.container);
|
|
1671
1675
|
document.body.removeChild(this.container);
|
|
1672
|
-
this.container =
|
|
1673
|
-
clearTimeout(this.handler);
|
|
1676
|
+
this.container = undefined;
|
|
1677
|
+
this.handler && clearTimeout(this.handler);
|
|
1674
1678
|
}
|
|
1675
1679
|
}
|
|
1676
1680
|
}
|
|
1677
1681
|
const loadingIndicatorService = new LoadingIndicatorService();
|
|
1678
1682
|
|
|
1679
|
-
var css_248z$
|
|
1680
|
-
var styles$
|
|
1681
|
-
styleInject(css_248z$
|
|
1683
|
+
var css_248z$i = ".ModalHeader-module_modalHeader__tw-u- {\n border-bottom: none;\n align-items: center; }\n";
|
|
1684
|
+
var styles$i = {"modalHeader":"ModalHeader-module_modalHeader__tw-u-"};
|
|
1685
|
+
styleInject(css_248z$i);
|
|
1682
1686
|
|
|
1683
1687
|
const ModalHeader = (props) => {
|
|
1684
|
-
const { children, isDismissable = false, onClose } = props;
|
|
1688
|
+
const { children, isDismissable = false, onClose } = props, rest = __rest(props, ["children", "isDismissable", "onClose"]);
|
|
1685
1689
|
const handleClick = () => {
|
|
1686
1690
|
onClose && onClose();
|
|
1687
1691
|
};
|
|
1688
|
-
return (React__default["default"].createElement("div", { className: "modal-header " + styles$
|
|
1692
|
+
return (React__default["default"].createElement("div", Object.assign({ className: "modal-header " + styles$i.modalHeader }, rest),
|
|
1689
1693
|
React__default["default"].createElement("h5", { className: "modal-title" }, children),
|
|
1690
1694
|
isDismissable &&
|
|
1691
1695
|
React__default["default"].createElement(IconButton, { icon: React__default["default"].createElement(TimesSolidIcon, null), variant: exports.VARIANT.text, onClick: handleClick })));
|
|
@@ -1693,24 +1697,24 @@ const ModalHeader = (props) => {
|
|
|
1693
1697
|
|
|
1694
1698
|
const ModalBody = ({ children }) => (React__default["default"].createElement("div", { className: "modal-body" }, children));
|
|
1695
1699
|
|
|
1696
|
-
var css_248z$
|
|
1697
|
-
var styles$
|
|
1698
|
-
styleInject(css_248z$
|
|
1700
|
+
var css_248z$h = ".Modal-module_modal__HMxWV {\n z-index: 1111 !important;\n border-radius: var(--borderRadius); }\n .Modal-module_modal__HMxWV.Modal-module_fullscreen__iepGa {\n width: 100% !important;\n height: 100% !important;\n max-height: 100% !important;\n margin: 0;\n padding: 0; }\n .Modal-module_modal__HMxWV.Modal-module_fullscreen__iepGa .Modal-module_modalContent__9wAwB {\n height: auto;\n min-height: 100%;\n max-height: 100%;\n border-radius: 0;\n overflow: auto; }\n @media (min-width: 320px) {\n .Modal-module_modal__HMxWV.Modal-module_fullscreen__iepGa {\n max-width: 100% !important; } }\n .Modal-module_modal__HMxWV .Modal-module_sm__CsR6U {\n max-width: 300px; }\n .Modal-module_modal__HMxWV .Modal-module_md__lNggx {\n max-width: 500px; }\n .Modal-module_modal__HMxWV .Modal-module_lg__6dtT2 {\n max-width: 1140px; }\n @media (min-width: 576px) {\n .Modal-module_modal__HMxWV .Modal-module_modal-dialog__U2wGf {\n max-width: 600px; } }\n";
|
|
1701
|
+
var styles$h = {"modal":"Modal-module_modal__HMxWV","fullscreen":"Modal-module_fullscreen__iepGa","modalContent":"Modal-module_modalContent__9wAwB","sm":"Modal-module_sm__CsR6U","md":"Modal-module_md__lNggx","lg":"Modal-module_lg__6dtT2","modal-dialog":"Modal-module_modal-dialog__U2wGf"};
|
|
1702
|
+
styleInject(css_248z$h);
|
|
1699
1703
|
|
|
1700
|
-
var css_248z$
|
|
1701
|
-
var styles$
|
|
1702
|
-
styleInject(css_248z$
|
|
1704
|
+
var css_248z$g = ".ModalFooter-module_modalFooter__SNm-f {\n border-top: none; }\n";
|
|
1705
|
+
var styles$g = {"modalFooter":"ModalFooter-module_modalFooter__SNm-f"};
|
|
1706
|
+
styleInject(css_248z$g);
|
|
1703
1707
|
|
|
1704
|
-
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: "modal-footer " + styles$
|
|
1708
|
+
const ModalFooter = ({ children }) => (React__default["default"].createElement("div", { className: "modal-footer " + styles$g.modalFooter }, children));
|
|
1705
1709
|
|
|
1706
1710
|
const Modal = (props) => {
|
|
1707
1711
|
const { className, size, fullScreen, children, header, footer, onHeaderCloseClick, onBackdropClick, isDismissable = false } = props;
|
|
1708
1712
|
const getCssClass = () => {
|
|
1709
1713
|
const cssClasses = [];
|
|
1710
1714
|
cssClasses.push('modal-dialog modal-dialog-centered');
|
|
1711
|
-
cssClasses.push(styles$
|
|
1712
|
-
!!fullScreen && cssClasses.push(styles$
|
|
1713
|
-
size && cssClasses.push(styles$
|
|
1715
|
+
cssClasses.push(styles$h.modal);
|
|
1716
|
+
!!fullScreen && cssClasses.push(styles$h['fullscreen']);
|
|
1717
|
+
size && cssClasses.push(styles$h[size]);
|
|
1714
1718
|
className && cssClasses.push(className);
|
|
1715
1719
|
return cssClasses.filter(r => r).join(' ');
|
|
1716
1720
|
};
|
|
@@ -1724,9 +1728,9 @@ const Modal = (props) => {
|
|
|
1724
1728
|
onBackdropClick && onBackdropClick();
|
|
1725
1729
|
};
|
|
1726
1730
|
return (React__default["default"].createElement(React.Fragment, null,
|
|
1727
|
-
React__default["default"].createElement("div", { className: "modal show " + styles$
|
|
1731
|
+
React__default["default"].createElement("div", { className: "modal show " + styles$h.modal, style: { display: 'block' } },
|
|
1728
1732
|
React__default["default"].createElement("div", { className: getCssClass() },
|
|
1729
|
-
React__default["default"].createElement("div", { className: 'modal-content ' + (
|
|
1733
|
+
React__default["default"].createElement("div", { className: 'modal-content ' + (fullScreen ? styles$h['modalContent'] : undefined) },
|
|
1730
1734
|
header &&
|
|
1731
1735
|
React__default["default"].createElement(ModalHeader, { isDismissable: isDismissable, onClose: () => onHeaderCloseClick && onHeaderCloseClick() }, header),
|
|
1732
1736
|
React__default["default"].createElement(ModalBody, null, children),
|
|
@@ -1929,25 +1933,25 @@ const Sidebar = (props) => {
|
|
|
1929
1933
|
!item.isCollapsed && item.items && item.items.length > 0 && (React__default["default"].createElement(List, { className: "list-level-1", key: `${item.id}-sub` }, item.items.map(subItem => (React__default["default"].createElement(ListItem, { className: "list-item-level-1", active: isMenuItemActive(subItem.path), key: subItem.id, onClick: (e) => handleClickSubItem(item.path, subItem.path, e) }, subItem.label)))))))))));
|
|
1930
1934
|
};
|
|
1931
1935
|
|
|
1932
|
-
var css_248z$
|
|
1933
|
-
var styles$
|
|
1934
|
-
styleInject(css_248z$
|
|
1936
|
+
var css_248z$f = ".Snackbar-module_snackbar__O5T2b {\n display: flex;\n align-items: center;\n min-width: 288px;\n padding: 6px 16px;\n transform-origin: center;\n min-height: 52px;\n animation: Snackbar-module_bounceIn__E47iD 0.4s ease;\n z-index: 1001;\n position: fixed;\n left: 50%;\n transform: translateX(-50%);\n bottom: 2%;\n border-radius: var(--borderRadius); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_primary__ZBOTN {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_accent__0MnFy {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_secondary__s8-ez {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_light__Vrd7o {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Snackbar-module_snackbar__O5T2b.Snackbar-module_dark__U-5io {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n\n.Snackbar-module_text__G5r5D {\n width: 100%;\n padding: 8px 0; }\n\n.Snackbar-module_action__vus2Y {\n margin-left: auto; }\n .Snackbar-module_action__vus2Y:hover {\n cursor: pointer; }\n\n@keyframes Snackbar-module_bounceIn__E47iD {\n 0% {\n opacity: 0; }\n 50% {\n opacity: 0.9; }\n 80% {\n opacity: 1; }\n 100% {\n opacity: 1; } }\n";
|
|
1937
|
+
var styles$f = {"snackbar":"Snackbar-module_snackbar__O5T2b","bounceIn":"Snackbar-module_bounceIn__E47iD","primary":"Snackbar-module_primary__ZBOTN","accent":"Snackbar-module_accent__0MnFy","secondary":"Snackbar-module_secondary__s8-ez","light":"Snackbar-module_light__Vrd7o","dark":"Snackbar-module_dark__U-5io","text":"Snackbar-module_text__G5r5D","action":"Snackbar-module_action__vus2Y"};
|
|
1938
|
+
styleInject(css_248z$f);
|
|
1935
1939
|
|
|
1936
1940
|
const Snackbar = (props) => {
|
|
1937
1941
|
const { children, color = exports.COLOR.dark, actionText = 'ok', onOk } = props, rest = __rest(props, ["children", "color", "actionText", "onOk"]);
|
|
1938
1942
|
const getCssClasses = () => {
|
|
1939
1943
|
const cssClasses = [];
|
|
1940
|
-
cssClasses.push(styles$
|
|
1944
|
+
cssClasses.push(styles$f.snackbar);
|
|
1941
1945
|
cssClasses.push(`shadow-lg`);
|
|
1942
|
-
cssClasses.push(styles$
|
|
1946
|
+
cssClasses.push(styles$f[color]);
|
|
1943
1947
|
return cssClasses.filter(css => css).join(' ');
|
|
1944
1948
|
};
|
|
1945
1949
|
const handleClickAction = (e) => {
|
|
1946
1950
|
onOk && onOk(e);
|
|
1947
1951
|
};
|
|
1948
1952
|
return (React__default["default"].createElement("div", Object.assign({ className: getCssClasses() }, rest),
|
|
1949
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1950
|
-
React__default["default"].createElement("div", { className: styles$
|
|
1953
|
+
React__default["default"].createElement("div", { className: styles$f.text }, children),
|
|
1954
|
+
React__default["default"].createElement("div", { className: styles$f.action + " text-accent", onClick: handleClickAction },
|
|
1951
1955
|
React__default["default"].createElement("span", null, actionText))));
|
|
1952
1956
|
};
|
|
1953
1957
|
|
|
@@ -1955,7 +1959,7 @@ class SnackbarService {
|
|
|
1955
1959
|
show(message, options) {
|
|
1956
1960
|
const defaultOptions = { timeout: 3000, actionText: 'ok', color: exports.COLOR.dark, target: document.body };
|
|
1957
1961
|
const mergedOptions = Object.assign(defaultOptions, options);
|
|
1958
|
-
return new Promise((resolve
|
|
1962
|
+
return new Promise((resolve) => {
|
|
1959
1963
|
if (this.container) {
|
|
1960
1964
|
this.hide();
|
|
1961
1965
|
}
|
|
@@ -1978,36 +1982,36 @@ class SnackbarService {
|
|
|
1978
1982
|
if (this.container) {
|
|
1979
1983
|
reactDom.unmountComponentAtNode(this.container);
|
|
1980
1984
|
document.body.removeChild(this.container);
|
|
1981
|
-
this.container =
|
|
1982
|
-
clearTimeout(this.handler);
|
|
1985
|
+
this.container = undefined;
|
|
1986
|
+
this.handler && clearTimeout(this.handler);
|
|
1983
1987
|
}
|
|
1984
1988
|
}
|
|
1985
1989
|
}
|
|
1986
1990
|
const snackbarService = new SnackbarService();
|
|
1987
1991
|
|
|
1988
|
-
var css_248z$
|
|
1989
|
-
var styles$
|
|
1990
|
-
styleInject(css_248z$
|
|
1992
|
+
var css_248z$e = ".SpeedDialActions-module_speedDialActions__cY2i3 {\n margin-bottom: -32px;\n flex-direction: column-reverse;\n padding-bottom: 48px;\n display: flex;\n pointer-events: auto; }\n";
|
|
1993
|
+
var styles$e = {"speedDialActions":"SpeedDialActions-module_speedDialActions__cY2i3"};
|
|
1994
|
+
styleInject(css_248z$e);
|
|
1991
1995
|
|
|
1992
1996
|
const SpeedDialActions = (props) => {
|
|
1993
1997
|
const { children } = props;
|
|
1994
1998
|
const getCssClasses = () => {
|
|
1995
1999
|
const cssClasses = [];
|
|
1996
|
-
cssClasses.push(styles$
|
|
2000
|
+
cssClasses.push(styles$e.speedDialActions);
|
|
1997
2001
|
return cssClasses.filter(css => css).join(' ');
|
|
1998
2002
|
};
|
|
1999
2003
|
return (React__default["default"].createElement("div", { className: getCssClasses() }, children));
|
|
2000
2004
|
};
|
|
2001
2005
|
|
|
2002
|
-
var css_248z$
|
|
2003
|
-
var styles$
|
|
2004
|
-
styleInject(css_248z$
|
|
2006
|
+
var css_248z$d = ".SpeedDial-module_speedDial__W3VN2 {\n position: absolute;\n flex-direction: column-reverse;\n display: flex;\n z-index: 1050;\n align-items: center;\n right: 16px;\n bottom: 16px;\n transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n";
|
|
2007
|
+
var styles$d = {"speedDial":"SpeedDial-module_speedDial__W3VN2"};
|
|
2008
|
+
styleInject(css_248z$d);
|
|
2005
2009
|
|
|
2006
2010
|
const SpeedDial = (props) => {
|
|
2007
2011
|
const { children, className, open, onOpen, onClose } = props, rest = __rest(props, ["children", "className", "open", "onOpen", "onClose"]);
|
|
2008
2012
|
const getCssClasses = () => {
|
|
2009
2013
|
const cssClasses = [];
|
|
2010
|
-
cssClasses.push(styles$
|
|
2014
|
+
cssClasses.push(styles$d.speedDial);
|
|
2011
2015
|
className && cssClasses.push(className);
|
|
2012
2016
|
return cssClasses.filter(css => css).join(' ');
|
|
2013
2017
|
};
|
|
@@ -2024,15 +2028,15 @@ const SpeedDial = (props) => {
|
|
|
2024
2028
|
React__default["default"].createElement(SpeedDialActions, null, children)));
|
|
2025
2029
|
};
|
|
2026
2030
|
|
|
2027
|
-
var css_248z$
|
|
2028
|
-
var styles$
|
|
2029
|
-
styleInject(css_248z$
|
|
2031
|
+
var css_248z$c = ".SpeedDialAction-module_speedDialAction__kJLpz + .SpeedDialAction-module_speedDialAction__kJLpz {\n margin-bottom: 10px; }\n";
|
|
2032
|
+
var styles$c = {"speedDialAction":"SpeedDialAction-module_speedDialAction__kJLpz"};
|
|
2033
|
+
styleInject(css_248z$c);
|
|
2030
2034
|
|
|
2031
2035
|
const SpeedDialAction = (props) => {
|
|
2032
2036
|
const { icon, color = exports.COLOR.light, onClick, className } = props;
|
|
2033
2037
|
const getCssClasses = () => {
|
|
2034
2038
|
const cssClasses = [];
|
|
2035
|
-
cssClasses.push(styles$
|
|
2039
|
+
cssClasses.push(styles$c.speedDialAction);
|
|
2036
2040
|
className && cssClasses.push(className);
|
|
2037
2041
|
return cssClasses.filter(css => css).join(' ');
|
|
2038
2042
|
};
|
|
@@ -2049,15 +2053,15 @@ const SpeedDialIcon = (props) => {
|
|
|
2049
2053
|
return (React__default["default"].createElement(Icon, Object.assign({ className: getCssClasses() }, rest), children));
|
|
2050
2054
|
};
|
|
2051
2055
|
|
|
2052
|
-
var css_248z$
|
|
2053
|
-
var styles$
|
|
2054
|
-
styleInject(css_248z$
|
|
2056
|
+
var css_248z$b = ".StepperActions-module_stepperActions__hBUkh {\n display: flex; }\n";
|
|
2057
|
+
var styles$b = {"stepperActions":"StepperActions-module_stepperActions__hBUkh"};
|
|
2058
|
+
styleInject(css_248z$b);
|
|
2055
2059
|
|
|
2056
2060
|
const StepperActions = (props) => {
|
|
2057
2061
|
const { className, isCompleted, isFirstStep, isStepOptional, onBack, onSkip, onNext, onReset } = props;
|
|
2058
2062
|
const getCssClasses = () => {
|
|
2059
2063
|
const cssClasses = [];
|
|
2060
|
-
cssClasses.push(styles$
|
|
2064
|
+
cssClasses.push(styles$b.stepperActions);
|
|
2061
2065
|
className && cssClasses.push(className);
|
|
2062
2066
|
return cssClasses.filter(css => css).join(' ');
|
|
2063
2067
|
};
|
|
@@ -2074,31 +2078,31 @@ const StepPanel = (props) => {
|
|
|
2074
2078
|
return (React__default["default"].createElement("div", { className: "steppanel" }, children));
|
|
2075
2079
|
};
|
|
2076
2080
|
|
|
2077
|
-
var css_248z$
|
|
2078
|
-
var styles$
|
|
2079
|
-
styleInject(css_248z$
|
|
2081
|
+
var css_248z$a = ".StepConnector-module_stepConnector__A7A-7 {\n flex: 1 1 auto;\n flex-shrink: 0;\n min-width: 20px; }\n\n.StepConnector-module_stepConnectorLine__8rQxv {\n display: block;\n border-color: var(--secondary);\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .StepConnector-module_stepConnectorLine__8rQxv.StepConnector-module_isActive__TUIKV {\n border-color: var(--primary); }\n\n.StepConnector-module_stepConnectorLineHorizontal__i09K0 {\n border-top-style: solid;\n border-top-width: 1px; }\n";
|
|
2082
|
+
var styles$a = {"stepConnector":"StepConnector-module_stepConnector__A7A-7","stepConnectorLine":"StepConnector-module_stepConnectorLine__8rQxv","isActive":"StepConnector-module_isActive__TUIKV","stepConnectorLineHorizontal":"StepConnector-module_stepConnectorLineHorizontal__i09K0"};
|
|
2083
|
+
styleInject(css_248z$a);
|
|
2080
2084
|
|
|
2081
2085
|
const StepConnector = (props) => {
|
|
2082
2086
|
const { isActive, isHorizontal = true } = props;
|
|
2083
2087
|
const getCssClassesConnector = () => {
|
|
2084
2088
|
const cssClasses = [];
|
|
2085
|
-
cssClasses.push(styles$
|
|
2089
|
+
cssClasses.push(styles$a.stepConnector);
|
|
2086
2090
|
return cssClasses.filter(css => css).join(' ');
|
|
2087
2091
|
};
|
|
2088
2092
|
const getCssClassesLine = () => {
|
|
2089
2093
|
const cssClasses = [];
|
|
2090
|
-
cssClasses.push(styles$
|
|
2091
|
-
isActive && cssClasses.push(styles$
|
|
2092
|
-
isHorizontal && cssClasses.push(styles$
|
|
2094
|
+
cssClasses.push(styles$a.stepConnectorLine);
|
|
2095
|
+
isActive && cssClasses.push(styles$a['isActive']);
|
|
2096
|
+
isHorizontal && cssClasses.push(styles$a.stepConnectorLineHorizontal);
|
|
2093
2097
|
return cssClasses.filter(css => css).join(' ');
|
|
2094
2098
|
};
|
|
2095
2099
|
return (React__default["default"].createElement("div", { className: getCssClassesConnector() },
|
|
2096
2100
|
React__default["default"].createElement("div", { className: getCssClassesLine() })));
|
|
2097
2101
|
};
|
|
2098
2102
|
|
|
2099
|
-
var css_248z$
|
|
2100
|
-
var styles$
|
|
2101
|
-
styleInject(css_248z$
|
|
2103
|
+
var css_248z$9 = ".Stepper-module_stepper__V6odG {\n display: flex;\n align-items: center;\n flex-direction: row;\n margin-bottom: 10px; }\n .Stepper-module_stepper__V6odG.Stepper-module_isHorizontal__Q-3Wu {\n overflow-x: auto; }\n";
|
|
2104
|
+
var styles$9 = {"stepper":"Stepper-module_stepper__V6odG","isHorizontal":"Stepper-module_isHorizontal__Q-3Wu"};
|
|
2105
|
+
styleInject(css_248z$9);
|
|
2102
2106
|
|
|
2103
2107
|
const Stepper = (props) => {
|
|
2104
2108
|
const { children, isLinear = true, showLabel = true, showProgressCheckIcon = false, value, isHorizontal = true, onChange, onFinish } = props;
|
|
@@ -2133,7 +2137,7 @@ const Stepper = (props) => {
|
|
|
2133
2137
|
isDisabled: isLinear && (activeIndex + 1 < index),
|
|
2134
2138
|
showLabel: showLabel,
|
|
2135
2139
|
showProgressCheckIcon: showProgressCheckIcon,
|
|
2136
|
-
onClick: (
|
|
2140
|
+
onClick: (e) => handleClickStep(e.event, e.value, index)
|
|
2137
2141
|
});
|
|
2138
2142
|
};
|
|
2139
2143
|
const isStepOptional = (index) => {
|
|
@@ -2186,8 +2190,8 @@ const Stepper = (props) => {
|
|
|
2186
2190
|
};
|
|
2187
2191
|
const getCssClasses = () => {
|
|
2188
2192
|
const cssClasses = [];
|
|
2189
|
-
cssClasses.push(styles$
|
|
2190
|
-
isHorizontal && cssClasses.push(styles$
|
|
2193
|
+
cssClasses.push(styles$9.stepper);
|
|
2194
|
+
isHorizontal && cssClasses.push(styles$9['isHorizontal']);
|
|
2191
2195
|
return cssClasses.filter(css => css).join(' ');
|
|
2192
2196
|
};
|
|
2193
2197
|
return (React__default["default"].createElement(React__default["default"].Fragment, null, steps &&
|
|
@@ -2200,15 +2204,15 @@ const Stepper = (props) => {
|
|
|
2200
2204
|
React__default["default"].createElement(StepperActions, { className: "mt-3", isFirstStep: activeIndex === 0, isStepOptional: isStepOptional(activeIndex), isCompleted: isLastStep(), onBack: handleBack, onSkip: handleSkip, onNext: handleNext, onReset: handleReset }))));
|
|
2201
2205
|
};
|
|
2202
2206
|
|
|
2203
|
-
var css_248z$
|
|
2204
|
-
var styles$
|
|
2205
|
-
styleInject(css_248z$
|
|
2207
|
+
var css_248z$8 = ".Typography-module_typography__sw-td {\n text-overflow: ellipsis;\n overflow: hidden !important; }\n";
|
|
2208
|
+
var styles$8 = {"typography":"Typography-module_typography__sw-td"};
|
|
2209
|
+
styleInject(css_248z$8);
|
|
2206
2210
|
|
|
2207
2211
|
const Wrapper = (props) => {
|
|
2208
2212
|
const { as = 'span', children, className } = props, rest = __rest(props, ["as", "children", "className"]);
|
|
2209
2213
|
const getCssClasses = () => {
|
|
2210
2214
|
const cssClasses = [];
|
|
2211
|
-
cssClasses.push(styles$
|
|
2215
|
+
cssClasses.push(styles$8.typography);
|
|
2212
2216
|
className && cssClasses.push(className);
|
|
2213
2217
|
return cssClasses.filter(css => css).join(' ');
|
|
2214
2218
|
};
|
|
@@ -2219,38 +2223,45 @@ const Typography = (_a) => {
|
|
|
2219
2223
|
return (React__default["default"].createElement(Wrapper, Object.assign({ as: as }, rest), children));
|
|
2220
2224
|
};
|
|
2221
2225
|
|
|
2222
|
-
var css_248z$
|
|
2223
|
-
var styles$
|
|
2224
|
-
styleInject(css_248z$
|
|
2226
|
+
var css_248z$7 = ".Step-module_stepWrapper__IQwq1 {\n display: flex;\n align-items: center;\n padding-left: 8px;\n padding-right: 8px;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Step-module_stepWrapper__IQwq1.Step-module_hasLabel__LZNvd:not(.Step-module_disabled__JnxUP):hover {\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04);\n border-radius: var(--borderRadius); }\n\n.Step-module_step__k42go {\n width: 40px;\n height: 40px;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n .Step-module_step__k42go:not(.Step-module_hasLabel__LZNvd):not(.Step-module_disabled__JnxUP):hover {\n border-radius: 100%;\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.04); }\n .Step-module_step__k42go.Step-module_hasLabel__LZNvd svg {\n width: 18px !important;\n height: 18px !important; }\n\n.Step-module_stepIconCircle__hnxIV svg {\n width: 24px;\n height: 24px; }\n\n.Step-module_stepValue__B0-xv {\n position: absolute;\n color: var(--secondary-contrast-text); }\n .Step-module_stepValue__B0-xv .Step-module_isActive__3GGcl {\n color: var(--primary-contrast-text); }\n";
|
|
2227
|
+
var styles$7 = {"stepWrapper":"Step-module_stepWrapper__IQwq1","hasLabel":"Step-module_hasLabel__LZNvd","disabled":"Step-module_disabled__JnxUP","step":"Step-module_step__k42go","stepIconCircle":"Step-module_stepIconCircle__hnxIV","stepValue":"Step-module_stepValue__B0-xv","isActive":"Step-module_isActive__3GGcl"};
|
|
2228
|
+
styleInject(css_248z$7);
|
|
2225
2229
|
|
|
2226
2230
|
const Step = (props) => {
|
|
2227
2231
|
const { className, label, showLabel, index, value, isActive, isDone, isDisabled, showProgressCheckIcon, onClick } = props;
|
|
2228
2232
|
const [hoverRef, isHovered] = useHover();
|
|
2229
|
-
const handleClick = (
|
|
2233
|
+
const handleClick = (event) => {
|
|
2230
2234
|
if (!isDisabled) {
|
|
2231
|
-
onClick && onClick(
|
|
2235
|
+
onClick && onClick({ event, value });
|
|
2232
2236
|
}
|
|
2233
2237
|
};
|
|
2234
2238
|
const getCssClasses = () => {
|
|
2235
2239
|
const cssClasses = [];
|
|
2236
|
-
cssClasses.push(styles$
|
|
2237
|
-
label && showLabel && cssClasses.push(styles$
|
|
2238
|
-
isDisabled && cssClasses.push(styles$
|
|
2240
|
+
cssClasses.push(styles$7.stepWrapper);
|
|
2241
|
+
label && showLabel && cssClasses.push(styles$7['hasLabel']);
|
|
2242
|
+
isDisabled && cssClasses.push(styles$7['disabled']);
|
|
2239
2243
|
className && cssClasses.push(className);
|
|
2240
2244
|
return cssClasses.filter(css => css).join(' ');
|
|
2241
2245
|
};
|
|
2242
2246
|
const getCssClassesStep = () => {
|
|
2243
2247
|
const cssClasses = [];
|
|
2244
|
-
cssClasses.push(styles$
|
|
2245
|
-
label && showLabel && cssClasses.push(styles$
|
|
2246
|
-
isDisabled && cssClasses.push(styles$
|
|
2248
|
+
cssClasses.push(styles$7.step);
|
|
2249
|
+
label && showLabel && cssClasses.push(styles$7['hasLabel']);
|
|
2250
|
+
isDisabled && cssClasses.push(styles$7['disabled']);
|
|
2251
|
+
return cssClasses.filter(css => css).join(' ');
|
|
2252
|
+
};
|
|
2253
|
+
const getCssClassesStepValue = () => {
|
|
2254
|
+
const cssClasses = [];
|
|
2255
|
+
cssClasses.push(styles$7.stepValue);
|
|
2256
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
2257
|
+
isActive && cssClasses.push(styles$7.stepValue['isActive']);
|
|
2247
2258
|
return cssClasses.filter(css => css).join(' ');
|
|
2248
2259
|
};
|
|
2249
2260
|
return (React__default["default"].createElement("div", { ref: hoverRef, className: getCssClasses(), onClick: handleClick },
|
|
2250
2261
|
React__default["default"].createElement("div", { className: getCssClassesStep() },
|
|
2251
|
-
React__default["default"].createElement(Icon, { className: styles$
|
|
2262
|
+
React__default["default"].createElement(Icon, { className: styles$7.stepIconCircle, iconColor: (isHovered || isActive) && !isDisabled ? exports.COLOR.primary : exports.COLOR.secondary },
|
|
2252
2263
|
React__default["default"].createElement(CircleSolidIcon, null)),
|
|
2253
|
-
React__default["default"].createElement("div", { className:
|
|
2264
|
+
React__default["default"].createElement("div", { className: getCssClassesStepValue() }, showProgressCheckIcon && isActive && isDone ?
|
|
2254
2265
|
React__default["default"].createElement(Icon, null,
|
|
2255
2266
|
React__default["default"].createElement(CheckSolidIcon, null))
|
|
2256
2267
|
:
|
|
@@ -2259,18 +2270,22 @@ const Step = (props) => {
|
|
|
2259
2270
|
React__default["default"].createElement(Typography, { className: "flex-shrink-0" }, label)));
|
|
2260
2271
|
};
|
|
2261
2272
|
|
|
2273
|
+
var css_248z$6 = ".Table-module_table__DHKNv {\n --bs-table-bg: transparent;\n --bs-table-accent-bg: transparent;\n --bs-table-striped-color: #212529;\n --bs-table-striped-bg: rgba(0, 0, 0, 0.05);\n --bs-table-active-color: #212529;\n --bs-table-active-bg: rgba(0, 0, 0, 0.1);\n --bs-table-hover-color: #212529;\n --bs-table-hover-bg: rgba(0, 0, 0, 0.075);\n width: 100%;\n margin-bottom: 1rem;\n color: #212529;\n vertical-align: top;\n border-color: #dee2e6; }\n .Table-module_table__DHKNv thead {\n vertical-align: bottom; }\n .Table-module_table__DHKNv > :not(caption) > * > * {\n padding: 0.5rem 0.5rem;\n background-color: var(--bs-table-bg);\n border-bottom-width: 1px;\n box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); }\n .Table-module_table__DHKNv > :not(:first-child) {\n border-top: 2px solid currentColor; }\n\n.Table-module_bordered__1Kp1p > :not(caption) > * > * {\n border-width: 0 1px; }\n\n.Table-module_bordered__1Kp1p > :not(caption) > * {\n border-width: 1px 0; }\n\n.Table-module_striped__jmxgE > tbody > tr:nth-of-type(odd) > * {\n --bs-table-accent-bg: var(--bs-table-striped-bg);\n color: var(--bs-table-striped-color); }\n\n.Table-module_hover__P6r3y > tbody > tr:hover > * {\n --bs-table-accent-bg: var(--bs-table-hover-bg);\n color: var(--bs-table-hover-color); }\n\n.Table-module_tableResponsive__ykttB {\n overflow-x: auto; }\n";
|
|
2274
|
+
var styles$6 = {"table":"Table-module_table__DHKNv","bordered":"Table-module_bordered__1Kp1p","striped":"Table-module_striped__jmxgE","hover":"Table-module_hover__P6r3y","tableResponsive":"Table-module_tableResponsive__ykttB"};
|
|
2275
|
+
styleInject(css_248z$6);
|
|
2276
|
+
|
|
2262
2277
|
const Table = (props) => {
|
|
2263
2278
|
const { children, className, bordered, striped, hover, responsive = false } = props;
|
|
2264
2279
|
const getCssClasses = () => {
|
|
2265
2280
|
const cssClasses = [];
|
|
2266
|
-
cssClasses.push(
|
|
2267
|
-
bordered && cssClasses.push('
|
|
2268
|
-
striped && cssClasses.push('
|
|
2269
|
-
hover && cssClasses.push('
|
|
2281
|
+
cssClasses.push(styles$6.table);
|
|
2282
|
+
bordered && cssClasses.push(styles$6['bordered']);
|
|
2283
|
+
striped && cssClasses.push(styles$6['striped']);
|
|
2284
|
+
hover && cssClasses.push(styles$6['hover']);
|
|
2270
2285
|
className && cssClasses.push(className);
|
|
2271
2286
|
return cssClasses.filter(css => css).join(' ');
|
|
2272
2287
|
};
|
|
2273
|
-
return (React__default["default"].createElement(ConditionalWrapper, { condition: responsive, wrapper: children => React__default["default"].createElement("div", { className:
|
|
2288
|
+
return (React__default["default"].createElement(ConditionalWrapper, { condition: responsive, wrapper: children => React__default["default"].createElement("div", { className: styles$6.tableResponsive }, children) },
|
|
2274
2289
|
React__default["default"].createElement("table", { className: getCssClasses() }, children)));
|
|
2275
2290
|
};
|
|
2276
2291
|
|
|
@@ -2323,10 +2338,10 @@ const Tabs = (props) => {
|
|
|
2323
2338
|
key: child.props.value,
|
|
2324
2339
|
isActive: child.props.value === selectedValue,
|
|
2325
2340
|
fixed: fixed,
|
|
2326
|
-
onClick: (
|
|
2341
|
+
onClick: (e) => handleClickTab(e.event, e.value, index),
|
|
2327
2342
|
});
|
|
2328
2343
|
};
|
|
2329
|
-
return (React__default["default"].createElement(
|
|
2344
|
+
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
2330
2345
|
React__default["default"].createElement("div", { className: getCssClasses() },
|
|
2331
2346
|
children && React__default["default"].Children.toArray(children).map((child, index) => renderTabs(child, index)),
|
|
2332
2347
|
children &&
|
|
@@ -2348,11 +2363,11 @@ const Tab = (props) => {
|
|
|
2348
2363
|
className && cssClasses.push(className);
|
|
2349
2364
|
return cssClasses.filter(css => css).join(' ');
|
|
2350
2365
|
};
|
|
2351
|
-
return (React__default["default"].createElement(Button, { className: getCssClasses(), onClick: (event) => onClick && onClick(event, value), isActive: isActive, disabled: disabled }, label));
|
|
2366
|
+
return (React__default["default"].createElement(Button, { className: getCssClasses(), onClick: (event) => onClick && onClick({ event, value }), isActive: isActive, disabled: disabled }, label));
|
|
2352
2367
|
};
|
|
2353
2368
|
|
|
2354
2369
|
const TabPanel = (props) => {
|
|
2355
|
-
const { children,
|
|
2370
|
+
const { children, value, index } = props, rest = __rest(props, ["children", "value", "index"]);
|
|
2356
2371
|
return (React__default["default"].createElement("div", Object.assign({ role: "tabpanel", hidden: value !== index, id: `tabpanel-${index}`, "aria-labelledby": `wrapped-tab-${index}` }, rest), value === index && children));
|
|
2357
2372
|
};
|
|
2358
2373
|
|
|
@@ -2555,7 +2570,7 @@ var styles = {"treeItem":"TreeItem-module_treeItem__Mxsjr"};
|
|
|
2555
2570
|
styleInject(css_248z);
|
|
2556
2571
|
|
|
2557
2572
|
const TreeItem = (props) => {
|
|
2558
|
-
const { nodeId, label, children, className, isExpanded, isSelected, isSelectable, onToggleExpand,
|
|
2573
|
+
const { nodeId, label, children, className, isExpanded, isSelected, isSelectable, onToggleExpand, onItemSelect } = props;
|
|
2559
2574
|
const [_isExpanded, setIsExpanded] = React.useState(false);
|
|
2560
2575
|
const [_isSelected, setIsSelected] = React.useState(false);
|
|
2561
2576
|
const getCssClasses = () => {
|
|
@@ -2578,7 +2593,7 @@ const TreeItem = (props) => {
|
|
|
2578
2593
|
};
|
|
2579
2594
|
const handleOnSelect = (nodeId) => {
|
|
2580
2595
|
setIsSelected(!_isSelected);
|
|
2581
|
-
|
|
2596
|
+
onItemSelect && onItemSelect({ id: nodeId, isSelected: !_isSelected });
|
|
2582
2597
|
};
|
|
2583
2598
|
return (React__default["default"].createElement("li", { className: getCssClasses(), style: { paddingLeft: `${(48 * (children ? 0 : 1))}px` } },
|
|
2584
2599
|
React__default["default"].createElement("div", { className: "d-flex align-items-center" },
|