/**
 * @license
 * Copyright Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { customElement, attachShadowTemplate, coerceBoolean } from '@tylertech/forge-core';
import { tylIconKeyboardArrowRight, tylIconKeyboardArrowDown } from '@tylertech/tyler-icons/standard';
import { OPEN_ICON_CONSTANTS } from './open-icon-constants';
import { IconRegistry, IconComponent } from '../icon';
import { BaseComponent } from '../core/base/base-component';
const template = '<template><span class=\"forge-open-icon\" part=\"root\"><slot><forge-icon class=\"icon\" part=\"icon\" name=\"keyboard_arrow_down\"></forge-icon></slot></span></template>';
const styles = ':host{display:-webkit-inline-box;display:inline-flex}:host([hidden]){display:none}.forge-open-icon{--_open-icon-color:var(--forge-open-icon-color, var(--forge-theme-text-high, rgba(0, 0, 0, 0.87)));--_open-icon-size:var(--forge-open-icon-size, 24px);--_open-icon-height:var(--forge-open-icon-height, var(--_open-icon-size));--_open-icon-width:var(--forge-open-icon-width, var(--_open-icon-size));--_open-icon-initial-rotation:var(--forge-open-icon-initial-rotation, 0);--_open-icon-open-rotation:var(--forge-open-icon-open-rotation, 180deg);--_open-icon-animation-duration:var(--forge-open-icon-animation-duration, var(--forge-animation-duration-medium4, 400ms));--_open-icon-half-animation-duration:var(--forge-open-icon-half-animation-duration, var(--forge-animation-duration-short4, 200ms));--_open-icon-animation-timing:var(--forge-open-icon-animation-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)))}.forge-open-icon{height:var(--_open-icon-height);width:var(--_open-icon-width);color:var(--_open-icon-color);rotate:var(--_open-icon-initial-rotation);-webkit-transition:rotate var(--_open-icon-animation-duration) var(--_open-icon-animation-timing);transition:rotate var(--_open-icon-animation-duration) var(--_open-icon-animation-timing)}::slotted(forge-icon),forge-icon{--forge-icon-size:var(--_open-icon-size)}:host([open]) .forge-open-icon{rotate:var(--_open-icon-open-rotation)}:host([orientation=horizontal]) .forge-open-icon{--_open-icon-initial-rotation:var(--forge-open-icon-initial-rotation, -90deg);--_open-icon-open-rotation:var(--forge-open-icon-open-rotation, 90deg)}:host([rotation=half]) .forge-open-icon{--_open-icon-open-rotation:var(--forge-open-icon-open-rotation, -90deg);--_open-icon-animation-duration:var(--_open-icon-half-animation-duration)}:host([orientation=horizontal][rotation=half]) .forge-open-icon{--_open-icon-initial-rotation:var(--forge-open-icon-initial-rotation, -90deg);--_open-icon-open-rotation:var(--forge-open-icon-open-rotation, 0);--_open-icon-animation-duration:var(--_open-icon-half-animation-duration)}@media prefers-reduced-motion{.forge-open-icon{-webkit-transition:none;transition:none}}';
/**
 * @tag forge-open-icon
 *
 * @summary Open icons are used to indicate whether a section is open or closed.
 *
 * @property {boolean} [open=false] - Whether the icon is open or closed.
 * @property {OpenIconOrientation} [orientation=vertical] - The orientation of the rotation.
 * @property {OpenIconRotation} [rotation=full] - The rotation amount.
 *
 * @attribute {boolean} [open=false] - Whether the icon is open or closed.
 * @attribute {OpenIconOrientation} [orientation=vertical] - The orientation of the rotation.
 * @attribute {OpenIconRotation} [rotation=full] - The rotation amount.
 *
 * @cssproperty --forge-open-icon-color - The color of the icon.
 * @cssproperty --forge-open-icon-size - The size of the icon.
 * @cssproperty --forge-open-icon-height - The height of the icon. Defaults to `size`.
 * @cssproperty --forge-open-icon-width - The width of the icon. Defaults to `size`.
 * @cssproperty --forge-open-icon-initial-rotation - The initial rotation of the icon.
 * @cssproperty --forge-open-icon-open-rotation - The rotation of the icon when open.
 * @cssproperty --forge-open-icon-animation-duration - The duration of the open animation.
 * @cssproperty --forge-open-icon-half-animation-duration - The duration of the open animation when in a half orientation.
 * @cssproperty --forge-open-icon-animation-timing - The timing function of the open animation.
 *
 * @csspart root - The root element of the icon.
 * @csspart icon - The icon element.
 *
 * @slot - The icon to display when open.
 */
let OpenIconComponent = class OpenIconComponent extends BaseComponent {
    static get observedAttributes() {
        return Object.values(OPEN_ICON_CONSTANTS.observedAttributes);
    }
    constructor() {
        super();
        this._open = false;
        this._orientation = OPEN_ICON_CONSTANTS.defaults.ORIENTATION;
        this._rotation = OPEN_ICON_CONSTANTS.defaults.ROTATION;
        IconRegistry.define([tylIconKeyboardArrowRight, tylIconKeyboardArrowDown]);
        attachShadowTemplate(this, template, styles);
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case OPEN_ICON_CONSTANTS.attributes.OPEN:
                this.open = coerceBoolean(newValue);
                break;
            case OPEN_ICON_CONSTANTS.attributes.ORIENTATION:
                this.orientation = newValue;
                break;
            case OPEN_ICON_CONSTANTS.attributes.ROTATION:
                this.rotation = newValue;
                break;
        }
    }
    get open() {
        return this._open;
    }
    set open(value) {
        value = Boolean(value);
        if (this._open !== value) {
            this._open = value;
            this.toggleAttribute(OPEN_ICON_CONSTANTS.attributes.OPEN, value);
        }
    }
    get orientation() {
        return this._orientation;
    }
    set orientation(value) {
        if (this._orientation !== value) {
            this._orientation = value;
            this.setAttribute(OPEN_ICON_CONSTANTS.attributes.ORIENTATION, value);
        }
    }
    get rotation() {
        return this._rotation;
    }
    set rotation(value) {
        if (this._rotation !== value) {
            this._rotation = value;
            this.setAttribute(OPEN_ICON_CONSTANTS.attributes.ROTATION, value);
        }
    }
};
OpenIconComponent = __decorate([
    customElement({
        name: OPEN_ICON_CONSTANTS.elementName,
        dependencies: [IconComponent]
    })
], OpenIconComponent);
export { OpenIconComponent };
