@xsolla/xui-multi-select 0.68.0 → 0.69.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.
Files changed (13) hide show
  1. package/native/index.d.mts +81 -7
  2. package/native/index.d.ts +81 -7
  3. package/native/index.js +2137 -85
  4. package/native/index.js.map +1 -1
  5. package/native/index.mjs +2137 -85
  6. package/native/index.mjs.map +1 -1
  7. package/package.json +5 -5
  8. package/web/index.d.mts +81 -7
  9. package/web/index.d.ts +81 -7
  10. package/web/index.js +2157 -105
  11. package/web/index.js.map +1 -1
  12. package/web/index.mjs +2137 -85
  13. package/web/index.mjs.map +1 -1
package/native/index.d.mts CHANGED
@@ -1,14 +1,88 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
 
3
+ type MultiSelectValue = (string | number)[];
4
+ type MultiSelectVariant = "tag" | "text";
5
+ type MultiSelectSize = "xs" | "s" | "m" | "l" | "xl";
6
+ type MultiSelectState = "default" | "hover" | "focus" | "disable" | "error";
7
+ interface MultiSelectOption {
8
+ label: ReactNode;
9
+ value: string | number;
10
+ disabled?: boolean;
11
+ }
3
12
  interface MultiSelectProps {
4
- options: string[];
5
- value?: string[];
6
- onChange?: (value: string[]) => void;
13
+ /**
14
+ * Property to define options for the multi-select.
15
+ */
16
+ options: MultiSelectOption[];
17
+ /**
18
+ * Property for specifying the placeholder of the control.
19
+ * @default "Select"
20
+ */
7
21
  placeholder?: string;
8
- size?: "xs" | "s" | "m" | "l" | "xl";
22
+ /**
23
+ * Property for specifying the value of the control.
24
+ */
25
+ value?: MultiSelectValue;
26
+ /**
27
+ * Function that will be called when the value changes.
28
+ */
29
+ onChange?: (values: MultiSelectValue) => void;
30
+ /**
31
+ * Property for displaying an error message and highlighting the control as invalid.
32
+ */
33
+ errorMessage?: string;
34
+ /**
35
+ * Property for changing the size of the control.
36
+ * @default "m"
37
+ */
38
+ size?: MultiSelectSize;
39
+ /**
40
+ * Property for changing the state of the control.
41
+ */
42
+ state?: MultiSelectState;
43
+ /**
44
+ * Label text displayed above the control.
45
+ */
9
46
  label?: string;
47
+ /**
48
+ * Icon displayed on the left side of the control.
49
+ */
50
+ iconLeft?: ReactNode;
51
+ /**
52
+ * Icon displayed on the right side of the control (overrides default caret).
53
+ */
54
+ iconRight?: ReactNode;
55
+ /**
56
+ * Property to disable the control.
57
+ */
10
58
  disabled?: boolean;
59
+ /**
60
+ * Display type of selected options (as Tag component or as plain text with comma-separated list).
61
+ * @default "tag"
62
+ */
63
+ variant?: MultiSelectVariant;
64
+ /**
65
+ * Makes the height fixed (if false) or dependent on the content inside (if true).
66
+ * @default true
67
+ */
68
+ flexible?: boolean;
69
+ /**
70
+ * Switch on displaying a remove button in each tag.
71
+ * @default true
72
+ */
73
+ removeTagsButtons?: boolean;
74
+ /**
75
+ * Add clear all button.
76
+ * @default false
77
+ */
78
+ extraClear?: boolean;
79
+ /**
80
+ * Maximum height of the dropdown menu.
81
+ * @default 300
82
+ */
83
+ maxHeight?: number;
11
84
  }
12
- declare const MultiSelect: React.FC<MultiSelectProps>;
13
85
 
14
- export { MultiSelect, type MultiSelectProps };
86
+ declare const MultiSelect: React.ForwardRefExoticComponent<MultiSelectProps & React.RefAttributes<HTMLDivElement>>;
87
+
88
+ export { MultiSelect, type MultiSelectOption, type MultiSelectProps, type MultiSelectSize, type MultiSelectState, type MultiSelectValue, type MultiSelectVariant };
package/native/index.d.ts CHANGED
@@ -1,14 +1,88 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
 
3
+ type MultiSelectValue = (string | number)[];
4
+ type MultiSelectVariant = "tag" | "text";
5
+ type MultiSelectSize = "xs" | "s" | "m" | "l" | "xl";
6
+ type MultiSelectState = "default" | "hover" | "focus" | "disable" | "error";
7
+ interface MultiSelectOption {
8
+ label: ReactNode;
9
+ value: string | number;
10
+ disabled?: boolean;
11
+ }
3
12
  interface MultiSelectProps {
4
- options: string[];
5
- value?: string[];
6
- onChange?: (value: string[]) => void;
13
+ /**
14
+ * Property to define options for the multi-select.
15
+ */
16
+ options: MultiSelectOption[];
17
+ /**
18
+ * Property for specifying the placeholder of the control.
19
+ * @default "Select"
20
+ */
7
21
  placeholder?: string;
8
- size?: "xs" | "s" | "m" | "l" | "xl";
22
+ /**
23
+ * Property for specifying the value of the control.
24
+ */
25
+ value?: MultiSelectValue;
26
+ /**
27
+ * Function that will be called when the value changes.
28
+ */
29
+ onChange?: (values: MultiSelectValue) => void;
30
+ /**
31
+ * Property for displaying an error message and highlighting the control as invalid.
32
+ */
33
+ errorMessage?: string;
34
+ /**
35
+ * Property for changing the size of the control.
36
+ * @default "m"
37
+ */
38
+ size?: MultiSelectSize;
39
+ /**
40
+ * Property for changing the state of the control.
41
+ */
42
+ state?: MultiSelectState;
43
+ /**
44
+ * Label text displayed above the control.
45
+ */
9
46
  label?: string;
47
+ /**
48
+ * Icon displayed on the left side of the control.
49
+ */
50
+ iconLeft?: ReactNode;
51
+ /**
52
+ * Icon displayed on the right side of the control (overrides default caret).
53
+ */
54
+ iconRight?: ReactNode;
55
+ /**
56
+ * Property to disable the control.
57
+ */
10
58
  disabled?: boolean;
59
+ /**
60
+ * Display type of selected options (as Tag component or as plain text with comma-separated list).
61
+ * @default "tag"
62
+ */
63
+ variant?: MultiSelectVariant;
64
+ /**
65
+ * Makes the height fixed (if false) or dependent on the content inside (if true).
66
+ * @default true
67
+ */
68
+ flexible?: boolean;
69
+ /**
70
+ * Switch on displaying a remove button in each tag.
71
+ * @default true
72
+ */
73
+ removeTagsButtons?: boolean;
74
+ /**
75
+ * Add clear all button.
76
+ * @default false
77
+ */
78
+ extraClear?: boolean;
79
+ /**
80
+ * Maximum height of the dropdown menu.
81
+ * @default 300
82
+ */
83
+ maxHeight?: number;
11
84
  }
12
- declare const MultiSelect: React.FC<MultiSelectProps>;
13
85
 
14
- export { MultiSelect, type MultiSelectProps };
86
+ declare const MultiSelect: React.ForwardRefExoticComponent<MultiSelectProps & React.RefAttributes<HTMLDivElement>>;
87
+
88
+ export { MultiSelect, type MultiSelectOption, type MultiSelectProps, type MultiSelectSize, type MultiSelectState, type MultiSelectValue, type MultiSelectVariant };