/**
 * @license
 * Copyright Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { CustomElement, attachShadowTemplate, FoundationProperty } from '@tylertech/forge-core';
import { AppBarAdapter } from './app-bar-adapter';
import { AppBarFoundation } from './app-bar-foundation';
import { APP_BAR_CONSTANTS } from './app-bar-constants';
import { BaseComponent } from '../../core/base/base-component';
const template = '<template><div class=\"forge-app-bar\" part=\"root\"><div class=\"row\"><div class=\"section\"><slot name=\"start\"></slot><div class=\"logo-title-container\"><slot name=\"logo\"></slot><slot name=\"title\"><h1 class=\"title\" part=\"title\"></h1></slot></div></div><div id=\"center-section\" class=\"section\"><slot name=\"center\"></slot></div><div class=\"section\"><slot name=\"end\"></slot></div></div><div><slot name=\"bottom\"></slot></div></div></template>';
const styles = ':host{--_app-bar-background:var(--forge-app-bar-background, var(--forge-theme-brand, #283593));--_app-bar-foreground:var(--forge-app-bar-foreground, var(--forge-theme-on-brand, #ffffff))}:host{display:block}:host([hidden]){display:none}:host(:not([theme])){--forge-theme-primary:var(--_app-bar-foreground);--forge-theme-on-primary:rgba(0, 0, 0, 0.87);--forge-theme-text-high:rgba(255, 255, 255, 0.87);--forge-theme-text-medium:rgba(255, 255, 255, 0.54);--forge-theme-text-low:rgba(255, 255, 255, 0.38)}.forge-app-bar{--_app-bar-z-index:var(--forge-app-bar-z-index, var(--forge-z-index-header, 4));--_app-bar-elevation:var(--forge-app-bar-elevation, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));--_app-bar-height:var(--forge-app-bar-height, 56px);--_app-bar-row-padding:var(--forge-app-bar-row-padding, var(--forge-spacing-xxsmall, 4px));--_app-bar-logo-gap:var(--forge-app-bar-logo-gap, var(--forge-spacing-medium, 16px));--_app-bar-logo-font-size:var(--forge-app-bar-logo-font-size, calc(var(--forge-typography-font-size, 1rem) * 2.5));--_app-bar-title-padding:var(--forge-app-bar-title-padding, var(--forge-spacing-xsmall, 8px));--_app-bar-transition-duration:var(--forge-app-bar-transition-duration, var(--forge-animation-duration-short4, 200ms));--_app-bar-transition-timing:var(--forge-app-bar-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)))}.forge-app-bar{background:var(--_app-bar-background);color:var(--_app-bar-foreground);position:relative;z-index:var(--_app-bar-z-index);display:grid;grid-template-rows:1fr auto;-webkit-transition-property:background-color,-webkit-box-shadow;transition-property:background-color,-webkit-box-shadow;transition-property:box-shadow,background-color;transition-property:box-shadow,background-color,-webkit-box-shadow;-webkit-transition-duration:var(--_app-bar-transition-duration);transition-duration:var(--_app-bar-transition-duration);-webkit-transition-timing-function:var(--_app-bar-transition-timing);transition-timing-function:var(--_app-bar-transition-timing);-webkit-box-sizing:border-box;box-sizing:border-box;width:100%}.forge-app-bar .row{display:grid;-webkit-box-align:center;align-items:center;grid-template-columns:1fr 1fr 1fr;height:var(--_app-bar-height);padding-inline:var(--_app-bar-row-padding)}.forge-app-bar.no-center .row{grid-template-columns:1fr auto}.forge-app-bar .section{display:-webkit-inline-box;display:inline-flex;-webkit-box-flex:1;flex:1 1 auto;-webkit-box-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;min-width:0;height:100%}.forge-app-bar .section:not(:last-child):not(:first-child){-webkit-box-pack:center;justify-content:center}.forge-app-bar .section:last-child{justify-self:end}.forge-app-bar h1{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-heading4-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-heading4-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading4-font-size-scale, 1.25)));font-weight:var(--forge-typography-heading4-font-weight,500);line-height:var(--forge-typography-heading4-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading4-line-height-scale, 1.5)));letter-spacing:var(--forge-typography-heading4-letter-spacing, .005em);text-transform:var(--forge-typography-heading4-text-transform,inherit);-webkit-text-decoration:var(--forge-typography-heading4-text-decoration,inherit);text-decoration:var(--forge-typography-heading4-text-decoration,inherit);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.forge-app-bar a{outline:0;text-decoration:none;color:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%}.forge-app-bar a forge-state-layer{--forge-state-layer-color:var(--_app-bar-foreground)}.forge-app-bar a forge-focus-indicator{--forge-focus-indicator-color:var(--_app-bar-foreground);--forge-focus-indicator-shape:4px;--forge-focus-indicator-offset-block:4px}.forge-app-bar .logo-title-container{position:relative;display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;gap:var(--_app-bar-logo-gap);min-width:0;padding-inline:var(--_app-bar-title-padding)}:host(:is(:not([elevation]),[elevation=raised])) .forge-app-bar{-webkit-box-shadow:var(--_app-bar-elevation);box-shadow:var(--_app-bar-elevation)}::slotted(forge-tab-bar){--forge-tab-bar-divider-thickness:0}::slotted([slot=logo]){font-size:var(--_app-bar-logo-font-size);height:1em;width:1em}::slotted(forge-app-bar-search[slot=center]){width:100%}:host([theme=white]){--forge-theme-primary:black;--forge-theme-on-primary:rgba(255, 255, 255, 0.87);--forge-theme-text-medium:rgba(0, 0, 0, 0.54)}:host([theme=white]) .forge-app-bar{--_app-bar-background:var(--forge-app-bar-background, white);--_app-bar-foreground:var(--forge-app-bar-foreground, black)}';
/**
 * @tag forge-app-bar
 *
 * @description App bars are a collection of components placed as a horizontal bar at the top of the screen. They typically contain a logo, title, and optional application-wide actions.
 *
 * @property {string} titleText - The text to display in the title.
 * @property {AppBarElevation} elevation - The elevation of the app bar.
 * @property {AppBarTheme} theme - The theme of the app bar.
 * @property {string} href - The href that will be used to make the logo and title area a clickable link.
 *
 * @attribute {string} title-text - The text to display in the title.
 * @attribute {string} elevation - The elevation of the app bar.
 * @attribute {string} theme - The theme of the app bar.
 * @attribute {string} href - The href that will be used to make the logo and title area a clickable link
 *
 * @cssproperty --forge-app-bar-background - The background color of the app bar.
 * @cssproperty --forge-app-bar-foreground - The text color of the app bar.
 * @cssproperty --forge-app-bar-z-index - The `z-index` of the app bar.
 * @cssproperty --forge-app-bar-elevation - The elevation of the app bar.
 * @cssproperty --forge-app-bar-height - The height of the app bar.
 * @cssproperty --forge-app-bar-row-padding - The inline padding of the app bar.
 * @cssproperty --forge-app-bar-logo-gap - The space between the logo and title.
 * @cssproperty --forge-app-bar-title-padding - The padding around the title element.
 * @cssproperty --forge-app-bar-transition-duration - The transition duration for animations.
 * @cssproperty --forge-app-bar-transition-timing - The transition timing function for animations.
 *
 * @event {CustomEvent<void>} forge-app-bar-navigate - Fires when the app bar is clicked.
 *
 * @csspart root - The root container element.
 * @csspart title - The title element.
 *
 * @slot logo - Reserved for the brand logo.
 * @slot title - Reserved for the application title. This will overwrite the `titleText` property/attribute.
 * @slot start - Places content at the beginning of the app bar.
 * @slot center - Places content in the center of the app bar.
 * @slot end - Places content at the end of the app bar.
 */
let AppBarComponent = class AppBarComponent extends BaseComponent {
    static get observedAttributes() {
        return [
            APP_BAR_CONSTANTS.attributes.TITLE_TEXT,
            APP_BAR_CONSTANTS.attributes.ELEVATION,
            APP_BAR_CONSTANTS.attributes.THEME,
            APP_BAR_CONSTANTS.attributes.HREF,
            APP_BAR_CONSTANTS.attributes.TARGET
        ];
    }
    constructor() {
        super();
        attachShadowTemplate(this, template, styles);
        this._foundation = new AppBarFoundation(new AppBarAdapter(this));
    }
    connectedCallback() {
        this._foundation.initialize();
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case APP_BAR_CONSTANTS.attributes.TITLE_TEXT:
                this.titleText = newValue;
                break;
            case APP_BAR_CONSTANTS.attributes.ELEVATION:
                this.elevation = newValue;
                break;
            case APP_BAR_CONSTANTS.attributes.THEME:
                this.theme = newValue;
                break;
            case APP_BAR_CONSTANTS.attributes.HREF:
                this.href = newValue;
                break;
            case APP_BAR_CONSTANTS.attributes.TARGET:
                this.target = newValue;
                break;
        }
    }
};
__decorate([
    FoundationProperty()
], AppBarComponent.prototype, "titleText", void 0);
__decorate([
    FoundationProperty()
], AppBarComponent.prototype, "elevation", void 0);
__decorate([
    FoundationProperty()
], AppBarComponent.prototype, "theme", void 0);
__decorate([
    FoundationProperty()
], AppBarComponent.prototype, "href", void 0);
__decorate([
    FoundationProperty()
], AppBarComponent.prototype, "target", void 0);
AppBarComponent = __decorate([
    CustomElement({
        name: APP_BAR_CONSTANTS.elementName
    })
], AppBarComponent);
export { AppBarComponent };
