@xsolla/xui-multi-select 0.89.0 → 0.91.0

package/web/index.mjs

@@ -1,5 +1,5 @@
 // src/MultiSelect.tsx
-import { forwardRef as forwardRef8, useRef as useRef4, useEffect as useEffect3 } from "react";
+import { forwardRef as forwardRef4, useRef as useRef4, useEffect as useEffect3 } from "react";
 
 // ../primitives-web/src/Box.tsx
 import React from "react";
@@ -202,54 +202,10 @@ var Text = ({
   );
 };
 
-// ../primitives-web/src/Spinner.tsx
-import styled3, { keyframes } from "styled-components";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var rotate = keyframes`
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-`;
-var StyledSpinner = styled3.div`
-  width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  border: ${(props) => props.strokeWidth || 2}px solid
-    ${(props) => props.color || "currentColor"};
-  border-bottom-color: transparent;
-  border-radius: 50%;
-  display: inline-block;
-  box-sizing: border-box;
-  animation: ${rotate} 1s linear infinite;
-`;
-var Spinner = ({
-  role = "status",
-  "aria-label": ariaLabel,
-  "aria-live": ariaLive = "polite",
-  "aria-describedby": ariaDescribedBy,
-  testID,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx3(
-    StyledSpinner,
-    {
-      role,
-      "aria-label": ariaLabel,
-      "aria-live": ariaLive,
-      "aria-describedby": ariaDescribedBy,
-      "data-testid": testID,
-      ...props
-    }
-  );
-};
-Spinner.displayName = "Spinner";
-
 // ../primitives-web/src/Icon.tsx
-import styled4 from "styled-components";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var StyledIcon = styled4.div`
+import styled3 from "styled-components";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var StyledIcon = styled3.div`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -265,210 +221,26 @@ var StyledIcon = styled4.div`
   }
 `;
 var Icon = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx4(StyledIcon, { ...props, children });
+  return /* @__PURE__ */ jsx3(StyledIcon, { ...props, children });
 };
 
-// ../primitives-web/src/Divider.tsx
-import styled5 from "styled-components";
-import { jsx as jsx5 } from "react/jsx-runtime";
-var StyledDivider = styled5.div`
-  background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
-  width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
-  height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-
-  ${(props) => props.dashStroke && `
-    border-style: dashed;
-    border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
-    border-width: 0;
-    ${props.vertical ? `
-      border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
-      height: 100%;
-    ` : `
-      border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-      width: 100%;
-    `}
-  `}
-`;
-
-// ../primitives-web/src/Input.tsx
-import { forwardRef } from "react";
-import styled6 from "styled-components";
-import { jsx as jsx6 } from "react/jsx-runtime";
-var StyledInput = styled6.input`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var InputPrimitive = forwardRef(
-  ({
-    value,
-    placeholder,
-    onChange,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    secureTextEntry,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    name,
-    type,
-    inputMode,
-    autoComplete,
-    id,
-    "aria-invalid": ariaInvalid,
-    "aria-describedby": ariaDescribedBy,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-label": ariaLabel,
-    "aria-disabled": ariaDisabled,
-    "data-testid": dataTestId,
-    ...rest
-  }, ref) => {
-    const handleChange = (e) => {
-      if (onChange) {
-        onChange(e);
-      }
-      if (onChangeText) {
-        onChangeText(e.target.value);
-      }
-    };
-    const inputValue = value !== void 0 ? value : "";
-    return /* @__PURE__ */ jsx6(
-      StyledInput,
-      {
-        ref,
-        id,
-        value: inputValue,
-        name,
-        placeholder,
-        onChange: handleChange,
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        type: secureTextEntry ? "password" : type || "text",
-        inputMode,
-        autoComplete,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        "aria-invalid": ariaInvalid,
-        "aria-describedby": ariaDescribedBy,
-        "aria-labelledby": ariaLabelledBy,
-        "aria-label": ariaLabel,
-        "aria-disabled": ariaDisabled,
-        "data-testid": dataTestId,
-        ...rest
-      }
-    );
-  }
-);
-InputPrimitive.displayName = "InputPrimitive";
-
-// ../primitives-web/src/TextArea.tsx
-import { forwardRef as forwardRef2 } from "react";
-import styled7 from "styled-components";
-import { jsx as jsx7 } from "react/jsx-runtime";
-var StyledTextArea = styled7.textarea`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-  resize: none;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var TextAreaPrimitive = forwardRef2(
-  ({
-    value,
-    placeholder,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    rows
-  }, ref) => {
-    return /* @__PURE__ */ jsx7(
-      StyledTextArea,
-      {
-        ref,
-        value,
-        placeholder,
-        onChange: (e) => onChangeText?.(e.target.value),
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        rows
-      }
-    );
-  }
-);
-TextAreaPrimitive.displayName = "TextAreaPrimitive";
-
 // src/MultiSelect.tsx
 import { useDesignSystem as useDesignSystem4 } from "@xsolla/xui-core";
 
 // src/MultiSelectControl.tsx
-import { forwardRef as forwardRef7, useRef as useRef2 } from "react";
+import { forwardRef as forwardRef3, useRef as useRef2 } from "react";
 import { useDesignSystem as useDesignSystem3 } from "@xsolla/xui-core";
 
 // ../icons-base/dist/web/index.mjs
-import styled8 from "styled-components";
-import { jsx as jsx8 } from "react/jsx-runtime";
+import styled4 from "styled-components";
+import { jsx as jsx4 } from "react/jsx-runtime";
 import { jsx as jsx22 } from "react/jsx-runtime";
 import { jsx as jsx32 } from "react/jsx-runtime";
 import { jsx as jsx42 } from "react/jsx-runtime";
-import { jsx as jsx52 } from "react/jsx-runtime";
-import { jsx as jsx62 } from "react/jsx-runtime";
-import { jsx as jsx72 } from "react/jsx-runtime";
-import { jsx as jsx82 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
+import { jsx as jsx7 } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 import { jsx as jsx9 } from "react/jsx-runtime";
 import { jsx as jsx10 } from "react/jsx-runtime";
 import { jsx as jsx11 } from "react/jsx-runtime";
@@ -512,7 +284,7 @@ import { jsx as jsx48 } from "react/jsx-runtime";
 import { jsx as jsx49 } from "react/jsx-runtime";
 import { jsx as jsx50 } from "react/jsx-runtime";
 import { jsx as jsx51 } from "react/jsx-runtime";
-import { jsx as jsx522 } from "react/jsx-runtime";
+import { jsx as jsx52 } from "react/jsx-runtime";
 import { jsx as jsx53 } from "react/jsx-runtime";
 import { jsx as jsx54 } from "react/jsx-runtime";
 import { jsx as jsx55 } from "react/jsx-runtime";
@@ -522,7 +294,7 @@ import { jsx as jsx58 } from "react/jsx-runtime";
 import { jsx as jsx59 } from "react/jsx-runtime";
 import { jsx as jsx60 } from "react/jsx-runtime";
 import { jsx as jsx61 } from "react/jsx-runtime";
-import { jsx as jsx622 } from "react/jsx-runtime";
+import { jsx as jsx62 } from "react/jsx-runtime";
 import { jsx as jsx63 } from "react/jsx-runtime";
 import { jsx as jsx64 } from "react/jsx-runtime";
 import { jsx as jsx65 } from "react/jsx-runtime";
@@ -532,7 +304,7 @@ import { jsx as jsx68 } from "react/jsx-runtime";
 import { jsx as jsx69 } from "react/jsx-runtime";
 import { jsx as jsx70 } from "react/jsx-runtime";
 import { jsx as jsx71 } from "react/jsx-runtime";
-import { jsx as jsx722 } from "react/jsx-runtime";
+import { jsx as jsx72 } from "react/jsx-runtime";
 import { jsx as jsx73 } from "react/jsx-runtime";
 import { jsx as jsx74 } from "react/jsx-runtime";
 import { jsx as jsx75 } from "react/jsx-runtime";
@@ -542,7 +314,7 @@ import { jsx as jsx78 } from "react/jsx-runtime";
 import { jsx as jsx79 } from "react/jsx-runtime";
 import { jsx as jsx80 } from "react/jsx-runtime";
 import { jsx as jsx81 } from "react/jsx-runtime";
-import { jsx as jsx822 } from "react/jsx-runtime";
+import { jsx as jsx82 } from "react/jsx-runtime";
 import { jsx as jsx83 } from "react/jsx-runtime";
 import { jsx as jsx84 } from "react/jsx-runtime";
 import { jsx as jsx85 } from "react/jsx-runtime";
@@ -842,7 +614,7 @@ import { jsx as jsx378 } from "react/jsx-runtime";
 import { jsx as jsx379 } from "react/jsx-runtime";
 import { jsx as jsx380 } from "react/jsx-runtime";
 import { jsx as jsx381 } from "react/jsx-runtime";
-var StyledIcon2 = styled8.div`
+var StyledIcon2 = styled4.div`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -869,7 +641,7 @@ var BaseIcon = ({
 }) => {
   const svgContent = variant === "line" ? lineContent381 : solidContent381;
   const sizeValue = typeof size === "number" ? `${size}px` : size;
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx4(
     StyledIcon2,
     {
       $size: sizeValue,
@@ -906,46 +678,21 @@ import {
 } from "react";
 
 // ../tag/dist/web/index.mjs
-import React4 from "react";
-import styled10 from "styled-components";
-import { jsx as jsx384 } from "react/jsx-runtime";
-import styled23 from "styled-components";
+import React2 from "react";
+import styled6 from "styled-components";
+import { jsx as jsx383 } from "react/jsx-runtime";
+import styled22 from "styled-components";
 import { jsx as jsx2101 } from "react/jsx-runtime";
-import styled33, { keyframes as keyframes3 } from "styled-components";
-import { jsx as jsx385 } from "react/jsx-runtime";
-import styled43 from "styled-components";
-import { jsx as jsx411 } from "react/jsx-runtime";
-import styled53 from "styled-components";
-import { jsx as jsx511 } from "react/jsx-runtime";
-import { forwardRef as forwardRef6 } from "react";
-import styled63 from "styled-components";
-import { jsx as jsx611 } from "react/jsx-runtime";
-import { forwardRef as forwardRef23 } from "react";
-import styled73 from "styled-components";
-import { jsx as jsx711 } from "react/jsx-runtime";
+import styled32 from "styled-components";
+import { jsx as jsx384 } from "react/jsx-runtime";
 import { useDesignSystem } from "@xsolla/xui-core";
 
 // ../icons/dist/web/index.mjs
-import React3 from "react";
-import styled9 from "styled-components";
+import styled5 from "styled-components";
 import { jsx as jsx382 } from "react/jsx-runtime";
-import styled22 from "styled-components";
-import { jsx as jsx2100 } from "react/jsx-runtime";
-import styled32, { keyframes as keyframes2 } from "styled-components";
-import { jsx as jsx383 } from "react/jsx-runtime";
-import styled42 from "styled-components";
-import { jsx as jsx410 } from "react/jsx-runtime";
-import styled52 from "styled-components";
-import { jsx as jsx510 } from "react/jsx-runtime";
-import { forwardRef as forwardRef5 } from "react";
-import styled62 from "styled-components";
-import { jsx as jsx610 } from "react/jsx-runtime";
-import { forwardRef as forwardRef22 } from "react";
-import styled72 from "styled-components";
-import { jsx as jsx710 } from "react/jsx-runtime";
 
 // ../../node_modules/lucide-react/dist/esm/createLucideIcon.js
-import { forwardRef as forwardRef4, createElement as createElement2 } from "react";
+import { forwardRef as forwardRef2, createElement as createElement2 } from "react";
 
 // ../../node_modules/lucide-react/dist/esm/shared/src/utils.js
 var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
@@ -954,7 +701,7 @@ var mergeClasses = (...classes) => classes.filter((className, index, array) => {
 }).join(" ").trim();
 
 // ../../node_modules/lucide-react/dist/esm/Icon.js
-import { forwardRef as forwardRef3, createElement } from "react";
+import { forwardRef, createElement } from "react";
 
 // ../../node_modules/lucide-react/dist/esm/defaultAttributes.js
 var defaultAttributes = {
@@ -970,7 +717,7 @@ var defaultAttributes = {
 };
 
 // ../../node_modules/lucide-react/dist/esm/Icon.js
-var Icon2 = forwardRef3(
+var Icon2 = forwardRef(
   ({
     color = "currentColor",
     size = 24,
@@ -1003,7 +750,7 @@ var Icon2 = forwardRef3(
 
 // ../../node_modules/lucide-react/dist/esm/createLucideIcon.js
 var createLucideIcon = (iconName, iconNode) => {
-  const Component = forwardRef4(
+  const Component = forwardRef2(
     ({ className, ...props }, ref) => createElement2(Icon2, {
       ref,
       iconNode,
@@ -1022,222 +769,8 @@ var X = createLucideIcon("X", [
 ]);
 
 // ../icons/dist/web/index.mjs
-import { jsx as jsx810 } from "react/jsx-runtime";
-var StyledBox2 = styled9.div`
-  display: flex;
-  box-sizing: border-box;
-  background-color: ${(props) => props.backgroundColor || "transparent"};
-  border-color: ${(props) => props.borderColor || "transparent"};
-  border-width: ${(props) => typeof props.borderWidth === "number" ? `${props.borderWidth}px` : props.borderWidth || 0};
-
-  ${(props) => props.borderBottomWidth !== void 0 && `
-    border-bottom-width: ${typeof props.borderBottomWidth === "number" ? `${props.borderBottomWidth}px` : props.borderBottomWidth};
-    border-bottom-color: ${props.borderBottomColor || props.borderColor || "transparent"};
-    border-bottom-style: solid;
-  `}
-  ${(props) => props.borderTopWidth !== void 0 && `
-    border-top-width: ${typeof props.borderTopWidth === "number" ? `${props.borderTopWidth}px` : props.borderTopWidth};
-    border-top-color: ${props.borderTopColor || props.borderColor || "transparent"};
-    border-top-style: solid;
-  `}
-  ${(props) => props.borderLeftWidth !== void 0 && `
-    border-left-width: ${typeof props.borderLeftWidth === "number" ? `${props.borderLeftWidth}px` : props.borderLeftWidth};
-    border-left-color: ${props.borderLeftColor || props.borderColor || "transparent"};
-    border-left-style: solid;
-  `}
-  ${(props) => props.borderRightWidth !== void 0 && `
-    border-right-width: ${typeof props.borderRightWidth === "number" ? `${props.borderRightWidth}px` : props.borderRightWidth};
-    border-right-color: ${props.borderRightColor || props.borderColor || "transparent"};
-    border-right-style: solid;
-  `}
-
-  border-style: ${(props) => props.borderStyle || (props.borderWidth || props.borderBottomWidth || props.borderTopWidth || props.borderLeftWidth || props.borderRightWidth ? "solid" : "none")};
-  border-radius: ${(props) => typeof props.borderRadius === "number" ? `${props.borderRadius}px` : props.borderRadius || 0};
-  height: ${(props) => typeof props.height === "number" ? `${props.height}px` : props.height || "auto"};
-  width: ${(props) => typeof props.width === "number" ? `${props.width}px` : props.width || "auto"};
-  min-width: ${(props) => typeof props.minWidth === "number" ? `${props.minWidth}px` : props.minWidth || "auto"};
-  min-height: ${(props) => typeof props.minHeight === "number" ? `${props.minHeight}px` : props.minHeight || "auto"};
-
-  padding: ${(props) => typeof props.padding === "number" ? `${props.padding}px` : props.padding || 0};
-  ${(props) => props.paddingHorizontal && `
-    padding-left: ${typeof props.paddingHorizontal === "number" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};
-    padding-right: ${typeof props.paddingHorizontal === "number" ? `${props.paddingHorizontal}px` : props.paddingHorizontal};
-  `}
-  ${(props) => props.paddingVertical && `
-    padding-top: ${typeof props.paddingVertical === "number" ? `${props.paddingVertical}px` : props.paddingVertical};
-    padding-bottom: ${typeof props.paddingVertical === "number" ? `${props.paddingVertical}px` : props.paddingVertical};
-  `}
-  ${(props) => props.paddingTop !== void 0 && `padding-top: ${typeof props.paddingTop === "number" ? `${props.paddingTop}px` : props.paddingTop};`}
-  ${(props) => props.paddingBottom !== void 0 && `padding-bottom: ${typeof props.paddingBottom === "number" ? `${props.paddingBottom}px` : props.paddingBottom};`}
-  ${(props) => props.paddingLeft !== void 0 && `padding-left: ${typeof props.paddingLeft === "number" ? `${props.paddingLeft}px` : props.paddingLeft};`}
-  ${(props) => props.paddingRight !== void 0 && `padding-right: ${typeof props.paddingRight === "number" ? `${props.paddingRight}px` : props.paddingRight};`}
-
-  margin: ${(props) => typeof props.margin === "number" ? `${props.margin}px` : props.margin || 0};
-  ${(props) => props.marginTop !== void 0 && `margin-top: ${typeof props.marginTop === "number" ? `${props.marginTop}px` : props.marginTop};`}
-  ${(props) => props.marginBottom !== void 0 && `margin-bottom: ${typeof props.marginBottom === "number" ? `${props.marginBottom}px` : props.marginBottom};`}
-  ${(props) => props.marginLeft !== void 0 && `margin-left: ${typeof props.marginLeft === "number" ? `${props.marginLeft}px` : props.marginLeft};`}
-  ${(props) => props.marginRight !== void 0 && `margin-right: ${typeof props.marginRight === "number" ? `${props.marginRight}px` : props.marginRight};`}
-
-  flex-direction: ${(props) => props.flexDirection || "column"};
-  flex-wrap: ${(props) => props.flexWrap || "nowrap"};
-  align-items: ${(props) => props.alignItems || "stretch"};
-  justify-content: ${(props) => props.justifyContent || "flex-start"};
-  cursor: ${(props) => props.cursor ? props.cursor : props.onClick || props.onPress ? "pointer" : "inherit"};
-  position: ${(props) => props.position || "static"};
-  top: ${(props) => typeof props.top === "number" ? `${props.top}px` : props.top};
-  bottom: ${(props) => typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom};
-  left: ${(props) => typeof props.left === "number" ? `${props.left}px` : props.left};
-  right: ${(props) => typeof props.right === "number" ? `${props.right}px` : props.right};
-  flex: ${(props) => props.flex};
-  flex-shrink: ${(props) => props.flexShrink ?? 1};
-  gap: ${(props) => typeof props.gap === "number" ? `${props.gap}px` : props.gap || 0};
-  align-self: ${(props) => props.alignSelf || "auto"};
-  overflow: ${(props) => props.overflow || "visible"};
-  overflow-x: ${(props) => props.overflowX || "visible"};
-  overflow-y: ${(props) => props.overflowY || "visible"};
-  z-index: ${(props) => props.zIndex};
-  opacity: ${(props) => props.disabled ? 0.5 : 1};
-  pointer-events: ${(props) => props.disabled ? "none" : "auto"};
-
-  &:hover {
-    ${(props) => props.hoverStyle?.backgroundColor && `background-color: ${props.hoverStyle.backgroundColor};`}
-    ${(props) => props.hoverStyle?.borderColor && `border-color: ${props.hoverStyle.borderColor};`}
-  }
-
-  &:active {
-    ${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
-  }
-`;
-var Box2 = React3.forwardRef(
-  ({
-    children,
-    onPress,
-    onKeyDown,
-    onKeyUp,
-    role,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-current": ariaCurrent,
-    "aria-disabled": ariaDisabled,
-    "aria-live": ariaLive,
-    "aria-busy": ariaBusy,
-    "aria-describedby": ariaDescribedBy,
-    "aria-expanded": ariaExpanded,
-    "aria-haspopup": ariaHasPopup,
-    "aria-pressed": ariaPressed,
-    "aria-controls": ariaControls,
-    tabIndex,
-    as,
-    src,
-    alt,
-    type,
-    disabled,
-    id,
-    ...props
-  }, ref) => {
-    if (as === "img" && src) {
-      return /* @__PURE__ */ jsx382(
-        "img",
-        {
-          src,
-          alt: alt || "",
-          style: {
-            display: "block",
-            objectFit: "cover",
-            width: typeof props.width === "number" ? `${props.width}px` : props.width,
-            height: typeof props.height === "number" ? `${props.height}px` : props.height,
-            borderRadius: typeof props.borderRadius === "number" ? `${props.borderRadius}px` : props.borderRadius,
-            position: props.position,
-            top: typeof props.top === "number" ? `${props.top}px` : props.top,
-            left: typeof props.left === "number" ? `${props.left}px` : props.left,
-            right: typeof props.right === "number" ? `${props.right}px` : props.right,
-            bottom: typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom
-          }
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx382(
-      StyledBox2,
-      {
-        ref,
-        as,
-        id,
-        type: as === "button" ? type || "button" : void 0,
-        disabled: as === "button" ? disabled : void 0,
-        onClick: onPress,
-        onKeyDown,
-        onKeyUp,
-        role,
-        "aria-label": ariaLabel,
-        "aria-labelledby": ariaLabelledBy,
-        "aria-current": ariaCurrent,
-        "aria-disabled": ariaDisabled,
-        "aria-busy": ariaBusy,
-        "aria-describedby": ariaDescribedBy,
-        "aria-expanded": ariaExpanded,
-        "aria-haspopup": ariaHasPopup,
-        "aria-pressed": ariaPressed,
-        "aria-controls": ariaControls,
-        "aria-live": ariaLive,
-        tabIndex: tabIndex !== void 0 ? tabIndex : void 0,
-        ...props,
-        children
-      }
-    );
-  }
-);
-Box2.displayName = "Box";
-var StyledText2 = styled22.span`
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-weight: ${(props) => props.fontWeight || "normal"};
-  font-family: ${(props) => props.fontFamily || '"Pilat Wide Bold", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important'};
-  line-height: ${(props) => typeof props.lineHeight === "number" ? `${props.lineHeight}px` : props.lineHeight || "inherit"};
-  white-space: ${(props) => props.whiteSpace || "normal"};
-  text-align: ${(props) => props.textAlign || "inherit"};
-  text-decoration: ${(props) => props.textDecoration || "none"};
-`;
-var rotate2 = keyframes2`
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-`;
-var StyledSpinner2 = styled32.div`
-  width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  border: ${(props) => props.strokeWidth || 2}px solid
-    ${(props) => props.color || "currentColor"};
-  border-bottom-color: transparent;
-  border-radius: 50%;
-  display: inline-block;
-  box-sizing: border-box;
-  animation: ${rotate2} 1s linear infinite;
-`;
-var Spinner2 = ({
-  role = "status",
-  "aria-label": ariaLabel,
-  "aria-live": ariaLive = "polite",
-  "aria-describedby": ariaDescribedBy,
-  testID,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx383(
-    StyledSpinner2,
-    {
-      role,
-      "aria-label": ariaLabel,
-      "aria-live": ariaLive,
-      "aria-describedby": ariaDescribedBy,
-      "data-testid": testID,
-      ...props
-    }
-  );
-};
-Spinner2.displayName = "Spinner";
-var StyledIcon3 = styled42.div`
+import { jsx as jsx2100 } from "react/jsx-runtime";
+var StyledIcon3 = styled5.div`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1253,183 +786,13 @@ var StyledIcon3 = styled42.div`
   }
 `;
 var Icon3 = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx410(StyledIcon3, { ...props, children });
+  return /* @__PURE__ */ jsx382(StyledIcon3, { ...props, children });
 };
-var StyledDivider2 = styled52.div`
-  background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
-  width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
-  height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-
-  ${(props) => props.dashStroke && `
-    border-style: dashed;
-    border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
-    border-width: 0;
-    ${props.vertical ? `
-      border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
-      height: 100%;
-    ` : `
-      border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-      width: 100%;
-    `}
-  `}
-`;
-var StyledInput2 = styled62.input`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var InputPrimitive2 = forwardRef5(
-  ({
-    value,
-    placeholder,
-    onChange,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    secureTextEntry,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    name,
-    type,
-    inputMode,
-    autoComplete,
-    id,
-    "aria-invalid": ariaInvalid,
-    "aria-describedby": ariaDescribedBy,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-label": ariaLabel,
-    "aria-disabled": ariaDisabled,
-    "data-testid": dataTestId,
-    ...rest
-  }, ref) => {
-    const handleChange = (e) => {
-      if (onChange) {
-        onChange(e);
-      }
-      if (onChangeText) {
-        onChangeText(e.target.value);
-      }
-    };
-    const inputValue = value !== void 0 ? value : "";
-    return /* @__PURE__ */ jsx610(
-      StyledInput2,
-      {
-        ref,
-        id,
-        value: inputValue,
-        name,
-        placeholder,
-        onChange: handleChange,
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        type: secureTextEntry ? "password" : type || "text",
-        inputMode,
-        autoComplete,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        "aria-invalid": ariaInvalid,
-        "aria-describedby": ariaDescribedBy,
-        "aria-labelledby": ariaLabelledBy,
-        "aria-label": ariaLabel,
-        "aria-disabled": ariaDisabled,
-        "data-testid": dataTestId,
-        ...rest
-      }
-    );
-  }
-);
-InputPrimitive2.displayName = "InputPrimitive";
-var StyledTextArea2 = styled72.textarea`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-  resize: none;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var TextAreaPrimitive2 = forwardRef22(
-  ({
-    value,
-    placeholder,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    rows
-  }, ref) => {
-    return /* @__PURE__ */ jsx710(
-      StyledTextArea2,
-      {
-        ref,
-        value,
-        placeholder,
-        onChange: (e) => onChangeText?.(e.target.value),
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        rows
-      }
-    );
-  }
-);
-TextAreaPrimitive2.displayName = "TextAreaPrimitive";
-var X2 = (props) => /* @__PURE__ */ jsx810(Icon3, { ...props, children: /* @__PURE__ */ jsx810(X, { size: "100%" }) });
+var X2 = (props) => /* @__PURE__ */ jsx2100(Icon3, { ...props, children: /* @__PURE__ */ jsx2100(X, { size: "100%" }) });
 
 // ../tag/dist/web/index.mjs
-import { jsx as jsx811, jsxs } from "react/jsx-runtime";
-var StyledBox3 = styled10.div`
+import { jsx as jsx410, jsxs } from "react/jsx-runtime";
+var StyledBox2 = styled6.div`
   display: flex;
   box-sizing: border-box;
   background-color: ${(props) => props.backgroundColor || "transparent"};
@@ -1514,7 +877,7 @@ var StyledBox3 = styled10.div`
     ${(props) => props.pressStyle?.backgroundColor && `background-color: ${props.pressStyle.backgroundColor};`}
   }
 `;
-var Box3 = React4.forwardRef(
+var Box2 = React2.forwardRef(
   ({
     children,
     onPress,
@@ -1542,7 +905,7 @@ var Box3 = React4.forwardRef(
     ...props
   }, ref) => {
     if (as === "img" && src) {
-      return /* @__PURE__ */ jsx384(
+      return /* @__PURE__ */ jsx383(
         "img",
         {
           src,
@@ -1562,8 +925,8 @@ var Box3 = React4.forwardRef(
         }
       );
     }
-    return /* @__PURE__ */ jsx384(
-      StyledBox3,
+    return /* @__PURE__ */ jsx383(
+      StyledBox2,
       {
         ref,
         as,
@@ -1592,8 +955,8 @@ var Box3 = React4.forwardRef(
     );
   }
 );
-Box3.displayName = "Box";
-var StyledText3 = styled23.span`
+Box2.displayName = "Box";
+var StyledText2 = styled22.span`
   color: ${(props) => props.color || "inherit"};
   font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
   font-weight: ${(props) => props.fontWeight || "normal"};
@@ -1611,7 +974,7 @@ var Text2 = ({
   ...props
 }) => {
   return /* @__PURE__ */ jsx2101(
-    StyledText3,
+    StyledText2,
     {
       ...props,
       style,
@@ -1621,47 +984,7 @@ var Text2 = ({
     }
   );
 };
-var rotate3 = keyframes3`
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-`;
-var StyledSpinner3 = styled33.div`
-  width: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  height: ${(props) => typeof props.size === "number" ? `${props.size}px` : props.size || "24px"};
-  border: ${(props) => props.strokeWidth || 2}px solid
-    ${(props) => props.color || "currentColor"};
-  border-bottom-color: transparent;
-  border-radius: 50%;
-  display: inline-block;
-  box-sizing: border-box;
-  animation: ${rotate3} 1s linear infinite;
-`;
-var Spinner3 = ({
-  role = "status",
-  "aria-label": ariaLabel,
-  "aria-live": ariaLive = "polite",
-  "aria-describedby": ariaDescribedBy,
-  testID,
-  ...props
-}) => {
-  return /* @__PURE__ */ jsx385(
-    StyledSpinner3,
-    {
-      role,
-      "aria-label": ariaLabel,
-      "aria-live": ariaLive,
-      "aria-describedby": ariaDescribedBy,
-      "data-testid": testID,
-      ...props
-    }
-  );
-};
-Spinner3.displayName = "Spinner";
-var StyledIcon4 = styled43.div`
+var StyledIcon4 = styled32.div`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1677,178 +1000,8 @@ var StyledIcon4 = styled43.div`
   }
 `;
 var Icon4 = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx411(StyledIcon4, { ...props, children });
+  return /* @__PURE__ */ jsx384(StyledIcon4, { ...props, children });
 };
-var StyledDivider3 = styled53.div`
-  background-color: ${(props) => props.dashStroke ? "transparent" : props.color || "rgba(255, 255, 255, 0.15)"};
-  width: ${(props) => props.vertical ? typeof props.width === "number" ? `${props.width}px` : props.width || "1px" : "100%"};
-  height: ${(props) => props.vertical ? "100%" : typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-
-  ${(props) => props.dashStroke && `
-    border-style: dashed;
-    border-color: ${props.color || "rgba(255, 255, 255, 0.15)"};
-    border-width: 0;
-    ${props.vertical ? `
-      border-left-width: ${typeof props.width === "number" ? `${props.width}px` : props.width || "1px"};
-      height: 100%;
-    ` : `
-      border-top-width: ${typeof props.height === "number" ? `${props.height}px` : props.height || "1px"};
-      width: 100%;
-    `}
-  `}
-`;
-var StyledInput3 = styled63.input`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var InputPrimitive3 = forwardRef6(
-  ({
-    value,
-    placeholder,
-    onChange,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    secureTextEntry,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    name,
-    type,
-    inputMode,
-    autoComplete,
-    id,
-    "aria-invalid": ariaInvalid,
-    "aria-describedby": ariaDescribedBy,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-label": ariaLabel,
-    "aria-disabled": ariaDisabled,
-    "data-testid": dataTestId,
-    ...rest
-  }, ref) => {
-    const handleChange = (e) => {
-      if (onChange) {
-        onChange(e);
-      }
-      if (onChangeText) {
-        onChangeText(e.target.value);
-      }
-    };
-    const inputValue = value !== void 0 ? value : "";
-    return /* @__PURE__ */ jsx611(
-      StyledInput3,
-      {
-        ref,
-        id,
-        value: inputValue,
-        name,
-        placeholder,
-        onChange: handleChange,
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        type: secureTextEntry ? "password" : type || "text",
-        inputMode,
-        autoComplete,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        "aria-invalid": ariaInvalid,
-        "aria-describedby": ariaDescribedBy,
-        "aria-labelledby": ariaLabelledBy,
-        "aria-label": ariaLabel,
-        "aria-disabled": ariaDisabled,
-        "data-testid": dataTestId,
-        ...rest
-      }
-    );
-  }
-);
-InputPrimitive3.displayName = "InputPrimitive";
-var StyledTextArea3 = styled73.textarea`
-  background: transparent;
-  border: none;
-  outline: none;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  color: ${(props) => props.color || "inherit"};
-  font-size: ${(props) => typeof props.fontSize === "number" ? `${props.fontSize}px` : props.fontSize || "inherit"};
-  font-family: inherit;
-  text-align: inherit;
-  resize: none;
-
-  &::placeholder {
-    color: ${(props) => props.placeholderTextColor || "rgba(255, 255, 255, 0.5)"};
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`;
-var TextAreaPrimitive3 = forwardRef23(
-  ({
-    value,
-    placeholder,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    rows
-  }, ref) => {
-    return /* @__PURE__ */ jsx711(
-      StyledTextArea3,
-      {
-        ref,
-        value,
-        placeholder,
-        onChange: (e) => onChangeText?.(e.target.value),
-        onFocus,
-        onBlur,
-        onKeyDown,
-        disabled,
-        style,
-        color,
-        fontSize,
-        placeholderTextColor,
-        maxLength,
-        rows
-      }
-    );
-  }
-);
-TextAreaPrimitive3.displayName = "TextAreaPrimitive";
 var Tag = ({
   size = "md",
   tone = "primary",
@@ -1909,7 +1062,7 @@ var Tag = ({
   };
   const { bg, text } = resolveColors();
   return /* @__PURE__ */ jsxs(
-    Box3,
+    Box2,
     {
       backgroundColor: bg,
       borderRadius: sizeStyles.radius,
@@ -1925,8 +1078,8 @@ var Tag = ({
         whiteSpace: "nowrap"
       },
       children: [
-        icon && /* @__PURE__ */ jsx811(Icon4, { size: sizeStyles.iconSize, color: text, children: icon }),
-        /* @__PURE__ */ jsx811(
+        icon && /* @__PURE__ */ jsx410(Icon4, { size: sizeStyles.iconSize, color: text, children: icon }),
+        /* @__PURE__ */ jsx410(
           Text2,
           {
             color: text,
@@ -1940,7 +1093,7 @@ var Tag = ({
             children
           }
         ),
-        onRemove && /* @__PURE__ */ jsx811(Box3, { onPress: onRemove, children: /* @__PURE__ */ jsx811(X2, { size: sizeStyles.iconSize, color: text }) })
+        onRemove && /* @__PURE__ */ jsx410(Box2, { onPress: onRemove, children: /* @__PURE__ */ jsx410(X2, { size: sizeStyles.iconSize, color: text }) })
       ]
     }
   );
@@ -1948,7 +1101,7 @@ var Tag = ({
 
 // src/useMultiSelectControl.tsx
 import { useDesignSystem as useDesignSystem2 } from "@xsolla/xui-core";
-import { jsx as jsx386, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx385, jsxs as jsxs2 } from "react/jsx-runtime";
 var COUNT_ITEM_VALUE = "count-item";
 var useMultiSelectControl = ({
   variant,
@@ -2008,7 +1161,7 @@ var useMultiSelectControl = ({
   };
   const setPlaceholder = () => {
     setSelectedContent(
-      /* @__PURE__ */ jsx386(
+      /* @__PURE__ */ jsx385(
         Text,
         {
           color: theme.colors.control.input.placeholder,
@@ -2059,7 +1212,7 @@ var useMultiSelectControl = ({
       const isCount = item.value === COUNT_ITEM_VALUE;
       const isReducable = index === 0 && displayStateRef.current === 3 /* Render */ && displayedItemsCount === 0 || flexible;
       if (variant === "tag") {
-        return /* @__PURE__ */ jsx386(
+        return /* @__PURE__ */ jsx385(
           Box,
           {
             onPress: !isCount ? (e) => {
@@ -2071,7 +1224,7 @@ var useMultiSelectControl = ({
               opacity: disabled ? 0.5 : 1,
               cursor: disabled || isCount ? "not-allowed" : "pointer"
             },
-            children: /* @__PURE__ */ jsx386(
+            children: /* @__PURE__ */ jsx385(
               Tag,
               {
                 size,
@@ -2191,8 +1344,8 @@ var useMultiSelectControl = ({
 };
 
 // src/MultiSelectControl.tsx
-import { jsx as jsx387, jsxs as jsxs3 } from "react/jsx-runtime";
-var MultiSelectControl = forwardRef7(
+import { jsx as jsx386, jsxs as jsxs3 } from "react/jsx-runtime";
+var MultiSelectControl = forwardRef3(
   ({
     variant = "tag",
     flexible = true,
@@ -2292,8 +1445,8 @@ var MultiSelectControl = forwardRef7(
               gap: 8,
               style: { minWidth: 0 },
               children: [
-                iconLeft && /* @__PURE__ */ jsx387(Icon, { size: sizeStyles.iconSize, color: iconColor, variant: "line", children: iconLeft }),
-                /* @__PURE__ */ jsx387(
+                iconLeft && /* @__PURE__ */ jsx386(Icon, { size: sizeStyles.iconSize, color: iconColor, variant: "line", children: iconLeft }),
+                /* @__PURE__ */ jsx386(
                   Box,
                   {
                     ref: itemsRef,
@@ -2313,7 +1466,7 @@ var MultiSelectControl = forwardRef7(
             }
           ),
           /* @__PURE__ */ jsxs3(Box, { flexDirection: "row", alignItems: "center", gap: 4, children: [
-            extraClear && selectedItems.length > 0 && !isDisable && /* @__PURE__ */ jsx387(
+            extraClear && selectedItems.length > 0 && !isDisable && /* @__PURE__ */ jsx386(
               Box,
               {
                 onPress: (e) => {
@@ -2321,17 +1474,17 @@ var MultiSelectControl = forwardRef7(
                   removeAllValues();
                 },
                 style: { cursor: "pointer" },
-                children: /* @__PURE__ */ jsx387(Remove, { size: 18, color: iconColor, variant: "line" })
+                children: /* @__PURE__ */ jsx386(Remove, { size: 18, color: iconColor, variant: "line" })
               }
             ),
-            isError && /* @__PURE__ */ jsx387(
+            isError && /* @__PURE__ */ jsx386(
               ExclamationMarkCr,
               {
                 size: 18,
                 color: theme.colors.content.alert.primary
               }
             ),
-            iconRight ? iconRight : isOpen ? /* @__PURE__ */ jsx387(ChevronUp, { size: 18, color: iconColor, variant: "line" }) : /* @__PURE__ */ jsx387(ChevronDown, { size: 18, color: iconColor })
+            iconRight ? iconRight : isOpen ? /* @__PURE__ */ jsx386(ChevronUp, { size: 18, color: iconColor, variant: "line" }) : /* @__PURE__ */ jsx386(ChevronDown, { size: 18, color: iconColor })
           ] })
         ]
       }
@@ -2432,8 +1585,8 @@ var useMultiSelect = ({
 };
 
 // src/MultiSelect.tsx
-import { Fragment, jsx as jsx388, jsxs as jsxs4 } from "react/jsx-runtime";
-var MultiSelect = forwardRef8(
+import { Fragment, jsx as jsx387, jsxs as jsxs4 } from "react/jsx-runtime";
+var MultiSelect = forwardRef4(
   ({
     options,
     errorMessage,
@@ -2497,7 +1650,7 @@ var MultiSelect = forwardRef8(
       onChoose(newValues.map(String));
     };
     return /* @__PURE__ */ jsxs4(Box, { flexDirection: "column", gap: sizeStyles.fieldGap, children: [
-      label && /* @__PURE__ */ jsx388(
+      label && /* @__PURE__ */ jsx387(
         Text,
         {
           color: theme.colors.content.secondary,
@@ -2514,7 +1667,7 @@ var MultiSelect = forwardRef8(
             position: "relative"
           },
           children: [
-            /* @__PURE__ */ jsx388(
+            /* @__PURE__ */ jsx387(
               MultiSelectControl,
               {
                 ref: controlRef,
@@ -2539,7 +1692,7 @@ var MultiSelect = forwardRef8(
               }
             ),
             isOpen && !isDisable && /* @__PURE__ */ jsxs4(Fragment, { children: [
-              /* @__PURE__ */ jsx388(
+              /* @__PURE__ */ jsx387(
                 Box,
                 {
                   style: {
@@ -2554,7 +1707,7 @@ var MultiSelect = forwardRef8(
                   onPress: onClose
                 }
               ),
-              /* @__PURE__ */ jsx388(
+              /* @__PURE__ */ jsx387(
                 Box,
                 {
                   ref: menuRef,
@@ -2578,7 +1731,7 @@ var MultiSelect = forwardRef8(
                   children: menuItems.map((item, _index) => {
                     const brandColors = theme.colors.control.brand.primary;
                     const contentColors = theme.colors.content;
-                    return /* @__PURE__ */ jsx388(
+                    return /* @__PURE__ */ jsx387(
                       Box,
                       {
                         paddingHorizontal: sizeStyles.paddingHorizontal,
@@ -2599,7 +1752,7 @@ var MultiSelect = forwardRef8(
                           cursor: item.disabled ? "not-allowed" : "pointer",
                           opacity: item.disabled ? 0.5 : 1
                         },
-                        children: /* @__PURE__ */ jsx388(
+                        children: /* @__PURE__ */ jsx387(
                           Text,
                           {
                             color: item.checked ? contentColors.on.brand : theme.colors.content.secondary,
@@ -2618,7 +1771,7 @@ var MultiSelect = forwardRef8(
           ]
         }
       ),
-      errorMessage && /* @__PURE__ */ jsx388(
+      errorMessage && /* @__PURE__ */ jsx387(
         Text,
         {
           color: theme.colors.content.alert.primary,