// #region Imports
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { DomServiceLocator } from '../../../../Dom/Dom';
import { Disableable } from '../../../Behaviors/Disableable';
import { Focusable } from '../../../Behaviors/Focusable';
import { Iconable } from '../../../Behaviors/Iconable';
import { Labelable } from '../../../Behaviors/Labelable';
import { Orientable } from '../../../Behaviors/Orientable';
import { Selectable } from '../../../Behaviors/Selectable';
import { Valueable } from '../../../Behaviors/Valueable';
import { Variantable } from '../../../Behaviors/Variantable';
import { KeyboardController } from '../../../Controllers/KeyboardController';
import { Attribute } from '../../../Decorators/AttributeDecorator';
import { Component } from '../../../Decorators/ComponentDecorator';
import { TabStripPlacement } from '../../../Types/TabStripPlacement';
import { CustomElement } from '../../Abstracts/CustomElement';
import { RippleElement } from '../../Effects/Ripple/RippleElement';
import { StackElement } from '../../Layouts/Stack/StackElement';
import { IconElement } from '../../Media/Icon/IconElement';
import { FocusRingElement } from '../../Primitives/FocusRing/FocusRingElement';
import { TextElement } from '../../Primitives/Text/TextElement';
import { TabStripElement } from './TabStripElement';
import { tabStripItemElementTemplate } from './TabStripItemElementTemplate';
import { tabStripItemElementJoyStyle } from './Themes/TabStripItemElement.Joy';
import { tabStripItemElementRetroStyle } from './Themes/TabStripItemElement.Retro';
import { tabStripItemElementCosmopolitanStyle } from './Themes/TabStripItemElement.Cosmopolitan';
import { Themeable } from '../../../Behaviors/Themeable';
// #endregion
/**
 * Tab Strip Item - A navigation element used to switch between different sections of content.
 *
 * @fires {CustomEvent} selectionChanged - Fired when tab sttrip item selection changes.
 *
 * @slot label - The label slot.
 * @slot icon - The icon slot.
 * @slot overlay - The overlay slot (usefull for badge).
 *
 * @public
 */
let TabStripItemElement = class TabStripItemElement extends Themeable(Labelable(Iconable(Disableable(Focusable(Variantable(Orientable(Selectable(Valueable(CustomElement))))))))) {
    // #region Fields
    _keyboardController;
    _placement;
    // #endregion
    // #region Ctor
    /**
     * @public
     */
    constructor() {
        super();
        this._placement = TabStripPlacement.Bottom;
        this._keyboardController = new KeyboardController(this, { capture: true });
    }
    // #endregion
    // #region Properties
    /**
     * Returns the `{@link is}` property.
     * The `{@link is}` property represents natural name of this element.
     *
     * @public
     * @static
     * @readonly
     */
    static get is() {
        return 'mosaik-tab-strip-item';
    }
    /**
     * Gets or sets the `placement` property.
     *
     * @public
     * @attr
     */
    get placement() {
        return this._placement;
    }
    set placement(value) {
        if (this._placement !== value) {
            this._placement = value;
            this.requestUpdate('placement');
        }
    }
    /**
     * Gets the `parent` tab strip of this item.
     *
     * @protected
     * @readonly
     */
    get parent() {
        return DomServiceLocator.current.findAncestor(this, TabStripElement.is, { strict: true });
    }
    // #endregion
    // #region Methods
    /**
     * @public
     * @override
     */
    connectedCallback() {
        super.connectedCallback();
        // this._keyboardController
        //     .add(Key.Enter, () => this.emit('click'), () => !this.disabled, { preventDefault: true })
        //     .add(Key.Space, () => this.emit('click'), () => !this.disabled, { preventDefault: true });
    }
    /**
     * @protected
     * @override
     */
    onApplyTemplate() {
        super.onApplyTemplate();
        this.placement = this.parent.placement;
        this.parent.on('changed', (e) => {
            if (e.detail.propertyName === 'placement') {
                this.placement = this.parent.placement;
            }
        });
    }
};
__decorate([
    Attribute({ type: TabStripPlacement }),
    __metadata("design:type", String),
    __metadata("design:paramtypes", [String])
], TabStripItemElement.prototype, "placement", null);
TabStripItemElement = __decorate([
    Component({
        selector: 'mosaik-tab-strip-item',
        template: tabStripItemElementTemplate,
        themes: {
            joy: tabStripItemElementJoyStyle,
            retro: tabStripItemElementRetroStyle,
            cosmopolitan: tabStripItemElementCosmopolitanStyle
        },
        host: {
            role: 'tab',
            tabIndex: '0'
        },
        imports: [
            StackElement,
            IconElement,
            TextElement,
            RippleElement,
            FocusRingElement
        ]
    }),
    __metadata("design:paramtypes", [])
], TabStripItemElement);
export { TabStripItemElement };
//# sourceMappingURL=TabStripItemElement.js.map