@xsolla/xui-slider 0.89.0 → 0.91.0

package/native/index.js

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.tsx
@@ -35,7 +25,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/Slider.tsx
-var import_react4 = require("react");
+var import_react = require("react");
 
 // ../primitives-native/src/Box.tsx
 var import_react_native = require("react-native");
@@ -238,263 +228,10 @@ var Text = ({
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native2.Text, { style, testID: id, accessibilityRole, children });
 };
 
-// ../primitives-native/src/Spinner.tsx
-var import_react_native3 = require("react-native");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var Spinner = ({
-  color,
-  size,
-  role,
-  "aria-label": ariaLabel,
-  "aria-live": ariaLive,
-  testID
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    import_react_native3.View,
-    {
-      accessible: true,
-      accessibilityRole: role === "status" ? "none" : void 0,
-      accessibilityLabel: ariaLabel,
-      accessibilityLiveRegion: ariaLive === "polite" ? "polite" : ariaLive === "assertive" ? "assertive" : "none",
-      testID,
-      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        import_react_native3.ActivityIndicator,
-        {
-          color,
-          size: typeof size === "number" ? size : "small"
-        }
-      )
-    }
-  );
-};
-Spinner.displayName = "Spinner";
-
-// ../primitives-native/src/Icon.tsx
-var import_react = __toESM(require("react"));
-var import_react_native4 = require("react-native");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-
-// ../primitives-native/src/Divider.tsx
-var import_react_native5 = require("react-native");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-
-// ../primitives-native/src/Input.tsx
-var import_react2 = require("react");
-var import_react_native6 = require("react-native");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var keyboardTypeMap = {
-  text: "default",
-  number: "numeric",
-  email: "email-address",
-  tel: "phone-pad",
-  url: "url",
-  decimal: "decimal-pad"
-};
-var inputModeToKeyboardType = {
-  none: "default",
-  text: "default",
-  decimal: "decimal-pad",
-  numeric: "number-pad",
-  tel: "phone-pad",
-  search: "default",
-  email: "email-address",
-  url: "url"
-};
-var autoCompleteToTextContentType = {
-  "one-time-code": "oneTimeCode",
-  email: "emailAddress",
-  username: "username",
-  password: "password",
-  "new-password": "newPassword",
-  tel: "telephoneNumber",
-  "postal-code": "postalCode",
-  name: "name"
-};
-var InputPrimitive = (0, import_react2.forwardRef)(
-  ({
-    value,
-    placeholder,
-    onChange,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    secureTextEntry,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    type,
-    inputMode,
-    autoComplete,
-    id,
-    "aria-describedby": ariaDescribedBy,
-    "aria-label": ariaLabel,
-    "aria-disabled": ariaDisabled,
-    "data-testid": dataTestId
-  }, ref) => {
-    const handleChangeText = (text) => {
-      onChangeText?.(text);
-      if (onChange) {
-        const syntheticEvent = {
-          target: { value: text },
-          currentTarget: { value: text },
-          type: "change",
-          nativeEvent: { text },
-          preventDefault: () => {
-          },
-          stopPropagation: () => {
-          },
-          isTrusted: false
-        };
-        onChange(syntheticEvent);
-      }
-    };
-    const keyboardType = inputMode ? inputModeToKeyboardType[inputMode] || "default" : type ? keyboardTypeMap[type] || "default" : "default";
-    const textContentType = autoComplete ? autoCompleteToTextContentType[autoComplete] : void 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      import_react_native6.TextInput,
-      {
-        ref,
-        value,
-        placeholder,
-        onChangeText: handleChangeText,
-        onFocus,
-        onBlur,
-        onKeyPress: (e) => {
-          if (onKeyDown) {
-            onKeyDown({
-              key: e.nativeEvent.key,
-              preventDefault: () => {
-              }
-            });
-          }
-        },
-        editable: !disabled,
-        secureTextEntry: secureTextEntry || type === "password",
-        keyboardType,
-        textContentType,
-        style: [
-          {
-            color,
-            fontSize: typeof fontSize === "number" ? fontSize : void 0,
-            flex: 1,
-            padding: 0,
-            textAlign: style?.textAlign || "left"
-          },
-          style
-        ],
-        placeholderTextColor,
-        maxLength,
-        testID: dataTestId || id,
-        accessibilityLabel: ariaLabel,
-        accessibilityHint: ariaDescribedBy,
-        accessibilityState: {
-          disabled: disabled || ariaDisabled
-        },
-        accessible: true
-      }
-    );
-  }
-);
-InputPrimitive.displayName = "InputPrimitive";
-
-// ../primitives-native/src/TextArea.tsx
-var import_react3 = require("react");
-var import_react_native7 = require("react-native");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var TextAreaPrimitive = (0, import_react3.forwardRef)(
-  ({
-    value,
-    placeholder,
-    onChange,
-    onChangeText,
-    onFocus,
-    onBlur,
-    onKeyDown,
-    disabled,
-    style,
-    color,
-    fontSize,
-    placeholderTextColor,
-    maxLength,
-    rows,
-    id,
-    "aria-describedby": ariaDescribedBy,
-    "aria-label": ariaLabel,
-    "aria-disabled": ariaDisabled,
-    "data-testid": dataTestId
-  }, ref) => {
-    const handleChangeText = (text) => {
-      onChangeText?.(text);
-      if (onChange) {
-        const syntheticEvent = {
-          target: { value: text },
-          currentTarget: { value: text },
-          type: "change",
-          nativeEvent: { text },
-          preventDefault: () => {
-          },
-          stopPropagation: () => {
-          },
-          isTrusted: false
-        };
-        onChange(syntheticEvent);
-      }
-    };
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-      import_react_native7.TextInput,
-      {
-        ref,
-        value,
-        placeholder,
-        onChangeText: handleChangeText,
-        onFocus,
-        onBlur,
-        onKeyPress: (e) => {
-          if (onKeyDown) {
-            onKeyDown({
-              key: e.nativeEvent.key,
-              preventDefault: () => {
-              }
-            });
-          }
-        },
-        editable: !disabled,
-        multiline: true,
-        numberOfLines: rows || 4,
-        style: [
-          {
-            color,
-            fontSize: typeof fontSize === "number" ? fontSize : void 0,
-            flex: 1,
-            padding: 0,
-            textAlignVertical: "top",
-            textAlign: style?.textAlign || "left"
-          },
-          style
-        ],
-        placeholderTextColor,
-        maxLength,
-        testID: dataTestId || id,
-        accessibilityLabel: ariaLabel,
-        accessibilityHint: ariaDescribedBy,
-        accessibilityState: {
-          disabled: disabled || ariaDisabled
-        },
-        accessible: true
-      }
-    );
-  }
-);
-TextAreaPrimitive.displayName = "TextAreaPrimitive";
-
 // src/Slider.tsx
 var import_xui_core = require("@xsolla/xui-core");
 var import_xui_input = require("@xsolla/xui-input");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 var sizeConfig = {
   xl: {
     height: 56,
@@ -575,20 +312,20 @@ var Slider = ({
   const safeId = rawId.replace(/:/g, "");
   const sliderId = `slider-${safeId}`;
   const labelId = `${sliderId}-label`;
-  const [value, setValue] = (0, import_react4.useState)(propValue);
-  const [rangeMin, setRangeMin] = (0, import_react4.useState)(propMinValue ?? min);
-  const [rangeMax, setRangeMax] = (0, import_react4.useState)(propMaxValue ?? max);
-  const [isHovered, setIsHovered] = (0, import_react4.useState)(false);
-  const [activeThumb, setActiveThumb] = (0, import_react4.useState)(null);
-  const trackRef = (0, import_react4.useRef)(null);
+  const [value, setValue] = (0, import_react.useState)(propValue);
+  const [rangeMin, setRangeMin] = (0, import_react.useState)(propMinValue ?? min);
+  const [rangeMax, setRangeMax] = (0, import_react.useState)(propMaxValue ?? max);
+  const [isHovered, setIsHovered] = (0, import_react.useState)(false);
+  const [activeThumb, setActiveThumb] = (0, import_react.useState)(null);
+  const trackRef = (0, import_react.useRef)(null);
   const isWeb = typeof window !== "undefined" && typeof document !== "undefined";
-  (0, import_react4.useEffect)(() => {
+  (0, import_react.useEffect)(() => {
     setValue(propValue);
   }, [propValue]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react.useEffect)(() => {
     if (propMinValue !== void 0) setRangeMin(propMinValue);
   }, [propMinValue]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react.useEffect)(() => {
     if (propMaxValue !== void 0) setRangeMax(propMaxValue);
   }, [propMaxValue]);
   const sizing = sizeConfig[size];
@@ -618,7 +355,7 @@ var Slider = ({
   const thumbBgColor = disabled ? disabledColor : activeColors.bg;
   const thumbBgHoverColor = disabled ? disabledColor : activeColors.bgHover;
   const thumbShadow = "0px 1px 2px rgba(7, 7, 8, 0.2), 0px 1px 3px 1px rgba(7, 7, 8, 0.1)";
-  const calculateValue = (0, import_react4.useCallback)(
+  const calculateValue = (0, import_react.useCallback)(
     (clientX) => {
       if (!trackRef.current) return value;
       const rect = trackRef.current.getBoundingClientRect();
@@ -631,7 +368,7 @@ var Slider = ({
     },
     [min, max, step, value]
   );
-  const handleSingleMove = (0, import_react4.useCallback)(
+  const handleSingleMove = (0, import_react.useCallback)(
     (clientX) => {
       if (disabled) return;
       const newValue = calculateValue(clientX);
@@ -640,7 +377,7 @@ var Slider = ({
     },
     [disabled, calculateValue, onChange]
   );
-  const handleRangeMove = (0, import_react4.useCallback)(
+  const handleRangeMove = (0, import_react.useCallback)(
     (clientX, thumb) => {
       if (disabled) return;
       const newValue = calculateValue(clientX);
@@ -692,7 +429,7 @@ var Slider = ({
       document.addEventListener("mouseup", onMouseUp);
     }
   };
-  const handleKeyDown = (0, import_react4.useCallback)(
+  const handleKeyDown = (0, import_react.useCallback)(
     (e, thumbType) => {
       if (disabled) return;
       const stepValue = e.shiftKey ? step * 10 : step;
@@ -779,7 +516,7 @@ var Slider = ({
       onRangeChange
     ]
   );
-  const handleResponderGrant = (0, import_react4.useCallback)(
+  const handleResponderGrant = (0, import_react.useCallback)(
     (e, thumbType) => {
       if (disabled) return;
       const locationX = e.nativeEvent?.locationX ?? e.nativeEvent?.pageX ?? 0;
@@ -801,7 +538,7 @@ var Slider = ({
     },
     [disabled, range, min, max, rangeMin, rangeMax]
   );
-  const handleResponderMove = (0, import_react4.useCallback)(
+  const handleResponderMove = (0, import_react.useCallback)(
     (e, thumbType) => {
       if (disabled || !trackRef.current) return;
       const locationX = e.nativeEvent?.locationX ?? e.nativeEvent?.pageX ?? 0;
@@ -842,7 +579,7 @@ var Slider = ({
       onRangeChange
     ]
   );
-  const handleResponderRelease = (0, import_react4.useCallback)(() => {
+  const handleResponderRelease = (0, import_react.useCallback)(() => {
     setActiveThumb(null);
   }, []);
   const handleInputChange = (e, type) => {
@@ -934,7 +671,7 @@ var Slider = ({
     const inputIconLeft = iconInside && effectiveIconPosition === "left" ? iconInside : void 0;
     const inputIconRight = iconInside && effectiveIconPosition === "right" ? iconInside : void 0;
     const inputWidth = iconInside ? sizing.inputWidth + sizing.inputIconSize + sizing.inputIconGap : sizing.inputWidth;
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Box, { width: inputWidth, flexShrink: 0, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Box, { width: inputWidth, flexShrink: 0, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
       import_xui_input.Input,
       {
         value: String(inputValue),
@@ -960,7 +697,7 @@ var Slider = ({
     const thumbAriaLabel = range ? thumbType === "min" ? minThumbAriaLabel : maxThumbAriaLabel : ariaLabel || label || "Slider value";
     const currentThumbBg = thumbHovered && !disabled ? thumbBgHoverColor : thumbBgColor;
     const thumbBaseBg = disabled ? theme.colors.background.primary : currentThumbBg;
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
       Box,
       {
         role: "slider",
@@ -1002,7 +739,7 @@ var Slider = ({
         "aria-valuemin": range && thumbType === "max" ? rangeMin + step : min,
         "aria-valuemax": range && thumbType === "min" ? rangeMax - step : max,
         "aria-orientation": "horizontal",
-        children: disabled && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        children: disabled && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
           Box,
           {
             position: "absolute",
@@ -1019,7 +756,7 @@ var Slider = ({
       }
     );
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
     Box,
     {
       flexDirection: "column",
@@ -1029,7 +766,7 @@ var Slider = ({
       onMouseEnter: () => setIsHovered(true),
       onMouseLeave: () => setIsHovered(false),
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
           Text,
           {
             id: labelId,
@@ -1038,7 +775,7 @@ var Slider = ({
             children: label
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
           Box,
           {
             flexDirection: "row",
@@ -1047,7 +784,7 @@ var Slider = ({
             height: sizing.height,
             children: [
               (inputPosition === "left" || inputPosition === "both") && (range ? renderInput(rangeMin, "min", "left") : renderInput(value, "single", "left")),
-              iconLeft && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              iconLeft && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                 Box,
                 {
                   flexShrink: 0,
@@ -1059,7 +796,7 @@ var Slider = ({
                   children: iconLeft
                 }
               ),
-              showLabels && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              showLabels && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                 Text,
                 {
                   color: disabled ? inputColors.textDisable : inputColors.text,
@@ -1068,7 +805,7 @@ var Slider = ({
                   children: min
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                 Box,
                 {
                   flex: 1,
@@ -1076,7 +813,7 @@ var Slider = ({
                   height: sizing.height,
                   alignItems: "center",
                   justifyContent: "center",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                     Box,
                     {
                       ref: trackRef,
@@ -1094,8 +831,8 @@ var Slider = ({
                       onResponderMove: (e) => handleResponderMove(e),
                       onResponderRelease: handleResponderRelease,
                       onResponderTerminate: handleResponderRelease,
-                      children: range ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                      children: range ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                           Box,
                           {
                             position: "absolute",
@@ -1109,8 +846,8 @@ var Slider = ({
                         ),
                         renderThumb(rangeMinPercentage, "min"),
                         renderThumb(rangeMaxPercentage, "max")
-                      ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                      ] }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                           Box,
                           {
                             position: "absolute",
@@ -1128,7 +865,7 @@ var Slider = ({
                   )
                 }
               ),
-              showLabels && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              showLabels && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                 Text,
                 {
                   color: disabled ? inputColors.textDisable : inputColors.text,
@@ -1137,7 +874,7 @@ var Slider = ({
                   children: max
                 }
               ),
-              iconRight && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              iconRight && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
                 Box,
                 {
                   flexShrink: 0,