@xsolla/xui-slider 0.89.0 → 0.91.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.mjs CHANGED
@@ -206,263 +206,10 @@ var Text = ({
206
206
  return /* @__PURE__ */ jsx2(RNText, { style, testID: id, accessibilityRole, children });
207
207
  };
208
208
 
209
- // ../primitives-native/src/Spinner.tsx
210
- import { ActivityIndicator, View as View2 } from "react-native";
211
- import { jsx as jsx3 } from "react/jsx-runtime";
212
- var Spinner = ({
213
- color,
214
- size,
215
- role,
216
- "aria-label": ariaLabel,
217
- "aria-live": ariaLive,
218
- testID
219
- }) => {
220
- return /* @__PURE__ */ jsx3(
221
- View2,
222
- {
223
- accessible: true,
224
- accessibilityRole: role === "status" ? "none" : void 0,
225
- accessibilityLabel: ariaLabel,
226
- accessibilityLiveRegion: ariaLive === "polite" ? "polite" : ariaLive === "assertive" ? "assertive" : "none",
227
- testID,
228
- children: /* @__PURE__ */ jsx3(
229
- ActivityIndicator,
230
- {
231
- color,
232
- size: typeof size === "number" ? size : "small"
233
- }
234
- )
235
- }
236
- );
237
- };
238
- Spinner.displayName = "Spinner";
239
-
240
- // ../primitives-native/src/Icon.tsx
241
- import React from "react";
242
- import { View as View3 } from "react-native";
243
- import { jsx as jsx4 } from "react/jsx-runtime";
244
-
245
- // ../primitives-native/src/Divider.tsx
246
- import { View as View4 } from "react-native";
247
- import { jsx as jsx5 } from "react/jsx-runtime";
248
-
249
- // ../primitives-native/src/Input.tsx
250
- import { forwardRef } from "react";
251
- import { TextInput as RNTextInput } from "react-native";
252
- import { jsx as jsx6 } from "react/jsx-runtime";
253
- var keyboardTypeMap = {
254
- text: "default",
255
- number: "numeric",
256
- email: "email-address",
257
- tel: "phone-pad",
258
- url: "url",
259
- decimal: "decimal-pad"
260
- };
261
- var inputModeToKeyboardType = {
262
- none: "default",
263
- text: "default",
264
- decimal: "decimal-pad",
265
- numeric: "number-pad",
266
- tel: "phone-pad",
267
- search: "default",
268
- email: "email-address",
269
- url: "url"
270
- };
271
- var autoCompleteToTextContentType = {
272
- "one-time-code": "oneTimeCode",
273
- email: "emailAddress",
274
- username: "username",
275
- password: "password",
276
- "new-password": "newPassword",
277
- tel: "telephoneNumber",
278
- "postal-code": "postalCode",
279
- name: "name"
280
- };
281
- var InputPrimitive = forwardRef(
282
- ({
283
- value,
284
- placeholder,
285
- onChange,
286
- onChangeText,
287
- onFocus,
288
- onBlur,
289
- onKeyDown,
290
- disabled,
291
- secureTextEntry,
292
- style,
293
- color,
294
- fontSize,
295
- placeholderTextColor,
296
- maxLength,
297
- type,
298
- inputMode,
299
- autoComplete,
300
- id,
301
- "aria-describedby": ariaDescribedBy,
302
- "aria-label": ariaLabel,
303
- "aria-disabled": ariaDisabled,
304
- "data-testid": dataTestId
305
- }, ref) => {
306
- const handleChangeText = (text) => {
307
- onChangeText?.(text);
308
- if (onChange) {
309
- const syntheticEvent = {
310
- target: { value: text },
311
- currentTarget: { value: text },
312
- type: "change",
313
- nativeEvent: { text },
314
- preventDefault: () => {
315
- },
316
- stopPropagation: () => {
317
- },
318
- isTrusted: false
319
- };
320
- onChange(syntheticEvent);
321
- }
322
- };
323
- const keyboardType = inputMode ? inputModeToKeyboardType[inputMode] || "default" : type ? keyboardTypeMap[type] || "default" : "default";
324
- const textContentType = autoComplete ? autoCompleteToTextContentType[autoComplete] : void 0;
325
- return /* @__PURE__ */ jsx6(
326
- RNTextInput,
327
- {
328
- ref,
329
- value,
330
- placeholder,
331
- onChangeText: handleChangeText,
332
- onFocus,
333
- onBlur,
334
- onKeyPress: (e) => {
335
- if (onKeyDown) {
336
- onKeyDown({
337
- key: e.nativeEvent.key,
338
- preventDefault: () => {
339
- }
340
- });
341
- }
342
- },
343
- editable: !disabled,
344
- secureTextEntry: secureTextEntry || type === "password",
345
- keyboardType,
346
- textContentType,
347
- style: [
348
- {
349
- color,
350
- fontSize: typeof fontSize === "number" ? fontSize : void 0,
351
- flex: 1,
352
- padding: 0,
353
- textAlign: style?.textAlign || "left"
354
- },
355
- style
356
- ],
357
- placeholderTextColor,
358
- maxLength,
359
- testID: dataTestId || id,
360
- accessibilityLabel: ariaLabel,
361
- accessibilityHint: ariaDescribedBy,
362
- accessibilityState: {
363
- disabled: disabled || ariaDisabled
364
- },
365
- accessible: true
366
- }
367
- );
368
- }
369
- );
370
- InputPrimitive.displayName = "InputPrimitive";
371
-
372
- // ../primitives-native/src/TextArea.tsx
373
- import { forwardRef as forwardRef2 } from "react";
374
- import { TextInput as RNTextInput2 } from "react-native";
375
- import { jsx as jsx7 } from "react/jsx-runtime";
376
- var TextAreaPrimitive = forwardRef2(
377
- ({
378
- value,
379
- placeholder,
380
- onChange,
381
- onChangeText,
382
- onFocus,
383
- onBlur,
384
- onKeyDown,
385
- disabled,
386
- style,
387
- color,
388
- fontSize,
389
- placeholderTextColor,
390
- maxLength,
391
- rows,
392
- id,
393
- "aria-describedby": ariaDescribedBy,
394
- "aria-label": ariaLabel,
395
- "aria-disabled": ariaDisabled,
396
- "data-testid": dataTestId
397
- }, ref) => {
398
- const handleChangeText = (text) => {
399
- onChangeText?.(text);
400
- if (onChange) {
401
- const syntheticEvent = {
402
- target: { value: text },
403
- currentTarget: { value: text },
404
- type: "change",
405
- nativeEvent: { text },
406
- preventDefault: () => {
407
- },
408
- stopPropagation: () => {
409
- },
410
- isTrusted: false
411
- };
412
- onChange(syntheticEvent);
413
- }
414
- };
415
- return /* @__PURE__ */ jsx7(
416
- RNTextInput2,
417
- {
418
- ref,
419
- value,
420
- placeholder,
421
- onChangeText: handleChangeText,
422
- onFocus,
423
- onBlur,
424
- onKeyPress: (e) => {
425
- if (onKeyDown) {
426
- onKeyDown({
427
- key: e.nativeEvent.key,
428
- preventDefault: () => {
429
- }
430
- });
431
- }
432
- },
433
- editable: !disabled,
434
- multiline: true,
435
- numberOfLines: rows || 4,
436
- style: [
437
- {
438
- color,
439
- fontSize: typeof fontSize === "number" ? fontSize : void 0,
440
- flex: 1,
441
- padding: 0,
442
- textAlignVertical: "top",
443
- textAlign: style?.textAlign || "left"
444
- },
445
- style
446
- ],
447
- placeholderTextColor,
448
- maxLength,
449
- testID: dataTestId || id,
450
- accessibilityLabel: ariaLabel,
451
- accessibilityHint: ariaDescribedBy,
452
- accessibilityState: {
453
- disabled: disabled || ariaDisabled
454
- },
455
- accessible: true
456
- }
457
- );
458
- }
459
- );
460
- TextAreaPrimitive.displayName = "TextAreaPrimitive";
461
-
462
209
  // src/Slider.tsx
463
210
  import { useDesignSystem, useId } from "@xsolla/xui-core";
464
211
  import { Input } from "@xsolla/xui-input";
465
- import { Fragment, jsx as jsx8, jsxs } from "react/jsx-runtime";
212
+ import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
466
213
  var sizeConfig = {
467
214
  xl: {
468
215
  height: 56,
@@ -902,7 +649,7 @@ var Slider = ({
902
649
  const inputIconLeft = iconInside && effectiveIconPosition === "left" ? iconInside : void 0;
903
650
  const inputIconRight = iconInside && effectiveIconPosition === "right" ? iconInside : void 0;
904
651
  const inputWidth = iconInside ? sizing.inputWidth + sizing.inputIconSize + sizing.inputIconGap : sizing.inputWidth;
905
- return /* @__PURE__ */ jsx8(Box, { width: inputWidth, flexShrink: 0, children: /* @__PURE__ */ jsx8(
652
+ return /* @__PURE__ */ jsx3(Box, { width: inputWidth, flexShrink: 0, children: /* @__PURE__ */ jsx3(
906
653
  Input,
907
654
  {
908
655
  value: String(inputValue),
@@ -928,7 +675,7 @@ var Slider = ({
928
675
  const thumbAriaLabel = range ? thumbType === "min" ? minThumbAriaLabel : maxThumbAriaLabel : ariaLabel || label || "Slider value";
929
676
  const currentThumbBg = thumbHovered && !disabled ? thumbBgHoverColor : thumbBgColor;
930
677
  const thumbBaseBg = disabled ? theme.colors.background.primary : currentThumbBg;
931
- return /* @__PURE__ */ jsx8(
678
+ return /* @__PURE__ */ jsx3(
932
679
  Box,
933
680
  {
934
681
  role: "slider",
@@ -970,7 +717,7 @@ var Slider = ({
970
717
  "aria-valuemin": range && thumbType === "max" ? rangeMin + step : min,
971
718
  "aria-valuemax": range && thumbType === "min" ? rangeMax - step : max,
972
719
  "aria-orientation": "horizontal",
973
- children: disabled && /* @__PURE__ */ jsx8(
720
+ children: disabled && /* @__PURE__ */ jsx3(
974
721
  Box,
975
722
  {
976
723
  position: "absolute",
@@ -997,7 +744,7 @@ var Slider = ({
997
744
  onMouseEnter: () => setIsHovered(true),
998
745
  onMouseLeave: () => setIsHovered(false),
999
746
  children: [
1000
- label && /* @__PURE__ */ jsx8(
747
+ label && /* @__PURE__ */ jsx3(
1001
748
  Text,
1002
749
  {
1003
750
  id: labelId,
@@ -1015,7 +762,7 @@ var Slider = ({
1015
762
  height: sizing.height,
1016
763
  children: [
1017
764
  (inputPosition === "left" || inputPosition === "both") && (range ? renderInput(rangeMin, "min", "left") : renderInput(value, "single", "left")),
1018
- iconLeft && /* @__PURE__ */ jsx8(
765
+ iconLeft && /* @__PURE__ */ jsx3(
1019
766
  Box,
1020
767
  {
1021
768
  flexShrink: 0,
@@ -1027,7 +774,7 @@ var Slider = ({
1027
774
  children: iconLeft
1028
775
  }
1029
776
  ),
1030
- showLabels && /* @__PURE__ */ jsx8(
777
+ showLabels && /* @__PURE__ */ jsx3(
1031
778
  Text,
1032
779
  {
1033
780
  color: disabled ? inputColors.textDisable : inputColors.text,
@@ -1036,7 +783,7 @@ var Slider = ({
1036
783
  children: min
1037
784
  }
1038
785
  ),
1039
- /* @__PURE__ */ jsx8(
786
+ /* @__PURE__ */ jsx3(
1040
787
  Box,
1041
788
  {
1042
789
  flex: 1,
@@ -1044,7 +791,7 @@ var Slider = ({
1044
791
  height: sizing.height,
1045
792
  alignItems: "center",
1046
793
  justifyContent: "center",
1047
- children: /* @__PURE__ */ jsx8(
794
+ children: /* @__PURE__ */ jsx3(
1048
795
  Box,
1049
796
  {
1050
797
  ref: trackRef,
@@ -1063,7 +810,7 @@ var Slider = ({
1063
810
  onResponderRelease: handleResponderRelease,
1064
811
  onResponderTerminate: handleResponderRelease,
1065
812
  children: range ? /* @__PURE__ */ jsxs(Fragment, { children: [
1066
- /* @__PURE__ */ jsx8(
813
+ /* @__PURE__ */ jsx3(
1067
814
  Box,
1068
815
  {
1069
816
  position: "absolute",
@@ -1078,7 +825,7 @@ var Slider = ({
1078
825
  renderThumb(rangeMinPercentage, "min"),
1079
826
  renderThumb(rangeMaxPercentage, "max")
1080
827
  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1081
- /* @__PURE__ */ jsx8(
828
+ /* @__PURE__ */ jsx3(
1082
829
  Box,
1083
830
  {
1084
831
  position: "absolute",
@@ -1096,7 +843,7 @@ var Slider = ({
1096
843
  )
1097
844
  }
1098
845
  ),
1099
- showLabels && /* @__PURE__ */ jsx8(
846
+ showLabels && /* @__PURE__ */ jsx3(
1100
847
  Text,
1101
848
  {
1102
849
  color: disabled ? inputColors.textDisable : inputColors.text,
@@ -1105,7 +852,7 @@ var Slider = ({
1105
852
  children: max
1106
853
  }
1107
854
  ),
1108
- iconRight && /* @__PURE__ */ jsx8(
855
+ iconRight && /* @__PURE__ */ jsx3(
1109
856
  Box,
1110
857
  {
1111
858
  flexShrink: 0,