react-arborist 1.2.0 → 2.0.0-rc

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 (120) hide show
  1. package/dist/components/{drop-cursor.d.ts → cursor.d.ts} +0 -0
  2. package/dist/components/default-container.d.ts +2 -0
  3. package/dist/components/default-cursor.d.ts +3 -0
  4. package/dist/components/default-drag-preview.d.ts +3 -0
  5. package/dist/components/default-node.d.ts +4 -0
  6. package/dist/components/default-row.d.ts +4 -0
  7. package/dist/components/drag-preview-container.d.ts +2 -0
  8. package/dist/components/list-inner-element.d.ts +2 -0
  9. package/dist/components/provider.d.ts +11 -0
  10. package/dist/components/row-container.d.ts +8 -0
  11. package/dist/components/tree-container.d.ts +2 -0
  12. package/dist/components/tree.d.ts +5 -4
  13. package/dist/context.d.ts +20 -2
  14. package/dist/data/create-index.d.ts +5 -0
  15. package/dist/data/create-list.d.ts +4 -0
  16. package/dist/data/create-root.d.ts +5 -0
  17. package/dist/data/flatten-tree.d.ts +4 -2
  18. package/dist/data/simple-tree.d.ts +43 -0
  19. package/dist/dnd/compute-drop.d.ts +4 -4
  20. package/dist/dnd/drag-hook.d.ts +3 -4
  21. package/dist/dnd/drop-hook.d.ts +2 -3
  22. package/dist/hooks/use-fresh-node.d.ts +2 -0
  23. package/dist/hooks/use-simple-tree.d.ts +13 -0
  24. package/dist/hooks/use-uncontrolled-tree.d.ts +24 -0
  25. package/dist/hooks/use-validated-props.d.ts +3 -0
  26. package/dist/index.d.ts +8 -4
  27. package/dist/index.js +1900 -971
  28. package/dist/index.js.map +1 -1
  29. package/dist/interfaces/node-api.d.ts +67 -0
  30. package/dist/interfaces/tree-api.d.ts +112 -0
  31. package/dist/module.js +1886 -976
  32. package/dist/module.js.map +1 -1
  33. package/dist/state/dnd-slice.d.ts +20 -0
  34. package/dist/state/drag-slice.d.ts +7 -0
  35. package/dist/state/edit-slice.d.ts +8 -0
  36. package/dist/state/focus-slice.d.ts +12 -0
  37. package/dist/state/initial.d.ts +3 -0
  38. package/dist/state/open-slice.d.ts +30 -0
  39. package/dist/state/root-reducer.d.ts +13 -0
  40. package/dist/state/selection-slice.d.ts +36 -0
  41. package/dist/types/dnd.d.ts +9 -0
  42. package/dist/types/handlers.d.ts +24 -0
  43. package/dist/types/renderers.d.ts +30 -0
  44. package/dist/types/state.d.ts +2 -0
  45. package/dist/types/tree-props.d.ts +43 -0
  46. package/dist/types/utils.d.ts +21 -0
  47. package/dist/utils/props.d.ts +3 -0
  48. package/dist/utils.d.ts +15 -6
  49. package/package.json +10 -7
  50. package/src/components/cursor.tsx +15 -0
  51. package/src/components/default-container.tsx +229 -0
  52. package/src/components/{default-drop-cursor.tsx → default-cursor.tsx} +9 -8
  53. package/src/components/{preview.tsx → default-drag-preview.tsx} +25 -41
  54. package/src/components/default-node.tsx +15 -0
  55. package/src/components/default-row.tsx +21 -0
  56. package/src/components/drag-preview-container.tsx +26 -0
  57. package/src/components/list-inner-element.tsx +22 -0
  58. package/src/components/list-outer-element.tsx +26 -15
  59. package/src/components/provider.tsx +97 -0
  60. package/src/components/row-container.tsx +82 -0
  61. package/src/components/tree-container.tsx +13 -0
  62. package/src/components/tree.tsx +16 -44
  63. package/src/context.ts +36 -0
  64. package/src/data/create-index.ts +9 -0
  65. package/src/data/create-list.ts +56 -0
  66. package/src/data/create-root.ts +53 -0
  67. package/src/data/simple-tree.ts +103 -0
  68. package/src/dnd/compute-drop.ts +16 -16
  69. package/src/dnd/drag-hook.ts +25 -19
  70. package/src/dnd/drop-hook.ts +31 -17
  71. package/src/dnd/outer-drop-hook.ts +1 -1
  72. package/src/hooks/use-fresh-node.ts +16 -0
  73. package/src/hooks/use-simple-tree.ts +55 -0
  74. package/src/hooks/use-validated-props.ts +35 -0
  75. package/src/index.ts +9 -19
  76. package/src/interfaces/node-api.ts +187 -0
  77. package/src/interfaces/tree-api.ts +552 -0
  78. package/src/state/dnd-slice.ts +36 -0
  79. package/src/state/drag-slice.ts +31 -0
  80. package/src/state/edit-slice.ts +19 -0
  81. package/src/state/focus-slice.ts +28 -0
  82. package/src/state/initial.ts +14 -0
  83. package/src/state/open-slice.ts +53 -0
  84. package/src/state/root-reducer.ts +21 -0
  85. package/src/state/selection-slice.ts +75 -0
  86. package/src/types/dnd.ts +10 -0
  87. package/src/types/handlers.ts +24 -0
  88. package/src/types/renderers.ts +34 -0
  89. package/src/types/state.ts +3 -0
  90. package/src/types/tree-props.ts +63 -0
  91. package/src/types/utils.ts +26 -0
  92. package/src/utils/props.ts +8 -0
  93. package/src/utils.ts +125 -11
  94. package/README.md +0 -221
  95. package/dist/components/default-drop-cursor.d.ts +0 -3
  96. package/dist/components/list.d.ts +0 -4
  97. package/dist/components/preview.d.ts +0 -2
  98. package/dist/components/row.d.ts +0 -8
  99. package/dist/data/enrich-tree.d.ts +0 -2
  100. package/dist/provider.d.ts +0 -3
  101. package/dist/reducer.d.ts +0 -46
  102. package/dist/selection/range.d.ts +0 -13
  103. package/dist/selection/selection-hook.d.ts +0 -4
  104. package/dist/selection/selection.d.ts +0 -33
  105. package/dist/tree-api.d.ts +0 -50
  106. package/dist/types.d.ts +0 -122
  107. package/src/components/drop-cursor.tsx +0 -12
  108. package/src/components/list.tsx +0 -25
  109. package/src/components/row.tsx +0 -112
  110. package/src/context.tsx +0 -13
  111. package/src/data/enrich-tree.ts +0 -74
  112. package/src/data/flatten-tree.ts +0 -17
  113. package/src/provider.tsx +0 -41
  114. package/src/reducer.ts +0 -161
  115. package/src/selection/range.ts +0 -41
  116. package/src/selection/selection-hook.ts +0 -25
  117. package/src/selection/selection.test.ts +0 -111
  118. package/src/selection/selection.ts +0 -186
  119. package/src/tree-api.ts +0 -230
  120. package/src/types.ts +0 -148
@@ -0,0 +1,2 @@
1
+ /// <reference types="react" />
2
+ export declare function DefaultContainer(): JSX.Element;
@@ -0,0 +1,3 @@
1
+ import React from "react";
2
+ import { DropCursorProps } from "../types/renderers";
3
+ export declare const DefaultCursor: React.NamedExoticComponent<DropCursorProps>;
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { DragPreviewProps } from "../types/renderers";
3
+ export declare function DefaultDragPreview({ offset, mouse, id, dragIds, isDragging, }: DragPreviewProps): JSX.Element;
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { NodeRendererProps } from "../types/renderers";
3
+ import { IdObj } from "../types/utils";
4
+ export declare function DefaultNode<T extends IdObj>({ style, node, dragHandle, }: NodeRendererProps<T>): JSX.Element;
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { RowRendererProps } from "../types/renderers";
3
+ import { IdObj } from "../types/utils";
4
+ export declare function DefaultRow<T extends IdObj>({ node, attrs, innerRef, children, }: RowRendererProps<T>): JSX.Element;
@@ -0,0 +1,2 @@
1
+ /// <reference types="react" />
2
+ export declare function DragPreviewContainer(): JSX.Element;
@@ -0,0 +1,2 @@
1
+ import React from "react";
2
+ export declare const ListInnerElement: (props: any) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
@@ -0,0 +1,11 @@
1
+ import { ReactNode } from "react";
2
+ import { TreeApi } from "../interfaces/tree-api";
3
+ import { IdObj } from "../types/utils";
4
+ import { TreeProps } from "../types/tree-props";
5
+ declare type Props<T extends IdObj> = {
6
+ treeProps: TreeProps<T>;
7
+ imperativeHandle: React.Ref<TreeApi<T> | undefined>;
8
+ children: ReactNode;
9
+ };
10
+ export declare function TreeProvider<T extends IdObj>({ treeProps, imperativeHandle, children, }: Props<T>): JSX.Element;
11
+ export {};
@@ -0,0 +1,8 @@
1
+ import React from "react";
2
+ import { IdObj } from "../types/utils";
3
+ declare type Props = {
4
+ style: React.CSSProperties;
5
+ index: number;
6
+ };
7
+ export declare const RowContainer: React.MemoExoticComponent<(<T extends IdObj>({ index, style, }: Props) => JSX.Element)>;
8
+ export {};
@@ -0,0 +1,2 @@
1
+ /// <reference types="react" />
2
+ export declare function TreeContainer(): JSX.Element;
@@ -1,4 +1,5 @@
1
- import { ReactElement } from "react";
2
- import { TreeApi } from "../tree-api";
3
- import { IdObj, TreeProps } from "../types";
4
- export declare const Tree: <T extends IdObj>(props: TreeProps<T> & import("react").RefAttributes<TreeApi<T>>) => ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
1
+ /// <reference types="react" />
2
+ import { TreeApi } from "../interfaces/tree-api";
3
+ import { TreeProps } from "../types/tree-props";
4
+ import { IdObj } from "../types/utils";
5
+ export declare const Tree: <T extends IdObj>(props: TreeProps<T> & import("react").RefAttributes<TreeApi<T> | undefined>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
package/dist/context.d.ts CHANGED
@@ -1,5 +1,23 @@
1
1
  import React from "react";
2
- import { TreeApi } from "./tree-api";
3
- import { IdObj } from "./types";
2
+ import { TreeApi } from "./interfaces/tree-api";
3
+ import { IdObj } from "./types/utils";
4
4
  export declare const TreeApiContext: React.Context<TreeApi<any> | null>;
5
5
  export declare function useTreeApi<T extends IdObj>(): TreeApi<T>;
6
+ export declare const NodesContext: React.Context<import("redux").CombinedState<{
7
+ focus: import("./state/focus-slice").FocusState;
8
+ edit: import("./state/edit-slice").EditState;
9
+ open: import("./state/open-slice").OpenSlice;
10
+ selection: import("./state/selection-slice").SelectionState;
11
+ drag: import("./state/drag-slice").DragSlice;
12
+ }> | null>;
13
+ export declare function useNodesContext(): import("redux").CombinedState<{
14
+ focus: import("./state/focus-slice").FocusState;
15
+ edit: import("./state/edit-slice").EditState;
16
+ open: import("./state/open-slice").OpenSlice;
17
+ selection: import("./state/selection-slice").SelectionState;
18
+ drag: import("./state/drag-slice").DragSlice;
19
+ }>;
20
+ export declare const DndContext: React.Context<import("./state/dnd-slice").DndState | null>;
21
+ export declare function useDndContext(): import("./state/dnd-slice").DndState;
22
+ export declare const DataUpdatesContext: React.Context<number>;
23
+ export declare function useDataUpdates(): void;
@@ -0,0 +1,5 @@
1
+ import { NodeApi } from "../interfaces/node-api";
2
+ import { IdObj } from "../types/utils";
3
+ export declare const createIndex: <T extends IdObj>(nodes: NodeApi<T>[]) => {
4
+ [id: string]: number;
5
+ };
@@ -0,0 +1,4 @@
1
+ import { NodeApi } from "../interfaces/node-api";
2
+ import { TreeApi } from "../interfaces/tree-api";
3
+ import { IdObj } from "../types/utils";
4
+ export declare function createList<T extends IdObj>(tree: TreeApi<T>): NodeApi<T>[];
@@ -0,0 +1,5 @@
1
+ import { IdObj } from "../types/utils";
2
+ import { NodeApi } from "../interfaces/node-api";
3
+ import { TreeApi } from "../interfaces/tree-api";
4
+ export declare const ROOT_ID = "__REACT_ARBORIST_INTERNAL_ROOT__";
5
+ export declare function createRoot<T extends IdObj>(tree: TreeApi<T>): NodeApi<T>;
@@ -1,2 +1,4 @@
1
- import { Node } from "../types";
2
- export declare function flattenTree<T>(root: Node<T>): Node<T>[];
1
+ import { NodeApi } from "../interfaces/node-api";
2
+ import { IdObj } from "../types/utils";
3
+ export declare function flattenTree<T extends IdObj>(root: NodeApi<T>): NodeApi<T>[];
4
+ export declare function filterTree<T extends IdObj>(root: NodeApi<T>, isMatch: (n: NodeApi<T>) => boolean): NodeApi<T>[];
@@ -0,0 +1,43 @@
1
+ declare type IdObj = {
2
+ id: string;
3
+ children?: IdObj[];
4
+ };
5
+ export declare class SimpleTree<T extends IdObj> {
6
+ root: SimpleNode<T>;
7
+ constructor(data: T[]);
8
+ get data(): T[];
9
+ create(args: {
10
+ parentId: string | null;
11
+ index: number;
12
+ data: T;
13
+ }): null | undefined;
14
+ move(args: {
15
+ id: string;
16
+ parentId: string | null;
17
+ index: number;
18
+ }): void;
19
+ update(args: {
20
+ id: string;
21
+ changes: Partial<T>;
22
+ }): void;
23
+ drop(args: {
24
+ id: string;
25
+ }): void;
26
+ find(id: string, node?: SimpleNode<T>): SimpleNode<T> | null;
27
+ }
28
+ declare class SimpleNode<T extends IdObj> {
29
+ data: T;
30
+ parent: SimpleNode<T> | null;
31
+ id: string;
32
+ children?: SimpleNode<T>[];
33
+ constructor(data: T, parent: SimpleNode<T> | null);
34
+ hasParent(): this is this & {
35
+ parent: SimpleNode<T>;
36
+ };
37
+ get childIndex(): number;
38
+ addChild(data: T, index: number): void;
39
+ removeChild(index: number): void;
40
+ update(changes: Partial<T>): void;
41
+ drop(): void;
42
+ }
43
+ export {};
@@ -1,13 +1,13 @@
1
1
  import { XYCoord } from "react-dnd";
2
- import { Node } from "../types";
2
+ import { NodeApi } from "../interfaces/node-api";
3
3
  import { DropResult } from "./drop-hook";
4
4
  declare type Args = {
5
5
  element: HTMLElement;
6
6
  offset: XYCoord;
7
7
  indent: number;
8
- node: Node | null;
9
- prevNode: Node | null;
10
- nextNode: Node | null;
8
+ node: NodeApi | null;
9
+ prevNode: NodeApi | null;
10
+ nextNode: NodeApi | null;
11
11
  };
12
12
  export declare type ComputedDrop = {
13
13
  drop: DropResult | null;
@@ -1,5 +1,4 @@
1
1
  import { ConnectDragSource } from "react-dnd";
2
- import { Node } from "../types";
3
- export declare function useDragHook(node: Node): [{
4
- isDragging: boolean;
5
- }, ConnectDragSource];
2
+ import { NodeApi } from "../interfaces/node-api";
3
+ import { IdObj } from "../types/utils";
4
+ export declare function useDragHook<T extends IdObj>(node: NodeApi<T>): ConnectDragSource;
@@ -1,9 +1,8 @@
1
1
  import { RefObject } from "react";
2
2
  import { ConnectDropTarget } from "react-dnd";
3
- import { Node } from "../types";
3
+ import { NodeApi } from "../interfaces/node-api";
4
4
  export declare type DropResult = {
5
5
  parentId: string | null;
6
6
  index: number;
7
7
  };
8
- export declare type CollectedProps = undefined;
9
- export declare function useDropHook(el: RefObject<HTMLElement | null>, node: Node, prev: Node | null, next: Node | null): [CollectedProps, ConnectDropTarget];
8
+ export declare function useDropHook(el: RefObject<HTMLElement | null>, node: NodeApi<any>): ConnectDropTarget;
@@ -0,0 +1,2 @@
1
+ import { IdObj } from "../types/utils";
2
+ export declare function useFreshNode<T extends IdObj>(index: number): import("..").NodeApi<T>;
@@ -0,0 +1,13 @@
1
+ import { CreateHandler, DeleteHandler, MoveHandler, RenameHandler } from "../types/handlers";
2
+ import { IdObj } from "../types/utils";
3
+ export declare type SimpleTreeData = {
4
+ id: string;
5
+ name: string;
6
+ children?: SimpleTreeData[];
7
+ };
8
+ export declare function useSimpleTree<T extends IdObj>(initialData: T[]): readonly [T[], {
9
+ onMove: MoveHandler;
10
+ onRename: RenameHandler;
11
+ onCreate: CreateHandler;
12
+ onDelete: DeleteHandler;
13
+ }];
@@ -0,0 +1,24 @@
1
+ declare type Data = {
2
+ id: string;
3
+ name: string;
4
+ children?: Data[];
5
+ };
6
+ export declare function useUncontrolledTree(initialData: Data[]): readonly [Data[], {
7
+ move: (args: {
8
+ dragIds: string[];
9
+ parentId: string;
10
+ index: number;
11
+ }) => void;
12
+ rename: (args: {
13
+ id: string;
14
+ name: string;
15
+ }) => void;
16
+ create: ({ parentId, index }: {
17
+ parentId: string;
18
+ index: number;
19
+ }) => Data;
20
+ drop: (args: {
21
+ id: string;
22
+ }) => void;
23
+ }];
24
+ export {};
@@ -0,0 +1,3 @@
1
+ import { TreeProps } from "../types/tree-props";
2
+ import { IdObj } from "../types/utils";
3
+ export declare function useValidatedProps<T extends IdObj>(props: TreeProps<T>): TreeProps<T>;
package/dist/index.d.ts CHANGED
@@ -1,4 +1,8 @@
1
- import { Tree } from "./components/tree";
2
- import { TreeApi } from "./tree-api";
3
- import type { NodeRenderer, NodeState, NodeHandlers, NodeRendererProps, DropCursorProps } from "./types";
4
- export { Tree, TreeApi, NodeRenderer, NodeState, NodeHandlers, NodeRendererProps, DropCursorProps, };
1
+ export { Tree } from "./components/tree";
2
+ export * from "./types/handlers";
3
+ export * from "./types/renderers";
4
+ export * from "./types/state";
5
+ export * from "./interfaces/node-api";
6
+ export * from "./interfaces/tree-api";
7
+ export * from "./data/simple-tree";
8
+ export * from "./hooks/use-simple-tree";