bruno-ui/dist/cjs/brn-tab.cjs.entry.js

Bruno UI Kit

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const core = require('./core-a98adf17.js');
const app_helper = require('./app.helper-d57324ff.js');

const TabComponent = class {
    constructor(hostRef) {
        core.registerInstance(this, hostRef);
        this.active = false;
        this._active = false;
        this.tabLoaded = core.createEvent(this, "tabLoaded", 7);
        this.tabChanged = core.createEvent(this, "tabChanged", 7);
    }
    ActiveChangeHandler(value) {
        this._active = value;
        this.TabChanged();
    }
    componentWillLoad() {
        this._identifier = app_helper.AppHelper.GetId();
        this._active = this.active;
    }
    componentDidLoad() {
        const tab = this.GetTab();
        this.tabLoaded.emit(tab);
    }
    render() {
        return (core.h("div", { class: { 'brn-tab--active': this._active } }, core.h("slot", null)));
    }
    TabChanged() {
        const tab = this.GetTab();
        this.tabChanged.emit(tab);
    }
    GetTab() {
        const tab = {
            Identifier: this._identifier,
            Index: this.GetIndex(),
            Name: this.name,
            Active: this._active,
            OnActive: (value) => {
                this._active = value;
            }
        };
        return tab;
    }
    GetIndex() {
        const parent = this._element.closest("brn-tabs");
        if (parent) {
            const tabs = parent.getElementsByTagName('brn-tab');
            return Array.prototype.indexOf.call(tabs, this._element);
        }
        console.warn('"brn-tab" components must be wrapped with "brn-tabs" component');
        return 0;
    }
    get _element() { return core.getElement(this); }
    static get watchers() { return {
        "active": ["ActiveChangeHandler"]
    }; }
    static get style() { return "brn-tab > div {\n  display: none;\n}\nbrn-tab > div.brn-tab--active {\n  display: block;\n}"; }
};

exports.brn_tab = TabComponent;