From d17e4b68f9d56621ba5b185c54b041a4be5522a8 Mon Sep 17 00:00:00 2001 From: Lukas Maurer Date: Thu, 9 Mar 2023 14:36:30 +0100 Subject: [PATCH 1/2] feat(core/tree): add node clicked and toggled events --- packages/core/component-doc.json | 18 ++++++++++++++++++ packages/core/src/components.d.ts | 8 ++++++++ packages/core/src/components/tree/tree.tsx | 12 ++++++++++++ packages/vue/src/components.ts | 2 ++ 4 files changed, 40 insertions(+) diff --git a/packages/core/component-doc.json b/packages/core/component-doc.json index 2db85c000f6..76b3ba1de30 100644 --- a/packages/core/component-doc.json +++ b/packages/core/component-doc.json @@ -8666,6 +8666,15 @@ "docs": "Context changed", "docsTags": [] }, + { + "event": "nodeClicked", + "detail": "string", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": "Node clicked event", + "docsTags": [] + }, { "event": "nodeRemoved", "detail": "any", @@ -8674,6 +8683,15 @@ "composed": true, "docs": "Emits removed nodes", "docsTags": [] + }, + { + "event": "nodeToggled", + "detail": "{ id: string; isExpaned: boolean; }", + "bubbles": true, + "cancelable": true, + "composed": true, + "docs": "Node toggled event", + "docsTags": [] } ], "styles": [], diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts index 76dcbf98a8f..f0625210758 100644 --- a/packages/core/src/components.d.ts +++ b/packages/core/src/components.d.ts @@ -3814,10 +3814,18 @@ declare namespace LocalJSX { * Context changed */ "onContextChange"?: (event: IxTreeCustomEvent) => void; + /** + * Node clicked event + */ + "onNodeClicked"?: (event: IxTreeCustomEvent) => void; /** * Emits removed nodes */ "onNodeRemoved"?: (event: IxTreeCustomEvent) => void; + /** + * Node toggled event + */ + "onNodeToggled"?: (event: IxTreeCustomEvent<{ id: string; isExpaned: boolean }>) => void; /** * Render function of tree items */ diff --git a/packages/core/src/components/tree/tree.tsx b/packages/core/src/components/tree/tree.tsx index 7bf16c638f7..6788cada786 100644 --- a/packages/core/src/components/tree/tree.tsx +++ b/packages/core/src/components/tree/tree.tsx @@ -67,6 +67,16 @@ export class Tree { */ @Event() contextChange: EventEmitter; + /** + * Node toggled event + */ + @Event() nodeToggled: EventEmitter<{ id: string; isExpaned: boolean }>; + + /** + * Node clicked event + */ + @Event() nodeClicked: EventEmitter; + /** * Emits removed nodes */ @@ -96,6 +106,7 @@ export class Tree { e.stopPropagation(); const context = this.getContext(list[index].id); context.isExpanded = !context.isExpanded; + this.nodeToggled.emit({ id: item.id, isExpaned: context.isExpanded }); this.setContext(item.id, context); }; el.addEventListener('toggle', toggleCallback); @@ -160,6 +171,7 @@ export class Tree { const context = this.getContext(item.id); context.isSelected = true; this.setContext(item.id, context); + this.nodeClicked.emit(item.id); }; el.addEventListener('itemClick', itemClickCallback); this.itemClickListener.set(el, itemClickCallback); diff --git a/packages/vue/src/components.ts b/packages/vue/src/components.ts index 6431b230ded..c2514c693cf 100644 --- a/packages/vue/src/components.ts +++ b/packages/vue/src/components.ts @@ -598,6 +598,8 @@ export const IxTree = /*@__PURE__*/ defineContainer('ix-tree', undef 'renderItem', 'context', 'contextChange', + 'nodeToggled', + 'nodeClicked', 'nodeRemoved' ]); From 4281b7bb114dcafd3425ead9786b8bb67ab28dd6 Mon Sep 17 00:00:00 2001 From: Lukas Maurer Date: Tue, 14 Mar 2023 14:27:10 +0100 Subject: [PATCH 2/2] docs(core/tree): add since tags --- packages/core/component-doc.json | 14 ++++++++++++-- packages/core/src/components.d.ts | 2 ++ packages/core/src/components/tree/tree.tsx | 2 ++ 3 files changed, 16 insertions(+), 2 deletions(-) diff --git a/packages/core/component-doc.json b/packages/core/component-doc.json index 76b3ba1de30..6387c586a95 100644 --- a/packages/core/component-doc.json +++ b/packages/core/component-doc.json @@ -8673,7 +8673,12 @@ "cancelable": true, "composed": true, "docs": "Node clicked event", - "docsTags": [] + "docsTags": [ + { + "name": "since", + "text": "1.5.0" + } + ] }, { "event": "nodeRemoved", @@ -8691,7 +8696,12 @@ "cancelable": true, "composed": true, "docs": "Node toggled event", - "docsTags": [] + "docsTags": [ + { + "name": "since", + "text": "1.5.0" + } + ] } ], "styles": [], diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts index f0625210758..1e2d5bcc381 100644 --- a/packages/core/src/components.d.ts +++ b/packages/core/src/components.d.ts @@ -3816,6 +3816,7 @@ declare namespace LocalJSX { "onContextChange"?: (event: IxTreeCustomEvent) => void; /** * Node clicked event + * @since 1.5.0 */ "onNodeClicked"?: (event: IxTreeCustomEvent) => void; /** @@ -3824,6 +3825,7 @@ declare namespace LocalJSX { "onNodeRemoved"?: (event: IxTreeCustomEvent) => void; /** * Node toggled event + * @since 1.5.0 */ "onNodeToggled"?: (event: IxTreeCustomEvent<{ id: string; isExpaned: boolean }>) => void; /** diff --git a/packages/core/src/components/tree/tree.tsx b/packages/core/src/components/tree/tree.tsx index 6788cada786..abbe7aa6c08 100644 --- a/packages/core/src/components/tree/tree.tsx +++ b/packages/core/src/components/tree/tree.tsx @@ -69,11 +69,13 @@ export class Tree { /** * Node toggled event + * @since 1.5.0 */ @Event() nodeToggled: EventEmitter<{ id: string; isExpaned: boolean }>; /** * Node clicked event + * @since 1.5.0 */ @Event() nodeClicked: EventEmitter;