Skip to content

Commit 3818b1b

Browse files
onekiloparseconekiloparsec
committed
Reformatting
Signed-off-by: Cédric Foellmi <cedric@onekiloparsec.dev>
1 parent 26d25fd commit 3818b1b

File tree

1 file changed

+43
-43
lines changed

1 file changed

+43
-43
lines changed

‎README.md

Lines changed: 43 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -86,25 +86,25 @@ You can get the list of `IPowerTreeNode` from the computed `slVueTree.nodes` pro
8686

8787
# Props
8888

89-
| prop | type | default | description |
90-
|------------------|--------------------|------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
91-
| value | IPowerTreeNodeModel[] | [] | An array of nodes to show. Each node is represented by `IPowerTreeNodeModel` interface |
92-
| allowMultiselect | Boolean | true | Disable or enable the multiselect feature |
93-
| allowToggleBranch | Boolean | true | Disable or enable the expand/collapse button |
94-
| edgeSize | Number | 3 | Offset in pixels from top and bottom for folder-node element. While dragging cursor is in that offset, the dragging node will be placed before or after the folder-node instead of being placed inside the folder. |
95-
| scrollAreaHeight | Number | 70 | Offset in pixels from top and bottom for the component element. While dragging cursor is in that area, the scrolling starts. |
96-
| maxScrollSpeed | Number | 20 | The scroll speed is relative to the cursor position. Defines the max scroll speed.
97-
| multiselectKey | String/String[] |['ctrlKey', 'metaKey'] | The keys for multiselect mode. Allowed values are ['ctrlKey', 'metaKey', 'altKey']
89+
| prop | type | default | description |
90+
|-------------------|-----------------------|------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
91+
| value | IPowerTreeNodeModel[] | [] | An array of nodes to show. Each node is represented by `IPowerTreeNodeModel` interface |
92+
| allowMultiselect | Boolean | true | Disable or enable the multiselect feature |
93+
| allowToggleBranch | Boolean | true | Disable or enable the expand/collapse button |
94+
| edgeSize | Number | 3 | Offset in pixels from top and bottom for folder-node element. While dragging cursor is in that offset, the dragging node will be placed before or after the folder-node instead of being placed inside the folder. |
95+
| scrollAreaHeight | Number | 70 | Offset in pixels from top and bottom for the component element. While dragging cursor is in that area, the scrolling starts. |
96+
| maxScrollSpeed | Number | 20 | The scroll speed is relative to the cursor position. Defines the max scroll speed.
97+
| multiselectKey | String/String[] | ['ctrlKey', 'metaKey'] | The keys for multiselect mode. Allowed values are ['ctrlKey', 'metaKey', 'altKey']
9898

9999
# Computed props
100100

101-
| prop | type | description |
102-
|----------------|-----------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
103-
| nodes | IPowerTreeNode[] | List of nodes with some computed props. See `IPowerTreeNode` interface. |
104-
| cursorPosition | ICursorPosition | Represents the current cursor position that describes the action that will be applied to the dragged node on `mouseup` event. See `ICursorPosition` interface |
105-
| selectionSize | Number | The count of selected nodes
106-
| dragSize | Number | The count of selected and draggable nodes
107-
| isDragging | Boolean | True if nodes are dragging
101+
| prop | type | description |
102+
|----------------|------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------|
103+
| nodes | IPowerTreeNode[] | List of nodes with some computed props. See `IPowerTreeNode` interface. |
104+
| cursorPosition | ICursorPosition | Represents the current cursor position that describes the action that will be applied to the dragged node on `mouseup` event. See `ICursorPosition` interface |
105+
| selectionSize | Number | The count of selected nodes
106+
| dragSize | Number | The count of selected and draggable nodes
107+
| isDragging | Boolean | True if nodes are dragging
108108

109109
````
110110
interface ICursorPosition<TDataType> {
@@ -115,44 +115,44 @@ interface ICursorPosition<TDataType> {
115115

116116
# Events
117117

118-
| event | callback arguments | description |
119-
|-----------------|----------------------------------------------------------------------------|---------------------------------------------------|
120-
| input | nodes: IPowerTreeNodeModel[] | triggers for any changes to `value` property |
121-
| select | selectedNodes: IPowerTreeNode[], event: MouseEvent | triggers when a node has been selected/deselected |
122-
| toggle | toggledNode: IPowerTreeNode, event: MouseEvent | triggers when a node has been collapsed/expanded |
123-
| drop | draggingNodes: IPowerTreeNode[], position: ICursorPosition, event: MouseEvent | triggers when dragging nodes have been dropped |
124-
| nodeclick | node: IPowerTreeNode, event: MouseEvent | handle `click` event on node |
125-
| nodedblclick | node: IPowerTreeNode, event: MouseEvent | handle `dblclick` event on node |
126-
| nodecontextmenu | node: IPowerTreeNode, event: MouseEvent | handle `contextmenu` event on node |
127-
| externaldrop | cursorPosition: ICursorPosition, event: MouseEvent | handle `drop` event for external items [demo](https://holiber.github.io/vue-power-tree/demo/externaldrag) |
118+
| event | callback arguments | description |
119+
|-----------------|-------------------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------|
120+
| input | nodes: IPowerTreeNodeModel[] | triggers for any changes to `value` property |
121+
| select | selectedNodes: IPowerTreeNode[], event: MouseEvent | triggers when a node has been selected/deselected |
122+
| toggle | toggledNode: IPowerTreeNode, event: MouseEvent | triggers when a node has been collapsed/expanded |
123+
| drop | draggingNodes: IPowerTreeNode[], position: ICursorPosition, event: MouseEvent | triggers when dragging nodes have been dropped |
124+
| nodeclick | node: IPowerTreeNode, event: MouseEvent | handle `click` event on node |
125+
| nodedblclick | node: IPowerTreeNode, event: MouseEvent | handle `dblclick` event on node |
126+
| nodecontextmenu | node: IPowerTreeNode, event: MouseEvent | handle `contextmenu` event on node |
127+
| externaldrop | cursorPosition: ICursorPosition, event: MouseEvent | handle `drop` event for external items [demo](https://holiber.github.io/vue-power-tree/demo/externaldrag) |
128128

129129
# Methods
130130

131131

132-
| method | description |
133-
|----------------------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------|
134-
| getNode(path: number[]): IPowerTreeNode | Find the node by using its path |
135-
| traverse(cb: (node: IPowerTreeNode, nodeModel: IPowerTreeNodeModel, siblings: IPowerTreeNodeModel[]) => boolean) | Helpful method to traverse all nodes. The traversing will be stopped if callback returns `false`. |
136-
| updateNode(path: number[], patch: Partial<IPowerTreeNodeModel>) | Update the node by using its path |
137-
| select(path: number[], addToSelection = false) | Select the node by using its path | |
138-
| getNodeEl(): HTMLElement | Get the node HTMLElement by using its path |
139-
| getSelected(): IPowerTreeNode[] | Get selected nodes |
140-
| insert(position: ICursorPosition, nodeModel: IPowerTreeNodeModel) | Insert nodes by the current cursor position. |
141-
| remove(paths: number[][]) | Remove nodes by paths. For example `.remove([[0,1], [0,2]])`
142-
| getFirstNode(): IPowerTreeNode | Get the first node in the tree |
143-
| getLastNode(): IPowerTreeNode | Get the last node in the tree
144-
| getNextNode(path: number[], filter?: (node: IPowerTreeNode<TDataType>) => boolean): IPowerTreeNode<TDataType>; | Get the next node. You can skip the next nodes by using `filter`
145-
| getPrevNode(path: number[], filter?: (node: IPowerTreeNode<TDataType>) => boolean): IPowerTreeNode<TDataType>; | Get the previous node. You can skip the previous nodes by using `filter`
132+
| method | description |
133+
|-------------------------------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------|
134+
| getNode(path: number[]): IPowerTreeNode | Find the node by using its path |
135+
| traverse(cb: (node: IPowerTreeNode, nodeModel: IPowerTreeNodeModel, siblings: IPowerTreeNodeModel[]) => boolean) | Helpful method to traverse all nodes. The traversing will be stopped if callback returns `false`. |
136+
| updateNode(path: number[], patch: Partial<IPowerTreeNodeModel>) | Update the node by using its path |
137+
| select(path: number[], addToSelection = false) | Select the node by using its path | |
138+
| getNodeEl(): HTMLElement | Get the node HTMLElement by using its path |
139+
| getSelected(): IPowerTreeNode[] | Get selected nodes |
140+
| insert(position: ICursorPosition, nodeModel: IPowerTreeNodeModel) | Insert nodes by the current cursor position. |
141+
| remove(paths: number[][]) | Remove nodes by paths. For example `.remove([[0,1], [0,2]])`
142+
| getFirstNode(): IPowerTreeNode | Get the first node in the tree |
143+
| getLastNode(): IPowerTreeNode | Get the last node in the tree
144+
| getNextNode(path: number[], filter?: (node: IPowerTreeNode<TDataType>) => boolean): IPowerTreeNode<TDataType>; | Get the next node. You can skip the next nodes by using `filter`
145+
| getPrevNode(path: number[], filter?: (node: IPowerTreeNode<TDataType>) => boolean): IPowerTreeNode<TDataType>; | Get the previous node. You can skip the previous nodes by using `filter`
146146

147147
# Slots
148148

149149

150-
| slot | context | description |
151-
|------------|-------------|-----------------------------------------------------------------------------------------------|
150+
| slot | context | description |
151+
|------------|----------------|-----------------------------------------------------------------------------------------------|
152152
| title | IPowerTreeNode | Slot for item title |
153153
| toggle | IPowerTreeNode | Slot for expand/collapse button |
154154
| sidebar | IPowerTreeNode | Sidebar content |
155-
| draginfo | PowerTree | Slot that follows the mouse cursor while dragging. By default shows the dragging nodes count. |
155+
| draginfo | PowerTree | Slot that follows the mouse cursor while dragging. By default shows the dragging nodes count. |
156156
| empty-node | IPowerTreeNode | Slot for (optional) message when folder is open, but empty |
157157

158158
# IE 11 support

0 commit comments

Comments
 (0)