@headless-tree/core 0.0.0-20230802230636

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 (149) hide show
  1. package/CHANGELOG.md +43 -0
  2. package/lib/cjs/core/create-tree.d.ts +2 -0
  3. package/lib/cjs/core/create-tree.js +138 -0
  4. package/lib/cjs/features/async-data-loader/feature.d.ts +5 -0
  5. package/lib/cjs/features/async-data-loader/feature.js +88 -0
  6. package/lib/cjs/features/async-data-loader/types.d.ts +41 -0
  7. package/lib/cjs/features/async-data-loader/types.js +2 -0
  8. package/lib/cjs/features/drag-and-drop/feature.d.ts +3 -0
  9. package/lib/cjs/features/drag-and-drop/feature.js +138 -0
  10. package/lib/cjs/features/drag-and-drop/types.d.ts +69 -0
  11. package/lib/cjs/features/drag-and-drop/types.js +9 -0
  12. package/lib/cjs/features/drag-and-drop/utils.d.ts +6 -0
  13. package/lib/cjs/features/drag-and-drop/utils.js +79 -0
  14. package/lib/cjs/features/expand-all/feature.d.ts +6 -0
  15. package/lib/cjs/features/expand-all/feature.js +41 -0
  16. package/lib/cjs/features/expand-all/types.d.ts +17 -0
  17. package/lib/cjs/features/expand-all/types.js +2 -0
  18. package/lib/cjs/features/hotkeys-core/feature.d.ts +4 -0
  19. package/lib/cjs/features/hotkeys-core/feature.js +71 -0
  20. package/lib/cjs/features/hotkeys-core/types.d.ts +25 -0
  21. package/lib/cjs/features/hotkeys-core/types.js +2 -0
  22. package/lib/cjs/features/main/types.d.ts +39 -0
  23. package/lib/cjs/features/main/types.js +2 -0
  24. package/lib/cjs/features/renaming/feature.d.ts +5 -0
  25. package/lib/cjs/features/renaming/feature.js +64 -0
  26. package/lib/cjs/features/renaming/types.d.ts +27 -0
  27. package/lib/cjs/features/renaming/types.js +2 -0
  28. package/lib/cjs/features/search/feature.d.ts +5 -0
  29. package/lib/cjs/features/search/feature.js +103 -0
  30. package/lib/cjs/features/search/types.d.ts +33 -0
  31. package/lib/cjs/features/search/types.js +2 -0
  32. package/lib/cjs/features/selection/feature.d.ts +5 -0
  33. package/lib/cjs/features/selection/feature.js +113 -0
  34. package/lib/cjs/features/selection/types.d.ts +21 -0
  35. package/lib/cjs/features/selection/types.js +2 -0
  36. package/lib/cjs/features/sync-data-loader/feature.d.ts +4 -0
  37. package/lib/cjs/features/sync-data-loader/feature.js +14 -0
  38. package/lib/cjs/features/sync-data-loader/types.d.ts +19 -0
  39. package/lib/cjs/features/sync-data-loader/types.js +2 -0
  40. package/lib/cjs/features/tree/feature.d.ts +6 -0
  41. package/lib/cjs/features/tree/feature.js +230 -0
  42. package/lib/cjs/features/tree/types.d.ts +62 -0
  43. package/lib/cjs/features/tree/types.js +2 -0
  44. package/lib/cjs/index.d.ts +23 -0
  45. package/lib/cjs/index.js +39 -0
  46. package/lib/cjs/mddocs-entry.d.ts +21 -0
  47. package/lib/cjs/mddocs-entry.js +17 -0
  48. package/lib/cjs/types/core.d.ts +67 -0
  49. package/lib/cjs/types/core.js +2 -0
  50. package/lib/cjs/types/deep-merge.d.ts +13 -0
  51. package/lib/cjs/types/deep-merge.js +2 -0
  52. package/lib/cjs/utilities/create-on-drop-handler.d.ts +3 -0
  53. package/lib/cjs/utilities/create-on-drop-handler.js +11 -0
  54. package/lib/cjs/utilities/insert-items-at-target.d.ts +3 -0
  55. package/lib/cjs/utilities/insert-items-at-target.js +24 -0
  56. package/lib/cjs/utilities/remove-items-from-parents.d.ts +2 -0
  57. package/lib/cjs/utilities/remove-items-from-parents.js +17 -0
  58. package/lib/cjs/utils.d.ts +6 -0
  59. package/lib/cjs/utils.js +53 -0
  60. package/lib/esm/core/create-tree.d.ts +2 -0
  61. package/lib/esm/core/create-tree.js +134 -0
  62. package/lib/esm/features/async-data-loader/feature.d.ts +5 -0
  63. package/lib/esm/features/async-data-loader/feature.js +85 -0
  64. package/lib/esm/features/async-data-loader/types.d.ts +41 -0
  65. package/lib/esm/features/async-data-loader/types.js +1 -0
  66. package/lib/esm/features/drag-and-drop/feature.d.ts +3 -0
  67. package/lib/esm/features/drag-and-drop/feature.js +135 -0
  68. package/lib/esm/features/drag-and-drop/types.d.ts +69 -0
  69. package/lib/esm/features/drag-and-drop/types.js +6 -0
  70. package/lib/esm/features/drag-and-drop/utils.d.ts +6 -0
  71. package/lib/esm/features/drag-and-drop/utils.js +72 -0
  72. package/lib/esm/features/expand-all/feature.d.ts +6 -0
  73. package/lib/esm/features/expand-all/feature.js +38 -0
  74. package/lib/esm/features/expand-all/types.d.ts +17 -0
  75. package/lib/esm/features/expand-all/types.js +1 -0
  76. package/lib/esm/features/hotkeys-core/feature.d.ts +4 -0
  77. package/lib/esm/features/hotkeys-core/feature.js +68 -0
  78. package/lib/esm/features/hotkeys-core/types.d.ts +25 -0
  79. package/lib/esm/features/hotkeys-core/types.js +1 -0
  80. package/lib/esm/features/main/types.d.ts +39 -0
  81. package/lib/esm/features/main/types.js +1 -0
  82. package/lib/esm/features/renaming/feature.d.ts +5 -0
  83. package/lib/esm/features/renaming/feature.js +61 -0
  84. package/lib/esm/features/renaming/types.d.ts +27 -0
  85. package/lib/esm/features/renaming/types.js +1 -0
  86. package/lib/esm/features/search/feature.d.ts +5 -0
  87. package/lib/esm/features/search/feature.js +100 -0
  88. package/lib/esm/features/search/types.d.ts +33 -0
  89. package/lib/esm/features/search/types.js +1 -0
  90. package/lib/esm/features/selection/feature.d.ts +5 -0
  91. package/lib/esm/features/selection/feature.js +110 -0
  92. package/lib/esm/features/selection/types.d.ts +21 -0
  93. package/lib/esm/features/selection/types.js +1 -0
  94. package/lib/esm/features/sync-data-loader/feature.d.ts +4 -0
  95. package/lib/esm/features/sync-data-loader/feature.js +11 -0
  96. package/lib/esm/features/sync-data-loader/types.d.ts +19 -0
  97. package/lib/esm/features/sync-data-loader/types.js +1 -0
  98. package/lib/esm/features/tree/feature.d.ts +6 -0
  99. package/lib/esm/features/tree/feature.js +227 -0
  100. package/lib/esm/features/tree/types.d.ts +62 -0
  101. package/lib/esm/features/tree/types.js +1 -0
  102. package/lib/esm/index.d.ts +23 -0
  103. package/lib/esm/index.js +23 -0
  104. package/lib/esm/mddocs-entry.d.ts +21 -0
  105. package/lib/esm/mddocs-entry.js +1 -0
  106. package/lib/esm/types/core.d.ts +67 -0
  107. package/lib/esm/types/core.js +1 -0
  108. package/lib/esm/types/deep-merge.d.ts +13 -0
  109. package/lib/esm/types/deep-merge.js +1 -0
  110. package/lib/esm/utilities/create-on-drop-handler.d.ts +3 -0
  111. package/lib/esm/utilities/create-on-drop-handler.js +7 -0
  112. package/lib/esm/utilities/insert-items-at-target.d.ts +3 -0
  113. package/lib/esm/utilities/insert-items-at-target.js +20 -0
  114. package/lib/esm/utilities/remove-items-from-parents.d.ts +2 -0
  115. package/lib/esm/utilities/remove-items-from-parents.js +13 -0
  116. package/lib/esm/utils.d.ts +6 -0
  117. package/lib/esm/utils.js +46 -0
  118. package/package.json +23 -0
  119. package/src/core/create-tree.ts +228 -0
  120. package/src/features/async-data-loader/feature.ts +126 -0
  121. package/src/features/async-data-loader/types.ts +41 -0
  122. package/src/features/drag-and-drop/feature.ts +214 -0
  123. package/src/features/drag-and-drop/types.ts +89 -0
  124. package/src/features/drag-and-drop/utils.ts +117 -0
  125. package/src/features/expand-all/feature.ts +63 -0
  126. package/src/features/expand-all/types.ts +13 -0
  127. package/src/features/hotkeys-core/feature.ts +110 -0
  128. package/src/features/hotkeys-core/types.ts +36 -0
  129. package/src/features/main/types.ts +48 -0
  130. package/src/features/renaming/feature.ts +105 -0
  131. package/src/features/renaming/types.ts +28 -0
  132. package/src/features/search/feature.ts +158 -0
  133. package/src/features/search/types.ts +40 -0
  134. package/src/features/selection/feature.ts +157 -0
  135. package/src/features/selection/types.ts +28 -0
  136. package/src/features/sync-data-loader/feature.ts +41 -0
  137. package/src/features/sync-data-loader/types.ts +20 -0
  138. package/src/features/tree/feature.ts +326 -0
  139. package/src/features/tree/types.ts +78 -0
  140. package/src/index.ts +26 -0
  141. package/src/mddocs-entry.ts +26 -0
  142. package/src/types/core.ts +183 -0
  143. package/src/types/deep-merge.ts +31 -0
  144. package/src/utilities/create-on-drop-handler.ts +14 -0
  145. package/src/utilities/insert-items-at-target.ts +30 -0
  146. package/src/utilities/remove-items-from-parents.ts +21 -0
  147. package/src/utils.ts +68 -0
  148. package/tsconfig.json +7 -0
  149. package/typedoc.json +4 -0
@@ -0,0 +1,68 @@
1
+ const specialKeys = {
2
+ Letter: /^[a-z]$/,
3
+ LetterOrNumber: /^[a-z0-9]$/,
4
+ };
5
+ const testHotkeyMatch = (pressedKeys, tree, hotkey) => {
6
+ const supposedKeys = hotkey.hotkey.split("+");
7
+ const doKeysMatch = supposedKeys.every((key) => key in specialKeys
8
+ ? [...pressedKeys].some((pressedKey) => specialKeys[key].test(pressedKey))
9
+ : pressedKeys.has(key));
10
+ const isEnabled = !hotkey.isEnabled || hotkey.isEnabled(tree);
11
+ const equalCounts = pressedKeys.size === supposedKeys.length;
12
+ return doKeysMatch && isEnabled && equalCounts;
13
+ };
14
+ const findHotkeyMatch = (pressedKeys, tree, config1, config2) => {
15
+ var _a;
16
+ return (_a = Object.entries(Object.assign(Object.assign({}, config1), config2)).find(([, hotkey]) => testHotkeyMatch(pressedKeys, tree, hotkey))) === null || _a === void 0 ? void 0 : _a[0];
17
+ };
18
+ export const hotkeysCoreFeature = {
19
+ key: "hotkeys-core",
20
+ onTreeMount: (tree, element) => {
21
+ const data = tree.getDataRef();
22
+ const keydown = (e) => {
23
+ var _a, _b;
24
+ var _c;
25
+ (_a = (_c = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_c.pressedKeys = new Set());
26
+ const newMatch = !data.current.pressedKeys.has(e.key);
27
+ data.current.pressedKeys.add(e.key);
28
+ const hotkeyName = findHotkeyMatch(data.current.pressedKeys, tree, tree.getHotkeyPresets(), tree.getConfig().hotkeys);
29
+ if (!hotkeyName)
30
+ return;
31
+ const hotkeyConfig = Object.assign(Object.assign({}, tree.getHotkeyPresets()[hotkeyName]), (_b = tree.getConfig().hotkeys) === null || _b === void 0 ? void 0 : _b[hotkeyName]);
32
+ if (!hotkeyConfig)
33
+ return;
34
+ if (!hotkeyConfig.allowWhenInputFocused &&
35
+ e.target instanceof HTMLInputElement)
36
+ return;
37
+ if (!hotkeyConfig.canRepeat && !newMatch)
38
+ return;
39
+ if (hotkeyConfig.preventDefault)
40
+ e.preventDefault();
41
+ hotkeyConfig.handler(e, tree);
42
+ };
43
+ const keyup = (e) => {
44
+ var _a;
45
+ var _b;
46
+ (_a = (_b = data.current).pressedKeys) !== null && _a !== void 0 ? _a : (_b.pressedKeys = new Set());
47
+ data.current.pressedKeys.delete(e.key);
48
+ };
49
+ // keyup is registered on document, because some hotkeys shift
50
+ // the focus away from the tree (i.e. search)
51
+ // and then we wouldn't get the keyup event anymore
52
+ element.addEventListener("keydown", keydown);
53
+ document.addEventListener("keyup", keyup);
54
+ data.current.keydownHandler = keydown;
55
+ data.current.keyupHandler = keyup;
56
+ },
57
+ onTreeUnmount: (tree, element) => {
58
+ const data = tree.getDataRef();
59
+ if (data.current.keyupHandler) {
60
+ document.removeEventListener("keyup", data.current.keyupHandler);
61
+ delete data.current.keyupHandler;
62
+ }
63
+ if (data.current.keydownHandler) {
64
+ element.removeEventListener("keydown", data.current.keydownHandler);
65
+ delete data.current.keydownHandler;
66
+ }
67
+ },
68
+ };
@@ -0,0 +1,25 @@
1
+ import { CustomHotkeysConfig, ItemInstance, TreeInstance } from "../../types/core";
2
+ export interface HotkeyConfig<T> {
3
+ hotkey: string;
4
+ canRepeat?: boolean;
5
+ allowWhenInputFocused?: boolean;
6
+ isEnabled?: (tree: TreeInstance<T>) => boolean;
7
+ preventDefault?: boolean;
8
+ handler: (e: KeyboardEvent, tree: TreeInstance<T>) => void;
9
+ }
10
+ export type HotkeysCoreDataRef = {
11
+ keydownHandler?: (e: KeyboardEvent) => void;
12
+ keyupHandler?: (e: KeyboardEvent) => void;
13
+ pressedKeys: Set<string>;
14
+ };
15
+ export type HotkeysCoreFeatureDef<T> = {
16
+ state: {};
17
+ config: {
18
+ hotkeys?: CustomHotkeysConfig<T>;
19
+ onTreeHotkey?: (name: string, element: HTMLElement) => void;
20
+ onItemHotkey?: (name: string, item: ItemInstance<T>, element: HTMLElement) => void;
21
+ };
22
+ treeInstance: {};
23
+ itemInstance: {};
24
+ hotkeys: never;
25
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,39 @@
1
+ import { FeatureImplementation, HotkeysConfig, ItemInstance, SetStateFn, TreeConfig, TreeState, Updater } from "../../types/core";
2
+ import { ItemMeta } from "../tree/types";
3
+ export type MainFeatureDef<T = any> = {
4
+ state: {};
5
+ config: {
6
+ features?: FeatureImplementation<any>[];
7
+ initialState?: Partial<TreeState<T>>;
8
+ state?: Partial<TreeState<T>>;
9
+ setState?: SetStateFn<TreeState<T>>;
10
+ };
11
+ treeInstance: {
12
+ /** @internal */
13
+ applySubStateUpdate: <K extends keyof TreeState<any>>(stateName: K, updater: Updater<TreeState<T>[K]>) => void;
14
+ setState: SetStateFn<TreeState<T>>;
15
+ getState: () => TreeState<T>;
16
+ setConfig: SetStateFn<TreeConfig<T>>;
17
+ getConfig: () => TreeConfig<T>;
18
+ getItemInstance: (itemId: string) => ItemInstance<T>;
19
+ getItems: () => ItemInstance<T>[];
20
+ registerElement: (element: HTMLElement | null) => void;
21
+ getElement: () => HTMLElement | undefined | null;
22
+ /** @internal */
23
+ getDataRef: <D>() => {
24
+ current: D;
25
+ };
26
+ getHotkeyPresets: () => HotkeysConfig<T>;
27
+ rebuildTree: () => void;
28
+ };
29
+ itemInstance: {
30
+ registerElement: (element: HTMLElement | null) => void;
31
+ getItemMeta: () => ItemMeta;
32
+ getElement: () => HTMLElement | undefined | null;
33
+ /** @internal */
34
+ getDataRef: <D>() => {
35
+ current: D;
36
+ };
37
+ };
38
+ hotkeys: never;
39
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,5 @@
1
+ import { FeatureImplementation } from "../../types/core";
2
+ import { RenamingFeatureDef } from "./types";
3
+ import { MainFeatureDef } from "../main/types";
4
+ import { TreeFeatureDef } from "../tree/types";
5
+ export declare const renamingFeature: FeatureImplementation<any, RenamingFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | RenamingFeatureDef<any>>;
@@ -0,0 +1,61 @@
1
+ import { makeStateUpdater } from "../../utils";
2
+ export const renamingFeature = {
3
+ key: "renaming",
4
+ getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setRenamingItem: makeStateUpdater("renamingItem", tree), setRenamingValue: makeStateUpdater("renamingValue", tree), canRename: () => true }, defaultConfig)),
5
+ stateHandlerNames: {
6
+ renamingItem: "setRenamingItem",
7
+ renamingValue: "setRenamingValue",
8
+ },
9
+ createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { startRenamingItem: (itemId) => {
10
+ const item = instance.getItemInstance(itemId);
11
+ if (!item.canRename()) {
12
+ return;
13
+ }
14
+ instance.applySubStateUpdate("renamingItem", itemId);
15
+ instance.applySubStateUpdate("renamingValue", item.getItemName());
16
+ }, getRenamingItem: () => {
17
+ const itemId = instance.getState().renamingItem;
18
+ return itemId ? instance.getItemInstance(itemId) : null;
19
+ }, getRenamingValue: () => instance.getState().renamingValue || "", abortRenaming: () => {
20
+ instance.applySubStateUpdate("renamingItem", null);
21
+ }, completeRenaming: () => {
22
+ var _a;
23
+ const config = instance.getConfig();
24
+ const item = instance.getRenamingItem();
25
+ if (item) {
26
+ (_a = config.onRename) === null || _a === void 0 ? void 0 : _a.call(config, item, instance.getState().renamingValue || "");
27
+ }
28
+ instance.applySubStateUpdate("renamingItem", null);
29
+ }, isRenamingItem: () => !!instance.getState().renamingItem })),
30
+ createItemInstance: (prev, instance, tree) => (Object.assign(Object.assign({}, prev), { getRenameInputProps: () => ({
31
+ onBlur: () => tree.abortRenaming(),
32
+ value: tree.getRenamingValue(),
33
+ onChange: (e) => {
34
+ tree.applySubStateUpdate("renamingValue", e.target.value);
35
+ },
36
+ }), canRename: () => { var _a, _b, _c; return (_c = (_b = (_a = tree.getConfig()).canRename) === null || _b === void 0 ? void 0 : _b.call(_a, instance)) !== null && _c !== void 0 ? _c : true; }, isRenaming: () => instance.getId() === tree.getState().renamingItem })),
37
+ hotkeys: {
38
+ renameItem: {
39
+ hotkey: "F2",
40
+ handler: (e, tree) => {
41
+ tree.startRenamingItem(tree.getFocusedItem().getId());
42
+ },
43
+ },
44
+ abortRenaming: {
45
+ hotkey: "Escape",
46
+ allowWhenInputFocused: true,
47
+ isEnabled: (tree) => tree.isRenamingItem(),
48
+ handler: (e, tree) => {
49
+ tree.abortRenaming();
50
+ },
51
+ },
52
+ completeRenaming: {
53
+ hotkey: "Enter",
54
+ allowWhenInputFocused: true,
55
+ isEnabled: (tree) => tree.isRenamingItem(),
56
+ handler: (e, tree) => {
57
+ tree.completeRenaming();
58
+ },
59
+ },
60
+ },
61
+ };
@@ -0,0 +1,27 @@
1
+ import { ItemInstance, SetStateFn } from "../../types/core";
2
+ export type RenamingFeatureDef<T> = {
3
+ state: {
4
+ renamingItem?: string | null;
5
+ renamingValue?: string;
6
+ };
7
+ config: {
8
+ setRenamingItem?: SetStateFn<string | null>;
9
+ setRenamingValue?: SetStateFn<string | undefined>;
10
+ canRename?: (item: ItemInstance<T>) => boolean;
11
+ onRename?: (item: ItemInstance<T>, value: string) => void;
12
+ };
13
+ treeInstance: {
14
+ startRenamingItem: (itemId: string) => void;
15
+ getRenamingItem: () => ItemInstance<T> | null;
16
+ getRenamingValue: () => string;
17
+ abortRenaming: () => void;
18
+ completeRenaming: () => void;
19
+ isRenamingItem: () => boolean;
20
+ };
21
+ itemInstance: {
22
+ getRenameInputProps: () => any;
23
+ canRename: () => boolean;
24
+ isRenaming: () => boolean;
25
+ };
26
+ hotkeys: "renameItem" | "abortRenaming" | "completeRenaming";
27
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,5 @@
1
+ import { FeatureImplementation } from "../../types/core";
2
+ import { SearchFeatureDef } from "./types";
3
+ import { MainFeatureDef } from "../main/types";
4
+ import { TreeFeatureDef } from "../tree/types";
5
+ export declare const searchFeature: FeatureImplementation<any, SearchFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | SearchFeatureDef<any>>;
@@ -0,0 +1,100 @@
1
+ import { makeStateUpdater, memo } from "../../utils";
2
+ export const searchFeature = {
3
+ key: "search",
4
+ getInitialState: (initialState) => (Object.assign({ search: null }, initialState)),
5
+ getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setSearch: makeStateUpdater("search", tree), isSearchMatchingItem: (search, item) => search.length > 0 &&
6
+ item.getItemName().toLowerCase().includes(search.toLowerCase()) }, defaultConfig)),
7
+ stateHandlerNames: {
8
+ search: "setSearch",
9
+ },
10
+ createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { setSearch: (search) => {
11
+ var _a;
12
+ instance.applySubStateUpdate("search", search);
13
+ (_a = instance
14
+ .getItems()
15
+ .find((item) => {
16
+ var _a, _b;
17
+ return (_b = (_a = instance
18
+ .getConfig()).isSearchMatchingItem) === null || _b === void 0 ? void 0 : _b.call(_a, instance.getSearchValue(), item);
19
+ })) === null || _a === void 0 ? void 0 : _a.setFocused();
20
+ }, openSearch: (initialValue = "") => {
21
+ instance.setSearch(initialValue);
22
+ setTimeout(() => {
23
+ var _a;
24
+ (_a = instance
25
+ .getDataRef()
26
+ .current.searchInput) === null || _a === void 0 ? void 0 : _a.focus();
27
+ });
28
+ }, closeSearch: () => {
29
+ instance.setSearch(null);
30
+ instance.updateDomFocus();
31
+ }, isSearchOpen: () => instance.getState().search !== null, getSearchValue: () => instance.getState().search || "", registerSearchInputElement: (element) => {
32
+ const dataRef = instance.getDataRef();
33
+ dataRef.current.searchInput = element;
34
+ if (element && dataRef.current.keydownHandler) {
35
+ element.addEventListener("keydown", dataRef.current.keydownHandler);
36
+ }
37
+ }, getSearchInputElement: () => { var _a; return (_a = instance.getDataRef().current.searchInput) !== null && _a !== void 0 ? _a : null; }, getSearchInputElementProps: () => ({
38
+ value: instance.getSearchValue(),
39
+ onChange: (e) => instance.setSearch(e.target.value),
40
+ onBlur: () => instance.closeSearch(),
41
+ }), getSearchMatchingItems: memo((search, items) => items.filter((item) => { var _a, _b; return search && ((_b = (_a = instance.getConfig()).isSearchMatchingItem) === null || _b === void 0 ? void 0 : _b.call(_a, search, item)); }), () => [instance.getSearchValue(), instance.getItems()]) })),
42
+ createItemInstance: (prev, item, tree) => (Object.assign(Object.assign({}, prev), { isMatchingSearch: () => tree.getSearchMatchingItems().some((i) => i.getId() === item.getId()) })),
43
+ hotkeys: {
44
+ openSearch: {
45
+ hotkey: "LetterOrNumber",
46
+ preventDefault: true,
47
+ isEnabled: (tree) => !tree.isSearchOpen(),
48
+ handler: (e, tree) => {
49
+ e.stopPropagation();
50
+ tree.openSearch(e.key);
51
+ },
52
+ },
53
+ closeSearch: {
54
+ // TODO allow multiple, i.e. Enter
55
+ hotkey: "Escape",
56
+ allowWhenInputFocused: true,
57
+ isEnabled: (tree) => tree.isSearchOpen(),
58
+ handler: (e, tree) => {
59
+ tree.closeSearch();
60
+ },
61
+ },
62
+ submitSearch: {
63
+ hotkey: "Enter",
64
+ allowWhenInputFocused: true,
65
+ isEnabled: (tree) => tree.isSearchOpen(),
66
+ handler: (e, tree) => {
67
+ tree.closeSearch();
68
+ tree.setSelectedItems([tree.getFocusedItem().getId()]);
69
+ },
70
+ },
71
+ nextSearchItem: {
72
+ hotkey: "ArrowDown",
73
+ allowWhenInputFocused: true,
74
+ canRepeat: true,
75
+ isEnabled: (tree) => tree.isSearchOpen(),
76
+ handler: (e, tree) => {
77
+ const focusItem = tree
78
+ .getSearchMatchingItems()
79
+ .find((item) => item.getItemMeta().index >
80
+ tree.getFocusedItem().getItemMeta().index);
81
+ focusItem === null || focusItem === void 0 ? void 0 : focusItem.setFocused();
82
+ focusItem === null || focusItem === void 0 ? void 0 : focusItem.scrollTo({ block: "nearest", inline: "nearest" });
83
+ },
84
+ },
85
+ previousSearchItem: {
86
+ hotkey: "ArrowUp",
87
+ allowWhenInputFocused: true,
88
+ canRepeat: true,
89
+ isEnabled: (tree) => tree.isSearchOpen(),
90
+ handler: (e, tree) => {
91
+ const focusItem = [...tree.getSearchMatchingItems()]
92
+ .reverse()
93
+ .find((item) => item.getItemMeta().index <
94
+ tree.getFocusedItem().getItemMeta().index);
95
+ focusItem === null || focusItem === void 0 ? void 0 : focusItem.setFocused();
96
+ focusItem === null || focusItem === void 0 ? void 0 : focusItem.scrollTo({ block: "nearest", inline: "nearest" });
97
+ },
98
+ },
99
+ },
100
+ };
@@ -0,0 +1,33 @@
1
+ import { ItemInstance, SetStateFn } from "../../types/core";
2
+ import { HotkeysCoreDataRef } from "../hotkeys-core/types";
3
+ export type SearchFeatureDataRef<T = any> = HotkeysCoreDataRef & {
4
+ matchingItems: ItemInstance<T>[];
5
+ searchInput: HTMLInputElement | null;
6
+ };
7
+ export type SearchFeatureDef<T> = {
8
+ state: {
9
+ search: string | null;
10
+ };
11
+ config: {
12
+ setSearch?: SetStateFn<string | null>;
13
+ onOpenSearch?: () => void;
14
+ onCloseSearch?: () => void;
15
+ onSearchMatchesItems?: (search: string, items: ItemInstance<T>[]) => void;
16
+ isSearchMatchingItem?: (search: string, item: ItemInstance<T>) => boolean;
17
+ };
18
+ treeInstance: {
19
+ setSearch: (search: string | null) => void;
20
+ openSearch: (initialValue?: string) => void;
21
+ closeSearch: () => void;
22
+ isSearchOpen: () => boolean;
23
+ getSearchValue: () => string;
24
+ registerSearchInputElement: (element: HTMLInputElement | null) => void;
25
+ getSearchInputElement: () => HTMLInputElement | null;
26
+ getSearchInputElementProps: () => any;
27
+ getSearchMatchingItems: () => ItemInstance<T>[];
28
+ };
29
+ itemInstance: {
30
+ isMatchingSearch: () => boolean;
31
+ };
32
+ hotkeys: "openSearch" | "closeSearch" | "submitSearch" | "nextSearchItem" | "previousSearchItem";
33
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,5 @@
1
+ import { FeatureImplementation } from "../../types/core";
2
+ import { SelectionFeatureDef } from "./types";
3
+ import { MainFeatureDef } from "../main/types";
4
+ import { TreeFeatureDef } from "../tree/types";
5
+ export declare const selectionFeature: FeatureImplementation<any, SelectionFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | SelectionFeatureDef<any>>;
@@ -0,0 +1,110 @@
1
+ import { makeStateUpdater } from "../../utils";
2
+ export const selectionFeature = {
3
+ key: "selection",
4
+ getInitialState: (initialState) => (Object.assign({ selectedItems: [] }, initialState)),
5
+ getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setSelectedItems: makeStateUpdater("selectedItems", tree) }, defaultConfig)),
6
+ stateHandlerNames: {
7
+ selectedItems: "setSelectedItems",
8
+ },
9
+ createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { setSelectedItems: (selectedItems) => {
10
+ instance.applySubStateUpdate("selectedItems", selectedItems);
11
+ },
12
+ // TODO memo
13
+ getSelectedItems: () => {
14
+ return instance.getState().selectedItems.map(instance.getItemInstance);
15
+ } })),
16
+ createItemInstance: (prev, item, tree) => (Object.assign(Object.assign({}, prev), { select: () => {
17
+ const { selectedItems } = tree.getState();
18
+ tree.setSelectedItems(selectedItems.includes(item.getItemMeta().itemId)
19
+ ? selectedItems
20
+ : [...selectedItems, item.getItemMeta().itemId]);
21
+ }, deselect: () => {
22
+ const { selectedItems } = tree.getState();
23
+ tree.setSelectedItems(selectedItems.filter((id) => id !== item.getItemMeta().itemId));
24
+ }, isSelected: () => {
25
+ const { selectedItems } = tree.getState();
26
+ return selectedItems.includes(item.getItemMeta().itemId);
27
+ }, selectUpTo: (ctrl) => {
28
+ const indexA = item.getItemMeta().index;
29
+ // TODO dont use focused item as anchor, but last primary-clicked item
30
+ const indexB = tree.getFocusedItem().getItemMeta().index;
31
+ const [a, b] = indexA < indexB ? [indexA, indexB] : [indexB, indexA];
32
+ const newSelectedItems = tree
33
+ .getItems()
34
+ .slice(a, b + 1)
35
+ .map((treeItem) => treeItem.getItemMeta().itemId);
36
+ if (!ctrl) {
37
+ tree.setSelectedItems(newSelectedItems);
38
+ return;
39
+ }
40
+ const { selectedItems } = tree.getState();
41
+ const uniqueSelectedItems = [
42
+ ...new Set([...selectedItems, ...newSelectedItems]),
43
+ ];
44
+ tree.setSelectedItems(uniqueSelectedItems);
45
+ }, toggleSelect: () => {
46
+ if (item.isSelected()) {
47
+ item.deselect();
48
+ }
49
+ else {
50
+ item.select();
51
+ }
52
+ }, getProps: () => (Object.assign(Object.assign({}, prev.getProps()), { "aria-selected": item.isSelected() ? "true" : "false", onClick: item.getMemoizedProp("selection/onClick", () => (e) => {
53
+ var _a, _b;
54
+ if (e.shiftKey) {
55
+ item.selectUpTo(e.ctrlKey || e.metaKey);
56
+ }
57
+ else if (e.ctrlKey || e.metaKey) {
58
+ item.toggleSelect();
59
+ }
60
+ else {
61
+ tree.setSelectedItems([item.getItemMeta().itemId]);
62
+ }
63
+ (_b = (_a = prev.getProps()).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
64
+ }) })) })),
65
+ hotkeys: {
66
+ // setSelectedItem: {
67
+ // hotkey: "space",
68
+ // handler: (e, tree) => {
69
+ // tree.setSelectedItems([tree.getFocusedItem().getId()]);
70
+ // },
71
+ // },
72
+ toggleSelectItem: {
73
+ hotkey: "ctrl+space",
74
+ handler: (e, tree) => {
75
+ tree.getFocusedItem().toggleSelect();
76
+ },
77
+ },
78
+ selectUpwards: {
79
+ hotkey: "shift+ArrowUp",
80
+ handler: () => {
81
+ // TODO
82
+ },
83
+ },
84
+ selectDownwards: {
85
+ hotkey: "shift+ArrowDown",
86
+ handler: () => {
87
+ // TODO
88
+ },
89
+ },
90
+ selectUpwardsCtrl: {
91
+ hotkey: "shift+ctrl+ArrowUp",
92
+ handler: () => {
93
+ // TODO
94
+ },
95
+ },
96
+ selectDownwardsCtrl: {
97
+ hotkey: "shift+ctrl+ArrowUp",
98
+ handler: () => {
99
+ // TODO
100
+ },
101
+ },
102
+ selectAll: {
103
+ hotkey: "Control+a",
104
+ preventDefault: true,
105
+ handler: (e, tree) => {
106
+ tree.setSelectedItems(tree.getItems().map((item) => item.getId()));
107
+ },
108
+ },
109
+ },
110
+ };
@@ -0,0 +1,21 @@
1
+ import { ItemInstance, SetStateFn } from "../../types/core";
2
+ export type SelectionFeatureDef<T> = {
3
+ state: {
4
+ selectedItems: string[];
5
+ };
6
+ config: {
7
+ setSelectedItems?: SetStateFn<string[]>;
8
+ };
9
+ treeInstance: {
10
+ setSelectedItems: (selectedItems: string[]) => void;
11
+ getSelectedItems: () => ItemInstance<T>[];
12
+ };
13
+ itemInstance: {
14
+ select: () => void;
15
+ deselect: () => void;
16
+ toggleSelect: () => void;
17
+ isSelected: () => boolean;
18
+ selectUpTo: (ctrl: boolean) => void;
19
+ };
20
+ hotkeys: "toggleSelectItem" | "selectUpwards" | "selectDownwards" | "selectUpwardsCtrl" | "selectDownwardsCtrl" | "selectAll";
21
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,4 @@
1
+ import { FeatureImplementation } from "../../types/core";
2
+ import { SyncDataLoaderFeatureDef } from "./types";
3
+ import { MainFeatureDef } from "../main/types";
4
+ export declare const syncDataLoaderFeature: FeatureImplementation<any, SyncDataLoaderFeatureDef<any>, MainFeatureDef | SyncDataLoaderFeatureDef<any>>;
@@ -0,0 +1,11 @@
1
+ import { makeStateUpdater } from "../../utils";
2
+ export const syncDataLoaderFeature = {
3
+ key: "sync-data-loader",
4
+ getInitialState: (initialState) => (Object.assign({ loadingItems: [] }, initialState)),
5
+ getDefaultConfig: (defaultConfig, tree) => (Object.assign({ setLoadingItems: makeStateUpdater("loadingItems", tree) }, defaultConfig)),
6
+ stateHandlerNames: {
7
+ loadingItems: "setLoadingItems",
8
+ },
9
+ createTreeInstance: (prev, instance) => (Object.assign(Object.assign({}, prev), { retrieveItemData: (itemId) => instance.getConfig().dataLoader.getItem(itemId), retrieveChildrenIds: (itemId) => instance.getConfig().dataLoader.getChildren(itemId) })),
10
+ createItemInstance: (prev) => (Object.assign(Object.assign({}, prev), { isLoading: () => false })),
11
+ };
@@ -0,0 +1,19 @@
1
+ export type SyncTreeDataLoader<T> = {
2
+ getItem: (itemId: string) => T;
3
+ getChildren: (itemId: string) => string[];
4
+ };
5
+ export type SyncDataLoaderFeatureDef<T> = {
6
+ state: {};
7
+ config: {
8
+ rootItemId: string;
9
+ dataLoader?: SyncTreeDataLoader<T>;
10
+ };
11
+ treeInstance: {
12
+ retrieveItemData: (itemId: string) => T;
13
+ retrieveChildrenIds: (itemId: string) => string[];
14
+ };
15
+ itemInstance: {
16
+ isLoading: () => boolean;
17
+ };
18
+ hotkeys: never;
19
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,6 @@
1
+ import { FeatureImplementation } from "../../types/core";
2
+ import { TreeFeatureDef } from "./types";
3
+ import { MainFeatureDef } from "../main/types";
4
+ import { HotkeysCoreFeatureDef } from "../hotkeys-core/types";
5
+ import { SyncDataLoaderFeatureDef } from "../sync-data-loader/types";
6
+ export declare const treeFeature: FeatureImplementation<any, TreeFeatureDef<any>, MainFeatureDef | TreeFeatureDef<any> | HotkeysCoreFeatureDef<any> | SyncDataLoaderFeatureDef<any>>;