@nyx-ds/treeview 0.1.0 → 0.1.1

package/dist/event.d.ts

@@ -0,0 +1,10 @@
+export interface EventOptions {
+    bubbles?: boolean;
+    cancelable?: boolean;
+    composed?: boolean;
+    native?: boolean;
+}
+export interface EventDispatcher<T> {
+    (value: T, options?: EventOptions): void;
+}
+export declare function event(customName?: string): (protoOrDescriptor: {}, name: string) => void;

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./treeview";
+export * from "./treeview-search";
+export * from "./treeview-lazy";
+export * from "./treeview-sort";

package/dist/treeview-a11y.d.ts

@@ -0,0 +1,5 @@
+/** Accessible name builders for treeview row controls. */
+export declare function buildTreeExpanderAriaLabel(nodeLabel: string, expanded: boolean): string;
+export declare function buildTreeRowCheckboxAriaLabel(nodeLabel: string): string;
+export declare function buildTreeColumnCheckboxAriaLabel(columnTitle: string, nodeLabel: string): string;
+export declare function buildTreeSearchStatusMessage(matchCount: number): string;

package/dist/treeview-lazy.d.ts

@@ -0,0 +1,68 @@
+import type { ITreeNode } from "./treeview";
+/** Default nodes loaded per lazy/virtual scroll page. */
+export declare const TREE_LAZY_PAGE_SIZE = 50;
+export declare const TREE_LAZY_INITIAL_MAX_DEPTH = 2;
+export interface IndexedTreeNode {
+    id: string | number;
+    depth: number;
+    parentId: string | number | null;
+    hasChildrenInSource: boolean;
+}
+export interface FlatTreeRow {
+    node: ITreeNode;
+    level: number;
+    revealSubtree: boolean;
+    parentLabelMatched: boolean;
+    hasChildrenInSource: boolean;
+}
+export declare function indexTreeNodes(roots: ITreeNode[]): IndexedTreeNode[];
+/** First chunk: up to `pageSize` nodes, only while depth <= maxDepth (0…2). */
+export declare function getInitialLoadedIds(index: IndexedTreeNode[], pageSize?: number, maxDepth?: number): Set<string | number>;
+/** First page of root nodes only — keeps collapsed lists scrollable (e.g. 1000 folders). */
+export declare function getInitialLoadedRootIds(index: IndexedTreeNode[], pageSize?: number): Set<string | number>;
+export declare function getNextLoadRootIds(index: IndexedTreeNode[], loadedIds: ReadonlySet<string | number>, pageSize: number): (string | number)[];
+export declare function hasMoreRootsToLoad(index: IndexedTreeNode[], loadedIds: ReadonlySet<string | number>): boolean;
+export declare function hasMoreNodesToLoad(index: IndexedTreeNode[], loadedIds: ReadonlySet<string | number>): boolean;
+export declare function hasUnloadedDescendants(nodeId: string | number, index: IndexedTreeNode[], loadedIds: ReadonlySet<string | number>): boolean;
+/** Root id (depth 0) for a flat row — used to prioritize lazy loads on scroll. */
+export declare function getRootIdForFlatRow(row: FlatTreeRow | undefined, indexById: Map<string | number, IndexedTreeNode>): string | number | undefined;
+/**
+ * Picks a root to prioritize when loading the next lazy page on scroll
+ * (search results or expanded folders with many descendants).
+ */
+export declare function getNextLoadPriorityRootId(flatRows: FlatTreeRow[], lastVisibleIndex: number, expandedIds: ReadonlySet<string | number>, index: IndexedTreeNode[], loadedIds: ReadonlySet<string | number>, indexById: Map<string | number, IndexedTreeNode>): string | number | undefined;
+export declare function getAncestorIds(id: string | number, indexById: Map<string | number, IndexedTreeNode>): (string | number)[];
+/**
+ * Loads the next page of node ids (global BFS order), optionally prioritizing
+ * descendants of `priorityRootId` when a folder is expanded.
+ */
+export declare function getNextLoadIds(index: IndexedTreeNode[], loadedIds: ReadonlySet<string | number>, pageSize: number, priorityRootId?: string | number): (string | number)[];
+export declare function collectSubtreeIds(index: IndexedTreeNode[], rootId: string | number): (string | number)[];
+/** All descendant ids under `rootId` that are not loaded yet (for expand). */
+export declare function getUnloadedSubtreeIds(index: IndexedTreeNode[], rootId: string | number, loadedIds: ReadonlySet<string | number>): (string | number)[];
+/** First page of an expanded subtree (remaining ids load on virtualizer scroll). */
+export declare function getNextSubtreeLoadIds(index: IndexedTreeNode[], rootId: string | number, loadedIds: ReadonlySet<string | number>, pageSize?: number): (string | number)[];
+/** Structural clone: copies tree fields and preserves `data` by reference. */
+export declare function cloneTreeNode(node: ITreeNode): ITreeNode;
+export declare function buildSourceMaps(roots: ITreeNode[]): Map<string | number, ITreeNode>;
+/** Builds the materialized tree containing only loaded node ids. */
+export declare function materializeLoadedTree(roots: ITreeNode[], loadedIds: ReadonlySet<string | number>, sourceById: Map<string | number, ITreeNode>): ITreeNode[];
+export declare function buildFlatVisibleRows(options: {
+    items: ITreeNode[];
+    expandedIds: ReadonlySet<string | number>;
+    hasSearch: boolean;
+    searchTerm: string;
+    searchVisibleIds: ReadonlySet<string | number>;
+    sourceHasChildren: (id: string | number) => boolean;
+    getSourceChildren?: (id: string | number) => ITreeNode[] | undefined;
+}): FlatTreeRow[];
+export declare function ensureIdsLoaded(ids: Iterable<string | number>, loadedIds: Set<string | number>, indexById: Map<string | number, IndexedTreeNode>): boolean;
+/** Whether search still has visible hits that are not materialized yet. */
+export declare function hasMoreSearchVisibleToLoad(visibleIds: ReadonlySet<string | number>, loadedIds: ReadonlySet<string | number>): boolean;
+/**
+ * Next lazy page for search: visible hits only (plus ancestors), preserving
+ * discovery order from `computeTreeSearch` so scroll can paginate homonymous folders.
+ */
+export declare function getNextSearchVisibleLoadIds(visibleIds: ReadonlySet<string | number>, loadedIds: ReadonlySet<string | number>, indexById: Map<string | number, IndexedTreeNode>, pageSize?: number): (string | number)[];
+/** Loads one search page into `loadedIds`. Returns whether anything was added. */
+export declare function loadNextSearchVisiblePage(visibleIds: ReadonlySet<string | number>, loadedIds: Set<string | number>, indexById: Map<string | number, IndexedTreeNode>, pageSize?: number): boolean;

package/dist/treeview-search.d.ts

@@ -0,0 +1,49 @@
+/**
+ * Pure search helpers for nyx-treeview (unit-testable, framework-agnostic).
+ */
+/** Debounce delay (ms) before applying search filter after typing. */
+export declare const TREE_SEARCH_DEBOUNCE_MS = 200;
+export interface TreeSearchNode {
+    id: string | number;
+    label: string;
+    children?: TreeSearchNode[];
+}
+export interface TreeSearchState {
+    visibleIds: Set<string | number>;
+    expandIds: Set<string | number>;
+}
+export interface TreeSearchIndexEntry {
+    id: string | number;
+    parentId: string | number | null;
+    normalizedLabel: string;
+    childIds: (string | number)[];
+    hasChildren: boolean;
+}
+/** Flat index for O(1) lookup and iterative search (no deep recursion). */
+export interface TreeSearchIndex {
+    roots: (string | number)[];
+    byId: Map<string | number, TreeSearchIndexEntry>;
+    size: number;
+}
+export declare function labelMatchesSearch(label: string, term: string): boolean;
+/** Builds parent/child maps and pre-normalized labels in one iterative pass. */
+export declare function buildTreeSearchIndex(items: TreeSearchNode[]): TreeSearchIndex;
+/**
+ * Computes visible nodes and auto-expand targets for the current search term.
+ * Any depth: every label match is listed; ancestors on the path are included too.
+ */
+/** Counts nodes whose label matches the search term (excludes ancestor-only rows). */
+export declare function countTreeSearchMatches(itemsOrIndex: TreeSearchNode[] | TreeSearchIndex, term: string): number;
+export declare function computeTreeSearch(itemsOrIndex: TreeSearchNode[] | TreeSearchIndex, term: string, userCollapsedIds?: ReadonlySet<string | number>): TreeSearchState;
+export declare function getChildNodesForSearch(parent: TreeSearchNode, visibleIds: ReadonlySet<string | number>, term?: string): TreeSearchNode[];
+/** Whether any descendant label matches the search term. */
+export declare function hasLabelMatchingDescendant(nodeId: string | number, term: string, getChildren: (id: string | number) => TreeSearchNode[] | undefined): boolean;
+/** Whether any descendant in `getChildren` is included in search `visibleIds`. */
+export declare function hasVisibleSearchDescendant(nodeId: string | number, visibleIds: ReadonlySet<string | number>, getChildren: (id: string | number) => TreeSearchNode[] | undefined): boolean;
+/**
+ * During search, show every child only for an exclusive folder hit (no deeper visible match).
+ * Partial terms like "1" keep children filtered by `visibleIds`.
+ */
+export declare function shouldShowAllChildrenOnSearchExpand(label: string, term: string, parentLabelMatched: boolean, nodeId: string | number, visibleIds: ReadonlySet<string | number>, getChildren: (id: string | number) => TreeSearchNode[] | undefined): boolean;
+export declare function isFolderSearchHit(label: string, term: string, parentLabelMatched: boolean): boolean;
+export declare function shouldRevealSubtree(label: string, term: string, revealSubtree: boolean, parentLabelMatched: boolean): boolean;

package/dist/treeview-sort.d.ts

@@ -0,0 +1,10 @@
+import type { ITreeNode } from "./treeview";
+/**
+ * Whether the node or any descendant has row/column selection state.
+ */
+export declare function hasSelectionInSubtree(node: ITreeNode, usesSimpleRowSelection: boolean): boolean;
+/**
+ * Sorts siblings so nodes with selection (direct or in subtree) appear first.
+ * Preserves relative order within selected and unselected groups.
+ */
+export declare function sortTreeSelectedFirst(nodes: ITreeNode[], usesSimpleRowSelection: boolean): ITreeNode[];

package/dist/treeview.d.ts

@@ -0,0 +1,347 @@
+import { LitElement, type TemplateResult } from "lit";
+import { EventDispatcher } from "./event";
+import "@lit-labs/virtualizer";
+import "@nyx-ds/input";
+import "@nyx-ds/checkbox";
+import "@nyx-ds/icon";
+import "@nyx-ds/button";
+/**
+ * Configuration options for rendering an icon within the tree or headers.
+ * Can be used to define FontAwesome icons, external images, or raw SVGs.
+ */
+export interface ITreeIconOptions {
+    /**
+     * The name of the icon (e.g., 'folder', 'user', 'check').
+     * Used when integrating with icon libraries like FontAwesome.
+     */
+    name?: string;
+    /**
+     * The style variant of the icon.
+     * Common values: 'solid', 'regular', 'light', 'duotone'.
+     * @default 'regular'
+     */
+    variant?: string;
+    /**
+     * URL source for an external image or SVG file.
+     * If provided, renders an <img> tag or fetches the SVG.
+     */
+    src?: string;
+    /**
+     * Raw SVG string content.
+     * Useful for inline SVGs without external dependencies.
+     */
+    svg?: string;
+}
+/**
+ * Defines a column that appears on the right side of the treeview.
+ * Each column represents a specific permission or state (represented by a checkbox).
+ */
+export interface ITreeColumn {
+    /**
+     * Unique identifier for the column.
+     * This ID is used in `ITreeNode.selectedColumns` and `ITreeNode.disabledColumns` to map values.
+     */
+    id: string | number;
+    /**
+     * Title text for the column header.
+     * Often used as a tooltip or accessible label.
+     */
+    title?: string;
+    /**
+     * Icon displayed in the column header.
+     * Can be a string (icon name) or a detailed `ITreeIconOptions` object.
+     */
+    icon?: string | ITreeIconOptions;
+    /**
+     * IDs of columns that are prerequisites for this column.
+     * Checking this column also checks its prerequisites in the node and its
+     * subtree; unchecking a prerequisite unchecks every column that requires it
+     * (reverse cascade). Dependencies are resolved transitively.
+     * Leave undefined for independent columns.
+     */
+    requires?: (string | number)[];
+}
+/**
+ * Represents a single row (node) in the hierarchical tree structure.
+ */
+export interface ITreeNode {
+    /**
+     * Unique identifier for the node.
+     * Used for tracking expansion state and selection logic.
+     */
+    id: string | number;
+    /**
+     * The main text label displayed for the node.
+     */
+    label: string;
+    /**
+     * The icon displayed next to the label (e.g., folder or file icon).
+     */
+    icon?: string | ITreeIconOptions;
+    /**
+     * Array containing the `id` of columns that are currently checked/selected for this node.
+     */
+    selectedColumns?: (string | number)[];
+    /**
+     * Array containing the `id` of columns that should be disabled (read-only) for this node.
+     * The checkbox will appear visually disabled and cannot be toggled.
+     */
+    disabledColumns?: (string | number)[];
+    /**
+     * Nested child nodes associated with this parent node.
+     */
+    children?: ITreeNode[];
+    /**
+     * Row selected when `showRowSelection` is enabled without column permissions.
+     */
+    selected?: boolean;
+    /**
+     * Optional payload to store extra business logic or metadata.
+     * This is preserved but not used visually by the component.
+     */
+    data?: any;
+}
+/**
+ * Main configuration object passed to the `<nyx-treeview>` component.
+ */
+export interface ITreeViewOptions {
+    /**
+     * The main title displayed at the top left of the component header.
+     */
+    title: string;
+    /**
+     * The root array of data nodes to render.
+     */
+    items: ITreeNode[];
+    /**
+     * The initial depth level to automatically expand nodes.
+     * 0 = Root only, 1 = First level children, etc.
+     * Works with `lazyLoad`: loads required nodes, then expands on init.
+     */
+    defaultExpandedLevel?: number;
+    /**
+     * Definitions for the checkbox columns displayed on the right side.
+     */
+    columns?: ITreeColumn[];
+    /**
+     * If `true`, renders a master checkbox at the start of the row.
+     * With column permissions: toggles all columns for the row.
+     * Without columns: toggles `selected` on the row and its descendants.
+     */
+    showRowSelection?: boolean;
+    /**
+     * Shows header icons and per-row permission checkboxes on the right.
+     * Defaults to `true` when `columns` has at least one entry.
+     */
+    showColumnPermissions?: boolean;
+    /**
+     * Enables chunked data loading and virtual scroll.
+     * Initial view: first page of root folders (collapsed); children load on expand.
+     * Scroll loads more rows; only visible rows are mounted in the DOM.
+     */
+    lazyLoad?: boolean;
+    /**
+     * How many folders/items to load per lazy/virtual scroll page when `lazyLoad` is enabled.
+     * @default 50
+     */
+    lazyLoadPageSize?: number;
+    /**
+     * When `true`, siblings with row/column selection (or selected descendants)
+     * are sorted to the top. Useful when reopening an edit form so previously
+     * chosen folders are easier to find.
+     */
+    sortSelectedFirst?: boolean;
+    /**
+     * Shows the per-row type icon next to the expander.
+     * Defaults to `true`.
+     */
+    showNodeIcons?: boolean;
+}
+/**
+ * Nyx Treeview Component.
+ *
+ * A hierarchical list component that supports expandable nodes, multi-column checkbox selection,
+ * search filtering, keyboard navigation, and WAI-ARIA `tree` / `treeitem` semantics.
+ *
+ * @event nyx-change - Fired when any selection changes (checkbox toggle). Returns `{ items: ITreeNode[] }`.
+ * With `lazyLoad`, `items` is the full source tree (`_sourceItems`), including nodes not yet materialized in the viewport.
+ *
+ * @cssproperty [--treeview-radius=var(--nyx-radii-s)] - Border radius of the container.
+ * @cssproperty [--treeview-search-padding=var(--nyx-sizing-1-25) var(--nyx-sizing-1-75) 0 var(--nyx-sizing-1-75)] - Padding of the search container.
+ * @cssproperty [--treeview-header-padding=var(--nyx-sizing-2) var(--nyx-sizing-2) var(--nyx-sizing-1-75) var(--nyx-sizing-2)] - Padding of the header row.
+ * @cssproperty [--treeview-row-padding=var(--nyx-sizing-1-5, 12px) var(--nyx-sizing-2)] - Padding of data rows.
+ * @cssproperty [--treeview-row-gap=var(--nyx-sizing-2)] - Gap between elements in a row.
+ * @cssproperty [--treeview-col-gap=var(--nyx-sizing-1)] - Gap between column checkboxes.
+ * @cssproperty [--treeview-node-gap=var(--nyx-sizing-1)] - Gap between expander, icon, and text.
+ * @cssproperty [--treeview-row-min-height=48px] - Minimum height of rows (Figma default).
+ * @cssproperty [--treeview-indent-base=16px] - Left padding at tree level 0.
+ * @cssproperty [--treeview-indent-step=24px] - Additional left padding per nested level.
+ * @cssproperty [--treeview-expander-wrapper-size=var(--nyx-sizing-4)] - Size of the expander button area.
+ * @cssproperty [--treeview-expander-padding=var(--nyx-sizing-1-25)] - Padding inside the expander button.
+ *
+ * @cssproperty [--treeview-background=var(--nyx-color-neutral-background-primary)] - Component background color.
+ * @cssproperty [--treeview-border-color=var(--nyx-color-neutral-border-tertiary)] - Component border color.
+ * @cssproperty [--treeview-content-color=var(--nyx-color-neutral-content-primary)] - Default text and icon color.
+ * @cssproperty [--treeview-focus-border-color=var(--nyx-color-brand-border-default)] - Color of keyboard focus ring.
+ * @cssproperty [--treeview-row-selected-background=var(--nyx-color-brand-background-softer)] - Background of selected rows.
+ * @cssproperty [--treeview-row-selected-hover-background=var(--nyx-color-brand-background-softer-hover)] - Background of selected rows on hover.
+ * @cssproperty [--treeview-row-selected-color=var(--nyx-color-neutral-content-primary)] - Text color of selected rows.
+ *
+ * @cssproperty [--treeview-font-family=var(--nyx-font-family-font-family)] - Font family.
+ * @cssproperty [--treeview-title-font-size=var(--nyx-label-medium-font-size)] - Header title font size.
+ * @cssproperty [--treeview-title-line-height=var(--nyx-label-medium-line-height)] - Header title line height.
+ * @cssproperty [--treeview-text-font-size=var(--nyx-label-medium-font-size)] - Row text font size.
+ * @cssproperty [--treeview-text-line-height=var(--nyx-label-medium-line-height)] - Row text line height.
+ * @cssproperty [--treeview-header-icon-size=var(--nyx-label-large-font-size)] - Size of header icons.
+ * @cssproperty [--treeview-node-icon-size=var(--nyx-label-medium-font-size)] - Size of node icons.
+ * @cssproperty [--treeview-expander-icon-size=var(--nyx-label-large-font-size)] - Size of expander chevron.
+ *
+ * @cssproperty [--treeview-row-hover-background=var(--nyx-color-neutral-background-secondary)] - Background of rows on hover.
+ * @cssproperty [--treeview-row-hover-color=var(--nyx-color-brand-content-hover)] - Text color of rows on hover.
+ * @cssproperty [--treeview-expander-hover-background=var(--nyx-color-brand-background-softer-hover)] - Background of expander on hover.
+ */
+export declare class NyxTreeview extends LitElement {
+    /**
+     * Configuration object for the Treeview.
+     *
+     * Expects an object matching the `ITreeViewOptions` interface:
+     * - `title`: String header.
+     * - `items`: Array of `ITreeNode`.
+     * - `columns`: Array of `ITreeColumn`.
+     * - `showRowSelection`: Boolean.
+     */
+    private _options?;
+    get options(): ITreeViewOptions | undefined;
+    set options(value: ITreeViewOptions | undefined);
+    private _items;
+    private _expandedIds;
+    private _searchTerm;
+    private _searchStatusMessage;
+    private _searchVisibleIds;
+    private _searchUserCollapsedIds;
+    private _searchManualExpandedIds;
+    private _expandedIdsBeforeSearch;
+    private _flatRows;
+    private _loadedIds;
+    private _activeRowId;
+    private _sourceItems;
+    private _lazyItemsSourceRef;
+    private _treeIndex;
+    private _indexById;
+    private _sourceById;
+    private _lazyScrollLoading;
+    private _searchIndex;
+    private _searchIndexSourceRef;
+    private _searchDebounceTimer;
+    onChange: EventDispatcher<{
+        items: ITreeNode[];
+    }>;
+    private _isLazyEnabled;
+    private _getLazyPageSize;
+    private _hasColumnPermissions;
+    private _showRowSelection;
+    private _showNodeIcons;
+    private _usesSimpleRowSelection;
+    private _applyItemsFromOptions;
+    private _applyOptionsChange;
+    private _initLazyState;
+    /**
+     * Expands only nodes already present in the materialized tree.
+     * Further rows appear as lazy load + scroll bring more ids into `_items`.
+     */
+    private _applyLazyInitialExpansion;
+    private _rebuildMaterializedItems;
+    private _selectionRoots;
+    /** Full source node for selection UI/state (lazy materialized nodes may omit children). */
+    private _selectionNode;
+    private _invalidateSearchIndex;
+    /** Clears search-derived sets so a data source swap cannot reuse stale ids. */
+    private _resetSearchDerivedState;
+    private _ensureSearchIndex;
+    disconnectedCallback(): void;
+    private _findNodeById;
+    private _forEachInSubtree;
+    private _getSourceChildren;
+    private _loadMoreNodes;
+    private _loadSubtreeForExpand;
+    private _sourceHasChildren;
+    /** Refresh lazy flat rows after intentional lazy state mutations. */
+    private _commitLazyRows;
+    private _syncFlatRows;
+    private _setActiveRow;
+    private _syncActiveRowWithVisibleRows;
+    private _getRowTabIndex;
+    private _rowDomId;
+    private _rowSelector;
+    private _isSearchActive;
+    /** Index to scroll to after search — deepest hit, or first homonymous child. */
+    private _getSearchScrollTargetIndex;
+    private _loadUntilSearchTargetVisible;
+    private _scrollToSearchTarget;
+    private _hasExpandedUnloadedSubtree;
+    /** Expanded folder hit with no deeper visible match — may lazy-load all children. */
+    private _hasExclusiveSearchFolderWithUnloadedChildren;
+    private _shouldLoadMoreOnScroll;
+    private _getLazyLoadPriorityRootId;
+    private _getScrollPrefetchMargin;
+    private _onVirtualizerVisibilityChanged;
+    private _getTreeAriaLabel;
+    private _renderTreeRow;
+    private _renderExpanderCell;
+    private _renderNodeTypeIcon;
+    private _generateLightDomIcons;
+    private _createIconElement;
+    private _expandToLevel;
+    private _isColumnDisabled;
+    private _isNodeSelected;
+    private _isIndeterminate;
+    private _allDescendantsSelected;
+    private _getFlatDescendants;
+    /** Transitive set of prerequisite column ids for `columnId` (excludes itself). */
+    private _requiredClosure;
+    /** Transitive set of column ids that depend on `columnId` (excludes itself). */
+    private _dependentsClosure;
+    private _canEnableColumn;
+    private _handleCheck;
+    private _toggleNodeState;
+    private _updateParents;
+    private _isRowAllSelected;
+    private _isRowIndeterminate;
+    private _isSimpleRowAllSelected;
+    private _isSimpleRowIndeterminate;
+    private _setSimpleRowSelected;
+    private _updateSimpleRowParents;
+    private _isRowCheckboxChecked;
+    private _isRowCheckboxIndeterminate;
+    private _handleRowCheck;
+    private _applyRowColumnsToNode;
+    private _toggleRowRecursively;
+    private _triggerChange;
+    private _handleSearchInput;
+    private _applySearchTerm;
+    private _recomputeSearchFilter;
+    private _updateSearchStatusMessage;
+    private _toggleExpand;
+    private _nodeHasChildren;
+    private _getVisibleTreeRows;
+    private _getParentId;
+    private _focusRowById;
+    private _focusFirstVisibleChild;
+    private _handleRowKeyDown;
+    private _handleRowFocusOut;
+    private _enableChildren;
+    private _disableChildren;
+    private _clearAllFocus;
+    private _renderRowSelectionCheckbox;
+    private _renderNodeIconCell;
+    private _renderColumnCheckboxes;
+    render(): TemplateResult<1>;
+    private _renderFlatRow;
+    private _renderNodes;
+    static styles: import("lit").CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "nyx-treeview": NyxTreeview;
+    }
+}