@workday/canvas-kit-labs-react 16.1.4 → 16.2.0-0612-next.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/dist/commonjs/ai-ingress-button/lib/AIIngressButton.js +5 -5
- package/dist/commonjs/index.d.ts +1 -0
- package/dist/commonjs/index.d.ts.map +1 -1
- package/dist/commonjs/index.js +1 -0
- package/dist/commonjs/kbd/lib/KBD.js +6 -6
- package/dist/commonjs/kbd/lib/KBDItem.js +6 -6
- package/dist/commonjs/selection-group/index.d.ts +7 -0
- package/dist/commonjs/selection-group/index.d.ts.map +1 -0
- package/dist/commonjs/selection-group/index.js +22 -0
- package/dist/commonjs/selection-group/lib/SelectionGroup.d.ts +1499 -0
- package/dist/commonjs/selection-group/lib/SelectionGroup.d.ts.map +1 -0
- package/dist/commonjs/selection-group/lib/SelectionGroup.js +61 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupIcon.d.ts +17 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupIcon.d.ts.map +1 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupIcon.js +24 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupItem.d.ts +173 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupItem.d.ts.map +1 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupItem.js +37 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupList.d.ts +172 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupList.d.ts.map +1 -0
- package/dist/commonjs/selection-group/lib/SelectionGroupList.js +35 -0
- package/dist/commonjs/selection-group/lib/hooks/useSelectionGroupItem.d.ts +146 -0
- package/dist/commonjs/selection-group/lib/hooks/useSelectionGroupItem.d.ts.map +1 -0
- package/dist/commonjs/selection-group/lib/hooks/useSelectionGroupItem.js +29 -0
- package/dist/commonjs/selection-group/lib/hooks/useSelectionGroupModel.d.ts +1602 -0
- package/dist/commonjs/selection-group/lib/hooks/useSelectionGroupModel.d.ts.map +1 -0
- package/dist/commonjs/selection-group/lib/hooks/useSelectionGroupModel.js +166 -0
- package/dist/commonjs/version/lib/version.js +1 -1
- package/dist/es6/ai-ingress-button/lib/AIIngressButton.js +5 -5
- package/dist/es6/index.d.ts +1 -0
- package/dist/es6/index.d.ts.map +1 -1
- package/dist/es6/index.js +1 -0
- package/dist/es6/kbd/lib/KBD.js +6 -6
- package/dist/es6/kbd/lib/KBDItem.js +6 -6
- package/dist/es6/selection-group/index.d.ts +7 -0
- package/dist/es6/selection-group/index.d.ts.map +1 -0
- package/dist/es6/selection-group/index.js +6 -0
- package/dist/es6/selection-group/lib/SelectionGroup.d.ts +1499 -0
- package/dist/es6/selection-group/lib/SelectionGroup.d.ts.map +1 -0
- package/dist/es6/selection-group/lib/SelectionGroup.js +58 -0
- package/dist/es6/selection-group/lib/SelectionGroupIcon.d.ts +17 -0
- package/dist/es6/selection-group/lib/SelectionGroupIcon.d.ts.map +1 -0
- package/dist/es6/selection-group/lib/SelectionGroupIcon.js +21 -0
- package/dist/es6/selection-group/lib/SelectionGroupItem.d.ts +173 -0
- package/dist/es6/selection-group/lib/SelectionGroupItem.d.ts.map +1 -0
- package/dist/es6/selection-group/lib/SelectionGroupItem.js +34 -0
- package/dist/es6/selection-group/lib/SelectionGroupList.d.ts +172 -0
- package/dist/es6/selection-group/lib/SelectionGroupList.d.ts.map +1 -0
- package/dist/es6/selection-group/lib/SelectionGroupList.js +32 -0
- package/dist/es6/selection-group/lib/hooks/useSelectionGroupItem.d.ts +146 -0
- package/dist/es6/selection-group/lib/hooks/useSelectionGroupItem.d.ts.map +1 -0
- package/dist/es6/selection-group/lib/hooks/useSelectionGroupItem.js +26 -0
- package/dist/es6/selection-group/lib/hooks/useSelectionGroupModel.d.ts +1602 -0
- package/dist/es6/selection-group/lib/hooks/useSelectionGroupModel.d.ts.map +1 -0
- package/dist/es6/selection-group/lib/hooks/useSelectionGroupModel.js +160 -0
- package/dist/es6/version/lib/version.js +1 -1
- package/index.ts +1 -0
- package/package.json +4 -4
- package/selection-group/index.ts +6 -0
- package/selection-group/lib/SelectionGroup.tsx +65 -0
- package/selection-group/lib/SelectionGroupIcon.tsx +60 -0
- package/selection-group/lib/SelectionGroupItem.tsx +143 -0
- package/selection-group/lib/SelectionGroupList.tsx +89 -0
- package/selection-group/lib/hooks/useSelectionGroupItem.tsx +46 -0
- package/selection-group/lib/hooks/useSelectionGroupModel.tsx +195 -0
- package/selection-group/package.json +6 -0
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
export declare const useSelectionGroupItem: import("@workday/canvas-kit-react/common").BehaviorHook<{
|
|
2
|
+
state: {
|
|
3
|
+
selectedIds: string[] | "all";
|
|
4
|
+
unselectedIds: string[];
|
|
5
|
+
cursorId: string | string[];
|
|
6
|
+
columnCount: number;
|
|
7
|
+
pageSizeRef: import("react").MutableRefObject<number>;
|
|
8
|
+
cursorIndexRef: {
|
|
9
|
+
readonly current: number;
|
|
10
|
+
};
|
|
11
|
+
UNSTABLE_virtual: import("@tanstack/virtual-core").Virtualizer<HTMLDivElement, Element>;
|
|
12
|
+
UNSTABLE_defaultItemHeight: number;
|
|
13
|
+
containerRef: import("react").RefObject<HTMLDivElement>;
|
|
14
|
+
id: string;
|
|
15
|
+
orientation: "horizontal" | "vertical";
|
|
16
|
+
indexRef: import("react").MutableRefObject<number>;
|
|
17
|
+
nonInteractiveIds: string[];
|
|
18
|
+
isVirtualized: boolean;
|
|
19
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
20
|
+
};
|
|
21
|
+
events: {
|
|
22
|
+
select(data: {
|
|
23
|
+
id: string;
|
|
24
|
+
}): void;
|
|
25
|
+
selectAll(): void;
|
|
26
|
+
unselectAll(): void;
|
|
27
|
+
setSelectedIds(ids: string[] | "all"): void;
|
|
28
|
+
remove(data: {
|
|
29
|
+
id: string;
|
|
30
|
+
nextId?: string | undefined;
|
|
31
|
+
event?: Event | import("react").SyntheticEvent<Element, Event> | undefined;
|
|
32
|
+
}): void;
|
|
33
|
+
goTo(data: {
|
|
34
|
+
id: string;
|
|
35
|
+
}): void;
|
|
36
|
+
goToNext(): void;
|
|
37
|
+
goToPrevious(): void;
|
|
38
|
+
goToPreviousRow(): void;
|
|
39
|
+
goToNextRow(): void;
|
|
40
|
+
goToFirst(): void;
|
|
41
|
+
goToLast(): void;
|
|
42
|
+
goToFirstOfRow(): void;
|
|
43
|
+
goToLastOfRow(): void;
|
|
44
|
+
goToNextPage(): void;
|
|
45
|
+
goToPreviousPage(): void;
|
|
46
|
+
registerItem(data: {
|
|
47
|
+
id: string;
|
|
48
|
+
textValue: string;
|
|
49
|
+
}): void;
|
|
50
|
+
unregisterItem(data: {
|
|
51
|
+
id: string;
|
|
52
|
+
}): void;
|
|
53
|
+
updateItemHeight(data: {
|
|
54
|
+
value: number;
|
|
55
|
+
}): void;
|
|
56
|
+
};
|
|
57
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
58
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
59
|
+
getId: (item: any) => string;
|
|
60
|
+
getTextValue: (item: any) => string;
|
|
61
|
+
UNSTABLE_parentModel: {
|
|
62
|
+
state: {
|
|
63
|
+
selectedIds: string[] | "all";
|
|
64
|
+
unselectedIds: string[];
|
|
65
|
+
cursorId: string | string[];
|
|
66
|
+
columnCount: number;
|
|
67
|
+
pageSizeRef: import("react").MutableRefObject<number>;
|
|
68
|
+
cursorIndexRef: {
|
|
69
|
+
readonly current: number;
|
|
70
|
+
};
|
|
71
|
+
UNSTABLE_virtual: import("@tanstack/virtual-core").Virtualizer<HTMLDivElement, Element>;
|
|
72
|
+
UNSTABLE_defaultItemHeight: number;
|
|
73
|
+
containerRef: import("react").RefObject<HTMLDivElement>;
|
|
74
|
+
id: string;
|
|
75
|
+
orientation: "horizontal" | "vertical";
|
|
76
|
+
indexRef: import("react").MutableRefObject<number>;
|
|
77
|
+
nonInteractiveIds: string[];
|
|
78
|
+
isVirtualized: boolean;
|
|
79
|
+
items: import("@workday/canvas-kit-react/collection").Item<any>[];
|
|
80
|
+
};
|
|
81
|
+
events: {
|
|
82
|
+
select(data: {
|
|
83
|
+
id: string;
|
|
84
|
+
}): void;
|
|
85
|
+
selectAll(): void;
|
|
86
|
+
unselectAll(): void;
|
|
87
|
+
setSelectedIds(ids: string[] | "all"): void;
|
|
88
|
+
remove(data: {
|
|
89
|
+
id: string;
|
|
90
|
+
nextId?: string | undefined;
|
|
91
|
+
event?: Event | import("react").SyntheticEvent<Element, Event> | undefined;
|
|
92
|
+
}): void;
|
|
93
|
+
goTo(data: {
|
|
94
|
+
id: string;
|
|
95
|
+
}): void;
|
|
96
|
+
goToNext(): void;
|
|
97
|
+
goToPrevious(): void;
|
|
98
|
+
goToPreviousRow(): void;
|
|
99
|
+
goToNextRow(): void;
|
|
100
|
+
goToFirst(): void;
|
|
101
|
+
goToLast(): void;
|
|
102
|
+
goToFirstOfRow(): void;
|
|
103
|
+
goToLastOfRow(): void;
|
|
104
|
+
goToNextPage(): void;
|
|
105
|
+
goToPreviousPage(): void;
|
|
106
|
+
registerItem(data: {
|
|
107
|
+
id: string;
|
|
108
|
+
textValue: string;
|
|
109
|
+
}): void;
|
|
110
|
+
unregisterItem(data: {
|
|
111
|
+
id: string;
|
|
112
|
+
}): void;
|
|
113
|
+
updateItemHeight(data: {
|
|
114
|
+
value: number;
|
|
115
|
+
}): void;
|
|
116
|
+
};
|
|
117
|
+
selection: import("@workday/canvas-kit-react/collection").SelectionManager;
|
|
118
|
+
navigation: import("@workday/canvas-kit-react/collection").NavigationManager;
|
|
119
|
+
getId: (item: any) => string;
|
|
120
|
+
getTextValue: (item: any) => string;
|
|
121
|
+
} | undefined;
|
|
122
|
+
}, import("@workday/canvas-kit-react/common").RemoveNulls<import("@workday/canvas-kit-react/common").MergeProps<{
|
|
123
|
+
readonly onClick: (event: import("react").MouseEvent<HTMLElement, MouseEvent>) => null | undefined;
|
|
124
|
+
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
125
|
+
readonly onKeyDown: (event: import("react").KeyboardEvent<HTMLElement>) => void;
|
|
126
|
+
readonly onClick: () => void;
|
|
127
|
+
readonly 'data-focus-id': string;
|
|
128
|
+
readonly tabIndex: 0 | -1;
|
|
129
|
+
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
130
|
+
readonly tabIndex?: 0 | undefined;
|
|
131
|
+
readonly role: "checkbox" | "radio";
|
|
132
|
+
readonly 'aria-checked': boolean;
|
|
133
|
+
readonly type: "button";
|
|
134
|
+
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
135
|
+
readonly ref: (instance: Element | null | undefined) => void;
|
|
136
|
+
readonly 'data-id': string;
|
|
137
|
+
readonly disabled: true | undefined;
|
|
138
|
+
readonly 'aria-setsize': number | undefined;
|
|
139
|
+
readonly 'aria-posinset': number | undefined;
|
|
140
|
+
readonly 'data-index': number | undefined;
|
|
141
|
+
readonly style: import("react").CSSProperties;
|
|
142
|
+
readonly id: string;
|
|
143
|
+
}, import("@workday/canvas-kit-react/common").MergeProps<{
|
|
144
|
+
readonly disabled?: true | undefined;
|
|
145
|
+
}, import("@workday/canvas-kit-react/common").MergeProps<{}, {}>>>>>>>>;
|
|
146
|
+
//# sourceMappingURL=useSelectionGroupItem.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSelectionGroupItem.d.ts","sourceRoot":"","sources":["../../../../../selection-group/lib/hooks/useSelectionGroupItem.tsx"],"names":[],"mappings":"AAuCA,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uEAMjC,CAAC"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { isSelected, useListItemRegister, useListItemRovingFocus, useListItemSelect, } from '@workday/canvas-kit-react/collection';
|
|
2
|
+
import { composeHooks, createElemPropsHook } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { useSelectionGroupModel } from './useSelectionGroupModel';
|
|
4
|
+
const useSelectionGroupItemProps = createElemPropsHook(useSelectionGroupModel)((model, _ref, elemProps = {}) => {
|
|
5
|
+
const name = elemProps['data-id'] || '';
|
|
6
|
+
return {
|
|
7
|
+
role: model.state.mode === 'single' ? 'radio' : 'checkbox',
|
|
8
|
+
'aria-checked': !!name && isSelected(name, model.state),
|
|
9
|
+
type: 'button',
|
|
10
|
+
// A single-select group is a radio group and uses a single roving tab stop. A multi-select
|
|
11
|
+
// group is a checkbox group, where every item is its own tab stop, so the roving tabindex
|
|
12
|
+
// applied by `useListItemRovingFocus` is overridden here.
|
|
13
|
+
...(model.state.mode === 'multiple' ? { tabIndex: 0 } : {}),
|
|
14
|
+
};
|
|
15
|
+
});
|
|
16
|
+
const useSelectionGroupItemDisabled = createElemPropsHook(useSelectionGroupModel)(({ state }) => {
|
|
17
|
+
return {
|
|
18
|
+
// `useListItemRegister` resolves the item's own `disabled` prop and `nonInteractiveIds`, but
|
|
19
|
+
// it doesn't know about the group-level `disabled`. The key is only added when the group is
|
|
20
|
+
// disabled so that an `undefined` doesn't overwrite what `useListItemRegister` resolved. The
|
|
21
|
+
// native `disabled` attribute already conveys the state to assistive technology, so no
|
|
22
|
+
// `aria-disabled` is added alongside it.
|
|
23
|
+
...(state.disabled ? { disabled: true } : {}),
|
|
24
|
+
};
|
|
25
|
+
});
|
|
26
|
+
export const useSelectionGroupItem = composeHooks(useListItemSelect, useListItemRovingFocus, useSelectionGroupItemProps, useListItemRegister, useSelectionGroupItemDisabled);
|