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

Kelvin UI Components

'use strict';

var index = require('./index-DpuMIXDY.js');
var icon_types = require('./icon.types-B8lvUrX_.js');
require('./components-D2lyDQ_a.js');
require('./lib-config-QLtHwxiM.js');
require('./action-button.types-BYOe6st0.js');
require('./absolute-time-picker-dropdown.types-mPwO9zQk.js');
require('./summary-card.types-W26sTdH1.js');
require('./toaster.types-DlSCye8T.js');
var treeItem_types = require('./tree-item.types-C2yRoORC.js');
require('./tag-alarm.types-BeZw-7PT.js');
require('./wizard.types-DTbE-B6d.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) {
        index.registerInstance(this, hostRef);
        this.nodeToggleExpand = index.createEvent(this, "nodeToggleExpand", 7);
        this.nodeClick = index.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 (index.h(index.Host, { key: '9601b1526dbc08e461534b4815b944d2f664044a' }, this.nodes.map(node => (index.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: treeItem_types.ETreeItemLabelSize.Regular, expandIcon: icon_types.EIconName.Collapse, disabledNodes: this.disabledNodes, highlightedNodes: this.getHighlightedNodes(node), loadingNodes: this.loadingNodes, showTooltip: this.showTooltip, tooltipDelay: this.tooltipDelay })))));
    }
};
KvTreeDropdown.style = treeDropdownCss;

exports.kv_tree_dropdown = KvTreeDropdown;