@yamada-ui/color-picker 1.0.4 → 1.0.5
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/dist/{chunk-24BBRCTU.mjs → chunk-3KJJKEBS.mjs} +4 -4
- package/dist/{chunk-TBD6YA7X.mjs → chunk-5FH26WWX.mjs} +3 -3
- package/dist/{chunk-F7CBAED2.mjs → chunk-5FHBZD53.mjs} +1 -1
- package/dist/{chunk-3JCJHD24.mjs → chunk-AD6NIXIQ.mjs} +1 -1
- package/dist/{chunk-XKNPDIRL.mjs → chunk-AW3DGG4U.mjs} +4 -2
- package/dist/{chunk-LG5AH76C.mjs → chunk-AZHLF5KM.mjs} +3 -3
- package/dist/{chunk-KCQQ4JHN.mjs → chunk-CE2QN4CE.mjs} +1 -1
- package/dist/{chunk-X3D4OUWF.mjs → chunk-J62WY74P.mjs} +1 -1
- package/dist/{chunk-25HMRK5Y.mjs → chunk-ZFIEXPRX.mjs} +1 -1
- package/dist/color-picker.js +5 -3
- package/dist/color-picker.mjs +9 -9
- package/dist/color-selector-body.mjs +4 -4
- package/dist/color-selector-channels.mjs +2 -2
- package/dist/color-selector-eye-dropper.mjs +2 -2
- package/dist/color-selector-sliders.mjs +2 -2
- package/dist/color-selector-swatches.mjs +2 -2
- package/dist/color-selector.js +1 -1
- package/dist/color-selector.mjs +7 -7
- package/dist/index.js +5 -3
- package/dist/index.mjs +9 -9
- package/dist/use-color-picker.js +4 -2
- package/dist/use-color-picker.mjs +1 -1
- package/dist/use-color-selector.d.mts +1 -1
- package/dist/use-color-selector.d.ts +1 -1
- package/dist/use-color-selector.js +1 -1
- package/dist/use-color-selector.mjs +1 -1
- package/package.json +14 -14
|
@@ -3,17 +3,17 @@ import {
|
|
|
3
3
|
} from "./chunk-3KASGDAY.mjs";
|
|
4
4
|
import {
|
|
5
5
|
ColorSelectorBody
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-AZHLF5KM.mjs";
|
|
7
7
|
import {
|
|
8
8
|
ColorSelectorChannels
|
|
9
|
-
} from "./chunk-
|
|
9
|
+
} from "./chunk-5FHBZD53.mjs";
|
|
10
10
|
import {
|
|
11
11
|
ColorSelectorSwatches
|
|
12
|
-
} from "./chunk-
|
|
12
|
+
} from "./chunk-ZFIEXPRX.mjs";
|
|
13
13
|
import {
|
|
14
14
|
ColorSelectorProvider,
|
|
15
15
|
useColorSelector
|
|
16
|
-
} from "./chunk-
|
|
16
|
+
} from "./chunk-CE2QN4CE.mjs";
|
|
17
17
|
|
|
18
18
|
// src/color-selector.tsx
|
|
19
19
|
import {
|
|
@@ -2,13 +2,13 @@ import {
|
|
|
2
2
|
ColorPickerProvider,
|
|
3
3
|
useColorPicker,
|
|
4
4
|
useColorPickerContext
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-AW3DGG4U.mjs";
|
|
6
6
|
import {
|
|
7
7
|
ColorSelector
|
|
8
|
-
} from "./chunk-
|
|
8
|
+
} from "./chunk-3KJJKEBS.mjs";
|
|
9
9
|
import {
|
|
10
10
|
EyeDropperIcon
|
|
11
|
-
} from "./chunk-
|
|
11
|
+
} from "./chunk-J62WY74P.mjs";
|
|
12
12
|
import {
|
|
13
13
|
ColorSwatch
|
|
14
14
|
} from "./chunk-3N443XSV.mjs";
|
|
@@ -162,8 +162,10 @@ var useColorPicker = ({
|
|
|
162
162
|
const onColorSelectorChange = useCallback(
|
|
163
163
|
(value2) => {
|
|
164
164
|
setValue(value2);
|
|
165
|
-
|
|
166
|
-
|
|
165
|
+
setTimeout(() => {
|
|
166
|
+
if (!isInputFocused.current)
|
|
167
|
+
setInputValue(formatInput(value2));
|
|
168
|
+
});
|
|
167
169
|
},
|
|
168
170
|
[setValue, formatInput]
|
|
169
171
|
);
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColorSelectorEyeDropper
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-J62WY74P.mjs";
|
|
4
4
|
import {
|
|
5
5
|
ColorSelectorSliders
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-AD6NIXIQ.mjs";
|
|
7
7
|
import {
|
|
8
8
|
ColorSwatch
|
|
9
9
|
} from "./chunk-3N443XSV.mjs";
|
|
10
10
|
import {
|
|
11
11
|
useColorSelectorContext
|
|
12
|
-
} from "./chunk-
|
|
12
|
+
} from "./chunk-CE2QN4CE.mjs";
|
|
13
13
|
|
|
14
14
|
// src/color-selector-body.tsx
|
|
15
15
|
import { forwardRef, ui } from "@yamada-ui/core";
|
|
@@ -77,7 +77,7 @@ var useColorSelector = ({
|
|
|
77
77
|
const { supported: eyeDropperSupported, onOpen } = useEyeDropper();
|
|
78
78
|
const [value, setValue] = useControllableState({
|
|
79
79
|
value: valueProp,
|
|
80
|
-
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#
|
|
80
|
+
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#ffffff",
|
|
81
81
|
onChange: onChangeProp
|
|
82
82
|
});
|
|
83
83
|
const timeoutId = useRef(void 0);
|
package/dist/color-picker.js
CHANGED
|
@@ -103,7 +103,7 @@ var useColorSelector = ({
|
|
|
103
103
|
const { supported: eyeDropperSupported, onOpen } = (0, import_use_eye_dropper.useEyeDropper)();
|
|
104
104
|
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
|
|
105
105
|
value: valueProp,
|
|
106
|
-
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#
|
|
106
|
+
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#ffffff",
|
|
107
107
|
onChange: onChangeProp
|
|
108
108
|
});
|
|
109
109
|
const timeoutId = (0, import_react.useRef)(void 0);
|
|
@@ -1898,8 +1898,10 @@ var useColorPicker = ({
|
|
|
1898
1898
|
const onColorSelectorChange = (0, import_react5.useCallback)(
|
|
1899
1899
|
(value2) => {
|
|
1900
1900
|
setValue(value2);
|
|
1901
|
-
|
|
1902
|
-
|
|
1901
|
+
setTimeout(() => {
|
|
1902
|
+
if (!isInputFocused.current)
|
|
1903
|
+
setInputValue(formatInput(value2));
|
|
1904
|
+
});
|
|
1903
1905
|
},
|
|
1904
1906
|
[setValue, formatInput]
|
|
1905
1907
|
);
|
package/dist/color-picker.mjs
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColorPicker
|
|
3
|
-
} from "./chunk-
|
|
4
|
-
import "./chunk-
|
|
5
|
-
import "./chunk-
|
|
3
|
+
} from "./chunk-5FH26WWX.mjs";
|
|
4
|
+
import "./chunk-AW3DGG4U.mjs";
|
|
5
|
+
import "./chunk-3KJJKEBS.mjs";
|
|
6
6
|
import "./chunk-3KASGDAY.mjs";
|
|
7
7
|
import "./chunk-MAHWFXUG.mjs";
|
|
8
|
-
import "./chunk-
|
|
9
|
-
import "./chunk-
|
|
10
|
-
import "./chunk-
|
|
11
|
-
import "./chunk-
|
|
8
|
+
import "./chunk-AZHLF5KM.mjs";
|
|
9
|
+
import "./chunk-5FHBZD53.mjs";
|
|
10
|
+
import "./chunk-J62WY74P.mjs";
|
|
11
|
+
import "./chunk-AD6NIXIQ.mjs";
|
|
12
12
|
import "./chunk-LDCDIBTZ.mjs";
|
|
13
13
|
import "./chunk-TOGKHI2V.mjs";
|
|
14
14
|
import "./chunk-XAL3WIW7.mjs";
|
|
15
|
-
import "./chunk-
|
|
15
|
+
import "./chunk-ZFIEXPRX.mjs";
|
|
16
16
|
import "./chunk-3N443XSV.mjs";
|
|
17
|
-
import "./chunk-
|
|
17
|
+
import "./chunk-CE2QN4CE.mjs";
|
|
18
18
|
export {
|
|
19
19
|
ColorPicker
|
|
20
20
|
};
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColorSelectorBody
|
|
3
|
-
} from "./chunk-
|
|
4
|
-
import "./chunk-
|
|
5
|
-
import "./chunk-
|
|
3
|
+
} from "./chunk-AZHLF5KM.mjs";
|
|
4
|
+
import "./chunk-J62WY74P.mjs";
|
|
5
|
+
import "./chunk-AD6NIXIQ.mjs";
|
|
6
6
|
import "./chunk-LDCDIBTZ.mjs";
|
|
7
7
|
import "./chunk-TOGKHI2V.mjs";
|
|
8
8
|
import "./chunk-XAL3WIW7.mjs";
|
|
9
9
|
import "./chunk-3N443XSV.mjs";
|
|
10
|
-
import "./chunk-
|
|
10
|
+
import "./chunk-CE2QN4CE.mjs";
|
|
11
11
|
export {
|
|
12
12
|
ColorSelectorBody
|
|
13
13
|
};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColorSelectorSliders
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-AD6NIXIQ.mjs";
|
|
4
4
|
import "./chunk-LDCDIBTZ.mjs";
|
|
5
5
|
import "./chunk-TOGKHI2V.mjs";
|
|
6
6
|
import "./chunk-XAL3WIW7.mjs";
|
|
7
|
-
import "./chunk-
|
|
7
|
+
import "./chunk-CE2QN4CE.mjs";
|
|
8
8
|
export {
|
|
9
9
|
ColorSelectorSliders
|
|
10
10
|
};
|
package/dist/color-selector.js
CHANGED
|
@@ -96,7 +96,7 @@ var useColorSelector = ({
|
|
|
96
96
|
const { supported: eyeDropperSupported, onOpen } = (0, import_use_eye_dropper.useEyeDropper)();
|
|
97
97
|
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
|
|
98
98
|
value: valueProp,
|
|
99
|
-
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#
|
|
99
|
+
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#ffffff",
|
|
100
100
|
onChange: onChangeProp
|
|
101
101
|
});
|
|
102
102
|
const timeoutId = (0, import_react.useRef)(void 0);
|
package/dist/color-selector.mjs
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColorSelector
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-3KJJKEBS.mjs";
|
|
4
4
|
import "./chunk-3KASGDAY.mjs";
|
|
5
5
|
import "./chunk-MAHWFXUG.mjs";
|
|
6
|
-
import "./chunk-
|
|
7
|
-
import "./chunk-
|
|
8
|
-
import "./chunk-
|
|
9
|
-
import "./chunk-
|
|
6
|
+
import "./chunk-AZHLF5KM.mjs";
|
|
7
|
+
import "./chunk-5FHBZD53.mjs";
|
|
8
|
+
import "./chunk-J62WY74P.mjs";
|
|
9
|
+
import "./chunk-AD6NIXIQ.mjs";
|
|
10
10
|
import "./chunk-LDCDIBTZ.mjs";
|
|
11
11
|
import "./chunk-TOGKHI2V.mjs";
|
|
12
12
|
import "./chunk-XAL3WIW7.mjs";
|
|
13
|
-
import "./chunk-
|
|
13
|
+
import "./chunk-ZFIEXPRX.mjs";
|
|
14
14
|
import "./chunk-3N443XSV.mjs";
|
|
15
|
-
import "./chunk-
|
|
15
|
+
import "./chunk-CE2QN4CE.mjs";
|
|
16
16
|
export {
|
|
17
17
|
ColorSelector
|
|
18
18
|
};
|
package/dist/index.js
CHANGED
|
@@ -103,7 +103,7 @@ var useColorSelector = ({
|
|
|
103
103
|
const { supported: eyeDropperSupported, onOpen } = (0, import_use_eye_dropper.useEyeDropper)();
|
|
104
104
|
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
|
|
105
105
|
value: valueProp,
|
|
106
|
-
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#
|
|
106
|
+
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#ffffff",
|
|
107
107
|
onChange: onChangeProp
|
|
108
108
|
});
|
|
109
109
|
const timeoutId = (0, import_react.useRef)(void 0);
|
|
@@ -1905,8 +1905,10 @@ var useColorPicker = ({
|
|
|
1905
1905
|
const onColorSelectorChange = (0, import_react5.useCallback)(
|
|
1906
1906
|
(value2) => {
|
|
1907
1907
|
setValue(value2);
|
|
1908
|
-
|
|
1909
|
-
|
|
1908
|
+
setTimeout(() => {
|
|
1909
|
+
if (!isInputFocused.current)
|
|
1910
|
+
setInputValue(formatInput(value2));
|
|
1911
|
+
});
|
|
1910
1912
|
},
|
|
1911
1913
|
[setValue, formatInput]
|
|
1912
1914
|
);
|
package/dist/index.mjs
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import {
|
|
2
2
|
ColorPicker
|
|
3
|
-
} from "./chunk-
|
|
4
|
-
import "./chunk-
|
|
3
|
+
} from "./chunk-5FH26WWX.mjs";
|
|
4
|
+
import "./chunk-AW3DGG4U.mjs";
|
|
5
5
|
import {
|
|
6
6
|
ColorSelector
|
|
7
|
-
} from "./chunk-
|
|
7
|
+
} from "./chunk-3KJJKEBS.mjs";
|
|
8
8
|
import {
|
|
9
9
|
SaturationSlider
|
|
10
10
|
} from "./chunk-3KASGDAY.mjs";
|
|
11
11
|
import "./chunk-MAHWFXUG.mjs";
|
|
12
|
-
import "./chunk-
|
|
13
|
-
import "./chunk-
|
|
14
|
-
import "./chunk-
|
|
15
|
-
import "./chunk-
|
|
12
|
+
import "./chunk-AZHLF5KM.mjs";
|
|
13
|
+
import "./chunk-5FHBZD53.mjs";
|
|
14
|
+
import "./chunk-J62WY74P.mjs";
|
|
15
|
+
import "./chunk-AD6NIXIQ.mjs";
|
|
16
16
|
import {
|
|
17
17
|
HueSlider
|
|
18
18
|
} from "./chunk-LDCDIBTZ.mjs";
|
|
@@ -20,11 +20,11 @@ import {
|
|
|
20
20
|
AlphaSlider
|
|
21
21
|
} from "./chunk-TOGKHI2V.mjs";
|
|
22
22
|
import "./chunk-XAL3WIW7.mjs";
|
|
23
|
-
import "./chunk-
|
|
23
|
+
import "./chunk-ZFIEXPRX.mjs";
|
|
24
24
|
import {
|
|
25
25
|
ColorSwatch
|
|
26
26
|
} from "./chunk-3N443XSV.mjs";
|
|
27
|
-
import "./chunk-
|
|
27
|
+
import "./chunk-CE2QN4CE.mjs";
|
|
28
28
|
export {
|
|
29
29
|
AlphaSlider,
|
|
30
30
|
ColorPicker,
|
package/dist/use-color-picker.js
CHANGED
|
@@ -172,8 +172,10 @@ var useColorPicker = ({
|
|
|
172
172
|
const onColorSelectorChange = (0, import_react.useCallback)(
|
|
173
173
|
(value2) => {
|
|
174
174
|
setValue(value2);
|
|
175
|
-
|
|
176
|
-
|
|
175
|
+
setTimeout(() => {
|
|
176
|
+
if (!isInputFocused.current)
|
|
177
|
+
setInputValue(formatInput(value2));
|
|
178
|
+
});
|
|
177
179
|
},
|
|
178
180
|
[setValue, formatInput]
|
|
179
181
|
);
|
|
@@ -84,7 +84,7 @@ var useColorSelector = ({
|
|
|
84
84
|
const { supported: eyeDropperSupported, onOpen } = (0, import_use_eye_dropper.useEyeDropper)();
|
|
85
85
|
const [value, setValue] = (0, import_use_controllable_state.useControllableState)({
|
|
86
86
|
value: valueProp,
|
|
87
|
-
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#
|
|
87
|
+
defaultValue: (_a = defaultValue != null ? defaultValue : fallbackValue) != null ? _a : "#ffffff",
|
|
88
88
|
onChange: onChangeProp
|
|
89
89
|
});
|
|
90
90
|
const timeoutId = (0, import_react.useRef)(void 0);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/color-picker",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.5",
|
|
4
4
|
"description": "Yamada UI color picker component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -36,20 +36,20 @@
|
|
|
36
36
|
"url": "https://github.com/hirotomoyamada/yamada-ui/issues"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@yamada-ui/button": "1.0.
|
|
40
|
-
"@yamada-ui/core": "1.3.
|
|
41
|
-
"@yamada-ui/form-control": "1.0.
|
|
42
|
-
"@yamada-ui/icon": "1.0.
|
|
43
|
-
"@yamada-ui/input": "1.0.
|
|
44
|
-
"@yamada-ui/popover": "1.0.
|
|
45
|
-
"@yamada-ui/portal": "1.0.
|
|
46
|
-
"@yamada-ui/use-controllable-state": "1.0.
|
|
47
|
-
"@yamada-ui/use-eye-dropper": "^1.0.
|
|
39
|
+
"@yamada-ui/button": "1.0.13",
|
|
40
|
+
"@yamada-ui/core": "1.3.2",
|
|
41
|
+
"@yamada-ui/form-control": "1.0.14",
|
|
42
|
+
"@yamada-ui/icon": "1.0.11",
|
|
43
|
+
"@yamada-ui/input": "1.0.14",
|
|
44
|
+
"@yamada-ui/popover": "1.0.12",
|
|
45
|
+
"@yamada-ui/portal": "1.0.5",
|
|
46
|
+
"@yamada-ui/use-controllable-state": "1.0.5",
|
|
47
|
+
"@yamada-ui/use-eye-dropper": "^1.0.2",
|
|
48
48
|
"@yamada-ui/use-latest-ref": "^1.0.0",
|
|
49
|
-
"@yamada-ui/use-outside-click": "1.0.
|
|
50
|
-
"@yamada-ui/use-pan-event": "^1.0.
|
|
51
|
-
"@yamada-ui/use-size": "^1.0.
|
|
52
|
-
"@yamada-ui/utils": "1.0.
|
|
49
|
+
"@yamada-ui/use-outside-click": "1.0.5",
|
|
50
|
+
"@yamada-ui/use-pan-event": "^1.0.5",
|
|
51
|
+
"@yamada-ui/use-size": "^1.0.5",
|
|
52
|
+
"@yamada-ui/utils": "1.0.5"
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"clean-package": "2.2.0",
|