@proyecto-viviana/solid-stately 0.2.4 → 0.2.7
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/LICENSE +21 -0
- package/dist/autocomplete/createAutocompleteState.d.ts +2 -1
- package/dist/checkbox/createCheckboxGroupState.d.ts +10 -1
- package/dist/collections/types.d.ts +11 -0
- package/dist/color/getColorChannels.d.ts +20 -0
- package/dist/data/createAsyncList.d.ts +111 -0
- package/dist/data/createListData.d.ts +65 -0
- package/dist/data/createTreeData.d.ts +61 -0
- package/dist/data/index.d.ts +3 -0
- package/dist/datepicker/index.d.ts +10 -0
- package/dist/grid/types.d.ts +5 -1
- package/dist/index.d.ts +6 -1
- package/dist/index.js +3737 -2697
- package/dist/index.js.map +1 -7
- package/dist/menu/index.d.ts +8 -0
- package/dist/radio/createRadioGroupState.d.ts +10 -1
- package/dist/select/createSelectState.d.ts +17 -0
- package/dist/selection/index.d.ts +11 -0
- package/dist/toast/createToastState.d.ts +7 -1
- package/dist/toggle/createToggleGroupState.d.ts +45 -0
- package/dist/toggle/index.d.ts +1 -0
- package/dist/tree/TreeCollection.d.ts +3 -2
- package/package.json +6 -5
- package/src/autocomplete/createAutocompleteState.ts +10 -11
- package/src/calendar/createDateFieldState.ts +24 -1
- package/src/checkbox/createCheckboxGroupState.ts +42 -6
- package/src/collections/ListCollection.ts +152 -146
- package/src/collections/createListState.ts +266 -264
- package/src/collections/createMenuState.ts +106 -106
- package/src/collections/createSelectionState.ts +336 -336
- package/src/collections/index.ts +46 -46
- package/src/collections/types.ts +181 -169
- package/src/color/Color.ts +951 -951
- package/src/color/createColorAreaState.ts +293 -293
- package/src/color/createColorFieldState.ts +292 -292
- package/src/color/createColorSliderState.ts +241 -241
- package/src/color/createColorWheelState.ts +211 -211
- package/src/color/getColorChannels.ts +34 -0
- package/src/color/index.ts +47 -47
- package/src/color/types.ts +127 -127
- package/src/combobox/createComboBoxState.ts +703 -703
- package/src/combobox/index.ts +13 -13
- package/src/data/createAsyncList.ts +377 -0
- package/src/data/createListData.ts +298 -0
- package/src/data/createTreeData.ts +433 -0
- package/src/data/index.ts +25 -0
- package/src/datepicker/index.ts +36 -0
- package/src/disclosure/createDisclosureState.ts +4 -4
- package/src/dnd/createDragState.ts +153 -153
- package/src/dnd/createDraggableCollectionState.ts +165 -165
- package/src/dnd/createDropState.ts +212 -212
- package/src/dnd/createDroppableCollectionState.ts +357 -357
- package/src/dnd/index.ts +76 -76
- package/src/dnd/types.ts +317 -317
- package/src/form/createFormValidationState.ts +389 -389
- package/src/form/index.ts +15 -15
- package/src/grid/types.ts +5 -0
- package/src/index.ts +49 -0
- package/src/menu/index.ts +19 -0
- package/src/numberfield/createNumberFieldState.ts +427 -383
- package/src/numberfield/index.ts +5 -5
- package/src/overlays/createOverlayTriggerState.ts +67 -67
- package/src/overlays/index.ts +5 -5
- package/src/radio/createRadioGroupState.ts +44 -6
- package/src/searchfield/createSearchFieldState.ts +62 -62
- package/src/searchfield/index.ts +5 -5
- package/src/select/createSelectState.ts +290 -181
- package/src/select/index.ts +5 -5
- package/src/selection/index.ts +28 -0
- package/src/slider/createSliderState.ts +211 -211
- package/src/slider/index.ts +6 -6
- package/src/tabs/createTabListState.ts +37 -11
- package/src/toast/createToastState.d.ts +6 -1
- package/src/toast/createToastState.ts +8 -1
- package/src/toggle/createToggleGroupState.ts +127 -0
- package/src/toggle/index.ts +6 -0
- package/src/tooltip/createTooltipTriggerState.ts +183 -183
- package/src/tooltip/index.ts +6 -6
- package/src/tree/TreeCollection.ts +208 -175
- package/src/tree/createTreeState.ts +392 -392
- package/src/tree/index.ts +13 -13
- package/src/tree/types.ts +174 -174
|
@@ -1,106 +1,106 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* State management for menu components.
|
|
3
|
-
* Based on @react-stately/menu.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
import { access, type MaybeAccessor } from '../utils';
|
|
7
|
-
import { createListState, type ListState, type ListStateProps } from './createListState';
|
|
8
|
-
import type { Key } from './types';
|
|
9
|
-
|
|
10
|
-
export interface MenuStateProps<T = unknown>
|
|
11
|
-
extends Omit<ListStateProps<T>, 'selectionMode' | 'disallowEmptySelection'> {
|
|
12
|
-
/** Handler called when an item is activated (pressed). */
|
|
13
|
-
onAction?: (key: Key) => void;
|
|
14
|
-
/** Handler called when the menu should close. */
|
|
15
|
-
onClose?: () => void;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export interface MenuState<T = unknown> extends ListState<T> {
|
|
19
|
-
/** Close the menu. */
|
|
20
|
-
close(): void;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Creates state for a menu component.
|
|
25
|
-
* Menus are single-select lists that support actions.
|
|
26
|
-
*/
|
|
27
|
-
export function createMenuState<T = unknown>(
|
|
28
|
-
props: MaybeAccessor<MenuStateProps<T>>
|
|
29
|
-
): MenuState<T> {
|
|
30
|
-
const getProps = () => access(props);
|
|
31
|
-
|
|
32
|
-
// Create list state with single selection
|
|
33
|
-
const listState = createListState<T>({
|
|
34
|
-
get items() {
|
|
35
|
-
return getProps().items;
|
|
36
|
-
},
|
|
37
|
-
get getKey() {
|
|
38
|
-
return getProps().getKey;
|
|
39
|
-
},
|
|
40
|
-
get getTextValue() {
|
|
41
|
-
return getProps().getTextValue;
|
|
42
|
-
},
|
|
43
|
-
get getDisabled() {
|
|
44
|
-
return getProps().getDisabled;
|
|
45
|
-
},
|
|
46
|
-
get disabledKeys() {
|
|
47
|
-
return getProps().disabledKeys;
|
|
48
|
-
},
|
|
49
|
-
get disabledBehavior() {
|
|
50
|
-
return getProps().disabledBehavior;
|
|
51
|
-
},
|
|
52
|
-
selectionMode: 'none', // Menus typically use onAction, not selection
|
|
53
|
-
disallowEmptySelection: true,
|
|
54
|
-
get selectedKeys() {
|
|
55
|
-
return getProps().selectedKeys;
|
|
56
|
-
},
|
|
57
|
-
get defaultSelectedKeys() {
|
|
58
|
-
return getProps().defaultSelectedKeys;
|
|
59
|
-
},
|
|
60
|
-
get onSelectionChange() {
|
|
61
|
-
return getProps().onSelectionChange;
|
|
62
|
-
},
|
|
63
|
-
get selectionBehavior() {
|
|
64
|
-
return getProps().selectionBehavior;
|
|
65
|
-
},
|
|
66
|
-
});
|
|
67
|
-
|
|
68
|
-
const close = () => {
|
|
69
|
-
getProps().onClose?.();
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
return {
|
|
73
|
-
...listState,
|
|
74
|
-
close,
|
|
75
|
-
};
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
export interface MenuTriggerStateProps {
|
|
79
|
-
/** Whether the menu is open (controlled). */
|
|
80
|
-
isOpen?: boolean;
|
|
81
|
-
/** Default open state (uncontrolled). */
|
|
82
|
-
defaultOpen?: boolean;
|
|
83
|
-
/** Handler called when the open state changes. */
|
|
84
|
-
onOpenChange?: (isOpen: boolean) => void;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
export interface MenuTriggerState {
|
|
88
|
-
/** Whether the menu is open. */
|
|
89
|
-
readonly isOpen: () => boolean;
|
|
90
|
-
/** Open the menu. */
|
|
91
|
-
open(): void;
|
|
92
|
-
/** Close the menu. */
|
|
93
|
-
close(): void;
|
|
94
|
-
/** Toggle the menu. */
|
|
95
|
-
toggle(): void;
|
|
96
|
-
/** Focus strategy for when the menu opens. */
|
|
97
|
-
readonly focusStrategy: () => 'first' | 'last' | null;
|
|
98
|
-
/** Set the focus strategy. */
|
|
99
|
-
setFocusStrategy(strategy: 'first' | 'last' | null): void;
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
/**
|
|
103
|
-
* Creates state for a menu trigger (button that opens a menu).
|
|
104
|
-
* This is essentially the same as overlay trigger state but with focus strategy.
|
|
105
|
-
*/
|
|
106
|
-
export { createOverlayTriggerState as createMenuTriggerState } from '../overlays';
|
|
1
|
+
/**
|
|
2
|
+
* State management for menu components.
|
|
3
|
+
* Based on @react-stately/menu.
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
import { access, type MaybeAccessor } from '../utils';
|
|
7
|
+
import { createListState, type ListState, type ListStateProps } from './createListState';
|
|
8
|
+
import type { Key } from './types';
|
|
9
|
+
|
|
10
|
+
export interface MenuStateProps<T = unknown>
|
|
11
|
+
extends Omit<ListStateProps<T>, 'selectionMode' | 'disallowEmptySelection'> {
|
|
12
|
+
/** Handler called when an item is activated (pressed). */
|
|
13
|
+
onAction?: (key: Key) => void;
|
|
14
|
+
/** Handler called when the menu should close. */
|
|
15
|
+
onClose?: () => void;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
export interface MenuState<T = unknown> extends ListState<T> {
|
|
19
|
+
/** Close the menu. */
|
|
20
|
+
close(): void;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* Creates state for a menu component.
|
|
25
|
+
* Menus are single-select lists that support actions.
|
|
26
|
+
*/
|
|
27
|
+
export function createMenuState<T = unknown>(
|
|
28
|
+
props: MaybeAccessor<MenuStateProps<T>>
|
|
29
|
+
): MenuState<T> {
|
|
30
|
+
const getProps = () => access(props);
|
|
31
|
+
|
|
32
|
+
// Create list state with single selection
|
|
33
|
+
const listState = createListState<T>({
|
|
34
|
+
get items() {
|
|
35
|
+
return getProps().items;
|
|
36
|
+
},
|
|
37
|
+
get getKey() {
|
|
38
|
+
return getProps().getKey;
|
|
39
|
+
},
|
|
40
|
+
get getTextValue() {
|
|
41
|
+
return getProps().getTextValue;
|
|
42
|
+
},
|
|
43
|
+
get getDisabled() {
|
|
44
|
+
return getProps().getDisabled;
|
|
45
|
+
},
|
|
46
|
+
get disabledKeys() {
|
|
47
|
+
return getProps().disabledKeys;
|
|
48
|
+
},
|
|
49
|
+
get disabledBehavior() {
|
|
50
|
+
return getProps().disabledBehavior;
|
|
51
|
+
},
|
|
52
|
+
selectionMode: 'none', // Menus typically use onAction, not selection
|
|
53
|
+
disallowEmptySelection: true,
|
|
54
|
+
get selectedKeys() {
|
|
55
|
+
return getProps().selectedKeys;
|
|
56
|
+
},
|
|
57
|
+
get defaultSelectedKeys() {
|
|
58
|
+
return getProps().defaultSelectedKeys;
|
|
59
|
+
},
|
|
60
|
+
get onSelectionChange() {
|
|
61
|
+
return getProps().onSelectionChange;
|
|
62
|
+
},
|
|
63
|
+
get selectionBehavior() {
|
|
64
|
+
return getProps().selectionBehavior;
|
|
65
|
+
},
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
const close = () => {
|
|
69
|
+
getProps().onClose?.();
|
|
70
|
+
};
|
|
71
|
+
|
|
72
|
+
return {
|
|
73
|
+
...listState,
|
|
74
|
+
close,
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
export interface MenuTriggerStateProps {
|
|
79
|
+
/** Whether the menu is open (controlled). */
|
|
80
|
+
isOpen?: boolean;
|
|
81
|
+
/** Default open state (uncontrolled). */
|
|
82
|
+
defaultOpen?: boolean;
|
|
83
|
+
/** Handler called when the open state changes. */
|
|
84
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
export interface MenuTriggerState {
|
|
88
|
+
/** Whether the menu is open. */
|
|
89
|
+
readonly isOpen: () => boolean;
|
|
90
|
+
/** Open the menu. */
|
|
91
|
+
open(): void;
|
|
92
|
+
/** Close the menu. */
|
|
93
|
+
close(): void;
|
|
94
|
+
/** Toggle the menu. */
|
|
95
|
+
toggle(): void;
|
|
96
|
+
/** Focus strategy for when the menu opens. */
|
|
97
|
+
readonly focusStrategy: () => 'first' | 'last' | null;
|
|
98
|
+
/** Set the focus strategy. */
|
|
99
|
+
setFocusStrategy(strategy: 'first' | 'last' | null): void;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
/**
|
|
103
|
+
* Creates state for a menu trigger (button that opens a menu).
|
|
104
|
+
* This is essentially the same as overlay trigger state but with focus strategy.
|
|
105
|
+
*/
|
|
106
|
+
export { createOverlayTriggerState as createMenuTriggerState } from '../overlays';
|