@xsolla/xui-multi-select 0.69.0 → 0.70.0-pr104.1769410985

package/native/index.d.mts

@@ -2,7 +2,7 @@ import React, { ReactNode } from 'react';
 
 type MultiSelectValue = (string | number)[];
 type MultiSelectVariant = "tag" | "text";
-type MultiSelectSize = "xs" | "s" | "m" | "l" | "xl";
+type MultiSelectSize = "xs" | "sm" | "md" | "lg" | "xl";
 type MultiSelectState = "default" | "hover" | "focus" | "disable" | "error";
 interface MultiSelectOption {
     label: ReactNode;
@@ -33,7 +33,7 @@ interface MultiSelectProps {
     errorMessage?: string;
     /**
      * Property for changing the size of the control.
-     * @default "m"
+     * @default "md"
      */
     size?: MultiSelectSize;
     /**

package/native/index.d.ts

@@ -2,7 +2,7 @@ import React, { ReactNode } from 'react';
 
 type MultiSelectValue = (string | number)[];
 type MultiSelectVariant = "tag" | "text";
-type MultiSelectSize = "xs" | "s" | "m" | "l" | "xl";
+type MultiSelectSize = "xs" | "sm" | "md" | "lg" | "xl";
 type MultiSelectState = "default" | "hover" | "focus" | "disable" | "error";
 interface MultiSelectOption {
     label: ReactNode;
@@ -33,7 +33,7 @@ interface MultiSelectProps {
     errorMessage?: string;
     /**
      * Property for changing the size of the control.
-     * @default "m"
+     * @default "md"
      */
     size?: MultiSelectSize;
     /**

package/native/index.js

@@ -1908,7 +1908,7 @@ var TextAreaPrimitive3 = (0, import_react11.forwardRef)(
 );
 TextAreaPrimitive3.displayName = "TextAreaPrimitive";
 var Tag = ({
-  size = "m",
+  size = "md",
   tone = "primary",
   children,
   icon,
@@ -2007,7 +2007,9 @@ var useMultiSelectControl = ({
   const savedWidthsRef = (0, import_react12.useRef)(null);
   const itemsRef = (0, import_react12.useRef)(null);
   const [itemsWidth, setItemsWidth] = (0, import_react12.useState)(0);
-  const [selectedContent, setSelectedContent] = (0, import_react12.useState)(null);
+  const [selectedContent, setSelectedContent] = (0, import_react12.useState)(
+    null
+  );
   const isPlaceholder = !selectedItems || selectedItems.length === 0;
   (0, import_react12.useEffect)(() => {
     if (!containerRef.current) return;
@@ -2033,8 +2035,10 @@ var useMultiSelectControl = ({
     if (!prev) return true;
     if (prev.variant !== widthsDependencies.variant) return true;
     if (prev.size !== widthsDependencies.size) return true;
-    if (prev.removeTagsButtons !== widthsDependencies.removeTagsButtons) return true;
-    if (prev.stateList.length !== widthsDependencies.stateList.length) return true;
+    if (prev.removeTagsButtons !== widthsDependencies.removeTagsButtons)
+      return true;
+    if (prev.stateList.length !== widthsDependencies.stateList.length)
+      return true;
     let i = 0;
     for (const v of prev.stateList) {
       if (v !== widthsDependencies.stateList[i]) return true;
@@ -2238,7 +2242,7 @@ var MultiSelectControl = (0, import_react13.forwardRef)(
     onClick,
     removeValue,
     removeAllValues,
-    size = "m",
+    size = "md",
     state: externalState,
     isError = false,
     isOpen = false,
@@ -2273,9 +2277,9 @@ var MultiSelectControl = (0, import_react13.forwardRef)(
     });
     const tagItemsGap = {
       xs: 4,
-      s: 4,
-      m: 6,
-      l: 8,
+      sm: 4,
+      md: 6,
+      lg: 8,
       xl: 10
     }[size];
     let backgroundColor = inputColors.bg;
@@ -2471,7 +2475,7 @@ var MultiSelect = (0, import_react15.forwardRef)(
     options,
     errorMessage,
     value = [],
-    size = "m",
+    size = "md",
     state: externalState,
     label,
     extraClear = false,