var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s)
        if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
            t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { Host, forceUpdate, h, Fragment, } from "@stencil/core";
import { getBrandFromContext, handleHiddenFormButtonClick, inheritAttributes, isSlotUsed, removeDisabledFalse, renderFileHiddenInput, } from "../../utils/helpers";
import { IC_INHERITED_ARIA } from "../../utils/constants";
import { IcBrandForegroundEnum, } from "../../utils/types";
import arrowDropdown from "../../assets/arrow-dropdown.svg";
let buttonIds = 0;
/**
 * @slot left-icon - Content will be placed to the left of the button label.
 * @slot right-icon - Content will be placed to the right of the button label.
 * @slot top-icon - Content will be placed above the button label.
 * @slot badge - Badge component overlaying the top right of the button.
 * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.
 */
export class Button {
    constructor() {
        this.buttonIdNum = buttonIds++;
        this.hasTooltip = false;
        this.inheritedAttributes = {};
        this.describedbyEl = null;
        this.mutationObserver = null;
        this.hostMutationObserver = null;
        this.ariaLabel = "";
        this.title = "";
        /**
         * If `fileUpload` is set to `true`, this is the accepted list of file types.
         */
        this.accept = "*";
        /**
         * If `true`, the button will be in disabled state.
         */
        this.disabled = false;
        /**
         * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.
         */
        this.disableTooltip = false;
        /**
         * If `true`, the user can save the linked URL instead of navigating to it.
         */
        this.download = false;
        /**
         * If `true`, the button will show a dropdown icon.
         */
        this.dropdown = false;
        /**
         * If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.
         */
        this.dropdownExpanded = false;
        /**
         * If `true`, when the button is clicked the native file explorer will be launched.
         */
        this.fileUpload = false;
        /**
         * The name of the control for the file input, which is submitted with the form data.
         */
        this.fileInputName = `ic-button-file-upload-input-${buttonIds++}`;
        /**
         * If `true`, the button will fill the width of the container.
         */
        this.fullWidth = false;
        /**
         * If `true`, the button will be in loading state.
         */
        this.loading = false;
        /**
         * If `true`, the button will display as monochromatic in either `light` or `dark` theme.
         */
        this.monochrome = false;
        /**
         * If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.
         */
        this.multiple = false;
        /**
         * The size of the button to be displayed.
         */
        this.size = "medium";
        /**
         * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
         */
        this.theme = "inherit";
        /**
         * Setting to `true` can help in situations where tooltip content is clipped by a parent element.
         */
        this.tooltipFixedPositioning = false;
        /**
         * The position of the tooltip in relation to the button.
         */
        this.tooltipPlacement = "bottom";
        /**
         * If `true`, the secondary & tertiary variants of button will have a transparent background when not hovered, pressed or loading.
         */
        this.transparentBackground = true;
        /**
         * The type of the button.
         */
        this.type = "button";
        /**
         * The variant of the button to be displayed.
         */
        this.variant = "primary";
        this.getSlottedIcon = (position) => this.el.querySelector(`[slot="${position}-icon"]`);
        this.handleClick = () => {
            if ((this.el.type === "submit" || this.el.type === "reset") &&
                !this.hasRouterSlot() &&
                (this.form || !!this.el.closest("FORM"))) {
                const form = this.form
                    ? document.querySelector(`form[id=${this.form}]`)
                    : this.el.closest("FORM");
                handleHiddenFormButtonClick(form, this.el);
            }
        };
        this.handleKeyDown = (ev) => {
            if (ev.key === "Escape" && this.hasTooltip) {
                this.closeButtonTooltip(ev);
            }
        };
        this.onFocus = () => {
            this.icFocus.emit();
        };
        this.onBlur = () => {
            this.icBlur.emit();
        };
        /**
         * Creates/updates clone of aria-describedby element node tree in shadow dom
         * Required due to ids being scoped to the shadow dom
         */
        this.updateAriaDescribedbyClone = () => {
            var _a, _b;
            if (this.describedbyNode) {
                const wrapper = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("#describedby-wrapper");
                if (!wrapper) {
                    (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.appendChild(Object.assign(document.createElement("div"), {
                        id: "describedby-wrapper",
                        className: "ic-button-describedby",
                    }));
                }
                while (wrapper === null || wrapper === void 0 ? void 0 : wrapper.firstChild)
                    wrapper.firstChild.remove();
                wrapper === null || wrapper === void 0 ? void 0 : wrapper.appendChild(this.describedbyNode);
            }
        };
        /**
         * Triggered when light dom aria-describedby element updates
         */
        this.mutationCallback = () => {
            var _a;
            if (this.describedbyEl)
                this.describedbyNode = (_a = this.describedbyEl) === null || _a === void 0 ? void 0 : _a.cloneNode(true);
        };
        /**
         * Triggered when attributes of host element change
         * @param mutationList the list of changes made to the host element
         */
        this.hostMutationCallback = (mutationList) => {
            let forceComponentUpdate = false;
            mutationList.forEach(({ attributeName }) => {
                if (attributeName) {
                    const attribute = this.el.getAttribute(attributeName);
                    if (attribute) {
                        if (attributeName === "title")
                            this.title = attribute;
                        else if (attributeName === "aria-label")
                            this.ariaLabel = attribute;
                        if (IC_INHERITED_ARIA.includes(attributeName)) {
                            this.inheritedAttributes[attributeName] = attribute;
                            forceComponentUpdate = true;
                        }
                    }
                }
            });
            if (forceComponentUpdate) {
                forceUpdate(this);
            }
        };
        this.setHasTooltip = () => {
            this.hasTooltip =
                !this.disableTooltip && (!!this.title || !!this.isIconVariant());
        };
        this.isIconVariant = () => this.variant.startsWith("icon");
        this.arrangeRouterItem = () => {
            var _a;
            const setStyles = (element, styles) => {
                Object.entries(styles).forEach(([key, value]) => {
                    element.style.setProperty(key, value);
                });
            };
            if (this.routerSlot) {
                const icTypography = document.createElement("ic-typography");
                setStyles(icTypography, {
                    "font-family": "var(--ic-font-body-family)",
                    "font-size": "0.875rem",
                    "font-weight": "600",
                });
                setStyles(this.routerSlot, {
                    gap: "0",
                });
                const icon = this.routerSlot.querySelector("svg");
                const iconSlot = icon === null || icon === void 0 ? void 0 : icon.getAttribute("slot");
                const iconWrapper = document.createElement("div");
                if (icon) {
                    setStyles(icon, {
                        fill: "currentcolor",
                    });
                    if (iconSlot === "top-icon") {
                        setStyles(this.routerSlot, {
                            display: "flex",
                            "flex-direction": "column",
                            "--height": "fit-content",
                        });
                    }
                    else if (iconSlot) {
                        const marginPlacement = iconSlot === "left-icon" ? "right" : "left";
                        setStyles(iconWrapper, {
                            [`margin-${marginPlacement}`]: "var(--ic-space-xs)",
                        });
                    }
                    iconWrapper.append(icon);
                }
                const badge = this.routerSlot.querySelector("ic-badge");
                const label = (_a = this.routerSlot.textContent) === null || _a === void 0 ? void 0 : _a.trim();
                if (badge)
                    iconWrapper.append(badge);
                if (label)
                    icTypography.textContent = label;
                this.routerSlot.textContent = "";
                if (iconSlot === "right-icon") {
                    this.routerSlot.append(icTypography);
                    this.routerSlot.append(iconWrapper);
                }
                else {
                    this.routerSlot.append(iconWrapper);
                    this.routerSlot.append(icTypography);
                }
            }
        };
    }
    watchDescribedbyNodeHandler() {
        this.updateAriaDescribedbyClone();
    }
    watchDisabledHandler() {
        removeDisabledFalse(this.disabled, this.el);
    }
    watchVariantHandler(newVariant) {
        if (newVariant === "icon")
            this.variant = "icon-tertiary";
    }
    disconnectedCallback() {
        var _a, _b;
        (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
        (_b = this.hostMutationObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
    }
    componentWillUpdate() {
        if (this.loading) {
            this.el.style.setProperty("--min-width", `${this.el.getBoundingClientRect().width}px`);
        }
        this.setHasTooltip();
    }
    componentWillLoad() {
        const _a = inheritAttributes(this.el, [...IC_INHERITED_ARIA, "title"]), { title, "aria-label": ariaLabel } = _a, restInheritedAttributes = __rest(_a, ["title", "aria-label"]);
        this.title = title;
        this.ariaLabel = ariaLabel;
        this.inheritedAttributes = restInheritedAttributes;
        removeDisabledFalse(this.disabled, this.el);
        this.el.setAttribute("exportparts", "button");
        this.id = this.el.id || null;
        this.setHasTooltip();
        if (!this.hasTooltip) {
            const describedById = this.inheritedAttributes["aria-describedby"];
            if (describedById) {
                this.describedById = describedById;
                const el = document.querySelector(`#${describedById}`);
                if (el) {
                    this.describedbyEl = el;
                    this.describedbyNode = el.cloneNode(true);
                }
            }
        }
        if (this.variant === "icon") {
            this.variant = "icon-tertiary";
        }
    }
    componentDidLoad() {
        this.updateTheme();
        if (typeof MutationObserver !== "undefined") {
            if (this.describedbyEl && this.describedById) {
                this.mutationObserver = new MutationObserver(this.mutationCallback);
                this.mutationObserver.observe(this.describedbyEl, {
                    characterData: true,
                    childList: true,
                    subtree: true,
                });
            }
            this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
            this.hostMutationObserver.observe(this.el, {
                attributes: true,
            });
            if (this.hasRouterSlot())
                this.arrangeRouterItem();
        }
        this.updateAriaDescribedbyClone();
    }
    componentWillRender() {
        const iconEl = this.getSlottedIcon("left") || this.getSlottedIcon("right");
        iconEl === null || iconEl === void 0 ? void 0 : iconEl.setAttribute("viewBox", "0 0 24 24");
    }
    handleHostClick(event) {
        if (!this.hasRouterSlot()) {
            if (this.fileUpload) {
                renderFileHiddenInput(this.icFileSelection, this.el, !!this.multiple, !!this.disabled, this.accept, this.fileInputName, this.selectedFiles);
            }
            if (this.disabled || this.loading) {
                event.stopImmediatePropagation();
            }
            if (this.dropdown) {
                this.dropdownExpanded = !this.dropdownExpanded;
            }
        }
    }
    brandChangeHandler({ detail }) {
        this.updateTheme(detail.mode);
    }
    /**
     * Sets focus on the native `button`.
     */
    async setFocus() {
        var _a;
        (_a = this.buttonEl) === null || _a === void 0 ? void 0 : _a.focus();
    }
    async closeButtonTooltip(ev) {
        var _a;
        const tooltip = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("ic-tooltip");
        if (tooltip && (await tooltip.isTooltipVisible())) {
            tooltip.displayTooltip(false);
            ev.preventDefault();
            ev.stopImmediatePropagation();
        }
    }
    hasRouterSlot() {
        this.routerSlot = this.el.querySelector('[slot="router-item"]');
        if (this.routerSlot) {
            this.routerSlot.ariaLabel = this.routerSlot.textContent;
        }
        return !!this.routerSlot;
    }
    updateTheme(mode = null) {
        const foregroundColor = getBrandFromContext(this.el, mode);
        if (foregroundColor !== IcBrandForegroundEnum.Default) {
            this.theme =
                foregroundColor === IcBrandForegroundEnum.Light
                    ? IcBrandForegroundEnum.Dark
                    : IcBrandForegroundEnum.Light;
            this.monochrome = true;
        }
    }
    render() {
        const { ariaControlsId, ariaLabel, ariaOwnsId, buttonIdNum, describedById, disabled, download, dropdown, dropdownExpanded, form, formaction, formenctype, formmethod, formnovalidate, formtarget, fullWidth, handleClick, handleKeyDown, hasTooltip, href, hreflang, id, inheritedAttributes, isIconVariant, loading, monochrome, onBlur, onFocus, referrerpolicy, rel, size, target, theme, title, tooltipFixedPositioning, tooltipPlacement, transparentBackground, type, variant, } = this;
        const TagType = href ? "a" : "button";
        const buttonAttrs = TagType === "button"
            ? {
                type,
                disabled,
                form,
                formaction,
                formenctype,
                formmethod,
                formnovalidate,
                formtarget,
            }
            : {
                download: download !== false ? download : null,
                href,
                rel,
                target,
                referrerpolicy,
                hreflang,
            };
        const buttonId = hasTooltip
            ? `ic-button-with-tooltip-${id || buttonIdNum}`
            : undefined;
        const describedby = !hasTooltip ? describedById : `ic-tooltip-${buttonId}`;
        const hasLeftIcon = !!this.getSlottedIcon("left");
        const hasRightIcon = !!this.getSlottedIcon("right");
        const ButtonContent = () => this.hasRouterSlot() ? (h("slot", { name: "router-item" })) : (h(TagType, Object.assign({ class: "button", tabindex: 0, "aria-disabled": loading || disabled ? "true" : null, "aria-label": loading ? "Loading" : ariaLabel, "aria-expanded": dropdown && `${dropdownExpanded}` }, buttonAttrs, inheritedAttributes, { onFocus: onFocus, onBlur: onBlur, ref: (el) => (this.buttonEl = el), "aria-describedby": describedby, part: "button" }), loading ? (h("div", { class: "loading-container" }, h("ic-loading-indicator", { type: isIconVariant() ? "circular" : "linear", class: { "loading-indicator-icon-button": isIconVariant() }, monochrome: monochrome, theme: theme }))) : (h(Fragment, null, (hasLeftIcon ||
            (!!this.getSlottedIcon("top") && !hasRightIcon)) && (h("div", { class: "icon-container" }, h("slot", { name: `${hasLeftIcon ? "left" : "top"}-icon` }))), h("slot", null), !dropdown
            ? hasRightIcon && (h("div", { class: { "icon-container": true, "right-icon": true } }, h("slot", { name: "right-icon" })))
            : variant !== "icon" &&
                variant !== "destructive" && (h("span", { class: dropdownExpanded
                    ? "dropdown-expanded"
                    : "arrow-dropdown", innerHTML: arrowDropdown }))))));
        return (h(Host, { key: '9af3124fa3bb001b9b744b4df20d0e107f865df1', class: {
                "ic-button-disabled": disabled && !loading,
                "ic-button-full-width": fullWidth,
                "ic-button-loading": loading,
                [`ic-button-size-${size}`]: true,
                [`ic-button-variant-${variant}`]: true,
                [`ic-theme-${theme}`]: theme !== "inherit",
                background: (variant === "secondary" || variant === "tertiary") &&
                    !transparentBackground &&
                    !disabled,
                "dropdown-no-icon": dropdown &&
                    !isSlotUsed(this.el, "icon") &&
                    !isSlotUsed(this.el, "left-icon"),
                monochrome,
                "top-icon": isSlotUsed(this.el, "top-icon"),
                "with-badge": isSlotUsed(this.el, "badge"),
            }, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (h("ic-tooltip", { key: '533f8aac9579f16eaae0a167a683f7c42973de95', id: describedby, label: title || ariaLabel, target: buttonId, placement: tooltipPlacement, fixedPositioning: tooltipFixedPositioning, silent: isIconVariant() && !!ariaLabel }, h(ButtonContent, { key: '67502a4253722031847e36ae3275ca48c7d01bd4' }))), isSlotUsed(this.el, "badge") && h("slot", { key: 'e4e5081c6f415f0447ae43398fd11fcf51a426f3', name: "badge" }), !hasTooltip && h(ButtonContent, { key: '5185de2240ddaddbc0bb35bdab51bc63e91492a5' })));
    }
    static get is() { return "ic-button"; }
    static get encapsulation() { return "shadow"; }
    static get delegatesFocus() { return true; }
    static get originalStyleUrls() {
        return {
            "$": ["ic-button.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["ic-button.css"]
        };
    }
    static get properties() {
        return {
            "accept": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `fileUpload` is set to `true`, this is the accepted list of file types."
                },
                "getter": false,
                "setter": false,
                "attribute": "accept",
                "reflect": false,
                "defaultValue": "\"*\""
            },
            "ariaControlsId": {
                "type": "any",
                "mutable": false,
                "complexType": {
                    "original": "string | boolean",
                    "resolved": "boolean | string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "internal",
                            "text": "Used to identify any related child component"
                        }],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "aria-controls-id",
                "reflect": false
            },
            "ariaOwnsId": {
                "type": "any",
                "mutable": false,
                "complexType": {
                    "original": "string | boolean",
                    "resolved": "boolean | string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "internal",
                            "text": "Used to identify any related child component"
                        }],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "aria-owns-id",
                "reflect": false
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the button will be in disabled state."
                },
                "getter": false,
                "setter": false,
                "attribute": "disabled",
                "reflect": false,
                "defaultValue": "false"
            },
            "disableTooltip": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied."
                },
                "getter": false,
                "setter": false,
                "attribute": "disable-tooltip",
                "reflect": false,
                "defaultValue": "false"
            },
            "download": {
                "type": "any",
                "mutable": false,
                "complexType": {
                    "original": "string | boolean",
                    "resolved": "boolean | string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the user can save the linked URL instead of navigating to it."
                },
                "getter": false,
                "setter": false,
                "attribute": "download",
                "reflect": false,
                "defaultValue": "false"
            },
            "dropdown": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the button will show a dropdown icon."
                },
                "getter": false,
                "setter": false,
                "attribute": "dropdown",
                "reflect": false,
                "defaultValue": "false"
            },
            "dropdownExpanded": {
                "type": "boolean",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true."
                },
                "getter": false,
                "setter": false,
                "attribute": "dropdown-expanded",
                "reflect": true,
                "defaultValue": "false"
            },
            "fileUpload": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, when the button is clicked the native file explorer will be launched."
                },
                "getter": false,
                "setter": false,
                "attribute": "file-upload",
                "reflect": false,
                "defaultValue": "false"
            },
            "fileInputName": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The name of the control for the file input, which is submitted with the form data."
                },
                "getter": false,
                "setter": false,
                "attribute": "file-input-name",
                "reflect": false,
                "defaultValue": "`ic-button-file-upload-input-${buttonIds++}`"
            },
            "form": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The <form> element to associate the button with."
                },
                "getter": false,
                "setter": false,
                "attribute": "form",
                "reflect": false
            },
            "formaction": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The URL that processes the information submitted by the button. It overrides the action attribute of the button's form owner. Does nothing if there is no form owner."
                },
                "getter": false,
                "setter": false,
                "attribute": "formaction",
                "reflect": false
            },
            "formenctype": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The way the submitted form data is encoded."
                },
                "getter": false,
                "setter": false,
                "attribute": "formenctype",
                "reflect": false
            },
            "formmethod": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The HTTP method used to submit the form."
                },
                "getter": false,
                "setter": false,
                "attribute": "formmethod",
                "reflect": false
            },
            "formnovalidate": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the form will not be validated when submitted."
                },
                "getter": false,
                "setter": false,
                "attribute": "formnovalidate",
                "reflect": false
            },
            "formtarget": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The place to display the response from submitting the form. It overrides the target attribute of the button's form owner."
                },
                "getter": false,
                "setter": false,
                "attribute": "formtarget",
                "reflect": false
            },
            "fullWidth": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the button will fill the width of the container."
                },
                "getter": false,
                "setter": false,
                "attribute": "full-width",
                "reflect": false,
                "defaultValue": "false"
            },
            "href": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The URL that the link points to. This will render the button as an \"a\" tag."
                },
                "getter": false,
                "setter": false,
                "attribute": "href",
                "reflect": false
            },
            "hreflang": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The human language of the linked URL."
                },
                "getter": false,
                "setter": false,
                "attribute": "hreflang",
                "reflect": false
            },
            "loading": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the button will be in loading state."
                },
                "getter": false,
                "setter": false,
                "attribute": "loading",
                "reflect": false,
                "defaultValue": "false"
            },
            "monochrome": {
                "type": "boolean",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the button will display as monochromatic in either `light` or `dark` theme."
                },
                "getter": false,
                "setter": false,
                "attribute": "monochrome",
                "reflect": false,
                "defaultValue": "false"
            },
            "multiple": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted."
                },
                "getter": false,
                "setter": false,
                "attribute": "multiple",
                "reflect": false,
                "defaultValue": "false"
            },
            "referrerpolicy": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ReferrerPolicy",
                    "resolved": "\"\" | \"no-referrer\" | \"no-referrer-when-downgrade\" | \"origin\" | \"origin-when-cross-origin\" | \"same-origin\" | \"strict-origin\" | \"strict-origin-when-cross-origin\" | \"unsafe-url\" | undefined",
                    "references": {
                        "ReferrerPolicy": {
                            "location": "global",
                            "id": "global::ReferrerPolicy"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "How much of the referrer to send when following the link."
                },
                "getter": false,
                "setter": false,
                "attribute": "referrerpolicy",
                "reflect": false
            },
            "rel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The relationship of the linked URL as space-separated link types."
                },
                "getter": false,
                "setter": false,
                "attribute": "rel",
                "reflect": false
            },
            "selectedFiles": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "FileList",
                    "resolved": "FileList | undefined",
                    "references": {
                        "FileList": {
                            "location": "global",
                            "id": "global::FileList"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The list of the files that have been selected by a user."
                },
                "getter": false,
                "setter": false
            },
            "size": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcSizes",
                    "resolved": "\"large\" | \"medium\" | \"small\"",
                    "references": {
                        "IcSizes": {
                            "location": "import",
                            "path": "../../utils/types",
                            "id": "src/utils/types.ts::IcSizes"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The size of the button to be displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "size",
                "reflect": false,
                "defaultValue": "\"medium\""
            },
            "target": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe)."
                },
                "getter": false,
                "setter": false,
                "attribute": "target",
                "reflect": false
            },
            "theme": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "IcThemeMode",
                    "resolved": "\"dark\" | \"inherit\" | \"light\"",
                    "references": {
                        "IcThemeMode": {
                            "location": "import",
                            "path": "../../utils/types",
                            "id": "src/utils/types.ts::IcThemeMode"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component."
                },
                "getter": false,
                "setter": false,
                "attribute": "theme",
                "reflect": false,
                "defaultValue": "\"inherit\""
            },
            "tooltipFixedPositioning": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Setting to `true` can help in situations where tooltip content is clipped by a parent element."
                },
                "getter": false,
                "setter": false,
                "attribute": "tooltip-fixed-positioning",
                "reflect": false,
                "defaultValue": "false"
            },
            "tooltipPlacement": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcButtonTooltipPlacement",
                    "resolved": "\"bottom\" | \"left\" | \"right\" | \"top\"",
                    "references": {
                        "IcButtonTooltipPlacement": {
                            "location": "import",
                            "path": "../../utils/types",
                            "id": "src/utils/types.ts::IcButtonTooltipPlacement"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The position of the tooltip in relation to the button."
                },
                "getter": false,
                "setter": false,
                "attribute": "tooltip-placement",
                "reflect": false,
                "defaultValue": "\"bottom\""
            },
            "transparentBackground": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the secondary & tertiary variants of button will have a transparent background when not hovered, pressed or loading."
                },
                "getter": false,
                "setter": false,
                "attribute": "transparent-background",
                "reflect": false,
                "defaultValue": "true"
            },
            "type": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcButtonTypes",
                    "resolved": "\"button\" | \"reset\" | \"submit\"",
                    "references": {
                        "IcButtonTypes": {
                            "location": "import",
                            "path": "./ic-button.types",
                            "id": "src/components/ic-button/ic-button.types.ts::IcButtonTypes"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The type of the button."
                },
                "getter": false,
                "setter": false,
                "attribute": "type",
                "reflect": false,
                "defaultValue": "\"button\""
            },
            "variant": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "IcButtonVariants",
                    "resolved": "\"destructive\" | \"icon\" | \"icon-destructive\" | \"icon-primary\" | \"icon-secondary\" | \"icon-tertiary\" | \"primary\" | \"secondary\" | \"tertiary\"",
                    "references": {
                        "IcButtonVariants": {
                            "location": "import",
                            "path": "./ic-button.types",
                            "id": "src/components/ic-button/ic-button.types.ts::IcButtonVariants"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The variant of the button to be displayed."
                },
                "getter": false,
                "setter": false,
                "attribute": "variant",
                "reflect": false,
                "defaultValue": "\"primary\""
            }
        };
    }
    static get states() {
        return {
            "ariaLabel": {},
            "describedbyNode": {},
            "title": {}
        };
    }
    static get events() {
        return [{
                "method": "icBlur",
                "name": "icBlur",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when button has blur"
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }, {
                "method": "icFileSelection",
                "name": "icFileSelection",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer."
                },
                "complexType": {
                    "original": "FileList",
                    "resolved": "FileList",
                    "references": {
                        "FileList": {
                            "location": "global",
                            "id": "global::FileList"
                        }
                    }
                }
            }, {
                "method": "icFocus",
                "name": "icFocus",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when button has focus"
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }];
    }
    static get methods() {
        return {
            "setFocus": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Sets focus on the native `button`.",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "describedbyNode",
                "methodName": "watchDescribedbyNodeHandler"
            }, {
                "propName": "disabled",
                "methodName": "watchDisabledHandler"
            }, {
                "propName": "variant",
                "methodName": "watchVariantHandler"
            }];
    }
    static get listeners() {
        return [{
                "name": "click",
                "method": "handleHostClick",
                "target": undefined,
                "capture": true,
                "passive": false
            }, {
                "name": "brandChange",
                "method": "brandChangeHandler",
                "target": "document",
                "capture": false,
                "passive": false
            }];
    }
}
//# sourceMappingURL=ic-button.js.map
