@xsolla/xui-color-picker 0.74.0 → 0.76.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.
@@ -0,0 +1,180 @@
1
+ /**
2
+ * Flowtype definitions for index
3
+ * Generated by Flowgen from a Typescript Definition
4
+ * Flowgen v1.21.0
5
+ * @flow
6
+ */
7
+
8
+ import React, { Element, Node } from "react";
9
+ declare type InputColorFormat = "hex" | "rgb" | "hsl" | "hsb";
10
+ declare type ColorFormat =
11
+ | "hex"
12
+ | "hexa"
13
+ | "hsl"
14
+ | "hsla"
15
+ | "rgb"
16
+ | "rgba"
17
+ | "hsb"
18
+ | "hsba";
19
+ declare type ColorPickerChangeEvent = {
20
+ /**
21
+ * The value of the color in the initial format (defined by `colorFormat`).
22
+ */
23
+ valueInInitialFormat: string,
24
+
25
+ /**
26
+ * The currently selected color format.
27
+ */
28
+ currentColorFormat: InputColorFormat,
29
+
30
+ /**
31
+ * The value of the color in the currently selected format.
32
+ */
33
+ valueInCurrentFormat: string,
34
+ ...
35
+ };
36
+ declare type ColorPickerProps = {
37
+ /**
38
+ * The default format for the color value.
39
+ * Note: Internally, color calculations are always performed in the HSB color space.
40
+ */
41
+ colorFormat?: InputColorFormat,
42
+
43
+ /**
44
+ * Specifies the list of color formats that the user can select from.
45
+ * By default, all supported formats (`hex`, `rgb`, `hsl`, `hsb`) will be available.
46
+ * Note: The `colorFormat` prop determines the default format.
47
+ */
48
+ selectableFormats?: Array<InputColorFormat>,
49
+
50
+ /**
51
+ * Whether the alpha channel (opacity) is enabled.
52
+ */
53
+ alpha?: boolean,
54
+
55
+ /**
56
+ * The current value of the color (usually) in the format specified by `colorFormat`.
57
+ */
58
+ value?: string,
59
+
60
+ /**
61
+ * Event handler when the value of a ColorPicker changes.
62
+ */
63
+ onChange?: (value: ColorPickerChangeEvent) => void,
64
+
65
+ /**
66
+ * Property for passing a new icon to replace the default success copied icon.
67
+ */
68
+ copiedIcon?: Element,
69
+
70
+ /**
71
+ * Enables or disables the eyedropper tool within the ColorPicker.
72
+ */
73
+ eyedropper?: boolean,
74
+
75
+ /**
76
+ * Custom content to be displayed at the bottom of the ColorPicker.
77
+ */
78
+ bottomContent?: Node,
79
+
80
+ /**
81
+ * Test ID for testing frameworks
82
+ */
83
+ testID?: string,
84
+ ...
85
+ };
86
+ declare interface CustomColorAreaProps {
87
+ colorSpace?: "hsb" | "hsl" | "rgb";
88
+ xChannel?: "saturation" | "red";
89
+ yChannel?: "brightness" | "lightness" | "green";
90
+ xChannelStep?: number;
91
+ yChannelStep?: number;
92
+ value?: string;
93
+ defaultValue?: string;
94
+ onChange?: (color: string) => void;
95
+ onChangeEnd?: (color: string) => void;
96
+ className?: string;
97
+ }
98
+ declare var ColorPicker: React.ForwardRefExoticComponent<{
99
+ ...ColorPickerProps,
100
+ ...React.RefAttributes<any>,
101
+ }>;
102
+ declare type ColorChannel =
103
+ | "hue"
104
+ | "saturation"
105
+ | "brightness"
106
+ | "lightness"
107
+ | "red"
108
+ | "green"
109
+ | "blue"
110
+ | "alpha";
111
+ declare interface ColorValue {
112
+ getChannelValue(channel: ColorChannel): number;
113
+ setChannelValue(channel: ColorChannel, value: number): ColorValue;
114
+ getChannelRange(channel: ColorChannel): {
115
+ minValue: number,
116
+ maxValue: number,
117
+ step: number,
118
+ pageSize: number,
119
+ ...
120
+ };
121
+ getColorChannels(): ColorChannel[];
122
+ toFormat(format: string): string;
123
+ toString(format?: string): string;
124
+ toHsb(): {
125
+ h: number,
126
+ s: number,
127
+ b: number,
128
+ a: number,
129
+ ...
130
+ };
131
+ toRgb(): {
132
+ r: number,
133
+ g: number,
134
+ b: number,
135
+ a: number,
136
+ ...
137
+ };
138
+ toHsl(): {
139
+ h: number,
140
+ s: number,
141
+ l: number,
142
+ a: number,
143
+ ...
144
+ };
145
+ }
146
+ declare function parseColor(color: string): ColorValue;
147
+ declare function createColorFromHsb(
148
+ h: number,
149
+ s: number,
150
+ b: number,
151
+ a?: number
152
+ ): ColorValue;
153
+ declare var ColorPickerArea: React.ForwardRefExoticComponent<{
154
+ ...CustomColorAreaProps,
155
+ ...React.RefAttributes<any>,
156
+ }>;
157
+ declare type ColorPickerSliderProps = {
158
+ channel: "hue" | "alpha",
159
+ value: string,
160
+ onChange?: (color: string) => void,
161
+ onChangeEnd?: (color: string) => void,
162
+ ...
163
+ };
164
+ declare var ColorPickerSlider: React.FC<ColorPickerSliderProps>;
165
+ export type {
166
+ ColorChannel,
167
+ ColorFormat,
168
+ ColorPickerChangeEvent,
169
+ ColorPickerProps,
170
+ ColorValue,
171
+ CustomColorAreaProps,
172
+ InputColorFormat,
173
+ };
174
+ declare export {
175
+ ColorPicker,
176
+ ColorPickerArea,
177
+ ColorPickerSlider,
178
+ createColorFromHsb,
179
+ parseColor,
180
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xsolla/xui-color-picker",
3
- "version": "0.74.0",
3
+ "version": "0.76.0",
4
4
  "main": "./web/index.js",
5
5
  "module": "./web/index.mjs",
6
6
  "types": "./web/index.d.ts",
@@ -10,11 +10,11 @@
10
10
  "build:native": "PLATFORM=native tsup"
11
11
  },
12
12
  "dependencies": {
13
- "@xsolla/xui-button": "0.74.0",
14
- "@xsolla/xui-core": "0.74.0",
15
- "@xsolla/xui-input": "0.74.0",
16
- "@xsolla/xui-primitives-core": "0.74.0",
17
- "@xsolla/xui-select": "0.74.0"
13
+ "@xsolla/xui-button": "0.76.0",
14
+ "@xsolla/xui-core": "0.76.0",
15
+ "@xsolla/xui-input": "0.76.0",
16
+ "@xsolla/xui-primitives-core": "0.76.0",
17
+ "@xsolla/xui-select": "0.76.0"
18
18
  },
19
19
  "peerDependencies": {
20
20
  "react": ">=16.8.0"
@@ -0,0 +1,180 @@
1
+ /**
2
+ * Flowtype definitions for index
3
+ * Generated by Flowgen from a Typescript Definition
4
+ * Flowgen v1.21.0
5
+ * @flow
6
+ */
7
+
8
+ import React, { Element, Node } from "react";
9
+ declare type InputColorFormat = "hex" | "rgb" | "hsl" | "hsb";
10
+ declare type ColorFormat =
11
+ | "hex"
12
+ | "hexa"
13
+ | "hsl"
14
+ | "hsla"
15
+ | "rgb"
16
+ | "rgba"
17
+ | "hsb"
18
+ | "hsba";
19
+ declare type ColorPickerChangeEvent = {
20
+ /**
21
+ * The value of the color in the initial format (defined by `colorFormat`).
22
+ */
23
+ valueInInitialFormat: string,
24
+
25
+ /**
26
+ * The currently selected color format.
27
+ */
28
+ currentColorFormat: InputColorFormat,
29
+
30
+ /**
31
+ * The value of the color in the currently selected format.
32
+ */
33
+ valueInCurrentFormat: string,
34
+ ...
35
+ };
36
+ declare type ColorPickerProps = {
37
+ /**
38
+ * The default format for the color value.
39
+ * Note: Internally, color calculations are always performed in the HSB color space.
40
+ */
41
+ colorFormat?: InputColorFormat,
42
+
43
+ /**
44
+ * Specifies the list of color formats that the user can select from.
45
+ * By default, all supported formats (`hex`, `rgb`, `hsl`, `hsb`) will be available.
46
+ * Note: The `colorFormat` prop determines the default format.
47
+ */
48
+ selectableFormats?: Array<InputColorFormat>,
49
+
50
+ /**
51
+ * Whether the alpha channel (opacity) is enabled.
52
+ */
53
+ alpha?: boolean,
54
+
55
+ /**
56
+ * The current value of the color (usually) in the format specified by `colorFormat`.
57
+ */
58
+ value?: string,
59
+
60
+ /**
61
+ * Event handler when the value of a ColorPicker changes.
62
+ */
63
+ onChange?: (value: ColorPickerChangeEvent) => void,
64
+
65
+ /**
66
+ * Property for passing a new icon to replace the default success copied icon.
67
+ */
68
+ copiedIcon?: Element,
69
+
70
+ /**
71
+ * Enables or disables the eyedropper tool within the ColorPicker.
72
+ */
73
+ eyedropper?: boolean,
74
+
75
+ /**
76
+ * Custom content to be displayed at the bottom of the ColorPicker.
77
+ */
78
+ bottomContent?: Node,
79
+
80
+ /**
81
+ * Test ID for testing frameworks
82
+ */
83
+ testID?: string,
84
+ ...
85
+ };
86
+ declare interface CustomColorAreaProps {
87
+ colorSpace?: "hsb" | "hsl" | "rgb";
88
+ xChannel?: "saturation" | "red";
89
+ yChannel?: "brightness" | "lightness" | "green";
90
+ xChannelStep?: number;
91
+ yChannelStep?: number;
92
+ value?: string;
93
+ defaultValue?: string;
94
+ onChange?: (color: string) => void;
95
+ onChangeEnd?: (color: string) => void;
96
+ className?: string;
97
+ }
98
+ declare var ColorPicker: React.ForwardRefExoticComponent<{
99
+ ...ColorPickerProps,
100
+ ...React.RefAttributes<any>,
101
+ }>;
102
+ declare type ColorChannel =
103
+ | "hue"
104
+ | "saturation"
105
+ | "brightness"
106
+ | "lightness"
107
+ | "red"
108
+ | "green"
109
+ | "blue"
110
+ | "alpha";
111
+ declare interface ColorValue {
112
+ getChannelValue(channel: ColorChannel): number;
113
+ setChannelValue(channel: ColorChannel, value: number): ColorValue;
114
+ getChannelRange(channel: ColorChannel): {
115
+ minValue: number,
116
+ maxValue: number,
117
+ step: number,
118
+ pageSize: number,
119
+ ...
120
+ };
121
+ getColorChannels(): ColorChannel[];
122
+ toFormat(format: string): string;
123
+ toString(format?: string): string;
124
+ toHsb(): {
125
+ h: number,
126
+ s: number,
127
+ b: number,
128
+ a: number,
129
+ ...
130
+ };
131
+ toRgb(): {
132
+ r: number,
133
+ g: number,
134
+ b: number,
135
+ a: number,
136
+ ...
137
+ };
138
+ toHsl(): {
139
+ h: number,
140
+ s: number,
141
+ l: number,
142
+ a: number,
143
+ ...
144
+ };
145
+ }
146
+ declare function parseColor(color: string): ColorValue;
147
+ declare function createColorFromHsb(
148
+ h: number,
149
+ s: number,
150
+ b: number,
151
+ a?: number
152
+ ): ColorValue;
153
+ declare var ColorPickerArea: React.ForwardRefExoticComponent<{
154
+ ...CustomColorAreaProps,
155
+ ...React.RefAttributes<any>,
156
+ }>;
157
+ declare type ColorPickerSliderProps = {
158
+ channel: "hue" | "alpha",
159
+ value: string,
160
+ onChange?: (color: string) => void,
161
+ onChangeEnd?: (color: string) => void,
162
+ ...
163
+ };
164
+ declare var ColorPickerSlider: React.FC<ColorPickerSliderProps>;
165
+ export type {
166
+ ColorChannel,
167
+ ColorFormat,
168
+ ColorPickerChangeEvent,
169
+ ColorPickerProps,
170
+ ColorValue,
171
+ CustomColorAreaProps,
172
+ InputColorFormat,
173
+ };
174
+ declare export {
175
+ ColorPicker,
176
+ ColorPickerArea,
177
+ ColorPickerSlider,
178
+ createColorFromHsb,
179
+ parseColor,
180
+ };