/**
 * @license
 * Copyright 2023 Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { CustomElement, attachShadowTemplate, coerceNumber, coerceBoolean, FoundationProperty } from '@tylertech/forge-core';
import { tylIconKeyboardArrowLeft, tylIconKeyboardArrowRight } from '@tylertech/tyler-icons/standard';
import { TabComponent } from '../tab/tab';
import { IconButtonComponent } from '../../icon-button';
import { TAB_BAR_CONSTANTS } from './tab-bar-constants';
import { TabBarFoundation } from './tab-bar-foundation';
import { TabBarAdapter } from './tab-bar-adapter';
import { IconComponent, IconRegistry } from '../../icon';
import { BaseComponent } from '../../core/base/base-component';
const template = '<template><div class=\"forge-tab-bar\" part=\"root\"><div class=\"forge-tab-bar__scroll-prev-container\" part=\"previous-container\"><forge-icon-button part=\"previous-button\"><button type=\"button\" tabindex=\"-1\" aria-label=\"Scroll left\" id=\"scroll-prev-btn\" part=\"previous-button-element\"><forge-icon name=\"keyboard_arrow_left\" part=\"previous-button-icon\"></forge-icon></button></forge-icon-button></div><div class=\"mdc-tab-scroller\" part=\"tab-scroller\"><div class=\"mdc-tab-scroller__scroll-area\" part=\"scroll-area\"><div class=\"mdc-tab-scroller__scroll-content\" part=\"scroll-content\"><slot></slot></div></div></div><div class=\"forge-tab-bar__scroll-next-container\" part=\"next-container\"><forge-icon-button part=\"next-button\"><button type=\"button\" tabindex=\"-1\" aria-label=\"Scroll right\" id=\"scroll-next-btn\" part=\"next-button-element\"><forge-icon name=\"keyboard_arrow_right\" part=\"next-button-icon\"></forge-icon></button></forge-icon-button></div></div></template>';
const styles = '.forge-icon-button{display:-webkit-inline-box;display:inline-flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;outline:0;background-color:transparent;fill:currentColor;color:inherit;font-size:24px;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:48px;height:48px;padding:12px}.forge-icon-button forge-icon,.forge-icon-button img,.forge-icon-button svg{width:24px;height:24px}.forge-icon-button:disabled{color:rgba(0,0,0,.38);color:var(--mdc-theme-text-disabled-on-light,rgba(0,0,0,.38))}.forge-icon-button:disabled{cursor:default;pointer-events:none}.forge-icon-button__icon{display:inline-block}.forge-icon-button__icon.forge-icon-button__icon--on{display:none}.forge-icon-button--on .forge-icon-button__icon{display:none}.forge-icon-button--on .forge-icon-button__icon.forge-icon-button__icon--on{display:inline-block}@-webkit-keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@keyframes mdc-ripple-fg-radius-in{from{-webkit-animation-timing-function:cubic-bezier(0.4,0,0.2,1);animation-timing-function:cubic-bezier(0.4,0,0.2,1);-webkit-transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1);transform:translate(var(--mdc-ripple-fg-translate-start,0)) scale(1)}to{-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}}@-webkit-keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-in{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@-webkit-keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}@keyframes mdc-ripple-fg-opacity-out{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.forge-icon-button{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:transparent;will-change:transform,opacity}.forge-icon-button::after,.forge-icon-button::before{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.forge-icon-button::before{-webkit-transition:opacity 15ms linear,background-color 15ms linear;transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index,1)}.forge-icon-button::after{z-index:0;z-index:var(--mdc-ripple-z-index,0)}.forge-icon-button.mdc-ripple-upgraded::before{-webkit-transform:scale(var(--mdc-ripple-fg-scale,1));transform:scale(var(--mdc-ripple-fg-scale,1))}.forge-icon-button.mdc-ripple-upgraded::after{top:0;left:0;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:center center;transform-origin:center center}.forge-icon-button.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top,0);left:var(--mdc-ripple-left,0)}.forge-icon-button.mdc-ripple-upgraded--foreground-activation::after{-webkit-animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards;animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.forge-icon-button.mdc-ripple-upgraded--foreground-deactivation::after{-webkit-animation:mdc-ripple-fg-opacity-out 150ms;animation:mdc-ripple-fg-opacity-out 150ms;-webkit-transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1));transform:translate(var(--mdc-ripple-fg-translate-end,0)) scale(var(--mdc-ripple-fg-scale,1))}.forge-icon-button::after,.forge-icon-button::before{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.forge-icon-button.mdc-ripple-upgraded::after,.forge-icon-button.mdc-ripple-upgraded::before{top:var(--mdc-ripple-top,calc(50% - 50%));left:var(--mdc-ripple-left,calc(50% - 50%));width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-icon-button.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size,100%);height:var(--mdc-ripple-fg-size,100%)}.forge-icon-button::after,.forge-icon-button::before{background-color:#000;background-color:var(--mdc-ripple-color,var(--mdc-theme-on-surface,#000))}.forge-icon-button.mdc-ripple-surface--hover::before,.forge-icon-button:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-icon-button.mdc-ripple-upgraded--background-focused::before,.forge-icon-button:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-icon-button:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-icon-button:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-icon-button.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}forge-icon-button{position:relative;display:inline-block;overflow:visible}.forge-icon-button--on{color:#3f51b5;color:var(--mdc-theme-primary,#3f51b5)}.forge-icon-button--on::after,.forge-icon-button--on::before{background-color:#3f51b5;background-color:var(--mdc-ripple-color,var(--mdc-theme-primary,#3f51b5))}.forge-icon-button--on.mdc-ripple-surface--hover::before,.forge-icon-button--on:hover::before{opacity:.04;opacity:var(--mdc-ripple-hover-opacity, .04)}.forge-icon-button--on.mdc-ripple-upgraded--background-focused::before,.forge-icon-button--on:not(.mdc-ripple-upgraded):focus::before{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-focus-opacity, .12)}.forge-icon-button--on:not(.mdc-ripple-upgraded)::after{-webkit-transition:opacity 150ms linear;transition:opacity 150ms linear}.forge-icon-button--on:not(.mdc-ripple-upgraded):active::after{-webkit-transition-duration:75ms;transition-duration:75ms;opacity:.12;opacity:var(--mdc-ripple-press-opacity, .12)}.forge-icon-button--on.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.forge-icon-button--on::before{background-color:#3f51b5;background-color:var(--mdc-theme-primary,#3f51b5);opacity:.08}.forge-icon-button--dense{width:28px;height:28px;padding:2px;padding:0}.forge-icon-button--dense-1{width:44px;height:44px;padding:10px}.forge-icon-button--dense-2{width:40px;height:40px;padding:8px}.forge-icon-button--dense-3{width:36px;height:36px;padding:6px}.forge-icon-button--dense-4{width:32px;height:32px;padding:4px}.forge-icon-button--dense-5{width:28px;height:28px;padding:2px}.forge-icon-button--dense-6{width:24px;height:24px;padding:0}.forge-icon-button--with-badge forge-badge{z-index:1;z-index:var(--forge-z-index-surface,1);pointer-events:none;--forge-badge-max-width:32px;--forge-badge-border:1px solid transparent}.forge-icon-button--with-badge forge-badge[app-bar-context]{--forge-badge-border:2px solid var(--forge-app-bar-theme-background)}.mdc-tab-scroller{overflow-y:hidden}.mdc-tab-scroller.mdc-tab-scroller--animating .mdc-tab-scroller__scroll-content{-webkit-transition:250ms -webkit-transform cubic-bezier(.4, 0, .2, 1);transition:250ms -webkit-transform cubic-bezier(.4, 0, .2, 1);transition:250ms transform cubic-bezier(.4, 0, .2, 1);transition:250ms transform cubic-bezier(.4, 0, .2, 1),250ms -webkit-transform cubic-bezier(.4, 0, .2, 1)}.mdc-tab-scroller__test{position:absolute;top:-9999px;width:100px;height:100px;overflow-x:scroll}.mdc-tab-scroller__scroll-area{-webkit-overflow-scrolling:touch;display:-webkit-box;display:flex;overflow-x:hidden}.mdc-tab-scroller__scroll-area::-webkit-scrollbar,.mdc-tab-scroller__test::-webkit-scrollbar{display:none}.mdc-tab-scroller__scroll-area--scroll{overflow-x:scroll}.mdc-tab-scroller__scroll-content{position:relative;display:-webkit-box;display:flex;-webkit-box-flex:1;flex:1 0 auto;-webkit-transform:none;transform:none;will-change:transform}.mdc-tab-scroller--align-start .mdc-tab-scroller__scroll-content{-webkit-box-pack:start;justify-content:flex-start}.mdc-tab-scroller--align-end .mdc-tab-scroller__scroll-content{-webkit-box-pack:end;justify-content:flex-end}.mdc-tab-scroller--align-center .mdc-tab-scroller__scroll-content{-webkit-box-pack:center;justify-content:center}.mdc-tab-scroller--animating .mdc-tab-scroller__scroll-area{-webkit-overflow-scrolling:auto}.forge-tab-bar{height:48px;height:var(--forge-tab-bar-height,48px);display:-webkit-box;display:flex;position:relative}.forge-tab-bar--underlined::after{border-bottom-color:#e0e0e0;border-bottom-color:var(--forge-theme-border-color,#e0e0e0);content:\"\";border-bottom-width:1px;border-bottom-style:solid;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;position:absolute;bottom:0;left:0;right:0}.forge-tab-bar--align-center .mdc-tab-scroller__scroll-content{-webkit-box-pack:center;justify-content:center}.forge-tab-bar--align-end .mdc-tab-scroller__scroll-content{-webkit-box-pack:end;justify-content:flex-end}.forge-tab-bar--stacked{height:72px;height:var(--forge-tab-bar-height,72px);-webkit-box-align:center;align-items:center}.forge-tab-bar--stacked .mdc-tab-scroller{height:100%}.mdc-tab-scroller{z-index:1;width:100%}.mdc-tab-scroller__scroll-area{height:100%;overflow-x:auto;scrollbar-width:none}:host{display:block;overflow:hidden}:host([hidden]){display:none}';
/**
 * The custom element class behind the `<forge-tab-bar>` element.
 *
 * @tag forge-tab-bar
 */
let TabBarComponent = class TabBarComponent extends BaseComponent {
    constructor() {
        super();
        IconRegistry.define([tylIconKeyboardArrowLeft, tylIconKeyboardArrowRight]);
        attachShadowTemplate(this, template, styles);
        this._foundation = new TabBarFoundation(new TabBarAdapter(this));
    }
    static get observedAttributes() {
        return [
            TAB_BAR_CONSTANTS.attributes.ACTIVE_TAB,
            TAB_BAR_CONSTANTS.attributes.LAYOUT_MODE,
            TAB_BAR_CONSTANTS.attributes.LAYOUT_ALIGN,
            TAB_BAR_CONSTANTS.attributes.UNDERLINE,
            TAB_BAR_CONSTANTS.attributes.AUTO_ACTIVATE,
            TAB_BAR_CONSTANTS.attributes.STACKED,
            TAB_BAR_CONSTANTS.attributes.SCROLL_BUTTONS,
            TAB_BAR_CONSTANTS.attributes.FORCE_SCROLL_BUTTONS
        ];
    }
    connectedCallback() {
        this._foundation.initialize();
    }
    disconnectedCallback() {
        this._foundation.disconnect();
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case TAB_BAR_CONSTANTS.attributes.ACTIVE_TAB:
                this.activeTab = coerceNumber(newValue);
                break;
            case TAB_BAR_CONSTANTS.attributes.LAYOUT_MODE:
                this.layoutMode = newValue;
                break;
            case TAB_BAR_CONSTANTS.attributes.LAYOUT_ALIGN:
                this.layoutAlign = newValue;
                break;
            case TAB_BAR_CONSTANTS.attributes.UNDERLINE:
                this.underline = coerceBoolean(newValue);
                break;
            case TAB_BAR_CONSTANTS.attributes.AUTO_ACTIVATE:
                this.autoActivate = coerceBoolean(newValue);
                break;
            case TAB_BAR_CONSTANTS.attributes.STACKED:
                this.stacked = coerceBoolean(newValue);
                break;
            case TAB_BAR_CONSTANTS.attributes.SCROLL_BUTTONS:
                this.scrollButtons = coerceBoolean(newValue);
                break;
            case TAB_BAR_CONSTANTS.attributes.FORCE_SCROLL_BUTTONS:
                this.forceScrollButtons = coerceBoolean(newValue);
                break;
        }
    }
    /**
     * Activates the tab at the given index.
     * @param index The index of the tab.
     */
    activateTab(index) {
        this._foundation.activateTab(index);
    }
    /**
     * Scrolls the tab at the given index into view.
     * @param index The index of the tab.
     */
    scrollTabIntoView(index) {
        this._foundation.scrollIntoView(index);
    }
};
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "activeTab", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "layoutMode", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "layoutAlign", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "underline", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "autoActivate", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "stacked", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "scrollButtons", void 0);
__decorate([
    FoundationProperty()
], TabBarComponent.prototype, "forceScrollButtons", void 0);
TabBarComponent = __decorate([
    CustomElement({
        name: TAB_BAR_CONSTANTS.elementName,
        dependencies: [
            TabComponent,
            IconButtonComponent,
            IconComponent
        ]
    })
], TabBarComponent);
export { TabBarComponent };
