@acorex/charts 20.1.14 → 20.1.16

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.
@@ -51,7 +51,7 @@ class AXHierarchyChartComponent extends NXComponent {
51
51
  // Chart container reference
52
52
  chartContainer = viewChild.required('chartContainer');
53
53
  // Custom node template provided by the user
54
- customNodeTemplate = contentChild('nodeTemplate');
54
+ customNodeTemplate = contentChild('nodeTemplate', ...(ngDevMode ? [{ debugName: "customNodeTemplate" }] : []));
55
55
  // Services
56
56
  ngZone = inject(NgZone);
57
57
  viewContainerRef = inject(ViewContainerRef);
@@ -59,16 +59,16 @@ class AXHierarchyChartComponent extends NXComponent {
59
59
  // D3 instance
60
60
  d3;
61
61
  // Internal state signals
62
- _expandedNodes = signal(new Map());
63
- _initialized = signal(false);
64
- _rendered = signal(false);
65
- _dimensions = signal({ width: 0, height: 0 });
66
- _nodeElements = signal(new Map()); // Store references to node elements
67
- _chartData = signal(null); // Store the current chart data and layout
62
+ _expandedNodes = signal(new Map(), ...(ngDevMode ? [{ debugName: "_expandedNodes" }] : []));
63
+ _initialized = signal(false, ...(ngDevMode ? [{ debugName: "_initialized" }] : []));
64
+ _rendered = signal(false, ...(ngDevMode ? [{ debugName: "_rendered" }] : []));
65
+ _dimensions = signal({ width: 0, height: 0 }, ...(ngDevMode ? [{ debugName: "_dimensions" }] : []));
66
+ _nodeElements = signal(new Map(), ...(ngDevMode ? [{ debugName: "_nodeElements" }] : [])); // Store references to node elements
67
+ _chartData = signal(null, ...(ngDevMode ? [{ debugName: "_chartData" }] : [])); // Store the current chart data and layout
68
68
  // Inputs
69
- data = input([]);
70
- options = input({});
71
- nodeTemplate = input(null);
69
+ data = input([], ...(ngDevMode ? [{ debugName: "data" }] : []));
70
+ options = input({}, ...(ngDevMode ? [{ debugName: "options" }] : []));
71
+ nodeTemplate = input(null, ...(ngDevMode ? [{ debugName: "nodeTemplate" }] : []));
72
72
  // Outputs
73
73
  itemClick = output();
74
74
  nodeToggle = output();
@@ -77,17 +77,17 @@ class AXHierarchyChartComponent extends NXComponent {
77
77
  const data = this.data();
78
78
  // Handle both single node and array formats
79
79
  return Array.isArray(data) ? { id: 'root', children: data } : data;
80
- });
80
+ }, ...(ngDevMode ? [{ debugName: "processedData" }] : []));
81
81
  // Check if custom template is available
82
82
  hasCustomTemplate = computed(() => {
83
83
  return Boolean(this.customNodeTemplate() || this.nodeTemplate());
84
- });
84
+ }, ...(ngDevMode ? [{ debugName: "hasCustomTemplate" }] : []));
85
85
  effectiveOptions = computed(() => {
86
86
  return {
87
87
  ...this.configToken,
88
88
  ...this.options(),
89
89
  };
90
- });
90
+ }, ...(ngDevMode ? [{ debugName: "effectiveOptions" }] : []));
91
91
  constructor() {
92
92
  super();
93
93
  // Dynamically load D3 and initialize the chart when the component is ready
@@ -684,10 +684,10 @@ class AXHierarchyChartComponent extends NXComponent {
684
684
  .style('opacity', '0.6')
685
685
  .text('Please provide data to display the chart');
686
686
  }
687
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: AXHierarchyChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
688
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.4", type: AXHierarchyChartComponent, isStandalone: true, selector: "ax-hierarchy-chart", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, nodeTemplate: { classPropertyName: "nodeTemplate", publicName: "nodeTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", nodeToggle: "nodeToggle" }, queries: [{ propertyName: "customNodeTemplate", first: true, predicate: ["nodeTemplate"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "chartContainer", first: true, predicate: ["chartContainer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div axPanView class=\"ax-hierarchy-chart\" #chartContainer></div>\n", styles: ["ax-hierarchy-chart{display:block;width:100%;height:100%;min-height:300px;--ax-comp-hierarchy-chart-node-color: var(--ax-sys-color-primary-500);--ax-comp-hierarchy-chart-node-stroke-color: var(--ax-sys-color-primary-400);--ax-comp-hierarchy-chart-link-color: var(--ax-sys-color-primary-400);--ax-comp-hierarchy-chart-text-color: var(--ax-sys-color-on-lightest-surface);--ax-comp-hierarchy-chart-bg-color: var(--ax-sys-color-lightest-surface);color:rgb(var(--ax-comp-hierarchy-chart-text-color));background-color:rgb(var(--ax-comp-hierarchy-chart-bg-color))}ax-hierarchy-chart .ax-hierarchy-chart{width:100%;height:100%;min-height:300px;position:relative;overflow:visible}ax-hierarchy-chart .ax-hierarchy-chart svg{width:100%;height:100%;max-width:100%;max-height:100%;overflow:visible}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message{position:absolute;text-align:center;transform:translate(-50%,-50%);background-color:rgb(var(--ax-comp-hierarchy-chart-bg-color));padding:1.5rem;border-radius:.5rem;box-shadow:0 2px 12px #00000014;width:80%;max-width:300px}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-icon{opacity:.6;margin-bottom:.75rem}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-text{font-size:1rem;font-weight:600;margin-bottom:.5rem}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-help{font-size:.8rem;opacity:.6}\n"], dependencies: [{ kind: "directive", type: AXPanViewDirective, selector: "[axPanView]", inputs: ["zoomStep", "minZoom", "maxZoom", "freeMode", "fitContent", "disablePan", "disableZoom", "wrapperClasses", "panX", "panY", "zoom"], outputs: ["panXChange", "panYChange", "zoomChange", "positionChange"], exportAs: ["axPanView"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
687
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXHierarchyChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
688
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.1.3", type: AXHierarchyChartComponent, isStandalone: true, selector: "ax-hierarchy-chart", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, nodeTemplate: { classPropertyName: "nodeTemplate", publicName: "nodeTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", nodeToggle: "nodeToggle" }, queries: [{ propertyName: "customNodeTemplate", first: true, predicate: ["nodeTemplate"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "chartContainer", first: true, predicate: ["chartContainer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div axPanView class=\"ax-hierarchy-chart\" #chartContainer></div>\n", styles: ["ax-hierarchy-chart{display:block;width:100%;height:100%;min-height:300px;--ax-comp-hierarchy-chart-node-color: var(--ax-sys-color-primary-500);--ax-comp-hierarchy-chart-node-stroke-color: var(--ax-sys-color-primary-400);--ax-comp-hierarchy-chart-link-color: var(--ax-sys-color-primary-400);--ax-comp-hierarchy-chart-text-color: var(--ax-sys-color-on-lightest-surface);--ax-comp-hierarchy-chart-bg-color: var(--ax-sys-color-lightest-surface);color:rgb(var(--ax-comp-hierarchy-chart-text-color));background-color:rgb(var(--ax-comp-hierarchy-chart-bg-color))}ax-hierarchy-chart .ax-hierarchy-chart{width:100%;height:100%;min-height:300px;position:relative;overflow:visible}ax-hierarchy-chart .ax-hierarchy-chart svg{width:100%;height:100%;max-width:100%;max-height:100%;overflow:visible}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message{position:absolute;text-align:center;transform:translate(-50%,-50%);background-color:rgb(var(--ax-comp-hierarchy-chart-bg-color));padding:1.5rem;border-radius:.5rem;box-shadow:0 2px 12px #00000014;width:80%;max-width:300px}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-icon{opacity:.6;margin-bottom:.75rem}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-text{font-size:1rem;font-weight:600;margin-bottom:.5rem}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-help{font-size:.8rem;opacity:.6}\n"], dependencies: [{ kind: "directive", type: AXPanViewDirective, selector: "[axPanView]", inputs: ["zoomStep", "minZoom", "maxZoom", "freeMode", "fitContent", "disablePan", "disableZoom", "wrapperClasses", "panX", "panY", "zoom"], outputs: ["panXChange", "panYChange", "zoomChange", "positionChange"], exportAs: ["axPanView"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
689
689
  }
690
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.4", ngImport: i0, type: AXHierarchyChartComponent, decorators: [{
690
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AXHierarchyChartComponent, decorators: [{
691
691
  type: Component,
692
692
  args: [{ selector: 'ax-hierarchy-chart', standalone: true, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [AXPanViewDirective], template: "<div axPanView class=\"ax-hierarchy-chart\" #chartContainer></div>\n", styles: ["ax-hierarchy-chart{display:block;width:100%;height:100%;min-height:300px;--ax-comp-hierarchy-chart-node-color: var(--ax-sys-color-primary-500);--ax-comp-hierarchy-chart-node-stroke-color: var(--ax-sys-color-primary-400);--ax-comp-hierarchy-chart-link-color: var(--ax-sys-color-primary-400);--ax-comp-hierarchy-chart-text-color: var(--ax-sys-color-on-lightest-surface);--ax-comp-hierarchy-chart-bg-color: var(--ax-sys-color-lightest-surface);color:rgb(var(--ax-comp-hierarchy-chart-text-color));background-color:rgb(var(--ax-comp-hierarchy-chart-bg-color))}ax-hierarchy-chart .ax-hierarchy-chart{width:100%;height:100%;min-height:300px;position:relative;overflow:visible}ax-hierarchy-chart .ax-hierarchy-chart svg{width:100%;height:100%;max-width:100%;max-height:100%;overflow:visible}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message{position:absolute;text-align:center;transform:translate(-50%,-50%);background-color:rgb(var(--ax-comp-hierarchy-chart-bg-color));padding:1.5rem;border-radius:.5rem;box-shadow:0 2px 12px #00000014;width:80%;max-width:300px}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-icon{opacity:.6;margin-bottom:.75rem}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-text{font-size:1rem;font-weight:600;margin-bottom:.5rem}ax-hierarchy-chart .ax-hierarchy-chart-no-data-message .ax-hierarchy-chart-no-data-help{font-size:.8rem;opacity:.6}\n"] }]
693
693
  }], ctorParameters: () => [] });