import * as ngwr_i18n from 'ngwr/i18n'; import * as _angular_core from '@angular/core'; import { TemplateRef } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; /** * @license * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE */ /** A single node in a {@link WrTree}. Nodes are immutable. */ interface WrTreeNode { readonly id: TId; readonly label: string; readonly children?: readonly WrTreeNode[]; readonly disabled?: boolean; } /** Selection mode for {@link WrTree}. */ type WrTreeSelectionMode = 'none' | 'single' | 'multi'; interface FlatNode { readonly node: WrTreeNode; readonly depth: number; readonly hasChildren: boolean; } interface SelectedChip { readonly id: TId; readonly label: string; } /** * Hierarchical tree. Data-driven — pass `[nodes]` with optional `children` * arrays. Supports single / multi selection (two-way `[(selected)]`), * controlled expand state (two-way `[(expanded)]`), and full keyboard * navigation. * * Two render shapes, picked by `[openOn]`: * - `'inline'` (default) — renders the tree list in-place. Use as a display * widget or form-less hierarchical picker. * - `'overlay'` — renders a ``-style trigger button (with chips * in multi mode) that opens a popover containing the tree. Acts as a * `ControlValueAccessor` — bind via `[(ngModel)]`, `[formControl]`, or * `formControlName`. Replaces the standalone ``. * * Value type in `overlay` mode: `TId | null` in single mode, * `readonly TId[]` in multi mode. * * @example * ```html * * * * * * ``` * * @see https://ngwr.dev/components/tree */ declare class WrTree implements ControlValueAccessor { /** Tree data. */ readonly nodes: _angular_core.InputSignal[]>; /** Selected node ids (two-way bindable). */ readonly selected: _angular_core.ModelSignal; /** Expanded node ids (two-way bindable). */ readonly expanded: _angular_core.ModelSignal; /** Selection behavior. @default 'single' */ readonly selectionMode: _angular_core.InputSignal; /** Disable the whole tree. @default false */ readonly disabled: _angular_core.InputSignalWithTransform; /** Render shape. @default 'inline' */ readonly openOn: _angular_core.InputSignal<"inline" | "overlay">; /** Placeholder shown on the trigger when no node is selected. */ readonly placeholder: _angular_core.InputSignal; /** Show a clear-all (×) button on the trigger when at least one node is selected. @default true */ readonly clearable: _angular_core.InputSignalWithTransform; /** * Cap on the number of chips rendered on the trigger before * collapsing the rest into `+N more` (multi mode only). `0` = render * every chip. @default 0 */ readonly maxTagCount: _angular_core.InputSignalWithTransform; /** Auto-expand every node that has children on first open of the overlay. @default false */ readonly defaultExpandAll: _angular_core.InputSignalWithTransform; private readonly host; private readonly overlay; private readonly vcr; private readonly scrollStrategies; private readonly destroyRef; /** Currently focused row's index in the flattened visible list. */ protected readonly focusedIndex: _angular_core.WritableSignal; /** Resolved ARIA labels — pick up live locale changes via re-render. */ protected readonly clearLabel: string; protected readonly expandLabel: string; protected readonly collapseLabel: string; protected readonly chipRemoveLabel: (params?: ngwr_i18n.WrI18nParams) => string; /** Flattened list of currently visible nodes — what the template renders. */ protected readonly flat: _angular_core.Signal[]>; protected readonly selectedSet: _angular_core.Signal>; protected readonly expandedSet: _angular_core.Signal>; protected readonly isOverlay: _angular_core.Signal; protected readonly isMulti: _angular_core.Signal; protected readonly hasSelection: _angular_core.Signal; /** Overlay-mode trigger label / chip map. */ private readonly labelMap; protected readonly selectedChips: _angular_core.Signal[]>; protected readonly visibleChips: _angular_core.Signal[]>; protected readonly hiddenChipCount: _angular_core.Signal; protected readonly singleLabel: _angular_core.Signal; /** Overlay open state. Only meaningful when `openOn='overlay'`. */ protected readonly open: _angular_core.WritableSignal; /** Trigger / panel id for `aria-controls`. */ protected readonly panelId: string; private readonly disabledFromCva; protected readonly isDisabled: _angular_core.Signal; protected readonly classes: _angular_core.Signal; protected readonly panelTpl: _angular_core.Signal | undefined>; private overlayRef; private onChange; /** @internal exposed so the trigger can fire on blur. */ protected onTouched: () => void; constructor(); writeValue(value: unknown): void; registerOnChange(fn: (value: TId | readonly TId[] | null) => void): void; registerOnTouched(fn: () => void): void; setDisabledState(isDisabled: boolean): void; protected onRowClick(flat: FlatNode, event: MouseEvent): void; protected onToggleClick(node: WrTreeNode, event: MouseEvent): void; protected onKeydown(event: KeyboardEvent): void; protected onTriggerClick(): void; protected removeChip(id: TId, event: Event): void; protected clearSelection(event: Event): void; private toggleExpanded; private select; private emit; private focusIndex; private collectExpandableIds; private openOverlay; private closeOverlay; static ɵfac: _angular_core.ɵɵFactoryDeclaration, never>; static ɵcmp: _angular_core.ɵɵComponentDeclaration, "wr-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "openOn": { "alias": "openOn"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "maxTagCount": { "alias": "maxTagCount"; "required": false; "isSignal": true; }; "defaultExpandAll": { "alias": "defaultExpandAll"; "required": false; "isSignal": true; }; }, { "selected": "selectedChange"; "expanded": "expandedChange"; }, never, never, true, never>; } export { WrTree }; export type { WrTreeNode, WrTreeSelectionMode };