/**
 * @license
 * Copyright 2023 Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
import { __decorate } from "tslib";
import { CustomElement, attachShadowTemplate, coerceBoolean, FoundationProperty } from '@tylertech/forge-core';
import { tylIconRemoveCircleOutline, tylIconControlPoint } from '@tylertech/tyler-icons/standard';
import { QuantityFieldAdapter } from './quantity-field-adapter';
import { QuantityFieldFoundation } from './quantity-field-foundation';
import { QUANTITY_FIELD_CONSTANTS } from './quantity-field-constants';
import { IconButtonComponent } from '../icon-button';
import { BaseComponent } from '../core/base/base-component';
const template = '<template><div class=\"forge-quantity-field\" part=\"root\"><slot name=\"label\"></slot><div class=\"forge-quantity-field__row\" part=\"row\"><slot name=\"decrement-button\"></slot><slot></slot><slot name=\"increment-button\"></slot></div><slot name=\"helper-text\"></slot></div></template>';
const styles = '.forge-quantity-field ::slotted([slot=label]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-quantity-field ::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);height:1rem;color:rgba(0,0,0,.54);color:var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,.54))}.forge-quantity-field ::slotted([slot=helper-text])::before{display:inline-block;width:0;height:16px;content:\"\";vertical-align:0}.forge-quantity-field__row{display:-webkit-box;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row;-webkit-box-align:center;align-items:center}.forge-quantity-field ::slotted(forge-icon-button:first-of-type){color:var(--mdc-theme-text-secondary-on-light);margin-right:4px}.forge-quantity-field ::slotted(forge-icon-button:last-of-type){color:var(--mdc-theme-text-secondary-on-light);margin-left:4px}.forge-quantity-field ::slotted(forge-text-field){--forge-text-field-margin-top:0;--forge-text-field-margin-bottom:0}.forge-quantity-field--required ::slotted([slot=label])::before{color:#b00020;color:var(--mdc-theme-error,#b00020);content:\"*\";margin-right:4px}.forge-quantity-field--invalid ::slotted([slot=label]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-quantity-field--invalid ::slotted([slot=helper-text]){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.75rem;font-size:var(--mdc-typography-caption-font-size, .75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight,400);letter-spacing:.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, .0333333333em);text-decoration:inherit;-webkit-text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-decoration:var(--mdc-typography-caption-text-decoration,inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform,inherit);height:1rem;color:#b00020;color:var(--mdc-theme-error,#b00020)}.forge-quantity-field--invalid ::slotted([slot=helper-text])::before{display:inline-block;width:0;height:16px;content:\"\";vertical-align:0}:host{display:inline-block}:host([hidden]){display:none}';
import { IconRegistry } from '../icon';
/**
 * The web component class behind the `<forge-quantity-field>` custom element.
 *
 * @tag forge-quantity-field
 */
let QuantityFieldComponent = class QuantityFieldComponent extends BaseComponent {
    constructor() {
        super();
        attachShadowTemplate(this, template, styles);
        this._foundation = new QuantityFieldFoundation(new QuantityFieldAdapter(this));
        IconRegistry.define([
            tylIconRemoveCircleOutline,
            tylIconControlPoint
        ]);
    }
    static get observedAttributes() {
        return [
            QUANTITY_FIELD_CONSTANTS.attributes.INVALID,
            QUANTITY_FIELD_CONSTANTS.attributes.REQUIRED
        ];
    }
    connectedCallback() {
        if (this._requiredElementsPresent()) {
            this._foundation.connect();
        }
        else {
            this._ensureElementsPresent().then(() => {
                this._foundation.connect();
            });
        }
    }
    disconnectedCallback() {
        this._foundation.disconnect();
    }
    attributeChangedCallback(name, oldValue, newValue) {
        switch (name) {
            case QUANTITY_FIELD_CONSTANTS.attributes.INVALID:
                this.invalid = coerceBoolean(newValue);
                break;
            case QUANTITY_FIELD_CONSTANTS.attributes.REQUIRED:
                this.required = coerceBoolean(newValue);
                break;
        }
    }
    _ensureElementsPresent() {
        return new Promise(resolve => {
            if (this._requiredElementsPresent()) {
                resolve();
                return;
            }
            const observer = new MutationObserver(changes => {
                const hasAddedNodes = changes.reduce((prev, curr) => prev + curr.addedNodes.length, 0) > 0;
                if (hasAddedNodes) {
                    if (this._requiredElementsPresent()) {
                        observer.disconnect();
                        resolve();
                    }
                }
            });
            observer.observe(this, { childList: true, subtree: true });
        });
    }
    _requiredElementsPresent() {
        const inputElement = this.querySelector(QUANTITY_FIELD_CONSTANTS.selectors.INPUT);
        const decrementElement = this.querySelector(QUANTITY_FIELD_CONSTANTS.selectors.DECREMENT_BUTTON);
        const incrementElement = this.querySelector(QUANTITY_FIELD_CONSTANTS.selectors.INCREMENT_BUTTON);
        return !!inputElement && !!decrementElement && !!incrementElement;
    }
};
__decorate([
    FoundationProperty()
], QuantityFieldComponent.prototype, "invalid", void 0);
__decorate([
    FoundationProperty()
], QuantityFieldComponent.prototype, "required", void 0);
QuantityFieldComponent = __decorate([
    CustomElement({
        name: QUANTITY_FIELD_CONSTANTS.elementName,
        dependencies: [
            IconButtonComponent
        ]
    })
], QuantityFieldComponent);
export { QuantityFieldComponent };
