@kelvininc/ui-components/dist/esm/kv-tree-dropdown.entry.js

Kelvin UI Components

import { r as registerInstance, c as createEvent, h, H as Host } from './index-D-JVwta2.js';
import { E as EIconName } from './icon.types-SVedE_O8.js';
import './components-DzZLIMy0.js';
import './lib-config-DwRzddFC.js';
import './action-button.types-DVds6a5Z.js';
import './absolute-time-picker-dropdown.types-CojoW2Y2.js';
import './summary-card.types-BcMhjKoS.js';
import './toaster.types-vhHhaF4Q.js';
import { a as ETreeItemLabelSize } from './tree-item.types-CBuzk8fR.js';
import './tag-alarm.types-DHk26cGe.js';
import './wizard.types-7ioMFMb5.js';

const treeDropdownCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}:host{--dropdown-node-gap:0;--dropdown-children-offset:var(--kv-spacing-3x, 12px);--dropdown-padding-left:36px;--dropdown-width:224px}:host kv-tree{--tree-node-gap:var(--dropdown-node-gap);--tree-children-offset:var(--dropdown-children-offset);--tree-node-width:var(--dropdown-width)}:host .tree::part(tree){border-radius:4px;overflow:hidden;border:1px solid transparent}:host .expanded::part(tree){margin-bottom:var(--kv-spacing-2x, 8px);border:1px solid #3f3f3f}:host .expanded::part(tree-item){--background-color-highlighted:#2a2a2a}:host .nochildren::part(tree-item){--children-padding-left:var(--dropdown-padding-left)}:host kv-tree::part(tree-item){--vertical-lines-height:0;--horizontal-lines-width:0;--background-color-default:var(--kv-background);--border-color-default:none;--background-color-focused:#3f3f3f;--background-color-highlighted:none;--border-color-highlighted:none;--children-margin-top:0;--children-margin-left:0;--border-radius:0;--node-icon-width:20px;--node-icon-height:20px}:host kv-tree::part(children){--tree-children-padding-left:var(--dropdown-padding-left)}";

const KvTreeDropdown = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.nodeToggleExpand = createEvent(this, "nodeToggleExpand", 7);
        this.nodeClick = createEvent(this, "nodeClick", 7);
        /** (optional) Defines whether the all tree nodes is loading. */
        this.loading = false;
    }
    getHighlightedNodes(node) {
        var _a;
        return ((_a = node.children) === null || _a === void 0 ? void 0 : _a.length) >= 0 ? { [node.id]: true } : {};
    }
    getSpotlightedNodes() {
        const node = this.nodes.find(node => { var _a; return (_a = node.children) === null || _a === void 0 ? void 0 : _a.find(child => child.id === this.selectedNode); });
        if (!node) {
            return {};
        }
        return { [node.id]: true };
    }
    render() {
        return (h(Host, { key: '9601b1526dbc08e461534b4815b944d2f664044a' }, this.nodes.map(node => (h("kv-tree", { class: { tree: true, expanded: this.expandedNodes[node.id], nochildren: !(node === null || node === void 0 ? void 0 : node.children) }, nodes: [node], loading: this.loading, selectedNode: this.selectedNode, hiddenNodes: this.hiddenNodes, expandedNodes: this.expandedNodes, spotlightedNodes: this.getSpotlightedNodes(), labelsSize: ETreeItemLabelSize.Regular, expandIcon: EIconName.Collapse, disabledNodes: this.disabledNodes, highlightedNodes: this.getHighlightedNodes(node), loadingNodes: this.loadingNodes, showTooltip: this.showTooltip, tooltipDelay: this.tooltipDelay })))));
    }
};
KvTreeDropdown.style = treeDropdownCss;

export { KvTreeDropdown as kv_tree_dropdown };