@redvars/peacock 3.5.0 → 3.5.1

package/dist/spread-B5cgadZl.js

@@ -1,32 +0,0 @@
-import { e, i, t } from './directive-ZPhl09Yt.js';
-
-class SpreadDirective extends i {
-    constructor(partInfo) {
-        super(partInfo);
-        if (partInfo.type !== t.ELEMENT) {
-            throw new Error('spread() can only be used on elements');
-        }
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    render(_props) {
-        return '';
-    }
-    update(part, [props]) {
-        if (!props)
-            return;
-        // eslint-disable-next-line guard-for-in,no-restricted-syntax
-        for (const key in props) {
-            const value = props[key];
-            if (value === undefined || value === null) {
-                part.element.removeAttribute(key);
-            }
-            else {
-                part.element.setAttribute(key, value);
-            }
-        }
-    }
-}
-const spread = e(SpreadDirective);
-
-export { spread as s };
-//# sourceMappingURL=spread-B5cgadZl.js.map

package/dist/spread-B5cgadZl.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"spread-B5cgadZl.js","sources":["../../src/__directive/spread.ts"],"sourcesContent":["import {\n  directive,\n  Directive,\n  ElementPart,\n  PartInfo,\n  PartType,\n} from 'lit/directive.js';\n\nclass SpreadDirective extends Directive {\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    if (partInfo.type !== PartType.ELEMENT) {\n      throw new Error('spread() can only be used on elements');\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  render(_props: { [key: string]: any } | undefined) {\n    return '';\n  }\n\n  update(part: ElementPart, [props]: [{ [key: string]: any } | undefined]) {\n    if (!props) return;\n    // eslint-disable-next-line guard-for-in,no-restricted-syntax\n    for (const key in props) {\n      const value = props[key];\n      if (value === undefined || value === null) {\n        part.element.removeAttribute(key);\n      } else {\n        part.element.setAttribute(key, value);\n      }\n    }\n  }\n}\n\nexport const spread = directive(SpreadDirective);\n"],"names":["Directive","PartType","directive"],"mappings":";;AAQA,MAAM,eAAgB,SAAQA,CAAS,CAAA;AACrC,IAAA,WAAA,CAAY,QAAkB,EAAA;QAC5B,KAAK,CAAC,QAAQ,CAAC;QACf,IAAI,QAAQ,CAAC,IAAI,KAAKC,CAAQ,CAAC,OAAO,EAAE;AACtC,YAAA,MAAM,IAAI,KAAK,CAAC,uCAAuC,CAAC;QAC1D;IACF;;AAGA,IAAA,MAAM,CAAC,MAA0C,EAAA;AAC/C,QAAA,OAAO,EAAE;IACX;AAEA,IAAA,MAAM,CAAC,IAAiB,EAAE,CAAC,KAAK,CAAuC,EAAA;AACrE,QAAA,IAAI,CAAC,KAAK;YAAE;;AAEZ,QAAA,KAAK,MAAM,GAAG,IAAI,KAAK,EAAE;AACvB,YAAA,MAAM,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC;YACxB,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE;AACzC,gBAAA,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC;YACnC;iBAAO;gBACL,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC;YACvC;QACF;IACF;AACD;MAEY,MAAM,GAAGC,CAAS,CAAC,eAAe;;;;"}

package/dist/src/__base_element/BaseHyperlink.d.ts

@@ -1,20 +0,0 @@
-import { LitElement } from 'lit';
-type Constructor<T = {}> = new (...args: any[]) => T;
-/**
- * 1. Define an interface for the members the mixin adds.
- * This makes the type annotation much cleaner.
- */
-export interface BaseHyperlinkInterface {
-    href?: string;
-    target: '_self' | '_parent' | '_blank' | '_top' | string;
-    __isLink(): boolean;
-}
-/**
- * 2. Define the Mixin type separately for readability.
- */
-type BaseHyperlinkMixinType = <T extends Constructor<LitElement>>(superclass: T) => T & Constructor<BaseHyperlinkInterface>;
-/**
- * 3. Apply the type annotation to the variable.
- */
-declare const BaseHyperlink: BaseHyperlinkMixinType;
-export default BaseHyperlink;

package/dist/src/tree-view/index.d.ts

@@ -1,2 +0,0 @@
-export { TreeNode } from './tree-node.js';
-export { TreeView } from './tree-view.js';

package/dist/src/tree-view/tree-node.d.ts

@@ -1,69 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * @label Tree Node
- * @tag wc-tree-node
- * @rawTag tree-node
- * @parentRawTag tree-view
- * @summary A tree node represents a single item in a hierarchical tree structure. It supports nesting, icons, links, and keyboard navigation.
- *
- * @example
- * ```html
- * <wc-tree-view>
- *   <wc-tree-node label="Parent">
- *     <wc-tree-node label="Child"></wc-tree-node>
- *   </wc-tree-node>
- * </wc-tree-view>
- * ```
- * @tags navigation
- */
-export declare class TreeNode extends LitElement {
-    static styles: import("lit").CSSResultGroup[];
-    /**
-     * The value used to identify this node when selected.
-     */
-    value: string;
-    /**
-     * The display label for this node.
-     */
-    label: string;
-    /**
-     * Optional icon name to display before the label.
-     */
-    icon: string;
-    /**
-     * Optional hyperlink to navigate to on click.
-     */
-    href: string;
-    /**
-     * Sets or retrieves the window or frame at which to target content.
-     */
-    target: string;
-    /**
-     * If true, the user cannot interact with the node.
-     */
-    disabled: boolean;
-    /**
-     * Whether the node is currently selected.
-     */
-    selected: boolean;
-    /**
-     * Whether child nodes are visible.
-     */
-    expanded: boolean;
-    /**
-     * The nesting depth level (set automatically by the parent tree-view).
-     */
-    level: number;
-    private readonly _nativeElement;
-    focus(): void;
-    blur(): void;
-    private _getChildNodes;
-    connectedCallback(): void;
-    private _syncHostAria;
-    private _updateChildLevels;
-    private _handleClick;
-    private _handleKeyDown;
-    updated(changedProps: Map<string, unknown>): void;
-    private _renderContent;
-    render(): import("lit-html").TemplateResult<1>;
-}

package/dist/src/tree-view/tree-view.d.ts

@@ -1,40 +0,0 @@
-import { LitElement } from 'lit';
-import { TreeNode } from './tree-node.js';
-/**
- * @label Tree View
- * @tag wc-tree-view
- * @rawTag tree-view
- * @summary A tree view is a hierarchical structure that provides nested levels of navigation. It supports keyboard navigation, single/multi select, and expandable nodes.
- *
- * @example
- * ```html
- * <wc-tree-view>
- *   <wc-tree-node label="Parent" expanded>
- *     <wc-tree-node label="Child 1"></wc-tree-node>
- *     <wc-tree-node label="Child 2"></wc-tree-node>
- *   </wc-tree-node>
- * </wc-tree-view>
- * ```
- * @tags navigation
- */
-export declare class TreeView extends LitElement {
-    static styles: import("lit").CSSResultGroup[];
-    /**
-     * The value of the currently selected node.
-     */
-    selectedNode: string;
-    connectedCallback(): void;
-    updated(changedProps: Map<string, unknown>): void;
-    disconnectedCallback(): void;
-    private _getTopLevelNodes;
-    private _getAllVisibleNodes;
-    private _onNodeClick;
-    private _updateSelectedState;
-    private _clearSelectedState;
-    private _syncSelectedStateFromProperty;
-    private _onSlotChange;
-    private _collectAllNodes;
-    private _onKeyDown;
-    render(): import("lit-html").TemplateResult<1>;
-    static Node: typeof TreeNode;
-}

package/dist/src/tree-view/wc-tree-view.d.ts

@@ -1,6 +0,0 @@
-import { TreeView } from './tree-view.js';
-import { TreeNode } from './tree-node.js';
-export declare class WcTreeNode extends TreeNode {
-}
-export declare class WcTreeView extends TreeView {
-}

package/dist/test/tree-view.test.d.ts

@@ -1 +0,0 @@
-import '../src/tree-view/wc-tree-view.js';

package/dist/throttle-C7ZAPqtu.js

@@ -1,24 +0,0 @@
-function throttle(func, delay, options = { leading: true, trailing: true }) {
-    let timerId;
-    let lastExec = 0;
-    return function (...args) {
-        // @ts-ignore
-        const context = this;
-        const now = Date.now();
-        const shouldCallNow = options.leading && now - lastExec >= delay;
-        if (shouldCallNow) {
-            func.apply(context, args);
-            lastExec = now;
-        }
-        else if (options.trailing && !timerId) {
-            timerId = setTimeout(() => {
-                func.apply(context, args);
-                lastExec = Date.now();
-                timerId = null;
-            }, delay);
-        }
-    };
-}
-
-export { throttle as t };
-//# sourceMappingURL=throttle-C7ZAPqtu.js.map

package/dist/throttle-C7ZAPqtu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"throttle-C7ZAPqtu.js","sources":["../../src/__utils/throttle.ts"],"sourcesContent":["export function throttle(\n  func: Function,\n  delay: number,\n  options = { leading: true, trailing: true },\n) {\n  let timerId: any;\n  let lastExec = 0;\n\n  return function (...args: any[]) {\n    // @ts-ignore\n    const context = this;\n    const now = Date.now();\n\n    const shouldCallNow = options.leading && now - lastExec >= delay;\n\n    if (shouldCallNow) {\n      func.apply(context, args);\n      lastExec = now;\n    } else if (options.trailing && !timerId) {\n      timerId = setTimeout(() => {\n        func.apply(context, args);\n        lastExec = Date.now();\n        timerId = null;\n      }, delay);\n    }\n  };\n}"],"names":[],"mappings":"SAAgB,QAAQ,CACtB,IAAc,EACd,KAAa,EACb,OAAO,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAA;AAE3C,IAAA,IAAI,OAAY;IAChB,IAAI,QAAQ,GAAG,CAAC;IAEhB,OAAO,UAAU,GAAG,IAAW,EAAA;;QAE7B,MAAM,OAAO,GAAG,IAAI;AACpB,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;QAEtB,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,IAAI,GAAG,GAAG,QAAQ,IAAI,KAAK;QAEhE,IAAI,aAAa,EAAE;AACjB,YAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC;YACzB,QAAQ,GAAG,GAAG;QAChB;AAAO,aAAA,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,EAAE;AACvC,YAAA,OAAO,GAAG,UAAU,CAAC,MAAK;AACxB,gBAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC;AACzB,gBAAA,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE;gBACrB,OAAO,GAAG,IAAI;YAChB,CAAC,EAAE,KAAK,CAAC;QACX;AACF,IAAA,CAAC;AACH;;;;"}

package/src/__base_element/BaseHyperlink.ts

@@ -1,42 +0,0 @@
-import { LitElement } from 'lit';
-import { property } from 'lit/decorators.js';
-
-type Constructor<T = {}> = new (...args: any[]) => T;
-
-/**
- * 1. Define an interface for the members the mixin adds.
- * This makes the type annotation much cleaner.
- */
-export interface BaseHyperlinkInterface {
-  href?: string;
-  target: '_self' | '_parent' | '_blank' | '_top' | string;
-  __isLink(): boolean;
-}
-
-/**
- * 2. Define the Mixin type separately for readability.
- */
-type BaseHyperlinkMixinType = <T extends Constructor<LitElement>>(superclass: T) => T & Constructor<BaseHyperlinkInterface>;
-
-/**
- * 3. Apply the type annotation to the variable.
- */
-const BaseHyperlink: BaseHyperlinkMixinType = <T extends Constructor<LitElement>>(superclass: T) => {
-  // Naming the class (BaseHyperlinkElement) instead of using 'Mixin' or anonymous 
-  // prevents the "__childPart" visibility error.
-  class BaseHyperlinkElement extends superclass implements BaseHyperlinkInterface {
-    @property({ reflect: true }) 
-    href?: string;
-
-    @property() 
-    target: '_self' | '_parent' | '_blank' | '_top' | string = '_self';
-
-    __isLink(): boolean {
-      return !!this.href;
-    }
-  }
-
-  return BaseHyperlinkElement as T & Constructor<BaseHyperlinkInterface>;
-};
-
-export default BaseHyperlink;

package/src/tree-view/demo/index.html

@@ -1,57 +0,0 @@
-<!doctype html>
-<html lang='en-GB'>
-<head>
-  <meta charset='utf-8'>
-  <meta name='viewport' content='width=device-width, initial-scale=1.0, viewport-fit=cover' />
-  <link rel='stylesheet' href='/dist/assets/styles/tokens.css' />
-  <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
-
-  <style>
-    body {
-      background: #fafafa;
-      padding: 2rem;
-      font-family: 'Noto Sans', sans-serif;
-    }
-    h2 {
-      margin-top: 2rem;
-      margin-bottom: 0.5rem;
-    }
-  </style>
-</head>
-<body>
-
-<h2>Basic Tree View</h2>
-<wc-tree-view>
-  <wc-tree-node label="Documents" icon="folder" expanded>
-    <wc-tree-node label="Work" icon="folder" expanded>
-      <wc-tree-node label="Project A" icon="description"></wc-tree-node>
-      <wc-tree-node label="Project B" icon="description"></wc-tree-node>
-    </wc-tree-node>
-    <wc-tree-node label="Personal" icon="folder">
-      <wc-tree-node label="Resume.pdf" icon="picture_as_pdf"></wc-tree-node>
-    </wc-tree-node>
-  </wc-tree-node>
-  <wc-tree-node label="Pictures" icon="photo_library">
-    <wc-tree-node label="Vacation.jpg" icon="image"></wc-tree-node>
-    <wc-tree-node label="Family.jpg" icon="image"></wc-tree-node>
-  </wc-tree-node>
-  <wc-tree-node label="Disabled Node" icon="block" disabled></wc-tree-node>
-</wc-tree-view>
-
-<h2>Tree View without Icons</h2>
-<wc-tree-view>
-  <wc-tree-node label="Category 1" expanded>
-    <wc-tree-node label="Item 1.1"></wc-tree-node>
-    <wc-tree-node label="Item 1.2">
-      <wc-tree-node label="Item 1.2.1"></wc-tree-node>
-      <wc-tree-node label="Item 1.2.2"></wc-tree-node>
-    </wc-tree-node>
-  </wc-tree-node>
-  <wc-tree-node label="Category 2">
-    <wc-tree-node label="Item 2.1"></wc-tree-node>
-  </wc-tree-node>
-</wc-tree-view>
-
-<script type='module' src='/dist/peacock-loader.js'></script>
-</body>
-</html>

package/src/tree-view/index.ts

@@ -1,2 +0,0 @@
-export { TreeNode } from './tree-node.js';
-export { TreeView } from './tree-view.js';

package/src/tree-view/tree-node.scss

@@ -1,101 +0,0 @@
-@use '../../scss/mixin';
-
-@include mixin.base-styles;
-
-:host {
-  display: block;
-
-  // M3 tree node sizing
-  --tree-node-height: 2.5rem;
-  --tree-node-icon-size: 1.25rem;
-  --tree-node-border-radius: var(--global-shape-corner-full, 9999px);
-
-  // M3 color tokens
-  --tree-node-label-color: var(--color-on-surface);
-  --tree-node-icon-color: var(--color-on-surface-variant);
-  --tree-node-selected-background: var(--color-secondary-container);
-  --tree-node-selected-color: var(--color-on-secondary-container);
-  --tree-node-hover-background: var(--color-inverse-primary);
-  --tree-node-focus-ring-color: var(--color-primary);
-}
-
-.tree-node {
-  display: block;
-}
-
-.tree-node-content {
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  height: var(--tree-node-height);
-  border-radius: var(--tree-node-border-radius);
-  color: var(--tree-node-label-color);
-  cursor: pointer;
-  user-select: none;
-  text-decoration: none;
-  outline: none;
-
-  @include mixin.get-typography(body-medium);
-
-  &:not(.disabled):hover {
-    background-color: var(--tree-node-hover-background);
-  }
-
-  &:focus-visible {
-    @include mixin.focus-ring(var(--tree-node-focus-ring-color));
-  }
-
-  &.selected {
-    background-color: var(--tree-node-selected-background);
-    color: var(--tree-node-selected-color);
-
-    .node-icon {
-      --icon-color: var(--tree-node-selected-color);
-    }
-  }
-
-  &.disabled {
-    cursor: not-allowed;
-    opacity: 0.38;
-    pointer-events: none;
-  }
-}
-
-.expand-icon {
-  --icon-size: var(--tree-node-icon-size);
-  --icon-color: var(--tree-node-icon-color);
-  flex-shrink: 0;
-  transition: transform var(--duration-short2, 200ms) var(--easing-standard, ease);
-
-  &.expanded {
-    transform: rotate(90deg);
-  }
-}
-
-.icon-space {
-  display: inline-block;
-  width: var(--tree-node-icon-size);
-  height: var(--tree-node-icon-size);
-  flex-shrink: 0;
-}
-
-.node-icon {
-  --icon-size: var(--tree-node-icon-size);
-  --icon-color: var(--tree-node-icon-color);
-  flex-shrink: 0;
-}
-
-.tree-node-label {
-  flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.node-children {
-  display: none;
-
-  &.expanded {
-    display: block;
-  }
-}

package/src/tree-view/tree-node.ts

@@ -1,268 +0,0 @@
-import { html, LitElement } from 'lit';
-import { property, query } from 'lit/decorators.js';
-import { classMap } from 'lit/directives/class-map.js';
-import { styleMap } from 'lit/directives/style-map.js';
-import styles from './tree-node.scss';
-
-/**
- * @label Tree Node
- * @tag wc-tree-node
- * @rawTag tree-node
- * @parentRawTag tree-view
- * @summary A tree node represents a single item in a hierarchical tree structure. It supports nesting, icons, links, and keyboard navigation.
- *
- * @example
- * ```html
- * <wc-tree-view>
- *   <wc-tree-node label="Parent">
- *     <wc-tree-node label="Child"></wc-tree-node>
- *   </wc-tree-node>
- * </wc-tree-view>
- * ```
- * @tags navigation
- */
-export class TreeNode extends LitElement {
-  static styles = [styles];
-
-  /**
-   * The value used to identify this node when selected.
-   */
-  @property({ type: String, reflect: true })
-  value: string = '';
-
-  /**
-   * The display label for this node.
-   */
-  @property({ type: String, reflect: true })
-  label: string = '';
-
-  /**
-   * Optional icon name to display before the label.
-   */
-  @property({ type: String, reflect: true })
-  icon: string = '';
-
-  /**
-   * Optional hyperlink to navigate to on click.
-   */
-  @property({ type: String, reflect: true })
-  href: string = '';
-
-  /**
-   * Sets or retrieves the window or frame at which to target content.
-   */
-  @property({ type: String, reflect: true })
-  target: string = '_self';
-
-  /**
-   * If true, the user cannot interact with the node.
-   */
-  @property({ type: Boolean, reflect: true })
-  disabled: boolean = false;
-
-  /**
-   * Whether the node is currently selected.
-   */
-  @property({ type: Boolean, reflect: true })
-  selected: boolean = false;
-
-  /**
-   * Whether child nodes are visible.
-   */
-  @property({ type: Boolean, reflect: true })
-  expanded: boolean = false;
-
-  /**
-   * The nesting depth level (set automatically by the parent tree-view).
-   */
-  @property({ type: Number, reflect: true })
-  level: number = 0;
-
-  @query('.tree-node-content')
-  private readonly _nativeElement!: HTMLElement | null;
-
-  override focus() {
-    this._nativeElement?.focus();
-  }
-
-  override blur() {
-    this._nativeElement?.blur();
-  }
-
-  private _getChildNodes(): TreeNode[] {
-    return Array.from(this.children).filter(
-      el => el.tagName.toLowerCase() === 'wc-tree-node',
-    ) as TreeNode[];
-  }
-
-  connectedCallback() {
-    super.connectedCallback();
-    this._updateChildLevels();
-    this.setAttribute('role', 'treeitem');
-    this._syncHostAria();
-  }
-
-  private _syncHostAria() {
-    const hasChildren = this._getChildNodes().length > 0;
-    if (hasChildren) {
-      this.setAttribute('aria-expanded', String(this.expanded));
-    } else {
-      this.removeAttribute('aria-expanded');
-    }
-    this.setAttribute('aria-selected', String(this.selected));
-    this.setAttribute('aria-disabled', String(this.disabled));
-    this.setAttribute('aria-level', String(this.level + 1));
-  }
-
-  private _updateChildLevels() {
-    const children = this._getChildNodes();
-    children.forEach(child => {
-      // eslint-disable-next-line no-param-reassign
-      child.level = this.level + 1;
-    });
-  }
-
-  private _handleClick(event: Event) {
-    if (this.disabled) {
-      event.preventDefault();
-      event.stopPropagation();
-      return;
-    }
-
-    const hasChildren = this._getChildNodes().length > 0;
-    if (hasChildren) {
-      this.expanded = !this.expanded;
-    }
-
-    this.dispatchEvent(
-      new CustomEvent('tree-node:click', {
-        bubbles: true,
-        composed: true,
-        detail: {
-          value: this.value || this.label,
-          label: this.label,
-          expanded: this.expanded,
-        },
-      }),
-    );
-  }
-
-  private _handleKeyDown(event: KeyboardEvent) {
-    if (this.disabled) return;
-
-    const hasChildren = this._getChildNodes().length > 0;
-
-    switch (event.key) {
-      case ' ':
-      case 'Enter':
-        event.preventDefault();
-        if (hasChildren) {
-          this.expanded = !this.expanded;
-        }
-        this.dispatchEvent(
-          new CustomEvent('tree-node:click', {
-            bubbles: true,
-            composed: true,
-            detail: {
-              value: this.value || this.label,
-              label: this.label,
-              expanded: this.expanded,
-            },
-          }),
-        );
-        if (this.href) {
-          window.open(this.href, this.target);
-        }
-        break;
-      case 'ArrowLeft':
-        event.preventDefault();
-        if (this.expanded && hasChildren) {
-          this.expanded = false;
-        }
-        break;
-      case 'ArrowRight':
-        event.preventDefault();
-        if (hasChildren) {
-          if (!this.expanded) {
-            this.expanded = true;
-          } else {
-            const firstChild = this._getChildNodes()[0];
-            firstChild?.focus();
-          }
-        }
-        break;
-      default:
-        break;
-    }
-  }
-
-  updated(changedProps: Map<string, unknown>) {
-    super.updated(changedProps);
-    if (changedProps.has('level')) {
-      this._updateChildLevels();
-    }
-    this._syncHostAria();
-  }
-
-  private _renderContent(hasChildren: boolean) {
-    // 0.125rem offset aligns text visually with the expand/icon space
-    const indentStyle = styleMap({
-      paddingInlineStart: `calc(${this.level + 1}rem - 0.125rem)`,
-    });
-
-    const contentClasses = classMap({
-      'tree-node-content': true,
-      selected: this.selected,
-      disabled: this.disabled,
-    });
-
-    const innerContent = html`
-      ${hasChildren
-        ? html`<wc-icon
-            class=${classMap({ 'expand-icon': true, expanded: this.expanded })}
-            name="arrow_right"
-          ></wc-icon>`
-        : html`<span class="icon-space"></span>`}
-      ${this.icon
-        ? html`<wc-icon class="node-icon" name=${this.icon}></wc-icon>`
-        : ''}
-      <span class="tree-node-label">${this.label}<slot name="label"></slot></span>
-    `;
-
-    if (this.href) {
-      return html`<a
-        class=${contentClasses}
-        style=${indentStyle}
-        href=${this.href}
-        target=${this.target}
-        tabindex=${this.disabled ? '-1' : '0'}
-        @click=${this._handleClick}
-        @keydown=${this._handleKeyDown}
-      >${innerContent}</a>`;
-    }
-
-    return html`<div
-      class=${contentClasses}
-      style=${indentStyle}
-      tabindex=${this.disabled ? '-1' : '0'}
-      @click=${this._handleClick}
-      @keydown=${this._handleKeyDown}
-    >${innerContent}</div>`;
-  }
-
-  render() {
-    const hasChildren = this._getChildNodes().length > 0;
-
-    const nodeSlotClasses = classMap({
-      'node-children': true,
-      expanded: this.expanded,
-    });
-
-    return html`<div class="tree-node">
-      ${this._renderContent(hasChildren)}
-      <div class=${nodeSlotClasses}>
-        <slot></slot>
-      </div>
-    </div>`;
-  }
-}