@proyecto-viviana/solid-stately 0.1.5 → 0.2.1
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/{src → dist}/autocomplete/createAutocompleteState.d.ts +0 -1
- package/{src → dist}/autocomplete/index.d.ts +0 -1
- package/{src → dist}/calendar/createCalendarState.d.ts +0 -1
- package/{src → dist}/calendar/createDateFieldState.d.ts +0 -1
- package/{src → dist}/calendar/createRangeCalendarState.d.ts +0 -1
- package/{src → dist}/calendar/createTimeFieldState.d.ts +0 -1
- package/{src → dist}/calendar/index.d.ts +0 -1
- package/{src → dist}/checkbox/createCheckboxGroupState.d.ts +0 -1
- package/{src → dist}/checkbox/index.d.ts +0 -1
- package/{src → dist}/collections/ListCollection.d.ts +0 -1
- package/{src → dist}/collections/createListState.d.ts +0 -1
- package/{src → dist}/collections/createMenuState.d.ts +0 -1
- package/{src → dist}/collections/createSelectionState.d.ts +0 -1
- package/{src → dist}/collections/index.d.ts +0 -1
- package/{src → dist}/collections/types.d.ts +0 -1
- package/{src → dist}/color/Color.d.ts +0 -1
- package/{src → dist}/color/createColorAreaState.d.ts +0 -1
- package/{src → dist}/color/createColorFieldState.d.ts +0 -1
- package/{src → dist}/color/createColorSliderState.d.ts +0 -1
- package/{src → dist}/color/createColorWheelState.d.ts +0 -1
- package/{src → dist}/color/index.d.ts +0 -1
- package/{src → dist}/color/types.d.ts +0 -1
- package/{src → dist}/combobox/createComboBoxState.d.ts +0 -1
- package/{src → dist}/combobox/index.d.ts +0 -1
- package/{src → dist}/disclosure/createDisclosureState.d.ts +0 -1
- package/{src → dist}/disclosure/index.d.ts +0 -1
- package/{src → dist}/dnd/createDragState.d.ts +0 -1
- package/{src → dist}/dnd/createDraggableCollectionState.d.ts +0 -1
- package/{src → dist}/dnd/createDropState.d.ts +0 -1
- package/{src → dist}/dnd/createDroppableCollectionState.d.ts +0 -1
- package/{src → dist}/dnd/index.d.ts +0 -1
- package/{src → dist}/dnd/types.d.ts +0 -1
- package/{src → dist}/form/createFormValidationState.d.ts +0 -1
- package/{src → dist}/form/index.d.ts +0 -1
- package/{src → dist}/grid/createGridState.d.ts +0 -1
- package/{src → dist}/grid/index.d.ts +0 -1
- package/{src → dist}/grid/types.d.ts +0 -1
- package/dist/index.d.ts +25 -3363
- package/dist/index.js +2 -2
- package/dist/index.js.map +7 -1
- package/{src → dist}/numberfield/createNumberFieldState.d.ts +0 -1
- package/{src → dist}/numberfield/index.d.ts +0 -1
- package/{src → dist}/overlays/createOverlayTriggerState.d.ts +0 -1
- package/{src → dist}/overlays/index.d.ts +0 -1
- package/{src → dist}/radio/createRadioGroupState.d.ts +0 -1
- package/{src → dist}/radio/index.d.ts +0 -1
- package/{src → dist}/searchfield/createSearchFieldState.d.ts +0 -1
- package/{src → dist}/searchfield/index.d.ts +0 -1
- package/{src → dist}/select/createSelectState.d.ts +0 -1
- package/{src → dist}/select/index.d.ts +0 -1
- package/{src → dist}/slider/createSliderState.d.ts +0 -1
- package/{src → dist}/slider/index.d.ts +0 -1
- package/{src → dist}/ssr/index.d.ts +0 -1
- package/{src → dist}/table/TableCollection.d.ts +0 -1
- package/{src → dist}/table/createTableState.d.ts +0 -1
- package/{src → dist}/table/index.d.ts +0 -1
- package/{src → dist}/table/types.d.ts +0 -1
- package/{src → dist}/tabs/createTabListState.d.ts +0 -1
- package/{src → dist}/tabs/index.d.ts +0 -1
- package/{src → dist}/textfield/createTextFieldState.d.ts +0 -1
- package/{src → dist}/textfield/index.d.ts +0 -1
- package/{src → dist}/toast/createToastState.d.ts +0 -1
- package/{src → dist}/toast/index.d.ts +0 -1
- package/{src → dist}/toggle/createToggleState.d.ts +0 -1
- package/{src → dist}/toggle/index.d.ts +0 -1
- package/{src → dist}/tooltip/createTooltipTriggerState.d.ts +0 -1
- package/{src → dist}/tooltip/index.d.ts +0 -1
- package/{src → dist}/tree/TreeCollection.d.ts +0 -1
- package/{src → dist}/tree/createTreeState.d.ts +0 -1
- package/{src → dist}/tree/index.d.ts +0 -1
- package/{src → dist}/tree/types.d.ts +0 -1
- package/{src → dist}/utils/reactivity.d.ts +0 -1
- package/package.json +5 -7
- package/src/autocomplete/createAutocompleteState.d.ts.map +0 -1
- package/src/autocomplete/createAutocompleteState.ts +0 -90
- package/src/autocomplete/index.d.ts.map +0 -1
- package/src/autocomplete/index.ts +0 -5
- package/src/calendar/createCalendarState.d.ts.map +0 -1
- package/src/calendar/createCalendarState.ts +0 -461
- package/src/calendar/createDateFieldState.d.ts.map +0 -1
- package/src/calendar/createDateFieldState.ts +0 -562
- package/src/calendar/createRangeCalendarState.d.ts.map +0 -1
- package/src/calendar/createRangeCalendarState.ts +0 -535
- package/src/calendar/createTimeFieldState.d.ts.map +0 -1
- package/src/calendar/createTimeFieldState.ts +0 -483
- package/src/calendar/index.d.ts.map +0 -1
- package/src/calendar/index.ts +0 -81
- package/src/checkbox/createCheckboxGroupState.d.ts.map +0 -1
- package/src/checkbox/createCheckboxGroupState.ts +0 -193
- package/src/checkbox/index.d.ts.map +0 -1
- package/src/checkbox/index.ts +0 -5
- package/src/collections/ListCollection.d.ts.map +0 -1
- package/src/collections/ListCollection.ts +0 -146
- package/src/collections/createListState.d.ts.map +0 -1
- package/src/collections/createListState.ts +0 -264
- package/src/collections/createMenuState.d.ts.map +0 -1
- package/src/collections/createMenuState.ts +0 -106
- package/src/collections/createSelectionState.d.ts.map +0 -1
- package/src/collections/createSelectionState.ts +0 -336
- package/src/collections/index.d.ts.map +0 -1
- package/src/collections/index.ts +0 -46
- package/src/collections/types.d.ts.map +0 -1
- package/src/collections/types.ts +0 -169
- package/src/color/Color.d.ts.map +0 -1
- package/src/color/Color.ts +0 -951
- package/src/color/createColorAreaState.d.ts.map +0 -1
- package/src/color/createColorAreaState.ts +0 -293
- package/src/color/createColorFieldState.d.ts.map +0 -1
- package/src/color/createColorFieldState.ts +0 -292
- package/src/color/createColorSliderState.d.ts.map +0 -1
- package/src/color/createColorSliderState.ts +0 -241
- package/src/color/createColorWheelState.d.ts.map +0 -1
- package/src/color/createColorWheelState.ts +0 -211
- package/src/color/index.d.ts.map +0 -1
- package/src/color/index.ts +0 -47
- package/src/color/types.d.ts.map +0 -1
- package/src/color/types.ts +0 -127
- package/src/combobox/createComboBoxState.d.ts.map +0 -1
- package/src/combobox/createComboBoxState.ts +0 -703
- package/src/combobox/index.d.ts.map +0 -1
- package/src/combobox/index.ts +0 -13
- package/src/disclosure/createDisclosureState.d.ts.map +0 -1
- package/src/disclosure/createDisclosureState.ts +0 -193
- package/src/disclosure/index.d.ts.map +0 -1
- package/src/disclosure/index.ts +0 -9
- package/src/dnd/createDragState.d.ts.map +0 -1
- package/src/dnd/createDragState.ts +0 -153
- package/src/dnd/createDraggableCollectionState.d.ts.map +0 -1
- package/src/dnd/createDraggableCollectionState.ts +0 -165
- package/src/dnd/createDropState.d.ts.map +0 -1
- package/src/dnd/createDropState.ts +0 -212
- package/src/dnd/createDroppableCollectionState.d.ts.map +0 -1
- package/src/dnd/createDroppableCollectionState.ts +0 -357
- package/src/dnd/index.d.ts.map +0 -1
- package/src/dnd/index.ts +0 -76
- package/src/dnd/types.d.ts.map +0 -1
- package/src/dnd/types.ts +0 -317
- package/src/form/createFormValidationState.d.ts.map +0 -1
- package/src/form/createFormValidationState.ts +0 -389
- package/src/form/index.d.ts.map +0 -1
- package/src/form/index.ts +0 -15
- package/src/grid/createGridState.d.ts.map +0 -1
- package/src/grid/createGridState.ts +0 -327
- package/src/grid/index.d.ts.map +0 -1
- package/src/grid/index.ts +0 -13
- package/src/grid/types.d.ts.map +0 -1
- package/src/grid/types.ts +0 -179
- package/src/index.d.ts +0 -26
- package/src/index.d.ts.map +0 -1
- package/src/index.ts +0 -383
- package/src/numberfield/createNumberFieldState.d.ts.map +0 -1
- package/src/numberfield/createNumberFieldState.ts +0 -383
- package/src/numberfield/index.d.ts.map +0 -1
- package/src/numberfield/index.ts +0 -5
- package/src/overlays/createOverlayTriggerState.d.ts.map +0 -1
- package/src/overlays/createOverlayTriggerState.ts +0 -67
- package/src/overlays/index.d.ts.map +0 -1
- package/src/overlays/index.ts +0 -5
- package/src/radio/createRadioGroupState.d.ts.map +0 -1
- package/src/radio/createRadioGroupState.ts +0 -201
- package/src/radio/index.d.ts.map +0 -1
- package/src/radio/index.ts +0 -6
- package/src/searchfield/createSearchFieldState.d.ts.map +0 -1
- package/src/searchfield/createSearchFieldState.ts +0 -62
- package/src/searchfield/index.d.ts.map +0 -1
- package/src/searchfield/index.ts +0 -5
- package/src/select/createSelectState.d.ts.map +0 -1
- package/src/select/createSelectState.ts +0 -181
- package/src/select/index.d.ts.map +0 -1
- package/src/select/index.ts +0 -5
- package/src/slider/createSliderState.d.ts.map +0 -1
- package/src/slider/createSliderState.ts +0 -211
- package/src/slider/index.d.ts.map +0 -1
- package/src/slider/index.ts +0 -6
- package/src/ssr/index.d.ts.map +0 -1
- package/src/ssr/index.ts +0 -41
- package/src/table/TableCollection.d.ts.map +0 -1
- package/src/table/TableCollection.ts +0 -388
- package/src/table/createTableState.d.ts.map +0 -1
- package/src/table/createTableState.ts +0 -127
- package/src/table/index.d.ts.map +0 -1
- package/src/table/index.ts +0 -18
- package/src/table/types.d.ts.map +0 -1
- package/src/table/types.ts +0 -150
- package/src/tabs/createTabListState.d.ts.map +0 -1
- package/src/tabs/createTabListState.ts +0 -240
- package/src/tabs/index.d.ts.map +0 -1
- package/src/tabs/index.ts +0 -7
- package/src/textfield/createTextFieldState.d.ts.map +0 -1
- package/src/textfield/createTextFieldState.ts +0 -75
- package/src/textfield/index.d.ts.map +0 -1
- package/src/textfield/index.ts +0 -5
- package/src/toast/createToastState.d.ts.map +0 -1
- package/src/toast/createToastState.ts +0 -316
- package/src/toast/index.d.ts.map +0 -1
- package/src/toast/index.ts +0 -11
- package/src/toggle/createToggleState.d.ts.map +0 -1
- package/src/toggle/createToggleState.ts +0 -94
- package/src/toggle/index.d.ts.map +0 -1
- package/src/toggle/index.ts +0 -5
- package/src/tooltip/createTooltipTriggerState.d.ts.map +0 -1
- package/src/tooltip/createTooltipTriggerState.ts +0 -183
- package/src/tooltip/index.d.ts.map +0 -1
- package/src/tooltip/index.ts +0 -6
- package/src/tree/TreeCollection.d.ts.map +0 -1
- package/src/tree/TreeCollection.ts +0 -175
- package/src/tree/createTreeState.d.ts.map +0 -1
- package/src/tree/createTreeState.ts +0 -392
- package/src/tree/index.d.ts.map +0 -1
- package/src/tree/index.ts +0 -13
- package/src/tree/types.d.ts.map +0 -1
- package/src/tree/types.ts +0 -174
- package/src/utils/index.d.ts +0 -2
- package/src/utils/index.d.ts.map +0 -1
- package/src/utils/reactivity.d.ts.map +0 -1
- package/src/utils/reactivity.ts +0 -36
- /package/{src/utils/index.ts → dist/utils/index.d.ts} +0 -0
|
@@ -1,241 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* ColorSlider state management.
|
|
3
|
-
* Based on @react-stately/color useColorSliderState.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
import { createSignal, createMemo, type Accessor } from 'solid-js';
|
|
7
|
-
import type { Color, ColorChannel } from './types';
|
|
8
|
-
import { normalizeColor } from './Color';
|
|
9
|
-
|
|
10
|
-
export interface ColorSliderStateOptions {
|
|
11
|
-
/** The current color value (controlled). */
|
|
12
|
-
value?: Color | string;
|
|
13
|
-
/** The default color value (uncontrolled). */
|
|
14
|
-
defaultValue?: Color | string;
|
|
15
|
-
/** Handler called when the color changes. */
|
|
16
|
-
onChange?: (color: Color) => void;
|
|
17
|
-
/** Handler called when dragging ends. */
|
|
18
|
-
onChangeEnd?: (color: Color) => void;
|
|
19
|
-
/** The color channel this slider controls. */
|
|
20
|
-
channel: ColorChannel;
|
|
21
|
-
/** Whether the slider is disabled. */
|
|
22
|
-
isDisabled?: boolean;
|
|
23
|
-
/** The locale for formatting. */
|
|
24
|
-
locale?: string;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
export interface ColorSliderState {
|
|
28
|
-
/** The current color value. */
|
|
29
|
-
readonly value: Color;
|
|
30
|
-
/** Whether the slider is being dragged. */
|
|
31
|
-
readonly isDragging: boolean;
|
|
32
|
-
/** The color channel being controlled. */
|
|
33
|
-
readonly channel: ColorChannel;
|
|
34
|
-
/** The step value for the channel. */
|
|
35
|
-
readonly step: number;
|
|
36
|
-
/** The page step value for the channel. */
|
|
37
|
-
readonly pageSize: number;
|
|
38
|
-
/** The minimum value for the channel. */
|
|
39
|
-
readonly minValue: number;
|
|
40
|
-
/** The maximum value for the channel. */
|
|
41
|
-
readonly maxValue: number;
|
|
42
|
-
/** Whether the slider is disabled. */
|
|
43
|
-
readonly isDisabled: boolean;
|
|
44
|
-
|
|
45
|
-
/** Get the current channel value. */
|
|
46
|
-
getThumbValue(): number;
|
|
47
|
-
/** Get the minimum percent. */
|
|
48
|
-
getThumbMinValue(): number;
|
|
49
|
-
/** Get the maximum percent. */
|
|
50
|
-
getThumbMaxValue(): number;
|
|
51
|
-
/** Get the thumb value as a percentage. */
|
|
52
|
-
getThumbPercent(): number;
|
|
53
|
-
/** Set the channel value. */
|
|
54
|
-
setThumbValue(value: number): void;
|
|
55
|
-
/** Set the thumb value from a percentage (0-1). */
|
|
56
|
-
setThumbPercent(percent: number): void;
|
|
57
|
-
/** Increment the channel value. */
|
|
58
|
-
incrementThumb(stepSize?: number): void;
|
|
59
|
-
/** Decrement the channel value. */
|
|
60
|
-
decrementThumb(stepSize?: number): void;
|
|
61
|
-
/** Set the dragging state. */
|
|
62
|
-
setDragging(isDragging: boolean): void;
|
|
63
|
-
/** Get the display color (with alpha = 1). */
|
|
64
|
-
getDisplayColor(): Color;
|
|
65
|
-
/** Get the formatted value label. */
|
|
66
|
-
getThumbValueLabel(): string;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* Creates state for a color slider.
|
|
71
|
-
*/
|
|
72
|
-
export function createColorSliderState(
|
|
73
|
-
options: Accessor<ColorSliderStateOptions>
|
|
74
|
-
): ColorSliderState {
|
|
75
|
-
const getOptions = () => options();
|
|
76
|
-
|
|
77
|
-
// Internal value state
|
|
78
|
-
const [internalValue, setInternalValue] = createSignal<Color | null>(null);
|
|
79
|
-
const [isDragging, setIsDragging] = createSignal(false);
|
|
80
|
-
|
|
81
|
-
// Initialize internal value
|
|
82
|
-
const initValue = () => {
|
|
83
|
-
const opts = getOptions();
|
|
84
|
-
if (opts.defaultValue) {
|
|
85
|
-
return normalizeColor(opts.defaultValue);
|
|
86
|
-
}
|
|
87
|
-
return null;
|
|
88
|
-
};
|
|
89
|
-
|
|
90
|
-
// Set initial value
|
|
91
|
-
if (internalValue() === null) {
|
|
92
|
-
const init = initValue();
|
|
93
|
-
if (init) {
|
|
94
|
-
setInternalValue(init);
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
// Controlled vs uncontrolled value
|
|
99
|
-
const value = createMemo(() => {
|
|
100
|
-
const opts = getOptions();
|
|
101
|
-
if (opts.value !== undefined) {
|
|
102
|
-
return normalizeColor(opts.value);
|
|
103
|
-
}
|
|
104
|
-
return internalValue() ?? normalizeColor('#ff0000');
|
|
105
|
-
});
|
|
106
|
-
|
|
107
|
-
const channel = createMemo(() => getOptions().channel);
|
|
108
|
-
const isDisabled = createMemo(() => getOptions().isDisabled ?? false);
|
|
109
|
-
const locale = createMemo(() => getOptions().locale ?? 'en-US');
|
|
110
|
-
|
|
111
|
-
// Get channel range
|
|
112
|
-
const channelRange = createMemo(() => value().getChannelRange(channel()));
|
|
113
|
-
|
|
114
|
-
const step = createMemo(() => channelRange().step);
|
|
115
|
-
const pageSize = createMemo(() => channelRange().pageSize);
|
|
116
|
-
const minValue = createMemo(() => channelRange().minValue);
|
|
117
|
-
const maxValue = createMemo(() => channelRange().maxValue);
|
|
118
|
-
|
|
119
|
-
// Update value
|
|
120
|
-
const updateValue = (newColor: Color) => {
|
|
121
|
-
const opts = getOptions();
|
|
122
|
-
|
|
123
|
-
// Controlled mode
|
|
124
|
-
if (opts.value !== undefined) {
|
|
125
|
-
opts.onChange?.(newColor);
|
|
126
|
-
return;
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
// Uncontrolled mode
|
|
130
|
-
setInternalValue(newColor);
|
|
131
|
-
opts.onChange?.(newColor);
|
|
132
|
-
};
|
|
133
|
-
|
|
134
|
-
// Get thumb value
|
|
135
|
-
const getThumbValue = () => {
|
|
136
|
-
return value().getChannelValue(channel());
|
|
137
|
-
};
|
|
138
|
-
|
|
139
|
-
// Get min/max values
|
|
140
|
-
const getThumbMinValue = () => minValue();
|
|
141
|
-
const getThumbMaxValue = () => maxValue();
|
|
142
|
-
|
|
143
|
-
// Get thumb percent
|
|
144
|
-
const getThumbPercent = () => {
|
|
145
|
-
const val = getThumbValue();
|
|
146
|
-
const min = minValue();
|
|
147
|
-
const max = maxValue();
|
|
148
|
-
return (val - min) / (max - min);
|
|
149
|
-
};
|
|
150
|
-
|
|
151
|
-
// Set thumb value
|
|
152
|
-
const setThumbValue = (newValue: number) => {
|
|
153
|
-
const clamped = Math.max(minValue(), Math.min(maxValue(), newValue));
|
|
154
|
-
const rounded = Math.round(clamped / step()) * step();
|
|
155
|
-
const newColor = value().withChannelValue(channel(), rounded);
|
|
156
|
-
updateValue(newColor);
|
|
157
|
-
};
|
|
158
|
-
|
|
159
|
-
// Set thumb from percent
|
|
160
|
-
const setThumbPercent = (percent: number) => {
|
|
161
|
-
const min = minValue();
|
|
162
|
-
const max = maxValue();
|
|
163
|
-
const val = min + (max - min) * percent;
|
|
164
|
-
setThumbValue(val);
|
|
165
|
-
};
|
|
166
|
-
|
|
167
|
-
// Increment
|
|
168
|
-
const incrementThumb = (stepSize?: number) => {
|
|
169
|
-
const s = stepSize ?? step();
|
|
170
|
-
setThumbValue(getThumbValue() + s);
|
|
171
|
-
};
|
|
172
|
-
|
|
173
|
-
// Decrement
|
|
174
|
-
const decrementThumb = (stepSize?: number) => {
|
|
175
|
-
const s = stepSize ?? step();
|
|
176
|
-
setThumbValue(getThumbValue() - s);
|
|
177
|
-
};
|
|
178
|
-
|
|
179
|
-
// Set dragging
|
|
180
|
-
const setDraggingState = (dragging: boolean) => {
|
|
181
|
-
const wasDragging = isDragging();
|
|
182
|
-
setIsDragging(dragging);
|
|
183
|
-
|
|
184
|
-
// Call onChangeEnd when dragging ends
|
|
185
|
-
if (wasDragging && !dragging) {
|
|
186
|
-
getOptions().onChangeEnd?.(value());
|
|
187
|
-
}
|
|
188
|
-
};
|
|
189
|
-
|
|
190
|
-
// Get display color (alpha = 1)
|
|
191
|
-
const getDisplayColor = () => {
|
|
192
|
-
const v = value();
|
|
193
|
-
return v.withChannelValue('alpha', 1);
|
|
194
|
-
};
|
|
195
|
-
|
|
196
|
-
// Get formatted value label
|
|
197
|
-
const getThumbValueLabel = () => {
|
|
198
|
-
const v = value();
|
|
199
|
-
const ch = channel();
|
|
200
|
-
const loc = locale();
|
|
201
|
-
return v.formatChannelValue(ch, loc);
|
|
202
|
-
};
|
|
203
|
-
|
|
204
|
-
return {
|
|
205
|
-
get value() {
|
|
206
|
-
return value();
|
|
207
|
-
},
|
|
208
|
-
get isDragging() {
|
|
209
|
-
return isDragging();
|
|
210
|
-
},
|
|
211
|
-
get channel() {
|
|
212
|
-
return channel();
|
|
213
|
-
},
|
|
214
|
-
get step() {
|
|
215
|
-
return step();
|
|
216
|
-
},
|
|
217
|
-
get pageSize() {
|
|
218
|
-
return pageSize();
|
|
219
|
-
},
|
|
220
|
-
get minValue() {
|
|
221
|
-
return minValue();
|
|
222
|
-
},
|
|
223
|
-
get maxValue() {
|
|
224
|
-
return maxValue();
|
|
225
|
-
},
|
|
226
|
-
get isDisabled() {
|
|
227
|
-
return isDisabled();
|
|
228
|
-
},
|
|
229
|
-
getThumbValue,
|
|
230
|
-
getThumbMinValue,
|
|
231
|
-
getThumbMaxValue,
|
|
232
|
-
getThumbPercent,
|
|
233
|
-
setThumbValue,
|
|
234
|
-
setThumbPercent,
|
|
235
|
-
incrementThumb,
|
|
236
|
-
decrementThumb,
|
|
237
|
-
setDragging: setDraggingState,
|
|
238
|
-
getDisplayColor,
|
|
239
|
-
getThumbValueLabel,
|
|
240
|
-
};
|
|
241
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"createColorWheelState.d.ts","sourceRoot":"","sources":["createColorWheelState.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAA4B,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAC;AACnE,OAAO,KAAK,EAAE,KAAK,EAAgB,MAAM,SAAS,CAAC;AAGnD,MAAM,WAAW,sBAAsB;IACrC,4CAA4C;IAC5C,KAAK,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACvB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAC9B,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC,yCAAyC;IACzC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACrC,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,eAAe;IAC9B,+BAA+B;IAC/B,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC;IACtB,0CAA0C;IAC1C,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;IAC7B,qCAAqC;IACrC,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC;IAC7B,kCAAkC;IAClC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,uCAAuC;IACvC,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAE1B,yCAAyC;IACzC,MAAM,IAAI,MAAM,CAAC;IACjB,yBAAyB;IACzB,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,wCAAwC;IACxC,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,8EAA8E;IAC9E,aAAa,IAAI,MAAM,CAAC;IACxB,2BAA2B;IAC3B,SAAS,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,2BAA2B;IAC3B,SAAS,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACnC,8BAA8B;IAC9B,WAAW,CAAC,UAAU,EAAE,OAAO,GAAG,IAAI,CAAC;IACvC,yEAAyE;IACzE,eAAe,IAAI,KAAK,CAAC;CAC1B;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,QAAQ,CAAC,sBAAsB,CAAC,GACxC,eAAe,CAyJjB"}
|
|
@@ -1,211 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* ColorWheel state management.
|
|
3
|
-
* Based on @react-stately/color useColorWheelState.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
import { createSignal, createMemo, type Accessor } from 'solid-js';
|
|
7
|
-
import type { Color, ColorChannel } from './types';
|
|
8
|
-
import { normalizeColor } from './Color';
|
|
9
|
-
|
|
10
|
-
export interface ColorWheelStateOptions {
|
|
11
|
-
/** The current color value (controlled). */
|
|
12
|
-
value?: Color | string;
|
|
13
|
-
/** The default color value (uncontrolled). */
|
|
14
|
-
defaultValue?: Color | string;
|
|
15
|
-
/** Handler called when the color changes. */
|
|
16
|
-
onChange?: (color: Color) => void;
|
|
17
|
-
/** Handler called when dragging ends. */
|
|
18
|
-
onChangeEnd?: (color: Color) => void;
|
|
19
|
-
/** Whether the wheel is disabled. */
|
|
20
|
-
isDisabled?: boolean;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
export interface ColorWheelState {
|
|
24
|
-
/** The current color value. */
|
|
25
|
-
readonly value: Color;
|
|
26
|
-
/** Whether the wheel is being dragged. */
|
|
27
|
-
readonly isDragging: boolean;
|
|
28
|
-
/** Whether the wheel is disabled. */
|
|
29
|
-
readonly isDisabled: boolean;
|
|
30
|
-
/** Step value for hue changes. */
|
|
31
|
-
readonly step: number;
|
|
32
|
-
/** Page step value for hue changes. */
|
|
33
|
-
readonly pageStep: number;
|
|
34
|
-
|
|
35
|
-
/** Get the current hue value (0-360). */
|
|
36
|
-
getHue(): number;
|
|
37
|
-
/** Set the hue value. */
|
|
38
|
-
setHue(value: number): void;
|
|
39
|
-
/** Set hue from an angle in radians. */
|
|
40
|
-
setHueFromAngle(angle: number): void;
|
|
41
|
-
/** Get the thumb angle in radians (0 = right, increases counterclockwise). */
|
|
42
|
-
getThumbAngle(): number;
|
|
43
|
-
/** Increment hue value. */
|
|
44
|
-
increment(stepSize?: number): void;
|
|
45
|
-
/** Decrement hue value. */
|
|
46
|
-
decrement(stepSize?: number): void;
|
|
47
|
-
/** Set the dragging state. */
|
|
48
|
-
setDragging(isDragging: boolean): void;
|
|
49
|
-
/** Get the display color (with full saturation/brightness for wheel). */
|
|
50
|
-
getDisplayColor(): Color;
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
/**
|
|
54
|
-
* Creates state for a color wheel (circular hue picker).
|
|
55
|
-
*/
|
|
56
|
-
export function createColorWheelState(
|
|
57
|
-
options: Accessor<ColorWheelStateOptions>
|
|
58
|
-
): ColorWheelState {
|
|
59
|
-
const getOptions = () => options();
|
|
60
|
-
|
|
61
|
-
// Internal value state
|
|
62
|
-
const [internalValue, setInternalValue] = createSignal<Color | null>(null);
|
|
63
|
-
const [isDragging, setIsDragging] = createSignal(false);
|
|
64
|
-
|
|
65
|
-
// Initialize internal value
|
|
66
|
-
const initValue = () => {
|
|
67
|
-
const opts = getOptions();
|
|
68
|
-
if (opts.defaultValue) {
|
|
69
|
-
return normalizeColor(opts.defaultValue);
|
|
70
|
-
}
|
|
71
|
-
return null;
|
|
72
|
-
};
|
|
73
|
-
|
|
74
|
-
// Set initial value
|
|
75
|
-
if (internalValue() === null) {
|
|
76
|
-
const init = initValue();
|
|
77
|
-
if (init) {
|
|
78
|
-
setInternalValue(init);
|
|
79
|
-
}
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
// Controlled vs uncontrolled value
|
|
83
|
-
const value = createMemo(() => {
|
|
84
|
-
const opts = getOptions();
|
|
85
|
-
if (opts.value !== undefined) {
|
|
86
|
-
return normalizeColor(opts.value);
|
|
87
|
-
}
|
|
88
|
-
return internalValue() ?? normalizeColor('#ff0000');
|
|
89
|
-
});
|
|
90
|
-
|
|
91
|
-
const isDisabled = createMemo(() => getOptions().isDisabled ?? false);
|
|
92
|
-
|
|
93
|
-
// Hue step and page step
|
|
94
|
-
const hueRange = createMemo(() => value().getChannelRange('hue'));
|
|
95
|
-
const step = createMemo(() => hueRange().step);
|
|
96
|
-
const pageStep = createMemo(() => hueRange().pageSize);
|
|
97
|
-
|
|
98
|
-
// Update value
|
|
99
|
-
const updateValue = (newColor: Color) => {
|
|
100
|
-
const opts = getOptions();
|
|
101
|
-
|
|
102
|
-
// Controlled mode
|
|
103
|
-
if (opts.value !== undefined) {
|
|
104
|
-
opts.onChange?.(newColor);
|
|
105
|
-
return;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
// Uncontrolled mode
|
|
109
|
-
setInternalValue(newColor);
|
|
110
|
-
opts.onChange?.(newColor);
|
|
111
|
-
};
|
|
112
|
-
|
|
113
|
-
// Get hue value (0-360)
|
|
114
|
-
const getHue = () => value().getChannelValue('hue');
|
|
115
|
-
|
|
116
|
-
// Set hue value
|
|
117
|
-
const setHue = (newValue: number) => {
|
|
118
|
-
// Wrap hue to 0-360 range
|
|
119
|
-
let hue = newValue % 360;
|
|
120
|
-
if (hue < 0) hue += 360;
|
|
121
|
-
|
|
122
|
-
// Round to step
|
|
123
|
-
const range = hueRange();
|
|
124
|
-
const rounded = Math.round(hue / range.step) * range.step;
|
|
125
|
-
|
|
126
|
-
const newColor = value().withChannelValue('hue', rounded);
|
|
127
|
-
updateValue(newColor);
|
|
128
|
-
};
|
|
129
|
-
|
|
130
|
-
// Set hue from angle (radians, 0 = right, counterclockwise)
|
|
131
|
-
const setHueFromAngle = (angle: number) => {
|
|
132
|
-
// Convert angle to degrees (0-360)
|
|
133
|
-
// angle 0 = right (3 o'clock) = hue 0
|
|
134
|
-
// angle increases counterclockwise
|
|
135
|
-
let degrees = (angle * 180) / Math.PI;
|
|
136
|
-
degrees = 360 - degrees; // Convert to clockwise
|
|
137
|
-
if (degrees < 0) degrees += 360;
|
|
138
|
-
if (degrees >= 360) degrees -= 360;
|
|
139
|
-
|
|
140
|
-
setHue(degrees);
|
|
141
|
-
};
|
|
142
|
-
|
|
143
|
-
// Get thumb angle in radians
|
|
144
|
-
const getThumbAngle = () => {
|
|
145
|
-
const hue = getHue();
|
|
146
|
-
// Convert hue to angle (radians)
|
|
147
|
-
// hue 0 = angle 0 (right)
|
|
148
|
-
// hue increases clockwise, angle increases counterclockwise
|
|
149
|
-
const degrees = 360 - hue;
|
|
150
|
-
return (degrees * Math.PI) / 180;
|
|
151
|
-
};
|
|
152
|
-
|
|
153
|
-
// Increment hue
|
|
154
|
-
const increment = (stepSize?: number) => {
|
|
155
|
-
const s = stepSize ?? step();
|
|
156
|
-
setHue(getHue() + s);
|
|
157
|
-
};
|
|
158
|
-
|
|
159
|
-
// Decrement hue
|
|
160
|
-
const decrement = (stepSize?: number) => {
|
|
161
|
-
const s = stepSize ?? step();
|
|
162
|
-
setHue(getHue() - s);
|
|
163
|
-
};
|
|
164
|
-
|
|
165
|
-
// Set dragging state
|
|
166
|
-
const setDraggingState = (dragging: boolean) => {
|
|
167
|
-
const wasDragging = isDragging();
|
|
168
|
-
setIsDragging(dragging);
|
|
169
|
-
|
|
170
|
-
// Call onChangeEnd when dragging ends
|
|
171
|
-
if (wasDragging && !dragging) {
|
|
172
|
-
getOptions().onChangeEnd?.(value());
|
|
173
|
-
}
|
|
174
|
-
};
|
|
175
|
-
|
|
176
|
-
// Get display color (full saturation and brightness for wheel preview)
|
|
177
|
-
const getDisplayColor = () => {
|
|
178
|
-
// For display, we want the color at full saturation and brightness
|
|
179
|
-
// to show the pure hue on the wheel
|
|
180
|
-
return value()
|
|
181
|
-
.withChannelValue('saturation', 100)
|
|
182
|
-
.withChannelValue('brightness', 100)
|
|
183
|
-
.withChannelValue('alpha', 1);
|
|
184
|
-
};
|
|
185
|
-
|
|
186
|
-
return {
|
|
187
|
-
get value() {
|
|
188
|
-
return value();
|
|
189
|
-
},
|
|
190
|
-
get isDragging() {
|
|
191
|
-
return isDragging();
|
|
192
|
-
},
|
|
193
|
-
get isDisabled() {
|
|
194
|
-
return isDisabled();
|
|
195
|
-
},
|
|
196
|
-
get step() {
|
|
197
|
-
return step();
|
|
198
|
-
},
|
|
199
|
-
get pageStep() {
|
|
200
|
-
return pageStep();
|
|
201
|
-
},
|
|
202
|
-
getHue,
|
|
203
|
-
setHue,
|
|
204
|
-
setHueFromAngle,
|
|
205
|
-
getThumbAngle,
|
|
206
|
-
increment,
|
|
207
|
-
decrement,
|
|
208
|
-
setDragging: setDraggingState,
|
|
209
|
-
getDisplayColor,
|
|
210
|
-
};
|
|
211
|
-
}
|
package/src/color/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAGH,YAAY,EACV,KAAK,EACL,WAAW,EACX,UAAU,EACV,YAAY,EACZ,iBAAiB,EACjB,SAAS,GACV,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,UAAU,EACV,cAAc,EACd,cAAc,EACd,cAAc,EACd,cAAc,GACf,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,sBAAsB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,gBAAgB,GACtB,MAAM,0BAA0B,CAAC;AAElC,OAAO,EACL,oBAAoB,EACpB,KAAK,qBAAqB,EAC1B,KAAK,cAAc,GACpB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EACL,qBAAqB,EACrB,KAAK,sBAAsB,EAC3B,KAAK,eAAe,GACrB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,qBAAqB,EACrB,KAAK,sBAAsB,EAC3B,KAAK,eAAe,GACrB,MAAM,yBAAyB,CAAC"}
|
package/src/color/index.ts
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Color state management exports.
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
// Types
|
|
6
|
-
export type {
|
|
7
|
-
Color,
|
|
8
|
-
ColorFormat,
|
|
9
|
-
ColorSpace,
|
|
10
|
-
ColorChannel,
|
|
11
|
-
ColorChannelRange,
|
|
12
|
-
ColorAxes,
|
|
13
|
-
} from './types';
|
|
14
|
-
|
|
15
|
-
// Color class and utilities
|
|
16
|
-
export {
|
|
17
|
-
parseColor,
|
|
18
|
-
normalizeColor,
|
|
19
|
-
createRGBColor,
|
|
20
|
-
createHSLColor,
|
|
21
|
-
createHSBColor,
|
|
22
|
-
} from './Color';
|
|
23
|
-
|
|
24
|
-
// State hooks
|
|
25
|
-
export {
|
|
26
|
-
createColorSliderState,
|
|
27
|
-
type ColorSliderStateOptions,
|
|
28
|
-
type ColorSliderState,
|
|
29
|
-
} from './createColorSliderState';
|
|
30
|
-
|
|
31
|
-
export {
|
|
32
|
-
createColorAreaState,
|
|
33
|
-
type ColorAreaStateOptions,
|
|
34
|
-
type ColorAreaState,
|
|
35
|
-
} from './createColorAreaState';
|
|
36
|
-
|
|
37
|
-
export {
|
|
38
|
-
createColorWheelState,
|
|
39
|
-
type ColorWheelStateOptions,
|
|
40
|
-
type ColorWheelState,
|
|
41
|
-
} from './createColorWheelState';
|
|
42
|
-
|
|
43
|
-
export {
|
|
44
|
-
createColorFieldState,
|
|
45
|
-
type ColorFieldStateOptions,
|
|
46
|
-
type ColorFieldState,
|
|
47
|
-
} from './createColorFieldState';
|
package/src/color/types.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;GAEG;AACH,MAAM,MAAM,WAAW,GACnB,KAAK,GACL,MAAM,GACN,KAAK,GACL,MAAM,GACN,KAAK,GACL,MAAM,GACN,KAAK,GACL,MAAM,CAAC;AAEX;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAE/C;;GAEG;AACH,MAAM,MAAM,YAAY,GACpB,KAAK,GACL,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,KAAK,GACL,OAAO,GACP,MAAM,GACN,OAAO,CAAC;AAEZ;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,qBAAqB;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,qBAAqB;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,uCAAuC;IACvC,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,sBAAsB;IACtB,QAAQ,EAAE,YAAY,CAAC;IACvB,sBAAsB;IACtB,QAAQ,EAAE,YAAY,CAAC;IACvB,8CAA8C;IAC9C,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED;;GAEG;AACH,MAAM,WAAW,KAAK;IACpB,qCAAqC;IACrC,QAAQ,CAAC,MAAM,EAAE,WAAW,GAAG,KAAK,CAAC;IACrC,+BAA+B;IAC/B,QAAQ,CAAC,MAAM,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,MAAM,CAAC;IAC/C,wBAAwB;IACxB,KAAK,IAAI,KAAK,CAAC;IACf,uCAAuC;IACvC,QAAQ,IAAI,MAAM,CAAC;IACnB,2CAA2C;IAC3C,eAAe,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,CAAC;IAC/C,uDAAuD;IACvD,gBAAgB,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC;IAC9D,mCAAmC;IACnC,eAAe,CAAC,OAAO,EAAE,YAAY,GAAG,iBAAiB,CAAC;IAC1D,2CAA2C;IAC3C,cAAc,CAAC,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9D,4CAA4C;IAC5C,uBAAuB,CAAC,OAAO,EAAE,YAAY,GAAG,IAAI,CAAC,mBAAmB,CAAC;IACzE,qCAAqC;IACrC,kBAAkB,CAAC,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IAClE,2BAA2B;IAC3B,aAAa,IAAI,UAAU,CAAC;IAC5B,sCAAsC;IACtC,iBAAiB,CAAC,UAAU,CAAC,EAAE;QAAE,QAAQ,CAAC,EAAE,YAAY,CAAC;QAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;KAAE,GAAG,SAAS,CAAC;IAChG,6CAA6C;IAC7C,gBAAgB,IAAI,CAAC,YAAY,EAAE,YAAY,EAAE,YAAY,CAAC,CAAC;IAC/D,uCAAuC;IACvC,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACrC,8CAA8C;IAC9C,UAAU,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;CACpC;AAED;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf"}
|
package/src/color/types.ts
DELETED
|
@@ -1,127 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Color types for color picker components.
|
|
3
|
-
* Based on @react-stately/color.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Supported color formats.
|
|
8
|
-
*/
|
|
9
|
-
export type ColorFormat =
|
|
10
|
-
| 'hex'
|
|
11
|
-
| 'hexa'
|
|
12
|
-
| 'rgb'
|
|
13
|
-
| 'rgba'
|
|
14
|
-
| 'hsl'
|
|
15
|
-
| 'hsla'
|
|
16
|
-
| 'hsb'
|
|
17
|
-
| 'hsba';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Color spaces.
|
|
21
|
-
*/
|
|
22
|
-
export type ColorSpace = 'rgb' | 'hsl' | 'hsb';
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* Color channels.
|
|
26
|
-
*/
|
|
27
|
-
export type ColorChannel =
|
|
28
|
-
| 'hue'
|
|
29
|
-
| 'saturation'
|
|
30
|
-
| 'brightness'
|
|
31
|
-
| 'lightness'
|
|
32
|
-
| 'red'
|
|
33
|
-
| 'green'
|
|
34
|
-
| 'blue'
|
|
35
|
-
| 'alpha';
|
|
36
|
-
|
|
37
|
-
/**
|
|
38
|
-
* Range for a color channel.
|
|
39
|
-
*/
|
|
40
|
-
export interface ColorChannelRange {
|
|
41
|
-
/** Minimum value. */
|
|
42
|
-
minValue: number;
|
|
43
|
-
/** Maximum value. */
|
|
44
|
-
maxValue: number;
|
|
45
|
-
/** Step for keyboard increment. */
|
|
46
|
-
step: number;
|
|
47
|
-
/** Page step for larger increments. */
|
|
48
|
-
pageSize: number;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
/**
|
|
52
|
-
* Color axes for a color space.
|
|
53
|
-
*/
|
|
54
|
-
export interface ColorAxes {
|
|
55
|
-
/** X-axis channel. */
|
|
56
|
-
xChannel: ColorChannel;
|
|
57
|
-
/** Y-axis channel. */
|
|
58
|
-
yChannel: ColorChannel;
|
|
59
|
-
/** Z-axis channel (the one not on x or y). */
|
|
60
|
-
zChannel: ColorChannel;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
/**
|
|
64
|
-
* Color interface representing a color value.
|
|
65
|
-
*/
|
|
66
|
-
export interface Color {
|
|
67
|
-
/** Convert to a different format. */
|
|
68
|
-
toFormat(format: ColorFormat): Color;
|
|
69
|
-
/** Convert to a CSS string. */
|
|
70
|
-
toString(format?: ColorFormat | 'css'): string;
|
|
71
|
-
/** Clone this color. */
|
|
72
|
-
clone(): Color;
|
|
73
|
-
/** Get the hex value as an integer. */
|
|
74
|
-
toHexInt(): number;
|
|
75
|
-
/** Get the value of a specific channel. */
|
|
76
|
-
getChannelValue(channel: ColorChannel): number;
|
|
77
|
-
/** Create a new color with a channel value changed. */
|
|
78
|
-
withChannelValue(channel: ColorChannel, value: number): Color;
|
|
79
|
-
/** Get the range for a channel. */
|
|
80
|
-
getChannelRange(channel: ColorChannel): ColorChannelRange;
|
|
81
|
-
/** Get the localized name of a channel. */
|
|
82
|
-
getChannelName(channel: ColorChannel, locale: string): string;
|
|
83
|
-
/** Get the format options for a channel. */
|
|
84
|
-
getChannelFormatOptions(channel: ColorChannel): Intl.NumberFormatOptions;
|
|
85
|
-
/** Format the value of a channel. */
|
|
86
|
-
formatChannelValue(channel: ColorChannel, locale: string): string;
|
|
87
|
-
/** Get the color space. */
|
|
88
|
-
getColorSpace(): ColorSpace;
|
|
89
|
-
/** Get the axes for a color space. */
|
|
90
|
-
getColorSpaceAxes(xyChannels?: { xChannel?: ColorChannel; yChannel?: ColorChannel }): ColorAxes;
|
|
91
|
-
/** Get all channels for this color space. */
|
|
92
|
-
getColorChannels(): [ColorChannel, ColorChannel, ColorChannel];
|
|
93
|
-
/** Get a human-readable color name. */
|
|
94
|
-
getColorName(locale: string): string;
|
|
95
|
-
/** Get the hue name (e.g., "red", "blue"). */
|
|
96
|
-
getHueName(locale: string): string;
|
|
97
|
-
}
|
|
98
|
-
|
|
99
|
-
/**
|
|
100
|
-
* RGB color value.
|
|
101
|
-
*/
|
|
102
|
-
export interface RGBColor {
|
|
103
|
-
red: number;
|
|
104
|
-
green: number;
|
|
105
|
-
blue: number;
|
|
106
|
-
alpha: number;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
/**
|
|
110
|
-
* HSL color value.
|
|
111
|
-
*/
|
|
112
|
-
export interface HSLColor {
|
|
113
|
-
hue: number;
|
|
114
|
-
saturation: number;
|
|
115
|
-
lightness: number;
|
|
116
|
-
alpha: number;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
/**
|
|
120
|
-
* HSB color value.
|
|
121
|
-
*/
|
|
122
|
-
export interface HSBColor {
|
|
123
|
-
hue: number;
|
|
124
|
-
saturation: number;
|
|
125
|
-
brightness: number;
|
|
126
|
-
alpha: number;
|
|
127
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"createComboBoxState.d.ts","sourceRoot":"","sources":["createComboBoxState.ts"],"names":[],"mappings":"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"}
|