import { h, Host, } from "@stencil/core";
import OpenInNew from "../../assets/OpenInNew.svg";
import { isElInAGGrid, isSlotUsed, onComponentRequiredPropUndefined, removeDisabledFalse, renderDynamicChildSlots, } from "../../utils/helpers";
/**
 * @slot badge - Badge component overlaying the top right of the chip.
 * @slot icon - Content will be rendered at the start of the chip.
 */
export class ActionChip {
    constructor() {
        /**
         * If `true`, the chip will appear disabled.
         */
        this.disabled = false;
        /**
         * If `true`, the user can save the linked URL instead of navigating to it.
         */
        this.download = false;
        /**
         * If `true`, the button will display as monochromatic in either `light` or `dark` theme.
         */
        this.monochrome = false;
        /**
         * The size of the chip.
         */
        this.size = "medium";
        /**
         * Sets the chip to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
         */
        this.theme = "inherit";
        /**
         * If `true`, the outlined variant of chip will have a transparent background rather than the theme defined color.
         */
        this.transparentBackground = true;
        /**
         * The type of the chip.
         */
        this.type = "button";
        /**
         * The emphasis of the chip.
         */
        this.variant = "filled";
    }
    watchDisabledHandler() {
        removeDisabledFalse(this.disabled, this.el);
    }
    disconnectedCallback() {
        var _a;
        (_a = this.hostMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
    }
    componentWillLoad() {
        removeDisabledFalse(this.disabled, this.el);
    }
    componentDidLoad() {
        onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Chip");
        this.hostMutationObserver = new MutationObserver((mutationList) => renderDynamicChildSlots(mutationList, ["icon", "badge"], this));
        this.hostMutationObserver.observe(this.el, {
            childList: true,
        });
    }
    /**
     * Sets focus on the chip.
     */
    async setFocus() {
        var _a;
        (_a = this.chipEl) === null || _a === void 0 ? void 0 : _a.focus();
    }
    render() {
        const { disabled, download, form, formaction, formenctype, formmethod, formnovalidate, formtarget, href, hreflang, label, monochrome, referrerpolicy, rel, size, target, theme, transparentBackground, type, variant, } = this;
        const TagType = href ? "a" : "button";
        const isButtonElement = TagType === "button";
        const chipAttrs = isButtonElement
            ? {
                disabled,
                form,
                formaction,
                formenctype,
                formmethod,
                formnovalidate,
                formtarget,
                type,
            }
            : {
                download: download !== false ? download : null,
                href,
                hreflang,
                referrerpolicy,
                rel,
                target,
            };
        return (h(Host, { key: '095711b5abc9fe760f9c14245a1ce327696818a2', class: {
                [`ic-theme-${theme}`]: theme !== "inherit",
            } }, h(TagType, Object.assign({ key: '8b352bcd66bb27be4eff90246371eac0bfa266cb', class: {
                chip: true,
                disabled: isButtonElement && disabled,
                monochrome,
                "non-transparent": variant === "outlined" && !transparentBackground,
                [`${size}`]: true,
                [`${variant}`]: true,
            }, ref: (el) => (this.chipEl = el) }, chipAttrs), isSlotUsed(this.el, "icon") && (h("div", { key: 'cac34c4420e0b92337b4421088389e79dc2d3e78', class: "icon" }, h("slot", { key: 'fbbdfcf2089a6a31785a33ddc74c66ad433ebe4c', name: "icon" }))), h("ic-typography", { key: '40643c5bb5b15a64a94913076d06ba0007bac14a', variant: "label", class: {
                label: true,
                [`${size}`]: true,
                "in-ag-grid": isElInAGGrid(this.el),
            } }, h("span", { key: '84e78294e0f906e9348d0223bd6afb92b90f4263' }, label)), !isButtonElement && target === "_blank" && (h("span", { key: '8767227d1ed7c1822fff1fe71103a26587b00d6e', class: "open-in-new-icon", innerHTML: OpenInNew })), isSlotUsed(this.el, "badge") && h("slot", { key: '8b791d90dadc0a781c88d1a68542929b73495858', name: "badge" }))));
    }
    static get is() { return "ic-action-chip"; }
    static get encapsulation() { return "shadow"; }
    static get delegatesFocus() { return true; }
    static get originalStyleUrls() {
        return {
            "$": ["ic-action-chip.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["ic-action-chip.css"]
        };
    }
    static get properties() {
        return {
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the chip will appear disabled."
                },
                "getter": false,
                "setter": false,
                "attribute": "disabled",
                "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"
            },
            "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 chip 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 chip. It overrides the action attribute of the chip'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 chip's form owner."
                },
                "getter": false,
                "setter": false,
                "attribute": "formtarget",
                "reflect": 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 chip 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
            },
            "label": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The text rendered within the chip."
                },
                "getter": false,
                "setter": false,
                "attribute": "label",
                "reflect": false
            },
            "monochrome": {
                "type": "boolean",
                "mutable": false,
                "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"
            },
            "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
            },
            "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 chip."
                },
                "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": false,
                "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 chip to the dark or light theme colors. \"inherit\" will set the color based on the system settings or ic-theme component."
                },
                "getter": false,
                "setter": false,
                "attribute": "theme",
                "reflect": false,
                "defaultValue": "\"inherit\""
            },
            "transparentBackground": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the outlined variant of chip will have a transparent background rather than the theme defined color."
                },
                "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/ic-button.types",
                            "id": "src/components/ic-button/ic-button.types.ts::IcButtonTypes"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The type of the chip."
                },
                "getter": false,
                "setter": false,
                "attribute": "type",
                "reflect": false,
                "defaultValue": "\"button\""
            },
            "variant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcEmphasisType",
                    "resolved": "\"filled\" | \"outlined\"",
                    "references": {
                        "IcEmphasisType": {
                            "location": "import",
                            "path": "../../utils/types",
                            "id": "src/utils/types.ts::IcEmphasisType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The emphasis of the chip."
                },
                "getter": false,
                "setter": false,
                "attribute": "variant",
                "reflect": false,
                "defaultValue": "\"filled\""
            }
        };
    }
    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 chip.",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "disabled",
                "methodName": "watchDisabledHandler"
            }];
    }
}
//# sourceMappingURL=ic-action-chip.js.map
