@xsolla/xui-multi-select 0.91.0 → 0.92.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/native/index.js +58 -57
- package/native/index.js.map +1 -1
- package/native/index.mjs +42 -41
- package/native/index.mjs.map +1 -1
- package/package.json +5 -5
- package/web/index.js +58 -57
- package/web/index.js.map +1 -1
- package/web/index.mjs +42 -41
- package/web/index.mjs.map +1 -1
package/native/index.js
CHANGED
|
@@ -652,6 +652,7 @@ var import_jsx_runtime381 = require("react/jsx-runtime");
|
|
|
652
652
|
var import_jsx_runtime382 = require("react/jsx-runtime");
|
|
653
653
|
var import_jsx_runtime383 = require("react/jsx-runtime");
|
|
654
654
|
var import_jsx_runtime384 = require("react/jsx-runtime");
|
|
655
|
+
var import_jsx_runtime385 = require("react/jsx-runtime");
|
|
655
656
|
var StyledIcon = import_styled_components.default.div`
|
|
656
657
|
display: inline-flex;
|
|
657
658
|
align-items: center;
|
|
@@ -669,15 +670,15 @@ var BaseIcon = ({
|
|
|
669
670
|
variant = "line",
|
|
670
671
|
size = 24,
|
|
671
672
|
color = "currentColor",
|
|
672
|
-
solidContent:
|
|
673
|
-
lineContent:
|
|
673
|
+
solidContent: solidContent382,
|
|
674
|
+
lineContent: lineContent382,
|
|
674
675
|
className,
|
|
675
676
|
style,
|
|
676
677
|
"data-testid": testId,
|
|
677
678
|
"aria-label": ariaLabel,
|
|
678
679
|
"aria-hidden": ariaHidden
|
|
679
680
|
}) => {
|
|
680
|
-
const svgContent = variant === "line" ?
|
|
681
|
+
const svgContent = variant === "line" ? lineContent382 : solidContent382;
|
|
681
682
|
const sizeValue = typeof size === "number" ? `${size}px` : size;
|
|
682
683
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
683
684
|
StyledIcon,
|
|
@@ -694,18 +695,18 @@ var BaseIcon = ({
|
|
|
694
695
|
}
|
|
695
696
|
);
|
|
696
697
|
};
|
|
697
|
-
var
|
|
698
|
-
var
|
|
699
|
-
var ChevronDown = (props) => /* @__PURE__ */ (0,
|
|
700
|
-
var
|
|
701
|
-
var
|
|
702
|
-
var ChevronUp = (props) => /* @__PURE__ */ (0,
|
|
703
|
-
var
|
|
704
|
-
var
|
|
705
|
-
var ExclamationMarkCr = (props) => /* @__PURE__ */ (0,
|
|
706
|
-
var
|
|
707
|
-
var
|
|
708
|
-
var Remove = (props) => /* @__PURE__ */ (0,
|
|
698
|
+
var solidContent70 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_chevron-down--solid"><path id="Union" d="M7.19471 10.195C6.75374 9.754 7.06605 9 7.68969 9L16.3098 9C16.9334 9 17.2457 9.754 16.8048 10.195L12.7068 14.2929C12.3163 14.6834 11.6832 14.6834 11.2926 14.2929L7.19471 10.195Z" style="fill: currentColor"/></g></svg>`;
|
|
699
|
+
var lineContent70 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_chevron-down--line"><path id="Union" d="M12.7178 15.7808C12.3273 16.1713 11.6942 16.1713 11.3036 15.7808L4.30371 8.78084L5.71777 7.36678L12.0107 13.6597L18.3037 7.36678L19.7178 8.78084L12.7178 15.7808Z" style="fill: currentColor"/></g></svg>`;
|
|
700
|
+
var ChevronDown = (props) => /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(BaseIcon, { ...props, solidContent: solidContent70, lineContent: lineContent70 });
|
|
701
|
+
var solidContent79 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_chevron-up--solid"><path id="Union" d="M16.8048 12.8049C17.2457 13.2458 16.9334 13.9998 16.3098 13.9998H7.68968C7.06605 13.9998 6.75373 13.2458 7.19471 12.8049L11.2926 8.70696C11.6832 8.31643 12.3163 8.31643 12.7068 8.70696L16.8048 12.8049Z" style="fill: currentColor"/></g></svg>`;
|
|
702
|
+
var lineContent79 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_chevron-up--line"><path id="Union" d="M11.2929 7.93945C11.6834 7.54893 12.3166 7.54893 12.7071 7.93945L19.707 14.9394L18.293 16.3534L12 10.0605L5.70703 16.3534L4.29297 14.9394L11.2929 7.93945Z" style="fill: currentColor"/></g></svg>`;
|
|
703
|
+
var ChevronUp = (props) => /* @__PURE__ */ (0, import_jsx_runtime83.jsx)(BaseIcon, { ...props, solidContent: solidContent79, lineContent: lineContent79 });
|
|
704
|
+
var solidContent88 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_exclamation-mark-cr--solid"><path id="Union" fill-rule="evenodd" clip-rule="evenodd" d="M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 16C11.4477 16 11 16.4477 11 17C11 17.5523 11.4477 18 12 18C12.5523 18 13 17.5523 13 17C13 16.4477 12.5523 16 12 16ZM11 6V14H13V6H11Z" style="fill: currentColor"/></g></svg>`;
|
|
705
|
+
var lineContent88 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_exclamation-mark-cr--line"><g id="Union"><path d="M13 17C13 17.5523 12.5523 18 12 18C11.4477 18 11 17.5523 11 17C11 16.4477 11.4477 16 12 16C12.5523 16 13 16.4477 13 17Z" style="fill: currentColor"/><path d="M13 14H11V6H13V14Z" style="fill: currentColor"/><path fill-rule="evenodd" clip-rule="evenodd" d="M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4Z" style="fill: currentColor"/></g></g></svg>`;
|
|
706
|
+
var ExclamationMarkCr = (props) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(BaseIcon, { ...props, solidContent: solidContent88, lineContent: lineContent88 });
|
|
707
|
+
var solidContent112 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_remove--solid"><path id="Union" d="M19.7789 7.05003C20.1695 7.44056 20.1695 8.07372 19.7789 8.46424L16.2434 11.9998L19.7789 15.5353C20.1695 15.9258 20.1695 16.559 19.7789 16.9495L16.9505 19.778C16.56 20.1685 15.9268 20.1685 15.5363 19.778L12.0008 16.2424L8.46522 19.778C8.0747 20.1685 7.44153 20.1685 7.05101 19.778L4.22258 16.9495C3.83206 16.559 3.83206 15.9258 4.22258 15.5353L7.75811 11.9998L4.22258 8.46424C3.83206 8.07372 3.83206 7.44056 4.22258 7.05003L7.05101 4.2216C7.44153 3.83108 8.0747 3.83108 8.46522 4.2216L12.0008 7.75714L15.5363 4.2216C15.9268 3.83108 16.56 3.83108 16.9505 4.2216L19.7789 7.05003Z" style="fill: currentColor"/></g></svg>`;
|
|
708
|
+
var lineContent112 = `<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><g id="icon_remove--line"><path id="Union" d="M20.0303 5.41455L13.4199 12.0249L20.0195 18.6245L18.6055 20.0386L12.0059 13.439L5.41406 20.0308L4 18.6167L10.5918 12.0249L4.00879 5.44189L5.42285 4.02783L12.0059 10.6108L18.6162 4.00049L20.0303 5.41455Z" style="fill: currentColor"/></g></svg>`;
|
|
709
|
+
var Remove = (props) => /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(BaseIcon, { ...props, solidContent: solidContent112, lineContent: lineContent112 });
|
|
709
710
|
|
|
710
711
|
// src/useMultiSelectControl.tsx
|
|
711
712
|
var import_react5 = require("react");
|
|
@@ -713,16 +714,16 @@ var import_react5 = require("react");
|
|
|
713
714
|
// ../tag/dist/web/index.mjs
|
|
714
715
|
var import_react4 = __toESM(require("react"), 1);
|
|
715
716
|
var import_styled_components3 = __toESM(require("styled-components"), 1);
|
|
716
|
-
var import_jsx_runtime387 = require("react/jsx-runtime");
|
|
717
|
-
var import_styled_components4 = __toESM(require("styled-components"), 1);
|
|
718
717
|
var import_jsx_runtime388 = require("react/jsx-runtime");
|
|
719
|
-
var
|
|
718
|
+
var import_styled_components4 = __toESM(require("styled-components"), 1);
|
|
720
719
|
var import_jsx_runtime389 = require("react/jsx-runtime");
|
|
720
|
+
var import_styled_components5 = __toESM(require("styled-components"), 1);
|
|
721
|
+
var import_jsx_runtime390 = require("react/jsx-runtime");
|
|
721
722
|
var import_xui_core = require("@xsolla/xui-core");
|
|
722
723
|
|
|
723
724
|
// ../icons/dist/web/index.mjs
|
|
724
725
|
var import_styled_components2 = __toESM(require("styled-components"), 1);
|
|
725
|
-
var
|
|
726
|
+
var import_jsx_runtime386 = require("react/jsx-runtime");
|
|
726
727
|
|
|
727
728
|
// ../../node_modules/lucide-react/dist/esm/createLucideIcon.js
|
|
728
729
|
var import_react3 = require("react");
|
|
@@ -802,7 +803,7 @@ var X = createLucideIcon("X", [
|
|
|
802
803
|
]);
|
|
803
804
|
|
|
804
805
|
// ../icons/dist/web/index.mjs
|
|
805
|
-
var
|
|
806
|
+
var import_jsx_runtime387 = require("react/jsx-runtime");
|
|
806
807
|
var StyledIcon2 = import_styled_components2.default.div`
|
|
807
808
|
display: flex;
|
|
808
809
|
align-items: center;
|
|
@@ -819,12 +820,12 @@ var StyledIcon2 = import_styled_components2.default.div`
|
|
|
819
820
|
}
|
|
820
821
|
`;
|
|
821
822
|
var Icon3 = ({ children, ...props }) => {
|
|
822
|
-
return /* @__PURE__ */ (0,
|
|
823
|
+
return /* @__PURE__ */ (0, import_jsx_runtime386.jsx)(StyledIcon2, { ...props, children });
|
|
823
824
|
};
|
|
824
|
-
var X2 = (props) => /* @__PURE__ */ (0,
|
|
825
|
+
var X2 = (props) => /* @__PURE__ */ (0, import_jsx_runtime387.jsx)(Icon3, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime387.jsx)(X, { size: "100%" }) });
|
|
825
826
|
|
|
826
827
|
// ../tag/dist/web/index.mjs
|
|
827
|
-
var
|
|
828
|
+
var import_jsx_runtime391 = require("react/jsx-runtime");
|
|
828
829
|
var StyledBox = import_styled_components3.default.div`
|
|
829
830
|
display: flex;
|
|
830
831
|
box-sizing: border-box;
|
|
@@ -938,7 +939,7 @@ var Box2 = import_react4.default.forwardRef(
|
|
|
938
939
|
...props
|
|
939
940
|
}, ref) => {
|
|
940
941
|
if (as === "img" && src) {
|
|
941
|
-
return /* @__PURE__ */ (0,
|
|
942
|
+
return /* @__PURE__ */ (0, import_jsx_runtime388.jsx)(
|
|
942
943
|
"img",
|
|
943
944
|
{
|
|
944
945
|
src,
|
|
@@ -958,7 +959,7 @@ var Box2 = import_react4.default.forwardRef(
|
|
|
958
959
|
}
|
|
959
960
|
);
|
|
960
961
|
}
|
|
961
|
-
return /* @__PURE__ */ (0,
|
|
962
|
+
return /* @__PURE__ */ (0, import_jsx_runtime388.jsx)(
|
|
962
963
|
StyledBox,
|
|
963
964
|
{
|
|
964
965
|
ref,
|
|
@@ -1006,7 +1007,7 @@ var Text2 = ({
|
|
|
1006
1007
|
role,
|
|
1007
1008
|
...props
|
|
1008
1009
|
}) => {
|
|
1009
|
-
return /* @__PURE__ */ (0,
|
|
1010
|
+
return /* @__PURE__ */ (0, import_jsx_runtime389.jsx)(
|
|
1010
1011
|
StyledText,
|
|
1011
1012
|
{
|
|
1012
1013
|
...props,
|
|
@@ -1033,7 +1034,7 @@ var StyledIcon3 = import_styled_components5.default.div`
|
|
|
1033
1034
|
}
|
|
1034
1035
|
`;
|
|
1035
1036
|
var Icon4 = ({ children, ...props }) => {
|
|
1036
|
-
return /* @__PURE__ */ (0,
|
|
1037
|
+
return /* @__PURE__ */ (0, import_jsx_runtime390.jsx)(StyledIcon3, { ...props, children });
|
|
1037
1038
|
};
|
|
1038
1039
|
var Tag = ({
|
|
1039
1040
|
size = "md",
|
|
@@ -1094,7 +1095,7 @@ var Tag = ({
|
|
|
1094
1095
|
}
|
|
1095
1096
|
};
|
|
1096
1097
|
const { bg, text } = resolveColors();
|
|
1097
|
-
return /* @__PURE__ */ (0,
|
|
1098
|
+
return /* @__PURE__ */ (0, import_jsx_runtime391.jsxs)(
|
|
1098
1099
|
Box2,
|
|
1099
1100
|
{
|
|
1100
1101
|
backgroundColor: bg,
|
|
@@ -1111,8 +1112,8 @@ var Tag = ({
|
|
|
1111
1112
|
whiteSpace: "nowrap"
|
|
1112
1113
|
},
|
|
1113
1114
|
children: [
|
|
1114
|
-
icon && /* @__PURE__ */ (0,
|
|
1115
|
-
/* @__PURE__ */ (0,
|
|
1115
|
+
icon && /* @__PURE__ */ (0, import_jsx_runtime391.jsx)(Icon4, { size: sizeStyles.iconSize, color: text, children: icon }),
|
|
1116
|
+
/* @__PURE__ */ (0, import_jsx_runtime391.jsx)(
|
|
1116
1117
|
Text2,
|
|
1117
1118
|
{
|
|
1118
1119
|
color: text,
|
|
@@ -1126,7 +1127,7 @@ var Tag = ({
|
|
|
1126
1127
|
children
|
|
1127
1128
|
}
|
|
1128
1129
|
),
|
|
1129
|
-
onRemove && /* @__PURE__ */ (0,
|
|
1130
|
+
onRemove && /* @__PURE__ */ (0, import_jsx_runtime391.jsx)(Box2, { onPress: onRemove, children: /* @__PURE__ */ (0, import_jsx_runtime391.jsx)(X2, { size: sizeStyles.iconSize, color: text }) })
|
|
1130
1131
|
]
|
|
1131
1132
|
}
|
|
1132
1133
|
);
|
|
@@ -1134,7 +1135,7 @@ var Tag = ({
|
|
|
1134
1135
|
|
|
1135
1136
|
// src/useMultiSelectControl.tsx
|
|
1136
1137
|
var import_xui_core2 = require("@xsolla/xui-core");
|
|
1137
|
-
var
|
|
1138
|
+
var import_jsx_runtime392 = require("react/jsx-runtime");
|
|
1138
1139
|
var COUNT_ITEM_VALUE = "count-item";
|
|
1139
1140
|
var useMultiSelectControl = ({
|
|
1140
1141
|
variant,
|
|
@@ -1194,7 +1195,7 @@ var useMultiSelectControl = ({
|
|
|
1194
1195
|
};
|
|
1195
1196
|
const setPlaceholder = () => {
|
|
1196
1197
|
setSelectedContent(
|
|
1197
|
-
/* @__PURE__ */ (0,
|
|
1198
|
+
/* @__PURE__ */ (0, import_jsx_runtime392.jsx)(
|
|
1198
1199
|
Text,
|
|
1199
1200
|
{
|
|
1200
1201
|
color: theme.colors.control.input.placeholder,
|
|
@@ -1245,7 +1246,7 @@ var useMultiSelectControl = ({
|
|
|
1245
1246
|
const isCount = item.value === COUNT_ITEM_VALUE;
|
|
1246
1247
|
const isReducable = index === 0 && displayStateRef.current === 3 /* Render */ && displayedItemsCount === 0 || flexible;
|
|
1247
1248
|
if (variant === "tag") {
|
|
1248
|
-
return /* @__PURE__ */ (0,
|
|
1249
|
+
return /* @__PURE__ */ (0, import_jsx_runtime392.jsx)(
|
|
1249
1250
|
Box,
|
|
1250
1251
|
{
|
|
1251
1252
|
onPress: !isCount ? (e) => {
|
|
@@ -1257,7 +1258,7 @@ var useMultiSelectControl = ({
|
|
|
1257
1258
|
opacity: disabled ? 0.5 : 1,
|
|
1258
1259
|
cursor: disabled || isCount ? "not-allowed" : "pointer"
|
|
1259
1260
|
},
|
|
1260
|
-
children: /* @__PURE__ */ (0,
|
|
1261
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime392.jsx)(
|
|
1261
1262
|
Tag,
|
|
1262
1263
|
{
|
|
1263
1264
|
size,
|
|
@@ -1275,7 +1276,7 @@ var useMultiSelectControl = ({
|
|
|
1275
1276
|
}
|
|
1276
1277
|
const isCountItem = hasHidden;
|
|
1277
1278
|
const needsComma = index < displayedItems.length - 2 || index < displayedItems.length - 1 && !isCountItem;
|
|
1278
|
-
return /* @__PURE__ */ (0,
|
|
1279
|
+
return /* @__PURE__ */ (0, import_jsx_runtime392.jsxs)(
|
|
1279
1280
|
Text,
|
|
1280
1281
|
{
|
|
1281
1282
|
color: theme.colors.content.primary,
|
|
@@ -1377,7 +1378,7 @@ var useMultiSelectControl = ({
|
|
|
1377
1378
|
};
|
|
1378
1379
|
|
|
1379
1380
|
// src/MultiSelectControl.tsx
|
|
1380
|
-
var
|
|
1381
|
+
var import_jsx_runtime393 = require("react/jsx-runtime");
|
|
1381
1382
|
var MultiSelectControl = (0, import_react6.forwardRef)(
|
|
1382
1383
|
({
|
|
1383
1384
|
variant = "tag",
|
|
@@ -1440,7 +1441,7 @@ var MultiSelectControl = (0, import_react6.forwardRef)(
|
|
|
1440
1441
|
borderColor = inputColors.borderHover;
|
|
1441
1442
|
}
|
|
1442
1443
|
const iconColor = isDisable ? inputColors.textDisable : inputColors.placeholder;
|
|
1443
|
-
return /* @__PURE__ */ (0,
|
|
1444
|
+
return /* @__PURE__ */ (0, import_jsx_runtime393.jsxs)(
|
|
1444
1445
|
Box,
|
|
1445
1446
|
{
|
|
1446
1447
|
ref,
|
|
@@ -1468,7 +1469,7 @@ var MultiSelectControl = (0, import_react6.forwardRef)(
|
|
|
1468
1469
|
borderColor: inputColors.borderHover
|
|
1469
1470
|
} : void 0,
|
|
1470
1471
|
children: [
|
|
1471
|
-
/* @__PURE__ */ (0,
|
|
1472
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsxs)(
|
|
1472
1473
|
Box,
|
|
1473
1474
|
{
|
|
1474
1475
|
ref: containerRef,
|
|
@@ -1478,8 +1479,8 @@ var MultiSelectControl = (0, import_react6.forwardRef)(
|
|
|
1478
1479
|
gap: 8,
|
|
1479
1480
|
style: { minWidth: 0 },
|
|
1480
1481
|
children: [
|
|
1481
|
-
iconLeft && /* @__PURE__ */ (0,
|
|
1482
|
-
/* @__PURE__ */ (0,
|
|
1482
|
+
iconLeft && /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(Icon, { size: sizeStyles.iconSize, color: iconColor, variant: "line", children: iconLeft }),
|
|
1483
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsx)(
|
|
1483
1484
|
Box,
|
|
1484
1485
|
{
|
|
1485
1486
|
ref: itemsRef,
|
|
@@ -1498,8 +1499,8 @@ var MultiSelectControl = (0, import_react6.forwardRef)(
|
|
|
1498
1499
|
]
|
|
1499
1500
|
}
|
|
1500
1501
|
),
|
|
1501
|
-
/* @__PURE__ */ (0,
|
|
1502
|
-
extraClear && selectedItems.length > 0 && !isDisable && /* @__PURE__ */ (0,
|
|
1502
|
+
/* @__PURE__ */ (0, import_jsx_runtime393.jsxs)(Box, { flexDirection: "row", alignItems: "center", gap: 4, children: [
|
|
1503
|
+
extraClear && selectedItems.length > 0 && !isDisable && /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(
|
|
1503
1504
|
Box,
|
|
1504
1505
|
{
|
|
1505
1506
|
onPress: (e) => {
|
|
@@ -1507,17 +1508,17 @@ var MultiSelectControl = (0, import_react6.forwardRef)(
|
|
|
1507
1508
|
removeAllValues();
|
|
1508
1509
|
},
|
|
1509
1510
|
style: { cursor: "pointer" },
|
|
1510
|
-
children: /* @__PURE__ */ (0,
|
|
1511
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(Remove, { size: 18, color: iconColor, variant: "line" })
|
|
1511
1512
|
}
|
|
1512
1513
|
),
|
|
1513
|
-
isError && /* @__PURE__ */ (0,
|
|
1514
|
+
isError && /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(
|
|
1514
1515
|
ExclamationMarkCr,
|
|
1515
1516
|
{
|
|
1516
1517
|
size: 18,
|
|
1517
1518
|
color: theme.colors.content.alert.primary
|
|
1518
1519
|
}
|
|
1519
1520
|
),
|
|
1520
|
-
iconRight ? iconRight : isOpen ? /* @__PURE__ */ (0,
|
|
1521
|
+
iconRight ? iconRight : isOpen ? /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(ChevronUp, { size: 18, color: iconColor, variant: "line" }) : /* @__PURE__ */ (0, import_jsx_runtime393.jsx)(ChevronDown, { size: 18, color: iconColor })
|
|
1521
1522
|
] })
|
|
1522
1523
|
]
|
|
1523
1524
|
}
|
|
@@ -1618,7 +1619,7 @@ var useMultiSelect = ({
|
|
|
1618
1619
|
};
|
|
1619
1620
|
|
|
1620
1621
|
// src/MultiSelect.tsx
|
|
1621
|
-
var
|
|
1622
|
+
var import_jsx_runtime394 = require("react/jsx-runtime");
|
|
1622
1623
|
var MultiSelect = (0, import_react8.forwardRef)(
|
|
1623
1624
|
({
|
|
1624
1625
|
options,
|
|
@@ -1682,8 +1683,8 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1682
1683
|
const newValues = checked ? [...values, value2] : values.filter((v) => v !== value2);
|
|
1683
1684
|
onChoose(newValues.map(String));
|
|
1684
1685
|
};
|
|
1685
|
-
return /* @__PURE__ */ (0,
|
|
1686
|
-
label && /* @__PURE__ */ (0,
|
|
1686
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsxs)(Box, { flexDirection: "column", gap: sizeStyles.fieldGap, children: [
|
|
1687
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1687
1688
|
Text,
|
|
1688
1689
|
{
|
|
1689
1690
|
color: theme.colors.content.secondary,
|
|
@@ -1692,7 +1693,7 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1692
1693
|
children: label
|
|
1693
1694
|
}
|
|
1694
1695
|
),
|
|
1695
|
-
/* @__PURE__ */ (0,
|
|
1696
|
+
/* @__PURE__ */ (0, import_jsx_runtime394.jsxs)(
|
|
1696
1697
|
Box,
|
|
1697
1698
|
{
|
|
1698
1699
|
ref,
|
|
@@ -1700,7 +1701,7 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1700
1701
|
position: "relative"
|
|
1701
1702
|
},
|
|
1702
1703
|
children: [
|
|
1703
|
-
/* @__PURE__ */ (0,
|
|
1704
|
+
/* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1704
1705
|
MultiSelectControl,
|
|
1705
1706
|
{
|
|
1706
1707
|
ref: controlRef,
|
|
@@ -1724,8 +1725,8 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1724
1725
|
extraClear
|
|
1725
1726
|
}
|
|
1726
1727
|
),
|
|
1727
|
-
isOpen && !isDisable && /* @__PURE__ */ (0,
|
|
1728
|
-
/* @__PURE__ */ (0,
|
|
1728
|
+
isOpen && !isDisable && /* @__PURE__ */ (0, import_jsx_runtime394.jsxs)(import_jsx_runtime394.Fragment, { children: [
|
|
1729
|
+
/* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1729
1730
|
Box,
|
|
1730
1731
|
{
|
|
1731
1732
|
style: {
|
|
@@ -1740,7 +1741,7 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1740
1741
|
onPress: onClose
|
|
1741
1742
|
}
|
|
1742
1743
|
),
|
|
1743
|
-
/* @__PURE__ */ (0,
|
|
1744
|
+
/* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1744
1745
|
Box,
|
|
1745
1746
|
{
|
|
1746
1747
|
ref: menuRef,
|
|
@@ -1764,7 +1765,7 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1764
1765
|
children: menuItems.map((item, _index) => {
|
|
1765
1766
|
const brandColors = theme.colors.control.brand.primary;
|
|
1766
1767
|
const contentColors = theme.colors.content;
|
|
1767
|
-
return /* @__PURE__ */ (0,
|
|
1768
|
+
return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1768
1769
|
Box,
|
|
1769
1770
|
{
|
|
1770
1771
|
paddingHorizontal: sizeStyles.paddingHorizontal,
|
|
@@ -1785,7 +1786,7 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1785
1786
|
cursor: item.disabled ? "not-allowed" : "pointer",
|
|
1786
1787
|
opacity: item.disabled ? 0.5 : 1
|
|
1787
1788
|
},
|
|
1788
|
-
children: /* @__PURE__ */ (0,
|
|
1789
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1789
1790
|
Text,
|
|
1790
1791
|
{
|
|
1791
1792
|
color: item.checked ? contentColors.on.brand : theme.colors.content.secondary,
|
|
@@ -1804,7 +1805,7 @@ var MultiSelect = (0, import_react8.forwardRef)(
|
|
|
1804
1805
|
]
|
|
1805
1806
|
}
|
|
1806
1807
|
),
|
|
1807
|
-
errorMessage && /* @__PURE__ */ (0,
|
|
1808
|
+
errorMessage && /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(
|
|
1808
1809
|
Text,
|
|
1809
1810
|
{
|
|
1810
1811
|
color: theme.colors.content.alert.primary,
|