@bccampus/ui-components 0.7.1 → 0.7.2

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.
Files changed (9) hide show
  1. package/dist/components/ui/composite/FocusProvider/AbstractFocusProvider.d.ts +8 -2
  2. package/dist/components/ui/composite/FocusProvider/AbstractFocusProvider.js +8 -0
  3. package/dist/components/ui/composite/SelectionProvider/AbstractSelectionProvider.d.ts +9 -1
  4. package/dist/components/ui/composite/SelectionProvider/AbstractSelectionProvider.js +3 -0
  5. package/dist/components/ui/composite/types.d.ts +4 -4
  6. package/package.json +1 -1
  7. package/src/components/ui/composite/FocusProvider/AbstractFocusProvider.ts +17 -2
  8. package/src/components/ui/composite/SelectionProvider/AbstractSelectionProvider.ts +15 -1
  9. package/src/components/ui/composite/types.ts +4 -4
package/dist/components/ui/composite/FocusProvider/AbstractFocusProvider.d.ts CHANGED
@@ -2,8 +2,12 @@ import { PreinitializedWritableAtom } from 'nanostores';
2
2
  import { CompositeData } from '../CompositeData';
3
3
  import { CompositeDataItem } from '../CompositeDataItem';
4
4
  import { CompositeDataOptions, CompositeItemKey } from '../types';
5
- export interface FocusProvider {
5
+ export interface FocusProvider<T extends object> {
6
+ getFocusedItem(): CompositeDataItem<T> | null;
6
7
  focus(itemKey: CompositeItemKey): void;
8
+ focus(item: CompositeDataItem<T>): void;
9
+ focus(item: CompositeDataItem<T> | CompositeItemKey | null): void;
10
+ blur(): void;
7
11
  focusUp(): void;
8
12
  focusDown(): void;
9
13
  focusLeft(): void;
@@ -16,7 +20,7 @@ export interface FocusProvider {
16
20
  focusToLastInRow(): void;
17
21
  focusToTypeAheadMatch(): void;
18
22
  }
19
- export declare abstract class AbstractFocusProvider<T extends object> implements FocusProvider {
23
+ export declare abstract class AbstractFocusProvider<T extends object> implements FocusProvider<T> {
20
24
  protected data: CompositeData<T>;
21
25
  protected dataOptions: CompositeDataOptions<T>;
22
26
  firstFocusableItem: CompositeDataItem<T> | null;
@@ -24,9 +28,11 @@ export declare abstract class AbstractFocusProvider<T extends object> implements
24
28
  focusedItem: PreinitializedWritableAtom<CompositeDataItem<T> | null>;
25
29
  init(data: CompositeData<T>, dataOptions: CompositeDataOptions<T>): void;
26
30
  isFocusable(itemAtom: CompositeDataItem<T>): boolean;
31
+ getFocusedItem(): CompositeDataItem<T> | null;
27
32
  focus(itemKey: CompositeItemKey): void;
28
33
  focus(item: CompositeDataItem<T>): void;
29
34
  focus(item: CompositeDataItem<T> | CompositeItemKey | null): void;
35
+ blur(): void;
30
36
  abstract setFocusPointers(): readonly [first: CompositeDataItem<T> | null, last: CompositeDataItem<T> | null];
31
37
  abstract focusUp(): void;
32
38
  abstract focusDown(): void;
package/dist/components/ui/composite/FocusProvider/AbstractFocusProvider.js CHANGED
@@ -16,6 +16,9 @@ class AbstractFocusProvider {
16
16
  isFocusable(itemAtom) {
17
17
  return !itemAtom.state.get().disabled;
18
18
  }
19
+ getFocusedItem() {
20
+ return this.focusedItem.get();
21
+ }
19
22
  focus(item) {
20
23
  if (!item) return;
21
24
  const _item = item instanceof CompositeDataItem ? item : this.data.lookup.get(item);
@@ -27,6 +30,11 @@ class AbstractFocusProvider {
27
30
  _item.state.setKey("focused", true);
28
31
  this.focusedItem.set(_item);
29
32
  }
33
+ blur() {
34
+ const _item = this.focusedItem.get();
35
+ if (_item) _item.state.setKey("focused", false);
36
+ this.focusedItem.set(null);
37
+ }
30
38
  }
31
39
  export {
32
40
  AbstractFocusProvider
package/dist/components/ui/composite/SelectionProvider/AbstractSelectionProvider.d.ts CHANGED
@@ -2,10 +2,17 @@ import { PreinitializedWritableAtom } from 'nanostores';
2
2
  import { CompositeData } from '../CompositeData';
3
3
  import { CompositeDataItem } from '../CompositeDataItem';
4
4
  import { CompositeDataOptions, CompositeItemKey } from '../types';
5
- export interface SelectionProvider {
5
+ export interface SelectionProvider<T extends object> {
6
+ getSelectedKeys(): Set<CompositeItemKey>;
6
7
  select(itemKey?: CompositeItemKey, recursive?: boolean): void;
8
+ select(item: CompositeDataItem<T>, recursive?: boolean): void;
9
+ select(item?: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
7
10
  deselect(itemKey?: CompositeItemKey, recursive?: boolean): void;
11
+ deselect(item: CompositeDataItem<T>, recursive?: boolean): void;
12
+ deselect(item?: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
8
13
  toggleSelect(itemKey?: CompositeItemKey, recursive?: boolean): void;
14
+ toggleSelect(item: CompositeDataItem<T>, recursive?: boolean): void;
15
+ toggleSelect(item: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
9
16
  }
10
17
  export interface SelectionProviderOptions<T extends object> {
11
18
  onSelect?: (item: T) => void;
@@ -19,6 +26,7 @@ export declare abstract class AbstractSelectionProvider<T extends object> {
19
26
  options?: SelectionProviderOptions<T>;
20
27
  constructor(options?: SelectionProviderOptions<T>);
21
28
  init(data: CompositeData<T>, dataOptions: CompositeDataOptions<T>): void;
29
+ getSelectedKeys(): Set<CompositeItemKey>;
22
30
  abstract select(itemKey?: CompositeItemKey, recursive?: boolean): void;
23
31
  abstract select(item: CompositeDataItem<T>, recursive?: boolean): void;
24
32
  abstract select(item?: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
package/dist/components/ui/composite/SelectionProvider/AbstractSelectionProvider.js CHANGED
@@ -13,6 +13,9 @@ class AbstractSelectionProvider {
13
13
  this.dataOptions = dataOptions;
14
14
  this.dataOptions.selectedKeys.forEach((selectedKey) => this.select(selectedKey));
15
15
  }
16
+ getSelectedKeys() {
17
+ return this.selectedKeys.get();
18
+ }
16
19
  toggleSelect(item, recursive = false) {
17
20
  const _item = item ? item instanceof CompositeDataItem ? item : this.data.lookup.get(item) : this.data.focusProvider.focusedItem.get();
18
21
  if (!_item) return;
package/dist/components/ui/composite/types.d.ts CHANGED
@@ -57,7 +57,7 @@ export interface BaseCompositeProps<T extends object> extends React.ComponentPro
57
57
  data: CompositeData<T>;
58
58
  className?: string;
59
59
  rootRef?: React.RefObject<HTMLDivElement | null>;
60
- handleRef?: React.RefObject<CompositeHandle | null>;
60
+ handleRef?: React.RefObject<CompositeHandle<T> | null>;
61
61
  renderItem: CompositeItemRenderFn<T>;
62
62
  itemClassName?: string;
63
63
  initialFocus?: InitialFocusTarget;
@@ -67,10 +67,10 @@ export interface BaseCompositeProps<T extends object> extends React.ComponentPro
67
67
  softFocus?: boolean;
68
68
  }
69
69
  export type CompositeProps<T extends object> = BaseCompositeProps<T> & CompositeItemEventHandlerFunctions<T> & CompositeRoles;
70
- export interface CompositeHandle {
71
- focusProvider: FocusProvider;
70
+ export interface CompositeHandle<T extends object> {
71
+ focusProvider: FocusProvider<T>;
72
72
  focusElement: () => void;
73
- selectionProvider?: SelectionProvider;
73
+ selectionProvider?: SelectionProvider<T>;
74
74
  }
75
75
  export type CompositeItemRenderFn<T extends object> = (item: {
76
76
  data: T;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bccampus/ui-components",
3
- "version": "0.7.1",
3
+ "version": "0.7.2",
4
4
  "type": "module",
5
5
  "packageManager": "yarn@4.10.3",
6
6
  "exports": {
package/src/components/ui/composite/FocusProvider/AbstractFocusProvider.ts CHANGED
@@ -3,8 +3,13 @@ import type { CompositeData } from "../CompositeData";
3
3
  import { CompositeDataItem } from "../CompositeDataItem";
4
4
  import type { CompositeDataOptions, CompositeItemKey } from "../types";
5
5
 
6
- export interface FocusProvider {
6
+ export interface FocusProvider<T extends object> {
7
+ getFocusedItem(): CompositeDataItem<T> | null;
8
+
7
9
  focus(itemKey: CompositeItemKey): void;
10
+ focus(item: CompositeDataItem<T>): void;
11
+ focus(item: CompositeDataItem<T> | CompositeItemKey | null): void;
12
+ blur(): void;
8
13
 
9
14
  focusUp(): void;
10
15
  focusDown(): void;
@@ -19,7 +24,7 @@ export interface FocusProvider {
19
24
  focusToTypeAheadMatch(): void;
20
25
  }
21
26
 
22
- export abstract class AbstractFocusProvider<T extends object> implements FocusProvider {
27
+ export abstract class AbstractFocusProvider<T extends object> implements FocusProvider<T> {
23
28
  protected data!: CompositeData<T>;
24
29
  protected dataOptions!: CompositeDataOptions<T>;
25
30
 
@@ -42,6 +47,10 @@ export abstract class AbstractFocusProvider<T extends object> implements FocusPr
42
47
  return !itemAtom.state.get().disabled;
43
48
  }
44
49
 
50
+ getFocusedItem() {
51
+ return this.focusedItem.get();
52
+ }
53
+
45
54
  focus(itemKey: CompositeItemKey): void;
46
55
  focus(item: CompositeDataItem<T>): void;
47
56
  focus(item: CompositeDataItem<T> | CompositeItemKey | null): void;
@@ -61,6 +70,12 @@ export abstract class AbstractFocusProvider<T extends object> implements FocusPr
61
70
  this.focusedItem.set(_item);
62
71
  }
63
72
 
73
+ blur() {
74
+ const _item = this.focusedItem.get();
75
+ if (_item) _item.state.setKey("focused", false);
76
+ this.focusedItem.set(null);
77
+ }
78
+
64
79
  abstract setFocusPointers(): readonly [first: CompositeDataItem<T> | null, last: CompositeDataItem<T> | null];
65
80
 
66
81
  abstract focusUp(): void;
package/src/components/ui/composite/SelectionProvider/AbstractSelectionProvider.ts CHANGED
@@ -3,10 +3,20 @@ import type { CompositeData } from "../CompositeData";
3
3
  import { CompositeDataItem } from "../CompositeDataItem";
4
4
  import type { CompositeDataOptions, CompositeItemKey } from "../types";
5
5
 
6
- export interface SelectionProvider {
6
+ export interface SelectionProvider<T extends object> {
7
+ getSelectedKeys(): Set<CompositeItemKey>;
8
+
7
9
  select(itemKey?: CompositeItemKey, recursive?: boolean): void;
10
+ select(item: CompositeDataItem<T>, recursive?: boolean): void;
11
+ select(item?: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
12
+
8
13
  deselect(itemKey?: CompositeItemKey, recursive?: boolean): void;
14
+ deselect(item: CompositeDataItem<T>, recursive?: boolean): void;
15
+ deselect(item?: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
16
+
9
17
  toggleSelect(itemKey?: CompositeItemKey, recursive?: boolean): void;
18
+ toggleSelect(item: CompositeDataItem<T>, recursive?: boolean): void;
19
+ toggleSelect(item: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
10
20
  }
11
21
 
12
22
  export interface SelectionProviderOptions<T extends object> {
@@ -34,6 +44,10 @@ export abstract class AbstractSelectionProvider<T extends object> {
34
44
  this.dataOptions.selectedKeys.forEach((selectedKey) => this.select(selectedKey));
35
45
  }
36
46
 
47
+ getSelectedKeys() {
48
+ return this.selectedKeys.get();
49
+ }
50
+
37
51
  abstract select(itemKey?: CompositeItemKey, recursive?: boolean): void;
38
52
  abstract select(item: CompositeDataItem<T>, recursive?: boolean): void;
39
53
  abstract select(item?: CompositeDataItem<T> | CompositeItemKey, recursive?: boolean): void;
package/src/components/ui/composite/types.ts CHANGED
@@ -73,7 +73,7 @@ export interface BaseCompositeProps<T extends object> extends React.ComponentPro
73
73
  data: CompositeData<T>;
74
74
  className?: string;
75
75
  rootRef?: React.RefObject<HTMLDivElement | null>;
76
- handleRef?: React.RefObject<CompositeHandle | null>;
76
+ handleRef?: React.RefObject<CompositeHandle<T> | null>;
77
77
 
78
78
  renderItem: CompositeItemRenderFn<T>;
79
79
  itemClassName?: string;
@@ -89,10 +89,10 @@ export type CompositeProps<T extends object> = BaseCompositeProps<T> &
89
89
  CompositeItemEventHandlerFunctions<T> &
90
90
  CompositeRoles;
91
91
 
92
- export interface CompositeHandle {
93
- focusProvider: FocusProvider;
92
+ export interface CompositeHandle<T extends object> {
93
+ focusProvider: FocusProvider<T>;
94
94
  focusElement: () => void;
95
- selectionProvider?: SelectionProvider;
95
+ selectionProvider?: SelectionProvider<T>;
96
96
  }
97
97
 
98
98
  export type CompositeItemRenderFn<T extends object> = (