@tailng-ui/primitives 0.1.0 → 0.12.0

package/src/lib/layout/tree/__tests__/tng-tree.test-harness.js

@@ -0,0 +1,106 @@
+import { __decorate } from "tslib";
+import { Component } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { TngTree, TngTreeGroup, TngTreeIndicator, TngTreeItem } from '../index';
+let TngTreeHarnessComponent = class TngTreeHarnessComponent {
+    valueChanges = [];
+    defaultValue = undefined;
+    orientation = 'vertical';
+    rootExpanded = false;
+    selectionMode = 'none';
+    value = undefined;
+    onValueChange(value) {
+        this.valueChanges.push(value);
+    }
+    resetValueChanges() {
+        this.valueChanges.length = 0;
+    }
+};
+TngTreeHarnessComponent = __decorate([
+    Component({
+        standalone: true,
+        imports: [TngTree, TngTreeItem, TngTreeGroup, TngTreeIndicator],
+        template: `
+    <button data-testid="before" type="button">Before</button>
+
+      <div
+        data-testid="tree"
+        tngTree
+      [defaultValue]="defaultValue"
+      [orientation]="orientation"
+      [selectionMode]="selectionMode"
+      [value]="value"
+      (valueChange)="onValueChange($event)"
+      >
+      <div
+        tngTreeItem
+        [defaultExpanded]="rootExpanded"
+        [value]="'root-a'"
+        aria-label="Alpha"
+        id="root-a"
+      >
+        <span tngTreeIndicator aria-hidden="true">▶</span>
+        Root A
+
+        <div tngTreeGroup>
+          <div tngTreeItem [value]="'a-1'" aria-label="Able" id="a-1">A-1</div>
+          <div
+            tngTreeItem
+            [disabled]="true"
+            [value]="'a-2'"
+            aria-label="Beta Disabled"
+            id="a-2"
+          >
+            A-2 Disabled
+          </div>
+          <div tngTreeItem [value]="'a-3'" aria-label="Charlie" id="a-3">A-3</div>
+        </div>
+      </div>
+
+      <div tngTreeItem [value]="'root-b'" aria-label="Beta" id="root-b">Root B</div>
+    </div>
+
+    <button data-testid="after" type="button">After</button>
+  `,
+    })
+], TngTreeHarnessComponent);
+export { TngTreeHarnessComponent };
+export function createTreeHarnessFixture(initialState = {}) {
+    TestBed.configureTestingModule({
+        imports: [TngTreeHarnessComponent],
+    });
+    const fixture = TestBed.createComponent(TngTreeHarnessComponent);
+    Object.assign(fixture.componentInstance, initialState);
+    fixture.detectChanges();
+    return fixture;
+}
+export function getTreeHost(fixture) {
+    const tree = fixture.nativeElement.querySelector('[data-testid="tree"]');
+    if (!(tree instanceof HTMLElement)) {
+        throw new Error('Expected tree host element.');
+    }
+    return tree;
+}
+export function getItem(fixture, id) {
+    const element = fixture.nativeElement.querySelector(`#${id}`);
+    if (!(element instanceof HTMLElement)) {
+        throw new Error(`Expected tree item #${id}.`);
+    }
+    return element;
+}
+export function clickElement(element) {
+    const event = new MouseEvent('click', { bubbles: true, cancelable: true });
+    element.dispatchEvent(event);
+    return event;
+}
+export function dispatchKeydown(target, key, options = {}) {
+    const event = new KeyboardEvent('keydown', {
+        bubbles: true,
+        cancelable: true,
+        key,
+        ...options,
+    });
+    target.dispatchEvent(event);
+    return event;
+}
+//# sourceMappingURL=tng-tree.test-harness.js.map

package/src/lib/layout/tree/__tests__/tng-tree.test-harness.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree.test-harness.js","sourceRoot":"","sources":["../../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/__tests__/tng-tree.test-harness.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAyB,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,EAA2B,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,WAAW,EAAgD,MAAM,UAAU,CAAC;AAgDhJ,IAAM,uBAAuB,GAA7B,MAAM,uBAAuB;IAClB,YAAY,GAAyD,EAAE,CAAC;IACjF,YAAY,GAA8D,SAAS,CAAC;IACpF,WAAW,GAAuB,UAAU,CAAC;IAC7C,YAAY,GAAG,KAAK,CAAC;IACrB,aAAa,GAAyB,MAAM,CAAC;IAC7C,KAAK,GAA8D,SAAS,CAAC;IAE7E,aAAa,CAAC,KAAoD;QACvE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC;IAEM,iBAAiB;QACtB,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/B,CAAC;CACF,CAAA;AAfY,uBAAuB;IA9CnC,SAAS,CAAC;QACT,UAAU,EAAE,IAAI;QAChB,OAAO,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,gBAAgB,CAAC;QAC/D,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCT;KACF,CAAC;GACW,uBAAuB,CAenC;;AASD,MAAM,UAAU,wBAAwB,CACtC,eAAwC,EAAE;IAE1C,OAAO,CAAC,sBAAsB,CAAC;QAC7B,OAAO,EAAE,CAAC,uBAAuB,CAAC;KACnC,CAAC,CAAC;IACH,MAAM,OAAO,GAAG,OAAO,CAAC,eAAe,CAAC,uBAAuB,CAAC,CAAC;IACjE,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,iBAAiB,EAAE,YAAY,CAAC,CAAC;IACvD,OAAO,CAAC,aAAa,EAAE,CAAC;IACxB,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,OAAkD;IAC5E,MAAM,IAAI,GAAG,OAAO,CAAC,aAAa,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;IACzE,IAAI,CAAC,CAAC,IAAI,YAAY,WAAW,CAAC,EAAE,CAAC;QACnC,MAAM,IAAI,KAAK,CAAC,6BAA6B,CAAC,CAAC;IACjD,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,UAAU,OAAO,CACrB,OAAkD,EAClD,EAAU;IAEV,MAAM,OAAO,GAAG,OAAO,CAAC,aAAa,CAAC,aAAa,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;IAC9D,IAAI,CAAC,CAAC,OAAO,YAAY,WAAW,CAAC,EAAE,CAAC;QACtC,MAAM,IAAI,KAAK,CAAC,uBAAuB,EAAE,GAAG,CAAC,CAAC;IAChD,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,OAAoB;IAC/C,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;IAC3E,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7B,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,eAAe,CAC7B,MAAmB,EACnB,GAAW,EACX,UAAkF,EAAE;IAEpF,MAAM,KAAK,GAAG,IAAI,aAAa,CAAC,SAAS,EAAE;QACzC,OAAO,EAAE,IAAI;QACb,UAAU,EAAE,IAAI;QAChB,GAAG;QACH,GAAG,OAAO;KACX,CAAC,CAAC;IACH,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5B,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["import { Component } from '@angular/core';\nimport { type ComponentFixture, TestBed } from '@angular/core/testing';\nimport { type TngTreeOrientation, TngTree, TngTreeGroup, TngTreeIndicator, TngTreeItem, type TngTreeSelectionMode, type TngTreeValue } from '../index';\n\n@Component({\n  standalone: true,\n  imports: [TngTree, TngTreeItem, TngTreeGroup, TngTreeIndicator],\n  template: `\n    <button data-testid=\"before\" type=\"button\">Before</button>\n\n      <div\n        data-testid=\"tree\"\n        tngTree\n      [defaultValue]=\"defaultValue\"\n      [orientation]=\"orientation\"\n      [selectionMode]=\"selectionMode\"\n      [value]=\"value\"\n      (valueChange)=\"onValueChange($event)\"\n      >\n      <div\n        tngTreeItem\n        [defaultExpanded]=\"rootExpanded\"\n        [value]=\"'root-a'\"\n        aria-label=\"Alpha\"\n        id=\"root-a\"\n      >\n        <span tngTreeIndicator aria-hidden=\"true\">▶</span>\n        Root A\n\n        <div tngTreeGroup>\n          <div tngTreeItem [value]=\"'a-1'\" aria-label=\"Able\" id=\"a-1\">A-1</div>\n          <div\n            tngTreeItem\n            [disabled]=\"true\"\n            [value]=\"'a-2'\"\n            aria-label=\"Beta Disabled\"\n            id=\"a-2\"\n          >\n            A-2 Disabled\n          </div>\n          <div tngTreeItem [value]=\"'a-3'\" aria-label=\"Charlie\" id=\"a-3\">A-3</div>\n        </div>\n      </div>\n\n      <div tngTreeItem [value]=\"'root-b'\" aria-label=\"Beta\" id=\"root-b\">Root B</div>\n    </div>\n\n    <button data-testid=\"after\" type=\"button\">After</button>\n  `,\n})\nexport class TngTreeHarnessComponent {\n  public readonly valueChanges: Array<TngTreeValue | readonly TngTreeValue[] | null> = [];\n  public defaultValue: TngTreeValue | readonly TngTreeValue[] | null | undefined = undefined;\n  public orientation: TngTreeOrientation = 'vertical';\n  public rootExpanded = false;\n  public selectionMode: TngTreeSelectionMode = 'none';\n  public value: TngTreeValue | readonly TngTreeValue[] | null | undefined = undefined;\n\n  public onValueChange(value: TngTreeValue | readonly TngTreeValue[] | null): void {\n    this.valueChanges.push(value);\n  }\n\n  public resetValueChanges(): void {\n    this.valueChanges.length = 0;\n  }\n}\n\ntype TreeHarnessInitialState = Partial<\n  Pick<\n    TngTreeHarnessComponent,\n    'defaultValue' | 'orientation' | 'rootExpanded' | 'selectionMode' | 'value'\n  >\n>;\n\nexport function createTreeHarnessFixture(\n  initialState: TreeHarnessInitialState = {},\n): ComponentFixture<TngTreeHarnessComponent> {\n  TestBed.configureTestingModule({\n    imports: [TngTreeHarnessComponent],\n  });\n  const fixture = TestBed.createComponent(TngTreeHarnessComponent);\n  Object.assign(fixture.componentInstance, initialState);\n  fixture.detectChanges();\n  return fixture;\n}\n\nexport function getTreeHost(fixture: ComponentFixture<TngTreeHarnessComponent>): HTMLElement {\n  const tree = fixture.nativeElement.querySelector('[data-testid=\"tree\"]');\n  if (!(tree instanceof HTMLElement)) {\n    throw new Error('Expected tree host element.');\n  }\n  return tree;\n}\n\nexport function getItem(\n  fixture: ComponentFixture<TngTreeHarnessComponent>,\n  id: string,\n): HTMLElement {\n  const element = fixture.nativeElement.querySelector(`#${id}`);\n  if (!(element instanceof HTMLElement)) {\n    throw new Error(`Expected tree item #${id}.`);\n  }\n  return element;\n}\n\nexport function clickElement(element: HTMLElement): MouseEvent {\n  const event = new MouseEvent('click', { bubbles: true, cancelable: true });\n  element.dispatchEvent(event);\n  return event;\n}\n\nexport function dispatchKeydown(\n  target: HTMLElement,\n  key: string,\n  options: Pick<KeyboardEventInit, 'shiftKey' | 'ctrlKey' | 'metaKey' | 'altKey'> = {},\n): KeyboardEvent {\n  const event = new KeyboardEvent('keydown', {\n    bubbles: true,\n    cancelable: true,\n    key,\n    ...options,\n  });\n  target.dispatchEvent(event);\n  return event;\n}\n"]}

package/src/lib/layout/tree/index.d.ts

@@ -0,0 +1,5 @@
+export * from './tng-tree';
+export * from './tng-tree-item';
+export * from './tng-tree-group';
+export * from './tng-tree-indicator';
+//# sourceMappingURL=index.d.ts.map

package/src/lib/layout/tree/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC"}

package/src/lib/layout/tree/index.js

@@ -0,0 +1,5 @@
+export * from './tng-tree';
+export * from './tng-tree-item';
+export * from './tng-tree-group';
+export * from './tng-tree-indicator';
+//# sourceMappingURL=index.js.map

package/src/lib/layout/tree/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC","sourcesContent":["export * from './tng-tree';\nexport * from './tng-tree-item';\nexport * from './tng-tree-group';\nexport * from './tng-tree-indicator';\n"]}

package/src/lib/layout/tree/tng-tree-group.d.ts

@@ -0,0 +1,10 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import { TngTreeItem } from './tng-tree-item';
+export declare class TngTreeGroup implements OnInit, OnDestroy {
+    readonly parentItem: TngTreeItem | null;
+    protected readonly dataSlot: "tree-group";
+    protected readonly role: "group";
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+}
+//# sourceMappingURL=tng-tree-group.d.ts.map

package/src/lib/layout/tree/tng-tree-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree-group.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,SAAS,EACT,MAAM,EACP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C,qBAKa,YAAa,YAAW,MAAM,EAAE,SAAS;IACpD,SAAgB,UAAU,qBAA2D;IAGrF,SAAS,CAAC,QAAQ,CAAC,QAAQ,EAAG,YAAY,CAAU;IAGpD,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAG,OAAO,CAAU;IAE3C,QAAQ,IAAI,IAAI;IAIhB,WAAW,IAAI,IAAI;CAGpB"}

package/src/lib/layout/tree/tng-tree-group.js

@@ -0,0 +1,29 @@
+import { __decorate } from "tslib";
+import { Directive, HostBinding, inject, } from '@angular/core';
+import { TngTreeItem } from './tng-tree-item';
+let TngTreeGroup = class TngTreeGroup {
+    parentItem = inject(TngTreeItem, { optional: true, skipSelf: true });
+    dataSlot = 'tree-group';
+    role = 'group';
+    ngOnInit() {
+        this.parentItem?.registerChildGroup();
+    }
+    ngOnDestroy() {
+        this.parentItem?.unregisterChildGroup();
+    }
+};
+__decorate([
+    HostBinding('attr.data-slot')
+], TngTreeGroup.prototype, "dataSlot", void 0);
+__decorate([
+    HostBinding('attr.role')
+], TngTreeGroup.prototype, "role", void 0);
+TngTreeGroup = __decorate([
+    Directive({
+        selector: '[tngTreeGroup]',
+        exportAs: 'tngTreeGroup',
+        standalone: true,
+    })
+], TngTreeGroup);
+export { TngTreeGroup };
+//# sourceMappingURL=tng-tree-group.js.map

package/src/lib/layout/tree/tng-tree-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree-group.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree-group.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,SAAS,EAET,WAAW,EACX,MAAM,GAGP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAOvC,IAAM,YAAY,GAAlB,MAAM,YAAY;IACP,UAAU,GAAG,MAAM,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAGlE,QAAQ,GAAG,YAAqB,CAAC;IAGjC,IAAI,GAAG,OAAgB,CAAC;IAE3C,QAAQ;QACN,IAAI,CAAC,UAAU,EAAE,kBAAkB,EAAE,CAAC;IACxC,CAAC;IAED,WAAW;QACT,IAAI,CAAC,UAAU,EAAE,oBAAoB,EAAE,CAAC;IAC1C,CAAC;CACF,CAAA;AAZoB;IADlB,WAAW,CAAC,gBAAgB,CAAC;8CACsB;AAGjC;IADlB,WAAW,CAAC,WAAW,CAAC;0CACkB;AAPhC,YAAY;IALxB,SAAS,CAAC;QACT,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE,cAAc;QACxB,UAAU,EAAE,IAAI;KACjB,CAAC;GACW,YAAY,CAgBxB","sourcesContent":["import {\n  Directive,\n  ElementRef,\n  HostBinding,\n  inject,\n  OnDestroy,\n  OnInit,\n} from '@angular/core';\nimport { TngTreeItem } from './tng-tree-item';\n\n@Directive({\n  selector: '[tngTreeGroup]',\n  exportAs: 'tngTreeGroup',\n  standalone: true,\n})\nexport class TngTreeGroup implements OnInit, OnDestroy {\n  public readonly parentItem = inject(TngTreeItem, { optional: true, skipSelf: true });\n\n  @HostBinding('attr.data-slot')\n  protected readonly dataSlot = 'tree-group' as const;\n\n  @HostBinding('attr.role')\n  protected readonly role = 'group' as const;\n\n  ngOnInit(): void {\n    this.parentItem?.registerChildGroup();\n  }\n\n  ngOnDestroy(): void {\n    this.parentItem?.unregisterChildGroup();\n  }\n}\n"]}

package/src/lib/layout/tree/tng-tree-indicator.d.ts

@@ -0,0 +1,8 @@
+export declare class TngTreeIndicator {
+    private readonly item;
+    private readonly tree;
+    protected readonly dataSlot: "tree-indicator";
+    protected get dataExpanded(): 'true' | 'false';
+    protected onClick(event: MouseEvent): void;
+}
+//# sourceMappingURL=tng-tree-indicator.d.ts.map

package/src/lib/layout/tree/tng-tree-indicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree-indicator.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree-indicator.ts"],"names":[],"mappings":"AASA,qBAKa,gBAAgB;IAC3B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAA2C;IAChE,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAuC;IAG5D,SAAS,CAAC,QAAQ,CAAC,QAAQ,EAAG,gBAAgB,CAAU;IAGxD,SAAS,KAAK,YAAY,IAAI,MAAM,GAAG,OAAO,CAE7C;IAGD,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI;CAM3C"}

package/src/lib/layout/tree/tng-tree-indicator.js

@@ -0,0 +1,36 @@
+import { __decorate } from "tslib";
+import { Directive, HostBinding, HostListener, inject, } from '@angular/core';
+import { TngTree } from './tng-tree';
+import { TngTreeItem } from './tng-tree-item';
+let TngTreeIndicator = class TngTreeIndicator {
+    item = inject(TngTreeItem, { optional: true });
+    tree = inject(TngTree, { optional: true });
+    dataSlot = 'tree-indicator';
+    get dataExpanded() {
+        return this.item?.isExpanded() ? 'true' : 'false';
+    }
+    onClick(event) {
+        event.stopPropagation();
+        if (this.item && this.tree) {
+            this.tree.onIndicatorClicked(this.item);
+        }
+    }
+};
+__decorate([
+    HostBinding('attr.data-slot')
+], TngTreeIndicator.prototype, "dataSlot", void 0);
+__decorate([
+    HostBinding('attr.data-expanded')
+], TngTreeIndicator.prototype, "dataExpanded", null);
+__decorate([
+    HostListener('click', ['$event'])
+], TngTreeIndicator.prototype, "onClick", null);
+TngTreeIndicator = __decorate([
+    Directive({
+        selector: '[tngTreeIndicator]',
+        exportAs: 'tngTreeIndicator',
+        standalone: true,
+    })
+], TngTreeIndicator);
+export { TngTreeIndicator };
+//# sourceMappingURL=tng-tree-indicator.js.map

package/src/lib/layout/tree/tng-tree-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree-indicator.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree-indicator.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,SAAS,EACT,WAAW,EACX,YAAY,EACZ,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAOvC,IAAM,gBAAgB,GAAtB,MAAM,gBAAgB;IACV,IAAI,GAAG,MAAM,CAAC,WAAW,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAC/C,IAAI,GAAG,MAAM,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAGzC,QAAQ,GAAG,gBAAyB,CAAC;IAGxD,IAAc,YAAY;QACxB,OAAO,IAAI,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;IACpD,CAAC;IAGS,OAAO,CAAC,KAAiB;QACjC,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YAC3B,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC1C,CAAC;IACH,CAAC;CACF,CAAA;AAdoB;IADlB,WAAW,CAAC,gBAAgB,CAAC;kDAC0B;AAGxD;IADC,WAAW,CAAC,oBAAoB,CAAC;oDAGjC;AAGS;IADT,YAAY,CAAC,OAAO,EAAE,CAAC,QAAQ,CAAC,CAAC;+CAMjC;AAlBU,gBAAgB;IAL5B,SAAS,CAAC;QACT,QAAQ,EAAE,oBAAoB;QAC9B,QAAQ,EAAE,kBAAkB;QAC5B,UAAU,EAAE,IAAI;KACjB,CAAC;GACW,gBAAgB,CAmB5B","sourcesContent":["import {\n  Directive,\n  HostBinding,\n  HostListener,\n  inject,\n} from '@angular/core';\nimport { TngTree } from './tng-tree';\nimport { TngTreeItem } from './tng-tree-item';\n\n@Directive({\n  selector: '[tngTreeIndicator]',\n  exportAs: 'tngTreeIndicator',\n  standalone: true,\n})\nexport class TngTreeIndicator {\n  private readonly item = inject(TngTreeItem, { optional: true });\n  private readonly tree = inject(TngTree, { optional: true });\n\n  @HostBinding('attr.data-slot')\n  protected readonly dataSlot = 'tree-indicator' as const;\n\n  @HostBinding('attr.data-expanded')\n  protected get dataExpanded(): 'true' | 'false' {\n    return this.item?.isExpanded() ? 'true' : 'false';\n  }\n\n  @HostListener('click', ['$event'])\n  protected onClick(event: MouseEvent): void {\n    event.stopPropagation();\n    if (this.item && this.tree) {\n      this.tree.onIndicatorClicked(this.item);\n    }\n  }\n}\n"]}

package/src/lib/layout/tree/tng-tree-item.d.ts

@@ -0,0 +1,36 @@
+import type { OnInit, OnDestroy } from '@angular/core';
+import { type TngTreeValue } from './tng-tree.transforms';
+export declare class TngTreeItem implements OnInit, OnDestroy {
+    private readonly hostRef;
+    private readonly tree;
+    private readonly parentGroup;
+    readonly value: import("@angular/core").InputSignalWithTransform<TngTreeValue, unknown>;
+    readonly expanded: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+    readonly defaultExpanded: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    readonly expandedChange: import("@angular/core").OutputEmitterRef<boolean>;
+    private uncontrolledExpanded;
+    private hasChildrenStatus;
+    protected readonly dataSlot: "tree-item";
+    protected readonly role: "treeitem";
+    protected get ariaSelected(): string | null;
+    protected get ariaExpanded(): string | null;
+    protected get tabIndex(): string;
+    protected get dataExpanded(): 'true' | 'false';
+    protected get dataSelected(): 'true' | 'false';
+    protected get dataDisabled(): 'true' | 'false';
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    getValue(): TngTreeValue;
+    getHostElement(): HTMLElement;
+    getParentItem(): TngTreeItem | null;
+    isExpanded(): boolean;
+    setExpanded(expanded: boolean): void;
+    canExpand(): boolean;
+    registerChildGroup(): void;
+    unregisterChildGroup(): void;
+    protected onFocus(): void;
+    protected onClick(event: MouseEvent): void;
+    focusHost(): void;
+}
+//# sourceMappingURL=tng-tree-item.d.ts.map

package/src/lib/layout/tree/tng-tree-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree-item.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree-item.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAGvD,OAAO,EAIL,KAAK,YAAY,EAClB,MAAM,uBAAuB,CAAC;AAE/B,qBAKa,WAAY,YAAW,MAAM,EAAE,SAAS;IACnD,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA+C;IACvE,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAuC;IAC5D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAA0H;IAEtJ,SAAgB,KAAK,0EAElB;IAEH,SAAgB,QAAQ,iFAErB;IAEH,SAAgB,eAAe,qEAE5B;IAEH,SAAgB,QAAQ,qEAErB;IAEH,SAAgB,cAAc,oDAAqB;IAEnD,OAAO,CAAC,oBAAoB,CAAS;IACrC,OAAO,CAAC,iBAAiB,CAAS;IAGlC,SAAS,CAAC,QAAQ,CAAC,QAAQ,EAAG,WAAW,CAAU;IAGnD,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAG,UAAU,CAAU;IAG9C,SAAS,KAAK,YAAY,IAAI,MAAM,GAAG,IAAI,CAG1C;IAGD,SAAS,KAAK,YAAY,IAAI,MAAM,GAAG,IAAI,CAG1C;IAGD,SAAS,KAAK,QAAQ,IAAI,MAAM,CAE/B;IAGD,SAAS,KAAK,YAAY,IAAI,MAAM,GAAG,OAAO,CAE7C;IAGD,SAAS,KAAK,YAAY,IAAI,MAAM,GAAG,OAAO,CAG7C;IAGD,SAAS,KAAK,YAAY,IAAI,MAAM,GAAG,OAAO,CAE7C;IAEM,QAAQ,IAAI,IAAI;IAOhB,WAAW,IAAI,IAAI;IAInB,QAAQ,IAAI,YAAY;IAIxB,cAAc,IAAI,WAAW;IAI7B,aAAa,IAAI,WAAW,GAAG,IAAI;IAInC,UAAU,IAAI,OAAO;IAIrB,WAAW,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;IAQpC,SAAS,IAAI,OAAO;IAIpB,kBAAkB,IAAI,IAAI;IAI1B,oBAAoB,IAAI,IAAI;IAKnC,SAAS,CAAC,OAAO,IAAI,IAAI;IAKzB,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI;IAMnC,SAAS,IAAI,IAAI;CAGzB"}

package/src/lib/layout/tree/tng-tree-item.js

@@ -0,0 +1,139 @@
+import { __decorate } from "tslib";
+import { Directive, ElementRef, HostBinding, HostListener, inject, input, output, forwardRef, } from '@angular/core';
+import { TngTree } from './tng-tree';
+import { TngTreeGroup } from './tng-tree-group';
+import { normalizeOptionalBooleanAttribute, normalizeTreeBooleanInput, normalizeTreeValue, } from './tng-tree.transforms';
+let TngTreeItem = class TngTreeItem {
+    hostRef = inject(ElementRef);
+    tree = inject(TngTree, { optional: true });
+    parentGroup = inject(forwardRef(() => TngTreeGroup), { optional: true, skipSelf: true });
+    value = input.required({
+        transform: normalizeTreeValue,
+    });
+    expanded = input(undefined, {
+        transform: normalizeOptionalBooleanAttribute,
+    });
+    defaultExpanded = input(false, {
+        transform: normalizeTreeBooleanInput,
+    });
+    disabled = input(false, {
+        transform: normalizeTreeBooleanInput,
+    });
+    expandedChange = output();
+    uncontrolledExpanded = false;
+    hasChildrenStatus = false;
+    dataSlot = 'tree-item';
+    role = 'treeitem';
+    get ariaSelected() {
+        if (!this.tree || this.tree.selectionMode() === 'none')
+            return null;
+        return this.tree.isItemSelected(this) ? 'true' : 'false';
+    }
+    get ariaExpanded() {
+        if (!this.canExpand())
+            return null;
+        return this.isExpanded() ? 'true' : 'false';
+    }
+    get tabIndex() {
+        return this.tree ? this.tree.getTriggerTabIndex(this) : '-1';
+    }
+    get dataExpanded() {
+        return this.isExpanded() ? 'true' : 'false';
+    }
+    get dataSelected() {
+        if (!this.tree || this.tree.selectionMode() === 'none')
+            return 'false';
+        return this.tree.isItemSelected(this) ? 'true' : 'false';
+    }
+    get dataDisabled() {
+        return this.tree?.isItemDisabled(this) ? 'true' : 'false';
+    }
+    ngOnInit() {
+        if (this.expanded() === undefined) {
+            this.uncontrolledExpanded = this.defaultExpanded();
+        }
+        this.tree?.registerItem(this);
+    }
+    ngOnDestroy() {
+        this.tree?.unregisterItem(this);
+    }
+    getValue() {
+        return this.value();
+    }
+    getHostElement() {
+        return this.hostRef.nativeElement;
+    }
+    getParentItem() {
+        return this.parentGroup?.parentItem ?? null;
+    }
+    isExpanded() {
+        return this.expanded() ?? this.uncontrolledExpanded;
+    }
+    setExpanded(expanded) {
+        if (this.disabled())
+            return;
+        if (this.expanded() === undefined) {
+            this.uncontrolledExpanded = expanded;
+        }
+        this.expandedChange.emit(expanded);
+    }
+    canExpand() {
+        return this.hasChildrenStatus || this.expanded() !== undefined || this.defaultExpanded();
+    }
+    registerChildGroup() {
+        this.hasChildrenStatus = true;
+    }
+    unregisterChildGroup() {
+        this.hasChildrenStatus = false;
+    }
+    onFocus() {
+        this.tree?.onItemFocused(this);
+    }
+    onClick(event) {
+        event.stopPropagation();
+        this.tree?.onItemClicked(this);
+        this.focusHost(); // Ensure it receives focus mentally on click
+    }
+    focusHost() {
+        this.hostRef.nativeElement.focus();
+    }
+};
+__decorate([
+    HostBinding('attr.data-slot')
+], TngTreeItem.prototype, "dataSlot", void 0);
+__decorate([
+    HostBinding('attr.role')
+], TngTreeItem.prototype, "role", void 0);
+__decorate([
+    HostBinding('attr.aria-selected')
+], TngTreeItem.prototype, "ariaSelected", null);
+__decorate([
+    HostBinding('attr.aria-expanded')
+], TngTreeItem.prototype, "ariaExpanded", null);
+__decorate([
+    HostBinding('attr.tabindex')
+], TngTreeItem.prototype, "tabIndex", null);
+__decorate([
+    HostBinding('attr.data-expanded')
+], TngTreeItem.prototype, "dataExpanded", null);
+__decorate([
+    HostBinding('attr.data-selected')
+], TngTreeItem.prototype, "dataSelected", null);
+__decorate([
+    HostBinding('attr.data-disabled')
+], TngTreeItem.prototype, "dataDisabled", null);
+__decorate([
+    HostListener('focus')
+], TngTreeItem.prototype, "onFocus", null);
+__decorate([
+    HostListener('click', ['$event'])
+], TngTreeItem.prototype, "onClick", null);
+TngTreeItem = __decorate([
+    Directive({
+        selector: '[tngTreeItem]',
+        exportAs: 'tngTreeItem',
+        standalone: true,
+    })
+], TngTreeItem);
+export { TngTreeItem };
+//# sourceMappingURL=tng-tree-item.js.map

package/src/lib/layout/tree/tng-tree-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tng-tree-item.js","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree-item.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Directive,\n  ElementRef,\n  HostBinding,\n  HostListener,\n  inject,\n  input,\n  output,\n  forwardRef,\n} from '@angular/core';\nimport type { OnInit, OnDestroy } from '@angular/core';\nimport { TngTree } from './tng-tree';\nimport { TngTreeGroup } from './tng-tree-group';\nimport {\n  normalizeOptionalBooleanAttribute,\n  normalizeTreeBooleanInput,\n  normalizeTreeValue,\n  type TngTreeValue,\n} from './tng-tree.transforms';\n\n@Directive({\n  selector: '[tngTreeItem]',\n  exportAs: 'tngTreeItem',\n  standalone: true,\n})\nexport class TngTreeItem implements OnInit, OnDestroy {\n  private readonly hostRef = inject<ElementRef<HTMLElement>>(ElementRef);\n  private readonly tree = inject(TngTree, { optional: true });\n  private readonly parentGroup: TngTreeGroup | null = inject(forwardRef(() => TngTreeGroup), { optional: true, skipSelf: true }) as TngTreeGroup | null;\n\n  public readonly value = input.required<TngTreeValue, unknown>({\n    transform: normalizeTreeValue,\n  });\n  \n  public readonly expanded = input<boolean, unknown>(undefined, {\n    transform: normalizeOptionalBooleanAttribute,\n  });\n  \n  public readonly defaultExpanded = input<boolean, unknown>(false, {\n    transform: normalizeTreeBooleanInput,\n  });\n  \n  public readonly disabled = input<boolean, unknown>(false, {\n    transform: normalizeTreeBooleanInput,\n  });\n\n  public readonly expandedChange = output<boolean>();\n\n  private uncontrolledExpanded = false;\n  private hasChildrenStatus = false;\n\n  @HostBinding('attr.data-slot')\n  protected readonly dataSlot = 'tree-item' as const;\n\n  @HostBinding('attr.role')\n  protected readonly role = 'treeitem' as const;\n\n  @HostBinding('attr.aria-selected')\n  protected get ariaSelected(): string | null {\n    if (!this.tree || this.tree.selectionMode() === 'none') return null;\n    return this.tree.isItemSelected(this) ? 'true' : 'false';\n  }\n\n  @HostBinding('attr.aria-expanded')\n  protected get ariaExpanded(): string | null {\n    if (!this.canExpand()) return null;\n    return this.isExpanded() ? 'true' : 'false';\n  }\n\n  @HostBinding('attr.tabindex')\n  protected get tabIndex(): string {\n    return this.tree ? this.tree.getTriggerTabIndex(this) : '-1';\n  }\n\n  @HostBinding('attr.data-expanded')\n  protected get dataExpanded(): 'true' | 'false' {\n    return this.isExpanded() ? 'true' : 'false';\n  }\n\n  @HostBinding('attr.data-selected')\n  protected get dataSelected(): 'true' | 'false' {\n     if (!this.tree || this.tree.selectionMode() === 'none') return 'false';\n     return this.tree.isItemSelected(this) ? 'true' : 'false';\n  }\n\n  @HostBinding('attr.data-disabled')\n  protected get dataDisabled(): 'true' | 'false' {\n    return this.tree?.isItemDisabled(this) ? 'true' : 'false';\n  }\n\n  public ngOnInit(): void {\n    if (this.expanded() === undefined) {\n      this.uncontrolledExpanded = this.defaultExpanded();\n    }\n    this.tree?.registerItem(this);\n  }\n\n  public ngOnDestroy(): void {\n    this.tree?.unregisterItem(this);\n  }\n\n  public getValue(): TngTreeValue {\n    return this.value();\n  }\n\n  public getHostElement(): HTMLElement {\n    return this.hostRef.nativeElement;\n  }\n\n  public getParentItem(): TngTreeItem | null {\n    return this.parentGroup?.parentItem ?? null;\n  }\n\n  public isExpanded(): boolean {\n    return this.expanded() ?? this.uncontrolledExpanded;\n  }\n\n  public setExpanded(expanded: boolean): void {\n    if (this.disabled()) return;\n    if (this.expanded() === undefined) {\n      this.uncontrolledExpanded = expanded;\n    }\n    this.expandedChange.emit(expanded);\n  }\n\n  public canExpand(): boolean {\n    return this.hasChildrenStatus || this.expanded() !== undefined || this.defaultExpanded();\n  }\n\n  public registerChildGroup(): void {\n    this.hasChildrenStatus = true;\n  }\n\n  public unregisterChildGroup(): void {\n    this.hasChildrenStatus = false;\n  }\n\n  @HostListener('focus')\n  protected onFocus(): void {\n    this.tree?.onItemFocused(this);\n  }\n\n  @HostListener('click', ['$event'])\n  protected onClick(event: MouseEvent): void {\n    event.stopPropagation();\n    this.tree?.onItemClicked(this);\n    this.focusHost(); // Ensure it receives focus mentally on click\n  }\n\n  public focusHost(): void {\n    this.hostRef.nativeElement.focus();\n  }\n}\n"]}

package/src/lib/layout/tree/tng-tree.d.ts

@@ -1,4 +1,67 @@
-export declare class TngTree {
+import { OnDestroy } from '@angular/core';
+import { TngTreeItem } from './tng-tree-item';
+import { type TngTreeOrientation, type TngTreeSelectionMode, type TngTreeValue } from './tng-tree.transforms';
+export type { TngTreeOrientation, TngTreeSelectionMode, TngTreeValue } from './tng-tree.transforms';
+export declare class TngTree implements OnDestroy {
+    private readonly hostRef;
+    private readonly items;
+    private readonly modelIdByItem;
+    private readonly emptyModelNodes;
+    private readonly emptyTypeaheadItems;
+    private model;
+    private modelState;
+    private readonly roving;
+    private readonly typeahead;
+    private itemByModelId;
+    private childModelIdsByParentId;
+    private nextModelId;
+    private uncontrolledSelection;
+    private initialized;
+    readonly selectionMode: import("@angular/core").InputSignalWithTransform<TngTreeSelectionMode, unknown>;
+    readonly orientation: import("@angular/core").InputSignalWithTransform<TngTreeOrientation, unknown>;
+    readonly value: import("@angular/core").InputSignalWithTransform<TngTreeValue | readonly TngTreeValue[] | null | undefined, unknown>;
+    readonly defaultValue: import("@angular/core").InputSignalWithTransform<TngTreeValue | readonly TngTreeValue[] | null | undefined, unknown>;
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    readonly valueChange: import("@angular/core").OutputEmitterRef<TngTreeValue | readonly TngTreeValue[] | null>;
     protected readonly dataSlot: "tree";
+    protected readonly role: "tree";
+    protected get ariaOrientation(): string;
+    protected get ariaMultiselectable(): string | null;
+    protected get tabIndex(): string;
+    ngOnDestroy(): void;
+    registerItem(item: TngTreeItem): void;
+    unregisterItem(item: TngTreeItem): void;
+    isItemSelected(item: TngTreeItem): boolean;
+    isItemDisabled(item: TngTreeItem): boolean;
+    getTriggerTabIndex(item: TngTreeItem): string;
+    onItemFocused(item: TngTreeItem): void;
+    onItemClicked(item: TngTreeItem): void;
+    onIndicatorClicked(item: TngTreeItem): void;
+    private isControlled;
+    private initializeUncontrolledState;
+    private getEffectiveSelectionSet;
+    private requestToggleSelection;
+    protected onHostKeydown(event: KeyboardEvent): void;
+    protected onHostFocus(): void;
+    private applyModelState;
+    private ensureModelId;
+    private resolveModelId;
+    private resolveActiveItem;
+    private resolveItemByModelId;
+    private focusBoundaryItem;
+    private focusActiveItem;
+    private focusItem;
+    private resolveFirstVisibleEnabledChild;
+    private resolveTypeaheadItems;
+    private resolveDisabledVisibleIds;
+    private resolveTypeaheadText;
+    private handleTypeaheadKey;
+    private runHorizontalKeyAction;
+    private runResolvedNavigationAction;
+    private expandOrMoveToChild;
+    private collapseOrMoveToParent;
+    private rebuildModel;
+    private buildOrderedModelItems;
+    private resolvePreferredActiveId;
 }
 //# sourceMappingURL=tng-tree.d.ts.map

package/src/lib/layout/tree/tng-tree.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tng-tree.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree.ts"],"names":[],"mappings":"AAEA,qBAIa,OAAO;IAElB,SAAS,CAAC,QAAQ,CAAC,QAAQ,EAAG,MAAM,CAAU;CAC/C"}
+{"version":3,"file":"tng-tree.d.ts","sourceRoot":"","sources":["../../../../../../../../libs/tailng-ui/primitives/src/lib/layout/tree/tng-tree.ts"],"names":[],"mappings":"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"}