@proyecto-viviana/solid-stately 0.2.4 → 0.3.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.
- package/LICENSE +21 -0
- package/README.md +30 -283
- package/dist/autocomplete/createAutocompleteState.d.ts +3 -2
- package/dist/autocomplete/index.d.ts +1 -1
- package/dist/calendar/createCalendarState.d.ts +22 -7
- package/dist/calendar/createDateFieldState.d.ts +30 -7
- package/dist/calendar/createDatePickerState.d.ts +60 -0
- package/dist/calendar/createRangeCalendarState.d.ts +27 -8
- package/dist/calendar/createTimeFieldState.d.ts +34 -7
- package/dist/calendar/index.d.ts +7 -6
- package/dist/checkbox/createCheckboxGroupState.d.ts +12 -3
- package/dist/checkbox/index.d.ts +1 -1
- package/dist/collections/ListCollection.d.ts +1 -1
- package/dist/collections/createListState.d.ts +8 -8
- package/dist/collections/createMenuState.d.ts +7 -7
- package/dist/collections/createSelectionState.d.ts +5 -5
- package/dist/collections/index.d.ts +5 -5
- package/dist/collections/types.d.ts +23 -12
- package/dist/color/Color.d.ts +1 -1
- package/dist/color/createColorAreaState.d.ts +4 -2
- package/dist/color/createColorFieldState.d.ts +38 -12
- package/dist/color/createColorSliderState.d.ts +9 -2
- package/dist/color/createColorWheelState.d.ts +13 -2
- package/dist/color/getColorChannels.d.ts +20 -0
- package/dist/color/index.d.ts +6 -6
- package/dist/color/types.d.ts +4 -4
- package/dist/combobox/createComboBoxState.d.ts +27 -13
- package/dist/combobox/index.d.ts +1 -1
- package/dist/data/createAsyncList.d.ts +111 -0
- package/dist/data/createListData.d.ts +65 -0
- package/dist/data/createTreeData.d.ts +65 -0
- package/dist/data/index.d.ts +3 -0
- package/dist/datepicker/index.d.ts +8 -0
- package/dist/disclosure/createDisclosureState.d.ts +2 -2
- package/dist/disclosure/index.d.ts +1 -1
- package/dist/dnd/createDragState.d.ts +2 -2
- package/dist/dnd/createDraggableCollectionState.d.ts +2 -2
- package/dist/dnd/createDropState.d.ts +2 -2
- package/dist/dnd/createDroppableCollectionState.d.ts +3 -3
- package/dist/dnd/index.d.ts +5 -5
- package/dist/dnd/types.d.ts +16 -16
- package/dist/form/createFormValidationState.d.ts +3 -3
- package/dist/form/index.d.ts +1 -1
- package/dist/grid/createGridState.d.ts +2 -2
- package/dist/grid/index.d.ts +2 -2
- package/dist/grid/types.d.ts +17 -11
- package/dist/index.d.ts +31 -25
- package/dist/index.js +7990 -6264
- package/dist/index.js.map +1 -7
- package/dist/menu/index.d.ts +8 -0
- package/dist/numberfield/createNumberFieldState.d.ts +2 -2
- package/dist/numberfield/index.d.ts +1 -1
- package/dist/overlays/createOverlayTriggerState.d.ts +2 -2
- package/dist/overlays/index.d.ts +1 -1
- package/dist/radio/createRadioGroupState.d.ts +13 -4
- package/dist/radio/index.d.ts +1 -1
- package/dist/searchfield/createSearchFieldState.d.ts +2 -2
- package/dist/searchfield/index.d.ts +2 -2
- package/dist/select/createSelectState.d.ts +20 -3
- package/dist/select/index.d.ts +1 -1
- package/dist/selection/index.d.ts +11 -0
- package/dist/slider/createSliderState.d.ts +3 -3
- package/dist/slider/index.d.ts +2 -2
- package/dist/steplist/createStepListState.d.ts +48 -0
- package/dist/steplist/index.d.ts +1 -0
- package/dist/table/TableCollection.d.ts +3 -3
- package/dist/table/createTableColumnResizeState.d.ts +54 -0
- package/dist/table/createTableState.d.ts +2 -2
- package/dist/table/index.d.ts +5 -3
- package/dist/table/types.d.ts +10 -10
- package/dist/tabs/createTabListState.d.ts +5 -5
- package/dist/tabs/index.d.ts +1 -1
- package/dist/textfield/createTextFieldState.d.ts +2 -2
- package/dist/textfield/index.d.ts +1 -1
- package/dist/toast/createToastState.d.ts +15 -3
- package/dist/toast/index.d.ts +1 -1
- package/dist/toggle/createToggleGroupState.d.ts +45 -0
- package/dist/toggle/createToggleState.d.ts +2 -2
- package/dist/toggle/index.d.ts +2 -1
- package/dist/tooltip/createTooltipTriggerState.d.ts +2 -2
- package/dist/tooltip/index.d.ts +1 -1
- package/dist/tree/TreeCollection.d.ts +5 -4
- package/dist/tree/createTreeState.d.ts +2 -2
- package/dist/tree/index.d.ts +3 -3
- package/dist/tree/types.d.ts +19 -13
- package/dist/utils/index.d.ts +1 -1
- package/dist/utils/reactivity.d.ts +1 -1
- package/package.json +30 -30
- package/src/autocomplete/createAutocompleteState.d.ts +19 -17
- package/src/autocomplete/createAutocompleteState.ts +25 -32
- package/src/autocomplete/index.d.ts +6 -2
- package/src/autocomplete/index.ts +1 -1
- package/src/calendar/createCalendarState.d.ts +139 -117
- package/src/calendar/createCalendarState.ts +221 -74
- package/src/calendar/createDateFieldState.d.ts +130 -95
- package/src/calendar/createDateFieldState.ts +286 -151
- package/src/calendar/createDatePickerState.ts +347 -0
- package/src/calendar/createRangeCalendarState.d.ts +154 -129
- package/src/calendar/createRangeCalendarState.ts +293 -79
- package/src/calendar/createTimeFieldState.d.ts +81 -79
- package/src/calendar/createTimeFieldState.ts +187 -108
- package/src/calendar/index.d.ts +80 -7
- package/src/calendar/index.ts +21 -12
- package/src/checkbox/createCheckboxGroupState.d.ts +57 -55
- package/src/checkbox/createCheckboxGroupState.ts +57 -30
- package/src/checkbox/index.d.ts +6 -2
- package/src/checkbox/index.ts +1 -1
- package/src/collections/ListCollection.d.ts +25 -22
- package/src/collections/ListCollection.ts +152 -146
- package/src/collections/createListState.d.ts +73 -58
- package/src/collections/createListState.ts +267 -264
- package/src/collections/createMenuState.d.ts +36 -31
- package/src/collections/createMenuState.ts +112 -106
- package/src/collections/createSelectionState.d.ts +78 -65
- package/src/collections/createSelectionState.ts +340 -336
- package/src/collections/index.d.ts +38 -6
- package/src/collections/index.ts +41 -46
- package/src/collections/types.d.ts +101 -101
- package/src/collections/types.ts +181 -169
- package/src/color/Color.d.ts +20 -5
- package/src/color/Color.ts +1054 -951
- package/src/color/createColorAreaState.d.ts +67 -65
- package/src/color/createColorAreaState.ts +301 -293
- package/src/color/createColorFieldState.d.ts +46 -44
- package/src/color/createColorFieldState.ts +428 -292
- package/src/color/createColorSliderState.d.ts +58 -56
- package/src/color/createColorSliderState.ts +272 -241
- package/src/color/createColorWheelState.d.ts +42 -40
- package/src/color/createColorWheelState.ts +248 -211
- package/src/color/getColorChannels.ts +36 -0
- package/src/color/index.d.ts +36 -7
- package/src/color/index.ts +44 -47
- package/src/color/types.d.ts +68 -63
- package/src/color/types.ts +119 -127
- package/src/combobox/createComboBoxState.d.ts +107 -105
- package/src/combobox/createComboBoxState.ts +790 -703
- package/src/combobox/index.d.ts +10 -2
- package/src/combobox/index.ts +13 -13
- package/src/data/createAsyncList.ts +403 -0
- package/src/data/createListData.ts +298 -0
- package/src/data/createTreeData.ts +646 -0
- package/src/data/index.ts +25 -0
- package/src/datepicker/index.ts +32 -0
- package/src/disclosure/createDisclosureState.d.ts +47 -43
- package/src/disclosure/createDisclosureState.ts +9 -23
- package/src/disclosure/index.d.ts +10 -2
- package/src/disclosure/index.ts +1 -1
- package/src/dnd/createDragState.d.ts +51 -42
- package/src/dnd/createDragState.ts +151 -153
- package/src/dnd/createDraggableCollectionState.d.ts +52 -41
- package/src/dnd/createDraggableCollectionState.ts +158 -165
- package/src/dnd/createDropState.d.ts +64 -45
- package/src/dnd/createDropState.ts +202 -212
- package/src/dnd/createDroppableCollectionState.d.ts +88 -59
- package/src/dnd/createDroppableCollectionState.ts +354 -357
- package/src/dnd/index.d.ts +54 -6
- package/src/dnd/index.ts +63 -76
- package/src/dnd/types.d.ts +167 -156
- package/src/dnd/types.ts +316 -317
- package/src/form/createFormValidationState.d.ts +47 -45
- package/src/form/createFormValidationState.ts +356 -389
- package/src/form/index.d.ts +16 -2
- package/src/form/index.ts +15 -15
- package/src/grid/createGridState.d.ts +7 -4
- package/src/grid/createGridState.ts +44 -51
- package/src/grid/index.d.ts +3 -3
- package/src/grid/index.ts +2 -8
- package/src/grid/types.d.ts +136 -129
- package/src/grid/types.ts +24 -17
- package/src/index.d.ts +310 -26
- package/src/index.ts +87 -79
- package/src/menu/index.ts +17 -0
- package/src/numberfield/createNumberFieldState.d.ts +56 -54
- package/src/numberfield/createNumberFieldState.ts +422 -383
- package/src/numberfield/index.d.ts +6 -2
- package/src/numberfield/index.ts +5 -5
- package/src/overlays/createOverlayTriggerState.d.ts +22 -20
- package/src/overlays/createOverlayTriggerState.ts +66 -67
- package/src/overlays/index.d.ts +6 -2
- package/src/overlays/index.ts +5 -5
- package/src/radio/createRadioGroupState.d.ts +54 -52
- package/src/radio/createRadioGroupState.ts +66 -30
- package/src/radio/index.d.ts +7 -2
- package/src/radio/index.ts +1 -1
- package/src/searchfield/createSearchFieldState.d.ts +16 -14
- package/src/searchfield/createSearchFieldState.ts +56 -62
- package/src/searchfield/index.d.ts +3 -3
- package/src/searchfield/index.ts +2 -5
- package/src/select/createSelectState.d.ts +63 -61
- package/src/select/createSelectState.ts +290 -181
- package/src/select/index.d.ts +2 -2
- package/src/select/index.ts +1 -5
- package/src/selection/index.ts +27 -0
- package/src/slider/createSliderState.d.ts +60 -60
- package/src/slider/createSliderState.ts +233 -211
- package/src/slider/index.d.ts +3 -3
- package/src/slider/index.ts +2 -6
- package/src/ssr/index.d.ts +1 -1
- package/src/ssr/index.ts +2 -2
- package/src/steplist/createStepListState.ts +191 -0
- package/src/steplist/index.ts +5 -0
- package/src/table/TableCollection.d.ts +42 -40
- package/src/table/TableCollection.ts +61 -64
- package/src/table/createTableColumnResizeState.ts +242 -0
- package/src/table/createTableState.d.ts +7 -4
- package/src/table/createTableState.ts +10 -7
- package/src/table/index.d.ts +14 -4
- package/src/table/index.ts +10 -3
- package/src/table/types.d.ts +98 -92
- package/src/table/types.ts +17 -13
- package/src/tabs/createTabListState.d.ts +59 -57
- package/src/tabs/createTabListState.ts +58 -39
- package/src/tabs/index.d.ts +8 -2
- package/src/tabs/index.ts +1 -1
- package/src/textfield/createTextFieldState.d.ts +16 -14
- package/src/textfield/createTextFieldState.ts +7 -18
- package/src/textfield/index.d.ts +6 -2
- package/src/textfield/index.ts +1 -1
- package/src/toast/createToastState.d.ts +92 -81
- package/src/toast/createToastState.ts +56 -44
- package/src/toast/index.d.ts +12 -2
- package/src/toast/index.ts +1 -1
- package/src/toggle/createToggleGroupState.ts +117 -0
- package/src/toggle/createToggleState.d.ts +19 -19
- package/src/toggle/createToggleState.ts +2 -16
- package/src/toggle/index.d.ts +2 -2
- package/src/toggle/index.ts +6 -4
- package/src/tooltip/createTooltipTriggerState.d.ts +17 -17
- package/src/tooltip/createTooltipTriggerState.ts +184 -183
- package/src/tooltip/index.d.ts +7 -2
- package/src/tooltip/index.ts +6 -6
- package/src/tree/TreeCollection.d.ts +26 -23
- package/src/tree/TreeCollection.ts +215 -175
- package/src/tree/createTreeState.d.ts +7 -4
- package/src/tree/createTreeState.ts +390 -392
- package/src/tree/index.d.ts +10 -4
- package/src/tree/index.ts +13 -13
- package/src/tree/types.d.ts +131 -126
- package/src/tree/types.ts +183 -174
- package/src/utils/index.d.ts +2 -2
- package/src/utils/index.ts +1 -1
- package/src/utils/reactivity.d.ts +2 -2
- package/src/utils/reactivity.ts +3 -3
package/src/form/index.d.ts
CHANGED
|
@@ -1,2 +1,16 @@
|
|
|
1
|
-
export {
|
|
2
|
-
|
|
1
|
+
export {
|
|
2
|
+
createFormValidationState,
|
|
3
|
+
mergeValidation,
|
|
4
|
+
FormValidationContext,
|
|
5
|
+
privateValidationStateProp,
|
|
6
|
+
VALID_VALIDITY_STATE,
|
|
7
|
+
DEFAULT_VALIDATION_RESULT,
|
|
8
|
+
type FormValidationState,
|
|
9
|
+
type FormValidationProps,
|
|
10
|
+
type ValidationResult,
|
|
11
|
+
type ValidationErrors,
|
|
12
|
+
type ValidationFunction,
|
|
13
|
+
type ValidationBehavior,
|
|
14
|
+
type ValidityState,
|
|
15
|
+
} from "./createFormValidationState";
|
|
16
|
+
//# sourceMappingURL=index.d.ts.map
|
package/src/form/index.ts
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
export {
|
|
2
|
-
createFormValidationState,
|
|
3
|
-
mergeValidation,
|
|
4
|
-
FormValidationContext,
|
|
5
|
-
privateValidationStateProp,
|
|
6
|
-
VALID_VALIDITY_STATE,
|
|
7
|
-
DEFAULT_VALIDATION_RESULT,
|
|
8
|
-
type FormValidationState,
|
|
9
|
-
type FormValidationProps,
|
|
10
|
-
type ValidationResult,
|
|
11
|
-
type ValidationErrors,
|
|
12
|
-
type ValidationFunction,
|
|
13
|
-
type ValidationBehavior,
|
|
14
|
-
type ValidityState,
|
|
15
|
-
} from
|
|
1
|
+
export {
|
|
2
|
+
createFormValidationState,
|
|
3
|
+
mergeValidation,
|
|
4
|
+
FormValidationContext,
|
|
5
|
+
privateValidationStateProp,
|
|
6
|
+
VALID_VALIDITY_STATE,
|
|
7
|
+
DEFAULT_VALIDATION_RESULT,
|
|
8
|
+
type FormValidationState,
|
|
9
|
+
type FormValidationProps,
|
|
10
|
+
type ValidationResult,
|
|
11
|
+
type ValidationErrors,
|
|
12
|
+
type ValidationFunction,
|
|
13
|
+
type ValidationBehavior,
|
|
14
|
+
type ValidityState,
|
|
15
|
+
} from "./createFormValidationState";
|
|
@@ -2,11 +2,14 @@
|
|
|
2
2
|
* Grid state management for Table and GridList components.
|
|
3
3
|
* Based on @react-stately/grid/useGridState.
|
|
4
4
|
*/
|
|
5
|
-
import { type Accessor } from
|
|
6
|
-
import type { GridState, GridStateOptions, GridCollection } from
|
|
5
|
+
import { type Accessor } from "solid-js";
|
|
6
|
+
import type { GridState, GridStateOptions, GridCollection } from "./types";
|
|
7
7
|
/**
|
|
8
8
|
* Creates state management for a grid component.
|
|
9
9
|
* Handles row selection, focus management, and keyboard navigation state.
|
|
10
10
|
*/
|
|
11
|
-
export declare function createGridState<
|
|
12
|
-
|
|
11
|
+
export declare function createGridState<
|
|
12
|
+
T extends object,
|
|
13
|
+
C extends GridCollection<T> = GridCollection<T>,
|
|
14
|
+
>(options: Accessor<GridStateOptions<T, C>>): GridState<T, C>;
|
|
15
|
+
//# sourceMappingURL=createGridState.d.ts.map
|
|
@@ -3,43 +3,34 @@
|
|
|
3
3
|
* Based on @react-stately/grid/useGridState.
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
-
import { createSignal, createEffect, createMemo, on, type Accessor } from
|
|
7
|
-
import type {
|
|
8
|
-
|
|
9
|
-
GridStateOptions,
|
|
10
|
-
GridCollection,
|
|
11
|
-
GridNode,
|
|
12
|
-
} from './types';
|
|
13
|
-
import type { Key, FocusStrategy } from '../collections/types';
|
|
6
|
+
import { createSignal, createEffect, createMemo, on, type Accessor } from "solid-js";
|
|
7
|
+
import type { GridState, GridStateOptions, GridCollection, GridNode } from "./types";
|
|
8
|
+
import type { Key, FocusStrategy } from "../collections/types";
|
|
14
9
|
|
|
15
10
|
/**
|
|
16
11
|
* Creates state management for a grid component.
|
|
17
12
|
* Handles row selection, focus management, and keyboard navigation state.
|
|
18
13
|
*/
|
|
19
14
|
export function createGridState<T extends object, C extends GridCollection<T> = GridCollection<T>>(
|
|
20
|
-
options: Accessor<GridStateOptions<T, C
|
|
15
|
+
options: Accessor<GridStateOptions<T, C>>,
|
|
21
16
|
): GridState<T, C> {
|
|
22
17
|
const getOptions = () => options();
|
|
23
18
|
|
|
24
|
-
// Disabled keys as a Set
|
|
25
19
|
const disabledKeys = createMemo(() => {
|
|
26
20
|
const keys = getOptions().disabledKeys;
|
|
27
21
|
return keys ? new Set(keys) : new Set<Key>();
|
|
28
22
|
});
|
|
29
23
|
|
|
30
|
-
// Focus state
|
|
31
24
|
const [isFocused, setIsFocused] = createSignal(false);
|
|
32
25
|
const [focusedKey, setFocusedKeyInternal] = createSignal<Key | null>(null);
|
|
33
26
|
const [childFocusStrategy, setChildFocusStrategy] = createSignal<FocusStrategy | null>(null);
|
|
34
27
|
const [isKeyboardNavigationDisabled, setKeyboardNavigationDisabled] = createSignal(false);
|
|
35
28
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
getInitialSelection(getOptions().defaultSelectedKeys)
|
|
29
|
+
const [internalSelectedKeys, setInternalSelectedKeys] = createSignal<"all" | Set<Key>>(
|
|
30
|
+
getInitialSelection(getOptions().defaultSelectedKeys),
|
|
39
31
|
);
|
|
40
32
|
const [anchorKey, setAnchorKey] = createSignal<Key | null>(null);
|
|
41
33
|
|
|
42
|
-
// Computed selection
|
|
43
34
|
const selectedKeys = createMemo(() => {
|
|
44
35
|
const opts = getOptions();
|
|
45
36
|
if (opts.selectedKeys !== undefined) {
|
|
@@ -48,24 +39,22 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
48
39
|
return internalSelectedKeys();
|
|
49
40
|
});
|
|
50
41
|
|
|
51
|
-
const selectionMode = createMemo(() => getOptions().selectionMode ??
|
|
52
|
-
const selectionBehavior = createMemo(() => getOptions().selectionBehavior ??
|
|
42
|
+
const selectionMode = createMemo(() => getOptions().selectionMode ?? "none");
|
|
43
|
+
const selectionBehavior = createMemo(() => getOptions().selectionBehavior ?? "toggle");
|
|
53
44
|
const disallowEmptySelection = createMemo(() => getOptions().disallowEmptySelection ?? false);
|
|
54
45
|
|
|
55
|
-
|
|
56
|
-
const focusMode = createMemo(() => getOptions().focusMode ?? 'row');
|
|
46
|
+
const focusMode = createMemo(() => getOptions().focusMode ?? "row");
|
|
57
47
|
|
|
58
|
-
|
|
59
|
-
const setFocusedKey = (key: Key | null, strategy: FocusStrategy = 'first') => {
|
|
48
|
+
const setFocusedKey = (key: Key | null, strategy: FocusStrategy = "first") => {
|
|
60
49
|
const opts = getOptions();
|
|
61
50
|
const collection = opts.collection;
|
|
62
51
|
|
|
63
52
|
// If focusMode is cell and an item is focused, focus a child cell instead
|
|
64
|
-
if (focusMode() ===
|
|
53
|
+
if (focusMode() === "cell" && key != null) {
|
|
65
54
|
const item = collection.getItem(key);
|
|
66
|
-
if (item?.type ===
|
|
55
|
+
if (item?.type === "item") {
|
|
67
56
|
const children = [...collection.getChildren(key)];
|
|
68
|
-
if (strategy ===
|
|
57
|
+
if (strategy === "last") {
|
|
69
58
|
key = children[children.length - 1]?.key ?? key;
|
|
70
59
|
} else {
|
|
71
60
|
key = children[0]?.key ?? key;
|
|
@@ -86,12 +75,16 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
86
75
|
(collection) => {
|
|
87
76
|
const currentFocusedKey = focusedKey();
|
|
88
77
|
|
|
89
|
-
if (
|
|
78
|
+
if (
|
|
79
|
+
currentFocusedKey != null &&
|
|
80
|
+
cachedCollection &&
|
|
81
|
+
!collection.getItem(currentFocusedKey)
|
|
82
|
+
) {
|
|
90
83
|
// The focused item was deleted, find a new one to focus
|
|
91
84
|
const node = cachedCollection.getItem(currentFocusedKey);
|
|
92
85
|
const parentNode =
|
|
93
86
|
node?.parentKey != null &&
|
|
94
|
-
(node.type ===
|
|
87
|
+
(node.type === "cell" || node.type === "rowheader" || node.type === "column")
|
|
95
88
|
? cachedCollection.getItem(node.parentKey)
|
|
96
89
|
: node;
|
|
97
90
|
|
|
@@ -107,13 +100,13 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
107
100
|
|
|
108
101
|
let index = Math.min(
|
|
109
102
|
diff > 1 ? Math.max(parentNode.index - diff + 1, 0) : parentNode.index,
|
|
110
|
-
rows.length - 1
|
|
103
|
+
rows.length - 1,
|
|
111
104
|
);
|
|
112
105
|
|
|
113
106
|
let newRow: GridNode<T> | null = null;
|
|
114
107
|
while (index >= 0) {
|
|
115
108
|
const row = rows[index];
|
|
116
|
-
if (!disabledKeys().has(row.key) && row.type !==
|
|
109
|
+
if (!disabledKeys().has(row.key) && row.type !== "headerrow") {
|
|
117
110
|
newRow = row;
|
|
118
111
|
break;
|
|
119
112
|
}
|
|
@@ -132,10 +125,7 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
132
125
|
if (newRow) {
|
|
133
126
|
const childNodes = newRow.hasChildNodes ? [...collection.getChildren(newRow.key)] : [];
|
|
134
127
|
const keyToFocus =
|
|
135
|
-
newRow.hasChildNodes &&
|
|
136
|
-
parentNode !== node &&
|
|
137
|
-
node &&
|
|
138
|
-
node.index < childNodes.length
|
|
128
|
+
newRow.hasChildNodes && parentNode !== node && node && node.index < childNodes.length
|
|
139
129
|
? childNodes[node.index].key
|
|
140
130
|
: newRow.key;
|
|
141
131
|
setFocusedKeyInternal(keyToFocus);
|
|
@@ -145,14 +135,14 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
145
135
|
}
|
|
146
136
|
|
|
147
137
|
cachedCollection = collection;
|
|
148
|
-
}
|
|
149
|
-
)
|
|
138
|
+
},
|
|
139
|
+
),
|
|
150
140
|
);
|
|
151
141
|
|
|
152
142
|
// Selection methods
|
|
153
143
|
const isSelected = (key: Key): boolean => {
|
|
154
144
|
const keys = selectedKeys();
|
|
155
|
-
if (keys ===
|
|
145
|
+
if (keys === "all") return true;
|
|
156
146
|
return keys.has(key);
|
|
157
147
|
};
|
|
158
148
|
|
|
@@ -160,7 +150,7 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
160
150
|
return disabledKeys().has(key);
|
|
161
151
|
};
|
|
162
152
|
|
|
163
|
-
const updateSelection = (newSelection:
|
|
153
|
+
const updateSelection = (newSelection: "all" | Set<Key>) => {
|
|
164
154
|
const opts = getOptions();
|
|
165
155
|
|
|
166
156
|
// Controlled mode
|
|
@@ -172,8 +162,8 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
172
162
|
// Uncontrolled mode
|
|
173
163
|
const current = internalSelectedKeys();
|
|
174
164
|
const isDifferent =
|
|
175
|
-
current ===
|
|
176
|
-
newSelection ===
|
|
165
|
+
current === "all" ||
|
|
166
|
+
newSelection === "all" ||
|
|
177
167
|
current.size !== (newSelection as Set<Key>).size ||
|
|
178
168
|
![...current].every((k) => (newSelection as Set<Key>).has(k));
|
|
179
169
|
|
|
@@ -185,11 +175,11 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
185
175
|
|
|
186
176
|
const toggleSelection = (key: Key) => {
|
|
187
177
|
if (isDisabled(key)) return;
|
|
188
|
-
if (selectionMode() ===
|
|
178
|
+
if (selectionMode() === "none") return;
|
|
189
179
|
|
|
190
180
|
const current = selectedKeys();
|
|
191
181
|
|
|
192
|
-
if (selectionMode() ===
|
|
182
|
+
if (selectionMode() === "single") {
|
|
193
183
|
if (isSelected(key) && !disallowEmptySelection()) {
|
|
194
184
|
updateSelection(new Set());
|
|
195
185
|
} else {
|
|
@@ -199,7 +189,7 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
199
189
|
}
|
|
200
190
|
|
|
201
191
|
// Multiple selection
|
|
202
|
-
if (current ===
|
|
192
|
+
if (current === "all") {
|
|
203
193
|
// Can't toggle when all selected without knowing all keys
|
|
204
194
|
return;
|
|
205
195
|
}
|
|
@@ -219,7 +209,7 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
219
209
|
|
|
220
210
|
const replaceSelection = (key: Key) => {
|
|
221
211
|
if (isDisabled(key)) return;
|
|
222
|
-
if (selectionMode() ===
|
|
212
|
+
if (selectionMode() === "none") return;
|
|
223
213
|
|
|
224
214
|
updateSelection(new Set([key]));
|
|
225
215
|
setAnchorKey(key);
|
|
@@ -227,7 +217,7 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
227
217
|
|
|
228
218
|
const extendSelection = (toKey: Key) => {
|
|
229
219
|
if (isDisabled(toKey)) return;
|
|
230
|
-
if (selectionMode() !==
|
|
220
|
+
if (selectionMode() !== "multiple") {
|
|
231
221
|
replaceSelection(toKey);
|
|
232
222
|
return;
|
|
233
223
|
}
|
|
@@ -239,7 +229,7 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
239
229
|
}
|
|
240
230
|
|
|
241
231
|
const collection = getOptions().collection;
|
|
242
|
-
const rows = collection.rows.filter((r) => r.type ===
|
|
232
|
+
const rows = collection.rows.filter((r) => r.type === "item");
|
|
243
233
|
const keys = rows.map((r) => r.key);
|
|
244
234
|
const anchorIndex = keys.indexOf(anchor);
|
|
245
235
|
const toIndex = keys.indexOf(toKey);
|
|
@@ -257,8 +247,8 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
257
247
|
};
|
|
258
248
|
|
|
259
249
|
const selectAll = () => {
|
|
260
|
-
if (selectionMode() !==
|
|
261
|
-
updateSelection(
|
|
250
|
+
if (selectionMode() !== "multiple") return;
|
|
251
|
+
updateSelection("all");
|
|
262
252
|
};
|
|
263
253
|
|
|
264
254
|
const clearSelection = () => {
|
|
@@ -267,9 +257,9 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
267
257
|
};
|
|
268
258
|
|
|
269
259
|
const toggleSelectAll = () => {
|
|
270
|
-
if (selectionMode() !==
|
|
260
|
+
if (selectionMode() !== "multiple") return;
|
|
271
261
|
|
|
272
|
-
if (selectedKeys() ===
|
|
262
|
+
if (selectedKeys() === "all") {
|
|
273
263
|
clearSelection();
|
|
274
264
|
} else {
|
|
275
265
|
selectAll();
|
|
@@ -298,6 +288,9 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
298
288
|
get selectionMode() {
|
|
299
289
|
return selectionMode();
|
|
300
290
|
},
|
|
291
|
+
get selectionBehavior() {
|
|
292
|
+
return selectionBehavior();
|
|
293
|
+
},
|
|
301
294
|
get selectedKeys() {
|
|
302
295
|
return selectedKeys();
|
|
303
296
|
},
|
|
@@ -316,12 +309,12 @@ export function createGridState<T extends object, C extends GridCollection<T> =
|
|
|
316
309
|
}
|
|
317
310
|
|
|
318
311
|
// Helper functions
|
|
319
|
-
function getInitialSelection(defaultKeys?:
|
|
312
|
+
function getInitialSelection(defaultKeys?: "all" | Iterable<Key>): "all" | Set<Key> {
|
|
320
313
|
if (defaultKeys === undefined) return new Set();
|
|
321
314
|
return normalizeSelection(defaultKeys);
|
|
322
315
|
}
|
|
323
316
|
|
|
324
|
-
function normalizeSelection(keys:
|
|
325
|
-
if (keys ===
|
|
317
|
+
function normalizeSelection(keys: "all" | Iterable<Key>): "all" | Set<Key> {
|
|
318
|
+
if (keys === "all") return "all";
|
|
326
319
|
return new Set(keys);
|
|
327
320
|
}
|
package/src/grid/index.d.ts
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
* Grid state management module.
|
|
3
3
|
* Provides state hooks for Table and GridList components.
|
|
4
4
|
*/
|
|
5
|
-
export { createGridState } from
|
|
6
|
-
export type { GridState, GridStateOptions, GridCollection, GridNode, GridNodeType
|
|
7
|
-
//# sourceMappingURL=index.d.ts.map
|
|
5
|
+
export { createGridState } from "./createGridState";
|
|
6
|
+
export type { GridState, GridStateOptions, GridCollection, GridNode, GridNodeType } from "./types";
|
|
7
|
+
//# sourceMappingURL=index.d.ts.map
|
package/src/grid/index.ts
CHANGED
|
@@ -3,11 +3,5 @@
|
|
|
3
3
|
* Provides state hooks for Table and GridList components.
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
-
export { createGridState } from
|
|
7
|
-
export type {
|
|
8
|
-
GridState,
|
|
9
|
-
GridStateOptions,
|
|
10
|
-
GridCollection,
|
|
11
|
-
GridNode,
|
|
12
|
-
GridNodeType,
|
|
13
|
-
} from './types';
|
|
6
|
+
export { createGridState } from "./createGridState";
|
|
7
|
+
export type { GridState, GridStateOptions, GridCollection, GridNode, GridNodeType } from "./types";
|
package/src/grid/types.d.ts
CHANGED
|
@@ -2,155 +2,162 @@
|
|
|
2
2
|
* Grid collection types for Table and GridList components.
|
|
3
3
|
* Based on @react-types/grid.
|
|
4
4
|
*/
|
|
5
|
-
import type { Key, FocusStrategy } from
|
|
5
|
+
import type { Key, FocusStrategy } from "../collections/types";
|
|
6
6
|
/**
|
|
7
7
|
* Represents the type of a grid node.
|
|
8
8
|
*/
|
|
9
|
-
export type GridNodeType =
|
|
9
|
+
export type GridNodeType =
|
|
10
|
+
| "item"
|
|
11
|
+
| "cell"
|
|
12
|
+
| "column"
|
|
13
|
+
| "rowheader"
|
|
14
|
+
| "headerrow"
|
|
15
|
+
| "section"
|
|
16
|
+
| "placeholder";
|
|
10
17
|
/**
|
|
11
18
|
* Represents a node in a grid collection.
|
|
12
19
|
*/
|
|
13
20
|
export interface GridNode<T = unknown> {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
21
|
+
/** The type of grid node. */
|
|
22
|
+
type: GridNodeType;
|
|
23
|
+
/** A unique key for the node. */
|
|
24
|
+
key: Key;
|
|
25
|
+
/** The original value/data for this node. */
|
|
26
|
+
value: T | null;
|
|
27
|
+
/** The text content for accessibility and typeahead. */
|
|
28
|
+
textValue: string;
|
|
29
|
+
/** The rendered content (JSX) - optional for programmatic nodes. */
|
|
30
|
+
rendered?: unknown;
|
|
31
|
+
/** The level of nesting (0 for top-level). */
|
|
32
|
+
level: number;
|
|
33
|
+
/** The index within the parent. */
|
|
34
|
+
index: number;
|
|
35
|
+
/** The key of the parent node, if any. */
|
|
36
|
+
parentKey?: Key | null;
|
|
37
|
+
/** Whether this node has child nodes. */
|
|
38
|
+
hasChildNodes: boolean;
|
|
39
|
+
/** Child nodes (cells for rows, rows for sections). */
|
|
40
|
+
childNodes: GridNode<T>[];
|
|
41
|
+
/** Whether this item is disabled. */
|
|
42
|
+
isDisabled?: boolean;
|
|
43
|
+
/** ARIA label for this node. */
|
|
44
|
+
"aria-label"?: string;
|
|
45
|
+
/** Additional props for the node. */
|
|
46
|
+
props?: Record<string, unknown>;
|
|
47
|
+
/** Column index for cells. */
|
|
48
|
+
column?: number;
|
|
49
|
+
/** Column span for cells. */
|
|
50
|
+
colspan?: number;
|
|
51
|
+
/** Row index. */
|
|
52
|
+
rowIndex?: number;
|
|
53
|
+
/** Whether this row can be expanded (for tree grids). */
|
|
54
|
+
isExpandable?: boolean;
|
|
55
|
+
/** Whether this row is expanded. */
|
|
56
|
+
isExpanded?: boolean;
|
|
50
57
|
}
|
|
51
58
|
/**
|
|
52
59
|
* A collection of grid nodes with grid-specific navigation.
|
|
53
60
|
*/
|
|
54
61
|
export interface GridCollection<T = unknown> {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
62
|
+
/** The number of items in the collection. */
|
|
63
|
+
readonly size: number;
|
|
64
|
+
/** All rows in the grid (including header rows). */
|
|
65
|
+
readonly rows: GridNode<T>[];
|
|
66
|
+
/** All column definitions. */
|
|
67
|
+
readonly columns: GridNode<T>[];
|
|
68
|
+
/** Number of header rows. */
|
|
69
|
+
readonly headerRows: GridNode<T>[];
|
|
70
|
+
/** Number of body rows (excluding headers). */
|
|
71
|
+
readonly rowCount: number;
|
|
72
|
+
/** Number of columns. */
|
|
73
|
+
readonly columnCount: number;
|
|
74
|
+
/** Get all keys in the collection. */
|
|
75
|
+
getKeys(): Iterable<Key>;
|
|
76
|
+
/** Get a node by its key. */
|
|
77
|
+
getItem(key: Key): GridNode<T> | null;
|
|
78
|
+
/** Get a node by index. */
|
|
79
|
+
at(index: number): GridNode<T> | null;
|
|
80
|
+
/** Get the key before the given key. */
|
|
81
|
+
getKeyBefore(key: Key): Key | null;
|
|
82
|
+
/** Get the key after the given key. */
|
|
83
|
+
getKeyAfter(key: Key): Key | null;
|
|
84
|
+
/** Get the first key in the collection. */
|
|
85
|
+
getFirstKey(): Key | null;
|
|
86
|
+
/** Get the last key in the collection. */
|
|
87
|
+
getLastKey(): Key | null;
|
|
88
|
+
/** Get the children of a node. */
|
|
89
|
+
getChildren(key: Key): Iterable<GridNode<T>>;
|
|
90
|
+
/** Get the text value for a key. */
|
|
91
|
+
getTextValue(key: Key): string;
|
|
92
|
+
/** Get a cell by row and column key. */
|
|
93
|
+
getCell(rowKey: Key, columnKey: Key): GridNode<T> | null;
|
|
94
|
+
/** Iterator over all nodes. */
|
|
95
|
+
[Symbol.iterator](): Iterator<GridNode<T>>;
|
|
89
96
|
}
|
|
90
97
|
/**
|
|
91
98
|
* State for a grid component.
|
|
92
99
|
*/
|
|
93
100
|
export interface GridState<T, C extends GridCollection<T> = GridCollection<T>> {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
101
|
+
/** The grid collection. */
|
|
102
|
+
readonly collection: C;
|
|
103
|
+
/** Keys of disabled rows. */
|
|
104
|
+
readonly disabledKeys: Set<Key>;
|
|
105
|
+
/** Whether keyboard navigation is disabled. */
|
|
106
|
+
readonly isKeyboardNavigationDisabled: boolean;
|
|
107
|
+
/** Currently focused key. */
|
|
108
|
+
readonly focusedKey: Key | null;
|
|
109
|
+
/** Focus strategy for child focus. */
|
|
110
|
+
readonly childFocusStrategy: FocusStrategy | null;
|
|
111
|
+
/** Whether the grid is focused. */
|
|
112
|
+
readonly isFocused: boolean;
|
|
113
|
+
/** The selection mode. */
|
|
114
|
+
readonly selectionMode: "none" | "single" | "multiple";
|
|
115
|
+
/** The currently selected keys. */
|
|
116
|
+
readonly selectedKeys: "all" | Set<Key>;
|
|
117
|
+
/** Check if a key is selected. */
|
|
118
|
+
isSelected(key: Key): boolean;
|
|
119
|
+
/** Check if a key is disabled. */
|
|
120
|
+
isDisabled(key: Key): boolean;
|
|
121
|
+
/** Set the focused key. */
|
|
122
|
+
setFocusedKey(key: Key | null, childFocusStrategy?: FocusStrategy): void;
|
|
123
|
+
/** Set focused state. */
|
|
124
|
+
setFocused(isFocused: boolean): void;
|
|
125
|
+
/** Toggle selection for a key. */
|
|
126
|
+
toggleSelection(key: Key): void;
|
|
127
|
+
/** Replace selection with a key. */
|
|
128
|
+
replaceSelection(key: Key): void;
|
|
129
|
+
/** Extend selection to a key (shift-click). */
|
|
130
|
+
extendSelection(toKey: Key): void;
|
|
131
|
+
/** Select all rows. */
|
|
132
|
+
selectAll(): void;
|
|
133
|
+
/** Clear selection. */
|
|
134
|
+
clearSelection(): void;
|
|
135
|
+
/** Toggle select all. */
|
|
136
|
+
toggleSelectAll(): void;
|
|
137
|
+
/** Set keyboard navigation disabled. */
|
|
138
|
+
setKeyboardNavigationDisabled(isDisabled: boolean): void;
|
|
132
139
|
}
|
|
133
140
|
/**
|
|
134
141
|
* Options for creating grid state.
|
|
135
142
|
*/
|
|
136
143
|
export interface GridStateOptions<T, C extends GridCollection<T> = GridCollection<T>> {
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
144
|
+
/** The grid collection. */
|
|
145
|
+
collection: C;
|
|
146
|
+
/** Keys of disabled rows. */
|
|
147
|
+
disabledKeys?: Iterable<Key>;
|
|
148
|
+
/** Focus mode: 'row' or 'cell'. */
|
|
149
|
+
focusMode?: "row" | "cell";
|
|
150
|
+
/** Selection mode. */
|
|
151
|
+
selectionMode?: "none" | "single" | "multiple";
|
|
152
|
+
/** Selection behavior. */
|
|
153
|
+
selectionBehavior?: "toggle" | "replace";
|
|
154
|
+
/** Whether empty selection is disallowed. */
|
|
155
|
+
disallowEmptySelection?: boolean;
|
|
156
|
+
/** Currently selected keys (controlled). */
|
|
157
|
+
selectedKeys?: "all" | Iterable<Key>;
|
|
158
|
+
/** Default selected keys (uncontrolled). */
|
|
159
|
+
defaultSelectedKeys?: "all" | Iterable<Key>;
|
|
160
|
+
/** Handler for selection changes. */
|
|
161
|
+
onSelectionChange?: (keys: "all" | Set<Key>) => void;
|
|
155
162
|
}
|
|
156
|
-
//# sourceMappingURL=types.d.ts.map
|
|
163
|
+
//# sourceMappingURL=types.d.ts.map
|