@neural-ui/core 1.3.2 → 1.5.0

package/fesm2022/neural-ui-core-tree.mjs

@@ -0,0 +1,413 @@
+import * as i0 from '@angular/core';
+import { input, output, signal, computed, effect, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { NgTemplateOutlet } from '@angular/common';
+
+class NeuTreeComponent {
+    nodes = input([], ...(ngDevMode ? [{ debugName: "nodes" }] : /* istanbul ignore next */ []));
+    selectable = input(false, ...(ngDevMode ? [{ debugName: "selectable" }] : /* istanbul ignore next */ []));
+    searchable = input(false, ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
+    selectionMode = input('single', ...(ngDevMode ? [{ debugName: "selectionMode" }] : /* istanbul ignore next */ []));
+    indentSize = input(18, ...(ngDevMode ? [{ debugName: "indentSize" }] : /* istanbul ignore next */ []));
+    ariaLabel = input('Tree', ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    searchPlaceholder = input('Search nodes', ...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : /* istanbul ignore next */ []));
+    emptyLabel = input('No nodes available', ...(ngDevMode ? [{ debugName: "emptyLabel" }] : /* istanbul ignore next */ []));
+    expandLabel = input('Expand node', ...(ngDevMode ? [{ debugName: "expandLabel" }] : /* istanbul ignore next */ []));
+    collapseLabel = input('Collapse node', ...(ngDevMode ? [{ debugName: "collapseLabel" }] : /* istanbul ignore next */ []));
+    selectionChange = output();
+    expansionChange = output();
+    nodeClick = output();
+    searchQuery = signal('', ...(ngDevMode ? [{ debugName: "searchQuery" }] : /* istanbul ignore next */ []));
+    expandedKeys = signal(new Set(), ...(ngDevMode ? [{ debugName: "expandedKeys" }] : /* istanbul ignore next */ []));
+    selectedKeys = signal(new Set(), ...(ngDevMode ? [{ debugName: "selectedKeys" }] : /* istanbul ignore next */ []));
+    visibleNodes = computed(() => {
+        const query = this.searchQuery().trim().toLowerCase();
+        if (!query) {
+            return this.nodes();
+        }
+        return this.filterNodes(this.nodes(), query);
+    }, ...(ngDevMode ? [{ debugName: "visibleNodes" }] : /* istanbul ignore next */ []));
+    constructor() {
+        effect(() => {
+            const nextExpanded = this.collectExpandedKeys(this.nodes());
+            this.expandedKeys.set(nextExpanded);
+            this.selectedKeys.set(new Set());
+            this.searchQuery.set('');
+        });
+    }
+    hasChildren(node) {
+        return !!node.children?.length;
+    }
+    canSelect(node) {
+        return this.selectable() && node.selectable !== false;
+    }
+    isExpanded(nodeId) {
+        return this.expandedKeys().has(nodeId);
+    }
+    isRenderedExpanded(node) {
+        if (this.searchQuery().trim()) {
+            return node.expanded ?? this.isExpanded(node.id);
+        }
+        return this.isExpanded(node.id);
+    }
+    isSelected(nodeId) {
+        return this.selectedKeys().has(nodeId);
+    }
+    onSearch(event) {
+        const target = event.target;
+        this.searchQuery.set(target.value);
+    }
+    toggleNode(node, event) {
+        event?.stopPropagation();
+        if (node.disabled || !this.hasChildren(node)) {
+            return;
+        }
+        const next = new Set(this.expandedKeys());
+        if (next.has(node.id)) {
+            next.delete(node.id);
+        }
+        else {
+            next.add(node.id);
+        }
+        this.expandedKeys.set(next);
+        this.expansionChange.emit([...next]);
+    }
+    activateNode(node) {
+        if (node.disabled) {
+            return;
+        }
+        this.nodeClick.emit(node);
+        if (!this.canSelect(node)) {
+            return;
+        }
+        if (this.selectionMode() === 'multiple') {
+            const checked = !this.isSelected(node.id);
+            this.updateSelection(node, checked);
+            return;
+        }
+        this.updateSelection(node, true);
+    }
+    onCheckboxChange(node, event) {
+        const target = event.target;
+        this.updateSelection(node, target.checked);
+    }
+    updateSelection(node, checked) {
+        if (node.disabled || !this.canSelect(node)) {
+            return;
+        }
+        const next = new Set(this.selectedKeys());
+        if (this.selectionMode() === 'single') {
+            next.clear();
+            if (checked) {
+                next.add(node.id);
+            }
+        }
+        else if (checked) {
+            next.add(node.id);
+        }
+        else {
+            next.delete(node.id);
+        }
+        this.selectedKeys.set(next);
+        this.selectionChange.emit(this.collectSelectedNodes(this.nodes(), next));
+    }
+    collectExpandedKeys(nodes) {
+        const expanded = new Set();
+        for (const node of nodes) {
+            if (node.expanded) {
+                expanded.add(node.id);
+            }
+            if (node.children?.length) {
+                for (const childId of this.collectExpandedKeys(node.children)) {
+                    expanded.add(childId);
+                }
+            }
+        }
+        return expanded;
+    }
+    collectSelectedNodes(nodes, selected) {
+        const result = [];
+        for (const node of nodes) {
+            if (selected.has(node.id)) {
+                result.push(node);
+            }
+            if (node.children?.length) {
+                result.push(...this.collectSelectedNodes(node.children, selected));
+            }
+        }
+        return result;
+    }
+    filterNodes(nodes, query) {
+        const filtered = [];
+        for (const node of nodes) {
+            const children = node.children?.length ? this.filterNodes(node.children, query) : [];
+            const matches = node.label.toLowerCase().includes(query) ||
+                node.description?.toLowerCase().includes(query) ||
+                node.badge?.toLowerCase().includes(query);
+            if (matches || children.length) {
+                filtered.push({
+                    ...node,
+                    children,
+                    expanded: children.length ? true : node.expanded,
+                });
+            }
+        }
+        return filtered;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuTreeComponent, isStandalone: true, selector: "neu-tree", inputs: { nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, indentSize: { classPropertyName: "indentSize", publicName: "indentSize", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, emptyLabel: { classPropertyName: "emptyLabel", publicName: "emptyLabel", isSignal: true, isRequired: false, transformFunction: null }, expandLabel: { classPropertyName: "expandLabel", publicName: "expandLabel", isSignal: true, isRequired: false, transformFunction: null }, collapseLabel: { classPropertyName: "collapseLabel", publicName: "collapseLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", expansionChange: "expansionChange", nodeClick: "nodeClick" }, ngImport: i0, template: `
+    <div class="neu-tree">
+      @if (searchable()) {
+        <label class="neu-tree__search" [attr.aria-label]="searchPlaceholder()">
+          <svg
+            class="neu-tree__search-icon"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            aria-hidden="true"
+          >
+            <circle cx="11" cy="11" r="7"></circle>
+            <path d="m20 20-3.5-3.5"></path>
+          </svg>
+          <input
+            class="neu-tree__search-input"
+            type="search"
+            [value]="searchQuery()"
+            [attr.placeholder]="searchPlaceholder()"
+            (input)="onSearch($event)"
+          />
+        </label>
+      }
+
+      @if (visibleNodes().length) {
+        <ul
+          class="neu-tree__list neu-tree__list--root"
+          role="tree"
+          [attr.aria-label]="ariaLabel()"
+          [attr.aria-multiselectable]="
+            selectable() && selectionMode() === 'multiple' ? 'true' : null
+          "
+        >
+          <ng-container
+            [ngTemplateOutlet]="treeNodes"
+            [ngTemplateOutletContext]="{ $implicit: visibleNodes(), level: 1 }"
+          />
+        </ul>
+      } @else {
+        <div class="neu-tree__empty">{{ emptyLabel() }}</div>
+      }
+    </div>
+
+    <ng-template #treeNodes let-nodes let-level="level">
+      @for (node of nodes; track node.id) {
+        <li
+          class="neu-tree__node"
+          role="treeitem"
+          [attr.aria-level]="level"
+          [attr.aria-expanded]="hasChildren(node) ? isRenderedExpanded(node) : null"
+          [attr.aria-selected]="canSelect(node) ? isSelected(node.id) : null"
+          [attr.aria-disabled]="node.disabled ? 'true' : null"
+        >
+          <div
+            class="neu-tree__row"
+            [class.neu-tree__row--selected]="isSelected(node.id)"
+            [class.neu-tree__row--disabled]="node.disabled"
+            [style.padding-inline-start.px]="(level - 1) * indentSize() + 6"
+          >
+            @if (hasChildren(node)) {
+              <button
+                class="neu-tree__toggle"
+                type="button"
+                [class.neu-tree__toggle--open]="isRenderedExpanded(node)"
+                [attr.aria-label]="isRenderedExpanded(node) ? collapseLabel() : expandLabel()"
+                (click)="toggleNode(node, $event)"
+              >
+                <svg viewBox="0 0 20 20" fill="none" aria-hidden="true">
+                  <path d="m7 5 6 5-6 5" />
+                </svg>
+              </button>
+            } @else {
+              <span
+                class="neu-tree__toggle neu-tree__toggle--placeholder"
+                aria-hidden="true"
+              ></span>
+            }
+
+            @if (canSelect(node) && selectionMode() === 'multiple') {
+              <input
+                class="neu-tree__checkbox"
+                type="checkbox"
+                [attr.aria-label]="'Select ' + node.label"
+                [checked]="isSelected(node.id)"
+                [disabled]="node.disabled"
+                (click)="$event.stopPropagation()"
+                (change)="onCheckboxChange(node, $event)"
+              />
+            }
+
+            <button
+              class="neu-tree__content"
+              type="button"
+              [disabled]="node.disabled"
+              (click)="activateNode(node)"
+            >
+              <span class="neu-tree__main">
+                <span class="neu-tree__label">{{ node.label }}</span>
+                @if (node.badge) {
+                  <span class="neu-tree__badge">{{ node.badge }}</span>
+                }
+              </span>
+              @if (node.description) {
+                <span class="neu-tree__description">{{ node.description }}</span>
+              }
+            </button>
+          </div>
+
+          @if (hasChildren(node) && isRenderedExpanded(node)) {
+            <ul class="neu-tree__list" role="group">
+              <ng-container
+                [ngTemplateOutlet]="treeNodes"
+                [ngTemplateOutletContext]="{ $implicit: node.children ?? [], level: level + 1 }"
+              />
+            </ul>
+          }
+        </li>
+      }
+    </ng-template>
+  `, isInline: true, styles: [".neu-tree{display:flex;flex-direction:column;gap:.75rem;min-width:0}.neu-tree__search{position:relative;display:flex;align-items:center}.neu-tree__search-icon{position:absolute;left:.875rem;width:.9375rem;height:.9375rem;color:var(--neu-text-muted);pointer-events:none}.neu-tree__search-input{width:100%;min-height:2.625rem;border:1px solid var(--neu-border);border-radius:var(--neu-radius-lg, 14px);background:var(--neu-surface);color:var(--neu-text);padding:.6875rem .875rem .6875rem 2.4rem;outline:none;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease}.neu-tree__search-input::placeholder{color:var(--neu-text-muted)}.neu-tree__search-input:focus{border-color:color-mix(in srgb,var(--neu-primary) 62%,var(--neu-border));box-shadow:0 0 0 3px color-mix(in srgb,var(--neu-primary) 16%,transparent)}.neu-tree__list{list-style:none;margin:0;padding:0}.neu-tree__list--root{display:flex;flex-direction:column;gap:.375rem}.neu-tree__node{position:relative}.neu-tree__row{display:flex;align-items:flex-start;gap:.5rem;min-width:0;border-radius:calc(var(--neu-radius-lg, 14px) - 2px);transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease}.neu-tree__row:hover{background:color-mix(in srgb,var(--neu-primary) 5%,var(--neu-surface))}.neu-tree__row--selected{background:color-mix(in srgb,var(--neu-primary) 10%,var(--neu-surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--neu-primary) 20%,var(--neu-border))}.neu-tree__row--disabled{opacity:.6}.neu-tree__toggle{flex:0 0 auto;width:1.75rem;height:1.75rem;margin-top:.4rem;border:0;border-radius:999px;background:transparent;color:var(--neu-text-muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .16s ease,color .16s ease,transform .16s ease}.neu-tree__toggle svg{width:.95rem;height:.95rem;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s ease}.neu-tree__toggle:hover{background:color-mix(in srgb,var(--neu-primary) 9%,transparent);color:var(--neu-primary)}.neu-tree__toggle--open svg{transform:rotate(90deg)}.neu-tree__toggle--placeholder{cursor:default}.neu-tree__checkbox{flex:0 0 auto;width:1rem;height:1rem;margin:.8rem 0 0;accent-color:var(--neu-primary)}.neu-tree__content{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:.125rem;border:0;background:transparent;text-align:left;padding:.55rem .75rem .6rem 0;color:inherit;cursor:pointer}.neu-tree__main{display:inline-flex;align-items:center;gap:.5rem;min-width:0}.neu-tree__label{font-size:.9375rem;font-weight:600;color:var(--neu-text)}.neu-tree__badge{display:inline-flex;align-items:center;min-height:1.25rem;padding:0 .45rem;border-radius:999px;background:color-mix(in srgb,var(--neu-primary) 12%,transparent);color:var(--neu-primary);font-size:.6875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.neu-tree__description{color:var(--neu-text-muted);font-size:.8125rem;line-height:1.45}.neu-tree__empty{border:1px dashed var(--neu-border);border-radius:var(--neu-radius-lg, 14px);background:color-mix(in srgb,var(--neu-surface-2) 72%,transparent);color:var(--neu-text-muted);padding:1rem 1.125rem;font-size:.875rem}.neu-tree__node>.neu-tree__list{margin-top:.125rem}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuTreeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'neu-tree', standalone: true, imports: [NgTemplateOutlet], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="neu-tree">
+      @if (searchable()) {
+        <label class="neu-tree__search" [attr.aria-label]="searchPlaceholder()">
+          <svg
+            class="neu-tree__search-icon"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="2"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            aria-hidden="true"
+          >
+            <circle cx="11" cy="11" r="7"></circle>
+            <path d="m20 20-3.5-3.5"></path>
+          </svg>
+          <input
+            class="neu-tree__search-input"
+            type="search"
+            [value]="searchQuery()"
+            [attr.placeholder]="searchPlaceholder()"
+            (input)="onSearch($event)"
+          />
+        </label>
+      }
+
+      @if (visibleNodes().length) {
+        <ul
+          class="neu-tree__list neu-tree__list--root"
+          role="tree"
+          [attr.aria-label]="ariaLabel()"
+          [attr.aria-multiselectable]="
+            selectable() && selectionMode() === 'multiple' ? 'true' : null
+          "
+        >
+          <ng-container
+            [ngTemplateOutlet]="treeNodes"
+            [ngTemplateOutletContext]="{ $implicit: visibleNodes(), level: 1 }"
+          />
+        </ul>
+      } @else {
+        <div class="neu-tree__empty">{{ emptyLabel() }}</div>
+      }
+    </div>
+
+    <ng-template #treeNodes let-nodes let-level="level">
+      @for (node of nodes; track node.id) {
+        <li
+          class="neu-tree__node"
+          role="treeitem"
+          [attr.aria-level]="level"
+          [attr.aria-expanded]="hasChildren(node) ? isRenderedExpanded(node) : null"
+          [attr.aria-selected]="canSelect(node) ? isSelected(node.id) : null"
+          [attr.aria-disabled]="node.disabled ? 'true' : null"
+        >
+          <div
+            class="neu-tree__row"
+            [class.neu-tree__row--selected]="isSelected(node.id)"
+            [class.neu-tree__row--disabled]="node.disabled"
+            [style.padding-inline-start.px]="(level - 1) * indentSize() + 6"
+          >
+            @if (hasChildren(node)) {
+              <button
+                class="neu-tree__toggle"
+                type="button"
+                [class.neu-tree__toggle--open]="isRenderedExpanded(node)"
+                [attr.aria-label]="isRenderedExpanded(node) ? collapseLabel() : expandLabel()"
+                (click)="toggleNode(node, $event)"
+              >
+                <svg viewBox="0 0 20 20" fill="none" aria-hidden="true">
+                  <path d="m7 5 6 5-6 5" />
+                </svg>
+              </button>
+            } @else {
+              <span
+                class="neu-tree__toggle neu-tree__toggle--placeholder"
+                aria-hidden="true"
+              ></span>
+            }
+
+            @if (canSelect(node) && selectionMode() === 'multiple') {
+              <input
+                class="neu-tree__checkbox"
+                type="checkbox"
+                [attr.aria-label]="'Select ' + node.label"
+                [checked]="isSelected(node.id)"
+                [disabled]="node.disabled"
+                (click)="$event.stopPropagation()"
+                (change)="onCheckboxChange(node, $event)"
+              />
+            }
+
+            <button
+              class="neu-tree__content"
+              type="button"
+              [disabled]="node.disabled"
+              (click)="activateNode(node)"
+            >
+              <span class="neu-tree__main">
+                <span class="neu-tree__label">{{ node.label }}</span>
+                @if (node.badge) {
+                  <span class="neu-tree__badge">{{ node.badge }}</span>
+                }
+              </span>
+              @if (node.description) {
+                <span class="neu-tree__description">{{ node.description }}</span>
+              }
+            </button>
+          </div>
+
+          @if (hasChildren(node) && isRenderedExpanded(node)) {
+            <ul class="neu-tree__list" role="group">
+              <ng-container
+                [ngTemplateOutlet]="treeNodes"
+                [ngTemplateOutletContext]="{ $implicit: node.children ?? [], level: level + 1 }"
+              />
+            </ul>
+          }
+        </li>
+      }
+    </ng-template>
+  `, styles: [".neu-tree{display:flex;flex-direction:column;gap:.75rem;min-width:0}.neu-tree__search{position:relative;display:flex;align-items:center}.neu-tree__search-icon{position:absolute;left:.875rem;width:.9375rem;height:.9375rem;color:var(--neu-text-muted);pointer-events:none}.neu-tree__search-input{width:100%;min-height:2.625rem;border:1px solid var(--neu-border);border-radius:var(--neu-radius-lg, 14px);background:var(--neu-surface);color:var(--neu-text);padding:.6875rem .875rem .6875rem 2.4rem;outline:none;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease}.neu-tree__search-input::placeholder{color:var(--neu-text-muted)}.neu-tree__search-input:focus{border-color:color-mix(in srgb,var(--neu-primary) 62%,var(--neu-border));box-shadow:0 0 0 3px color-mix(in srgb,var(--neu-primary) 16%,transparent)}.neu-tree__list{list-style:none;margin:0;padding:0}.neu-tree__list--root{display:flex;flex-direction:column;gap:.375rem}.neu-tree__node{position:relative}.neu-tree__row{display:flex;align-items:flex-start;gap:.5rem;min-width:0;border-radius:calc(var(--neu-radius-lg, 14px) - 2px);transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease}.neu-tree__row:hover{background:color-mix(in srgb,var(--neu-primary) 5%,var(--neu-surface))}.neu-tree__row--selected{background:color-mix(in srgb,var(--neu-primary) 10%,var(--neu-surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--neu-primary) 20%,var(--neu-border))}.neu-tree__row--disabled{opacity:.6}.neu-tree__toggle{flex:0 0 auto;width:1.75rem;height:1.75rem;margin-top:.4rem;border:0;border-radius:999px;background:transparent;color:var(--neu-text-muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .16s ease,color .16s ease,transform .16s ease}.neu-tree__toggle svg{width:.95rem;height:.95rem;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s ease}.neu-tree__toggle:hover{background:color-mix(in srgb,var(--neu-primary) 9%,transparent);color:var(--neu-primary)}.neu-tree__toggle--open svg{transform:rotate(90deg)}.neu-tree__toggle--placeholder{cursor:default}.neu-tree__checkbox{flex:0 0 auto;width:1rem;height:1rem;margin:.8rem 0 0;accent-color:var(--neu-primary)}.neu-tree__content{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:.125rem;border:0;background:transparent;text-align:left;padding:.55rem .75rem .6rem 0;color:inherit;cursor:pointer}.neu-tree__main{display:inline-flex;align-items:center;gap:.5rem;min-width:0}.neu-tree__label{font-size:.9375rem;font-weight:600;color:var(--neu-text)}.neu-tree__badge{display:inline-flex;align-items:center;min-height:1.25rem;padding:0 .45rem;border-radius:999px;background:color-mix(in srgb,var(--neu-primary) 12%,transparent);color:var(--neu-primary);font-size:.6875rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.neu-tree__description{color:var(--neu-text-muted);font-size:.8125rem;line-height:1.45}.neu-tree__empty{border:1px dashed var(--neu-border);border-radius:var(--neu-radius-lg, 14px);background:color-mix(in srgb,var(--neu-surface-2) 72%,transparent);color:var(--neu-text-muted);padding:1rem 1.125rem;font-size:.875rem}.neu-tree__node>.neu-tree__list{margin-top:.125rem}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { nodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodes", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], indentSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "indentSize", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], emptyLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyLabel", required: false }] }], expandLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandLabel", required: false }] }], collapseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapseLabel", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], expansionChange: [{ type: i0.Output, args: ["expansionChange"] }], nodeClick: [{ type: i0.Output, args: ["nodeClick"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NeuTreeComponent };
+//# sourceMappingURL=neural-ui-core-tree.mjs.map

package/fesm2022/neural-ui-core-tree.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"neural-ui-core-tree.mjs","sources":["../../../../projects/ui-core/tree/neu-tree.component.ts","../../../../projects/ui-core/tree/neural-ui-core-tree.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  input,\n  output,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\n\nexport interface NeuTreeNode<T = unknown> {\n  id: string;\n  label: string;\n  description?: string;\n  badge?: string;\n  children?: NeuTreeNode<T>[];\n  disabled?: boolean;\n  expanded?: boolean;\n  selectable?: boolean;\n  data?: T;\n}\n\nexport type NeuTreeSelectionMode = 'single' | 'multiple';\n\n@Component({\n  selector: 'neu-tree',\n  standalone: true,\n  imports: [NgTemplateOutlet],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  template: `\n    <div class=\"neu-tree\">\n      @if (searchable()) {\n        <label class=\"neu-tree__search\" [attr.aria-label]=\"searchPlaceholder()\">\n          <svg\n            class=\"neu-tree__search-icon\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <circle cx=\"11\" cy=\"11\" r=\"7\"></circle>\n            <path d=\"m20 20-3.5-3.5\"></path>\n          </svg>\n          <input\n            class=\"neu-tree__search-input\"\n            type=\"search\"\n            [value]=\"searchQuery()\"\n            [attr.placeholder]=\"searchPlaceholder()\"\n            (input)=\"onSearch($event)\"\n          />\n        </label>\n      }\n\n      @if (visibleNodes().length) {\n        <ul\n          class=\"neu-tree__list neu-tree__list--root\"\n          role=\"tree\"\n          [attr.aria-label]=\"ariaLabel()\"\n          [attr.aria-multiselectable]=\"\n            selectable() && selectionMode() === 'multiple' ? 'true' : null\n          \"\n        >\n          <ng-container\n            [ngTemplateOutlet]=\"treeNodes\"\n            [ngTemplateOutletContext]=\"{ $implicit: visibleNodes(), level: 1 }\"\n          />\n        </ul>\n      } @else {\n        <div class=\"neu-tree__empty\">{{ emptyLabel() }}</div>\n      }\n    </div>\n\n    <ng-template #treeNodes let-nodes let-level=\"level\">\n      @for (node of nodes; track node.id) {\n        <li\n          class=\"neu-tree__node\"\n          role=\"treeitem\"\n          [attr.aria-level]=\"level\"\n          [attr.aria-expanded]=\"hasChildren(node) ? isRenderedExpanded(node) : null\"\n          [attr.aria-selected]=\"canSelect(node) ? isSelected(node.id) : null\"\n          [attr.aria-disabled]=\"node.disabled ? 'true' : null\"\n        >\n          <div\n            class=\"neu-tree__row\"\n            [class.neu-tree__row--selected]=\"isSelected(node.id)\"\n            [class.neu-tree__row--disabled]=\"node.disabled\"\n            [style.padding-inline-start.px]=\"(level - 1) * indentSize() + 6\"\n          >\n            @if (hasChildren(node)) {\n              <button\n                class=\"neu-tree__toggle\"\n                type=\"button\"\n                [class.neu-tree__toggle--open]=\"isRenderedExpanded(node)\"\n                [attr.aria-label]=\"isRenderedExpanded(node) ? collapseLabel() : expandLabel()\"\n                (click)=\"toggleNode(node, $event)\"\n              >\n                <svg viewBox=\"0 0 20 20\" fill=\"none\" aria-hidden=\"true\">\n                  <path d=\"m7 5 6 5-6 5\" />\n                </svg>\n              </button>\n            } @else {\n              <span\n                class=\"neu-tree__toggle neu-tree__toggle--placeholder\"\n                aria-hidden=\"true\"\n              ></span>\n            }\n\n            @if (canSelect(node) && selectionMode() === 'multiple') {\n              <input\n                class=\"neu-tree__checkbox\"\n                type=\"checkbox\"\n                [attr.aria-label]=\"'Select ' + node.label\"\n                [checked]=\"isSelected(node.id)\"\n                [disabled]=\"node.disabled\"\n                (click)=\"$event.stopPropagation()\"\n                (change)=\"onCheckboxChange(node, $event)\"\n              />\n            }\n\n            <button\n              class=\"neu-tree__content\"\n              type=\"button\"\n              [disabled]=\"node.disabled\"\n              (click)=\"activateNode(node)\"\n            >\n              <span class=\"neu-tree__main\">\n                <span class=\"neu-tree__label\">{{ node.label }}</span>\n                @if (node.badge) {\n                  <span class=\"neu-tree__badge\">{{ node.badge }}</span>\n                }\n              </span>\n              @if (node.description) {\n                <span class=\"neu-tree__description\">{{ node.description }}</span>\n              }\n            </button>\n          </div>\n\n          @if (hasChildren(node) && isRenderedExpanded(node)) {\n            <ul class=\"neu-tree__list\" role=\"group\">\n              <ng-container\n                [ngTemplateOutlet]=\"treeNodes\"\n                [ngTemplateOutletContext]=\"{ $implicit: node.children ?? [], level: level + 1 }\"\n              />\n            </ul>\n          }\n        </li>\n      }\n    </ng-template>\n  `,\n  styleUrl: './neu-tree.component.scss',\n})\nexport class NeuTreeComponent {\n  nodes = input<NeuTreeNode[]>([]);\n  selectable = input(false);\n  searchable = input(false);\n  selectionMode = input<NeuTreeSelectionMode>('single');\n  indentSize = input(18);\n  ariaLabel = input('Tree');\n  searchPlaceholder = input('Search nodes');\n  emptyLabel = input('No nodes available');\n  expandLabel = input('Expand node');\n  collapseLabel = input('Collapse node');\n\n  selectionChange = output<NeuTreeNode[]>();\n  expansionChange = output<string[]>();\n  nodeClick = output<NeuTreeNode>();\n\n  readonly searchQuery = signal('');\n\n  private readonly expandedKeys = signal<Set<string>>(new Set());\n  private readonly selectedKeys = signal<Set<string>>(new Set());\n\n  readonly visibleNodes = computed(() => {\n    const query = this.searchQuery().trim().toLowerCase();\n    if (!query) {\n      return this.nodes();\n    }\n\n    return this.filterNodes(this.nodes(), query);\n  });\n\n  constructor() {\n    effect(() => {\n      const nextExpanded = this.collectExpandedKeys(this.nodes());\n      this.expandedKeys.set(nextExpanded);\n      this.selectedKeys.set(new Set());\n      this.searchQuery.set('');\n    });\n  }\n\n  hasChildren(node: NeuTreeNode): boolean {\n    return !!node.children?.length;\n  }\n\n  canSelect(node: NeuTreeNode): boolean {\n    return this.selectable() && node.selectable !== false;\n  }\n\n  isExpanded(nodeId: string): boolean {\n    return this.expandedKeys().has(nodeId);\n  }\n\n  isRenderedExpanded(node: NeuTreeNode): boolean {\n    if (this.searchQuery().trim()) {\n      return node.expanded ?? this.isExpanded(node.id);\n    }\n\n    return this.isExpanded(node.id);\n  }\n\n  isSelected(nodeId: string): boolean {\n    return this.selectedKeys().has(nodeId);\n  }\n\n  onSearch(event: Event): void {\n    const target = event.target as HTMLInputElement;\n    this.searchQuery.set(target.value);\n  }\n\n  toggleNode(node: NeuTreeNode, event?: Event): void {\n    event?.stopPropagation();\n    if (node.disabled || !this.hasChildren(node)) {\n      return;\n    }\n\n    const next = new Set(this.expandedKeys());\n    if (next.has(node.id)) {\n      next.delete(node.id);\n    } else {\n      next.add(node.id);\n    }\n\n    this.expandedKeys.set(next);\n    this.expansionChange.emit([...next]);\n  }\n\n  activateNode(node: NeuTreeNode): void {\n    if (node.disabled) {\n      return;\n    }\n\n    this.nodeClick.emit(node);\n\n    if (!this.canSelect(node)) {\n      return;\n    }\n\n    if (this.selectionMode() === 'multiple') {\n      const checked = !this.isSelected(node.id);\n      this.updateSelection(node, checked);\n      return;\n    }\n\n    this.updateSelection(node, true);\n  }\n\n  onCheckboxChange(node: NeuTreeNode, event: Event): void {\n    const target = event.target as HTMLInputElement;\n    this.updateSelection(node, target.checked);\n  }\n\n  private updateSelection(node: NeuTreeNode, checked: boolean): void {\n    if (node.disabled || !this.canSelect(node)) {\n      return;\n    }\n\n    const next = new Set(this.selectedKeys());\n\n    if (this.selectionMode() === 'single') {\n      next.clear();\n      if (checked) {\n        next.add(node.id);\n      }\n    } else if (checked) {\n      next.add(node.id);\n    } else {\n      next.delete(node.id);\n    }\n\n    this.selectedKeys.set(next);\n    this.selectionChange.emit(this.collectSelectedNodes(this.nodes(), next));\n  }\n\n  private collectExpandedKeys(nodes: NeuTreeNode[]): Set<string> {\n    const expanded = new Set<string>();\n    for (const node of nodes) {\n      if (node.expanded) {\n        expanded.add(node.id);\n      }\n      if (node.children?.length) {\n        for (const childId of this.collectExpandedKeys(node.children)) {\n          expanded.add(childId);\n        }\n      }\n    }\n    return expanded;\n  }\n\n  private collectSelectedNodes(nodes: NeuTreeNode[], selected: Set<string>): NeuTreeNode[] {\n    const result: NeuTreeNode[] = [];\n    for (const node of nodes) {\n      if (selected.has(node.id)) {\n        result.push(node);\n      }\n      if (node.children?.length) {\n        result.push(...this.collectSelectedNodes(node.children, selected));\n      }\n    }\n    return result;\n  }\n\n  private filterNodes(nodes: NeuTreeNode[], query: string): NeuTreeNode[] {\n    const filtered: NeuTreeNode[] = [];\n    for (const node of nodes) {\n      const children = node.children?.length ? this.filterNodes(node.children, query) : [];\n      const matches =\n        node.label.toLowerCase().includes(query) ||\n        node.description?.toLowerCase().includes(query) ||\n        node.badge?.toLowerCase().includes(query);\n\n      if (matches || children.length) {\n        filtered.push({\n          ...node,\n          children,\n          expanded: children.length ? true : node.expanded,\n        });\n      }\n    }\n    return filtered;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}