vhad/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/gosticks/DefinitelyTyped.git synced 2026-10-04 23:07:06 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #28536 from jlismore/react-sortable-tree_getNodeAtPath

Browse Source 
[react-sortable-tree] Fix return signatures for helper functions
This commit is contained in:
Mine Starks
2018-09-05 09:27:10 -07:00
committed by GitHub
parent 517bc8b976 db5217c2e9
commit 4ba7facc8f
2 changed files with 63 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
types/react-sortable-tree/react-sortable-tree-tests.tsx
+61 -36
View File
@@ -1,27 +1,27 @@
import * as React from "react";
import SortableTree,
{
SortableTreeWithoutDndContext,
defaultGetNodeKey,
NodeRenderer,
TreeItem,
defaultSearchMethod,
SearchData,
NodeData,
ExtendedNodeData,
FullTree,
OnVisibilityToggleData,
OnDragPreviousAndNextLocation,
OnMovePreviousAndNextLocation,
PlaceholderRendererProps,
ThemeProps
} from "react-sortable-tree";
import SortableTree, {
defaultGetNodeKey,
defaultSearchMethod,
ExtendedNodeData,
FullTree,
getNodeAtPath,
NodeData,
NodeRenderer,
OnDragPreviousAndNextLocation,
OnMovePreviousAndNextLocation,
OnVisibilityToggleData,
PlaceholderRendererProps,
SearchData,
SortableTreeWithoutDndContext,
ThemeProps,
TreeItem
} from "react-sortable-tree";
import { ListProps, ListRowRenderer } from "react-virtualized";
class PlaceholderRenderer extends React.Component<PlaceholderRendererProps> {
render() {
const backgroundColor = this.props.isOver ? 'green' : 'red';
return <div style={{backgroundColor}}>Custom Placeholder class</div>;
const backgroundColor = this.props.isOver ? "green" : "red";
return <div style={{ backgroundColor }}>Custom Placeholder class</div>;
}
}
@@ -29,37 +29,59 @@ class Test extends React.Component {
render() {
const treeData = [
{
title: "Title", subtitle: "Subtitle", children: [
{title: "Child 1", subtitle: "Subtitle", children: []},
{title: "Child 2", subtitle: "Subtitle"}
title: "Title",
subtitle: "Subtitle",
children: [
{ title: "Child 1", subtitle: "Subtitle", children: [] },
{ title: "Child 2", subtitle: "Subtitle" }
]
}
];
const reactVirtualizedListProps: ListProps = {
width: 100, height: 44, rowCount: 3, rowHeight: 44, rowRenderer: "test" as any as ListRowRenderer
width: 100,
height: 44,
rowCount: 3,
rowHeight: 44,
rowRenderer: ("test" as any) as ListRowRenderer
};
const nodeRenderer: NodeRenderer = "test" as any as NodeRenderer;
const theme: ThemeProps = { nodeContentRenderer: nodeRenderer } as any as ThemeProps;
const nodeRenderer: NodeRenderer = ("test" as any) as NodeRenderer;
const theme: ThemeProps = ({
nodeContentRenderer: nodeRenderer
} as any) as ThemeProps;
const maybeNode = getNodeAtPath({
treeData,
path: [0, 1],
getNodeKey: defaultGetNodeKey
});
return (
<div>
<SortableTree
treeData={treeData}
onChange={(data: TreeItem[]) => {}}
style={{width: "100%"}}
style={{ width: "100%" }}
className="test-class"
innerStyle={{backgroundColor: "#3A3A3A"}}
innerStyle={{ backgroundColor: "#3A3A3A" }}
maxDepth={3}
searchMethod={defaultSearchMethod}
searchQuery={"Child 1"}
searchFocusOffset={1}
searchFinishCallback={(matches: NodeData[]) => { const firstTitle = matches[0].node.title; }}
generateNodeProps={(data: ExtendedNodeData) => ({buttons: [data.node.title]}) }
searchFinishCallback={(matches: NodeData[]) => {
const firstTitle = matches[0].node.title;
}}
generateNodeProps={(data: ExtendedNodeData) => ({
buttons: [data.node.title]
})}
getNodeKey={defaultGetNodeKey}
onMoveNode={(data: NodeData & FullTree & OnMovePreviousAndNextLocation) => {}}
onMoveNode={(
data: NodeData &
FullTree &
OnMovePreviousAndNextLocation
) => {}}
onVisibilityToggle={(data: OnVisibilityToggleData) => {}}
canDrag={true}
canDrop={(data: OnDragPreviousAndNextLocation & NodeData) => true}
canDrop={(data: OnDragPreviousAndNextLocation & NodeData) =>
true
}
reactVirtualizedListProps={reactVirtualizedListProps}
rowHeight={62}
slideRegionSize={100}
@@ -69,14 +91,17 @@ class Test extends React.Component {
dndType="testNodeType"
placeholderRenderer={PlaceholderRenderer}
theme={theme}
shouldCopyOnOutsideDrop={true}
shouldCopyOnOutsideDrop={true}
/>
<SortableTreeWithoutDndContext
treeData={[{title: "Title", subtitle: "Subtitle", children: []}]}
treeData={[
{ title: "Title", subtitle: "Subtitle", children: [] }
]}
onChange={(treeData: TreeItem[]) => {}}
style={{width: "100px"}}
shouldCopyOnOutsideDrop={() => false}
style={{ width: "100px" }}
shouldCopyOnOutsideDrop={() => false}
/>
<span>{maybeNode ? maybeNode.node.title : ""}</span>
</div>
);
}
types/react-sortable-tree/utils/tree-data-utils.d.ts
Vendored
+2 -2
View File
@@ -6,12 +6,12 @@ type FlattenedData = (TreeNode & TreePath & {lowerSiblingsCounts: number[]})[];
export function getDescendantCount(data: TreeNode & {ignoreCollapsed?: boolean}): number;
export function getVisibleNodeCount(data: FullTree): number;
export function getVisibleNodeInfoAtIndex(data: FullTree & {targetIndex: number, getNodeKey: GetNodeKeyFunction}): TreeNode & TreePath & {lowerSiblingsCounts: number[]};
export function getVisibleNodeInfoAtIndex(data: FullTree & {targetIndex: number, getNodeKey: GetNodeKeyFunction}): TreeNode & TreePath & {lowerSiblingsCounts: number[]} | null;
export function walk(data: WalkAndMapFunctionParameters): void;
export function map(data: WalkAndMapFunctionParameters): TreeItem[];
export function changeNodeAtPath(data: FullTree & TreePath & {newNode: Function | any, getNodeKey: GetNodeKeyFunction, ignoreCollapsed?: boolean}): TreeItem[];
export function removeNodeAtPath(data: FullTree & TreePath & {getNodeKey: GetNodeKeyFunction, ignoreCollapsed?: boolean}): TreeItem[];
export function getNodeAtPath(data: FullTree & TreePath & {getNodeKey: GetNodeKeyFunction, ignoreCollapsed?: boolean}): TreeItem | null;
export function getNodeAtPath(data: FullTree & TreePath & {getNodeKey: GetNodeKeyFunction, ignoreCollapsed?: boolean}): TreeNode & TreeIndex | null;
export function addNodeUnderParent(data: FullTree & {newNode: TreeItem, parentKey?: number | string, getNodeKey: GetNodeKeyFunction, ignoreCollapsed?: boolean, expandParent?: boolean}): FullTree & TreeIndex;
export function insertNode(data: FullTree & {depth: number, newNode: TreeItem, minimumTreeIndex: number, ignoreCollapsed?: boolean, expandParent?: boolean, getNodeKey: GetNodeKeyFunction}): FullTree & TreeIndex & TreePath & {parentNode: TreeItem};
export function getFlatDataFromTree(data: FullTree & {getNodeKey: GetNodeKeyFunction, ignoreCollapsed?: boolean}): (TreeNode & TreePath & {lowerSiblingsCounts: number[], parentNode: TreeItem})[];