@mw-kit/mw-ui 1.8.22 → 1.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Input/components/Select/hooks/Select/interfaces.d.ts +1 -0
- package/dist/components/Input/components/Select/hooks/SelectMultiple/interfaces.d.ts +1 -0
- package/dist/components/Popup/hooks/fallbackPlacements/index.d.ts +3 -0
- package/dist/components/Popup/hooks/index.d.ts +2 -0
- package/dist/components/Popup/hooks/open/index.d.ts +3 -0
- package/dist/components/Popup/index.d.ts +6 -0
- package/dist/components/Popup/styles.d.ts +9 -0
- package/dist/components/Popup/types.d.ts +17 -0
- package/dist/components/Select/components/Apply/index.d.ts +7 -0
- package/dist/components/Select/components/Apply/styles.d.ts +1 -0
- package/dist/components/Select/components/Scroll/index.d.ts +20 -0
- package/dist/components/Select/components/Scroll/styles.d.ts +9 -0
- package/dist/components/Select/components/Search/index.d.ts +7 -0
- package/dist/components/Select/components/Search/styles.d.ts +1 -0
- package/dist/components/Select/constants.d.ts +2 -0
- package/dist/components/Select/hooks/index.d.ts +5 -0
- package/dist/components/Select/hooks/useAsyncOptions/index.d.ts +8 -0
- package/dist/components/Select/hooks/useFloatingMenu/index.d.ts +50 -0
- package/dist/components/Select/hooks/useListNavigation/index.d.ts +13 -0
- package/dist/components/Select/hooks/useRuleIndex/index.d.ts +11 -0
- package/dist/components/Select/hooks/useVirtualizedOptions/index.d.ts +13 -0
- package/dist/components/Select/index.d.ts +6 -0
- package/dist/components/Select/instances/index.d.ts +3 -0
- package/dist/components/Select/instances/multi/index.d.ts +3 -0
- package/dist/components/Select/instances/single/index.d.ts +3 -0
- package/dist/components/Select/instances/styles.d.ts +3 -0
- package/dist/components/Select/instances/types.d.ts +12 -0
- package/dist/components/Select/styles.d.ts +14 -0
- package/dist/components/Select/types.d.ts +75 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/hooks/index.d.ts +3 -0
- package/dist/hooks/useDebouncedCallback/index.d.ts +8 -0
- package/dist/hooks/useDebouncedState/index.d.ts +5 -0
- package/dist/index.d.mts +85 -3
- package/dist/index.js +2399 -521
- package/dist/index.mjs +2418 -520
- package/dist/interfaces.d.ts +2 -1
- package/package.json +5 -1
- /package/dist/hooks/{onClickOut.d.ts → useOnClickOut/index.d.ts} +0 -0
package/dist/index.js
CHANGED
|
@@ -49,6 +49,7 @@ __export(index_exports, {
|
|
|
49
49
|
MwPlaceholder: () => Placeholder_default,
|
|
50
50
|
MwProgressBar: () => ProgressBar_default,
|
|
51
51
|
MwScrollContainer: () => ScrollContainer_default,
|
|
52
|
+
MwSelect: () => Select_default3,
|
|
52
53
|
MwSignature: () => Signature_default,
|
|
53
54
|
MwTabs: () => Tabs_default,
|
|
54
55
|
MwTextArea: () => TextArea_default,
|
|
@@ -698,36 +699,36 @@ var positions = {
|
|
|
698
699
|
`
|
|
699
700
|
};
|
|
700
701
|
var pointerPositions = {
|
|
701
|
-
"top right": (distance,
|
|
702
|
+
"top right": (distance, size4) => import_styled_components2.css`
|
|
702
703
|
top: ${distance};
|
|
703
|
-
left: calc(${
|
|
704
|
+
left: calc(${size4} / 2 * -1);
|
|
704
705
|
`,
|
|
705
|
-
"top left": (distance,
|
|
706
|
+
"top left": (distance, size4) => import_styled_components2.css`
|
|
706
707
|
top: ${distance};
|
|
707
|
-
right: calc(${
|
|
708
|
+
right: calc(${size4} / 2 * -1);
|
|
708
709
|
`,
|
|
709
|
-
"bottom right": (distance,
|
|
710
|
+
"bottom right": (distance, size4) => import_styled_components2.css`
|
|
710
711
|
bottom: ${distance};
|
|
711
|
-
left: calc(${
|
|
712
|
+
left: calc(${size4} / 2 * -1);
|
|
712
713
|
`,
|
|
713
|
-
"bottom left": (distance,
|
|
714
|
+
"bottom left": (distance, size4) => import_styled_components2.css`
|
|
714
715
|
bottom: ${distance};
|
|
715
|
-
right: calc(${
|
|
716
|
+
right: calc(${size4} / 2 * -1);
|
|
716
717
|
`,
|
|
717
|
-
"right top": (distance,
|
|
718
|
-
bottom: calc(${
|
|
718
|
+
"right top": (distance, size4) => import_styled_components2.css`
|
|
719
|
+
bottom: calc(${size4} / 2 * -1);
|
|
719
720
|
right: ${distance};
|
|
720
721
|
`,
|
|
721
|
-
"right bottom": (distance,
|
|
722
|
-
top: calc(${
|
|
722
|
+
"right bottom": (distance, size4) => import_styled_components2.css`
|
|
723
|
+
top: calc(${size4} / 2 * -1);
|
|
723
724
|
right: ${distance};
|
|
724
725
|
`,
|
|
725
|
-
"left top": (distance,
|
|
726
|
-
bottom: calc(${
|
|
726
|
+
"left top": (distance, size4) => import_styled_components2.css`
|
|
727
|
+
bottom: calc(${size4} / 2 * -1);
|
|
727
728
|
left: ${distance};
|
|
728
729
|
`,
|
|
729
|
-
"left bottom": (distance,
|
|
730
|
-
top: calc(${
|
|
730
|
+
"left bottom": (distance, size4) => import_styled_components2.css`
|
|
731
|
+
top: calc(${size4} / 2 * -1);
|
|
731
732
|
left: ${distance};
|
|
732
733
|
`
|
|
733
734
|
};
|
|
@@ -817,7 +818,7 @@ var Container = import_styled_components2.default.div`
|
|
|
817
818
|
distance: "s1",
|
|
818
819
|
...pointer === true ? {} : pointer
|
|
819
820
|
};
|
|
820
|
-
const
|
|
821
|
+
const size4 = typeof config.size === "function" ? config.size(theme4) : isKeyOf(theme4.spacings, config.size) ? theme4.spacings[config.size] : config.size;
|
|
821
822
|
const distance = typeof config.distance === "function" ? config.distance(theme4) : isKeyOf(theme4.spacings, config.distance) ? theme4.spacings[config.distance] : config.distance;
|
|
822
823
|
const color = typeof config.color === "function" ? config.color(theme4) : isKeyOf(theme4.colors, config.color) ? theme4.colors[config.color] : config.color;
|
|
823
824
|
return import_styled_components2.css`
|
|
@@ -826,10 +827,10 @@ var Container = import_styled_components2.default.div`
|
|
|
826
827
|
|
|
827
828
|
position: absolute;
|
|
828
829
|
|
|
829
|
-
${pointerPositions[position](distance,
|
|
830
|
+
${pointerPositions[position](distance, size4)}
|
|
830
831
|
|
|
831
|
-
width: ${
|
|
832
|
-
height: ${
|
|
832
|
+
width: ${size4};
|
|
833
|
+
height: ${size4};
|
|
833
834
|
|
|
834
835
|
transform: rotate(45deg);
|
|
835
836
|
|
|
@@ -970,7 +971,7 @@ var loader = import_styled_components3.keyframes`
|
|
|
970
971
|
`;
|
|
971
972
|
var Container2 = import_styled_components3.default.div`
|
|
972
973
|
${({
|
|
973
|
-
$size:
|
|
974
|
+
$size: size4,
|
|
974
975
|
$borderSize: borderSize,
|
|
975
976
|
$bgColor: bgColor,
|
|
976
977
|
$color: color,
|
|
@@ -978,9 +979,9 @@ var Container2 = import_styled_components3.default.div`
|
|
|
978
979
|
$filled: filled,
|
|
979
980
|
$zIndex: zIndex
|
|
980
981
|
}) => {
|
|
981
|
-
const s = borderSize ||
|
|
982
|
+
const s = borderSize || size4;
|
|
982
983
|
borderSize = s ? `calc(${s} * 0.0757)` : "5px";
|
|
983
|
-
|
|
984
|
+
size4 = size4 || "48px";
|
|
984
985
|
color = color || "blue";
|
|
985
986
|
bgColor = bgColor || color;
|
|
986
987
|
const beforeColor = isKeyOf(theme4.colors, bgColor) ? theme4.getColor(bgColor, 25) : color;
|
|
@@ -1008,10 +1009,10 @@ var Container2 = import_styled_components3.default.div`
|
|
|
1008
1009
|
position: absolute;
|
|
1009
1010
|
content: '';
|
|
1010
1011
|
|
|
1011
|
-
top: calc(50% - ${
|
|
1012
|
-
left: calc(50% - ${
|
|
1013
|
-
width: ${
|
|
1014
|
-
height: ${
|
|
1012
|
+
top: calc(50% - ${size4} / 2);
|
|
1013
|
+
left: calc(50% - ${size4} / 2);
|
|
1014
|
+
width: ${size4};
|
|
1015
|
+
height: ${size4};
|
|
1015
1016
|
border-radius: 50%;
|
|
1016
1017
|
border-width: ${borderSize};
|
|
1017
1018
|
border-style: solid;
|
|
@@ -1032,7 +1033,7 @@ var Container2 = import_styled_components3.default.div`
|
|
|
1032
1033
|
var Loader = ({
|
|
1033
1034
|
color,
|
|
1034
1035
|
bgColor,
|
|
1035
|
-
size:
|
|
1036
|
+
size: size4,
|
|
1036
1037
|
borderSize,
|
|
1037
1038
|
filled,
|
|
1038
1039
|
zIndex,
|
|
@@ -1044,7 +1045,7 @@ var Loader = ({
|
|
|
1044
1045
|
...props,
|
|
1045
1046
|
$color: color,
|
|
1046
1047
|
$bgColor: bgColor,
|
|
1047
|
-
$size:
|
|
1048
|
+
$size: size4,
|
|
1048
1049
|
$borderSize: borderSize,
|
|
1049
1050
|
$filled: filled,
|
|
1050
1051
|
$zIndex: zIndex
|
|
@@ -1098,13 +1099,13 @@ var Button = import_styled_components4.default.button`
|
|
|
1098
1099
|
position: relative;
|
|
1099
1100
|
user-select: none;
|
|
1100
1101
|
|
|
1101
|
-
${({ $size:
|
|
1102
|
+
${({ $size: size4, theme: theme4 }) => {
|
|
1102
1103
|
const { sizes: sizes3 } = theme4.components.button;
|
|
1103
1104
|
return import_styled_components4.css`
|
|
1104
|
-
font-size: ${sizes3[
|
|
1105
|
-
line-height: ${sizes3[
|
|
1106
|
-
min-width: ${sizes3[
|
|
1107
|
-
min-height: ${sizes3[
|
|
1105
|
+
font-size: ${sizes3[size4].fontSize};
|
|
1106
|
+
line-height: ${sizes3[size4].lineHeight};
|
|
1107
|
+
min-width: ${sizes3[size4].minWidth};
|
|
1108
|
+
min-height: ${sizes3[size4].minHeight};
|
|
1108
1109
|
`;
|
|
1109
1110
|
}};
|
|
1110
1111
|
|
|
@@ -1188,13 +1189,13 @@ var Button = import_styled_components4.default.button`
|
|
|
1188
1189
|
// src/components/Button/index.tsx
|
|
1189
1190
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
1190
1191
|
var Button2 = (props) => {
|
|
1191
|
-
const { children, content, ...
|
|
1192
|
+
const { children, content, ...styled85 } = props;
|
|
1192
1193
|
const defaultValues = {
|
|
1193
|
-
$appearance:
|
|
1194
|
-
$color:
|
|
1195
|
-
$loading:
|
|
1196
|
-
$size:
|
|
1197
|
-
type:
|
|
1194
|
+
$appearance: styled85.appearance || "solid",
|
|
1195
|
+
$color: styled85.color,
|
|
1196
|
+
$loading: styled85.loading ? +styled85.loading : 0,
|
|
1197
|
+
$size: styled85.size || "small",
|
|
1198
|
+
type: styled85.type || "button"
|
|
1198
1199
|
};
|
|
1199
1200
|
const htmlProps = filterObject(props, ["size", "appearance", "color", "loading", "content"]);
|
|
1200
1201
|
const loaderSize = sizes[defaultValues.$size].lineHeight;
|
|
@@ -1221,10 +1222,10 @@ var Button2 = (props) => {
|
|
|
1221
1222
|
var Button_default = Button2;
|
|
1222
1223
|
|
|
1223
1224
|
// src/components/Calendar/index.tsx
|
|
1224
|
-
var
|
|
1225
|
+
var import_react21 = __toESM(require("react"));
|
|
1225
1226
|
|
|
1226
1227
|
// src/components/Calendar/components/Basic/index.tsx
|
|
1227
|
-
var
|
|
1228
|
+
var import_react12 = __toESM(require("react"));
|
|
1228
1229
|
|
|
1229
1230
|
// src/components/Calendar/constants.ts
|
|
1230
1231
|
var months = [
|
|
@@ -1248,13 +1249,86 @@ var inputTimeWidth = {
|
|
|
1248
1249
|
};
|
|
1249
1250
|
|
|
1250
1251
|
// src/components/Calendar/components/Basic/components/Main/index.tsx
|
|
1251
|
-
var
|
|
1252
|
+
var import_react11 = __toESM(require("react"));
|
|
1252
1253
|
|
|
1253
|
-
// src/hooks/
|
|
1254
|
+
// src/hooks/useDebouncedCallback/index.ts
|
|
1254
1255
|
var import_react3 = require("react");
|
|
1255
|
-
var
|
|
1256
|
-
|
|
1256
|
+
var debounce = (fn, delay) => {
|
|
1257
|
+
let timeout = null;
|
|
1258
|
+
let lastArgs = null;
|
|
1259
|
+
const debounced = (...args) => {
|
|
1260
|
+
lastArgs = args;
|
|
1261
|
+
if (timeout !== null) {
|
|
1262
|
+
clearTimeout(timeout);
|
|
1263
|
+
}
|
|
1264
|
+
timeout = setTimeout(() => {
|
|
1265
|
+
if (lastArgs !== null) {
|
|
1266
|
+
fn(...lastArgs);
|
|
1267
|
+
lastArgs = null;
|
|
1268
|
+
}
|
|
1269
|
+
timeout = null;
|
|
1270
|
+
}, delay);
|
|
1271
|
+
};
|
|
1272
|
+
debounced.cancel = () => {
|
|
1273
|
+
if (timeout !== null) {
|
|
1274
|
+
clearTimeout(timeout);
|
|
1275
|
+
timeout = null;
|
|
1276
|
+
}
|
|
1277
|
+
lastArgs = null;
|
|
1278
|
+
};
|
|
1279
|
+
debounced.flush = () => {
|
|
1280
|
+
if (timeout !== null) {
|
|
1281
|
+
clearTimeout(timeout);
|
|
1282
|
+
timeout = null;
|
|
1283
|
+
}
|
|
1284
|
+
if (lastArgs !== null) {
|
|
1285
|
+
fn(...lastArgs);
|
|
1286
|
+
lastArgs = null;
|
|
1287
|
+
}
|
|
1288
|
+
};
|
|
1289
|
+
return debounced;
|
|
1290
|
+
};
|
|
1291
|
+
var useDebouncedCallback = (callback, delay) => {
|
|
1292
|
+
const debounced = (0, import_react3.useMemo)(() => debounce(callback, delay), [callback, delay]);
|
|
1257
1293
|
(0, import_react3.useEffect)(() => {
|
|
1294
|
+
return () => {
|
|
1295
|
+
debounced.cancel();
|
|
1296
|
+
};
|
|
1297
|
+
}, [debounced]);
|
|
1298
|
+
return debounced;
|
|
1299
|
+
};
|
|
1300
|
+
var useDebouncedCallback_default = useDebouncedCallback;
|
|
1301
|
+
|
|
1302
|
+
// src/hooks/useDebouncedState/index.ts
|
|
1303
|
+
var import_react4 = require("react");
|
|
1304
|
+
var useDebouncedState = (initial, onUpdate, ms) => {
|
|
1305
|
+
const [state, setState] = (0, import_react4.useState)({ current: initial, debounced: initial });
|
|
1306
|
+
const onUpdateSearch = useDebouncedCallback_default(
|
|
1307
|
+
(0, import_react4.useCallback)((search) => {
|
|
1308
|
+
onUpdate();
|
|
1309
|
+
setState((prev) => ({ ...prev, debounced: search }));
|
|
1310
|
+
}, []),
|
|
1311
|
+
ms
|
|
1312
|
+
);
|
|
1313
|
+
const setCurrent = (input) => {
|
|
1314
|
+
setState((prev) => ({ ...prev, current: input }));
|
|
1315
|
+
onUpdateSearch(input);
|
|
1316
|
+
};
|
|
1317
|
+
const setDebounced = (value) => {
|
|
1318
|
+
setState({ current: value, debounced: value });
|
|
1319
|
+
};
|
|
1320
|
+
return {
|
|
1321
|
+
current: [state.current, setCurrent],
|
|
1322
|
+
debounced: [state.debounced, setDebounced]
|
|
1323
|
+
};
|
|
1324
|
+
};
|
|
1325
|
+
var useDebouncedState_default = useDebouncedState;
|
|
1326
|
+
|
|
1327
|
+
// src/hooks/useOnClickOut/index.ts
|
|
1328
|
+
var import_react5 = require("react");
|
|
1329
|
+
var useOnClickOut = (callback) => {
|
|
1330
|
+
const [ref, setRef] = (0, import_react5.useState)(null);
|
|
1331
|
+
(0, import_react5.useEffect)(() => {
|
|
1258
1332
|
const listener = (event) => {
|
|
1259
1333
|
if (!ref || ref.contains(event.target)) {
|
|
1260
1334
|
return;
|
|
@@ -1270,10 +1344,10 @@ var useOnClickOut = (callback) => {
|
|
|
1270
1344
|
}, [ref, callback]);
|
|
1271
1345
|
return setRef;
|
|
1272
1346
|
};
|
|
1273
|
-
var
|
|
1347
|
+
var useOnClickOut_default = useOnClickOut;
|
|
1274
1348
|
|
|
1275
1349
|
// src/theme/index.tsx
|
|
1276
|
-
var
|
|
1350
|
+
var import_react7 = require("react");
|
|
1277
1351
|
var import_styled_components6 = require("styled-components");
|
|
1278
1352
|
|
|
1279
1353
|
// src/assets/helpers.ts
|
|
@@ -1322,7 +1396,7 @@ var theme2 = {
|
|
|
1322
1396
|
var theme_default2 = theme2;
|
|
1323
1397
|
|
|
1324
1398
|
// src/theme/globals.tsx
|
|
1325
|
-
var
|
|
1399
|
+
var import_react6 = __toESM(require("react"));
|
|
1326
1400
|
var import_styled_components5 = require("styled-components");
|
|
1327
1401
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
1328
1402
|
var Allura = import_styled_components5.createGlobalStyle`
|
|
@@ -1680,7 +1754,7 @@ var Lato = import_styled_components5.createGlobalStyle`
|
|
|
1680
1754
|
}
|
|
1681
1755
|
`;
|
|
1682
1756
|
var Globals = () => {
|
|
1683
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
1757
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react6.default.Fragment, { children: [
|
|
1684
1758
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Allura, {}),
|
|
1685
1759
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(GreatVibes, {}),
|
|
1686
1760
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Pacifico, {}),
|
|
@@ -1721,7 +1795,7 @@ var theme3 = {
|
|
|
1721
1795
|
components: theme_default2
|
|
1722
1796
|
};
|
|
1723
1797
|
var ThemeProvider = (props) => {
|
|
1724
|
-
const value = (0,
|
|
1798
|
+
const value = (0, import_react7.useMemo)(() => {
|
|
1725
1799
|
return {
|
|
1726
1800
|
...theme3,
|
|
1727
1801
|
assetUrl: (asset) => assetUrl(asset, props.assetBaseUrl)
|
|
@@ -8748,14 +8822,14 @@ var getInitialCalendar = (date, min, max) => {
|
|
|
8748
8822
|
};
|
|
8749
8823
|
|
|
8750
8824
|
// src/components/Calendar/components/Basic/components/MonthPicker/index.tsx
|
|
8751
|
-
var
|
|
8825
|
+
var import_react10 = require("react");
|
|
8752
8826
|
|
|
8753
8827
|
// src/components/Menu/index.tsx
|
|
8754
|
-
var
|
|
8828
|
+
var import_react9 = __toESM(require("react"));
|
|
8755
8829
|
var import_semantic_ui_react2 = require("semantic-ui-react");
|
|
8756
8830
|
|
|
8757
8831
|
// src/components/ScrollContainer/index.tsx
|
|
8758
|
-
var
|
|
8832
|
+
var import_react8 = __toESM(require("react"));
|
|
8759
8833
|
|
|
8760
8834
|
// src/components/ScrollContainer/styles/BeforeAfterContainer/index.ts
|
|
8761
8835
|
var import_styled_components8 = __toESM(require("styled-components"));
|
|
@@ -8878,7 +8952,7 @@ var RelativeContainer_default = RelativeContainer;
|
|
|
8878
8952
|
// src/components/ScrollContainer/index.tsx
|
|
8879
8953
|
var import_jsx_runtime294 = require("react/jsx-runtime");
|
|
8880
8954
|
var isAfterBefore = (props) => {
|
|
8881
|
-
return !
|
|
8955
|
+
return !import_react8.default.isValidElement(props);
|
|
8882
8956
|
};
|
|
8883
8957
|
var getBeforeAfter = (props) => {
|
|
8884
8958
|
if (!props) return null;
|
|
@@ -8894,12 +8968,12 @@ var getBeforeAfter = (props) => {
|
|
|
8894
8968
|
);
|
|
8895
8969
|
return /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(BeforeAfterContainer_default, { ...args });
|
|
8896
8970
|
};
|
|
8897
|
-
var ScrollContainer =
|
|
8971
|
+
var ScrollContainer = import_react8.default.forwardRef(
|
|
8898
8972
|
(props, ref) => {
|
|
8899
8973
|
const { loading } = props;
|
|
8900
8974
|
const onScrollEnd = props.onScrollEnd || (() => {
|
|
8901
8975
|
});
|
|
8902
|
-
const [, setLastPagination] = (0,
|
|
8976
|
+
const [, setLastPagination] = (0, import_react8.useState)(/* @__PURE__ */ new Date());
|
|
8903
8977
|
const onScroll = (event) => {
|
|
8904
8978
|
if (event.target !== event.currentTarget) return;
|
|
8905
8979
|
const target = event.nativeEvent.target;
|
|
@@ -9091,8 +9165,8 @@ var isVisible = (elem, bound) => {
|
|
|
9091
9165
|
};
|
|
9092
9166
|
var MenuComponent = (props, ref) => {
|
|
9093
9167
|
const { close, options, children, highlight } = { ...props };
|
|
9094
|
-
const [scrollRef, setScrollRef] = (0,
|
|
9095
|
-
(0,
|
|
9168
|
+
const [scrollRef, setScrollRef] = (0, import_react9.useState)(null);
|
|
9169
|
+
(0, import_react9.useEffect)(() => {
|
|
9096
9170
|
if (!scrollRef || highlight === void 0) return;
|
|
9097
9171
|
const element = scrollRef.children[highlight];
|
|
9098
9172
|
if (!element) return;
|
|
@@ -9123,7 +9197,7 @@ var MenuComponent = (props, ref) => {
|
|
|
9123
9197
|
$bordered: props.bordered,
|
|
9124
9198
|
$containerSpacing: props.containerSpacing,
|
|
9125
9199
|
$itemSpacing: props.itemSpacing,
|
|
9126
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(
|
|
9200
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(import_react9.default.Fragment, { children: [
|
|
9127
9201
|
/* @__PURE__ */ (0, import_jsx_runtime295.jsx)(
|
|
9128
9202
|
ScrollContainer_default,
|
|
9129
9203
|
{
|
|
@@ -9183,8 +9257,8 @@ var MenuComponent = (props, ref) => {
|
|
|
9183
9257
|
const label = option.label;
|
|
9184
9258
|
const labelOptions = filterObject(option, ["onClick", "label", "rules"]);
|
|
9185
9259
|
labelOptions.disabled = disabled;
|
|
9186
|
-
const LabelComponent = typeof label === "function" ? label : () => /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(
|
|
9187
|
-
return /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(
|
|
9260
|
+
const LabelComponent = typeof label === "function" ? label : () => /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(import_react9.default.Fragment, { children: label });
|
|
9261
|
+
return /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(import_react9.default.Fragment, { children: [
|
|
9188
9262
|
/* @__PURE__ */ (0, import_jsx_runtime295.jsx)(OptionContent, { children: /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(
|
|
9189
9263
|
Option,
|
|
9190
9264
|
{
|
|
@@ -9208,7 +9282,7 @@ var MenuComponent = (props, ref) => {
|
|
|
9208
9282
|
}
|
|
9209
9283
|
);
|
|
9210
9284
|
};
|
|
9211
|
-
var Menu =
|
|
9285
|
+
var Menu = import_react9.default.forwardRef(MenuComponent);
|
|
9212
9286
|
var Menu_default2 = Menu;
|
|
9213
9287
|
|
|
9214
9288
|
// src/components/Calendar/components/Basic/styles.ts
|
|
@@ -9312,8 +9386,8 @@ var NavBtn = import_styled_components13.default.button`
|
|
|
9312
9386
|
var import_jsx_runtime296 = require("react/jsx-runtime");
|
|
9313
9387
|
var MonthPicker = (props) => {
|
|
9314
9388
|
const { setValue, close, min, max, year: initialYear, ...menuProps } = props;
|
|
9315
|
-
const [year, setYear] = (0,
|
|
9316
|
-
(0,
|
|
9389
|
+
const [year, setYear] = (0, import_react10.useState)(initialYear);
|
|
9390
|
+
(0, import_react10.useEffect)(() => {
|
|
9317
9391
|
setYear(initialYear);
|
|
9318
9392
|
}, [props.open, initialYear]);
|
|
9319
9393
|
return /* @__PURE__ */ (0, import_jsx_runtime296.jsx)(
|
|
@@ -9415,9 +9489,9 @@ var Container6 = import_styled_components14.default.div`
|
|
|
9415
9489
|
display: block;
|
|
9416
9490
|
border-radius: 100%;
|
|
9417
9491
|
|
|
9418
|
-
${({ $size:
|
|
9419
|
-
width: ${sizes2[
|
|
9420
|
-
height: ${sizes2[
|
|
9492
|
+
${({ $size: size4 }) => import_styled_components14.css`
|
|
9493
|
+
width: ${sizes2[size4]};
|
|
9494
|
+
height: ${sizes2[size4]};
|
|
9421
9495
|
`};
|
|
9422
9496
|
|
|
9423
9497
|
background-color: ${({ theme: { colors: colors2 }, $type: type }) => colors2[types[type]]};
|
|
@@ -9427,7 +9501,7 @@ var Container6 = import_styled_components14.default.div`
|
|
|
9427
9501
|
// src/components/Indicator/index.tsx
|
|
9428
9502
|
var import_jsx_runtime297 = require("react/jsx-runtime");
|
|
9429
9503
|
var Indicator = ({
|
|
9430
|
-
size:
|
|
9504
|
+
size: size4,
|
|
9431
9505
|
type,
|
|
9432
9506
|
labelColor,
|
|
9433
9507
|
...props
|
|
@@ -9436,7 +9510,7 @@ var Indicator = ({
|
|
|
9436
9510
|
Container6,
|
|
9437
9511
|
{
|
|
9438
9512
|
...{
|
|
9439
|
-
$size:
|
|
9513
|
+
$size: size4 || "small",
|
|
9440
9514
|
$type: type || "default",
|
|
9441
9515
|
$labelColor: labelColor || "darkBlue",
|
|
9442
9516
|
...props
|
|
@@ -9579,11 +9653,11 @@ var DayIndicator = (0, import_styled_components15.default)(Indicator_default).at
|
|
|
9579
9653
|
|
|
9580
9654
|
// src/components/Calendar/components/Basic/components/Main/index.tsx
|
|
9581
9655
|
var import_jsx_runtime298 = require("react/jsx-runtime");
|
|
9582
|
-
var Main =
|
|
9656
|
+
var Main = import_react11.default.forwardRef(
|
|
9583
9657
|
(props, ref) => {
|
|
9584
9658
|
const { getDay, initialMonth } = props;
|
|
9585
|
-
const [selectOpen, setSelectOpen] = (0,
|
|
9586
|
-
const [loading, setLoading] = (0,
|
|
9659
|
+
const [selectOpen, setSelectOpen] = (0, import_react11.useState)(false);
|
|
9660
|
+
const [loading, setLoading] = (0, import_react11.useState)(false);
|
|
9587
9661
|
const onChangeMonth = (() => {
|
|
9588
9662
|
const { onChangeMonth: onChangeMonth2 } = props;
|
|
9589
9663
|
if (!onChangeMonth2) return async () => {
|
|
@@ -9604,7 +9678,7 @@ var Main = import_react9.default.forwardRef(
|
|
|
9604
9678
|
date.setHours(0, 0, 0, 0);
|
|
9605
9679
|
return date;
|
|
9606
9680
|
})() : void 0;
|
|
9607
|
-
const [calendar, _setCalendar] = props.calendar || (0,
|
|
9681
|
+
const [calendar, _setCalendar] = props.calendar || (0, import_react11.useState)(getInitialCalendar(initialMonth, min, max));
|
|
9608
9682
|
const setCalendar = (value) => {
|
|
9609
9683
|
_setCalendar((prev) => {
|
|
9610
9684
|
const newv = typeof value === "function" ? value(prev) : value;
|
|
@@ -9612,7 +9686,7 @@ var Main = import_react9.default.forwardRef(
|
|
|
9612
9686
|
});
|
|
9613
9687
|
};
|
|
9614
9688
|
const isControlled = props.calendar !== void 0;
|
|
9615
|
-
(0,
|
|
9689
|
+
(0, import_react11.useEffect)(() => {
|
|
9616
9690
|
if (isControlled) return;
|
|
9617
9691
|
setCalendar(getInitialCalendar(initialMonth, min, max));
|
|
9618
9692
|
}, [
|
|
@@ -9621,7 +9695,7 @@ var Main = import_react9.default.forwardRef(
|
|
|
9621
9695
|
min?.toISOString(),
|
|
9622
9696
|
max?.toISOString()
|
|
9623
9697
|
]);
|
|
9624
|
-
(0,
|
|
9698
|
+
(0, import_react11.useEffect)(() => {
|
|
9625
9699
|
const [first, last] = [
|
|
9626
9700
|
calendar.weeks[0],
|
|
9627
9701
|
calendar.weeks[calendar.weeks.length - 1]
|
|
@@ -9671,7 +9745,7 @@ var Main = import_react9.default.forwardRef(
|
|
|
9671
9745
|
/* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(Header, { children: [
|
|
9672
9746
|
/* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(MonthContainer, { children: [
|
|
9673
9747
|
getPrev(),
|
|
9674
|
-
/* @__PURE__ */ (0, import_jsx_runtime298.jsxs)("div", { ref:
|
|
9748
|
+
/* @__PURE__ */ (0, import_jsx_runtime298.jsxs)("div", { ref: useOnClickOut_default(() => setSelectOpen(false)), children: [
|
|
9675
9749
|
(() => {
|
|
9676
9750
|
if (min !== void 0 && max !== void 0 && min.getFullYear() === max.getFullYear() && min.getMonth() === max.getMonth()) {
|
|
9677
9751
|
return /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(MonthName, { children: [
|
|
@@ -9782,7 +9856,7 @@ var Main_default = Main;
|
|
|
9782
9856
|
|
|
9783
9857
|
// src/components/Calendar/components/Basic/index.tsx
|
|
9784
9858
|
var import_jsx_runtime299 = require("react/jsx-runtime");
|
|
9785
|
-
var BasicCalendar =
|
|
9859
|
+
var BasicCalendar = import_react12.default.forwardRef(
|
|
9786
9860
|
(props, ref) => {
|
|
9787
9861
|
const containerProps = filterObject(props, [
|
|
9788
9862
|
"initialMonth",
|
|
@@ -9810,22 +9884,22 @@ BasicCalendar.displayName = "BasicCalendar";
|
|
|
9810
9884
|
var Basic_default = BasicCalendar;
|
|
9811
9885
|
|
|
9812
9886
|
// src/components/Calendar/components/Interval/index.tsx
|
|
9813
|
-
var
|
|
9887
|
+
var import_react18 = __toESM(require("react"));
|
|
9814
9888
|
|
|
9815
9889
|
// src/components/Calendar/components/Interval/components/Main/index.tsx
|
|
9816
|
-
var
|
|
9890
|
+
var import_react17 = __toESM(require("react"));
|
|
9817
9891
|
|
|
9818
9892
|
// src/components/Input/components/Time/index.tsx
|
|
9819
|
-
var
|
|
9893
|
+
var import_react16 = __toESM(require("react"));
|
|
9820
9894
|
|
|
9821
9895
|
// src/components/Input/components/Input/index.tsx
|
|
9822
|
-
var
|
|
9896
|
+
var import_react15 = __toESM(require("react"));
|
|
9823
9897
|
|
|
9824
9898
|
// src/components/Form/index.tsx
|
|
9825
|
-
var
|
|
9899
|
+
var import_react14 = __toESM(require("react"));
|
|
9826
9900
|
|
|
9827
9901
|
// src/components/Form/context.tsx
|
|
9828
|
-
var
|
|
9902
|
+
var import_react13 = __toESM(require("react"));
|
|
9829
9903
|
var import_jsx_runtime300 = require("react/jsx-runtime");
|
|
9830
9904
|
var defaultValue = {
|
|
9831
9905
|
isRequired: () => false,
|
|
@@ -9833,9 +9907,9 @@ var defaultValue = {
|
|
|
9833
9907
|
isViewMode: () => false,
|
|
9834
9908
|
isDisabled: () => false
|
|
9835
9909
|
};
|
|
9836
|
-
var Context =
|
|
9910
|
+
var Context = import_react13.default.createContext({ ...defaultValue });
|
|
9837
9911
|
var useContext = (name) => {
|
|
9838
|
-
const context =
|
|
9912
|
+
const context = import_react13.default.useContext(Context);
|
|
9839
9913
|
return {
|
|
9840
9914
|
isRequired: () => false,
|
|
9841
9915
|
isInvalid: () => false,
|
|
@@ -9863,7 +9937,7 @@ var context_default = useContext;
|
|
|
9863
9937
|
// src/components/Form/index.tsx
|
|
9864
9938
|
var import_jsx_runtime301 = require("react/jsx-runtime");
|
|
9865
9939
|
var Form = Object.assign(
|
|
9866
|
-
|
|
9940
|
+
import_react14.default.forwardRef(
|
|
9867
9941
|
Object.assign(
|
|
9868
9942
|
(props, ref) => {
|
|
9869
9943
|
const formProps = filterObject(props, ["isRequired", "isInvalid", "isViewMode", "isDisabled"]);
|
|
@@ -10225,7 +10299,7 @@ var setMask = (event, handler, setValue, maskFn) => {
|
|
|
10225
10299
|
target.setSelectionRange(start, end);
|
|
10226
10300
|
}
|
|
10227
10301
|
};
|
|
10228
|
-
var Input2 =
|
|
10302
|
+
var Input2 = import_react15.default.forwardRef(
|
|
10229
10303
|
(props, ref) => {
|
|
10230
10304
|
const {
|
|
10231
10305
|
label,
|
|
@@ -10245,9 +10319,9 @@ var Input2 = import_react13.default.forwardRef(
|
|
|
10245
10319
|
const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
|
|
10246
10320
|
props.name
|
|
10247
10321
|
);
|
|
10248
|
-
const isComposing = (0,
|
|
10249
|
-
const maskFn = (0,
|
|
10250
|
-
(0,
|
|
10322
|
+
const isComposing = (0, import_react15.useRef)(false);
|
|
10323
|
+
const maskFn = (0, import_react15.useMemo)(() => getMask(props.mask), [props.mask]);
|
|
10324
|
+
(0, import_react15.useEffect)(() => {
|
|
10251
10325
|
if (isComposing.current) return;
|
|
10252
10326
|
if (!isString(props.value)) return;
|
|
10253
10327
|
const masked = maskFn(props.value);
|
|
@@ -10393,7 +10467,7 @@ var Input2 = import_react13.default.forwardRef(
|
|
|
10393
10467
|
viewMode ? /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(ViewModeContainer, { children: inputProps.value || props.children }) : /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(InputContainer, { $width: props.inputWidth, children: [
|
|
10394
10468
|
/* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Input, { ...inputProps, ref }),
|
|
10395
10469
|
props.children && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(ChildrenContainer, { children: props.children }),
|
|
10396
|
-
/* @__PURE__ */ (0, import_jsx_runtime303.jsx)(IconContainer, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Icon_default, { type: "jsx", icon: /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Loader_default, { size: "14px" }), width: "14px" }) : /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(
|
|
10470
|
+
/* @__PURE__ */ (0, import_jsx_runtime303.jsx)(IconContainer, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Icon_default, { type: "jsx", icon: /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Loader_default, { size: "14px" }), width: "14px" }) : /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(import_react15.default.Fragment, { children: [
|
|
10397
10471
|
onDirty && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
|
|
10398
10472
|
Icon_default,
|
|
10399
10473
|
{
|
|
@@ -10464,7 +10538,7 @@ var getDate = (value) => {
|
|
|
10464
10538
|
date.setHours(h, m, s, 0);
|
|
10465
10539
|
return date;
|
|
10466
10540
|
};
|
|
10467
|
-
var Time =
|
|
10541
|
+
var Time = import_react16.default.forwardRef(
|
|
10468
10542
|
(props, ref) => {
|
|
10469
10543
|
const { value, seconds } = props;
|
|
10470
10544
|
const _onKeyDown = props.onKeyDown || (() => {
|
|
@@ -10618,15 +10692,15 @@ var LabelContainer2 = import_styled_components19.default.div`
|
|
|
10618
10692
|
|
|
10619
10693
|
// src/components/Calendar/components/Interval/components/Main/index.tsx
|
|
10620
10694
|
var import_jsx_runtime305 = require("react/jsx-runtime");
|
|
10621
|
-
var Main2 =
|
|
10695
|
+
var Main2 = import_react17.default.forwardRef(
|
|
10622
10696
|
(props, ref) => {
|
|
10623
10697
|
const { initialMonth, initialValue, min, max } = props;
|
|
10624
|
-
const [value, setValue] = props.value || (0,
|
|
10625
|
-
const [invalid, setInvalid] = props.invalid || (0,
|
|
10626
|
-
const [time, setTime] = (0,
|
|
10698
|
+
const [value, setValue] = props.value || (0, import_react17.useState)(getValue(initialValue || [], min, max));
|
|
10699
|
+
const [invalid, setInvalid] = props.invalid || (0, import_react17.useState)([false, false]);
|
|
10700
|
+
const [time, setTime] = (0, import_react17.useState)(() => {
|
|
10627
10701
|
return value.map(getTimeFromDate);
|
|
10628
10702
|
});
|
|
10629
|
-
const [calendar1, _setCalendar1] = (0,
|
|
10703
|
+
const [calendar1, _setCalendar1] = (0, import_react17.useState)(() => {
|
|
10630
10704
|
const calendar12 = getInitialCalendar(value[0] || initialMonth, min, max);
|
|
10631
10705
|
return calendar12;
|
|
10632
10706
|
});
|
|
@@ -10636,7 +10710,7 @@ var Main2 = import_react15.default.forwardRef(
|
|
|
10636
10710
|
return newv.month === prev.month && newv.year === prev.year ? prev : newv;
|
|
10637
10711
|
});
|
|
10638
10712
|
};
|
|
10639
|
-
const [calendar2, _setCalendar2] = (0,
|
|
10713
|
+
const [calendar2, _setCalendar2] = (0, import_react17.useState)(() => {
|
|
10640
10714
|
const calendar22 = getCalendar2(calendar1);
|
|
10641
10715
|
return calendar22;
|
|
10642
10716
|
});
|
|
@@ -10646,14 +10720,14 @@ var Main2 = import_react15.default.forwardRef(
|
|
|
10646
10720
|
return newv.month === prev.month && newv.year === prev.year ? prev : newv;
|
|
10647
10721
|
});
|
|
10648
10722
|
};
|
|
10649
|
-
const [hoverDay, setHoverDay] = (0,
|
|
10650
|
-
(0,
|
|
10723
|
+
const [hoverDay, setHoverDay] = (0, import_react17.useState)(null);
|
|
10724
|
+
(0, import_react17.useEffect)(() => {
|
|
10651
10725
|
const calendar12 = getInitialCalendar(value[0] || initialMonth, min, max);
|
|
10652
10726
|
const calendar22 = getCalendar2(calendar12);
|
|
10653
10727
|
setCalendar1(calendar12);
|
|
10654
10728
|
setCalendar2(calendar22);
|
|
10655
10729
|
}, [initialMonth?.toISOString(), min?.toISOString(), max?.toISOString()]);
|
|
10656
|
-
(0,
|
|
10730
|
+
(0, import_react17.useEffect)(() => {
|
|
10657
10731
|
const timeProps = getTimeProps(props.time, value);
|
|
10658
10732
|
setHoverDay(null);
|
|
10659
10733
|
if (value[0]) {
|
|
@@ -10847,7 +10921,7 @@ var Main_default2 = Main2;
|
|
|
10847
10921
|
|
|
10848
10922
|
// src/components/Calendar/components/Interval/index.tsx
|
|
10849
10923
|
var import_jsx_runtime306 = require("react/jsx-runtime");
|
|
10850
|
-
var CalendarInterval =
|
|
10924
|
+
var CalendarInterval = import_react18.default.forwardRef(
|
|
10851
10925
|
(props, ref) => {
|
|
10852
10926
|
const containerProps = filterObject(props, [
|
|
10853
10927
|
"initialMonth",
|
|
@@ -10881,15 +10955,15 @@ CalendarInterval.displayName = "CalendarInterval";
|
|
|
10881
10955
|
var Interval_default = CalendarInterval;
|
|
10882
10956
|
|
|
10883
10957
|
// src/components/Calendar/components/Single/index.tsx
|
|
10884
|
-
var
|
|
10958
|
+
var import_react20 = __toESM(require("react"));
|
|
10885
10959
|
|
|
10886
10960
|
// src/components/Calendar/components/Single/components/Main/index.tsx
|
|
10887
|
-
var
|
|
10961
|
+
var import_react19 = __toESM(require("react"));
|
|
10888
10962
|
var import_jsx_runtime307 = require("react/jsx-runtime");
|
|
10889
|
-
var SingleCalendar =
|
|
10963
|
+
var SingleCalendar = import_react19.default.forwardRef(
|
|
10890
10964
|
(props, ref) => {
|
|
10891
10965
|
const { initialValue, min, max } = props;
|
|
10892
|
-
const [value, setValue] = props.value || (0,
|
|
10966
|
+
const [value, setValue] = props.value || (0, import_react19.useState)(
|
|
10893
10967
|
initialValue && !isNaN(initialValue.getTime()) && isDateBetween(initialValue, min, max) ? initialValue : null
|
|
10894
10968
|
);
|
|
10895
10969
|
const timeProps = (() => {
|
|
@@ -10897,9 +10971,9 @@ var SingleCalendar = import_react17.default.forwardRef(
|
|
|
10897
10971
|
if (typeof props.time === "function") return props.time(value);
|
|
10898
10972
|
return props.time;
|
|
10899
10973
|
})();
|
|
10900
|
-
const [invalid, setInvalid] = props.invalid || (0,
|
|
10901
|
-
const [time, setTime] = (0,
|
|
10902
|
-
(0,
|
|
10974
|
+
const [invalid, setInvalid] = props.invalid || (0, import_react19.useState)(false);
|
|
10975
|
+
const [time, setTime] = (0, import_react19.useState)(getTimeFromDate(value));
|
|
10976
|
+
(0, import_react19.useEffect)(() => {
|
|
10903
10977
|
setInvalid(isInvalid(value, time, timeProps, min, max));
|
|
10904
10978
|
}, [value, time, timeProps]);
|
|
10905
10979
|
const _getDay = props.getDay || (() => ({}));
|
|
@@ -10969,7 +11043,7 @@ var Main_default3 = SingleCalendar;
|
|
|
10969
11043
|
|
|
10970
11044
|
// src/components/Calendar/components/Single/index.tsx
|
|
10971
11045
|
var import_jsx_runtime308 = require("react/jsx-runtime");
|
|
10972
|
-
var CalendarSingle =
|
|
11046
|
+
var CalendarSingle = import_react20.default.forwardRef(
|
|
10973
11047
|
(props, ref) => {
|
|
10974
11048
|
const containerProps = filterObject(props, [
|
|
10975
11049
|
"initialMonth",
|
|
@@ -11007,7 +11081,7 @@ var Single_default = CalendarSingle;
|
|
|
11007
11081
|
|
|
11008
11082
|
// src/components/Calendar/index.tsx
|
|
11009
11083
|
var import_jsx_runtime309 = require("react/jsx-runtime");
|
|
11010
|
-
var Calendar =
|
|
11084
|
+
var Calendar = import_react21.default.forwardRef(
|
|
11011
11085
|
(props, ref) => {
|
|
11012
11086
|
switch (props.type) {
|
|
11013
11087
|
case "basic": {
|
|
@@ -11035,21 +11109,21 @@ var Container7 = import_styled_components20.default.div`
|
|
|
11035
11109
|
border-left-width: 5px;
|
|
11036
11110
|
padding: 14px;
|
|
11037
11111
|
|
|
11038
|
-
${({ $size:
|
|
11112
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components20.css`
|
|
11039
11113
|
width: 394px;
|
|
11040
11114
|
height: 99px;
|
|
11041
11115
|
`}
|
|
11042
11116
|
|
|
11043
|
-
${({ $size:
|
|
11117
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components20.css`
|
|
11044
11118
|
width: 394px;
|
|
11045
11119
|
height: 131px;
|
|
11046
11120
|
`}
|
|
11047
11121
|
|
|
11048
|
-
${({ $size:
|
|
11122
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components20.css`
|
|
11049
11123
|
width: 394px;
|
|
11050
11124
|
`}
|
|
11051
11125
|
|
|
11052
|
-
${({ $size:
|
|
11126
|
+
${({ $size: size4 }) => size4 === "big" && import_styled_components20.css`
|
|
11053
11127
|
width: 414px;
|
|
11054
11128
|
height: 324px;
|
|
11055
11129
|
`}
|
|
@@ -11077,13 +11151,13 @@ var Container7 = import_styled_components20.default.div`
|
|
|
11077
11151
|
|
|
11078
11152
|
// src/components/Card/index.tsx
|
|
11079
11153
|
var import_jsx_runtime310 = require("react/jsx-runtime");
|
|
11080
|
-
var Card = ({ borderType, size:
|
|
11081
|
-
return /* @__PURE__ */ (0, import_jsx_runtime310.jsx)(Container7, { $borderType: borderType, $size:
|
|
11154
|
+
var Card = ({ borderType, size: size4, ...rest }) => {
|
|
11155
|
+
return /* @__PURE__ */ (0, import_jsx_runtime310.jsx)(Container7, { $borderType: borderType, $size: size4, ...rest });
|
|
11082
11156
|
};
|
|
11083
11157
|
var Card_default = Card;
|
|
11084
11158
|
|
|
11085
11159
|
// src/components/Filters/Button/index.tsx
|
|
11086
|
-
var
|
|
11160
|
+
var import_react22 = require("react");
|
|
11087
11161
|
|
|
11088
11162
|
// src/components/Filters/Button/styles.ts
|
|
11089
11163
|
var import_styled_components21 = __toESM(require("styled-components"));
|
|
@@ -11110,11 +11184,11 @@ var Container8 = import_styled_components21.default.div`
|
|
|
11110
11184
|
var import_jsx_runtime311 = require("react/jsx-runtime");
|
|
11111
11185
|
var Button3 = (props) => {
|
|
11112
11186
|
const { getContent } = props;
|
|
11113
|
-
const [open, setOpen] = (0,
|
|
11187
|
+
const [open, setOpen] = (0, import_react22.useState)(false);
|
|
11114
11188
|
const close = () => setOpen(false);
|
|
11115
11189
|
const onClick = props.disabled ? void 0 : () => setOpen((prev) => !prev);
|
|
11116
11190
|
const buttonProps = filterObject(props, ["getContent", "gap"]);
|
|
11117
|
-
return /* @__PURE__ */ (0, import_jsx_runtime311.jsxs)("div", { ref:
|
|
11191
|
+
return /* @__PURE__ */ (0, import_jsx_runtime311.jsxs)("div", { ref: useOnClickOut_default(close), children: [
|
|
11118
11192
|
/* @__PURE__ */ (0, import_jsx_runtime311.jsxs)(Container8, { ...buttonProps, ...{ onClick }, $gap: props.gap, children: [
|
|
11119
11193
|
props.children,
|
|
11120
11194
|
/* @__PURE__ */ (0, import_jsx_runtime311.jsx)(
|
|
@@ -11132,13 +11206,13 @@ var Button3 = (props) => {
|
|
|
11132
11206
|
var Button_default2 = Button3;
|
|
11133
11207
|
|
|
11134
11208
|
// src/components/Filters/AppliedFilters/components/Menu/index.tsx
|
|
11135
|
-
var
|
|
11209
|
+
var import_react44 = require("react");
|
|
11136
11210
|
|
|
11137
11211
|
// src/components/Input/index.tsx
|
|
11138
|
-
var
|
|
11212
|
+
var import_react43 = __toESM(require("react"));
|
|
11139
11213
|
|
|
11140
11214
|
// src/components/Input/components/Checkbox/index.tsx
|
|
11141
|
-
var
|
|
11215
|
+
var import_react23 = __toESM(require("react"));
|
|
11142
11216
|
|
|
11143
11217
|
// src/components/Input/components/Checkbox/styles.ts
|
|
11144
11218
|
var import_styled_components22 = __toESM(require("styled-components"));
|
|
@@ -11339,7 +11413,7 @@ var DefaultLabel = (props) => {
|
|
|
11339
11413
|
}
|
|
11340
11414
|
);
|
|
11341
11415
|
};
|
|
11342
|
-
var Checkbox =
|
|
11416
|
+
var Checkbox = import_react23.default.forwardRef(
|
|
11343
11417
|
(props, ref) => {
|
|
11344
11418
|
const { padding, bordered } = props;
|
|
11345
11419
|
const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
|
|
@@ -11401,7 +11475,7 @@ Checkbox.displayName = "Checkbox";
|
|
|
11401
11475
|
var Checkbox_default = Checkbox;
|
|
11402
11476
|
|
|
11403
11477
|
// src/components/Input/components/Date/index.tsx
|
|
11404
|
-
var
|
|
11478
|
+
var import_react24 = __toESM(require("react"));
|
|
11405
11479
|
|
|
11406
11480
|
// src/components/Input/components/Date/functions.ts
|
|
11407
11481
|
var JSDate = Date;
|
|
@@ -11463,12 +11537,12 @@ var mask2 = (v) => {
|
|
|
11463
11537
|
else if (v.length < 5) return v.substring(0, 2) + "/" + v.substring(2);
|
|
11464
11538
|
else return v.substring(0, 2) + "/" + v.substring(2, 4) + "/" + v.substring(4);
|
|
11465
11539
|
};
|
|
11466
|
-
var Date2 =
|
|
11540
|
+
var Date2 = import_react24.default.forwardRef(
|
|
11467
11541
|
(props, ref) => {
|
|
11468
11542
|
const { picker, value, min, max } = props;
|
|
11469
11543
|
const setValue = props.setValue || (() => {
|
|
11470
11544
|
});
|
|
11471
|
-
const [open, setOpen] = (0,
|
|
11545
|
+
const [open, setOpen] = (0, import_react24.useState)(false);
|
|
11472
11546
|
const _onKeyDown = props.onKeyDown || (() => {
|
|
11473
11547
|
});
|
|
11474
11548
|
const onKeyDown = (event) => {
|
|
@@ -11513,7 +11587,7 @@ var Date2 = import_react22.default.forwardRef(
|
|
|
11513
11587
|
"min",
|
|
11514
11588
|
"max"
|
|
11515
11589
|
]);
|
|
11516
|
-
return /* @__PURE__ */ (0, import_jsx_runtime313.jsxs)(RelativeContainer2, { ref:
|
|
11590
|
+
return /* @__PURE__ */ (0, import_jsx_runtime313.jsxs)(RelativeContainer2, { ref: useOnClickOut_default(() => setOpen(false)), children: [
|
|
11517
11591
|
/* @__PURE__ */ (0, import_jsx_runtime313.jsx)(
|
|
11518
11592
|
Input_default,
|
|
11519
11593
|
{
|
|
@@ -11554,7 +11628,7 @@ Date2.displayName = "Date";
|
|
|
11554
11628
|
var Date_default = Date2;
|
|
11555
11629
|
|
|
11556
11630
|
// src/components/Input/components/DateIntervalPicker/index.tsx
|
|
11557
|
-
var
|
|
11631
|
+
var import_react25 = __toESM(require("react"));
|
|
11558
11632
|
|
|
11559
11633
|
// src/components/Input/components/DateIntervalPicker/functions.ts
|
|
11560
11634
|
var validate = ([start, end], min, max) => {
|
|
@@ -11841,12 +11915,12 @@ var LabelText2 = import_styled_components24.default.label`
|
|
|
11841
11915
|
|
|
11842
11916
|
// src/components/Input/components/DateIntervalPicker/index.tsx
|
|
11843
11917
|
var import_jsx_runtime314 = require("react/jsx-runtime");
|
|
11844
|
-
var Component =
|
|
11918
|
+
var Component = import_react25.default.forwardRef(
|
|
11845
11919
|
(props, ref) => {
|
|
11846
11920
|
const center = props.center || { x: 50, y: 50 };
|
|
11847
11921
|
const value = parse(props.value);
|
|
11848
|
-
const [open, setOpen] = (0,
|
|
11849
|
-
const [intervalType, setIntervalType] = (0,
|
|
11922
|
+
const [open, setOpen] = (0, import_react25.useState)(null);
|
|
11923
|
+
const [intervalType, setIntervalType] = (0, import_react25.useState)(
|
|
11850
11924
|
props.only || "day"
|
|
11851
11925
|
);
|
|
11852
11926
|
const config = intervalTypes[intervalType];
|
|
@@ -11857,7 +11931,7 @@ var Component = import_react23.default.forwardRef(
|
|
|
11857
11931
|
);
|
|
11858
11932
|
props.setValue(parsed);
|
|
11859
11933
|
};
|
|
11860
|
-
(0,
|
|
11934
|
+
(0, import_react25.useEffect)(() => {
|
|
11861
11935
|
if (props.min && props.max && props.min > props.max) {
|
|
11862
11936
|
throw Error("Min prop must be less than Max");
|
|
11863
11937
|
}
|
|
@@ -11922,7 +11996,7 @@ var Component = import_react23.default.forwardRef(
|
|
|
11922
11996
|
return /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(
|
|
11923
11997
|
RelativeContainer3,
|
|
11924
11998
|
{
|
|
11925
|
-
ref:
|
|
11999
|
+
ref: useOnClickOut_default(() => setOpen(null)),
|
|
11926
12000
|
$invalid: invalid,
|
|
11927
12001
|
children: [
|
|
11928
12002
|
props.label ? /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(LabelText2, { $required: props.required, children: [
|
|
@@ -11942,7 +12016,7 @@ var Component = import_react23.default.forwardRef(
|
|
|
11942
12016
|
if (intervalType === "custom") return label;
|
|
11943
12017
|
const incrementProps = getArrowProps("increment");
|
|
11944
12018
|
const decrementProps = getArrowProps("decrement");
|
|
11945
|
-
return /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(
|
|
12019
|
+
return /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(import_react25.default.Fragment, { children: [
|
|
11946
12020
|
/* @__PURE__ */ (0, import_jsx_runtime314.jsx)(
|
|
11947
12021
|
Button4,
|
|
11948
12022
|
{
|
|
@@ -12071,7 +12145,7 @@ var DatePicker = Object.assign(Component, {
|
|
|
12071
12145
|
var DateIntervalPicker_default = DatePicker;
|
|
12072
12146
|
|
|
12073
12147
|
// src/components/Input/components/DatePicker/index.tsx
|
|
12074
|
-
var
|
|
12148
|
+
var import_react26 = __toESM(require("react"));
|
|
12075
12149
|
|
|
12076
12150
|
// src/components/Input/components/DatePicker/styles.ts
|
|
12077
12151
|
var import_styled_components25 = __toESM(require("styled-components"));
|
|
@@ -12148,13 +12222,13 @@ var Button5 = import_styled_components25.default.button`
|
|
|
12148
12222
|
|
|
12149
12223
|
// src/components/Input/components/DatePicker/index.tsx
|
|
12150
12224
|
var import_jsx_runtime315 = require("react/jsx-runtime");
|
|
12151
|
-
var DatePicker2 =
|
|
12225
|
+
var DatePicker2 = import_react26.default.forwardRef(
|
|
12152
12226
|
(props, ref) => {
|
|
12153
12227
|
const { picker, value, setValue, min, max } = props;
|
|
12154
12228
|
const disabled = props.disabled || props.loading;
|
|
12155
12229
|
const today = dateToIsoString(/* @__PURE__ */ new Date());
|
|
12156
|
-
const [open, setOpen] = (0,
|
|
12157
|
-
(0,
|
|
12230
|
+
const [open, setOpen] = (0, import_react26.useState)(false);
|
|
12231
|
+
(0, import_react26.useEffect)(() => {
|
|
12158
12232
|
const date = isoStringToDate(value);
|
|
12159
12233
|
if (!date) {
|
|
12160
12234
|
setValue(dateToIsoString(getMiddle(min, max)));
|
|
@@ -12186,7 +12260,7 @@ var DatePicker2 = import_react24.default.forwardRef(
|
|
|
12186
12260
|
"min",
|
|
12187
12261
|
"max"
|
|
12188
12262
|
]);
|
|
12189
|
-
return /* @__PURE__ */ (0, import_jsx_runtime315.jsxs)(RelativeContainer4, { ref:
|
|
12263
|
+
return /* @__PURE__ */ (0, import_jsx_runtime315.jsxs)(RelativeContainer4, { ref: useOnClickOut_default(() => setOpen(false)), children: [
|
|
12190
12264
|
/* @__PURE__ */ (0, import_jsx_runtime315.jsx)(Input_default, { ...inputProps, type: "text", icon, ref, htmlDisabled: true }),
|
|
12191
12265
|
/* @__PURE__ */ (0, import_jsx_runtime315.jsxs)(
|
|
12192
12266
|
Container10,
|
|
@@ -12273,7 +12347,7 @@ DatePicker2.displayName = "DatePicker";
|
|
|
12273
12347
|
var DatePicker_default = DatePicker2;
|
|
12274
12348
|
|
|
12275
12349
|
// src/components/Input/components/DateTime/index.tsx
|
|
12276
|
-
var
|
|
12350
|
+
var import_react27 = __toESM(require("react"));
|
|
12277
12351
|
|
|
12278
12352
|
// src/components/Input/components/DateTime/styles.ts
|
|
12279
12353
|
var import_styled_components26 = __toESM(require("styled-components"));
|
|
@@ -12434,13 +12508,13 @@ var steps = {
|
|
|
12434
12508
|
}
|
|
12435
12509
|
}
|
|
12436
12510
|
};
|
|
12437
|
-
var DateTime =
|
|
12511
|
+
var DateTime = import_react27.default.forwardRef(
|
|
12438
12512
|
(props, ref) => {
|
|
12439
12513
|
const { picker, value, min, max } = props;
|
|
12440
12514
|
const step = steps[props.step || "day"];
|
|
12441
12515
|
const setValue = props.setValue || (() => {
|
|
12442
12516
|
});
|
|
12443
|
-
const [open, setOpen] = (0,
|
|
12517
|
+
const [open, setOpen] = (0, import_react27.useState)(false);
|
|
12444
12518
|
const _onKeyDown = props.onKeyDown || (() => {
|
|
12445
12519
|
});
|
|
12446
12520
|
const onKeyDown = (event) => {
|
|
@@ -12518,7 +12592,7 @@ var DateTime = import_react25.default.forwardRef(
|
|
|
12518
12592
|
"min",
|
|
12519
12593
|
"max"
|
|
12520
12594
|
]);
|
|
12521
|
-
return /* @__PURE__ */ (0, import_jsx_runtime316.jsxs)(RelativeContainer5, { ref:
|
|
12595
|
+
return /* @__PURE__ */ (0, import_jsx_runtime316.jsxs)(RelativeContainer5, { ref: useOnClickOut_default(() => setOpen(false)), children: [
|
|
12522
12596
|
/* @__PURE__ */ (0, import_jsx_runtime316.jsx)(
|
|
12523
12597
|
Input_default,
|
|
12524
12598
|
{
|
|
@@ -12561,11 +12635,11 @@ DateTime.displayName = "DateTime";
|
|
|
12561
12635
|
var DateTime_default = DateTime;
|
|
12562
12636
|
|
|
12563
12637
|
// src/components/Input/components/Password/index.tsx
|
|
12564
|
-
var
|
|
12638
|
+
var import_react28 = __toESM(require("react"));
|
|
12565
12639
|
var import_jsx_runtime317 = require("react/jsx-runtime");
|
|
12566
|
-
var Password =
|
|
12640
|
+
var Password = import_react28.default.forwardRef(
|
|
12567
12641
|
(props, ref) => {
|
|
12568
|
-
const [visibility, setVisibility] = (0,
|
|
12642
|
+
const [visibility, setVisibility] = (0, import_react28.useState)("hidden");
|
|
12569
12643
|
const icons2 = {
|
|
12570
12644
|
visible: {
|
|
12571
12645
|
icon: "eye_off",
|
|
@@ -12600,7 +12674,7 @@ Password.displayName = "Password";
|
|
|
12600
12674
|
var Password_default = Password;
|
|
12601
12675
|
|
|
12602
12676
|
// src/components/Input/components/Phone/index.tsx
|
|
12603
|
-
var
|
|
12677
|
+
var import_react29 = __toESM(require("react"));
|
|
12604
12678
|
|
|
12605
12679
|
// src/assets/icons/flags/index.ts
|
|
12606
12680
|
var import_styled_components27 = __toESM(require("styled-components"));
|
|
@@ -12885,17 +12959,17 @@ var Button6 = (props) => {
|
|
|
12885
12959
|
}
|
|
12886
12960
|
);
|
|
12887
12961
|
};
|
|
12888
|
-
var Component2 =
|
|
12962
|
+
var Component2 = import_react29.default.forwardRef(
|
|
12889
12963
|
(props, ref) => {
|
|
12890
12964
|
const { value, setValue } = props;
|
|
12891
|
-
const [inputValue, setInputValue] = (0,
|
|
12965
|
+
const [inputValue, setInputValue] = (0, import_react29.useState)(
|
|
12892
12966
|
!value ? "" : () => {
|
|
12893
12967
|
const details = getPhoneDetails(value);
|
|
12894
12968
|
return details ? details.masked : value;
|
|
12895
12969
|
}
|
|
12896
12970
|
);
|
|
12897
|
-
const [country, setCountry] = (0,
|
|
12898
|
-
const [open, setOpen] = (0,
|
|
12971
|
+
const [country, setCountry] = (0, import_react29.useState)(countries_default.br);
|
|
12972
|
+
const [open, setOpen] = (0, import_react29.useState)(false);
|
|
12899
12973
|
const options = Object.keys(countries_default).map((iso) => ({
|
|
12900
12974
|
label: (option) => {
|
|
12901
12975
|
const country2 = option.data;
|
|
@@ -12919,7 +12993,7 @@ var Component2 = import_react27.default.forwardRef(
|
|
|
12919
12993
|
if (country.mask) value2 = country.mask(value2);
|
|
12920
12994
|
return value2;
|
|
12921
12995
|
};
|
|
12922
|
-
(0,
|
|
12996
|
+
(0, import_react29.useEffect)(() => {
|
|
12923
12997
|
if (!value) {
|
|
12924
12998
|
setInputValue("");
|
|
12925
12999
|
return;
|
|
@@ -12933,10 +13007,10 @@ var Component2 = import_react27.default.forwardRef(
|
|
|
12933
13007
|
setInputValue(value);
|
|
12934
13008
|
}
|
|
12935
13009
|
}, [value]);
|
|
12936
|
-
(0,
|
|
13010
|
+
(0, import_react29.useEffect)(() => {
|
|
12937
13011
|
setInputValue((prev) => mask4(prev));
|
|
12938
13012
|
}, [country]);
|
|
12939
|
-
(0,
|
|
13013
|
+
(0, import_react29.useEffect)(() => {
|
|
12940
13014
|
const v = inputValue.replace(/\D+/g, "").substring(0, country.charLimit);
|
|
12941
13015
|
setValue(v ? `${country.ddi} ${v}` : v);
|
|
12942
13016
|
}, [inputValue]);
|
|
@@ -12944,7 +13018,7 @@ var Component2 = import_react27.default.forwardRef(
|
|
|
12944
13018
|
return /* @__PURE__ */ (0, import_jsx_runtime318.jsxs)(
|
|
12945
13019
|
RelativeContainer6,
|
|
12946
13020
|
{
|
|
12947
|
-
ref:
|
|
13021
|
+
ref: useOnClickOut_default(() => setOpen(false)),
|
|
12948
13022
|
children: [
|
|
12949
13023
|
/* @__PURE__ */ (0, import_jsx_runtime318.jsx)(
|
|
12950
13024
|
Input_default,
|
|
@@ -13137,7 +13211,7 @@ var RadioButton = (props) => {
|
|
|
13137
13211
|
var RadioButton_default = RadioButton;
|
|
13138
13212
|
|
|
13139
13213
|
// src/components/Input/components/Range/index.tsx
|
|
13140
|
-
var
|
|
13214
|
+
var import_react30 = __toESM(require("react"));
|
|
13141
13215
|
|
|
13142
13216
|
// src/components/Input/components/Range/styles/Input/index.ts
|
|
13143
13217
|
var import_styled_components30 = __toESM(require("styled-components"));
|
|
@@ -13572,18 +13646,18 @@ var getMarkerLeft = (markers, range, index, value, min, strict) => {
|
|
|
13572
13646
|
const left = `calc(${p}% - 10px - ${x}px)`;
|
|
13573
13647
|
return left;
|
|
13574
13648
|
};
|
|
13575
|
-
var getLeftCalc = (
|
|
13649
|
+
var getLeftCalc = (size4, bullet2, value, min, max) => {
|
|
13576
13650
|
const percent = (value - min) * 100 / (max - min);
|
|
13577
|
-
const calc = `calc(${percent}% - ${bullet2 * percent / 100}px + ${(bullet2 -
|
|
13651
|
+
const calc = `calc(${percent}% - ${bullet2 * percent / 100}px + ${(bullet2 - size4) / 2}px)`;
|
|
13578
13652
|
return calc;
|
|
13579
13653
|
};
|
|
13580
|
-
var getBarLeft = (
|
|
13581
|
-
return `min(max(${calc}, 0%), calc(100% - ${
|
|
13654
|
+
var getBarLeft = (size4, calc) => {
|
|
13655
|
+
return `min(max(${calc}, 0%), calc(100% - ${size4}px))`;
|
|
13582
13656
|
};
|
|
13583
|
-
var getIndicatorLeft = (
|
|
13584
|
-
return `min(max(${calc}, calc(0% - ${
|
|
13657
|
+
var getIndicatorLeft = (size4, calc) => {
|
|
13658
|
+
return `min(max(${calc}, calc(0% - ${size4}px)), calc(100% - ${size4}px))`;
|
|
13585
13659
|
};
|
|
13586
|
-
var Range =
|
|
13660
|
+
var Range = import_react30.default.forwardRef(
|
|
13587
13661
|
(props, ref) => {
|
|
13588
13662
|
const { label, minLabel, maxLabel, width, setValue, hideNavbar } = props;
|
|
13589
13663
|
const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
|
|
@@ -13793,10 +13867,10 @@ Range.displayName = "input";
|
|
|
13793
13867
|
var Range_default = Range;
|
|
13794
13868
|
|
|
13795
13869
|
// src/components/Input/components/Select/index.tsx
|
|
13796
|
-
var
|
|
13870
|
+
var import_react39 = __toESM(require("react"));
|
|
13797
13871
|
|
|
13798
13872
|
// src/components/Input/components/Select/hooks/Select/index.tsx
|
|
13799
|
-
var
|
|
13873
|
+
var import_react34 = __toESM(require("react"));
|
|
13800
13874
|
|
|
13801
13875
|
// src/components/Input/components/Select/styles.ts
|
|
13802
13876
|
var import_styled_components41 = __toESM(require("styled-components"));
|
|
@@ -13824,7 +13898,7 @@ var HiddenInput = import_styled_components41.default.input`
|
|
|
13824
13898
|
`;
|
|
13825
13899
|
|
|
13826
13900
|
// src/components/Input/components/Select/hooks/Navigation/index.ts
|
|
13827
|
-
var
|
|
13901
|
+
var import_react31 = require("react");
|
|
13828
13902
|
var isAvailable = (index, option) => {
|
|
13829
13903
|
return !option.disabled && !(option.rules || []).some((rule) => rule(index, option.data) !== true);
|
|
13830
13904
|
};
|
|
@@ -13834,7 +13908,7 @@ var useNavigation = (props) => {
|
|
|
13834
13908
|
options,
|
|
13835
13909
|
onSelectHighlight
|
|
13836
13910
|
} = props;
|
|
13837
|
-
const onKeyDown = (0,
|
|
13911
|
+
const onKeyDown = (0, import_react31.useCallback)(
|
|
13838
13912
|
(e) => {
|
|
13839
13913
|
if (e.key === "ArrowDown") {
|
|
13840
13914
|
e.preventDefault();
|
|
@@ -13883,12 +13957,12 @@ var useNavigation = (props) => {
|
|
|
13883
13957
|
var Navigation_default2 = useNavigation;
|
|
13884
13958
|
|
|
13885
13959
|
// src/components/Input/components/Select/hooks/Select/components/Header/index.tsx
|
|
13886
|
-
var
|
|
13960
|
+
var import_react33 = __toESM(require("react"));
|
|
13887
13961
|
|
|
13888
13962
|
// src/components/Input/components/Select/hooks/Select/context.ts
|
|
13889
|
-
var
|
|
13890
|
-
var Provider3 =
|
|
13891
|
-
var useContext2 = () =>
|
|
13963
|
+
var import_react32 = __toESM(require("react"));
|
|
13964
|
+
var Provider3 = import_react32.default.createContext({});
|
|
13965
|
+
var useContext2 = () => import_react32.default.useContext(Provider3);
|
|
13892
13966
|
var context_default2 = Provider3;
|
|
13893
13967
|
|
|
13894
13968
|
// src/components/Input/components/Select/hooks/Select/components/Header/styles.ts
|
|
@@ -13904,7 +13978,7 @@ var import_jsx_runtime321 = require("react/jsx-runtime");
|
|
|
13904
13978
|
var Header2 = () => {
|
|
13905
13979
|
const context = useContext2();
|
|
13906
13980
|
if (!context.props.search) {
|
|
13907
|
-
return /* @__PURE__ */ (0, import_jsx_runtime321.jsx)(
|
|
13981
|
+
return /* @__PURE__ */ (0, import_jsx_runtime321.jsx)(import_react33.default.Fragment, {});
|
|
13908
13982
|
}
|
|
13909
13983
|
const {
|
|
13910
13984
|
searchInput: [searchInput, setSearchInput]
|
|
@@ -13997,7 +14071,7 @@ var useSelect = (props, [highlight, setHighlight], [options, setOptions], setOpe
|
|
|
13997
14071
|
onReset,
|
|
13998
14072
|
menu: {
|
|
13999
14073
|
itemSpacing: "s3",
|
|
14000
|
-
before: /* @__PURE__ */ (0, import_jsx_runtime322.jsxs)(
|
|
14074
|
+
before: /* @__PURE__ */ (0, import_jsx_runtime322.jsxs)(import_react34.default.Fragment, { children: [
|
|
14001
14075
|
/* @__PURE__ */ (0, import_jsx_runtime322.jsx)(Header_default, {}),
|
|
14002
14076
|
/* @__PURE__ */ (0, import_jsx_runtime322.jsx)(
|
|
14003
14077
|
HiddenInput,
|
|
@@ -14028,15 +14102,15 @@ var useSelect = (props, [highlight, setHighlight], [options, setOptions], setOpe
|
|
|
14028
14102
|
var Select_default = useSelect;
|
|
14029
14103
|
|
|
14030
14104
|
// src/components/Input/components/Select/hooks/SelectMultiple/index.tsx
|
|
14031
|
-
var
|
|
14105
|
+
var import_react38 = __toESM(require("react"));
|
|
14032
14106
|
|
|
14033
14107
|
// src/components/Input/components/Select/hooks/SelectMultiple/components/Footer/index.tsx
|
|
14034
|
-
var
|
|
14108
|
+
var import_react36 = __toESM(require("react"));
|
|
14035
14109
|
|
|
14036
14110
|
// src/components/Input/components/Select/hooks/SelectMultiple/context.ts
|
|
14037
|
-
var
|
|
14038
|
-
var Provider4 =
|
|
14039
|
-
var useContext3 = () =>
|
|
14111
|
+
var import_react35 = __toESM(require("react"));
|
|
14112
|
+
var Provider4 = import_react35.default.createContext({});
|
|
14113
|
+
var useContext3 = () => import_react35.default.useContext(Provider4);
|
|
14040
14114
|
var context_default3 = Provider4;
|
|
14041
14115
|
|
|
14042
14116
|
// src/components/Input/components/Select/hooks/SelectMultiple/components/Footer/index.tsx
|
|
@@ -14066,7 +14140,7 @@ var Footer2 = () => {
|
|
|
14066
14140
|
setValue(value2, data);
|
|
14067
14141
|
setOpen(false);
|
|
14068
14142
|
};
|
|
14069
|
-
return /* @__PURE__ */ (0, import_jsx_runtime323.jsxs)(
|
|
14143
|
+
return /* @__PURE__ */ (0, import_jsx_runtime323.jsxs)(import_react36.default.Fragment, { children: [
|
|
14070
14144
|
error && /* @__PURE__ */ (0, import_jsx_runtime323.jsx)(
|
|
14071
14145
|
"span",
|
|
14072
14146
|
{
|
|
@@ -14094,14 +14168,14 @@ var Footer2 = () => {
|
|
|
14094
14168
|
var Footer_default = Footer2;
|
|
14095
14169
|
|
|
14096
14170
|
// src/components/Input/components/Select/hooks/SelectMultiple/components/Header/index.tsx
|
|
14097
|
-
var
|
|
14171
|
+
var import_react37 = __toESM(require("react"));
|
|
14098
14172
|
|
|
14099
14173
|
// src/components/Link/index.tsx
|
|
14100
14174
|
var import_styled_components43 = __toESM(require("styled-components"));
|
|
14101
14175
|
var import_jsx_runtime324 = require("react/jsx-runtime");
|
|
14102
14176
|
var Container11 = import_styled_components43.default.div`
|
|
14103
|
-
${({ $size:
|
|
14104
|
-
const { fontSize, lineHeight } = sizes[
|
|
14177
|
+
${({ $size: size4 }) => {
|
|
14178
|
+
const { fontSize, lineHeight } = sizes[size4 || "small"];
|
|
14105
14179
|
return import_styled_components43.css`
|
|
14106
14180
|
font-size: ${fontSize};
|
|
14107
14181
|
line-height: ${lineHeight};
|
|
@@ -14129,12 +14203,12 @@ var Container11 = import_styled_components43.default.div`
|
|
|
14129
14203
|
` : null;
|
|
14130
14204
|
}}
|
|
14131
14205
|
`;
|
|
14132
|
-
var Link = ({ size:
|
|
14206
|
+
var Link = ({ size: size4, colorSetting, disabled, ...props }) => {
|
|
14133
14207
|
return /* @__PURE__ */ (0, import_jsx_runtime324.jsx)(
|
|
14134
14208
|
Container11,
|
|
14135
14209
|
{
|
|
14136
14210
|
...props,
|
|
14137
|
-
$size:
|
|
14211
|
+
$size: size4,
|
|
14138
14212
|
$colorSetting: colorSetting,
|
|
14139
14213
|
$disabled: disabled
|
|
14140
14214
|
}
|
|
@@ -14205,7 +14279,7 @@ var CheckAll = () => {
|
|
|
14205
14279
|
var Header3 = () => {
|
|
14206
14280
|
const context = useContext3();
|
|
14207
14281
|
if (!context.props.search) {
|
|
14208
|
-
return /* @__PURE__ */ (0, import_jsx_runtime325.jsx)(
|
|
14282
|
+
return /* @__PURE__ */ (0, import_jsx_runtime325.jsx)(import_react37.default.Fragment, {});
|
|
14209
14283
|
}
|
|
14210
14284
|
const {
|
|
14211
14285
|
searchInput: [searchInput, setSearchInput],
|
|
@@ -14342,12 +14416,12 @@ var parseValue = (value) => {
|
|
|
14342
14416
|
};
|
|
14343
14417
|
var useSelectMultiple = (props, [highlight, setHighlight], [options, setOptions]) => {
|
|
14344
14418
|
const initial = parseValue(props.value);
|
|
14345
|
-
const [checked, setChecked] = (0,
|
|
14419
|
+
const [checked, setChecked] = (0, import_react38.useState)([
|
|
14346
14420
|
...initial
|
|
14347
14421
|
]);
|
|
14348
14422
|
const limits = resolveLimits(props.minSelected, props.maxSelected);
|
|
14349
14423
|
const { max, enabled } = limits;
|
|
14350
|
-
(0,
|
|
14424
|
+
(0, import_react38.useEffect)(() => {
|
|
14351
14425
|
if (limits.error) {
|
|
14352
14426
|
console.error(`[SelectMultiple]: ${limits.error}`);
|
|
14353
14427
|
}
|
|
@@ -14387,7 +14461,7 @@ var useSelectMultiple = (props, [highlight, setHighlight], [options, setOptions]
|
|
|
14387
14461
|
onReset,
|
|
14388
14462
|
menu: {
|
|
14389
14463
|
itemSpacing: void 0,
|
|
14390
|
-
before: /* @__PURE__ */ (0, import_jsx_runtime327.jsxs)(
|
|
14464
|
+
before: /* @__PURE__ */ (0, import_jsx_runtime327.jsxs)(import_react38.default.Fragment, { children: [
|
|
14391
14465
|
/* @__PURE__ */ (0, import_jsx_runtime327.jsx)(Header_default2, {}),
|
|
14392
14466
|
/* @__PURE__ */ (0, import_jsx_runtime327.jsx)(
|
|
14393
14467
|
HiddenInput,
|
|
@@ -14442,12 +14516,12 @@ var SelectMultiple_default = useSelectMultiple;
|
|
|
14442
14516
|
|
|
14443
14517
|
// src/components/Input/components/Select/index.tsx
|
|
14444
14518
|
var import_jsx_runtime328 = require("react/jsx-runtime");
|
|
14445
|
-
var Select =
|
|
14519
|
+
var Select = import_react39.default.forwardRef(
|
|
14446
14520
|
(props, ref) => {
|
|
14447
14521
|
const { position, loader: loader2, initialLoader } = props;
|
|
14448
|
-
const [options, setOptions] = (0,
|
|
14449
|
-
const [highlight, setHighlight] = (0,
|
|
14450
|
-
const [open, setOpen] = (0,
|
|
14522
|
+
const [options, setOptions] = (0, import_react39.useState)(initialLoader || []);
|
|
14523
|
+
const [highlight, setHighlight] = (0, import_react39.useState)(-1);
|
|
14524
|
+
const [open, setOpen] = (0, import_react39.useState)(false);
|
|
14451
14525
|
const hook = props.type === "select-multiple" ? SelectMultiple_default : Select_default;
|
|
14452
14526
|
const {
|
|
14453
14527
|
parsedOptions,
|
|
@@ -14463,11 +14537,11 @@ var Select = import_react37.default.forwardRef(
|
|
|
14463
14537
|
[options, setOptions],
|
|
14464
14538
|
setOpen
|
|
14465
14539
|
);
|
|
14466
|
-
const [_loading, setLoading] = (0,
|
|
14467
|
-
const [search, _setSearch] = (0,
|
|
14468
|
-
const [searchInput, setSearchInput] = (0,
|
|
14469
|
-
const [page, setPage] = (0,
|
|
14470
|
-
const [lastPage, setLastPage] = (0,
|
|
14540
|
+
const [_loading, setLoading] = (0, import_react39.useState)(true);
|
|
14541
|
+
const [search, _setSearch] = (0, import_react39.useState)("");
|
|
14542
|
+
const [searchInput, setSearchInput] = (0, import_react39.useState)("");
|
|
14543
|
+
const [page, setPage] = (0, import_react39.useState)(1);
|
|
14544
|
+
const [lastPage, setLastPage] = (0, import_react39.useState)(false);
|
|
14471
14545
|
const loading = props.loading || _loading;
|
|
14472
14546
|
const setSearch = (value) => {
|
|
14473
14547
|
_setSearch(value);
|
|
@@ -14500,7 +14574,7 @@ var Select = import_react37.default.forwardRef(
|
|
|
14500
14574
|
}
|
|
14501
14575
|
_onScrollEnd(e);
|
|
14502
14576
|
};
|
|
14503
|
-
const onSubmit = (0,
|
|
14577
|
+
const onSubmit = (0, import_react39.useCallback)(async () => {
|
|
14504
14578
|
setLoading(true);
|
|
14505
14579
|
const optionsResult = await loader2(search, page);
|
|
14506
14580
|
if (optionsResult === null) return;
|
|
@@ -14516,22 +14590,22 @@ var Select = import_react37.default.forwardRef(
|
|
|
14516
14590
|
setLastPage(lastPage2);
|
|
14517
14591
|
setLoading(false);
|
|
14518
14592
|
}, [loader2, search, page, initialLoader]);
|
|
14519
|
-
(0,
|
|
14593
|
+
(0, import_react39.useEffect)(() => {
|
|
14520
14594
|
const timeoutId = setTimeout(() => onSubmit(), 250);
|
|
14521
14595
|
return () => clearTimeout(timeoutId);
|
|
14522
14596
|
}, [onSubmit]);
|
|
14523
|
-
(0,
|
|
14597
|
+
(0, import_react39.useEffect)(() => {
|
|
14524
14598
|
if (open) return;
|
|
14525
14599
|
setSearch("");
|
|
14526
14600
|
onReset();
|
|
14527
14601
|
}, [props.value, open]);
|
|
14528
|
-
(0,
|
|
14602
|
+
(0, import_react39.useEffect)(() => {
|
|
14529
14603
|
setSearchInput(search);
|
|
14530
14604
|
}, [search]);
|
|
14531
|
-
(0,
|
|
14605
|
+
(0, import_react39.useEffect)(() => {
|
|
14532
14606
|
if (page === 1) setHighlight(-1);
|
|
14533
14607
|
}, [page]);
|
|
14534
|
-
(0,
|
|
14608
|
+
(0, import_react39.useEffect)(() => {
|
|
14535
14609
|
const timeoutId = setTimeout(() => setSearch(searchInput), 1e3);
|
|
14536
14610
|
return () => clearTimeout(timeoutId);
|
|
14537
14611
|
}, [searchInput]);
|
|
@@ -14547,7 +14621,7 @@ var Select = import_react37.default.forwardRef(
|
|
|
14547
14621
|
/* @__PURE__ */ (0, import_jsx_runtime328.jsxs)(
|
|
14548
14622
|
RelativeContainer7,
|
|
14549
14623
|
{
|
|
14550
|
-
ref:
|
|
14624
|
+
ref: useOnClickOut_default(() => setOpen(false)),
|
|
14551
14625
|
$width: props.width,
|
|
14552
14626
|
children: [
|
|
14553
14627
|
/* @__PURE__ */ (0, import_jsx_runtime328.jsx)(
|
|
@@ -14623,7 +14697,7 @@ Select.displayName = "Select";
|
|
|
14623
14697
|
var Select_default2 = Select;
|
|
14624
14698
|
|
|
14625
14699
|
// src/components/Input/components/Switch/index.tsx
|
|
14626
|
-
var
|
|
14700
|
+
var import_react40 = __toESM(require("react"));
|
|
14627
14701
|
|
|
14628
14702
|
// src/components/Input/components/Switch/styles.ts
|
|
14629
14703
|
var import_styled_components45 = __toESM(require("styled-components"));
|
|
@@ -14784,7 +14858,7 @@ var Switch = (props) => {
|
|
|
14784
14858
|
$keepSpace: true,
|
|
14785
14859
|
children: label[props.checked ? "after" : "before"]
|
|
14786
14860
|
}
|
|
14787
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime329.jsxs)(
|
|
14861
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime329.jsxs)(import_react40.default.Fragment, { children: [
|
|
14788
14862
|
label.before && /* @__PURE__ */ (0, import_jsx_runtime329.jsx)(LabelContainer7, { children: label.before }),
|
|
14789
14863
|
/* @__PURE__ */ (0, import_jsx_runtime329.jsx)("input", { ...htmlProps, type: "checkbox" }),
|
|
14790
14864
|
/* @__PURE__ */ (0, import_jsx_runtime329.jsx)("span", {}),
|
|
@@ -14797,10 +14871,10 @@ var Switch = (props) => {
|
|
|
14797
14871
|
var Switch_default = Switch;
|
|
14798
14872
|
|
|
14799
14873
|
// src/components/Input/components/Tags/index.tsx
|
|
14800
|
-
var
|
|
14874
|
+
var import_react42 = __toESM(require("react"));
|
|
14801
14875
|
|
|
14802
14876
|
// src/components/Input/components/Tags/components/Input/index.tsx
|
|
14803
|
-
var
|
|
14877
|
+
var import_react41 = __toESM(require("react"));
|
|
14804
14878
|
|
|
14805
14879
|
// src/components/Input/components/Tags/components/Input/styles.ts
|
|
14806
14880
|
var import_styled_components46 = __toESM(require("styled-components"));
|
|
@@ -14834,7 +14908,7 @@ var Input4 = import_styled_components46.default.input`
|
|
|
14834
14908
|
|
|
14835
14909
|
// src/components/Input/components/Tags/components/Input/index.tsx
|
|
14836
14910
|
var import_jsx_runtime330 = require("react/jsx-runtime");
|
|
14837
|
-
var Input5 =
|
|
14911
|
+
var Input5 = import_react41.default.forwardRef(
|
|
14838
14912
|
(props, ref) => {
|
|
14839
14913
|
const [value, setValue] = props.value;
|
|
14840
14914
|
const _onKeyDown = props.onKeyDown || (() => {
|
|
@@ -14991,10 +15065,10 @@ var TagContainer = import_styled_components49.default.div`
|
|
|
14991
15065
|
|
|
14992
15066
|
// src/components/Input/components/Tags/index.tsx
|
|
14993
15067
|
var import_jsx_runtime333 = require("react/jsx-runtime");
|
|
14994
|
-
var Tags =
|
|
15068
|
+
var Tags = import_react42.default.forwardRef(
|
|
14995
15069
|
(props, ref) => {
|
|
14996
15070
|
const { value, setValue } = props;
|
|
14997
|
-
const [inputValue, setInputValue] = props.input?.value ? props.input.value : (0,
|
|
15071
|
+
const [inputValue, setInputValue] = props.input?.value ? props.input.value : (0, import_react42.useState)("");
|
|
14998
15072
|
const paddingless = props.paddingless || false;
|
|
14999
15073
|
const borderless = props.borderless || false;
|
|
15000
15074
|
const maxTags = props.maxTags || Number.POSITIVE_INFINITY;
|
|
@@ -15062,7 +15136,7 @@ var Tags_default = Tags;
|
|
|
15062
15136
|
|
|
15063
15137
|
// src/components/Input/index.tsx
|
|
15064
15138
|
var import_jsx_runtime334 = require("react/jsx-runtime");
|
|
15065
|
-
var Component3 =
|
|
15139
|
+
var Component3 = import_react43.default.forwardRef(
|
|
15066
15140
|
(props, ref) => {
|
|
15067
15141
|
switch (props.type) {
|
|
15068
15142
|
case "date": {
|
|
@@ -15206,9 +15280,9 @@ var AppliedFiltersMenu = (props) => {
|
|
|
15206
15280
|
close,
|
|
15207
15281
|
appliedFilters: [appliedFilters, setAppliedFilters]
|
|
15208
15282
|
} = props;
|
|
15209
|
-
const [search, setSearch] = (0,
|
|
15210
|
-
const [searched, setSearched] = (0,
|
|
15211
|
-
(0,
|
|
15283
|
+
const [search, setSearch] = (0, import_react44.useState)("");
|
|
15284
|
+
const [searched, setSearched] = (0, import_react44.useState)("");
|
|
15285
|
+
(0, import_react44.useEffect)(() => {
|
|
15212
15286
|
setSearch("");
|
|
15213
15287
|
setSearched("");
|
|
15214
15288
|
}, [open]);
|
|
@@ -15331,13 +15405,13 @@ var AppliedFilters = Object.assign(
|
|
|
15331
15405
|
var AppliedFilters_default = AppliedFilters;
|
|
15332
15406
|
|
|
15333
15407
|
// src/components/Filters/Filters/components/Menu/index.tsx
|
|
15334
|
-
var
|
|
15408
|
+
var import_react47 = require("react");
|
|
15335
15409
|
|
|
15336
15410
|
// src/components/Filters/Filters/components/Submenu/index.tsx
|
|
15337
|
-
var
|
|
15411
|
+
var import_react46 = __toESM(require("react"));
|
|
15338
15412
|
|
|
15339
15413
|
// src/components/Filters/Filters/components/Submenu/components/Header/index.tsx
|
|
15340
|
-
var
|
|
15414
|
+
var import_react45 = require("react");
|
|
15341
15415
|
|
|
15342
15416
|
// src/components/Filters/Filters/components/Submenu/components/Header/styles.ts
|
|
15343
15417
|
var import_styled_components51 = __toESM(require("styled-components"));
|
|
@@ -15371,12 +15445,12 @@ var Header5 = (props) => {
|
|
|
15371
15445
|
allowEmptySearch,
|
|
15372
15446
|
withSearch
|
|
15373
15447
|
} = props;
|
|
15374
|
-
const [search, setSearch] = (0,
|
|
15448
|
+
const [search, setSearch] = (0, import_react45.useState)("");
|
|
15375
15449
|
const setSearched = allowEmptySearch ? _setSearched : (value) => {
|
|
15376
15450
|
if (value === "") return;
|
|
15377
15451
|
_setSearched(value);
|
|
15378
15452
|
};
|
|
15379
|
-
(0,
|
|
15453
|
+
(0, import_react45.useEffect)(() => {
|
|
15380
15454
|
setSearch(searched);
|
|
15381
15455
|
}, [searched]);
|
|
15382
15456
|
const onSubmit = () => {
|
|
@@ -15488,13 +15562,13 @@ var getInstance = (props) => {
|
|
|
15488
15562
|
var Submenu = (props) => {
|
|
15489
15563
|
const { item, close, setAppliedFilters, closeParent } = props;
|
|
15490
15564
|
const { open, isDynamic, itemSpacing, label, allowEmptySearch, getOptions: getOptions3 } = getInstance(props);
|
|
15491
|
-
const [options, setOptions] = (0,
|
|
15492
|
-
const [page, setPage] = (0,
|
|
15493
|
-
const [search, _setSearch] = (0,
|
|
15494
|
-
const [lastPage, setLastPage] = (0,
|
|
15495
|
-
const [loading, setLoading] = (0,
|
|
15496
|
-
const [, setFirstRender] = (0,
|
|
15497
|
-
const onSearch = (0,
|
|
15565
|
+
const [options, setOptions] = (0, import_react46.useState)([]);
|
|
15566
|
+
const [page, setPage] = (0, import_react46.useState)(1);
|
|
15567
|
+
const [search, _setSearch] = (0, import_react46.useState)("");
|
|
15568
|
+
const [lastPage, setLastPage] = (0, import_react46.useState)(false);
|
|
15569
|
+
const [loading, setLoading] = (0, import_react46.useState)(false);
|
|
15570
|
+
const [, setFirstRender] = (0, import_react46.useState)(true);
|
|
15571
|
+
const onSearch = (0, import_react46.useCallback)(async () => {
|
|
15498
15572
|
const { options: newOptions, lastPage: lastPage2 } = await getOptions3(search, page);
|
|
15499
15573
|
setLastPage(lastPage2);
|
|
15500
15574
|
setOptions([...newOptions]);
|
|
@@ -15509,12 +15583,12 @@ var Submenu = (props) => {
|
|
|
15509
15583
|
onSearch();
|
|
15510
15584
|
}
|
|
15511
15585
|
};
|
|
15512
|
-
(0,
|
|
15586
|
+
(0, import_react46.useEffect)(() => {
|
|
15513
15587
|
setOptions([]);
|
|
15514
15588
|
setSearch("", false);
|
|
15515
15589
|
setFirstRender(true);
|
|
15516
15590
|
}, [item]);
|
|
15517
|
-
(0,
|
|
15591
|
+
(0, import_react46.useEffect)(() => {
|
|
15518
15592
|
setFirstRender((firstRender) => {
|
|
15519
15593
|
if (!item || isDynamic && firstRender) {
|
|
15520
15594
|
setLoading(false);
|
|
@@ -15595,9 +15669,9 @@ var Submenu = (props) => {
|
|
|
15595
15669
|
loading,
|
|
15596
15670
|
emptyContent: isDynamic && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime338.jsx)(EmptyMessage, { children: (() => {
|
|
15597
15671
|
if (search !== "") {
|
|
15598
|
-
return /* @__PURE__ */ (0, import_jsx_runtime338.jsx)(
|
|
15672
|
+
return /* @__PURE__ */ (0, import_jsx_runtime338.jsx)(import_react46.default.Fragment, { children: "Nenhum resultado foi encontrado" });
|
|
15599
15673
|
}
|
|
15600
|
-
return /* @__PURE__ */ (0, import_jsx_runtime338.jsxs)(
|
|
15674
|
+
return /* @__PURE__ */ (0, import_jsx_runtime338.jsxs)(import_react46.default.Fragment, { children: [
|
|
15601
15675
|
"Utilize a busca para pesquisar por ",
|
|
15602
15676
|
/* @__PURE__ */ (0, import_jsx_runtime338.jsx)("br", {}),
|
|
15603
15677
|
label.text
|
|
@@ -15618,7 +15692,7 @@ var Submenu_default = Submenu;
|
|
|
15618
15692
|
var import_jsx_runtime339 = require("react/jsx-runtime");
|
|
15619
15693
|
var FiltersMenu = (props) => {
|
|
15620
15694
|
const { open, close } = props;
|
|
15621
|
-
const [active, setActive] = (0,
|
|
15695
|
+
const [active, setActive] = (0, import_react47.useState)(-1);
|
|
15622
15696
|
const items = props.items.map((item) => {
|
|
15623
15697
|
return {
|
|
15624
15698
|
label: typeof item.label === "string" ? item.label : item.label.element,
|
|
@@ -15632,7 +15706,7 @@ var FiltersMenu = (props) => {
|
|
|
15632
15706
|
};
|
|
15633
15707
|
});
|
|
15634
15708
|
const selected = active >= 0 && active < props.items.length ? props.items[active] : void 0;
|
|
15635
|
-
(0,
|
|
15709
|
+
(0, import_react47.useEffect)(() => {
|
|
15636
15710
|
if (open) return;
|
|
15637
15711
|
setActive(-1);
|
|
15638
15712
|
}, [open]);
|
|
@@ -15708,14 +15782,14 @@ var Filters = Object.assign(
|
|
|
15708
15782
|
var Filters_default = Filters;
|
|
15709
15783
|
|
|
15710
15784
|
// src/components/Grid/components/Col/index.tsx
|
|
15711
|
-
var
|
|
15785
|
+
var import_react49 = __toESM(require("react"));
|
|
15712
15786
|
|
|
15713
15787
|
// src/components/Grid/components/Row/context.ts
|
|
15714
|
-
var
|
|
15715
|
-
var Provider5 =
|
|
15788
|
+
var import_react48 = __toESM(require("react"));
|
|
15789
|
+
var Provider5 = import_react48.default.createContext({
|
|
15716
15790
|
cols: {}
|
|
15717
15791
|
});
|
|
15718
|
-
var useContext4 = () =>
|
|
15792
|
+
var useContext4 = () => import_react48.default.useContext(Provider5);
|
|
15719
15793
|
var context_default4 = Provider5;
|
|
15720
15794
|
|
|
15721
15795
|
// src/components/Grid/components/Col/styles.ts
|
|
@@ -15888,7 +15962,7 @@ var Col = import_styled_components53.default.div`
|
|
|
15888
15962
|
|
|
15889
15963
|
// src/components/Grid/components/Col/index.tsx
|
|
15890
15964
|
var import_jsx_runtime341 = require("react/jsx-runtime");
|
|
15891
|
-
var Col2 =
|
|
15965
|
+
var Col2 = import_react49.default.forwardRef((props, ref) => {
|
|
15892
15966
|
const context = useContext4();
|
|
15893
15967
|
const colProps = { ...context.cols, ...props };
|
|
15894
15968
|
const htmlProps = filterObject(colProps, [
|
|
@@ -15925,15 +15999,15 @@ Col2.displayName = "Col";
|
|
|
15925
15999
|
var Col_default = Col2;
|
|
15926
16000
|
|
|
15927
16001
|
// src/components/Grid/components/Grid/index.tsx
|
|
15928
|
-
var
|
|
16002
|
+
var import_react51 = __toESM(require("react"));
|
|
15929
16003
|
|
|
15930
16004
|
// src/components/Grid/components/Grid/context.ts
|
|
15931
|
-
var
|
|
15932
|
-
var Provider6 =
|
|
16005
|
+
var import_react50 = __toESM(require("react"));
|
|
16006
|
+
var Provider6 = import_react50.default.createContext({
|
|
15933
16007
|
rows: {},
|
|
15934
16008
|
cols: {}
|
|
15935
16009
|
});
|
|
15936
|
-
var useContext5 = () =>
|
|
16010
|
+
var useContext5 = () => import_react50.default.useContext(Provider6);
|
|
15937
16011
|
var context_default5 = Provider6;
|
|
15938
16012
|
|
|
15939
16013
|
// src/components/Grid/components/Grid/styles.ts
|
|
@@ -15966,7 +16040,7 @@ var Grid = import_styled_components54.default.div`
|
|
|
15966
16040
|
|
|
15967
16041
|
// src/components/Grid/components/Grid/index.tsx
|
|
15968
16042
|
var import_jsx_runtime342 = require("react/jsx-runtime");
|
|
15969
|
-
var Grid2 =
|
|
16043
|
+
var Grid2 = import_react51.default.forwardRef((props, ref) => {
|
|
15970
16044
|
const cols = props.cols || {};
|
|
15971
16045
|
const rows = props.rows || {};
|
|
15972
16046
|
const gridProps = filterObject(props, [
|
|
@@ -15989,7 +16063,7 @@ Grid2.displayName = "Grid";
|
|
|
15989
16063
|
var Grid_default2 = Grid2;
|
|
15990
16064
|
|
|
15991
16065
|
// src/components/Grid/components/Row/index.tsx
|
|
15992
|
-
var
|
|
16066
|
+
var import_react52 = __toESM(require("react"));
|
|
15993
16067
|
|
|
15994
16068
|
// src/components/Grid/components/Row/styles.ts
|
|
15995
16069
|
var import_styled_components55 = __toESM(require("styled-components"));
|
|
@@ -16116,7 +16190,7 @@ var Row = import_styled_components55.default.div`
|
|
|
16116
16190
|
|
|
16117
16191
|
// src/components/Grid/components/Row/index.tsx
|
|
16118
16192
|
var import_jsx_runtime343 = require("react/jsx-runtime");
|
|
16119
|
-
var Row2 =
|
|
16193
|
+
var Row2 = import_react52.default.forwardRef((props, ref) => {
|
|
16120
16194
|
const context = useContext5();
|
|
16121
16195
|
const cols = { ...context.cols, ...props.cols || {} };
|
|
16122
16196
|
const rowProps = { ...props, ...context.rows };
|
|
@@ -16160,15 +16234,15 @@ var Grid3 = Object.assign(Grid_default2, {
|
|
|
16160
16234
|
var Grid_default3 = Grid3;
|
|
16161
16235
|
|
|
16162
16236
|
// src/components/Modal/component.tsx
|
|
16163
|
-
var
|
|
16237
|
+
var import_react54 = require("react");
|
|
16164
16238
|
|
|
16165
16239
|
// src/addons/Portal/index.ts
|
|
16166
|
-
var
|
|
16240
|
+
var import_react53 = require("react");
|
|
16167
16241
|
var import_react_dom = require("react-dom");
|
|
16168
16242
|
var Portal = (props) => {
|
|
16169
16243
|
const { id, opened, children } = props;
|
|
16170
16244
|
const portalRoot = document.createElement("div");
|
|
16171
|
-
(0,
|
|
16245
|
+
(0, import_react53.useEffect)(() => {
|
|
16172
16246
|
if (opened) {
|
|
16173
16247
|
portalRoot.id = id + "-root";
|
|
16174
16248
|
document.body.appendChild(portalRoot);
|
|
@@ -16261,7 +16335,7 @@ var Container14 = import_styled_components56.default.div`
|
|
|
16261
16335
|
|
|
16262
16336
|
${({
|
|
16263
16337
|
theme: theme4,
|
|
16264
|
-
$size:
|
|
16338
|
+
$size: size4,
|
|
16265
16339
|
$customSize: customSize,
|
|
16266
16340
|
$color: color,
|
|
16267
16341
|
$inverted: inverted
|
|
@@ -16269,9 +16343,9 @@ var Container14 = import_styled_components56.default.div`
|
|
|
16269
16343
|
background-color: ${theme4.colors.white};
|
|
16270
16344
|
box-shadow: 0 0 21px 7px ${theme4.getColor("black", 15)};
|
|
16271
16345
|
|
|
16272
|
-
width: ${
|
|
16346
|
+
width: ${size4 === "custom" && customSize ? customSize.width || "auto" : widths[size4]};
|
|
16273
16347
|
|
|
16274
|
-
height: ${
|
|
16348
|
+
height: ${size4 === "custom" && customSize ? customSize.height || "auto" : heights[size4]};
|
|
16275
16349
|
|
|
16276
16350
|
${Header6} {
|
|
16277
16351
|
background-color: ${inverted ? theme4.isDarkColor(color) : theme4.colors[color]};
|
|
@@ -16286,7 +16360,7 @@ var Modal = (props) => {
|
|
|
16286
16360
|
const {
|
|
16287
16361
|
openState,
|
|
16288
16362
|
title,
|
|
16289
|
-
size:
|
|
16363
|
+
size: size4,
|
|
16290
16364
|
color,
|
|
16291
16365
|
inverted,
|
|
16292
16366
|
children,
|
|
@@ -16304,7 +16378,7 @@ var Modal = (props) => {
|
|
|
16304
16378
|
setOpen(false);
|
|
16305
16379
|
}
|
|
16306
16380
|
};
|
|
16307
|
-
(0,
|
|
16381
|
+
(0, import_react54.useEffect)(() => {
|
|
16308
16382
|
const onEscDown = (event) => {
|
|
16309
16383
|
if (closeOnEsc && event.key === "Escape") {
|
|
16310
16384
|
event.preventDefault();
|
|
@@ -16316,11 +16390,11 @@ var Modal = (props) => {
|
|
|
16316
16390
|
document.removeEventListener("keydown", onEscDown);
|
|
16317
16391
|
};
|
|
16318
16392
|
}, []);
|
|
16319
|
-
const _size =
|
|
16393
|
+
const _size = size4 ? heights[size4] : heights.default;
|
|
16320
16394
|
return /* @__PURE__ */ (0, import_jsx_runtime344.jsx)(Portal_default, { opened: open || false, id: "modal", children: /* @__PURE__ */ (0, import_jsx_runtime344.jsx)(Background, { onClick: onClickOutside, children: /* @__PURE__ */ (0, import_jsx_runtime344.jsxs)(
|
|
16321
16395
|
Container14,
|
|
16322
16396
|
{
|
|
16323
|
-
$size:
|
|
16397
|
+
$size: size4 || "small",
|
|
16324
16398
|
$color: color || "blue",
|
|
16325
16399
|
$inverted: inverted,
|
|
16326
16400
|
$customSize: customSize,
|
|
@@ -16506,7 +16580,7 @@ var Modal2 = Object.assign(component_default, {
|
|
|
16506
16580
|
var Modal_default = Modal2;
|
|
16507
16581
|
|
|
16508
16582
|
// src/components/Placeholder/components/Template1/index.tsx
|
|
16509
|
-
var
|
|
16583
|
+
var import_react55 = __toESM(require("react"));
|
|
16510
16584
|
|
|
16511
16585
|
// src/components/Placeholder/components/Template1/styles.ts
|
|
16512
16586
|
var import_styled_components60 = __toESM(require("styled-components"));
|
|
@@ -16542,19 +16616,19 @@ var HeaderLine = import_styled_components60.default.div`
|
|
|
16542
16616
|
margin-top: 14px;
|
|
16543
16617
|
}
|
|
16544
16618
|
|
|
16545
|
-
${({ $size:
|
|
16619
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components60.css`
|
|
16546
16620
|
width: 15%;
|
|
16547
16621
|
`}
|
|
16548
16622
|
|
|
16549
|
-
${({ $size:
|
|
16623
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components60.css`
|
|
16550
16624
|
width: 25%;
|
|
16551
16625
|
`}
|
|
16552
16626
|
|
|
16553
|
-
${({ $size:
|
|
16627
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components60.css`
|
|
16554
16628
|
width: 45%;
|
|
16555
16629
|
`}
|
|
16556
16630
|
|
|
16557
|
-
${({ $size:
|
|
16631
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components60.css`
|
|
16558
16632
|
width: 75%;
|
|
16559
16633
|
`}
|
|
16560
16634
|
`;
|
|
@@ -16566,7 +16640,7 @@ var MainLine = (0, import_styled_components60.default)(HeaderLine)`
|
|
|
16566
16640
|
// src/components/Placeholder/components/Template1/index.tsx
|
|
16567
16641
|
var import_jsx_runtime348 = require("react/jsx-runtime");
|
|
16568
16642
|
var Template1 = (props) => {
|
|
16569
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime348.jsx)(
|
|
16643
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime348.jsx)(import_react55.default.Fragment, {});
|
|
16570
16644
|
return /* @__PURE__ */ (0, import_jsx_runtime348.jsxs)(Container15, { children: [
|
|
16571
16645
|
/* @__PURE__ */ (0, import_jsx_runtime348.jsxs)(Header7, { children: [
|
|
16572
16646
|
/* @__PURE__ */ (0, import_jsx_runtime348.jsx)(HeaderImage, {}),
|
|
@@ -16587,7 +16661,7 @@ var Template1 = (props) => {
|
|
|
16587
16661
|
var Template1_default = Template1;
|
|
16588
16662
|
|
|
16589
16663
|
// src/components/Placeholder/components/Template2/index.tsx
|
|
16590
|
-
var
|
|
16664
|
+
var import_react56 = __toESM(require("react"));
|
|
16591
16665
|
|
|
16592
16666
|
// src/components/Placeholder/components/Template2/styles.ts
|
|
16593
16667
|
var import_styled_components62 = __toESM(require("styled-components"));
|
|
@@ -16603,19 +16677,19 @@ var HeaderLine2 = import_styled_components61.default.div`
|
|
|
16603
16677
|
margin-top: 14px;
|
|
16604
16678
|
}
|
|
16605
16679
|
|
|
16606
|
-
${({ $size:
|
|
16680
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components61.css`
|
|
16607
16681
|
width: 15%;
|
|
16608
16682
|
`}
|
|
16609
16683
|
|
|
16610
|
-
${({ $size:
|
|
16684
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components61.css`
|
|
16611
16685
|
width: 25%;
|
|
16612
16686
|
`}
|
|
16613
16687
|
|
|
16614
|
-
${({ $size:
|
|
16688
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components61.css`
|
|
16615
16689
|
width: 45%;
|
|
16616
16690
|
`}
|
|
16617
16691
|
|
|
16618
|
-
${({ $size:
|
|
16692
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components61.css`
|
|
16619
16693
|
width: 75%;
|
|
16620
16694
|
`}
|
|
16621
16695
|
`;
|
|
@@ -16657,7 +16731,7 @@ var HeaderLine3 = (0, import_styled_components62.default)(HeaderLine2)``;
|
|
|
16657
16731
|
// src/components/Placeholder/components/Template2/index.tsx
|
|
16658
16732
|
var import_jsx_runtime349 = require("react/jsx-runtime");
|
|
16659
16733
|
var Template2 = (props) => {
|
|
16660
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime349.jsx)(
|
|
16734
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime349.jsx)(import_react56.default.Fragment, {});
|
|
16661
16735
|
return /* @__PURE__ */ (0, import_jsx_runtime349.jsxs)(Template2Container, { children: [
|
|
16662
16736
|
/* @__PURE__ */ (0, import_jsx_runtime349.jsxs)(Header8, { children: [
|
|
16663
16737
|
/* @__PURE__ */ (0, import_jsx_runtime349.jsx)(HeaderImage2, {}),
|
|
@@ -16675,7 +16749,7 @@ var Template2 = (props) => {
|
|
|
16675
16749
|
var Template2_default = Template2;
|
|
16676
16750
|
|
|
16677
16751
|
// src/components/Placeholder/components/Template3/index.tsx
|
|
16678
|
-
var
|
|
16752
|
+
var import_react57 = __toESM(require("react"));
|
|
16679
16753
|
|
|
16680
16754
|
// src/components/Placeholder/components/Template3/styles.ts
|
|
16681
16755
|
var import_styled_components63 = __toESM(require("styled-components"));
|
|
@@ -16694,7 +16768,7 @@ var Template3Line = (0, import_styled_components63.default)(HeaderLine2)`
|
|
|
16694
16768
|
// src/components/Placeholder/components/Template3/index.tsx
|
|
16695
16769
|
var import_jsx_runtime350 = require("react/jsx-runtime");
|
|
16696
16770
|
var Template3 = (props) => {
|
|
16697
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime350.jsx)(
|
|
16771
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime350.jsx)(import_react57.default.Fragment, {});
|
|
16698
16772
|
return /* @__PURE__ */ (0, import_jsx_runtime350.jsxs)(Template3Container, { children: [
|
|
16699
16773
|
/* @__PURE__ */ (0, import_jsx_runtime350.jsx)(Template3Line, { $size: "large", $height: "7px", $color: "#DADADA" }),
|
|
16700
16774
|
/* @__PURE__ */ (0, import_jsx_runtime350.jsx)(Template3Line, { $size: "small", $height: "7px", $color: "#DADADA" }),
|
|
@@ -16706,7 +16780,7 @@ var Template3 = (props) => {
|
|
|
16706
16780
|
var Template3_default = Template3;
|
|
16707
16781
|
|
|
16708
16782
|
// src/components/Placeholder/components/Template4/index.tsx
|
|
16709
|
-
var
|
|
16783
|
+
var import_react58 = __toESM(require("react"));
|
|
16710
16784
|
|
|
16711
16785
|
// src/components/Placeholder/components/Template4/styles.ts
|
|
16712
16786
|
var import_styled_components64 = __toESM(require("styled-components"));
|
|
@@ -16725,19 +16799,19 @@ var HeaderLine4 = import_styled_components64.default.div`
|
|
|
16725
16799
|
margin-top: 14px;
|
|
16726
16800
|
}
|
|
16727
16801
|
|
|
16728
|
-
${({ $size:
|
|
16802
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components64.css`
|
|
16729
16803
|
width: 15%;
|
|
16730
16804
|
`}
|
|
16731
16805
|
|
|
16732
|
-
${({ $size:
|
|
16806
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components64.css`
|
|
16733
16807
|
width: 25%;
|
|
16734
16808
|
`}
|
|
16735
16809
|
|
|
16736
|
-
${({ $size:
|
|
16810
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components64.css`
|
|
16737
16811
|
width: 45%;
|
|
16738
16812
|
`}
|
|
16739
16813
|
|
|
16740
|
-
${({ $size:
|
|
16814
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components64.css`
|
|
16741
16815
|
width: 75%;
|
|
16742
16816
|
`}
|
|
16743
16817
|
`;
|
|
@@ -16754,7 +16828,7 @@ var CustomLine = (0, import_styled_components64.default)(HeaderLine4)`
|
|
|
16754
16828
|
// src/components/Placeholder/components/Template4/index.tsx
|
|
16755
16829
|
var import_jsx_runtime351 = require("react/jsx-runtime");
|
|
16756
16830
|
var Template4 = (props) => {
|
|
16757
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime351.jsx)(
|
|
16831
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime351.jsx)(import_react58.default.Fragment, {});
|
|
16758
16832
|
return /* @__PURE__ */ (0, import_jsx_runtime351.jsxs)(Template4Container, { children: [
|
|
16759
16833
|
/* @__PURE__ */ (0, import_jsx_runtime351.jsx)(
|
|
16760
16834
|
CustomLine,
|
|
@@ -16833,7 +16907,7 @@ var Template4 = (props) => {
|
|
|
16833
16907
|
var Template4_default = Template4;
|
|
16834
16908
|
|
|
16835
16909
|
// src/components/Placeholder/components/Template5/index.tsx
|
|
16836
|
-
var
|
|
16910
|
+
var import_react59 = __toESM(require("react"));
|
|
16837
16911
|
|
|
16838
16912
|
// src/components/Placeholder/components/Template5/styles.ts
|
|
16839
16913
|
var import_styled_components65 = __toESM(require("styled-components"));
|
|
@@ -16863,19 +16937,19 @@ var HeaderLine5 = import_styled_components65.default.div`
|
|
|
16863
16937
|
margin-top: 14px;
|
|
16864
16938
|
}
|
|
16865
16939
|
|
|
16866
|
-
${({ $size:
|
|
16940
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components65.css`
|
|
16867
16941
|
width: 15%;
|
|
16868
16942
|
`}
|
|
16869
16943
|
|
|
16870
|
-
${({ $size:
|
|
16944
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components65.css`
|
|
16871
16945
|
width: 25%;
|
|
16872
16946
|
`}
|
|
16873
16947
|
|
|
16874
|
-
${({ $size:
|
|
16948
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components65.css`
|
|
16875
16949
|
width: 45%;
|
|
16876
16950
|
`}
|
|
16877
16951
|
|
|
16878
|
-
${({ $size:
|
|
16952
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components65.css`
|
|
16879
16953
|
width: 75%;
|
|
16880
16954
|
`}
|
|
16881
16955
|
`;
|
|
@@ -16892,7 +16966,7 @@ var MainContent3 = import_styled_components65.default.div`
|
|
|
16892
16966
|
// src/components/Placeholder/components/Template5/index.tsx
|
|
16893
16967
|
var import_jsx_runtime352 = require("react/jsx-runtime");
|
|
16894
16968
|
var Template5 = (props) => {
|
|
16895
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime352.jsx)(
|
|
16969
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime352.jsx)(import_react59.default.Fragment, {});
|
|
16896
16970
|
return /* @__PURE__ */ (0, import_jsx_runtime352.jsxs)(Container19, { children: [
|
|
16897
16971
|
/* @__PURE__ */ (0, import_jsx_runtime352.jsx)(Circle, {}),
|
|
16898
16972
|
/* @__PURE__ */ (0, import_jsx_runtime352.jsxs)(MainContent3, { children: [
|
|
@@ -16938,7 +17012,7 @@ var Template5 = (props) => {
|
|
|
16938
17012
|
var Template5_default = Template5;
|
|
16939
17013
|
|
|
16940
17014
|
// src/components/Placeholder/components/Template6/index.tsx
|
|
16941
|
-
var
|
|
17015
|
+
var import_react60 = __toESM(require("react"));
|
|
16942
17016
|
|
|
16943
17017
|
// src/components/Placeholder/components/Template6/styles.ts
|
|
16944
17018
|
var import_styled_components66 = __toESM(require("styled-components"));
|
|
@@ -16974,15 +17048,15 @@ var HeaderLine6 = import_styled_components66.default.div`
|
|
|
16974
17048
|
width: 15%;
|
|
16975
17049
|
`}
|
|
16976
17050
|
|
|
16977
|
-
${({ $size:
|
|
17051
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components66.css`
|
|
16978
17052
|
width: 25%;
|
|
16979
17053
|
`}
|
|
16980
17054
|
|
|
16981
|
-
${({ $size:
|
|
17055
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components66.css`
|
|
16982
17056
|
width: 45%;
|
|
16983
17057
|
`}
|
|
16984
17058
|
|
|
16985
|
-
${({ $size:
|
|
17059
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components66.css`
|
|
16986
17060
|
width: 75%;
|
|
16987
17061
|
`}
|
|
16988
17062
|
`;
|
|
@@ -16996,7 +17070,7 @@ var CustomLine3 = (0, import_styled_components66.default)(HeaderLine6)`
|
|
|
16996
17070
|
// src/components/Placeholder/components/Template6/index.tsx
|
|
16997
17071
|
var import_jsx_runtime353 = require("react/jsx-runtime");
|
|
16998
17072
|
var Template6 = (props) => {
|
|
16999
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(
|
|
17073
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(import_react60.default.Fragment, {});
|
|
17000
17074
|
return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(Container20, { children: /* @__PURE__ */ (0, import_jsx_runtime353.jsxs)(Header9, { children: [
|
|
17001
17075
|
/* @__PURE__ */ (0, import_jsx_runtime353.jsx)(
|
|
17002
17076
|
CustomLine3,
|
|
@@ -17030,7 +17104,7 @@ var Template6 = (props) => {
|
|
|
17030
17104
|
var Template6_default = Template6;
|
|
17031
17105
|
|
|
17032
17106
|
// src/components/Placeholder/components/Template7/index.tsx
|
|
17033
|
-
var
|
|
17107
|
+
var import_react61 = __toESM(require("react"));
|
|
17034
17108
|
|
|
17035
17109
|
// src/components/Placeholder/components/Template7/styles.ts
|
|
17036
17110
|
var import_styled_components67 = __toESM(require("styled-components"));
|
|
@@ -17058,19 +17132,19 @@ var HeaderLine7 = import_styled_components67.default.div`
|
|
|
17058
17132
|
margin-top: 14px;
|
|
17059
17133
|
}
|
|
17060
17134
|
|
|
17061
|
-
${({ $size:
|
|
17135
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components67.css`
|
|
17062
17136
|
width: 15%;
|
|
17063
17137
|
`}
|
|
17064
17138
|
|
|
17065
|
-
${({ $size:
|
|
17139
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components67.css`
|
|
17066
17140
|
width: 25%;
|
|
17067
17141
|
`}
|
|
17068
17142
|
|
|
17069
|
-
${({ $size:
|
|
17143
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components67.css`
|
|
17070
17144
|
width: 45%;
|
|
17071
17145
|
`}
|
|
17072
17146
|
|
|
17073
|
-
${({ $size:
|
|
17147
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components67.css`
|
|
17074
17148
|
width: 75%;
|
|
17075
17149
|
`}
|
|
17076
17150
|
`;
|
|
@@ -17098,7 +17172,7 @@ var Circle2 = import_styled_components67.default.div`
|
|
|
17098
17172
|
// src/components/Placeholder/components/Template7/index.tsx
|
|
17099
17173
|
var import_jsx_runtime354 = require("react/jsx-runtime");
|
|
17100
17174
|
var Template7 = (props) => {
|
|
17101
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
|
|
17175
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(import_react61.default.Fragment, {});
|
|
17102
17176
|
return /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(Container21, { children: [
|
|
17103
17177
|
/* @__PURE__ */ (0, import_jsx_runtime354.jsx)(Header10, { children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
|
|
17104
17178
|
CustomLine4,
|
|
@@ -17121,7 +17195,7 @@ var Template7 = (props) => {
|
|
|
17121
17195
|
var Template7_default = Template7;
|
|
17122
17196
|
|
|
17123
17197
|
// src/components/Placeholder/components/Template8/index.tsx
|
|
17124
|
-
var
|
|
17198
|
+
var import_react62 = __toESM(require("react"));
|
|
17125
17199
|
|
|
17126
17200
|
// src/components/Placeholder/components/Template8/styles.ts
|
|
17127
17201
|
var import_styled_components68 = __toESM(require("styled-components"));
|
|
@@ -17149,19 +17223,19 @@ var HeaderLine8 = import_styled_components68.default.div`
|
|
|
17149
17223
|
margin-top: 14px;
|
|
17150
17224
|
}
|
|
17151
17225
|
|
|
17152
|
-
${({ $size:
|
|
17226
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components68.css`
|
|
17153
17227
|
width: 15%;
|
|
17154
17228
|
`}
|
|
17155
17229
|
|
|
17156
|
-
${({ $size:
|
|
17230
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components68.css`
|
|
17157
17231
|
width: 25%;
|
|
17158
17232
|
`}
|
|
17159
17233
|
|
|
17160
|
-
${({ $size:
|
|
17234
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components68.css`
|
|
17161
17235
|
width: 45%;
|
|
17162
17236
|
`}
|
|
17163
17237
|
|
|
17164
|
-
${({ $size:
|
|
17238
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components68.css`
|
|
17165
17239
|
width: 75%;
|
|
17166
17240
|
`}
|
|
17167
17241
|
`;
|
|
@@ -17182,7 +17256,7 @@ var Main4 = import_styled_components68.default.div`
|
|
|
17182
17256
|
// src/components/Placeholder/components/Template8/index.tsx
|
|
17183
17257
|
var import_jsx_runtime355 = require("react/jsx-runtime");
|
|
17184
17258
|
var Template8 = (props) => {
|
|
17185
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
|
|
17259
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(import_react62.default.Fragment, {});
|
|
17186
17260
|
return /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)(Container22, { children: [
|
|
17187
17261
|
/* @__PURE__ */ (0, import_jsx_runtime355.jsx)(Header11, { children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
|
|
17188
17262
|
CustomLine5,
|
|
@@ -17218,7 +17292,7 @@ var Template8 = (props) => {
|
|
|
17218
17292
|
var Template8_default = Template8;
|
|
17219
17293
|
|
|
17220
17294
|
// src/components/Placeholder/components/Template9/index.tsx
|
|
17221
|
-
var
|
|
17295
|
+
var import_react63 = __toESM(require("react"));
|
|
17222
17296
|
|
|
17223
17297
|
// src/components/Placeholder/components/Template9/styles.ts
|
|
17224
17298
|
var import_styled_components69 = __toESM(require("styled-components"));
|
|
@@ -17246,19 +17320,19 @@ var HeaderLine9 = import_styled_components69.default.div`
|
|
|
17246
17320
|
margin-top: 7px;
|
|
17247
17321
|
}
|
|
17248
17322
|
|
|
17249
|
-
${({ $size:
|
|
17323
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components69.css`
|
|
17250
17324
|
width: 15%;
|
|
17251
17325
|
`}
|
|
17252
17326
|
|
|
17253
|
-
${({ $size:
|
|
17327
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components69.css`
|
|
17254
17328
|
width: 25%;
|
|
17255
17329
|
`}
|
|
17256
17330
|
|
|
17257
|
-
${({ $size:
|
|
17331
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components69.css`
|
|
17258
17332
|
width: 45%;
|
|
17259
17333
|
`}
|
|
17260
17334
|
|
|
17261
|
-
${({ $size:
|
|
17335
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components69.css`
|
|
17262
17336
|
width: 75%;
|
|
17263
17337
|
`}
|
|
17264
17338
|
`;
|
|
@@ -17286,7 +17360,7 @@ var Circle3 = import_styled_components69.default.div`
|
|
|
17286
17360
|
// src/components/Placeholder/components/Template9/index.tsx
|
|
17287
17361
|
var import_jsx_runtime356 = require("react/jsx-runtime");
|
|
17288
17362
|
var Template82 = (props) => {
|
|
17289
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime356.jsx)(
|
|
17363
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime356.jsx)(import_react63.default.Fragment, {});
|
|
17290
17364
|
return /* @__PURE__ */ (0, import_jsx_runtime356.jsxs)(Container23, { children: [
|
|
17291
17365
|
/* @__PURE__ */ (0, import_jsx_runtime356.jsxs)(Header12, { children: [
|
|
17292
17366
|
/* @__PURE__ */ (0, import_jsx_runtime356.jsx)(
|
|
@@ -17314,7 +17388,7 @@ var Template82 = (props) => {
|
|
|
17314
17388
|
var Template9_default = Template82;
|
|
17315
17389
|
|
|
17316
17390
|
// src/components/Placeholder/components/Template10/index.tsx
|
|
17317
|
-
var
|
|
17391
|
+
var import_react64 = __toESM(require("react"));
|
|
17318
17392
|
|
|
17319
17393
|
// src/components/Placeholder/components/Template10/styles.ts
|
|
17320
17394
|
var import_styled_components70 = __toESM(require("styled-components"));
|
|
@@ -17342,19 +17416,19 @@ var HeaderLine10 = import_styled_components70.default.div`
|
|
|
17342
17416
|
margin-top: 7px;
|
|
17343
17417
|
}
|
|
17344
17418
|
|
|
17345
|
-
${({ $size:
|
|
17419
|
+
${({ $size: size4 }) => size4 === "mini" && import_styled_components70.css`
|
|
17346
17420
|
width: 15%;
|
|
17347
17421
|
`}
|
|
17348
17422
|
|
|
17349
|
-
${({ $size:
|
|
17423
|
+
${({ $size: size4 }) => size4 === "small" && import_styled_components70.css`
|
|
17350
17424
|
width: 25%;
|
|
17351
17425
|
`}
|
|
17352
17426
|
|
|
17353
|
-
${({ $size:
|
|
17427
|
+
${({ $size: size4 }) => size4 === "medium" && import_styled_components70.css`
|
|
17354
17428
|
width: 45%;
|
|
17355
17429
|
`}
|
|
17356
17430
|
|
|
17357
|
-
${({ $size:
|
|
17431
|
+
${({ $size: size4 }) => size4 === "large" && import_styled_components70.css`
|
|
17358
17432
|
width: 75%;
|
|
17359
17433
|
`}
|
|
17360
17434
|
`;
|
|
@@ -17386,7 +17460,7 @@ var Circle4 = import_styled_components70.default.div`
|
|
|
17386
17460
|
// src/components/Placeholder/components/Template10/index.tsx
|
|
17387
17461
|
var import_jsx_runtime357 = require("react/jsx-runtime");
|
|
17388
17462
|
var Template10 = (props) => {
|
|
17389
|
-
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime357.jsx)(
|
|
17463
|
+
if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime357.jsx)(import_react64.default.Fragment, {});
|
|
17390
17464
|
return /* @__PURE__ */ (0, import_jsx_runtime357.jsxs)(Container24, { children: [
|
|
17391
17465
|
/* @__PURE__ */ (0, import_jsx_runtime357.jsxs)(Header13, { children: [
|
|
17392
17466
|
/* @__PURE__ */ (0, import_jsx_runtime357.jsx)(
|
|
@@ -17599,106 +17673,1909 @@ var ProgressBar = ({ type, value, ...props }) => {
|
|
|
17599
17673
|
};
|
|
17600
17674
|
var ProgressBar_default = ProgressBar;
|
|
17601
17675
|
|
|
17602
|
-
// src/components/
|
|
17603
|
-
var
|
|
17604
|
-
var
|
|
17605
|
-
|
|
17606
|
-
// src/components/Signature/styles.ts
|
|
17607
|
-
var import_styled_components72 = __toESM(require("styled-components"));
|
|
17608
|
-
var Container26 = import_styled_components72.default.div`
|
|
17609
|
-
width: 100%;
|
|
17610
|
-
height: 100%;
|
|
17611
|
-
|
|
17612
|
-
display: flex;
|
|
17613
|
-
flex-direction: column;
|
|
17614
|
-
gap: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
17615
|
-
`;
|
|
17616
|
-
var CanvasContainer = import_styled_components72.default.div`
|
|
17617
|
-
position: relative;
|
|
17618
|
-
flex: 1;
|
|
17619
|
-
overflow: hidden;
|
|
17620
|
-
background-color: ${({ theme: theme4, $invalid: invalid }) => invalid ? theme4.getColor("warningRed", 5) : theme4.colors.white};
|
|
17621
|
-
|
|
17622
|
-
&[data-placeholder]:before {
|
|
17623
|
-
content: attr(data-placeholder);
|
|
17624
|
-
position: absolute;
|
|
17625
|
-
top: 50%;
|
|
17626
|
-
left: 50%;
|
|
17627
|
-
transform: translate(-50%, -50%);
|
|
17628
|
-
text-align: center;
|
|
17629
|
-
|
|
17630
|
-
color: ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "darkBlue"]};
|
|
17676
|
+
// src/components/Select/index.tsx
|
|
17677
|
+
var import_react79 = __toESM(require("react"));
|
|
17678
|
+
var import_react80 = require("@floating-ui/react");
|
|
17631
17679
|
|
|
17632
|
-
|
|
17633
|
-
|
|
17634
|
-
line-height: 71px;
|
|
17635
|
-
opacity: 0.1;
|
|
17636
|
-
z-index: 1;
|
|
17637
|
-
}
|
|
17680
|
+
// src/components/Select/hooks/useAsyncOptions/index.ts
|
|
17681
|
+
var import_react65 = require("react");
|
|
17638
17682
|
|
|
17639
|
-
|
|
17640
|
-
|
|
17641
|
-
|
|
17642
|
-
width: 100%;
|
|
17643
|
-
height: 100%;
|
|
17644
|
-
box-sizing: border-box;
|
|
17645
|
-
border: 1px solid
|
|
17646
|
-
${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "lightGrey"]};
|
|
17647
|
-
border-radius: 4px;
|
|
17648
|
-
z-index: 2;
|
|
17649
|
-
}
|
|
17683
|
+
// src/components/Select/constants.ts
|
|
17684
|
+
var SEARCH_DEBOUNCE_MS = 500;
|
|
17685
|
+
var MENU_EXIT_MS = 250;
|
|
17650
17686
|
|
|
17651
|
-
|
|
17652
|
-
|
|
17653
|
-
|
|
17654
|
-
|
|
17655
|
-
|
|
17656
|
-
|
|
17657
|
-
|
|
17658
|
-
|
|
17687
|
+
// src/components/Select/hooks/useAsyncOptions/index.ts
|
|
17688
|
+
var useAsyncOptions = (loader2) => {
|
|
17689
|
+
const [options, setOptions] = (0, import_react65.useState)([]);
|
|
17690
|
+
const [pagination, setPagination] = (0, import_react65.useState)({
|
|
17691
|
+
page: 1,
|
|
17692
|
+
last: false,
|
|
17693
|
+
fetched: null
|
|
17694
|
+
});
|
|
17695
|
+
const cursor = (0, import_react65.useMemo)(
|
|
17696
|
+
() => options.length > 0 ? options[options.length - 1] : null,
|
|
17697
|
+
[options]
|
|
17698
|
+
);
|
|
17699
|
+
const {
|
|
17700
|
+
current: [searchInput, setSearchInput],
|
|
17701
|
+
debounced: [search]
|
|
17702
|
+
} = useDebouncedState_default(
|
|
17703
|
+
"",
|
|
17704
|
+
() => {
|
|
17705
|
+
setOptions([]);
|
|
17706
|
+
setPagination({
|
|
17707
|
+
page: 1,
|
|
17708
|
+
last: true,
|
|
17709
|
+
fetched: null
|
|
17710
|
+
});
|
|
17711
|
+
},
|
|
17712
|
+
SEARCH_DEBOUNCE_MS
|
|
17713
|
+
);
|
|
17714
|
+
const loadOptions = (0, import_react65.useCallback)(async () => {
|
|
17715
|
+
if (pagination.fetched !== null) return;
|
|
17716
|
+
try {
|
|
17717
|
+
const result = await loader2(search, pagination.page, cursor);
|
|
17718
|
+
if (result === null) return;
|
|
17719
|
+
setOptions(
|
|
17720
|
+
pagination.page === 1 ? result.options : (prev) => [...prev, ...result.options]
|
|
17721
|
+
);
|
|
17722
|
+
setPagination((prev) => ({
|
|
17723
|
+
...prev,
|
|
17724
|
+
fetched: /* @__PURE__ */ new Date(),
|
|
17725
|
+
last: result.last
|
|
17726
|
+
}));
|
|
17727
|
+
} catch (e) {
|
|
17728
|
+
setPagination((prev) => ({ ...prev, fetched: /* @__PURE__ */ new Date(), last: true }));
|
|
17729
|
+
}
|
|
17730
|
+
}, [loader2, search, pagination.page, pagination.fetched, cursor]);
|
|
17731
|
+
const paginate2 = () => setPagination(
|
|
17732
|
+
(prev) => prev.last ? prev : {
|
|
17733
|
+
page: prev.page + 1,
|
|
17734
|
+
last: true,
|
|
17735
|
+
fetched: null
|
|
17736
|
+
}
|
|
17737
|
+
);
|
|
17738
|
+
(0, import_react65.useEffect)(() => {
|
|
17739
|
+
loadOptions();
|
|
17740
|
+
}, [loadOptions]);
|
|
17741
|
+
return {
|
|
17742
|
+
options,
|
|
17743
|
+
loading: pagination.fetched === null,
|
|
17744
|
+
paginate: paginate2,
|
|
17745
|
+
searchInput: [searchInput, setSearchInput]
|
|
17746
|
+
};
|
|
17747
|
+
};
|
|
17748
|
+
var useAsyncOptions_default = useAsyncOptions;
|
|
17659
17749
|
|
|
17660
|
-
|
|
17661
|
-
|
|
17662
|
-
|
|
17663
|
-
|
|
17664
|
-
|
|
17750
|
+
// src/components/Select/hooks/useFloatingMenu/index.ts
|
|
17751
|
+
var import_react66 = require("@floating-ui/react");
|
|
17752
|
+
var useFloatingMenu = ({ open, onOpenChange }) => {
|
|
17753
|
+
const floating = (0, import_react66.useFloating)({
|
|
17754
|
+
open,
|
|
17755
|
+
onOpenChange,
|
|
17756
|
+
placement: "bottom-start",
|
|
17757
|
+
whileElementsMounted: import_react66.autoUpdate,
|
|
17758
|
+
middleware: [
|
|
17759
|
+
(0, import_react66.flip)(),
|
|
17760
|
+
(0, import_react66.size)({
|
|
17761
|
+
apply({ rects, elements }) {
|
|
17762
|
+
Object.assign(elements.floating.style, {
|
|
17763
|
+
minWidth: `${rects.reference.width}px`
|
|
17764
|
+
});
|
|
17765
|
+
}
|
|
17766
|
+
})
|
|
17767
|
+
]
|
|
17768
|
+
});
|
|
17769
|
+
const transition = (0, import_react66.useTransitionStatus)(floating.context, {
|
|
17770
|
+
duration: MENU_EXIT_MS
|
|
17771
|
+
});
|
|
17772
|
+
const dismiss = (0, import_react66.useDismiss)(floating.context, {
|
|
17773
|
+
outsidePressEvent: "mousedown",
|
|
17774
|
+
escapeKey: true
|
|
17775
|
+
});
|
|
17776
|
+
const interactions = (0, import_react66.useInteractions)([dismiss]);
|
|
17777
|
+
return {
|
|
17778
|
+
floating,
|
|
17779
|
+
transition,
|
|
17780
|
+
interactions
|
|
17781
|
+
};
|
|
17782
|
+
};
|
|
17783
|
+
var useFloatingMenu_default = useFloatingMenu;
|
|
17665
17784
|
|
|
17666
|
-
|
|
17667
|
-
|
|
17668
|
-
|
|
17669
|
-
|
|
17670
|
-
|
|
17671
|
-
|
|
17785
|
+
// src/components/Select/hooks/useListNavigation/index.ts
|
|
17786
|
+
var import_react67 = require("react");
|
|
17787
|
+
var INVALID_INDEX = -1;
|
|
17788
|
+
var useActiveIndex = (itemCount, scrollToIndex) => {
|
|
17789
|
+
const [activeIndex, setActiveIndex] = (0, import_react67.useState)(INVALID_INDEX);
|
|
17790
|
+
(0, import_react67.useEffect)(() => {
|
|
17791
|
+
setActiveIndex((current) => {
|
|
17792
|
+
if (current >= itemCount) return INVALID_INDEX;
|
|
17793
|
+
return current;
|
|
17794
|
+
});
|
|
17795
|
+
}, [itemCount]);
|
|
17796
|
+
const setActiveIndexMiddleware = (activeIndex2, scroll = true) => {
|
|
17797
|
+
setActiveIndex(activeIndex2);
|
|
17798
|
+
if (activeIndex2 < 0 || !scroll) return;
|
|
17799
|
+
scrollToIndex?.(activeIndex2);
|
|
17800
|
+
};
|
|
17801
|
+
return [activeIndex, setActiveIndexMiddleware];
|
|
17802
|
+
};
|
|
17803
|
+
var useListNavigation = ({
|
|
17804
|
+
itemCount,
|
|
17805
|
+
isItemDisabled,
|
|
17806
|
+
onSelect,
|
|
17807
|
+
scrollToIndex
|
|
17808
|
+
}) => {
|
|
17809
|
+
const [activeIndex, setActiveIndex] = useActiveIndex(itemCount, scrollToIndex);
|
|
17810
|
+
const firstEnabledIndex = (0, import_react67.useMemo)(() => {
|
|
17811
|
+
for (let index = 0; index < itemCount; index += 1) {
|
|
17812
|
+
if (!isItemDisabled(index)) return index;
|
|
17813
|
+
}
|
|
17814
|
+
return INVALID_INDEX;
|
|
17815
|
+
}, [isItemDisabled, itemCount]);
|
|
17816
|
+
const lastEnabledIndex = (0, import_react67.useMemo)(() => {
|
|
17817
|
+
for (let index = itemCount - 1; index >= 0; index -= 1) {
|
|
17818
|
+
if (!isItemDisabled(index)) return index;
|
|
17819
|
+
}
|
|
17820
|
+
return INVALID_INDEX;
|
|
17821
|
+
}, [isItemDisabled, itemCount]);
|
|
17822
|
+
const findNextEnabled = (0, import_react67.useCallback)(
|
|
17823
|
+
(from, direction) => {
|
|
17824
|
+
let index = from;
|
|
17825
|
+
while (index >= 0 && index < itemCount) {
|
|
17826
|
+
if (!isItemDisabled(index)) return index;
|
|
17827
|
+
index += direction;
|
|
17672
17828
|
}
|
|
17673
|
-
|
|
17674
|
-
|
|
17675
|
-
|
|
17829
|
+
return INVALID_INDEX;
|
|
17830
|
+
},
|
|
17831
|
+
[isItemDisabled, itemCount]
|
|
17832
|
+
);
|
|
17833
|
+
const onKeyDown = (0, import_react67.useCallback)(
|
|
17834
|
+
(event) => {
|
|
17835
|
+
if (event.key === "ArrowDown") {
|
|
17836
|
+
event.preventDefault();
|
|
17837
|
+
const from = activeIndex < 0 ? 0 : activeIndex + 1;
|
|
17838
|
+
const next = findNextEnabled(from, 1);
|
|
17839
|
+
if (next >= 0) setActiveIndex(next);
|
|
17840
|
+
return;
|
|
17676
17841
|
}
|
|
17677
|
-
|
|
17678
|
-
|
|
17842
|
+
if (event.key === "ArrowUp") {
|
|
17843
|
+
event.preventDefault();
|
|
17844
|
+
const from = activeIndex < 0 ? itemCount - 1 : activeIndex - 1;
|
|
17845
|
+
const next = findNextEnabled(from, -1);
|
|
17846
|
+
if (next >= 0) setActiveIndex(next);
|
|
17847
|
+
return;
|
|
17679
17848
|
}
|
|
17680
|
-
|
|
17681
|
-
|
|
17682
|
-
|
|
17683
|
-
|
|
17684
|
-
|
|
17685
|
-
|
|
17686
|
-
|
|
17687
|
-
|
|
17688
|
-
|
|
17689
|
-
|
|
17690
|
-
|
|
17691
|
-
|
|
17692
|
-
|
|
17693
|
-
|
|
17694
|
-
|
|
17695
|
-
}
|
|
17696
|
-
|
|
17697
|
-
|
|
17698
|
-
|
|
17699
|
-
|
|
17700
|
-
|
|
17701
|
-
|
|
17849
|
+
if (event.key === "Home") {
|
|
17850
|
+
event.preventDefault();
|
|
17851
|
+
if (firstEnabledIndex >= 0) setActiveIndex(firstEnabledIndex);
|
|
17852
|
+
return;
|
|
17853
|
+
}
|
|
17854
|
+
if (event.key === "End") {
|
|
17855
|
+
event.preventDefault();
|
|
17856
|
+
if (lastEnabledIndex >= 0) setActiveIndex(lastEnabledIndex);
|
|
17857
|
+
return;
|
|
17858
|
+
}
|
|
17859
|
+
if ((event.key === "Enter" || event.key === " ") && activeIndex >= 0) {
|
|
17860
|
+
event.preventDefault();
|
|
17861
|
+
if (!isItemDisabled(activeIndex)) {
|
|
17862
|
+
onSelect(activeIndex);
|
|
17863
|
+
}
|
|
17864
|
+
}
|
|
17865
|
+
},
|
|
17866
|
+
[
|
|
17867
|
+
activeIndex,
|
|
17868
|
+
findNextEnabled,
|
|
17869
|
+
firstEnabledIndex,
|
|
17870
|
+
isItemDisabled,
|
|
17871
|
+
itemCount,
|
|
17872
|
+
lastEnabledIndex,
|
|
17873
|
+
onSelect
|
|
17874
|
+
]
|
|
17875
|
+
);
|
|
17876
|
+
const onMouseEnter = (index) => setActiveIndex(index, false);
|
|
17877
|
+
return {
|
|
17878
|
+
activeIndex,
|
|
17879
|
+
onMouseEnter,
|
|
17880
|
+
onKeyDown
|
|
17881
|
+
};
|
|
17882
|
+
};
|
|
17883
|
+
var useListNavigation_default = useListNavigation;
|
|
17884
|
+
|
|
17885
|
+
// src/components/Select/hooks/useRuleIndex/index.ts
|
|
17886
|
+
var import_react68 = require("react");
|
|
17887
|
+
var useRuleIndex = ({
|
|
17888
|
+
options,
|
|
17889
|
+
getKey,
|
|
17890
|
+
rules
|
|
17891
|
+
}) => {
|
|
17892
|
+
const failedRuleByKey = (0, import_react68.useMemo)(() => {
|
|
17893
|
+
const failedRuleByKey2 = /* @__PURE__ */ new Map();
|
|
17894
|
+
options.forEach((option) => {
|
|
17895
|
+
const key = getKey(option);
|
|
17896
|
+
const failedRule = rules?.find((rule) => !rule.allow(option));
|
|
17897
|
+
if (failedRule) {
|
|
17898
|
+
failedRuleByKey2.set(key, failedRule);
|
|
17899
|
+
}
|
|
17900
|
+
});
|
|
17901
|
+
return failedRuleByKey2;
|
|
17902
|
+
}, [getKey, options, rules]);
|
|
17903
|
+
const getFailedRuleByKey = (0, import_react68.useCallback)(
|
|
17904
|
+
(key) => {
|
|
17905
|
+
return failedRuleByKey.get(key);
|
|
17906
|
+
},
|
|
17907
|
+
[failedRuleByKey]
|
|
17908
|
+
);
|
|
17909
|
+
return {
|
|
17910
|
+
getFailedRuleByKey,
|
|
17911
|
+
enabledCount: options.length - failedRuleByKey.size
|
|
17912
|
+
};
|
|
17913
|
+
};
|
|
17914
|
+
var useRuleIndex_default = useRuleIndex;
|
|
17915
|
+
|
|
17916
|
+
// src/components/Select/hooks/useVirtualizedOptions/index.ts
|
|
17917
|
+
var import_react69 = require("react");
|
|
17918
|
+
var import_react_virtual = require("@tanstack/react-virtual");
|
|
17919
|
+
var useVirtualizedOptions = (params) => {
|
|
17920
|
+
const { optionsLength, loading, onPaginate, overscan = 2 } = params;
|
|
17921
|
+
const estimateSize = (0, import_react69.useMemo)(() => {
|
|
17922
|
+
const estimateSize2 = params.estimateSize;
|
|
17923
|
+
if (estimateSize2 === void 0) {
|
|
17924
|
+
return () => 46;
|
|
17925
|
+
}
|
|
17926
|
+
if (typeof estimateSize2 === "function") {
|
|
17927
|
+
return estimateSize2;
|
|
17928
|
+
}
|
|
17929
|
+
return () => estimateSize2;
|
|
17930
|
+
}, [params.estimateSize]);
|
|
17931
|
+
const listRef = (0, import_react69.useRef)(null);
|
|
17932
|
+
const searchRef = (0, import_react69.useRef)(null);
|
|
17933
|
+
const rowVirtualizer = (0, import_react_virtual.useVirtualizer)({
|
|
17934
|
+
count: optionsLength,
|
|
17935
|
+
getScrollElement: () => listRef.current,
|
|
17936
|
+
estimateSize,
|
|
17937
|
+
overscan
|
|
17938
|
+
});
|
|
17939
|
+
const virtualItems = rowVirtualizer.getVirtualItems();
|
|
17940
|
+
(0, import_react69.useEffect)(() => {
|
|
17941
|
+
searchRef.current?.focus();
|
|
17942
|
+
}, [searchRef.current]);
|
|
17943
|
+
const endIndex = (0, import_react69.useMemo)(
|
|
17944
|
+
() => virtualItems[virtualItems.length - 1]?.index ?? 0,
|
|
17945
|
+
[virtualItems]
|
|
17946
|
+
);
|
|
17947
|
+
(0, import_react69.useEffect)(() => {
|
|
17948
|
+
if (loading || optionsLength < 1) return;
|
|
17949
|
+
if (endIndex >= optionsLength - 1 - overscan) {
|
|
17950
|
+
onPaginate();
|
|
17951
|
+
}
|
|
17952
|
+
}, [loading, endIndex, optionsLength, overscan, onPaginate]);
|
|
17953
|
+
return {
|
|
17954
|
+
listRef,
|
|
17955
|
+
searchRef,
|
|
17956
|
+
rowVirtualizer,
|
|
17957
|
+
virtualItems
|
|
17958
|
+
};
|
|
17959
|
+
};
|
|
17960
|
+
var useVirtualizedOptions_default = useVirtualizedOptions;
|
|
17961
|
+
|
|
17962
|
+
// src/components/Select/instances/multi/index.tsx
|
|
17963
|
+
var import_react77 = __toESM(require("react"));
|
|
17964
|
+
|
|
17965
|
+
// src/components/Select/components/Apply/index.tsx
|
|
17966
|
+
var import_react74 = require("react");
|
|
17967
|
+
|
|
17968
|
+
// src/components/Popup/index.tsx
|
|
17969
|
+
var import_react72 = __toESM(require("react"));
|
|
17970
|
+
var import_react73 = require("@floating-ui/react");
|
|
17971
|
+
|
|
17972
|
+
// src/components/Popup/hooks/fallbackPlacements/index.ts
|
|
17973
|
+
var import_react70 = require("react");
|
|
17974
|
+
var FALLBACK_PLACEMENTS = {
|
|
17975
|
+
top: ["top-start", "top-end", "bottom", "right", "left"],
|
|
17976
|
+
"top-start": ["top", "top-end", "right-start", "left-start", "bottom-start"],
|
|
17977
|
+
"top-end": ["top", "top-start", "right-end", "left-end", "bottom-end"],
|
|
17978
|
+
right: ["right-start", "right-end", "bottom", "top", "left"],
|
|
17979
|
+
"right-start": [
|
|
17980
|
+
"right",
|
|
17981
|
+
"right-end",
|
|
17982
|
+
"bottom-start",
|
|
17983
|
+
"top-start",
|
|
17984
|
+
"left-start"
|
|
17985
|
+
],
|
|
17986
|
+
"right-end": ["right", "right-start", "bottom-end", "top-end", "left-end"],
|
|
17987
|
+
bottom: ["bottom-start", "bottom-end", "top", "right", "left"],
|
|
17988
|
+
"bottom-start": [
|
|
17989
|
+
"bottom",
|
|
17990
|
+
"bottom-end",
|
|
17991
|
+
"right-start",
|
|
17992
|
+
"left-start",
|
|
17993
|
+
"top-start"
|
|
17994
|
+
],
|
|
17995
|
+
"bottom-end": ["bottom", "bottom-start", "right-end", "left-end", "top-end"],
|
|
17996
|
+
left: ["left-start", "left-end", "bottom", "top", "right"],
|
|
17997
|
+
"left-start": [
|
|
17998
|
+
"left",
|
|
17999
|
+
"left-end",
|
|
18000
|
+
"bottom-start",
|
|
18001
|
+
"top-start",
|
|
18002
|
+
"right-start"
|
|
18003
|
+
],
|
|
18004
|
+
"left-end": ["left", "left-start", "bottom-end", "top-end", "right-end"]
|
|
18005
|
+
};
|
|
18006
|
+
var useFallbackPlacements = (props) => {
|
|
18007
|
+
const { placement, fallbackPlacements } = props;
|
|
18008
|
+
const fallbackList = (0, import_react70.useMemo)(() => {
|
|
18009
|
+
if (fallbackPlacements && fallbackPlacements.length > 0) {
|
|
18010
|
+
return fallbackPlacements;
|
|
18011
|
+
}
|
|
18012
|
+
return FALLBACK_PLACEMENTS[placement];
|
|
18013
|
+
}, [fallbackPlacements, placement]);
|
|
18014
|
+
return fallbackList;
|
|
18015
|
+
};
|
|
18016
|
+
var fallbackPlacements_default = useFallbackPlacements;
|
|
18017
|
+
|
|
18018
|
+
// src/components/Popup/hooks/open/index.ts
|
|
18019
|
+
var import_react71 = require("react");
|
|
18020
|
+
var useOpen = (props) => {
|
|
18021
|
+
const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react71.useState)(false);
|
|
18022
|
+
const isControlled = props.open !== void 0;
|
|
18023
|
+
const open = isControlled ? props.open : uncontrolledOpen;
|
|
18024
|
+
const setOpen = (nextOpen) => {
|
|
18025
|
+
if (isControlled) {
|
|
18026
|
+
props.setOpen?.(nextOpen);
|
|
18027
|
+
return;
|
|
18028
|
+
}
|
|
18029
|
+
setUncontrolledOpen(nextOpen);
|
|
18030
|
+
};
|
|
18031
|
+
return [open, setOpen];
|
|
18032
|
+
};
|
|
18033
|
+
var open_default = useOpen;
|
|
18034
|
+
|
|
18035
|
+
// src/components/Popup/styles.ts
|
|
18036
|
+
var import_styled_components72 = __toESM(require("styled-components"));
|
|
18037
|
+
var TooltipArrow = import_styled_components72.default.div`
|
|
18038
|
+
position: absolute;
|
|
18039
|
+
width: 0;
|
|
18040
|
+
height: 0;
|
|
18041
|
+
pointer-events: none;
|
|
18042
|
+
|
|
18043
|
+
${({ $arrow: arrow2, $placement: placement }) => {
|
|
18044
|
+
const width = (arrow2 || "pointed") === "flattened" ? 30 : 16;
|
|
18045
|
+
const halfWidth = width / 2;
|
|
18046
|
+
const borderSize = 1;
|
|
18047
|
+
const length = 6;
|
|
18048
|
+
const [side, align] = placement.split("-");
|
|
18049
|
+
if (side === "top" || side === "bottom") {
|
|
18050
|
+
const vertical = side === "top" ? import_styled_components72.css`
|
|
18051
|
+
bottom: 0;
|
|
18052
|
+
&::before {
|
|
18053
|
+
content: '';
|
|
18054
|
+
position: absolute;
|
|
18055
|
+
left: -${halfWidth}px;
|
|
18056
|
+
border-left: ${halfWidth}px solid transparent;
|
|
18057
|
+
border-right: ${halfWidth}px solid transparent;
|
|
18058
|
+
border-top: ${length}px solid var(--tooltip-border);
|
|
18059
|
+
}
|
|
18060
|
+
&::after {
|
|
18061
|
+
content: '';
|
|
18062
|
+
position: absolute;
|
|
18063
|
+
left: -${halfWidth - borderSize}px;
|
|
18064
|
+
top: -${borderSize}px;
|
|
18065
|
+
border-left: ${halfWidth - borderSize}px solid transparent;
|
|
18066
|
+
border-right: ${halfWidth - borderSize}px solid transparent;
|
|
18067
|
+
border-top: ${length - borderSize}px solid var(--tooltip-bg);
|
|
18068
|
+
}
|
|
18069
|
+
` : import_styled_components72.css`
|
|
18070
|
+
top: -${length}px;
|
|
18071
|
+
&::before {
|
|
18072
|
+
content: '';
|
|
18073
|
+
position: absolute;
|
|
18074
|
+
left: -${halfWidth}px;
|
|
18075
|
+
border-left: ${halfWidth}px solid transparent;
|
|
18076
|
+
border-right: ${halfWidth}px solid transparent;
|
|
18077
|
+
border-bottom: ${length}px solid var(--tooltip-border);
|
|
18078
|
+
}
|
|
18079
|
+
&::after {
|
|
18080
|
+
content: '';
|
|
18081
|
+
position: absolute;
|
|
18082
|
+
left: -${halfWidth - borderSize}px;
|
|
18083
|
+
top: ${borderSize}px;
|
|
18084
|
+
border-left: ${halfWidth - borderSize}px solid transparent;
|
|
18085
|
+
border-right: ${halfWidth - borderSize}px solid transparent;
|
|
18086
|
+
border-bottom: ${length - borderSize}px solid var(--tooltip-bg);
|
|
18087
|
+
}
|
|
18088
|
+
`;
|
|
18089
|
+
const alignStyles = align === "start" ? import_styled_components72.css`
|
|
18090
|
+
left: ${halfWidth}px;
|
|
18091
|
+
margin-left: ${length}px;
|
|
18092
|
+
` : align === "end" ? import_styled_components72.css`
|
|
18093
|
+
right: ${halfWidth}px;
|
|
18094
|
+
margin-right: ${length}px;
|
|
18095
|
+
` : import_styled_components72.css`
|
|
18096
|
+
left: 50%;
|
|
18097
|
+
`;
|
|
18098
|
+
return import_styled_components72.css`
|
|
18099
|
+
${vertical}
|
|
18100
|
+
${alignStyles}
|
|
18101
|
+
`;
|
|
18102
|
+
}
|
|
18103
|
+
const horizontal = side === "left" ? import_styled_components72.css`
|
|
18104
|
+
right: 0;
|
|
18105
|
+
&::before {
|
|
18106
|
+
content: '';
|
|
18107
|
+
position: absolute;
|
|
18108
|
+
top: -${halfWidth}px;
|
|
18109
|
+
border-top: ${halfWidth}px solid transparent;
|
|
18110
|
+
border-bottom: ${halfWidth}px solid transparent;
|
|
18111
|
+
border-left: ${length}px solid var(--tooltip-border);
|
|
18112
|
+
}
|
|
18113
|
+
&::after {
|
|
18114
|
+
content: '';
|
|
18115
|
+
position: absolute;
|
|
18116
|
+
top: -${halfWidth - borderSize}px;
|
|
18117
|
+
left: -${borderSize}px;
|
|
18118
|
+
border-top: ${halfWidth - borderSize}px solid transparent;
|
|
18119
|
+
border-bottom: ${halfWidth - borderSize}px solid transparent;
|
|
18120
|
+
border-left: ${length - borderSize}px solid var(--tooltip-bg);
|
|
18121
|
+
}
|
|
18122
|
+
` : import_styled_components72.css`
|
|
18123
|
+
left: -${length}px;
|
|
18124
|
+
&::before {
|
|
18125
|
+
content: '';
|
|
18126
|
+
position: absolute;
|
|
18127
|
+
top: -${halfWidth}px;
|
|
18128
|
+
border-top: ${halfWidth}px solid transparent;
|
|
18129
|
+
border-bottom: ${halfWidth}px solid transparent;
|
|
18130
|
+
border-right: ${length}px solid var(--tooltip-border);
|
|
18131
|
+
}
|
|
18132
|
+
&::after {
|
|
18133
|
+
content: '';
|
|
18134
|
+
position: absolute;
|
|
18135
|
+
top: -${halfWidth - borderSize}px;
|
|
18136
|
+
left: ${borderSize}px;
|
|
18137
|
+
border-top: ${halfWidth - borderSize}px solid transparent;
|
|
18138
|
+
border-bottom: ${halfWidth - borderSize}px solid transparent;
|
|
18139
|
+
border-right: ${length - borderSize}px solid var(--tooltip-bg);
|
|
18140
|
+
}
|
|
18141
|
+
`;
|
|
18142
|
+
if (align === "start") {
|
|
18143
|
+
return import_styled_components72.css`
|
|
18144
|
+
top: ${halfWidth}px;
|
|
18145
|
+
margin-top: ${length}px;
|
|
18146
|
+
${horizontal}
|
|
18147
|
+
`;
|
|
18148
|
+
}
|
|
18149
|
+
if (align === "end") {
|
|
18150
|
+
return import_styled_components72.css`
|
|
18151
|
+
bottom: ${halfWidth}px;
|
|
18152
|
+
margin-bottom: ${length}px;
|
|
18153
|
+
${horizontal}
|
|
18154
|
+
`;
|
|
18155
|
+
}
|
|
18156
|
+
return import_styled_components72.css`
|
|
18157
|
+
top: 50%;
|
|
18158
|
+
${horizontal}
|
|
18159
|
+
`;
|
|
18160
|
+
}}
|
|
18161
|
+
`;
|
|
18162
|
+
var TooltipSurface = import_styled_components72.default.div`
|
|
18163
|
+
position: relative;
|
|
18164
|
+
|
|
18165
|
+
${({ theme: theme4, $background: background, $placement: placement }) => {
|
|
18166
|
+
const [side] = placement.split("-");
|
|
18167
|
+
const [bgColor, fontColor, borderColor, borderRadius] = background === "light" ? [theme4.colors.white, theme4.colors.greyishBlue, "#eeeeee", 5] : [
|
|
18168
|
+
theme4.colors.greyishBlue,
|
|
18169
|
+
theme4.colors.white,
|
|
18170
|
+
theme4.colors.greyishBlue,
|
|
18171
|
+
0
|
|
18172
|
+
];
|
|
18173
|
+
const boxShadow = {
|
|
18174
|
+
top: [0, -4],
|
|
18175
|
+
bottom: [0, 4],
|
|
18176
|
+
right: [4, 0],
|
|
18177
|
+
left: [-4, 0]
|
|
18178
|
+
}[side] || [0, 4];
|
|
18179
|
+
return import_styled_components72.css`
|
|
18180
|
+
--tooltip-bg: ${bgColor};
|
|
18181
|
+
--tooltip-border: ${borderColor};
|
|
18182
|
+
border: 1px solid ${borderColor};
|
|
18183
|
+
border-radius: ${borderRadius}px;
|
|
18184
|
+
box-shadow: ${boxShadow[0]}px ${boxShadow[1]}px 10px
|
|
18185
|
+
${theme4.getColor("black", 10)};
|
|
18186
|
+
color: ${fontColor};
|
|
18187
|
+
|
|
18188
|
+
&,
|
|
18189
|
+
& ${TooltipArrow} {
|
|
18190
|
+
background-color: ${bgColor};
|
|
18191
|
+
}
|
|
18192
|
+
`;
|
|
18193
|
+
}}
|
|
18194
|
+
|
|
18195
|
+
border-radius: 4px;
|
|
18196
|
+
padding: 8px 10px;
|
|
18197
|
+
font-size: 12px;
|
|
18198
|
+
max-width: 240px;
|
|
18199
|
+
z-index: 1000;
|
|
18200
|
+
`;
|
|
18201
|
+
|
|
18202
|
+
// src/components/Popup/index.tsx
|
|
18203
|
+
var import_jsx_runtime360 = require("react/jsx-runtime");
|
|
18204
|
+
var mergeRefs = (...refs) => {
|
|
18205
|
+
return (node) => {
|
|
18206
|
+
refs.forEach((ref) => {
|
|
18207
|
+
if (!ref) return;
|
|
18208
|
+
if (typeof ref === "function") ref(node);
|
|
18209
|
+
else ref.current = node;
|
|
18210
|
+
});
|
|
18211
|
+
};
|
|
18212
|
+
};
|
|
18213
|
+
var PopupComponent = (props) => {
|
|
18214
|
+
const {
|
|
18215
|
+
content: Content5,
|
|
18216
|
+
renderTrigger,
|
|
18217
|
+
triggerProps,
|
|
18218
|
+
on = "hover",
|
|
18219
|
+
placement,
|
|
18220
|
+
offset: offsetValue = 8,
|
|
18221
|
+
shift: shiftValue = 8,
|
|
18222
|
+
background = "dark",
|
|
18223
|
+
closeOnClip = false
|
|
18224
|
+
} = props;
|
|
18225
|
+
const arrowStyle = props.arrow || (background === "dark" ? "pointed" : "flattened");
|
|
18226
|
+
const withArrow = arrowStyle !== "none";
|
|
18227
|
+
const [open, setOpen] = open_default(props);
|
|
18228
|
+
const arrowRef = (0, import_react72.useRef)(null);
|
|
18229
|
+
const fallbackPlacements = fallbackPlacements_default(props);
|
|
18230
|
+
const floating = (0, import_react73.useFloating)({
|
|
18231
|
+
open,
|
|
18232
|
+
onOpenChange: setOpen,
|
|
18233
|
+
placement,
|
|
18234
|
+
whileElementsMounted: import_react73.autoUpdate,
|
|
18235
|
+
middleware: [
|
|
18236
|
+
(0, import_react73.offset)(offsetValue),
|
|
18237
|
+
(0, import_react73.flip)({ fallbackPlacements, padding: shiftValue }),
|
|
18238
|
+
(0, import_react73.shift)({ padding: shiftValue }),
|
|
18239
|
+
...withArrow ? [(0, import_react73.arrow)({ element: arrowRef })] : [],
|
|
18240
|
+
...closeOnClip ? [
|
|
18241
|
+
(0, import_react73.hide)(),
|
|
18242
|
+
{
|
|
18243
|
+
name: "closeOnClip",
|
|
18244
|
+
fn(state) {
|
|
18245
|
+
if (state.middlewareData.hide?.referenceHidden) {
|
|
18246
|
+
setOpen(false);
|
|
18247
|
+
}
|
|
18248
|
+
return {};
|
|
18249
|
+
}
|
|
18250
|
+
}
|
|
18251
|
+
] : []
|
|
18252
|
+
]
|
|
18253
|
+
});
|
|
18254
|
+
const hover = (0, import_react73.useHover)(floating.context, {
|
|
18255
|
+
move: false,
|
|
18256
|
+
enabled: on === "hover"
|
|
18257
|
+
});
|
|
18258
|
+
const click = (0, import_react73.useClick)(floating.context, {
|
|
18259
|
+
enabled: on === "click"
|
|
18260
|
+
});
|
|
18261
|
+
const dismiss = (0, import_react73.useDismiss)(floating.context, {
|
|
18262
|
+
outsidePressEvent: "mousedown",
|
|
18263
|
+
escapeKey: true,
|
|
18264
|
+
enabled: on === "click"
|
|
18265
|
+
});
|
|
18266
|
+
const interactions = (0, import_react73.useInteractions)([hover, click, dismiss]);
|
|
18267
|
+
const referenceProps = (0, import_react72.useMemo)(() => {
|
|
18268
|
+
const { ref: triggerRef, ...rest } = triggerProps || {};
|
|
18269
|
+
return interactions.getReferenceProps({
|
|
18270
|
+
...rest,
|
|
18271
|
+
ref: mergeRefs(floating.refs.setReference, triggerRef)
|
|
18272
|
+
});
|
|
18273
|
+
}, [floating.refs.setReference, interactions, triggerProps]);
|
|
18274
|
+
return /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(import_react72.default.Fragment, { children: [
|
|
18275
|
+
renderTrigger(referenceProps),
|
|
18276
|
+
open ? /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(import_react73.FloatingPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(
|
|
18277
|
+
TooltipSurface,
|
|
18278
|
+
{
|
|
18279
|
+
ref: floating.refs.setFloating,
|
|
18280
|
+
style: floating.floatingStyles,
|
|
18281
|
+
$placement: floating.placement,
|
|
18282
|
+
$background: background,
|
|
18283
|
+
...interactions.getFloatingProps(),
|
|
18284
|
+
children: [
|
|
18285
|
+
withArrow ? /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
|
|
18286
|
+
TooltipArrow,
|
|
18287
|
+
{
|
|
18288
|
+
ref: arrowRef,
|
|
18289
|
+
$arrow: arrowStyle,
|
|
18290
|
+
$placement: floating.placement
|
|
18291
|
+
}
|
|
18292
|
+
) : null,
|
|
18293
|
+
/* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Content5, {})
|
|
18294
|
+
]
|
|
18295
|
+
}
|
|
18296
|
+
) }) : null
|
|
18297
|
+
] });
|
|
18298
|
+
};
|
|
18299
|
+
var Popup2 = ({
|
|
18300
|
+
enabled,
|
|
18301
|
+
...props
|
|
18302
|
+
}) => {
|
|
18303
|
+
return enabled !== false ? /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(PopupComponent, { ...props }) : props.renderTrigger(props.triggerProps || {});
|
|
18304
|
+
};
|
|
18305
|
+
var Popup_default = Popup2;
|
|
18306
|
+
|
|
18307
|
+
// src/components/Select/components/Apply/styles.ts
|
|
18308
|
+
var import_styled_components73 = __toESM(require("styled-components"));
|
|
18309
|
+
var ApplyButton = import_styled_components73.default.button`
|
|
18310
|
+
background: none;
|
|
18311
|
+
border: none;
|
|
18312
|
+
outline: none;
|
|
18313
|
+
padding: 0;
|
|
18314
|
+
|
|
18315
|
+
background-color: ${({ theme: theme4 }) => theme4.colors.blue};
|
|
18316
|
+
border-radius: 3px;
|
|
18317
|
+
|
|
18318
|
+
${({ theme: theme4 }) => theme4.useTypography("h4")}
|
|
18319
|
+
color: ${({ theme: theme4 }) => theme4.colors.white};
|
|
18320
|
+
|
|
18321
|
+
height: 35px;
|
|
18322
|
+
width: 100%;
|
|
18323
|
+
display: flex;
|
|
18324
|
+
align-items: center;
|
|
18325
|
+
justify-content: center;
|
|
18326
|
+
|
|
18327
|
+
transition-property: opacity;
|
|
18328
|
+
transition-duration: 0.25s;
|
|
18329
|
+
transition-timing-function: linear;
|
|
18330
|
+
|
|
18331
|
+
&[aria-disabled='true'] {
|
|
18332
|
+
opacity: 0.5;
|
|
18333
|
+
}
|
|
18334
|
+
&:not([aria-disabled='true']) {
|
|
18335
|
+
cursor: pointer;
|
|
18336
|
+
}
|
|
18337
|
+
`;
|
|
18338
|
+
|
|
18339
|
+
// src/components/Select/components/Apply/index.tsx
|
|
18340
|
+
var import_jsx_runtime361 = require("react/jsx-runtime");
|
|
18341
|
+
var Apply = ({
|
|
18342
|
+
setValue,
|
|
18343
|
+
clearable,
|
|
18344
|
+
applyRules,
|
|
18345
|
+
onClose,
|
|
18346
|
+
draft
|
|
18347
|
+
}) => {
|
|
18348
|
+
const value = (0, import_react74.useMemo)(() => Array.from(draft.values()), [draft]);
|
|
18349
|
+
const failedApplyRule = (0, import_react74.useMemo)(() => {
|
|
18350
|
+
const rule = applyRules.find((rule2) => !rule2.allow(value));
|
|
18351
|
+
return rule;
|
|
18352
|
+
}, [value, applyRules]);
|
|
18353
|
+
const ApplyRuleComponent = failedApplyRule?.Component;
|
|
18354
|
+
const onApply = () => {
|
|
18355
|
+
if (!clearable && draft.size < 1) return;
|
|
18356
|
+
if (failedApplyRule !== void 0) return;
|
|
18357
|
+
setValue(Array.from(draft.values()));
|
|
18358
|
+
onClose();
|
|
18359
|
+
};
|
|
18360
|
+
return /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
|
|
18361
|
+
Popup_default,
|
|
18362
|
+
{
|
|
18363
|
+
...ApplyRuleComponent !== void 0 ? {
|
|
18364
|
+
enabled: true,
|
|
18365
|
+
content: () => /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(ApplyRuleComponent, { value })
|
|
18366
|
+
} : {
|
|
18367
|
+
enabled: false,
|
|
18368
|
+
content: () => null
|
|
18369
|
+
},
|
|
18370
|
+
on: "click",
|
|
18371
|
+
closeOnClip: true,
|
|
18372
|
+
placement: "right",
|
|
18373
|
+
triggerType: "button",
|
|
18374
|
+
triggerProps: {
|
|
18375
|
+
onClick: onApply
|
|
18376
|
+
},
|
|
18377
|
+
renderTrigger: (props) => /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
|
|
18378
|
+
ApplyButton,
|
|
18379
|
+
{
|
|
18380
|
+
type: "button",
|
|
18381
|
+
"aria-disabled": !clearable && draft.size < 1 || failedApplyRule !== void 0,
|
|
18382
|
+
...props,
|
|
18383
|
+
children: "Aplicar"
|
|
18384
|
+
}
|
|
18385
|
+
)
|
|
18386
|
+
}
|
|
18387
|
+
);
|
|
18388
|
+
};
|
|
18389
|
+
var Apply_default = Apply;
|
|
18390
|
+
|
|
18391
|
+
// src/components/Select/components/Scroll/index.tsx
|
|
18392
|
+
var import_react75 = __toESM(require("react"));
|
|
18393
|
+
|
|
18394
|
+
// src/components/Select/components/Scroll/styles.ts
|
|
18395
|
+
var import_styled_components74 = __toESM(require("styled-components"));
|
|
18396
|
+
var ListContainer = import_styled_components74.default.div`
|
|
18397
|
+
flex: 1;
|
|
18398
|
+
position: relative;
|
|
18399
|
+
overflow: hidden;
|
|
18400
|
+
`;
|
|
18401
|
+
var ListScroll = import_styled_components74.default.div`
|
|
18402
|
+
overflow-y: scroll;
|
|
18403
|
+
overflow-y: overlay;
|
|
18404
|
+
width: 100%;
|
|
18405
|
+
height: 100%;
|
|
18406
|
+
|
|
18407
|
+
/* Firefox */
|
|
18408
|
+
@supports (scrollbar-width: thin) {
|
|
18409
|
+
.scroll {
|
|
18410
|
+
scrollbar-color: ${({ theme: theme4 }) => `${theme4.colors.grey} ${theme4.colors.white}`};
|
|
18411
|
+
scrollbar-width: thin;
|
|
18412
|
+
}
|
|
18413
|
+
}
|
|
18414
|
+
|
|
18415
|
+
/* Chrome/Edge/Safari (WebKit/Blink) */
|
|
18416
|
+
@supports selector(::-webkit-scrollbar) {
|
|
18417
|
+
&::-webkit-scrollbar {
|
|
18418
|
+
width: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
18419
|
+
}
|
|
18420
|
+
&::-webkit-scrollbar-thumb {
|
|
18421
|
+
background: ${({ theme: theme4 }) => theme4.colors.grey};
|
|
18422
|
+
}
|
|
18423
|
+
&::-webkit-scrollbar-track {
|
|
18424
|
+
background: ${({ theme: theme4 }) => theme4.colors.white};
|
|
18425
|
+
}
|
|
18426
|
+
}
|
|
18427
|
+
`;
|
|
18428
|
+
var ListInner = import_styled_components74.default.div`
|
|
18429
|
+
position: relative;
|
|
18430
|
+
width: 100%;
|
|
18431
|
+
`;
|
|
18432
|
+
var EmptyMessage2 = import_styled_components74.default.div`
|
|
18433
|
+
height: 100%;
|
|
18434
|
+
width: 100%;
|
|
18435
|
+
display: flex;
|
|
18436
|
+
align-items: center;
|
|
18437
|
+
justify-content: center;
|
|
18438
|
+
|
|
18439
|
+
${({ theme: theme4 }) => theme4.useTypography("p")}
|
|
18440
|
+
color: ${({ theme: theme4 }) => theme4.getColor("greyishBlue", 80)};
|
|
18441
|
+
`;
|
|
18442
|
+
var MultiHighlight = Checkmark;
|
|
18443
|
+
var SingleHighlight = import_styled_components74.default.div`
|
|
18444
|
+
position: absolute;
|
|
18445
|
+
top: 0;
|
|
18446
|
+
left: 0;
|
|
18447
|
+
height: 100%;
|
|
18448
|
+
width: 3px;
|
|
18449
|
+
|
|
18450
|
+
transition-property: background-color;
|
|
18451
|
+
transition-timing-function: linear;
|
|
18452
|
+
transition-duration: 0.25s;
|
|
18453
|
+
`;
|
|
18454
|
+
var OptionRow = import_styled_components74.default.div`
|
|
18455
|
+
position: absolute;
|
|
18456
|
+
top: 0;
|
|
18457
|
+
left: 0;
|
|
18458
|
+
width: 100%;
|
|
18459
|
+
|
|
18460
|
+
display: flex;
|
|
18461
|
+
align-items: center;
|
|
18462
|
+
gap: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
18463
|
+
|
|
18464
|
+
background-color: ${({ theme: theme4, $active: active }) => active ? theme4.getColor("blue", 15) : theme4.colors.white};
|
|
18465
|
+
padding: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
18466
|
+
|
|
18467
|
+
${({ theme: theme4 }) => theme4.useTypography("p")}
|
|
18468
|
+
color: ${({ theme: theme4 }) => theme4.colors.greyishBlue};
|
|
18469
|
+
|
|
18470
|
+
border-bottom-width: 1px;
|
|
18471
|
+
border-bottom-style: solid;
|
|
18472
|
+
&:nth-last-child(1) {
|
|
18473
|
+
border-bottom-color: transparent;
|
|
18474
|
+
}
|
|
18475
|
+
&:not(:nth-last-child(1)) {
|
|
18476
|
+
border-bottom-color: ${({ theme: theme4 }) => theme4.getColor("greyishBlue", 10)};
|
|
18477
|
+
}
|
|
18478
|
+
|
|
18479
|
+
&[aria-disabled='true'] {
|
|
18480
|
+
cursor: not-allowed;
|
|
18481
|
+
opacity: 0.5;
|
|
18482
|
+
}
|
|
18483
|
+
&:not([aria-disabled='true']) {
|
|
18484
|
+
cursor: pointer;
|
|
18485
|
+
opacity: 1;
|
|
18486
|
+
}
|
|
18487
|
+
|
|
18488
|
+
&[aria-selected='true'] > ${SingleHighlight} {
|
|
18489
|
+
background-color: ${({ theme: theme4 }) => theme4.colors.blue};
|
|
18490
|
+
}
|
|
18491
|
+
&:not([aria-selected='true']) > ${SingleHighlight} {
|
|
18492
|
+
background-color: transparent;
|
|
18493
|
+
}
|
|
18494
|
+
|
|
18495
|
+
> ${MultiHighlight} {
|
|
18496
|
+
background-color: ${({ theme: theme4, $active: active }) => active ? theme4.colors.iceWhite : theme4.colors.white};
|
|
18497
|
+
}
|
|
18498
|
+
|
|
18499
|
+
&[aria-selected='true'] > ${MultiHighlight} {
|
|
18500
|
+
border-color: ${({ theme: theme4 }) => theme4.colors.blue};
|
|
18501
|
+
}
|
|
18502
|
+
&[aria-selected='true'] > ${MultiHighlight}:after {
|
|
18503
|
+
width: 5px;
|
|
18504
|
+
height: 9.5px;
|
|
18505
|
+
border-width: 0 2px 2px 0;
|
|
18506
|
+
left: 5px;
|
|
18507
|
+
top: 1px;
|
|
18508
|
+
}
|
|
18509
|
+
&:not([aria-selected='true']) > ${MultiHighlight} {
|
|
18510
|
+
border-color: ${({ theme: theme4 }) => theme4.colors.lightestGrey};
|
|
18511
|
+
}
|
|
18512
|
+
|
|
18513
|
+
transition-property: background-color, opacity;
|
|
18514
|
+
transition-timing-function: linear;
|
|
18515
|
+
transition-duration: 0.25s;
|
|
18516
|
+
`;
|
|
18517
|
+
|
|
18518
|
+
// src/components/Select/components/Scroll/index.tsx
|
|
18519
|
+
var import_jsx_runtime362 = require("react/jsx-runtime");
|
|
18520
|
+
var Scroll = import_react75.default.forwardRef(
|
|
18521
|
+
({
|
|
18522
|
+
menuId,
|
|
18523
|
+
loading,
|
|
18524
|
+
options,
|
|
18525
|
+
virtualItems,
|
|
18526
|
+
totalSize,
|
|
18527
|
+
measureElement,
|
|
18528
|
+
OptionComponent,
|
|
18529
|
+
onClickOption,
|
|
18530
|
+
onMouseEnterOption,
|
|
18531
|
+
activeIndex,
|
|
18532
|
+
getKey,
|
|
18533
|
+
getIsSelected,
|
|
18534
|
+
getFailedRuleByKey,
|
|
18535
|
+
mode,
|
|
18536
|
+
...props
|
|
18537
|
+
}, ref) => {
|
|
18538
|
+
const Highlight = mode === "single" ? SingleHighlight : MultiHighlight;
|
|
18539
|
+
return /* @__PURE__ */ (0, import_jsx_runtime362.jsxs)(ListContainer, { children: [
|
|
18540
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(Loader_default, { filled: true }) : options.length < 1 ? /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(EmptyMessage2, { children: "Nenhuma op\xE7\xE3o encontrada" }) : null,
|
|
18541
|
+
/* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
|
|
18542
|
+
ListScroll,
|
|
18543
|
+
{
|
|
18544
|
+
ref,
|
|
18545
|
+
id: menuId,
|
|
18546
|
+
role: "listbox",
|
|
18547
|
+
...props,
|
|
18548
|
+
onMouseDown: (e) => e.preventDefault(),
|
|
18549
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(ListInner, { style: { height: `${totalSize}px` }, children: virtualItems.map((virtualItem) => {
|
|
18550
|
+
const option = options[virtualItem.index];
|
|
18551
|
+
if (!option) return null;
|
|
18552
|
+
const optionKey = getKey(option);
|
|
18553
|
+
const failedRule = getFailedRuleByKey(optionKey);
|
|
18554
|
+
const disabled = Boolean(failedRule);
|
|
18555
|
+
const isSelected = getIsSelected(optionKey);
|
|
18556
|
+
const isActive = activeIndex === virtualItem.index;
|
|
18557
|
+
const Component5 = failedRule?.Component;
|
|
18558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
|
|
18559
|
+
Popup_default,
|
|
18560
|
+
{
|
|
18561
|
+
enabled: Boolean(Component5),
|
|
18562
|
+
content: () => /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(Component5, { option }),
|
|
18563
|
+
on: "click",
|
|
18564
|
+
closeOnClip: true,
|
|
18565
|
+
placement: "right",
|
|
18566
|
+
triggerProps: {
|
|
18567
|
+
ref: measureElement,
|
|
18568
|
+
onMouseEnter: () => onMouseEnterOption(virtualItem.index),
|
|
18569
|
+
onClick: () => onClickOption(virtualItem.index)
|
|
18570
|
+
},
|
|
18571
|
+
renderTrigger: (props2) => /* @__PURE__ */ (0, import_jsx_runtime362.jsxs)(
|
|
18572
|
+
OptionRow,
|
|
18573
|
+
{
|
|
18574
|
+
id: `${menuId}-option-${virtualItem.index}`,
|
|
18575
|
+
"data-index": virtualItem.index,
|
|
18576
|
+
role: "option",
|
|
18577
|
+
"aria-selected": isSelected,
|
|
18578
|
+
"aria-disabled": disabled,
|
|
18579
|
+
$active: isActive,
|
|
18580
|
+
style: {
|
|
18581
|
+
transform: `translateY(${virtualItem.start}px)`
|
|
18582
|
+
},
|
|
18583
|
+
...props2,
|
|
18584
|
+
children: [
|
|
18585
|
+
/* @__PURE__ */ (0, import_jsx_runtime362.jsx)(Highlight, {}),
|
|
18586
|
+
/* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
|
|
18587
|
+
OptionComponent,
|
|
18588
|
+
{
|
|
18589
|
+
option,
|
|
18590
|
+
isActive,
|
|
18591
|
+
isSelected,
|
|
18592
|
+
isDisabled: disabled
|
|
18593
|
+
}
|
|
18594
|
+
)
|
|
18595
|
+
]
|
|
18596
|
+
}
|
|
18597
|
+
)
|
|
18598
|
+
},
|
|
18599
|
+
optionKey
|
|
18600
|
+
);
|
|
18601
|
+
}) })
|
|
18602
|
+
}
|
|
18603
|
+
)
|
|
18604
|
+
] });
|
|
18605
|
+
}
|
|
18606
|
+
);
|
|
18607
|
+
var Scroll_default = Scroll;
|
|
18608
|
+
|
|
18609
|
+
// src/components/Select/components/Search/index.tsx
|
|
18610
|
+
var import_react76 = __toESM(require("react"));
|
|
18611
|
+
|
|
18612
|
+
// src/components/Select/components/Search/styles.ts
|
|
18613
|
+
var import_styled_components75 = __toESM(require("styled-components"));
|
|
18614
|
+
var SearchContainer = import_styled_components75.default.div`
|
|
18615
|
+
padding: 0 ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
18616
|
+
margin-bottom: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
18617
|
+
|
|
18618
|
+
${({ theme: theme4 }) => theme4.useTypography("p")}
|
|
18619
|
+
|
|
18620
|
+
position: relative;
|
|
18621
|
+
|
|
18622
|
+
> input {
|
|
18623
|
+
width: 100%;
|
|
18624
|
+
min-height: 35px;
|
|
18625
|
+
|
|
18626
|
+
padding-top: 0;
|
|
18627
|
+
/* padding + icon width + gap */
|
|
18628
|
+
padding-right: calc(
|
|
18629
|
+
${({ theme: theme4 }) => `${theme4.spacings.s1} + 24px + ${theme4.spacings.s1}`}
|
|
18630
|
+
);
|
|
18631
|
+
padding-bottom: 0;
|
|
18632
|
+
padding-left: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
18633
|
+
|
|
18634
|
+
outline: none;
|
|
18635
|
+
|
|
18636
|
+
border-style: solid;
|
|
18637
|
+
border-width: 1px;
|
|
18638
|
+
border-color: ${({ theme: theme4 }) => theme4.colors.lightGrey};
|
|
18639
|
+
border-radius: 4px;
|
|
18640
|
+
}
|
|
18641
|
+
|
|
18642
|
+
> :last-child {
|
|
18643
|
+
position: absolute;
|
|
18644
|
+
top: 50%;
|
|
18645
|
+
|
|
18646
|
+
/* parent padding + input padding */
|
|
18647
|
+
right: calc(
|
|
18648
|
+
${({ theme: theme4 }) => `${theme4.spacings.s3} + ${theme4.spacings.s1}`}
|
|
18649
|
+
);
|
|
18650
|
+
transform: translateY(-50%);
|
|
18651
|
+
}
|
|
18652
|
+
`;
|
|
18653
|
+
|
|
18654
|
+
// src/components/Select/components/Search/index.tsx
|
|
18655
|
+
var import_jsx_runtime363 = require("react/jsx-runtime");
|
|
18656
|
+
var Search = import_react76.default.forwardRef(
|
|
18657
|
+
({ menuId, onKeyDown, value: [value, setValue], activeIndex }, ref) => {
|
|
18658
|
+
const [inputRef, setInputRef] = (0, import_react76.useState)(null);
|
|
18659
|
+
return /* @__PURE__ */ (0, import_jsx_runtime363.jsxs)(SearchContainer, { children: [
|
|
18660
|
+
/* @__PURE__ */ (0, import_jsx_runtime363.jsx)(
|
|
18661
|
+
"input",
|
|
18662
|
+
{
|
|
18663
|
+
ref: (node) => {
|
|
18664
|
+
setInputRef(node);
|
|
18665
|
+
if (typeof ref === "function") {
|
|
18666
|
+
ref(node);
|
|
18667
|
+
} else if (ref) {
|
|
18668
|
+
ref.current = node;
|
|
18669
|
+
}
|
|
18670
|
+
},
|
|
18671
|
+
value,
|
|
18672
|
+
onChange: (event) => setValue(event.target.value),
|
|
18673
|
+
onKeyDown,
|
|
18674
|
+
placeholder: "Buscar...",
|
|
18675
|
+
role: "searchbox",
|
|
18676
|
+
"aria-controls": menuId,
|
|
18677
|
+
"aria-activedescendant": activeIndex >= 0 ? `${menuId}-option-${activeIndex}` : void 0
|
|
18678
|
+
}
|
|
18679
|
+
),
|
|
18680
|
+
/* @__PURE__ */ (0, import_jsx_runtime363.jsx)(
|
|
18681
|
+
Icon_default,
|
|
18682
|
+
{
|
|
18683
|
+
type: "feather",
|
|
18684
|
+
...value.length > 0 ? {
|
|
18685
|
+
icon: "x",
|
|
18686
|
+
onClick: (e) => {
|
|
18687
|
+
e.preventDefault();
|
|
18688
|
+
setValue("");
|
|
18689
|
+
inputRef?.focus();
|
|
18690
|
+
},
|
|
18691
|
+
strokeWidth: "4px"
|
|
18692
|
+
} : {
|
|
18693
|
+
icon: "search",
|
|
18694
|
+
onClick: (e) => {
|
|
18695
|
+
e.preventDefault();
|
|
18696
|
+
e.stopPropagation();
|
|
18697
|
+
inputRef?.focus();
|
|
18698
|
+
}
|
|
18699
|
+
}
|
|
18700
|
+
}
|
|
18701
|
+
)
|
|
18702
|
+
] });
|
|
18703
|
+
}
|
|
18704
|
+
);
|
|
18705
|
+
var Search_default2 = Search;
|
|
18706
|
+
|
|
18707
|
+
// src/components/Select/instances/styles.ts
|
|
18708
|
+
var import_styled_components76 = __toESM(require("styled-components"));
|
|
18709
|
+
var Header14 = import_styled_components76.default.div`
|
|
18710
|
+
padding: 0 ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
18711
|
+
margin: ${({ theme: theme4 }) => theme4.spacings.s1} 0;
|
|
18712
|
+
display: flex;
|
|
18713
|
+
gap: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
18714
|
+
justify-content: space-between;
|
|
18715
|
+
align-items: center;
|
|
18716
|
+
`;
|
|
18717
|
+
var DraftSwitch = import_styled_components76.default.button`
|
|
18718
|
+
background: none;
|
|
18719
|
+
border: none;
|
|
18720
|
+
outline: none;
|
|
18721
|
+
padding: 0;
|
|
18722
|
+
display: flex;
|
|
18723
|
+
align-items: center;
|
|
18724
|
+
gap: calc(${({ theme: theme4 }) => theme4.spacings.s1} / 2);
|
|
18725
|
+
|
|
18726
|
+
${({ theme: theme4 }) => theme4.useTypography("h4")}
|
|
18727
|
+
color: ${({ theme: theme4 }) => theme4.getColor("black", 80)};
|
|
18728
|
+
|
|
18729
|
+
transition-property: color;
|
|
18730
|
+
transition-duration: 0.4s;
|
|
18731
|
+
transition-timing-function: ease-in-out;
|
|
18732
|
+
|
|
18733
|
+
&:not(:disabled) {
|
|
18734
|
+
cursor: pointer;
|
|
18735
|
+
}
|
|
18736
|
+
|
|
18737
|
+
&:not(:disabled):hover {
|
|
18738
|
+
color: ${({ theme: theme4 }) => theme4.colors.blue};
|
|
18739
|
+
}
|
|
18740
|
+
|
|
18741
|
+
> span:nth-child(1) {
|
|
18742
|
+
position: relative;
|
|
18743
|
+
width: calc(${({ theme: theme4 }) => theme4.spacings.s3} * 2);
|
|
18744
|
+
height: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
18745
|
+
background-color: ${({ theme: theme4 }) => theme4.colors.warningGray};
|
|
18746
|
+
border-radius: 20px;
|
|
18747
|
+
transition-property: background-color;
|
|
18748
|
+
transition-duration: 0.4s;
|
|
18749
|
+
transition-timing-function: ease-in-out;
|
|
18750
|
+
box-sizing: content-box;
|
|
18751
|
+
|
|
18752
|
+
&:before {
|
|
18753
|
+
content: '';
|
|
18754
|
+
transition-property: left, transform;
|
|
18755
|
+
transition-duration: 0.4s;
|
|
18756
|
+
transition-timing-function: ease-in-out;
|
|
18757
|
+
position: absolute;
|
|
18758
|
+
border-width: 1px;
|
|
18759
|
+
border-style: solid;
|
|
18760
|
+
border-radius: 100%;
|
|
18761
|
+
border-color: ${({ theme: theme4 }) => theme4.colors.lightGrey};
|
|
18762
|
+
left: 0;
|
|
18763
|
+
box-shadow: 0px 1px 3px ${({ theme: theme4 }) => theme4.getColor("black", 10)};
|
|
18764
|
+
width: 50%;
|
|
18765
|
+
height: 100%;
|
|
18766
|
+
background-color: ${({ theme: theme4 }) => theme4.colors.white};
|
|
18767
|
+
box-sizing: border-box;
|
|
18768
|
+
}
|
|
18769
|
+
}
|
|
18770
|
+
|
|
18771
|
+
&[aria-checked='true'] > span:nth-child(1) {
|
|
18772
|
+
background-color: ${({ theme: theme4 }) => theme4.colors.blue};
|
|
18773
|
+
}
|
|
18774
|
+
|
|
18775
|
+
&[aria-checked='true'] > span:nth-child(1):before {
|
|
18776
|
+
left: 100%;
|
|
18777
|
+
transform: translateX(-100%);
|
|
18778
|
+
}
|
|
18779
|
+
`;
|
|
18780
|
+
var SelectAllButton = import_styled_components76.default.button`
|
|
18781
|
+
background: none;
|
|
18782
|
+
border: none;
|
|
18783
|
+
outline: none;
|
|
18784
|
+
padding: 0;
|
|
18785
|
+
|
|
18786
|
+
${({ theme: theme4 }) => theme4.useTypography("h6")}
|
|
18787
|
+
color: ${({ theme: theme4 }) => theme4.colors.greyishBlue};
|
|
18788
|
+
|
|
18789
|
+
transition-property: color;
|
|
18790
|
+
transition-duration: 0.25s;
|
|
18791
|
+
transition-timing-function: linear;
|
|
18792
|
+
|
|
18793
|
+
&:not(:disabled) {
|
|
18794
|
+
cursor: pointer;
|
|
18795
|
+
}
|
|
18796
|
+
|
|
18797
|
+
&:not(:disabled):hover {
|
|
18798
|
+
color: ${({ theme: theme4 }) => theme4.colors.blue};
|
|
18799
|
+
}
|
|
18800
|
+
`;
|
|
18801
|
+
|
|
18802
|
+
// src/components/Select/instances/multi/index.tsx
|
|
18803
|
+
var import_jsx_runtime364 = require("react/jsx-runtime");
|
|
18804
|
+
var buildMap = (values, getKey) => {
|
|
18805
|
+
return new Map(values.map((option) => [getKey(option), option]));
|
|
18806
|
+
};
|
|
18807
|
+
var paginate = () => {
|
|
18808
|
+
};
|
|
18809
|
+
var useDraftOptions = (draft, finder) => {
|
|
18810
|
+
const {
|
|
18811
|
+
current: [searchInput, setSearchInput],
|
|
18812
|
+
debounced: [search]
|
|
18813
|
+
} = useDebouncedState_default("", () => {
|
|
18814
|
+
}, SEARCH_DEBOUNCE_MS);
|
|
18815
|
+
const options = (0, import_react77.useMemo)(() => {
|
|
18816
|
+
const options2 = Array.from(draft.values());
|
|
18817
|
+
if (!search) return options2;
|
|
18818
|
+
return finder(search, options2);
|
|
18819
|
+
}, [draft, search, finder]);
|
|
18820
|
+
return {
|
|
18821
|
+
options,
|
|
18822
|
+
loading: false,
|
|
18823
|
+
paginate,
|
|
18824
|
+
searchInput: [searchInput, setSearchInput]
|
|
18825
|
+
};
|
|
18826
|
+
};
|
|
18827
|
+
var useDraft = (value, getKey) => {
|
|
18828
|
+
const [draft, setDraft] = (0, import_react77.useState)(() => ({
|
|
18829
|
+
options: buildMap(value, getKey),
|
|
18830
|
+
on: false
|
|
18831
|
+
}));
|
|
18832
|
+
const setOptions = (value2) => {
|
|
18833
|
+
setDraft((prev) => {
|
|
18834
|
+
const v = typeof value2 === "function" ? value2(prev.options) : value2;
|
|
18835
|
+
if (v === prev.options) return prev;
|
|
18836
|
+
return {
|
|
18837
|
+
options: v,
|
|
18838
|
+
on: prev.on && v.size > 0
|
|
18839
|
+
};
|
|
18840
|
+
});
|
|
18841
|
+
};
|
|
18842
|
+
const setOn = (value2) => {
|
|
18843
|
+
setDraft((prev) => {
|
|
18844
|
+
const v = typeof value2 === "function" ? value2(prev.on) : value2;
|
|
18845
|
+
if (v === prev.on) return prev;
|
|
18846
|
+
return {
|
|
18847
|
+
options: prev.options,
|
|
18848
|
+
on: v && prev.options.size > 0
|
|
18849
|
+
};
|
|
18850
|
+
});
|
|
18851
|
+
};
|
|
18852
|
+
return {
|
|
18853
|
+
draft: [draft.options, setOptions],
|
|
18854
|
+
switchDraft: [draft.on, setOn]
|
|
18855
|
+
};
|
|
18856
|
+
};
|
|
18857
|
+
var SelectMultiOptions = ({
|
|
18858
|
+
loader: loader2,
|
|
18859
|
+
getKey,
|
|
18860
|
+
OptionComponent,
|
|
18861
|
+
rules,
|
|
18862
|
+
overscan,
|
|
18863
|
+
estimateSize,
|
|
18864
|
+
value,
|
|
18865
|
+
setValue,
|
|
18866
|
+
menuId,
|
|
18867
|
+
onClose,
|
|
18868
|
+
clearable = false,
|
|
18869
|
+
finder,
|
|
18870
|
+
applyRules = []
|
|
18871
|
+
}) => {
|
|
18872
|
+
const {
|
|
18873
|
+
draft: [draft, setDraft],
|
|
18874
|
+
switchDraft: [switchDraft, setSwitchDraft]
|
|
18875
|
+
} = useDraft(value, getKey);
|
|
18876
|
+
const asyncOptions = useAsyncOptions_default(loader2);
|
|
18877
|
+
const draftOptions = useDraftOptions(draft, finder);
|
|
18878
|
+
const {
|
|
18879
|
+
options,
|
|
18880
|
+
loading,
|
|
18881
|
+
paginate: paginate2,
|
|
18882
|
+
searchInput: [searchInput, setSearchInput]
|
|
18883
|
+
} = switchDraft ? draftOptions : asyncOptions;
|
|
18884
|
+
const { getFailedRuleByKey, enabledCount } = useRuleIndex_default({
|
|
18885
|
+
options,
|
|
18886
|
+
getKey,
|
|
18887
|
+
rules
|
|
18888
|
+
});
|
|
18889
|
+
const { listRef, searchRef, rowVirtualizer, virtualItems } = useVirtualizedOptions_default({
|
|
18890
|
+
optionsLength: options.length,
|
|
18891
|
+
loading,
|
|
18892
|
+
onPaginate: paginate2,
|
|
18893
|
+
overscan,
|
|
18894
|
+
estimateSize
|
|
18895
|
+
});
|
|
18896
|
+
const isIndexDisabled = (index) => {
|
|
18897
|
+
const option = options[index];
|
|
18898
|
+
if (!option) return true;
|
|
18899
|
+
return Boolean(getFailedRuleByKey(getKey(option)));
|
|
18900
|
+
};
|
|
18901
|
+
const onToggleByIndex = (index) => {
|
|
18902
|
+
const option = options[index];
|
|
18903
|
+
if (!option) return;
|
|
18904
|
+
if (isIndexDisabled(index)) {
|
|
18905
|
+
searchRef.current?.focus();
|
|
18906
|
+
return;
|
|
18907
|
+
}
|
|
18908
|
+
const key = getKey(option);
|
|
18909
|
+
setDraft((current) => {
|
|
18910
|
+
const next = new Map(current);
|
|
18911
|
+
if (next.has(key)) {
|
|
18912
|
+
next.delete(key);
|
|
18913
|
+
} else {
|
|
18914
|
+
next.set(key, option);
|
|
18915
|
+
}
|
|
18916
|
+
return next;
|
|
18917
|
+
});
|
|
18918
|
+
};
|
|
18919
|
+
const navigation = useListNavigation_default({
|
|
18920
|
+
itemCount: options.length,
|
|
18921
|
+
isItemDisabled: isIndexDisabled,
|
|
18922
|
+
onSelect: onToggleByIndex,
|
|
18923
|
+
scrollToIndex: rowVirtualizer.scrollToIndex
|
|
18924
|
+
});
|
|
18925
|
+
const onSelectAll = () => {
|
|
18926
|
+
setDraft((current) => {
|
|
18927
|
+
const next = new Map(current);
|
|
18928
|
+
options.forEach((option) => {
|
|
18929
|
+
const key = getKey(option);
|
|
18930
|
+
if (!getFailedRuleByKey(key)) {
|
|
18931
|
+
next.set(key, option);
|
|
18932
|
+
}
|
|
18933
|
+
});
|
|
18934
|
+
return next;
|
|
18935
|
+
});
|
|
18936
|
+
};
|
|
18937
|
+
const onUnselectAll = () => {
|
|
18938
|
+
setDraft(/* @__PURE__ */ new Map([]));
|
|
18939
|
+
};
|
|
18940
|
+
const getIsSelected = (0, import_react77.useCallback)((key) => draft.has(key), [draft]);
|
|
18941
|
+
return /* @__PURE__ */ (0, import_jsx_runtime364.jsxs)(import_react77.default.Fragment, { children: [
|
|
18942
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsxs)(Header14, { children: [
|
|
18943
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsxs)(
|
|
18944
|
+
DraftSwitch,
|
|
18945
|
+
{
|
|
18946
|
+
type: "button",
|
|
18947
|
+
role: "switch",
|
|
18948
|
+
"aria-checked": switchDraft,
|
|
18949
|
+
onClick: () => setSwitchDraft((prev) => !prev),
|
|
18950
|
+
disabled: draft.size < 1,
|
|
18951
|
+
children: [
|
|
18952
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsx)("span", {}),
|
|
18953
|
+
"Selecionados (",
|
|
18954
|
+
draft.size,
|
|
18955
|
+
")"
|
|
18956
|
+
]
|
|
18957
|
+
}
|
|
18958
|
+
),
|
|
18959
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
|
|
18960
|
+
SelectAllButton,
|
|
18961
|
+
{
|
|
18962
|
+
type: "button",
|
|
18963
|
+
...enabledCount > 0 && enabledCount === draft.size ? {
|
|
18964
|
+
onClick: onUnselectAll,
|
|
18965
|
+
children: "Desselecionar tudo"
|
|
18966
|
+
} : {
|
|
18967
|
+
onClick: onSelectAll,
|
|
18968
|
+
children: "Selecionar tudo",
|
|
18969
|
+
disabled: enabledCount < 1
|
|
18970
|
+
}
|
|
18971
|
+
}
|
|
18972
|
+
)
|
|
18973
|
+
] }),
|
|
18974
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
|
|
18975
|
+
Search_default2,
|
|
18976
|
+
{
|
|
18977
|
+
ref: searchRef,
|
|
18978
|
+
menuId,
|
|
18979
|
+
value: [searchInput, setSearchInput],
|
|
18980
|
+
activeIndex: navigation.activeIndex,
|
|
18981
|
+
onKeyDown: navigation.onKeyDown
|
|
18982
|
+
}
|
|
18983
|
+
),
|
|
18984
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
|
|
18985
|
+
Scroll_default,
|
|
18986
|
+
{
|
|
18987
|
+
ref: listRef,
|
|
18988
|
+
menuId,
|
|
18989
|
+
options,
|
|
18990
|
+
virtualItems,
|
|
18991
|
+
totalSize: rowVirtualizer.getTotalSize(),
|
|
18992
|
+
measureElement: rowVirtualizer.measureElement,
|
|
18993
|
+
loading,
|
|
18994
|
+
OptionComponent,
|
|
18995
|
+
onClickOption: onToggleByIndex,
|
|
18996
|
+
onMouseEnterOption: navigation.onMouseEnter,
|
|
18997
|
+
activeIndex: navigation.activeIndex,
|
|
18998
|
+
getKey,
|
|
18999
|
+
getIsSelected,
|
|
19000
|
+
getFailedRuleByKey,
|
|
19001
|
+
mode: "multi",
|
|
19002
|
+
"aria-multiselectable": true
|
|
19003
|
+
}
|
|
19004
|
+
),
|
|
19005
|
+
/* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
|
|
19006
|
+
Apply_default,
|
|
19007
|
+
{
|
|
19008
|
+
setValue,
|
|
19009
|
+
onClose,
|
|
19010
|
+
draft,
|
|
19011
|
+
clearable,
|
|
19012
|
+
applyRules
|
|
19013
|
+
}
|
|
19014
|
+
)
|
|
19015
|
+
] });
|
|
19016
|
+
};
|
|
19017
|
+
var useMultiSelect = ({
|
|
19018
|
+
label,
|
|
19019
|
+
loader: loader2,
|
|
19020
|
+
getKey,
|
|
19021
|
+
OptionComponent,
|
|
19022
|
+
rules,
|
|
19023
|
+
placeholder = "Selecione",
|
|
19024
|
+
required,
|
|
19025
|
+
invalid,
|
|
19026
|
+
clearable,
|
|
19027
|
+
readOnly,
|
|
19028
|
+
viewMode,
|
|
19029
|
+
overscan,
|
|
19030
|
+
estimateSize,
|
|
19031
|
+
height,
|
|
19032
|
+
value,
|
|
19033
|
+
setValue,
|
|
19034
|
+
finder,
|
|
19035
|
+
applyRules,
|
|
19036
|
+
...buttonProps
|
|
19037
|
+
}) => {
|
|
19038
|
+
const closedLabel = (0, import_react77.useMemo)(() => {
|
|
19039
|
+
if (value.length < 1) {
|
|
19040
|
+
return viewMode ? /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(import_react77.default.Fragment, { children: "\xA0" }) : placeholder;
|
|
19041
|
+
}
|
|
19042
|
+
return `H\xE1 ${value.length} op\xE7\xF5es selecionadas`;
|
|
19043
|
+
}, [placeholder, value.length, viewMode]);
|
|
19044
|
+
return {
|
|
19045
|
+
isEmpty: value.length === 0,
|
|
19046
|
+
placeholder: closedLabel,
|
|
19047
|
+
onClear: () => setValue([]),
|
|
19048
|
+
Component: SelectMultiOptions,
|
|
19049
|
+
buttonProps
|
|
19050
|
+
};
|
|
19051
|
+
};
|
|
19052
|
+
var multi_default = useMultiSelect;
|
|
19053
|
+
|
|
19054
|
+
// src/components/Select/instances/single/index.tsx
|
|
19055
|
+
var import_react78 = __toESM(require("react"));
|
|
19056
|
+
var import_jsx_runtime365 = require("react/jsx-runtime");
|
|
19057
|
+
var SelectSingleOptions = ({
|
|
19058
|
+
loader: loader2,
|
|
19059
|
+
getKey,
|
|
19060
|
+
OptionComponent,
|
|
19061
|
+
rules,
|
|
19062
|
+
overscan,
|
|
19063
|
+
estimateSize,
|
|
19064
|
+
value,
|
|
19065
|
+
setValue,
|
|
19066
|
+
menuId,
|
|
19067
|
+
onClose,
|
|
19068
|
+
clearable
|
|
19069
|
+
}) => {
|
|
19070
|
+
const {
|
|
19071
|
+
options,
|
|
19072
|
+
loading,
|
|
19073
|
+
paginate: paginate2,
|
|
19074
|
+
searchInput: [searchInput, setSearchInput]
|
|
19075
|
+
} = useAsyncOptions_default(loader2);
|
|
19076
|
+
const { getFailedRuleByKey } = useRuleIndex_default({
|
|
19077
|
+
options,
|
|
19078
|
+
getKey,
|
|
19079
|
+
rules
|
|
19080
|
+
});
|
|
19081
|
+
const { listRef, searchRef, rowVirtualizer, virtualItems } = useVirtualizedOptions_default({
|
|
19082
|
+
optionsLength: options.length,
|
|
19083
|
+
loading,
|
|
19084
|
+
onPaginate: paginate2,
|
|
19085
|
+
overscan,
|
|
19086
|
+
estimateSize
|
|
19087
|
+
});
|
|
19088
|
+
const selectedKey = value ? getKey(value) : null;
|
|
19089
|
+
const isIndexDisabled = (index) => {
|
|
19090
|
+
const option = options[index];
|
|
19091
|
+
if (!option) return true;
|
|
19092
|
+
return Boolean(getFailedRuleByKey(getKey(option)));
|
|
19093
|
+
};
|
|
19094
|
+
const onToggleByIndex = (index) => {
|
|
19095
|
+
const option = options[index];
|
|
19096
|
+
if (!option) return;
|
|
19097
|
+
if (isIndexDisabled(index)) {
|
|
19098
|
+
searchRef.current?.focus();
|
|
19099
|
+
return;
|
|
19100
|
+
}
|
|
19101
|
+
const optionKey = getKey(option);
|
|
19102
|
+
if (selectedKey === optionKey) {
|
|
19103
|
+
if (!clearable) return;
|
|
19104
|
+
setValue(null);
|
|
19105
|
+
} else {
|
|
19106
|
+
setValue(option);
|
|
19107
|
+
}
|
|
19108
|
+
onClose();
|
|
19109
|
+
};
|
|
19110
|
+
const navigation = useListNavigation_default({
|
|
19111
|
+
itemCount: options.length,
|
|
19112
|
+
isItemDisabled: isIndexDisabled,
|
|
19113
|
+
onSelect: onToggleByIndex,
|
|
19114
|
+
scrollToIndex: rowVirtualizer.scrollToIndex
|
|
19115
|
+
});
|
|
19116
|
+
const getIsSelected = (0, import_react78.useCallback)(
|
|
19117
|
+
(key) => selectedKey === key,
|
|
19118
|
+
[selectedKey]
|
|
19119
|
+
);
|
|
19120
|
+
return /* @__PURE__ */ (0, import_jsx_runtime365.jsxs)(import_react78.default.Fragment, { children: [
|
|
19121
|
+
/* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
|
|
19122
|
+
Search_default2,
|
|
19123
|
+
{
|
|
19124
|
+
ref: searchRef,
|
|
19125
|
+
menuId,
|
|
19126
|
+
value: [searchInput, setSearchInput],
|
|
19127
|
+
activeIndex: navigation.activeIndex,
|
|
19128
|
+
onKeyDown: navigation.onKeyDown
|
|
19129
|
+
}
|
|
19130
|
+
),
|
|
19131
|
+
/* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
|
|
19132
|
+
Scroll_default,
|
|
19133
|
+
{
|
|
19134
|
+
ref: listRef,
|
|
19135
|
+
menuId,
|
|
19136
|
+
options,
|
|
19137
|
+
virtualItems,
|
|
19138
|
+
totalSize: rowVirtualizer.getTotalSize(),
|
|
19139
|
+
measureElement: rowVirtualizer.measureElement,
|
|
19140
|
+
loading,
|
|
19141
|
+
OptionComponent,
|
|
19142
|
+
onClickOption: onToggleByIndex,
|
|
19143
|
+
onMouseEnterOption: navigation.onMouseEnter,
|
|
19144
|
+
activeIndex: navigation.activeIndex,
|
|
19145
|
+
getKey,
|
|
19146
|
+
getIsSelected,
|
|
19147
|
+
getFailedRuleByKey,
|
|
19148
|
+
mode: "single",
|
|
19149
|
+
"aria-multiselectable": true
|
|
19150
|
+
}
|
|
19151
|
+
)
|
|
19152
|
+
] });
|
|
19153
|
+
};
|
|
19154
|
+
var useSingleSelect = ({
|
|
19155
|
+
label,
|
|
19156
|
+
loader: loader2,
|
|
19157
|
+
getKey,
|
|
19158
|
+
OptionComponent,
|
|
19159
|
+
rules,
|
|
19160
|
+
placeholder = "Selecione",
|
|
19161
|
+
required,
|
|
19162
|
+
invalid,
|
|
19163
|
+
clearable,
|
|
19164
|
+
readOnly,
|
|
19165
|
+
viewMode,
|
|
19166
|
+
overscan,
|
|
19167
|
+
estimateSize,
|
|
19168
|
+
height,
|
|
19169
|
+
value,
|
|
19170
|
+
setValue,
|
|
19171
|
+
ValueComponent,
|
|
19172
|
+
...buttonProps
|
|
19173
|
+
}) => {
|
|
19174
|
+
const ClosedValueComponent = ValueComponent || OptionComponent;
|
|
19175
|
+
const closedLabel = (0, import_react78.useMemo)(() => {
|
|
19176
|
+
if (!value) {
|
|
19177
|
+
return viewMode ? /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(import_react78.default.Fragment, { children: "\xA0" }) : placeholder;
|
|
19178
|
+
}
|
|
19179
|
+
return /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
|
|
19180
|
+
ClosedValueComponent,
|
|
19181
|
+
{
|
|
19182
|
+
option: value,
|
|
19183
|
+
isActive: false,
|
|
19184
|
+
isSelected: true,
|
|
19185
|
+
isDisabled: false
|
|
19186
|
+
}
|
|
19187
|
+
);
|
|
19188
|
+
}, [ClosedValueComponent, placeholder, value, viewMode]);
|
|
19189
|
+
return {
|
|
19190
|
+
isEmpty: !value,
|
|
19191
|
+
placeholder: closedLabel,
|
|
19192
|
+
onClear: () => setValue(null),
|
|
19193
|
+
Component: SelectSingleOptions,
|
|
19194
|
+
buttonProps
|
|
19195
|
+
};
|
|
19196
|
+
};
|
|
19197
|
+
var single_default = useSingleSelect;
|
|
19198
|
+
|
|
19199
|
+
// src/components/Select/instances/index.tsx
|
|
19200
|
+
var useSelect2 = (props) => {
|
|
19201
|
+
return props.type === "multi-select" ? multi_default(props) : single_default(props);
|
|
19202
|
+
};
|
|
19203
|
+
var instances_default = useSelect2;
|
|
19204
|
+
|
|
19205
|
+
// src/components/Select/styles.ts
|
|
19206
|
+
var import_styled_components77 = __toESM(require("styled-components"));
|
|
19207
|
+
var FloatingWrapper = import_styled_components77.default.div`
|
|
19208
|
+
z-index: 1000;
|
|
19209
|
+
|
|
19210
|
+
&,
|
|
19211
|
+
& > div {
|
|
19212
|
+
height: var(--height);
|
|
19213
|
+
min-height: var(--height);
|
|
19214
|
+
max-height: var(--height);
|
|
19215
|
+
}
|
|
19216
|
+
|
|
19217
|
+
> div {
|
|
19218
|
+
position: absolute;
|
|
19219
|
+
bottom: 0;
|
|
19220
|
+
left: 0;
|
|
19221
|
+
width: 100%;
|
|
19222
|
+
padding-top: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
19223
|
+
|
|
19224
|
+
display: flex;
|
|
19225
|
+
flex-direction: column;
|
|
19226
|
+
overflow: hidden;
|
|
19227
|
+
}
|
|
19228
|
+
|
|
19229
|
+
transition-property: height, max-height, min-height;
|
|
19230
|
+
transition-timing-function: linear;
|
|
19231
|
+
transition-duration: ${MENU_EXIT_MS}ms;
|
|
19232
|
+
|
|
19233
|
+
background: ${({ theme: theme4 }) => theme4.colors.white};
|
|
19234
|
+
border: 1px solid ${({ theme: theme4 }) => theme4.colors.lightGrey};
|
|
19235
|
+
border-radius: 6px;
|
|
19236
|
+
box-shadow: 0px 3px 6px ${({ theme: theme4 }) => theme4.getColor("black", 15)};
|
|
19237
|
+
overflow: hidden;
|
|
19238
|
+
`;
|
|
19239
|
+
var Trigger = import_styled_components77.default.button`
|
|
19240
|
+
width: 100%;
|
|
19241
|
+
|
|
19242
|
+
transition-property: opacity, border-color, box-shadow, color,
|
|
19243
|
+
background-color;
|
|
19244
|
+
transition-timing-function: linear;
|
|
19245
|
+
transition-duration: 0.25s;
|
|
19246
|
+
|
|
19247
|
+
${({ $viewMode: viewMode }) => viewMode ? import_styled_components77.css`
|
|
19248
|
+
padding: 0;
|
|
19249
|
+
|
|
19250
|
+
border: none;
|
|
19251
|
+
` : import_styled_components77.css`
|
|
19252
|
+
min-height: 35px;
|
|
19253
|
+
padding: 0 ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
19254
|
+
|
|
19255
|
+
border-style: solid;
|
|
19256
|
+
border-width: 1px;
|
|
19257
|
+
border-radius: 4px;
|
|
19258
|
+
`}
|
|
19259
|
+
|
|
19260
|
+
outline: none !important;
|
|
19261
|
+
|
|
19262
|
+
&:focus-visible {
|
|
19263
|
+
box-shadow: 3px 3px 6px ${({ theme: theme4 }) => theme4.getColor("black", 15)};
|
|
19264
|
+
}
|
|
19265
|
+
|
|
19266
|
+
text-align: left;
|
|
19267
|
+
display: flex;
|
|
19268
|
+
align-items: center;
|
|
19269
|
+
justify-content: space-between;
|
|
19270
|
+
gap: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
19271
|
+
|
|
19272
|
+
${({ theme: theme4 }) => theme4.useTypography("p")}
|
|
19273
|
+
|
|
19274
|
+
&[aria-invalid='true'] {
|
|
19275
|
+
border-color: ${({ theme: theme4 }) => theme4.colors.warningRed};
|
|
19276
|
+
color: ${({ theme: theme4 }) => theme4.colors.warningRed};
|
|
19277
|
+
background-color: ${({ theme: theme4 }) => theme4.getColor("warningRed", 5)};
|
|
19278
|
+
}
|
|
19279
|
+
&:not([aria-invalid='true']) {
|
|
19280
|
+
border-color: ${({ theme: theme4 }) => theme4.colors.lightGrey};
|
|
19281
|
+
color: ${({ theme: theme4, $empty: empty }) => {
|
|
19282
|
+
return empty ? theme4.colors.darkGrey : theme4.colors.darkBlue;
|
|
19283
|
+
}};
|
|
19284
|
+
background-color: ${({ theme: theme4 }) => theme4.colors.white};
|
|
19285
|
+
}
|
|
19286
|
+
|
|
19287
|
+
&:disabled {
|
|
19288
|
+
opacity: 0.5;
|
|
19289
|
+
}
|
|
19290
|
+
|
|
19291
|
+
&:not(:disabled),
|
|
19292
|
+
&:not([aria-readonly='true']) {
|
|
19293
|
+
cursor: pointer;
|
|
19294
|
+
}
|
|
19295
|
+
|
|
19296
|
+
&:disabled,
|
|
19297
|
+
&[aria-readonly='true'] {
|
|
19298
|
+
pointer-events: none;
|
|
19299
|
+
}
|
|
19300
|
+
|
|
19301
|
+
> i {
|
|
19302
|
+
transition-property: transform;
|
|
19303
|
+
transition-timing-function: linear;
|
|
19304
|
+
transition-duration: 0.25s;
|
|
19305
|
+
transform: rotate(${({ $open: open }) => open ? "180deg" : "0deg"});
|
|
19306
|
+
}
|
|
19307
|
+
`;
|
|
19308
|
+
var TriggerValue = import_styled_components77.default.div`
|
|
19309
|
+
flex: 1;
|
|
19310
|
+
min-width: 0;
|
|
19311
|
+
overflow: hidden;
|
|
19312
|
+
white-space: nowrap;
|
|
19313
|
+
text-overflow: ellipsis;
|
|
19314
|
+
`;
|
|
19315
|
+
var Label11 = import_styled_components77.default.label`
|
|
19316
|
+
display: inline-block;
|
|
19317
|
+
margin-bottom: ${({ theme: theme4, $viewMode: viewMode }) => theme4.spacings[viewMode ? "s3" : "s1"]};
|
|
19318
|
+
|
|
19319
|
+
${({ theme: theme4, $viewMode: viewMode }) => theme4.useTypography("p", {
|
|
19320
|
+
fontWeight: viewMode ? "bold" : "normal"
|
|
19321
|
+
})}
|
|
19322
|
+
color: ${({ theme: theme4 }) => theme4.colors.greyishBlue};
|
|
19323
|
+
|
|
19324
|
+
transition-property: opacity, border-color, box-shadow, color,
|
|
19325
|
+
background-color;
|
|
19326
|
+
transition-timing-function: linear;
|
|
19327
|
+
transition-duration: 0.25s;
|
|
19328
|
+
|
|
19329
|
+
&:has(+ [aria-required='true']):after {
|
|
19330
|
+
content: ' *';
|
|
19331
|
+
}
|
|
19332
|
+
|
|
19333
|
+
&:has(+ :disabled) {
|
|
19334
|
+
opacity: 0.5;
|
|
19335
|
+
}
|
|
19336
|
+
`;
|
|
19337
|
+
var OptionContainer = import_styled_components77.default.div`
|
|
19338
|
+
display: flex;
|
|
19339
|
+
flex-direction: column;
|
|
19340
|
+
gap: calc(${({ theme: theme4 }) => theme4.spacings.s1} / 2);
|
|
19341
|
+
overflow: hidden;
|
|
19342
|
+
|
|
19343
|
+
> div {
|
|
19344
|
+
display: flex;
|
|
19345
|
+
gap: calc(${({ theme: theme4 }) => theme4.spacings.s1} / 2);
|
|
19346
|
+
color: ${({ theme: theme4 }) => theme4.colors.darkBlue};
|
|
19347
|
+
white-space: nowrap;
|
|
19348
|
+
}
|
|
19349
|
+
|
|
19350
|
+
> div:nth-child(1) {
|
|
19351
|
+
${({ theme: theme4 }) => theme4.useTypography("p")}
|
|
19352
|
+
}
|
|
19353
|
+
|
|
19354
|
+
> div:not(:nth-child(1)) {
|
|
19355
|
+
${({ theme: theme4 }) => theme4.useTypography("h6")}
|
|
19356
|
+
opacity: 0.5;
|
|
19357
|
+
}
|
|
19358
|
+
`;
|
|
19359
|
+
|
|
19360
|
+
// src/components/Select/index.tsx
|
|
19361
|
+
var import_jsx_runtime366 = require("react/jsx-runtime");
|
|
19362
|
+
var Select2 = import_react79.default.forwardRef(
|
|
19363
|
+
(props, ref) => {
|
|
19364
|
+
const [open, setOpen] = (0, import_react79.useState)(false);
|
|
19365
|
+
const id = props.id || (0, import_react79.useId)();
|
|
19366
|
+
const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
|
|
19367
|
+
props.name
|
|
19368
|
+
);
|
|
19369
|
+
const invalid = isInvalid2() || props.invalid;
|
|
19370
|
+
const required = isRequired() || props.required;
|
|
19371
|
+
const disabled = isDisabled() || props.disabled;
|
|
19372
|
+
const viewMode = isViewMode() || props.viewMode;
|
|
19373
|
+
const { floating, transition, interactions } = useFloatingMenu_default({
|
|
19374
|
+
open,
|
|
19375
|
+
onOpenChange: setOpen
|
|
19376
|
+
});
|
|
19377
|
+
const height = (0, import_react79.useMemo)(() => {
|
|
19378
|
+
if (transition.status !== "open") return 0;
|
|
19379
|
+
if (props.height !== void 0) return props.height;
|
|
19380
|
+
return props.type === "single-select" ? 240 : 260;
|
|
19381
|
+
}, [transition.status !== "open", props.type, props.height]);
|
|
19382
|
+
const menuId = (0, import_react79.useId)();
|
|
19383
|
+
const onTriggerKeyDown = (event) => {
|
|
19384
|
+
if (!open && ["ArrowDown", "ArrowUp", "Enter", " "].includes(event.key)) {
|
|
19385
|
+
event.preventDefault();
|
|
19386
|
+
setOpen(true);
|
|
19387
|
+
}
|
|
19388
|
+
};
|
|
19389
|
+
const { isEmpty, placeholder, Component: Component5, onClear, buttonProps } = instances_default(props);
|
|
19390
|
+
return /* @__PURE__ */ (0, import_jsx_runtime366.jsxs)(import_react79.default.Fragment, { children: [
|
|
19391
|
+
props.label !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(Label11, { htmlFor: id, $viewMode: viewMode, children: props.label }),
|
|
19392
|
+
/* @__PURE__ */ (0, import_jsx_runtime366.jsxs)(
|
|
19393
|
+
Trigger,
|
|
19394
|
+
{
|
|
19395
|
+
id,
|
|
19396
|
+
type: "button",
|
|
19397
|
+
role: "combobox",
|
|
19398
|
+
"aria-haspopup": "listbox",
|
|
19399
|
+
"aria-expanded": open,
|
|
19400
|
+
"aria-controls": menuId,
|
|
19401
|
+
$open: open,
|
|
19402
|
+
$empty: isEmpty,
|
|
19403
|
+
$viewMode: viewMode,
|
|
19404
|
+
"aria-readonly": props.readOnly || viewMode,
|
|
19405
|
+
"aria-invalid": invalid,
|
|
19406
|
+
"aria-required": required && !viewMode,
|
|
19407
|
+
...interactions.getReferenceProps({
|
|
19408
|
+
...buttonProps,
|
|
19409
|
+
disabled,
|
|
19410
|
+
onClick: (event) => {
|
|
19411
|
+
if (props.readOnly || viewMode || disabled) return;
|
|
19412
|
+
setOpen((current) => !current);
|
|
19413
|
+
buttonProps.onClick?.(event);
|
|
19414
|
+
},
|
|
19415
|
+
onKeyDown: (event) => {
|
|
19416
|
+
if (props.readOnly || viewMode || props.disabled) return;
|
|
19417
|
+
onTriggerKeyDown(event);
|
|
19418
|
+
buttonProps.onKeyDown?.(event);
|
|
19419
|
+
}
|
|
19420
|
+
}),
|
|
19421
|
+
ref: (node) => {
|
|
19422
|
+
floating.refs.setReference(node);
|
|
19423
|
+
if (typeof ref === "function") {
|
|
19424
|
+
ref(node);
|
|
19425
|
+
} else if (ref) {
|
|
19426
|
+
ref.current = node;
|
|
19427
|
+
}
|
|
19428
|
+
},
|
|
19429
|
+
children: [
|
|
19430
|
+
/* @__PURE__ */ (0, import_jsx_runtime366.jsx)(TriggerValue, { children: placeholder }),
|
|
19431
|
+
!viewMode && /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
|
|
19432
|
+
Icon_default,
|
|
19433
|
+
{
|
|
19434
|
+
width: "14px",
|
|
19435
|
+
color: props.invalid ? colors.warningRed : colors.darkGrey,
|
|
19436
|
+
...!isEmpty && props.clearable && !props.disabled && !props.readOnly ? {
|
|
19437
|
+
type: "feather",
|
|
19438
|
+
icon: "x",
|
|
19439
|
+
onClick: (e) => {
|
|
19440
|
+
e.stopPropagation();
|
|
19441
|
+
onClear();
|
|
19442
|
+
},
|
|
19443
|
+
strokeWidth: "4px"
|
|
19444
|
+
} : {
|
|
19445
|
+
type: "semantic",
|
|
19446
|
+
icon: "caret down"
|
|
19447
|
+
}
|
|
19448
|
+
}
|
|
19449
|
+
)
|
|
19450
|
+
]
|
|
19451
|
+
}
|
|
19452
|
+
),
|
|
19453
|
+
transition.isMounted ? /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(import_react80.FloatingPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
|
|
19454
|
+
FloatingWrapper,
|
|
19455
|
+
{
|
|
19456
|
+
ref: floating.refs.setFloating,
|
|
19457
|
+
style: {
|
|
19458
|
+
...floating.floatingStyles,
|
|
19459
|
+
"--height": `${height}px`
|
|
19460
|
+
},
|
|
19461
|
+
...interactions.getFloatingProps(),
|
|
19462
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
|
|
19463
|
+
Component5,
|
|
19464
|
+
{
|
|
19465
|
+
...props,
|
|
19466
|
+
menuId,
|
|
19467
|
+
onClose: () => setOpen(false)
|
|
19468
|
+
}
|
|
19469
|
+
) })
|
|
19470
|
+
}
|
|
19471
|
+
) }) : null
|
|
19472
|
+
] });
|
|
19473
|
+
}
|
|
19474
|
+
);
|
|
19475
|
+
var Select_default3 = Object.assign(Select2, {
|
|
19476
|
+
OptionContainer
|
|
19477
|
+
});
|
|
19478
|
+
|
|
19479
|
+
// src/components/Signature/index.tsx
|
|
19480
|
+
var import_react81 = require("react");
|
|
19481
|
+
var import_react_signature_canvas = __toESM(require("react-signature-canvas"));
|
|
19482
|
+
|
|
19483
|
+
// src/components/Signature/styles.ts
|
|
19484
|
+
var import_styled_components78 = __toESM(require("styled-components"));
|
|
19485
|
+
var Container26 = import_styled_components78.default.div`
|
|
19486
|
+
width: 100%;
|
|
19487
|
+
height: 100%;
|
|
19488
|
+
|
|
19489
|
+
display: flex;
|
|
19490
|
+
flex-direction: column;
|
|
19491
|
+
gap: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
19492
|
+
`;
|
|
19493
|
+
var CanvasContainer = import_styled_components78.default.div`
|
|
19494
|
+
position: relative;
|
|
19495
|
+
flex: 1;
|
|
19496
|
+
overflow: hidden;
|
|
19497
|
+
background-color: ${({ theme: theme4, $invalid: invalid }) => invalid ? theme4.getColor("warningRed", 5) : theme4.colors.white};
|
|
19498
|
+
|
|
19499
|
+
&[data-placeholder]:before {
|
|
19500
|
+
content: attr(data-placeholder);
|
|
19501
|
+
position: absolute;
|
|
19502
|
+
top: 50%;
|
|
19503
|
+
left: 50%;
|
|
19504
|
+
transform: translate(-50%, -50%);
|
|
19505
|
+
text-align: center;
|
|
19506
|
+
|
|
19507
|
+
color: ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "darkBlue"]};
|
|
19508
|
+
|
|
19509
|
+
${({ theme: theme4 }) => theme4.useTypography("h1")}
|
|
19510
|
+
font-size: 59px;
|
|
19511
|
+
line-height: 71px;
|
|
19512
|
+
opacity: 0.1;
|
|
19513
|
+
z-index: 1;
|
|
19514
|
+
}
|
|
19515
|
+
|
|
19516
|
+
canvas {
|
|
19517
|
+
position: relative;
|
|
19518
|
+
display: block;
|
|
19519
|
+
width: 100%;
|
|
19520
|
+
height: 100%;
|
|
19521
|
+
box-sizing: border-box;
|
|
19522
|
+
border: 1px solid
|
|
19523
|
+
${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "lightGrey"]};
|
|
19524
|
+
border-radius: 4px;
|
|
19525
|
+
z-index: 2;
|
|
19526
|
+
}
|
|
19527
|
+
|
|
19528
|
+
/* icons container */
|
|
19529
|
+
> div:nth-child(1) {
|
|
19530
|
+
position: absolute;
|
|
19531
|
+
top: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
19532
|
+
right: ${({ theme: theme4 }) => theme4.spacings.s3};
|
|
19533
|
+
display: flex;
|
|
19534
|
+
gap: ${({ theme: theme4 }) => theme4.spacings.s1};
|
|
19535
|
+
z-index: 3;
|
|
19536
|
+
|
|
19537
|
+
> button {
|
|
19538
|
+
padding: 0;
|
|
19539
|
+
outline: none;
|
|
19540
|
+
border: none;
|
|
19541
|
+
background: none;
|
|
19542
|
+
|
|
19543
|
+
> i.icon,
|
|
19544
|
+
> i.icon:before {
|
|
19545
|
+
color: #4e4e4e;
|
|
19546
|
+
font-size: 20px;
|
|
19547
|
+
line-height: 20px;
|
|
19548
|
+
width: 20px;
|
|
19549
|
+
}
|
|
19550
|
+
|
|
19551
|
+
&:not(:disabled) {
|
|
19552
|
+
cursor: pointer;
|
|
19553
|
+
}
|
|
19554
|
+
&:disabled {
|
|
19555
|
+
opacity: 0.5;
|
|
19556
|
+
}
|
|
19557
|
+
|
|
19558
|
+
transition: opacity 0.25s linear;
|
|
19559
|
+
}
|
|
19560
|
+
}
|
|
19561
|
+
`;
|
|
19562
|
+
|
|
19563
|
+
// src/components/Signature/index.tsx
|
|
19564
|
+
var import_jsx_runtime367 = require("react/jsx-runtime");
|
|
19565
|
+
var FONTS = [
|
|
19566
|
+
"GreatVibes",
|
|
19567
|
+
"Pacifico",
|
|
19568
|
+
"Allura"
|
|
19569
|
+
];
|
|
19570
|
+
var FONT_SIZE = 64;
|
|
19571
|
+
var voidFn = () => {
|
|
19572
|
+
};
|
|
19573
|
+
var SignatureInput = ({
|
|
19574
|
+
setValue,
|
|
19575
|
+
value,
|
|
19576
|
+
penColor,
|
|
19577
|
+
backgroundColor,
|
|
19578
|
+
invalid,
|
|
17702
19579
|
label = "Digite seu nome",
|
|
17703
19580
|
inputPlaceholder = "Digite seu nome",
|
|
17704
19581
|
canvasPlaceholder = "Assine aqui",
|
|
@@ -17706,12 +19583,12 @@ var SignatureInput = ({
|
|
|
17706
19583
|
onEnd = voidFn,
|
|
17707
19584
|
...props
|
|
17708
19585
|
}) => {
|
|
17709
|
-
const [name, setName] = (0,
|
|
17710
|
-
const [font, setFont] = (0,
|
|
17711
|
-
const [showPlaceholder, setShowPlaceholder] = (0,
|
|
17712
|
-
const [loading, setLoading] = (0,
|
|
17713
|
-
const [ref, setRef] = (0,
|
|
17714
|
-
(0,
|
|
19586
|
+
const [name, setName] = (0, import_react81.useState)("");
|
|
19587
|
+
const [font, setFont] = (0, import_react81.useState)(FONTS[0]);
|
|
19588
|
+
const [showPlaceholder, setShowPlaceholder] = (0, import_react81.useState)(true);
|
|
19589
|
+
const [loading, setLoading] = (0, import_react81.useState)(false);
|
|
19590
|
+
const [ref, setRef] = (0, import_react81.useState)(null);
|
|
19591
|
+
(0, import_react81.useEffect)(() => {
|
|
17715
19592
|
if (!ref) return;
|
|
17716
19593
|
const refreshValue = () => {
|
|
17717
19594
|
if (ref.isEmpty() && !value) return;
|
|
@@ -17724,7 +19601,7 @@ var SignatureInput = ({
|
|
|
17724
19601
|
window.addEventListener("resize", refreshValue);
|
|
17725
19602
|
return () => window.removeEventListener("resize", refreshValue);
|
|
17726
19603
|
}, [ref, value]);
|
|
17727
|
-
const setByText = (0,
|
|
19604
|
+
const setByText = (0, import_react81.useCallback)(
|
|
17728
19605
|
async (name2, font2) => {
|
|
17729
19606
|
if (!ref) return;
|
|
17730
19607
|
const trimmed = name2.trim();
|
|
@@ -17753,14 +19630,14 @@ var SignatureInput = ({
|
|
|
17753
19630
|
},
|
|
17754
19631
|
[ref]
|
|
17755
19632
|
);
|
|
17756
|
-
const onBeginHandler = (0,
|
|
19633
|
+
const onBeginHandler = (0, import_react81.useCallback)(
|
|
17757
19634
|
(event) => {
|
|
17758
19635
|
onBegin(event, ref);
|
|
17759
19636
|
setShowPlaceholder(false);
|
|
17760
19637
|
},
|
|
17761
19638
|
[ref, onBegin]
|
|
17762
19639
|
);
|
|
17763
|
-
const onEndHandler = (0,
|
|
19640
|
+
const onEndHandler = (0, import_react81.useCallback)(
|
|
17764
19641
|
(event) => {
|
|
17765
19642
|
onEnd(event, ref);
|
|
17766
19643
|
if (!ref || ref.isEmpty()) return;
|
|
@@ -17768,19 +19645,19 @@ var SignatureInput = ({
|
|
|
17768
19645
|
},
|
|
17769
19646
|
[ref, onEnd]
|
|
17770
19647
|
);
|
|
17771
|
-
const onApplyHandler = (0,
|
|
19648
|
+
const onApplyHandler = (0, import_react81.useCallback)(() => {
|
|
17772
19649
|
setByText(name, font);
|
|
17773
19650
|
}, [name, font, setByText]);
|
|
17774
|
-
const onClearHandler = (0,
|
|
19651
|
+
const onClearHandler = (0, import_react81.useCallback)(() => {
|
|
17775
19652
|
if (!ref) return;
|
|
17776
19653
|
setShowPlaceholder(true);
|
|
17777
19654
|
setName("");
|
|
17778
19655
|
ref.clear();
|
|
17779
19656
|
setValue("");
|
|
17780
19657
|
}, [ref]);
|
|
17781
|
-
const empty = (0,
|
|
17782
|
-
return /* @__PURE__ */ (0,
|
|
17783
|
-
/* @__PURE__ */ (0,
|
|
19658
|
+
const empty = (0, import_react81.useMemo)(() => !value && (!ref || ref.isEmpty()), [ref, value]);
|
|
19659
|
+
return /* @__PURE__ */ (0, import_jsx_runtime367.jsxs)(Container26, { children: [
|
|
19660
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
|
|
17784
19661
|
Input_default,
|
|
17785
19662
|
{
|
|
17786
19663
|
label,
|
|
@@ -17803,7 +19680,7 @@ var SignatureInput = ({
|
|
|
17803
19680
|
} : {}
|
|
17804
19681
|
}
|
|
17805
19682
|
),
|
|
17806
|
-
/* @__PURE__ */ (0,
|
|
19683
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsxs)(
|
|
17807
19684
|
CanvasContainer,
|
|
17808
19685
|
{
|
|
17809
19686
|
$invalid: invalid,
|
|
@@ -17811,8 +19688,8 @@ var SignatureInput = ({
|
|
|
17811
19688
|
"data-placeholder": canvasPlaceholder
|
|
17812
19689
|
} : {},
|
|
17813
19690
|
children: [
|
|
17814
|
-
/* @__PURE__ */ (0,
|
|
17815
|
-
/* @__PURE__ */ (0,
|
|
19691
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsxs)("div", { children: [
|
|
19692
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
|
|
17816
19693
|
"button",
|
|
17817
19694
|
{
|
|
17818
19695
|
type: "button",
|
|
@@ -17825,10 +19702,10 @@ var SignatureInput = ({
|
|
|
17825
19702
|
},
|
|
17826
19703
|
disabled: loading || name.trim().length < 1,
|
|
17827
19704
|
title: "Trocar fonte",
|
|
17828
|
-
children: /* @__PURE__ */ (0,
|
|
19705
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Icon_default, { type: "semantic", icon: "font" })
|
|
17829
19706
|
}
|
|
17830
19707
|
),
|
|
17831
|
-
/* @__PURE__ */ (0,
|
|
19708
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
|
|
17832
19709
|
"button",
|
|
17833
19710
|
{
|
|
17834
19711
|
type: "button",
|
|
@@ -17838,12 +19715,12 @@ var SignatureInput = ({
|
|
|
17838
19715
|
},
|
|
17839
19716
|
disabled: empty,
|
|
17840
19717
|
title: "Recortar",
|
|
17841
|
-
children: /* @__PURE__ */ (0,
|
|
19718
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Icon_default, { type: "semantic", icon: "cut" })
|
|
17842
19719
|
}
|
|
17843
19720
|
),
|
|
17844
|
-
/* @__PURE__ */ (0,
|
|
19721
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsx)("button", { onClick: onClearHandler, disabled: empty, title: "Limpar", children: /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Icon_default, { type: "semantic", icon: "eraser" }) })
|
|
17845
19722
|
] }),
|
|
17846
|
-
/* @__PURE__ */ (0,
|
|
19723
|
+
/* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
|
|
17847
19724
|
import_react_signature_canvas.default,
|
|
17848
19725
|
{
|
|
17849
19726
|
ref: setRef,
|
|
@@ -17862,17 +19739,17 @@ var SignatureInput = ({
|
|
|
17862
19739
|
var Signature_default = SignatureInput;
|
|
17863
19740
|
|
|
17864
19741
|
// src/components/Tabs/index.tsx
|
|
17865
|
-
var
|
|
19742
|
+
var import_react87 = __toESM(require("react"));
|
|
17866
19743
|
|
|
17867
19744
|
// src/components/Tabs/components/ScrollButtons/index.tsx
|
|
17868
|
-
var
|
|
19745
|
+
var import_react83 = __toESM(require("react"));
|
|
17869
19746
|
|
|
17870
19747
|
// src/components/Tabs/components/ScrollButton/index.tsx
|
|
17871
|
-
var
|
|
19748
|
+
var import_react82 = require("react");
|
|
17872
19749
|
|
|
17873
19750
|
// src/components/Tabs/components/ScrollButton/styled.ts
|
|
17874
|
-
var
|
|
17875
|
-
var Container27 =
|
|
19751
|
+
var import_styled_components79 = __toESM(require("styled-components"));
|
|
19752
|
+
var Container27 = import_styled_components79.default.div`
|
|
17876
19753
|
position: absolute;
|
|
17877
19754
|
top: 0;
|
|
17878
19755
|
height: 100%;
|
|
@@ -17895,31 +19772,31 @@ var Container27 = import_styled_components73.default.div`
|
|
|
17895
19772
|
`;
|
|
17896
19773
|
|
|
17897
19774
|
// src/components/Tabs/components/ScrollButton/index.tsx
|
|
17898
|
-
var
|
|
19775
|
+
var import_jsx_runtime368 = require("react/jsx-runtime");
|
|
17899
19776
|
var ScrollButton = (props) => {
|
|
17900
19777
|
const { mode, visible, scrollRef } = props;
|
|
17901
19778
|
const icon = `chevron_${mode}`;
|
|
17902
|
-
const onClick = (0,
|
|
19779
|
+
const onClick = (0, import_react82.useCallback)(() => {
|
|
17903
19780
|
if (!scrollRef) return;
|
|
17904
19781
|
scrollRef.scrollBy({
|
|
17905
19782
|
left: mode === "left" ? -(scrollRef.scrollWidth + 1) : scrollRef.scrollWidth,
|
|
17906
19783
|
behavior: "smooth"
|
|
17907
19784
|
});
|
|
17908
19785
|
}, [scrollRef, mode]);
|
|
17909
|
-
return /* @__PURE__ */ (0,
|
|
19786
|
+
return /* @__PURE__ */ (0, import_jsx_runtime368.jsx)(
|
|
17910
19787
|
Container27,
|
|
17911
19788
|
{
|
|
17912
19789
|
className: ["scroll-arrow", ...visible ? ["visible"] : []].join(" "),
|
|
17913
19790
|
onClick,
|
|
17914
|
-
children: /* @__PURE__ */ (0,
|
|
19791
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime368.jsx)(Icon_default, { type: "feather", icon, width: 16, height: 16, color: "black" })
|
|
17915
19792
|
}
|
|
17916
19793
|
);
|
|
17917
19794
|
};
|
|
17918
19795
|
var ScrollButton_default = ScrollButton;
|
|
17919
19796
|
|
|
17920
19797
|
// src/components/Tabs/components/ScrollButtons/styled.ts
|
|
17921
|
-
var
|
|
17922
|
-
var Container28 =
|
|
19798
|
+
var import_styled_components80 = __toESM(require("styled-components"));
|
|
19799
|
+
var Container28 = import_styled_components80.default.div`
|
|
17923
19800
|
overflow-x: auto;
|
|
17924
19801
|
scrollbar-width: thin;
|
|
17925
19802
|
scroll-behavior: smooth;
|
|
@@ -17934,19 +19811,19 @@ var Container28 = import_styled_components74.default.div`
|
|
|
17934
19811
|
display: none; /* Chrome, Safari, Opera */
|
|
17935
19812
|
}
|
|
17936
19813
|
|
|
17937
|
-
${({ theme: theme4, $internal: internal }) => internal &&
|
|
19814
|
+
${({ theme: theme4, $internal: internal }) => internal && import_styled_components80.css`
|
|
17938
19815
|
gap: ${theme4.spacings.s6};
|
|
17939
19816
|
`}
|
|
17940
19817
|
`;
|
|
17941
19818
|
|
|
17942
19819
|
// src/components/Tabs/components/ScrollButtons/index.tsx
|
|
17943
|
-
var
|
|
19820
|
+
var import_jsx_runtime369 = require("react/jsx-runtime");
|
|
17944
19821
|
var ScrollButtons = (props) => {
|
|
17945
19822
|
const { activeTabIndex, tabsLength } = props;
|
|
17946
|
-
const [ref, setRef] = (0,
|
|
17947
|
-
const [showLeftArrow, setShowLeftArrow] = (0,
|
|
17948
|
-
const [showRightArrow, setShowRightArrow] = (0,
|
|
17949
|
-
const checkScrollPosition = (0,
|
|
19823
|
+
const [ref, setRef] = (0, import_react83.useState)(null);
|
|
19824
|
+
const [showLeftArrow, setShowLeftArrow] = (0, import_react83.useState)(false);
|
|
19825
|
+
const [showRightArrow, setShowRightArrow] = (0, import_react83.useState)(false);
|
|
19826
|
+
const checkScrollPosition = (0, import_react83.useCallback)(() => {
|
|
17950
19827
|
if (!ref) return;
|
|
17951
19828
|
if (ref.scrollWidth > ref.offsetWidth) {
|
|
17952
19829
|
const { scrollLeft, scrollWidth, clientWidth } = ref;
|
|
@@ -17957,12 +19834,12 @@ var ScrollButtons = (props) => {
|
|
|
17957
19834
|
setShowRightArrow(false);
|
|
17958
19835
|
}
|
|
17959
19836
|
}, [ref]);
|
|
17960
|
-
(0,
|
|
19837
|
+
(0, import_react83.useEffect)(() => {
|
|
17961
19838
|
checkScrollPosition();
|
|
17962
19839
|
window.addEventListener("resize", checkScrollPosition);
|
|
17963
19840
|
return () => window.removeEventListener("resize", checkScrollPosition);
|
|
17964
19841
|
}, [checkScrollPosition, tabsLength]);
|
|
17965
|
-
(0,
|
|
19842
|
+
(0, import_react83.useEffect)(() => {
|
|
17966
19843
|
if (!ref) return;
|
|
17967
19844
|
if (ref.scrollWidth <= ref.offsetWidth) return;
|
|
17968
19845
|
const element = ref.children[activeTabIndex];
|
|
@@ -17972,9 +19849,9 @@ var ScrollButtons = (props) => {
|
|
|
17972
19849
|
inline: "nearest"
|
|
17973
19850
|
});
|
|
17974
19851
|
}, [activeTabIndex, ref]);
|
|
17975
|
-
return /* @__PURE__ */ (0,
|
|
17976
|
-
/* @__PURE__ */ (0,
|
|
17977
|
-
/* @__PURE__ */ (0,
|
|
19852
|
+
return /* @__PURE__ */ (0, import_jsx_runtime369.jsxs)(import_react83.default.Fragment, { children: [
|
|
19853
|
+
/* @__PURE__ */ (0, import_jsx_runtime369.jsx)(ScrollButton_default, { scrollRef: ref, mode: "left", visible: showLeftArrow }),
|
|
19854
|
+
/* @__PURE__ */ (0, import_jsx_runtime369.jsx)(
|
|
17978
19855
|
Container28,
|
|
17979
19856
|
{
|
|
17980
19857
|
ref: setRef,
|
|
@@ -17989,13 +19866,13 @@ var ScrollButtons = (props) => {
|
|
|
17989
19866
|
children: props.children
|
|
17990
19867
|
}
|
|
17991
19868
|
),
|
|
17992
|
-
/* @__PURE__ */ (0,
|
|
19869
|
+
/* @__PURE__ */ (0, import_jsx_runtime369.jsx)(ScrollButton_default, { scrollRef: ref, mode: "right", visible: showRightArrow })
|
|
17993
19870
|
] });
|
|
17994
19871
|
};
|
|
17995
19872
|
var ScrollButtons_default = ScrollButtons;
|
|
17996
19873
|
|
|
17997
19874
|
// src/components/Tabs/components/TabItem/index.tsx
|
|
17998
|
-
var
|
|
19875
|
+
var import_react86 = __toESM(require("react"));
|
|
17999
19876
|
|
|
18000
19877
|
// src/components/Tabs/functions.ts
|
|
18001
19878
|
var sortTabs = (tabs, sorted = []) => {
|
|
@@ -18043,11 +19920,11 @@ var buildComponent = (component, provider) => {
|
|
|
18043
19920
|
};
|
|
18044
19921
|
|
|
18045
19922
|
// src/components/Tabs/components/TabItem/components/Close/index.tsx
|
|
18046
|
-
var
|
|
19923
|
+
var import_react84 = require("react");
|
|
18047
19924
|
|
|
18048
19925
|
// src/components/Tabs/components/TabItem/components/Close/styles.ts
|
|
18049
|
-
var
|
|
18050
|
-
var Close =
|
|
19926
|
+
var import_styled_components81 = __toESM(require("styled-components"));
|
|
19927
|
+
var Close = import_styled_components81.default.div`
|
|
18051
19928
|
position: relative;
|
|
18052
19929
|
z-index: 2;
|
|
18053
19930
|
display: flex;
|
|
@@ -18073,7 +19950,7 @@ var Close = import_styled_components75.default.div`
|
|
|
18073
19950
|
`;
|
|
18074
19951
|
|
|
18075
19952
|
// src/components/Tabs/components/TabItem/components/Close/index.tsx
|
|
18076
|
-
var
|
|
19953
|
+
var import_jsx_runtime370 = require("react/jsx-runtime");
|
|
18077
19954
|
var Close2 = (props) => {
|
|
18078
19955
|
const {
|
|
18079
19956
|
index,
|
|
@@ -18081,7 +19958,7 @@ var Close2 = (props) => {
|
|
|
18081
19958
|
options: [options, setOptions]
|
|
18082
19959
|
} = props;
|
|
18083
19960
|
const onClose = props.onClose || (() => true);
|
|
18084
|
-
const onClickClose = (0,
|
|
19961
|
+
const onClickClose = (0, import_react84.useCallback)(
|
|
18085
19962
|
async (event) => {
|
|
18086
19963
|
if (options.length === 1) return;
|
|
18087
19964
|
const newOptions = [...options];
|
|
@@ -18095,7 +19972,7 @@ var Close2 = (props) => {
|
|
|
18095
19972
|
},
|
|
18096
19973
|
[options, active, index, onClose]
|
|
18097
19974
|
);
|
|
18098
|
-
return /* @__PURE__ */ (0,
|
|
19975
|
+
return /* @__PURE__ */ (0, import_jsx_runtime370.jsx)(Close, { children: /* @__PURE__ */ (0, import_jsx_runtime370.jsx)(
|
|
18099
19976
|
Icon_default,
|
|
18100
19977
|
{
|
|
18101
19978
|
type: "feather",
|
|
@@ -18110,11 +19987,11 @@ var Close2 = (props) => {
|
|
|
18110
19987
|
var Close_default = Close2;
|
|
18111
19988
|
|
|
18112
19989
|
// src/components/Tabs/components/TabItem/components/LabelItem/index.tsx
|
|
18113
|
-
var
|
|
19990
|
+
var import_react85 = require("react");
|
|
18114
19991
|
|
|
18115
19992
|
// src/components/Tabs/components/TabItem/components/LabelItem/styled.ts
|
|
18116
|
-
var
|
|
18117
|
-
var StyledTab =
|
|
19993
|
+
var import_styled_components82 = __toESM(require("styled-components"));
|
|
19994
|
+
var StyledTab = import_styled_components82.default.div`
|
|
18118
19995
|
position: relative;
|
|
18119
19996
|
flex: 1;
|
|
18120
19997
|
white-space: nowrap;
|
|
@@ -18147,7 +20024,7 @@ var StyledTab = import_styled_components76.default.div`
|
|
|
18147
20024
|
transition: --color 0.5s, --bgColor 0.5s;
|
|
18148
20025
|
}
|
|
18149
20026
|
|
|
18150
|
-
${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal &&
|
|
20027
|
+
${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal && import_styled_components82.css`
|
|
18151
20028
|
&::before {
|
|
18152
20029
|
content: '';
|
|
18153
20030
|
position: absolute;
|
|
@@ -18163,11 +20040,11 @@ var StyledTab = import_styled_components76.default.div`
|
|
|
18163
20040
|
`;
|
|
18164
20041
|
|
|
18165
20042
|
// src/components/Tabs/components/TabItem/components/LabelItem/index.tsx
|
|
18166
|
-
var
|
|
20043
|
+
var import_jsx_runtime371 = require("react/jsx-runtime");
|
|
18167
20044
|
var LabelItem = (props) => {
|
|
18168
20045
|
const { children, onClick, primary, hasSiblings, internal } = props;
|
|
18169
|
-
const [ref, setRef] = (0,
|
|
18170
|
-
return /* @__PURE__ */ (0,
|
|
20046
|
+
const [ref, setRef] = (0, import_react85.useState)(null);
|
|
20047
|
+
return /* @__PURE__ */ (0, import_jsx_runtime371.jsx)(
|
|
18171
20048
|
StyledTab,
|
|
18172
20049
|
{
|
|
18173
20050
|
ref: setRef,
|
|
@@ -18186,8 +20063,8 @@ var LabelItem = (props) => {
|
|
|
18186
20063
|
var LabelItem_default = LabelItem;
|
|
18187
20064
|
|
|
18188
20065
|
// src/components/Tabs/components/TabItem/styled.ts
|
|
18189
|
-
var
|
|
18190
|
-
var Container29 =
|
|
20066
|
+
var import_styled_components83 = __toESM(require("styled-components"));
|
|
20067
|
+
var Container29 = import_styled_components83.default.div`
|
|
18191
20068
|
@property --bgColor {
|
|
18192
20069
|
syntax: '<color>';
|
|
18193
20070
|
initial-value: #ffffff;
|
|
@@ -18221,8 +20098,8 @@ var Container29 = import_styled_components77.default.div`
|
|
|
18221
20098
|
`;
|
|
18222
20099
|
|
|
18223
20100
|
// src/components/Tabs/components/TabItem/index.tsx
|
|
18224
|
-
var
|
|
18225
|
-
var VoidClose = () => /* @__PURE__ */ (0,
|
|
20101
|
+
var import_jsx_runtime372 = require("react/jsx-runtime");
|
|
20102
|
+
var VoidClose = () => /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(import_react86.default.Fragment, {});
|
|
18226
20103
|
var TabItem = (props) => {
|
|
18227
20104
|
const {
|
|
18228
20105
|
active: [active, setActive],
|
|
@@ -18232,16 +20109,16 @@ var TabItem = (props) => {
|
|
|
18232
20109
|
alwaysOpen
|
|
18233
20110
|
} = props;
|
|
18234
20111
|
const CloseComponent = alwaysOpen || tabs.length < 2 ? VoidClose : Close_default;
|
|
18235
|
-
return /* @__PURE__ */ (0,
|
|
20112
|
+
return /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(import_react86.default.Fragment, { children: sortedTabs.map(({ index, ...tab }) => {
|
|
18236
20113
|
const isActive = index === active;
|
|
18237
20114
|
const hasSiblings = hasChildren(tabs, tab.group);
|
|
18238
20115
|
const canClose = !props.internal && (!tab.primary || !hasSiblings);
|
|
18239
|
-
return /* @__PURE__ */ (0,
|
|
20116
|
+
return /* @__PURE__ */ (0, import_jsx_runtime372.jsxs)(
|
|
18240
20117
|
Container29,
|
|
18241
20118
|
{
|
|
18242
20119
|
...isActive ? { className: "active" } : {},
|
|
18243
20120
|
children: [
|
|
18244
|
-
/* @__PURE__ */ (0,
|
|
20121
|
+
/* @__PURE__ */ (0, import_jsx_runtime372.jsx)(
|
|
18245
20122
|
LabelItem_default,
|
|
18246
20123
|
{
|
|
18247
20124
|
children: tab.label,
|
|
@@ -18251,7 +20128,7 @@ var TabItem = (props) => {
|
|
|
18251
20128
|
internal: props.internal
|
|
18252
20129
|
}
|
|
18253
20130
|
),
|
|
18254
|
-
canClose && /* @__PURE__ */ (0,
|
|
20131
|
+
canClose && /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(
|
|
18255
20132
|
CloseComponent,
|
|
18256
20133
|
{
|
|
18257
20134
|
index,
|
|
@@ -18269,13 +20146,13 @@ var TabItem = (props) => {
|
|
|
18269
20146
|
var TabItem_default = TabItem;
|
|
18270
20147
|
|
|
18271
20148
|
// src/components/Tabs/styled.ts
|
|
18272
|
-
var
|
|
20149
|
+
var import_styled_components84 = __toESM(require("styled-components"));
|
|
18273
20150
|
var delimiters = {
|
|
18274
20151
|
blue: ["blue"],
|
|
18275
20152
|
grey: ["warningGray"]
|
|
18276
20153
|
};
|
|
18277
|
-
var ComponentContainer =
|
|
18278
|
-
var Tabs =
|
|
20154
|
+
var ComponentContainer = import_styled_components84.default.div``;
|
|
20155
|
+
var Tabs = import_styled_components84.default.div`
|
|
18279
20156
|
position: relative;
|
|
18280
20157
|
overflow: hidden;
|
|
18281
20158
|
|
|
@@ -18290,7 +20167,7 @@ var Tabs = import_styled_components78.default.div`
|
|
|
18290
20167
|
bottom: "s4",
|
|
18291
20168
|
left: "0"
|
|
18292
20169
|
}).split(" ");
|
|
18293
|
-
return
|
|
20170
|
+
return import_styled_components84.css`
|
|
18294
20171
|
margin: ${top} 0 ${bottom} 0;
|
|
18295
20172
|
padding: 0 ${right} 0 ${left};
|
|
18296
20173
|
`;
|
|
@@ -18298,7 +20175,7 @@ var Tabs = import_styled_components78.default.div`
|
|
|
18298
20175
|
|
|
18299
20176
|
${({ theme: theme4, $internal: internal, $delimiter: delimiter }) => {
|
|
18300
20177
|
const border = delimiter === "none" ? "none" : internal ? `1px solid ${theme4.getColor(...delimiters[delimiter || "grey"])}` : `2px solid ${theme4.getColor(...delimiters[delimiter || "blue"])}`;
|
|
18301
|
-
return
|
|
20178
|
+
return import_styled_components84.css`
|
|
18302
20179
|
border-bottom: ${border};
|
|
18303
20180
|
+ ${ComponentContainer} {
|
|
18304
20181
|
border: 1px solid ${theme4.getColor(...delimiters.grey)};
|
|
@@ -18327,12 +20204,12 @@ var Tabs = import_styled_components78.default.div`
|
|
|
18327
20204
|
`;
|
|
18328
20205
|
|
|
18329
20206
|
// src/components/Tabs/index.tsx
|
|
18330
|
-
var
|
|
18331
|
-
var VoidProvider = (props) => /* @__PURE__ */ (0,
|
|
20207
|
+
var import_jsx_runtime373 = require("react/jsx-runtime");
|
|
20208
|
+
var VoidProvider = (props) => /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(import_react87.default.Fragment, { children: props.children });
|
|
18332
20209
|
var Component4 = (props) => {
|
|
18333
20210
|
const components = props.components || {};
|
|
18334
|
-
const [options, setOptions] = typeof props.options[1] === "function" ? props.options : (0,
|
|
18335
|
-
const [active, setActive] = Array.isArray(props.active) ? props.active : (0,
|
|
20211
|
+
const [options, setOptions] = typeof props.options[1] === "function" ? props.options : (0, import_react87.useState)(props.options);
|
|
20212
|
+
const [active, setActive] = Array.isArray(props.active) ? props.active : (0, import_react87.useState)(props.active);
|
|
18336
20213
|
const sortedTabs = sortTabs(options.map((tab, index) => ({ ...tab, index })));
|
|
18337
20214
|
const activeTabIndex = sortedTabs.findIndex((tab) => tab.index === active);
|
|
18338
20215
|
const divProps = filterObject(props, [
|
|
@@ -18346,15 +20223,15 @@ var Component4 = (props) => {
|
|
|
18346
20223
|
"delimiter",
|
|
18347
20224
|
"spacing"
|
|
18348
20225
|
]);
|
|
18349
|
-
return /* @__PURE__ */ (0,
|
|
18350
|
-
/* @__PURE__ */ (0,
|
|
20226
|
+
return /* @__PURE__ */ (0, import_jsx_runtime373.jsxs)(import_react87.default.Fragment, { children: [
|
|
20227
|
+
/* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
|
|
18351
20228
|
Tabs,
|
|
18352
20229
|
{
|
|
18353
20230
|
...divProps,
|
|
18354
20231
|
$internal: props.internal,
|
|
18355
20232
|
$delimiter: props.delimiter,
|
|
18356
20233
|
$spacing: props.spacing,
|
|
18357
|
-
children: /* @__PURE__ */ (0,
|
|
20234
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
|
|
18358
20235
|
ScrollButtons_default,
|
|
18359
20236
|
{
|
|
18360
20237
|
...{
|
|
@@ -18362,7 +20239,7 @@ var Component4 = (props) => {
|
|
|
18362
20239
|
tabsLength: options.length,
|
|
18363
20240
|
internal: props.internal
|
|
18364
20241
|
},
|
|
18365
|
-
children: /* @__PURE__ */ (0,
|
|
20242
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
|
|
18366
20243
|
TabItem_default,
|
|
18367
20244
|
{
|
|
18368
20245
|
active: [active, setActive],
|
|
@@ -18379,7 +20256,7 @@ var Component4 = (props) => {
|
|
|
18379
20256
|
),
|
|
18380
20257
|
options.map((tab, index) => {
|
|
18381
20258
|
if (tab.component === void 0) {
|
|
18382
|
-
return /* @__PURE__ */ (0,
|
|
20259
|
+
return /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(import_react87.default.Fragment, {}, index);
|
|
18383
20260
|
}
|
|
18384
20261
|
const Component5 = components[tab.component];
|
|
18385
20262
|
const Provider7 = Component5.provider || VoidProvider;
|
|
@@ -18399,7 +20276,7 @@ var Component4 = (props) => {
|
|
|
18399
20276
|
return s === label ? prev : { ...prev, label };
|
|
18400
20277
|
});
|
|
18401
20278
|
};
|
|
18402
|
-
return /* @__PURE__ */ (0,
|
|
20279
|
+
return /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
|
|
18403
20280
|
Provider7,
|
|
18404
20281
|
{
|
|
18405
20282
|
label: tab.label,
|
|
@@ -18408,7 +20285,7 @@ var Component4 = (props) => {
|
|
|
18408
20285
|
setLabel,
|
|
18409
20286
|
...index === active ? {
|
|
18410
20287
|
active: true,
|
|
18411
|
-
children: /* @__PURE__ */ (0,
|
|
20288
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(ComponentContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
|
|
18412
20289
|
Component5,
|
|
18413
20290
|
{
|
|
18414
20291
|
data: tab.data,
|
|
@@ -18430,8 +20307,8 @@ var Tabs2 = Object.assign(Component4, {
|
|
|
18430
20307
|
var Tabs_default = Tabs2;
|
|
18431
20308
|
|
|
18432
20309
|
// src/components/TextArea/styles.ts
|
|
18433
|
-
var
|
|
18434
|
-
var Container30 =
|
|
20310
|
+
var import_styled_components85 = __toESM(require("styled-components"));
|
|
20311
|
+
var Container30 = import_styled_components85.default.textarea`
|
|
18435
20312
|
width: ${({ $width: width }) => width};
|
|
18436
20313
|
height: ${({ $height: height }) => height};
|
|
18437
20314
|
resize: none;
|
|
@@ -18443,26 +20320,26 @@ var Container30 = import_styled_components79.default.textarea`
|
|
|
18443
20320
|
`;
|
|
18444
20321
|
|
|
18445
20322
|
// src/components/TextArea/index.tsx
|
|
18446
|
-
var
|
|
20323
|
+
var import_jsx_runtime374 = require("react/jsx-runtime");
|
|
18447
20324
|
var TextArea = ({
|
|
18448
20325
|
width,
|
|
18449
20326
|
height,
|
|
18450
20327
|
...props
|
|
18451
20328
|
}) => {
|
|
18452
|
-
return /* @__PURE__ */ (0,
|
|
20329
|
+
return /* @__PURE__ */ (0, import_jsx_runtime374.jsx)(Container30, { ...props, $width: width, $height: height });
|
|
18453
20330
|
};
|
|
18454
20331
|
var TextArea_default = TextArea;
|
|
18455
20332
|
|
|
18456
20333
|
// src/components/Toast/styles.ts
|
|
18457
|
-
var
|
|
18458
|
-
var Container31 =
|
|
20334
|
+
var import_styled_components86 = __toESM(require("styled-components"));
|
|
20335
|
+
var Container31 = import_styled_components86.default.div`
|
|
18459
20336
|
border-radius: 4px;
|
|
18460
|
-
width: ${({ $size:
|
|
20337
|
+
width: ${({ $size: size4 }) => size4 === "large" ? "837px" : "460px"};
|
|
18461
20338
|
height: 88px;
|
|
18462
20339
|
border: 1px solid transparent;
|
|
18463
20340
|
position: relative;
|
|
18464
20341
|
|
|
18465
|
-
${({ $color: color }) => color === "success" &&
|
|
20342
|
+
${({ $color: color }) => color === "success" && import_styled_components86.css`
|
|
18466
20343
|
background-color: #fcfff5;
|
|
18467
20344
|
opacity: 1;
|
|
18468
20345
|
border-color: #a8c599;
|
|
@@ -18474,7 +20351,7 @@ var Container31 = import_styled_components80.default.div`
|
|
|
18474
20351
|
}
|
|
18475
20352
|
`}
|
|
18476
20353
|
|
|
18477
|
-
${({ $color: color }) => color === "error" &&
|
|
20354
|
+
${({ $color: color }) => color === "error" && import_styled_components86.css`
|
|
18478
20355
|
background-color: #fff6f6;
|
|
18479
20356
|
opacity: 1;
|
|
18480
20357
|
border-color: #973937;
|
|
@@ -18486,7 +20363,7 @@ var Container31 = import_styled_components80.default.div`
|
|
|
18486
20363
|
}
|
|
18487
20364
|
`}
|
|
18488
20365
|
|
|
18489
|
-
${({ $color: color }) => color === "warning" &&
|
|
20366
|
+
${({ $color: color }) => color === "warning" && import_styled_components86.css`
|
|
18490
20367
|
background-color: #fffaf3;
|
|
18491
20368
|
opacity: 1;
|
|
18492
20369
|
border-color: #ccbea0;
|
|
@@ -18507,7 +20384,7 @@ var Container31 = import_styled_components80.default.div`
|
|
|
18507
20384
|
height: 13px;
|
|
18508
20385
|
}
|
|
18509
20386
|
`;
|
|
18510
|
-
var IconContainer3 =
|
|
20387
|
+
var IconContainer3 = import_styled_components86.default.div`
|
|
18511
20388
|
width: 100%;
|
|
18512
20389
|
display: flex;
|
|
18513
20390
|
align-items: center;
|
|
@@ -18515,7 +20392,7 @@ var IconContainer3 = import_styled_components80.default.div`
|
|
|
18515
20392
|
padding: 14px 14px 0 0;
|
|
18516
20393
|
margin: 0;
|
|
18517
20394
|
`;
|
|
18518
|
-
var IconContent =
|
|
20395
|
+
var IconContent = import_styled_components86.default.div`
|
|
18519
20396
|
width: 100%;
|
|
18520
20397
|
padding: 13px 0 21px 28px;
|
|
18521
20398
|
display: flex;
|
|
@@ -18534,20 +20411,20 @@ var IconContent = import_styled_components80.default.div`
|
|
|
18534
20411
|
`;
|
|
18535
20412
|
|
|
18536
20413
|
// src/components/Toast/index.tsx
|
|
18537
|
-
var
|
|
20414
|
+
var import_jsx_runtime375 = require("react/jsx-runtime");
|
|
18538
20415
|
var Toast = ({
|
|
18539
|
-
size:
|
|
20416
|
+
size: size4,
|
|
18540
20417
|
color,
|
|
18541
20418
|
title,
|
|
18542
20419
|
description,
|
|
18543
20420
|
onClose: handlClose,
|
|
18544
20421
|
...props
|
|
18545
20422
|
}) => {
|
|
18546
|
-
return /* @__PURE__ */ (0,
|
|
18547
|
-
/* @__PURE__ */ (0,
|
|
18548
|
-
/* @__PURE__ */ (0,
|
|
18549
|
-
/* @__PURE__ */ (0,
|
|
18550
|
-
/* @__PURE__ */ (0,
|
|
20423
|
+
return /* @__PURE__ */ (0, import_jsx_runtime375.jsxs)(Container31, { ...props, $size: size4, $color: color, children: [
|
|
20424
|
+
/* @__PURE__ */ (0, import_jsx_runtime375.jsx)(IconContainer3, { children: /* @__PURE__ */ (0, import_jsx_runtime375.jsx)(Icon_default, { type: "feather", icon: "x", onClick: handlClose }) }),
|
|
20425
|
+
/* @__PURE__ */ (0, import_jsx_runtime375.jsxs)(IconContent, { children: [
|
|
20426
|
+
/* @__PURE__ */ (0, import_jsx_runtime375.jsx)("h4", { children: title }),
|
|
20427
|
+
/* @__PURE__ */ (0, import_jsx_runtime375.jsxs)("p", { children: [
|
|
18551
20428
|
" ",
|
|
18552
20429
|
description
|
|
18553
20430
|
] })
|
|
@@ -18557,15 +20434,15 @@ var Toast = ({
|
|
|
18557
20434
|
var Toast_default = Toast;
|
|
18558
20435
|
|
|
18559
20436
|
// src/components/Zoom/index.tsx
|
|
18560
|
-
var
|
|
20437
|
+
var import_react88 = __toESM(require("react"));
|
|
18561
20438
|
|
|
18562
20439
|
// src/components/Zoom/styles.ts
|
|
18563
|
-
var
|
|
18564
|
-
var Image =
|
|
20440
|
+
var import_styled_components87 = __toESM(require("styled-components"));
|
|
20441
|
+
var Image = import_styled_components87.default.img`
|
|
18565
20442
|
max-width: 100%;
|
|
18566
20443
|
max-height: 100%;
|
|
18567
20444
|
`;
|
|
18568
|
-
var Container32 =
|
|
20445
|
+
var Container32 = import_styled_components87.default.div`
|
|
18569
20446
|
position: relative;
|
|
18570
20447
|
display: inline-flex;
|
|
18571
20448
|
|
|
@@ -18594,7 +20471,7 @@ var Container32 = import_styled_components81.default.div`
|
|
|
18594
20471
|
}};
|
|
18595
20472
|
}
|
|
18596
20473
|
`;
|
|
18597
|
-
var Dimmer =
|
|
20474
|
+
var Dimmer = import_styled_components87.default.div`
|
|
18598
20475
|
position: absolute;
|
|
18599
20476
|
top: 0;
|
|
18600
20477
|
left: 0;
|
|
@@ -18612,10 +20489,10 @@ var Dimmer = import_styled_components81.default.div`
|
|
|
18612
20489
|
opacity: 1;
|
|
18613
20490
|
}
|
|
18614
20491
|
`;
|
|
18615
|
-
var Button7 = (0,
|
|
20492
|
+
var Button7 = (0, import_styled_components87.default)(Button_default)`
|
|
18616
20493
|
background-color: ${({ theme: theme4 }) => theme4.getColor("white", 50)};
|
|
18617
20494
|
`;
|
|
18618
|
-
var ModalContent =
|
|
20495
|
+
var ModalContent = import_styled_components87.default.div`
|
|
18619
20496
|
position: absolute;
|
|
18620
20497
|
width: 100%;
|
|
18621
20498
|
height: 100%;
|
|
@@ -18629,12 +20506,12 @@ var ModalContent = import_styled_components81.default.div`
|
|
|
18629
20506
|
`;
|
|
18630
20507
|
|
|
18631
20508
|
// src/components/Zoom/index.tsx
|
|
18632
|
-
var
|
|
20509
|
+
var import_jsx_runtime376 = require("react/jsx-runtime");
|
|
18633
20510
|
var Zoom = (props) => {
|
|
18634
20511
|
const { src, width, height, ...imgProps } = props;
|
|
18635
|
-
const [modalOpened, setModalOpened] = (0,
|
|
18636
|
-
return /* @__PURE__ */ (0,
|
|
18637
|
-
/* @__PURE__ */ (0,
|
|
20512
|
+
const [modalOpened, setModalOpened] = (0, import_react88.useState)(false);
|
|
20513
|
+
return /* @__PURE__ */ (0, import_jsx_runtime376.jsxs)(import_react88.default.Fragment, { children: [
|
|
20514
|
+
/* @__PURE__ */ (0, import_jsx_runtime376.jsxs)(
|
|
18638
20515
|
Container32,
|
|
18639
20516
|
{
|
|
18640
20517
|
...imgProps,
|
|
@@ -18642,8 +20519,8 @@ var Zoom = (props) => {
|
|
|
18642
20519
|
$width: width,
|
|
18643
20520
|
$height: height,
|
|
18644
20521
|
children: [
|
|
18645
|
-
/* @__PURE__ */ (0,
|
|
18646
|
-
/* @__PURE__ */ (0,
|
|
20522
|
+
/* @__PURE__ */ (0, import_jsx_runtime376.jsx)(Image, { src, alt: "zoom" }),
|
|
20523
|
+
/* @__PURE__ */ (0, import_jsx_runtime376.jsx)(Dimmer, { children: /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(
|
|
18647
20524
|
Button7,
|
|
18648
20525
|
{
|
|
18649
20526
|
content: "Zoom",
|
|
@@ -18654,14 +20531,14 @@ var Zoom = (props) => {
|
|
|
18654
20531
|
]
|
|
18655
20532
|
}
|
|
18656
20533
|
),
|
|
18657
|
-
/* @__PURE__ */ (0,
|
|
20534
|
+
/* @__PURE__ */ (0, import_jsx_runtime376.jsx)(
|
|
18658
20535
|
Modal_default,
|
|
18659
20536
|
{
|
|
18660
20537
|
openState: [modalOpened, setModalOpened],
|
|
18661
20538
|
size: "large",
|
|
18662
20539
|
title: "Zoom",
|
|
18663
20540
|
closeOnClickOutside: true,
|
|
18664
|
-
children: /* @__PURE__ */ (0,
|
|
20541
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(ModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime376.jsx)("img", { src, alt: "zoom" }) })
|
|
18665
20542
|
}
|
|
18666
20543
|
)
|
|
18667
20544
|
] });
|
|
@@ -18688,6 +20565,7 @@ var Zoom_default = Zoom;
|
|
|
18688
20565
|
MwPlaceholder,
|
|
18689
20566
|
MwProgressBar,
|
|
18690
20567
|
MwScrollContainer,
|
|
20568
|
+
MwSelect,
|
|
18691
20569
|
MwSignature,
|
|
18692
20570
|
MwTabs,
|
|
18693
20571
|
MwTextArea,
|