@apia/tree 0.2.2 → 0.3.0
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.
- package/LICENSE.md +20 -20
- package/README.md +27 -27
- package/cleanDist.json +3 -0
- package/dist/index.d.ts +76 -13
- package/dist/index.js +391 -150
- package/dist/index.js.map +1 -1
- package/package.json +6 -6
package/LICENSE.md
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) [year] [fullname]
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) [year] [fullname]
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
21
|
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
# Initiator
|
|
2
|
-
|
|
3
|
-
Este package se creó con la única utilidad de copiarlo entero y pegarlo a la hora de crear un nuevo package.
|
|
4
|
-
|
|
5
|
-
Este iniciador permite crear un paquete que compila typescript y puede ser importado desde otros packages.
|
|
6
|
-
|
|
7
|
-
## IMPORTANTE
|
|
8
|
-
|
|
9
|
-
Los archivos **tsconfig.json** y **tsup.config.ts** no son archivos únicos sino symlinks a archivos de configuración comunes a todos los packages. En caso de que sea necesario modificar alguno de ellos **que en la gran mayoría de los casos no sería necesario**, es necesario eliminar el archivo a modificar y crear uno nuevo.
|
|
10
|
-
|
|
11
|
-
## Procedimiento
|
|
12
|
-
|
|
13
|
-
- Copiar la carpeta initiator y pegarla con otro nombre dentro de packages.
|
|
14
|
-
- Modificar el package.json:
|
|
15
|
-
- Eliminar la línea ```private: true```.
|
|
16
|
-
- Cambiar la ocurrencia `initiator` por el nombre del nuevo paquete.
|
|
17
|
-
- Agregar los scripts convenientes: dev, build, etc.
|
|
18
|
-
- Ejecutar el comando lerna bootstrap desde la carpeta raíz.
|
|
19
|
-
|
|
20
|
-
Luego de ejecutar estos pasos, el package estaría listo para comenzar a usarse.
|
|
21
|
-
|
|
22
|
-
Este package trae como dependencias por defecto theme-ui y react. Si se desea agregar más dependencias se debe ejecutar el comando ```lerna add --scope="@apia/packageName" dependencyName```. Ejemplo, si creamos un paquete con el nombre @apia/myPackage y queremos agregar lodash como dependencia, ejecutamos el comando ```lerna add --scope="@apia/myPackage" lodash```.
|
|
23
|
-
|
|
24
|
-
**Importante 1**: Dado que estamos desarrollando packages, es importante determinar si las dependencias que vamos a agregar son de tipo dependency o de tipo peerDependency.
|
|
25
|
-
|
|
26
|
-
**Importante 2**: lerna no permite instalar de a varias dependencias a la vez como lo hace npm, por lo tanto, si se desea agregar varias dependencias se debe ejecutar el comando anterior tantas veces como dependencias se quiera agregar.
|
|
27
|
-
|
|
1
|
+
# Initiator
|
|
2
|
+
|
|
3
|
+
Este package se creó con la única utilidad de copiarlo entero y pegarlo a la hora de crear un nuevo package.
|
|
4
|
+
|
|
5
|
+
Este iniciador permite crear un paquete que compila typescript y puede ser importado desde otros packages.
|
|
6
|
+
|
|
7
|
+
## IMPORTANTE
|
|
8
|
+
|
|
9
|
+
Los archivos **tsconfig.json** y **tsup.config.ts** no son archivos únicos sino symlinks a archivos de configuración comunes a todos los packages. En caso de que sea necesario modificar alguno de ellos **que en la gran mayoría de los casos no sería necesario**, es necesario eliminar el archivo a modificar y crear uno nuevo.
|
|
10
|
+
|
|
11
|
+
## Procedimiento
|
|
12
|
+
|
|
13
|
+
- Copiar la carpeta initiator y pegarla con otro nombre dentro de packages.
|
|
14
|
+
- Modificar el package.json:
|
|
15
|
+
- Eliminar la línea ```private: true```.
|
|
16
|
+
- Cambiar la ocurrencia `initiator` por el nombre del nuevo paquete.
|
|
17
|
+
- Agregar los scripts convenientes: dev, build, etc.
|
|
18
|
+
- Ejecutar el comando lerna bootstrap desde la carpeta raíz.
|
|
19
|
+
|
|
20
|
+
Luego de ejecutar estos pasos, el package estaría listo para comenzar a usarse.
|
|
21
|
+
|
|
22
|
+
Este package trae como dependencias por defecto theme-ui y react. Si se desea agregar más dependencias se debe ejecutar el comando ```lerna add --scope="@apia/packageName" dependencyName```. Ejemplo, si creamos un paquete con el nombre @apia/myPackage y queremos agregar lodash como dependencia, ejecutamos el comando ```lerna add --scope="@apia/myPackage" lodash```.
|
|
23
|
+
|
|
24
|
+
**Importante 1**: Dado que estamos desarrollando packages, es importante determinar si las dependencias que vamos a agregar son de tipo dependency o de tipo peerDependency.
|
|
25
|
+
|
|
26
|
+
**Importante 2**: lerna no permite instalar de a varias dependencias a la vez como lo hace npm, por lo tanto, si se desea agregar varias dependencias se debe ejecutar el comando anterior tantas veces como dependencias se quiera agregar.
|
|
27
|
+
|
|
28
28
|
**Importante 3**: React y theme-ui vienen instalados como peerDependencies. En caso de no ser necesarios pueden ser removidos, pero en cualquier caso asegurarse de que estas dependencias no sean instaladas como dependencies puesto que esto causaría comportamientos indeseados en la aplicación.
|
package/cleanDist.json
ADDED
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import React__default, { RefObject } from 'react';
|
|
3
|
+
import { EventEmitter, PropsStore, TModify, TRequireOnlyOne, TUpdateFieldConfiguration, TPropsConfiguration, HashedEventEmitter, TId as TId$1 } from '@apia/util';
|
|
3
4
|
import { TIconName } from '@apia/icons';
|
|
4
5
|
|
|
5
6
|
declare function useTreeDataController<TreeType extends TreeDataController<any, any> = TreeDataController<any, any>>(name: string): TreeType;
|
|
@@ -35,6 +36,7 @@ declare class TreeDataController<NodeProps extends Record<string, unknown> = Rec
|
|
|
35
36
|
* método batchInit y luego de finalizar, al método batchFinish()
|
|
36
37
|
*/
|
|
37
38
|
batchInit(): void;
|
|
39
|
+
private getNodesRecursive;
|
|
38
40
|
/**
|
|
39
41
|
* Cuando se quieren agregar muchos nodos, es conveniente llamar primero al
|
|
40
42
|
* método batchInit y luego de finalizar, al método batchFinish()
|
|
@@ -55,7 +57,7 @@ declare class TreeDataController<NodeProps extends Record<string, unknown> = Rec
|
|
|
55
57
|
* Este método permite controlar el comportamiento con el teclado desde fuera
|
|
56
58
|
* del componente.
|
|
57
59
|
*/
|
|
58
|
-
handleKey(ev:
|
|
60
|
+
handleKey(ev: React__default.KeyboardEvent): void;
|
|
59
61
|
isNode(node: NodeType | TDataNodeContainer<NodeProps> | TId): node is NodeType;
|
|
60
62
|
isNodeContainer(node: NodeType | TDataNodeContainer<NodeProps> | TId): node is TDataNodeContainer<NodeProps>;
|
|
61
63
|
includes(searchNode: NodeType): boolean;
|
|
@@ -81,7 +83,7 @@ declare class TreeDataController<NodeProps extends Record<string, unknown> = Rec
|
|
|
81
83
|
selectAll(): void;
|
|
82
84
|
setFocusedNode(key: TId, avoidSelection?: boolean): void;
|
|
83
85
|
setSelectedNodes(nodes: TId[], force?: boolean): void;
|
|
84
|
-
setSelectedNodesByClickEvent(ev:
|
|
86
|
+
setSelectedNodesByClickEvent(ev: React__default.MouseEvent): void;
|
|
85
87
|
setState(updateProps: Partial<TTreeDataControllerState>, conf?: TUpdateFieldConfiguration): void;
|
|
86
88
|
toggleNodeExpandedState(key: TId, shouldExpand?: boolean): void;
|
|
87
89
|
toggleNodeSelectedState(key: TId, isSelected?: boolean): void;
|
|
@@ -121,7 +123,7 @@ type TTreeDataControllerState = {
|
|
|
121
123
|
length: number;
|
|
122
124
|
selectedNodes: TId[];
|
|
123
125
|
};
|
|
124
|
-
type TTreeLabelRenderer<NodeProps extends Record<string, unknown> = Record<string, unknown>> =
|
|
126
|
+
type TTreeLabelRenderer<NodeProps extends Record<string, unknown> = Record<string, unknown>> = React__default.FunctionComponent<TDataNode<NodeProps> & {
|
|
125
127
|
level: number;
|
|
126
128
|
}>;
|
|
127
129
|
type TNodesExpandEvent<NodeProps extends Record<string, unknown> = Record<string, unknown>> = TDataNode<NodeProps>;
|
|
@@ -196,7 +198,7 @@ type TTreeProps<NodeProps extends Record<string, unknown> = Record<string, unkno
|
|
|
196
198
|
* Cada vez que se hace click sobre un nodo o se presiona enter estando
|
|
197
199
|
* éste en foco, se llama este callback informando de la acción.
|
|
198
200
|
*/
|
|
199
|
-
onNodeClick: (ev:
|
|
201
|
+
onNodeClick: (ev: React__default.KeyboardEvent | React__default.MouseEvent, node: NodeType) => unknown;
|
|
200
202
|
onSelect: (ev: TNodesSelectionEvent<NodeProps>) => unknown;
|
|
201
203
|
/**
|
|
202
204
|
* Si se pasa onFocus, el nodo será seleccionado al recibir foco (por
|
|
@@ -211,7 +213,7 @@ type TTreeProps<NodeProps extends Record<string, unknown> = Record<string, unkno
|
|
|
211
213
|
toggleNodesOnLabelClick: boolean;
|
|
212
214
|
variant: string;
|
|
213
215
|
}>;
|
|
214
|
-
type TTreeIconRenderer<NodeProps extends Record<string, unknown> = Record<string, unknown>> =
|
|
216
|
+
type TTreeIconRenderer<NodeProps extends Record<string, unknown> = Record<string, unknown>> = React__default.FunctionComponent<TDataNode<NodeProps>>;
|
|
215
217
|
type TDataNode<NodeProps extends Record<string, unknown> = Record<string, unknown>> = {
|
|
216
218
|
actualParentId?: TId;
|
|
217
219
|
children: TId[];
|
|
@@ -301,7 +303,7 @@ type TDataNode<NodeProps extends Record<string, unknown> = Record<string, unknow
|
|
|
301
303
|
title: string;
|
|
302
304
|
}>;
|
|
303
305
|
|
|
304
|
-
declare const _default: <NodeProps extends Record<string, unknown> = Record<string, unknown>, NodeType extends TDataNode<NodeProps> = TDataNode<NodeProps>>(props: TTreeProps<NodeProps, NodeType>) =>
|
|
306
|
+
declare const _default: <NodeProps extends Record<string, unknown> = Record<string, unknown>, NodeType extends TDataNode<NodeProps> = TDataNode<NodeProps>>(props: TTreeProps<NodeProps, NodeType>) => React__default.JSX.Element;
|
|
305
307
|
|
|
306
308
|
type TTreeContext<NodeProps extends Record<string, unknown> = Record<string, unknown>, NodeType extends TDataNode<NodeProps> = TDataNode<NodeProps>> = {
|
|
307
309
|
forceUpdate: number;
|
|
@@ -323,11 +325,72 @@ declare function useTreeData<NodeProps extends Record<string, unknown> = Record<
|
|
|
323
325
|
handler: TreeDataController<NodeProps, NodeType>;
|
|
324
326
|
keyHandler: {
|
|
325
327
|
id: string;
|
|
326
|
-
onKeyDown: (ev:
|
|
327
|
-
onMouseDown: (ev:
|
|
328
|
-
onClick: (ev:
|
|
329
|
-
ref:
|
|
328
|
+
onKeyDown: (ev: React__default.KeyboardEvent) => void;
|
|
329
|
+
onMouseDown: (ev: React__default.MouseEvent) => void;
|
|
330
|
+
onClick: (ev: React__default.MouseEvent) => void;
|
|
331
|
+
ref: React__default.MutableRefObject<HTMLDivElement | null>;
|
|
330
332
|
};
|
|
331
333
|
};
|
|
332
334
|
|
|
333
|
-
|
|
335
|
+
type PrefixMapEntry = {
|
|
336
|
+
nodeId: TId;
|
|
337
|
+
prefix: string;
|
|
338
|
+
};
|
|
339
|
+
type TOOTreeNodeProps<NodeProps extends Record<string, unknown> = Record<string, unknown>> = Omit<TDataNode<NodeProps>, 'actualParentId' | 'parentId' | 'children' | 'hasLoaded'>;
|
|
340
|
+
|
|
341
|
+
declare function isOOTreeNode<NodeProps extends Record<string, unknown> = Record<string, unknown>>(element: OOTreeNode<NodeProps> | TDataNode<NodeProps>): element is OOTreeNode<NodeProps>;
|
|
342
|
+
declare class OOTreeNode<NodeProps extends Record<string, unknown> = Record<string, unknown>> {
|
|
343
|
+
#private;
|
|
344
|
+
protected tree: OOTree<NodeProps>;
|
|
345
|
+
protected parent: OOTreeNode<NodeProps> | TDataNode<NodeProps> | null;
|
|
346
|
+
protected props: TOOTreeNodeProps<NodeProps>;
|
|
347
|
+
id: string;
|
|
348
|
+
prefix: string;
|
|
349
|
+
constructor(tree: OOTree<NodeProps>, parent: OOTreeNode<NodeProps> | TDataNode<NodeProps> | null, props: TOOTreeNodeProps<NodeProps>);
|
|
350
|
+
attachToTree(): void;
|
|
351
|
+
append(props: TOOTreeNodeProps<NodeProps>): OOTreeNode<NodeProps>;
|
|
352
|
+
getAll(): (() => OOTreeNode<NodeProps> | undefined)[];
|
|
353
|
+
getById(id: TId): OOTreeNode<NodeProps> | undefined;
|
|
354
|
+
getParent(): OOTreeNode<NodeProps> | null;
|
|
355
|
+
getProps(): TDataNode<NodeProps>;
|
|
356
|
+
remove(): void;
|
|
357
|
+
update(props: Partial<Omit<TOOTreeNodeProps<NodeProps>, 'id'>>): void;
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
declare class OOTreeChildren<NodeProps extends Record<string, unknown> = Record<string, unknown>> extends OOTreeNode<NodeProps> {
|
|
361
|
+
protected tree: OOTree<NodeProps>;
|
|
362
|
+
constructor(tree: OOTree<NodeProps>);
|
|
363
|
+
}
|
|
364
|
+
|
|
365
|
+
declare class OOTree<NodeProps extends Record<string, unknown> = Record<string, unknown>, Events extends Record<string, unknown> = Record<string, unknown>, HashEvents extends Record<string, unknown> = Record<string, unknown>> extends HashedEventEmitter<Events, HashEvents> {
|
|
366
|
+
#private;
|
|
367
|
+
label: string;
|
|
368
|
+
name: string;
|
|
369
|
+
constructor(label: string, name: string, hashMethod: (hash: HashEvents) => string, onReady?: () => unknown);
|
|
370
|
+
getChildren(): OOTreeChildren<NodeProps>;
|
|
371
|
+
getController(): TreeDataController<NodeProps, TDataNode<NodeProps>>;
|
|
372
|
+
/**
|
|
373
|
+
* Component
|
|
374
|
+
*/
|
|
375
|
+
private getHandler;
|
|
376
|
+
Component: () => React.JSX.Element;
|
|
377
|
+
/**
|
|
378
|
+
* Data manipulation
|
|
379
|
+
*/
|
|
380
|
+
private prefixJoinCharacter;
|
|
381
|
+
private prefixWithIdJoinCharacter;
|
|
382
|
+
protected prefixesMap: Record<string, PrefixMapEntry>;
|
|
383
|
+
/**
|
|
384
|
+
* Calcula el prefijo de un nodo que se está agregando al árbol evitando
|
|
385
|
+
* colisiones. Ese prefijo estará asociado a cada nodo y se utilizará para dar
|
|
386
|
+
* nombres únicos a sus hijos, no para el nodo en sí. Entonces, cada vez que
|
|
387
|
+
* se construye un nodo, se le asigna un prefijo considerando el prefijo de su
|
|
388
|
+
* padre, pero su nombre se hace a partir del prefijo del padre y su id.
|
|
389
|
+
*/
|
|
390
|
+
calculateNodePrefix: (id: TId$1, prefix?: string) => {
|
|
391
|
+
prefix: string;
|
|
392
|
+
id: string;
|
|
393
|
+
};
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
export { OOTree, OOTreeNode, TDataNode, TTreeLabelRenderer, TTreeProps, _default as Tree, TreeDataController, isOOTreeNode, useTreeContext, useTreeData, useTreeDataController, useTreeSelector, useTreeSelectorByName };
|