import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ClISz4NF.js';
import { v as validateProp } from './props-CJZgTDla.js';
import { b as ButtonClass, B as ButtonColors, c as ButtonType, N as NativeType } from './constants-BNBB_29K.js';
import { g as govHost, t as toBoolAttrIfDefined } from './template-CoD1xawt.js';
import { S as Sizes } from './sizes-BcQO4NH2.js';
import { v as validateAccessibleLabel } from './wcag-CD6_13JO.js';
import { c as canValidateWcagOnRender } from './gov.log-BtqD9K8d.js';
import { d as delay } from './utils-CQvUntGY.js';
import { i as inheritAriaAttributes } from './accessibility-wqNV8djF.js';
import { A as AttributeObserver, a as ariaAttributes } from './attribute-Bz_RzYFb.js';
import './colors-U40vKHrs.js';
import './string.utils-vN03FcXN.js';
import './helpers.types-DNztiAH0.js';

function toBool(value) {
    if (typeof value === 'string') {
        return ['true', 'True', 'TRUE', '1'].indexOf(value) !== -1;
    }
    else if (typeof value === 'number') {
        return value > 0;
    }
    else if (typeof value === 'boolean') {
        return value;
    }
    else {
        return value ? true : false;
    }
}

var Tags;
(function (Tags) {
    Tags["A"] = "a";
    Tags["BUTTON"] = "button";
})(Tags || (Tags = {}));
const GovButton = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.govClick = createEvent(this, "gov-click");
        this.govFocus = createEvent(this, "gov-focus");
        this.govBlur = createEvent(this, "gov-blur");
        this.hydrated = false;
        /**
         * Button’s size
         */
        this.size = "m";
        /**
         * Expands the button to fill 100% of the container width
         */
        this.expanded = false;
        /**
         * Expands the button to fill 100% of the container width only on mobile
         */
        this.expandedMobile = false;
        /**
         * Makes the button component disabled.
         * This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies
         */
        this.disabled = false;
        /**
         * Same as original parameter
         * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type
         */
        this.nativeType = "button";
        /**
         * Same as original parameter
         * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download
         */
        this.tab = 0;
        /**
         * Same as original parameter
         * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/focusable
         */
        this.focusable = true;
        this.inheritedAttributes = {};
        this.h = govHost(this.host);
    }
    validateColor(newValue) {
        validateProp(ButtonColors, newValue, ButtonClass.root);
    }
    validateType(newValue) {
        validateProp(ButtonType, newValue, ButtonClass.root);
    }
    validateSize(newValue) {
        validateProp(Sizes, newValue, ButtonClass.root);
    }
    validateNativeType(newValue) {
        validateProp(NativeType, newValue, ButtonClass.root);
    }
    componentDidLoad() {
        this.attributeObserver = new AttributeObserver(this.host, (attributeName, newValue) => {
            this.onAriaAttributeChange(attributeName, newValue);
        });
        this.attributeObserver.startObserving(ariaAttributes);
    }
    onAriaAttributeChange(attributeName, newValue) {
        this.host.removeAttribute(attributeName);
        this.inheritedAttributes = Object.assign(Object.assign({}, this.inheritedAttributes), { [attributeName]: newValue });
    }
    disconnectedCallback() {
        var _a;
        (_a = this.attributeObserver) === null || _a === void 0 ? void 0 : _a.stopObserving();
    }
    componentWillLoad() {
        this.validateColor(this.color);
        this.validateType(this.type);
        this.validateSize(this.size);
        this.validateNativeType(this.nativeType);
        this.inheritedAttributes = inheritAriaAttributes(this.host);
    }
    async componentDidRender() {
        if (canValidateWcagOnRender()) {
            await delay(500);
            await this.validateAccessibility();
        }
    }
    connectedCallback() {
        this.hydrated = true;
    }
    render() {
        const Tag = this.href ? Tags.A : Tags.BUTTON;
        const nativeType = Tag === Tags.A ? undefined : this.nativeType;
        return (h(Host, { key: '0d010913c0331fcb11918152cb9bb2598923c5eb', size: this.size, hydrated: this.hydrated, color: this.color, class: this.h.classes(ButtonClass.root), type: this.type }, h(Tag, Object.assign({ key: 'd413645e924857fb5451c8e03c986013d85ddc06', class: "element", ref: el => (this.triggerRef = el), onClick: this.onClickHandler.bind(this), onFocus: this.onFocusHandler.bind(this), onBlur: this.onBlurHandler.bind(this), disabled: this.disabled, id: this.identifier, href: this.href, target: this.target, download: this.download, hreflang: this.hreflang, rel: this.rel, name: this.name, type: nativeType, tabindex: this.disabled ? "-1" : this.tab }, this.inheritedAttributes, { "aria-disabled": toBoolAttrIfDefined(this.disabled) }), toBool(this.loading) && !this.h.hasSlot("icon-end") &&
            h("gov-icon", { key: '13528203c29059fe167ca9b6f1f9134415517d47', name: "loader", class: "gov-spin-animation", type: "components" }), this.h.hasSlot("icon-start") && h("slot", { key: '304d82f1e7136a3f11ab44ce5e5b3166c2be2976', name: "icon-start" }), h("slot", { key: '6bc84a79e2acc72405c7b6831951d4984e5a6092' }), this.h.hasSlot("icon-end") && h("slot", { key: '044971729141feb76253c649de01db88e9459ccf', name: "icon-end" }), toBool(this.loading) && this.h.hasSlot("icon-end") &&
            h("gov-icon", { key: 'b55541b4d8ec377ec0aa9c80596b212306a5c02a', name: "loader", class: "gov-spin-animation", type: "components" }))));
    }
    onClickHandler(e) {
        e.stopPropagation();
        if (this.disabled === false) {
            this.govClick.emit({
                component: ButtonClass.root,
                originalEvent: e,
                ref: this.host,
            });
        }
    }
    onFocusHandler(e) {
        e.stopPropagation();
        this.govFocus.emit({
            component: ButtonClass.root,
            originalEvent: e,
            ref: this.host,
        });
    }
    onBlurHandler(e) {
        e.stopPropagation();
        this.govBlur.emit({
            component: ButtonClass.root,
            originalEvent: e,
            ref: this.host,
        });
    }
    /**
     * Focus button element
     */
    async setFocus() {
        this.triggerRef.focus();
    }
    /**
     * Returns a clickable element instance
     */
    async getRef() {
        return this.triggerRef;
    }
    /**
     * Validate the Accessibility attributes of the component
     */
    async validateAccessibility() {
        if (this.focusable) {
            validateAccessibleLabel(this.triggerRef.getAttribute('aria-label'), this.triggerRef.getAttribute('aria-labelledby'), ButtonClass.root, this.host);
        }
    }
    get host() { return getElement(this); }
    static get watchers() { return {
        "color": ["validateColor"],
        "type": ["validateType"],
        "size": ["validateSize"],
        "nativeType": ["validateNativeType"]
    }; }
};

export { GovButton as gov_button };
//# sourceMappingURL=gov-button.entry.js.map

//# sourceMappingURL=gov-button.entry.js.map