@acorex/components 21.0.0-next.12 → 21.0.0-next.14

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/package.json CHANGED
@@ -1,9 +1,9 @@
1
1
  {
2
2
  "name": "@acorex/components",
3
- "version": "21.0.0-next.12",
3
+ "version": "21.0.0-next.14",
4
4
  "peerDependencies": {
5
- "@acorex/core": "21.0.0-next.12",
6
- "@acorex/cdk": "21.0.0-next.12",
5
+ "@acorex/core": "21.0.0-next.14",
6
+ "@acorex/cdk": "21.0.0-next.14",
7
7
  "@angular/common": "^20.0.0",
8
8
  "@angular/core": "^20.0.0",
9
9
  "@angular/cdk": "^20.0.0",
@@ -324,6 +324,10 @@
324
324
  "types": "./picker/index.d.ts",
325
325
  "default": "./fesm2022/acorex-components-picker.mjs"
326
326
  },
327
+ "./popover": {
328
+ "types": "./popover/index.d.ts",
329
+ "default": "./fesm2022/acorex-components-popover.mjs"
330
+ },
327
331
  "./popup": {
328
332
  "types": "./popup/index.d.ts",
329
333
  "default": "./fesm2022/acorex-components-popup.mjs"
@@ -332,10 +336,6 @@
332
336
  "types": "./progress-bar/index.d.ts",
333
337
  "default": "./fesm2022/acorex-components-progress-bar.mjs"
334
338
  },
335
- "./popover": {
336
- "types": "./popover/index.d.ts",
337
- "default": "./fesm2022/acorex-components-popover.mjs"
338
- },
339
339
  "./qrcode": {
340
340
  "types": "./qrcode/index.d.ts",
341
341
  "default": "./fesm2022/acorex-components-qrcode.mjs"
package/tree2/index.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _angular_core from '@angular/core';
2
2
  import { TemplateRef } from '@angular/core';
3
3
  import { AXEvent, AXHtmlEvent, AXValueChangedEvent } from '@acorex/cdk/common';
4
4
  import { AXDropListDroppedEvent } from '@acorex/cdk/drag-drop';
5
- import * as i1 from '@angular/common';
6
5
 
7
6
  /**
8
7
  * Tree2 Component - Design Tokens
@@ -57,7 +56,7 @@ import * as i1 from '@angular/common';
57
56
  * All color tokens use Acorex design system variables (`--ax-sys-color-*`) for automatic
58
57
  * light/dark mode support. Colors adapt based on the active theme without additional configuration.
59
58
  */
60
- interface AXTreeNodeOnBeforeDropEvent extends AXEvent {
59
+ interface AXTreeBeforeDropEvent extends AXEvent {
61
60
  movedNode: AXTreeNode;
62
61
  previousParent?: AXTreeNode;
63
62
  currentParent?: AXTreeNode;
@@ -79,7 +78,10 @@ interface AXTreeNode {
79
78
  loading?: boolean;
80
79
  data?: unknown;
81
80
  }
82
- interface AXTreeNodeEvent extends AXHtmlEvent {
81
+ interface AXTreeNodeToggleEvent extends AXHtmlEvent {
82
+ node: AXTreeNode;
83
+ }
84
+ interface AXTreeNodeSelectEvent extends AXHtmlEvent {
83
85
  node: AXTreeNode;
84
86
  }
85
87
  interface AXTreeDropEvent extends AXEvent {
@@ -99,21 +101,25 @@ interface AXTreeItemTemplateContext {
99
101
  }
100
102
  type AXTreeViewLook = 'default' | 'card' | 'with-line';
101
103
  type AXTreeDragMode = 'none' | 'handler' | 'item';
104
+ type AXTreeDragOperationType = 'order-only' | 'move' | 'both';
102
105
 
103
106
  declare class AXTree2Component {
104
107
  #private;
108
+ private readonly ROOT_LIST_ID;
109
+ private readonly NODE_DROP_PREFIX;
110
+ private readonly LIST_PREFIX;
105
111
  /** Tree data nodes */
106
112
  nodes: _angular_core.ModelSignal<AXTreeNode[]>;
107
113
  /** Whether to show checkboxes for selection */
108
114
  showCheckbox: _angular_core.InputSignal<boolean>;
109
115
  /** Drag and drop mode: 'none' (disabled), 'handler' (drag handle), 'item' (entire item) */
110
116
  dragMode: _angular_core.InputSignal<AXTreeDragMode>;
117
+ /** Drag operation type: 'order-only' (reorder only), 'move' (move between parents), 'both' (allow both) */
118
+ dragOperationType: _angular_core.InputSignal<AXTreeDragOperationType>;
111
119
  /** Whether to show icons */
112
120
  showIcons: _angular_core.InputSignal<boolean>;
113
121
  /** Whether to show children count badge */
114
122
  showChildrenBadge: _angular_core.InputSignal<boolean>;
115
- /** Whether to animate expand/collapse */
116
- animated: _angular_core.InputSignal<boolean>;
117
123
  /** Custom icon for expanded nodes */
118
124
  expandedIcon: _angular_core.InputSignal<string>;
119
125
  /** Custom icon for collapsed nodes */
@@ -131,13 +137,17 @@ declare class AXTree2Component {
131
137
  /** Whether to enable lazy loading */
132
138
  enableLazyLoad: _angular_core.InputSignal<boolean>;
133
139
  /** Emitted before a drop operation - set canceled to true to prevent drop */
134
- onBeforeDrop: _angular_core.OutputEmitterRef<AXTreeNodeOnBeforeDropEvent>;
140
+ onBeforeDrop: _angular_core.OutputEmitterRef<AXTreeBeforeDropEvent>;
135
141
  /** Emitted when a node is toggled (expanded/collapsed) */
136
- nodeToggle: _angular_core.OutputEmitterRef<AXTreeNodeEvent>;
142
+ onNodeToggle: _angular_core.OutputEmitterRef<AXTreeNodeToggleEvent>;
137
143
  /** Emitted when a node is selected/deselected */
138
- nodeSelect: _angular_core.OutputEmitterRef<AXTreeNodeEvent>;
139
- /** Emitted when a node is dropped */
140
- nodeDrop: _angular_core.OutputEmitterRef<AXTreeDropEvent>;
144
+ onNodeSelect: _angular_core.OutputEmitterRef<AXTreeNodeSelectEvent>;
145
+ /** Emitted when nodes are reordered within the same parent */
146
+ onOrderChange: _angular_core.OutputEmitterRef<AXTreeDropEvent>;
147
+ /** Emitted when a node is moved to a different parent */
148
+ onMoveChange: _angular_core.OutputEmitterRef<AXTreeDropEvent>;
149
+ /** Emitted for any item change (order or move) */
150
+ onItemsChange: _angular_core.OutputEmitterRef<AXTreeDropEvent>;
141
151
  /** Internal signal for tracking loading state */
142
152
  protected readonly loadingNodes: _angular_core.WritableSignal<Set<string>>;
143
153
  /**
@@ -217,6 +227,10 @@ declare class AXTree2Component {
217
227
  * Get count of selected nodes
218
228
  */
219
229
  getSelectedCount(): number;
230
+ /**
231
+ * Check if any nodes are selected
232
+ */
233
+ hasSelection(): boolean;
220
234
  /**
221
235
  * Recursively count selected nodes
222
236
  */
@@ -233,6 +247,26 @@ declare class AXTree2Component {
233
247
  * Delete selected nodes from the tree
234
248
  */
235
249
  deleteSelected(): void;
250
+ /**
251
+ * Select all nodes in the tree
252
+ */
253
+ selectAll(): void;
254
+ /**
255
+ * Deselect all nodes in the tree
256
+ */
257
+ deselectAll(): void;
258
+ /**
259
+ * Find a node by ID in the tree
260
+ */
261
+ findNode(id: string): AXTreeNode | null;
262
+ /**
263
+ * Refresh the tree to trigger change detection
264
+ */
265
+ refresh(): void;
266
+ /**
267
+ * Recursively set selection state for all nodes
268
+ */
269
+ private setAllSelection;
236
270
  /**
237
271
  * Recursively remove selected nodes
238
272
  */
@@ -253,15 +287,51 @@ declare class AXTree2Component {
253
287
  * Check if node should show expand toggle
254
288
  */
255
289
  shouldShowExpandToggle(node: AXTreeNode): boolean;
290
+ /**
291
+ * Check if node has children
292
+ */
293
+ private hasChildren;
294
+ /**
295
+ * Check if node can be lazy loaded
296
+ */
297
+ private canLazyLoad;
298
+ /**
299
+ * Check if move operation is allowed based on dragOperationType
300
+ */
301
+ private canMoveToParent;
302
+ /**
303
+ * Check if reorder operation is allowed based on dragOperationType
304
+ */
305
+ private canReorder;
306
+ /**
307
+ * Validate if drop target is valid (prevent circular references)
308
+ */
309
+ private isValidDropTarget;
310
+ /**
311
+ * Handle reordering within the same list
312
+ */
313
+ private handleReorder;
314
+ /**
315
+ * Handle moving between different lists
316
+ */
317
+ private handleMove;
318
+ /**
319
+ * Emit beforeDrop event and return whether to continue
320
+ */
321
+ private emitBeforeDropEvent;
322
+ /**
323
+ * Emit drop events based on operation type
324
+ */
325
+ private emitDropEvents;
256
326
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<AXTree2Component, never>;
257
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXTree2Component, "ax-tree2", never, { "nodes": { "alias": "nodes"; "required": true; "isSignal": true; }; "showCheckbox": { "alias": "showCheckbox"; "required": false; "isSignal": true; }; "dragMode": { "alias": "dragMode"; "required": false; "isSignal": true; }; "showIcons": { "alias": "showIcons"; "required": false; "isSignal": true; }; "showChildrenBadge": { "alias": "showChildrenBadge"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; "expandedIcon": { "alias": "expandedIcon"; "required": false; "isSignal": true; }; "collapsedIcon": { "alias": "collapsedIcon"; "required": false; "isSignal": true; }; "indentSize": { "alias": "indentSize"; "required": false; "isSignal": true; }; "nodeHeight": { "alias": "nodeHeight"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "lazyLoad": { "alias": "lazyLoad"; "required": false; "isSignal": true; }; "enableLazyLoad": { "alias": "enableLazyLoad"; "required": false; "isSignal": true; }; }, { "nodes": "nodesChange"; "onBeforeDrop": "onBeforeDrop"; "nodeToggle": "nodeToggle"; "nodeSelect": "nodeSelect"; "nodeDrop": "nodeDrop"; }, never, never, true, never>;
327
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<AXTree2Component, "ax-tree2", never, { "nodes": { "alias": "nodes"; "required": true; "isSignal": true; }; "showCheckbox": { "alias": "showCheckbox"; "required": false; "isSignal": true; }; "dragMode": { "alias": "dragMode"; "required": false; "isSignal": true; }; "dragOperationType": { "alias": "dragOperationType"; "required": false; "isSignal": true; }; "showIcons": { "alias": "showIcons"; "required": false; "isSignal": true; }; "showChildrenBadge": { "alias": "showChildrenBadge"; "required": false; "isSignal": true; }; "expandedIcon": { "alias": "expandedIcon"; "required": false; "isSignal": true; }; "collapsedIcon": { "alias": "collapsedIcon"; "required": false; "isSignal": true; }; "indentSize": { "alias": "indentSize"; "required": false; "isSignal": true; }; "nodeHeight": { "alias": "nodeHeight"; "required": false; "isSignal": true; }; "look": { "alias": "look"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; "isSignal": true; }; "lazyLoad": { "alias": "lazyLoad"; "required": false; "isSignal": true; }; "enableLazyLoad": { "alias": "enableLazyLoad"; "required": false; "isSignal": true; }; }, { "nodes": "nodesChange"; "onBeforeDrop": "onBeforeDrop"; "onNodeToggle": "onNodeToggle"; "onNodeSelect": "onNodeSelect"; "onOrderChange": "onOrderChange"; "onMoveChange": "onMoveChange"; "onItemsChange": "onItemsChange"; }, never, never, true, never>;
258
328
  }
259
329
 
260
330
  declare class Tree2Module {
261
331
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<Tree2Module, never>;
262
- static ɵmod: _angular_core.ɵɵNgModuleDeclaration<Tree2Module, never, [typeof i1.CommonModule], never>;
332
+ static ɵmod: _angular_core.ɵɵNgModuleDeclaration<Tree2Module, never, [typeof AXTree2Component], never>;
263
333
  static ɵinj: _angular_core.ɵɵInjectorDeclaration<Tree2Module>;
264
334
  }
265
335
 
266
336
  export { AXTree2Component, Tree2Module };
267
- export type { AXTreeDragMode, AXTreeDropEvent, AXTreeItemTemplateContext, AXTreeNode, AXTreeNodeEvent, AXTreeNodeOnBeforeDropEvent, AXTreeViewLook };
337
+ export type { AXTreeBeforeDropEvent, AXTreeDragMode, AXTreeDragOperationType, AXTreeDropEvent, AXTreeItemTemplateContext, AXTreeNode, AXTreeNodeSelectEvent, AXTreeNodeToggleEvent, AXTreeViewLook };