/**
 * @license
 * Copyright Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { attachShadowTemplate, coerceBoolean, customElement, getShadowElement } from '@tylertech/forge-core';
import { BaseComponent } from '../core';
import { FocusIndicatorComponent } from '../focus-indicator';
import { StateLayerComponent } from '../state-layer';
import { SKIP_LINK_CONSTANTS } from './skip-link-constants';
const template = '<template><a class=\"forge-skip-link\" part=\"anchor\"><slot>Skip to main content</slot><forge-focus-indicator part=\"focus-indicator\"></forge-focus-indicator><forge-state-layer exportparts=\"surface:state-layer\"></forge-state-layer></a></template>';
const style = ':host{--_skip-link-inset:var(--forge-skip-link-inset, var(--forge-spacing-xsmall, 8px) var(--forge-spacing-medium, 16px));--_skip-link-z-index:var(--forge-skip-link-z-index, var(--forge-z-index-popup, 10));--_skip-link-transition-duration:var(--forge-skip-link-transition-duration, var(--forge-animation-duration-short4, 200ms));--_skip-link-transition-timing-function:var(--forge-skip-link-transition-timing-function, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)))}:host{-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform;-webkit-transition-duration:var(--_skip-link-transition-duration);transition-duration:var(--_skip-link-transition-duration);-webkit-transition-timing-function:var(--_skip-link-transition-timing-function);transition-timing-function:var(--_skip-link-transition-timing-function);display:block;position:fixed;inset:var(--_skip-link-inset);z-index:var(--_skip-link-z-index);block-size:-webkit-fit-content;block-size:-moz-fit-content;block-size:fit-content;inline-size:-webkit-fit-content;inline-size:-moz-fit-content;inline-size:fit-content;opacity:0;-webkit-transform:translateY(-100%);transform:translateY(-100%)}:host([hidden]){display:none}:host(:where(:focus-within,[persistent])){-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform;-webkit-transition-duration:var(--_skip-link-transition-duration);transition-duration:var(--_skip-link-transition-duration);-webkit-transition-timing-function:var(--_skip-link-transition-timing-function);transition-timing-function:var(--_skip-link-transition-timing-function);-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-secondary, #ffc107));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-secondary, #000000));--_skip-link-shape:var(--forge-skip-link-shape, var(--forge-shape-medium, 4px));--_skip-link-elevation:var(--forge-skip-link-elevation, 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12));--_skip-link-padding-block:var(--forge-skip-link-padding-block, var(--forge-spacing-xsmall, 8px));--_skip-link-padding-inline:var(--forge-skip-link-padding-inline, var(--forge-spacing-medium, 16px));--_skip-link-focus-indicator-color:var(--forge-skip-link-focus-indicator-color, var(--_skip-link-background))}.forge-skip-link{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:var(--forge-typography-body2-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));font-size:var(--forge-typography-body2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 1)));font-weight:var(--forge-typography-body2-font-weight,400);line-height:var(--forge-typography-body2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.375)));letter-spacing:var(--forge-typography-body2-letter-spacing, .015625em);text-transform:var(--forge-typography-body2-text-transform,inherit);-webkit-text-decoration:var(--forge-typography-body2-text-decoration,inherit);text-decoration:var(--forge-typography-body2-text-decoration,inherit);display:block;outline:0;-webkit-box-shadow:var(--_skip-link-elevation);box-shadow:var(--_skip-link-elevation);border-radius:var(--_skip-link-shape);background:var(--_skip-link-background);padding-block:var(--_skip-link-padding-block);padding-inline:var(--_skip-link-padding-inline);cursor:pointer;color:var(--_skip-link-color);text-decoration:underline}:host([theme=primary]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-primary, #3f51b5));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-primary, #ffffff))}:host([theme=primary][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-primary-container-high, #b6bde3));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-primary-container-high, #000000))}:host([theme=secondary]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-secondary, #ffc107));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-secondary, #000000))}:host([theme=secondary][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-secondary-container-high, #ffe7a1));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-secondary-container-high, #000000))}:host([theme=tertiary]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-tertiary, #3d5afe));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-tertiary, #ffffff))}:host([theme=tertiary][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-tertiary-container-high, #b5c0ff));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-tertiary-container-high, #000000))}:host([theme=success]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-success, #2e7d32));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-success, #ffffff))}:host([theme=success][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-success-container-high, #b0ceb1));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-success-container-high, #000000))}:host([theme=error]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-error, #b00020));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-error, #ffffff))}:host([theme=error][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-error-container-high, #e19eaa));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-error-container-high, #000000))}:host([theme=warning]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-warning, #d14900));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-warning, #ffffff))}:host([theme=warning][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-warning-container-high, #eeba9e));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-warning-container-high, #000000))}:host([theme=info]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-info, #1565c0));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-info, #ffffff))}:host([theme=info][muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-info-container-high, #a6c4e7));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-info-container-high, #000000))}:host(:where(:not([theme]),[theme=default])[muted]) .forge-skip-link{--_skip-link-background:var(--forge-skip-link-background, var(--forge-theme-secondary-container-high, #ffe7a1));--_skip-link-color:var(--forge-skip-link-color, var(--forge-theme-on-secondary-container-high, #000000))}:host([inline]){position:absolute;-webkit-transform:none;transform:none}forge-focus-indicator{--forge-focus-indicator-color:var(--_skip-link-focus-indicator-color);--forge-focus-indicator-shape:var(--_skip-link-shape)}@media (prefers-reduced-motion:reduce){:host{--_skip-link-transition-duration:var(--forge-skip-link-transition-duration, 0s)}}';
/**
 * @tag forge-skip-link
 *
 * @summary The Forge Skip Link component is used to provide a way for users to skip repetitive content and navigate directly to a section of the page.
 *
 * @property {string} [target=''] - The IDREF of the element to which the skip link should navigate.
 * @property {SkipLinkTheme} [theme='default'] - The theme applied to the skip link.
 * @property {boolean} [muted=false] - Whether or not the skip link uses a muted color scheme.
 * @property {boolean} [persistent=false] - Whether or not the skip link should remain visible when not focused.
 * @property {boolean} [inline=false] - Whether or not the skip link renders within its container.
 *
 * @attribute {string} [target=''] - The IDREF of the element to which the skip link should navigate.
 * @attribute {SkipLinkTheme} [theme='default'] - The theme applied to the skip link.
 * @attribute {boolean} [muted=false] - Whether or not the skip link uses a muted color scheme.
 * @attribute {boolean} [persistent=false] - Whether or not the skip link should remain visible when not focused.
 * @attribute {boolean} [inline=false] - Whether or not the skip link renders within its container.
 *
 * @cssproperty --forge-skip-link-background - The background color of the skip link.
 * @cssproperty --forge-skip-link-color - The text color of the skip link.
 * @cssproperty --forge-skip-link-shape - The border radius of the skip link.
 * @cssproperty --forge-skip-link-inset - The skip link's inset from the edge of the viewport.
 * @cssproperty --forge-skip-link-z-index - The z-index of the skip link.
 * @cssproperty --forge-skip-link-elevation - The box shadow of the skip link.
 * @cssproperty --forge-skip-link-padding-block - The interior padding of the skip link along the block axis.
 * @cssproperty --forge-skip-link-padding-inline - The interior padding of the skip link along the inline axis.
 * @cssproperty --forge-skip-link-focus-indicator-color - The color of the focus indicator.
 * @cssproperty --forge-skip-link-transition-duration - The duration of the skip link's animations.
 * @cssproperty --forge-skip-link-transition-timing-function - The timing function of the skip link's animations.
 *
 * @csspart anchor - The root anchor element.
 * @csspart focus-indicator - The focus indicator element.
 * @csspart state-layer - The state layer element.
 *
 * @slot - The default/unnamed slot for link text.
 *
 * @dependency forge-focus-indicator
 * @dependency forge-state-layer
 */
let SkipLinkComponent = class SkipLinkComponent extends BaseComponent {
    static get observedAttributes() {
        return Object.values(SKIP_LINK_CONSTANTS.observedAttributes);
    }
    constructor() {
        super();
        this._target = '';
        this._theme = 'default';
        this._muted = false;
        this._persistent = false;
        this._inline = false;
        attachShadowTemplate(this, template, style);
        this._anchorElement = getShadowElement(this, SKIP_LINK_CONSTANTS.selectors.ANCHOR);
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case SKIP_LINK_CONSTANTS.observedAttributes.TARGET:
                this.target = newValue;
                break;
            case SKIP_LINK_CONSTANTS.observedAttributes.THEME:
                this.theme = newValue;
                break;
            case SKIP_LINK_CONSTANTS.observedAttributes.MUTED:
                this.muted = coerceBoolean(newValue);
                break;
            case SKIP_LINK_CONSTANTS.observedAttributes.PERSISTENT:
                this.persistent = coerceBoolean(newValue);
                break;
            case SKIP_LINK_CONSTANTS.observedAttributes.INLINE:
                this.inline = coerceBoolean(newValue);
                break;
        }
    }
    get target() {
        return this._target;
    }
    set target(value) {
        if (this._target !== value) {
            this._target = value;
            this.setAttribute(SKIP_LINK_CONSTANTS.attributes.TARGET, this._target);
            this._anchorElement.href = `#${this._target}`;
        }
    }
    get theme() {
        return this._theme;
    }
    set theme(value) {
        if (this._theme !== value) {
            this._theme = value;
            this.setAttribute(SKIP_LINK_CONSTANTS.attributes.THEME, this._theme);
        }
    }
    get muted() {
        return this._muted;
    }
    set muted(value) {
        if (this._muted !== value) {
            this._muted = value;
            this.toggleAttribute(SKIP_LINK_CONSTANTS.attributes.MUTED, this._muted);
        }
    }
    get persistent() {
        return this._persistent;
    }
    set persistent(value) {
        if (this._persistent !== value) {
            this._persistent = value;
            this.toggleAttribute(SKIP_LINK_CONSTANTS.attributes.PERSISTENT, this._persistent);
        }
    }
    get inline() {
        return this._inline;
    }
    set inline(value) {
        if (this._inline !== value) {
            this._inline = value;
            this.toggleAttribute(SKIP_LINK_CONSTANTS.attributes.INLINE, this._inline);
        }
    }
};
SkipLinkComponent = __decorate([
    customElement({
        name: SKIP_LINK_CONSTANTS.elementName,
        dependencies: [FocusIndicatorComponent, StateLayerComponent]
    })
], SkipLinkComponent);
export { SkipLinkComponent };
