import { h, Host } from "@stencil/core";
/**
 * @part button
 */
export class PdsDropdownMenuItem {
    constructor() {
        /**
         * It determines whether or not the dropdown-item is destructive.
         * @defaultValue false
         */
        this.destructive = false;
        /**
         * It determines whether or not the dropdown-item is disabled.
         * @defaultValue false
         */
        this.disabled = false;
        /**
         * Determines whether the link should open in a new tab and display an external icon.
         * This is a simpler alternative to using `target="_blank"` for the common case.
         * @defaultValue false
         */
        this.external = false;
        this.hasFocus = false;
        this.handleFocus = () => {
            this.hasFocus = true;
        };
        this.handleBlur = () => {
            this.hasFocus = false;
        };
        this.handleKeyDown = (event) => {
            // Handle keyboard events
            if (!this.disabled && (event.key === 'Enter')) {
                // Only prevent default for button elements or Space key
                // For links with Enter key, we want the default navigation behavior
                if (!this.href) {
                    event.preventDefault();
                }
                this.handleClick();
            }
        };
    }
    /**
     * Trigger the click event
     */
    async clickItem() {
        this.handleClick();
    }
    ;
    handleClick() {
        var _a;
        // Filter only pds-dropdown-menu-item elements and find the index of the current item
        const menuItems = Array.from(this.host.parentNode.children).filter((child) => child.tagName.toLowerCase() === 'pds-dropdown-menu-item');
        const itemIndex = menuItems.indexOf(this.host);
        // Get the text content from the slotted content
        const content = ((_a = this.host.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
        this.pdsClick.emit({
            itemIndex,
            item: this.host,
            content
        });
    }
    renderElement() {
        if (this.href !== undefined) {
            return (h("pds-link", { download: this.download, href: this.disabled ? null : this.href, external: this.external, target: this.target, class: {
                    'pds-dropdown-menu-item__content': true,
                    'has-focus': this.hasFocus
                }, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, "aria-disabled": this.disabled ? 'true' : null }, h("slot", null)));
        }
        return (h("button", { class: {
                'pds-dropdown-menu-item__content': true,
                'has-focus': this.hasFocus
            }, tabIndex: this.disabled ? -1 : 0, type: "button", part: "button", onKeyDown: this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null }, h("slot", null)));
    }
    render() {
        return (h(Host, { key: 'd2a6c182b330dae3738650002a4643c0f1fd3d1a', id: this.componentId, class: { 'is-disabled': this.disabled, 'destructive': !this.disabled && this.destructive }, onClick: () => !this.disabled && this.handleClick(), role: "none", tabIndex: -1, "aria-disabled": this.disabled ? 'true' : null }, this.renderElement()));
    }
    static get is() { return "pds-dropdown-menu-item"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["pds-dropdown-menu-item.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pds-dropdown-menu-item.css"]
        };
    }
    static get properties() {
        return {
            "componentId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "A unique identifier used for the underlying component `id` attribute."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "component-id"
            },
            "destructive": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "It determines whether or not the dropdown-item is destructive."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "destructive",
                "defaultValue": "false"
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "It determines whether or not the dropdown-item is disabled."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "disabled",
                "defaultValue": "false"
            },
            "download": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Prompts the user to save the linked URL instead of navigating to it.\nIt can be used without a value to download with the default filename,\nor with a string value to suggest a specific filename for the download.\nOnly applies when href is set."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "download"
            },
            "href": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string | undefined",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "If provided, renders the dropdown-item as an anchor (`<a>`) element instead of a button."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "href"
            },
            "external": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines whether the link should open in a new tab and display an external icon.\nThis is a simpler alternative to using `target=\"_blank\"` for the common case."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "external",
                "defaultValue": "false"
            },
            "target": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'_blank' | '_self' | '_parent' | '_top'",
                    "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "undefined"
                        }],
                    "text": "Specifies where to open the linked document when href is provided.\nTakes precedence over the `external` prop if both are set.\nOnly applies when href is set."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "target"
            }
        };
    }
    static get states() {
        return {
            "hasFocus": {}
        };
    }
    static get events() {
        return [{
                "method": "pdsClick",
                "name": "pdsClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Emitted when the dropdown-item is clicked."
                },
                "complexType": {
                    "original": "{itemIndex: number, item: HTMLPdsDropdownMenuItemElement, content: string}",
                    "resolved": "{ itemIndex: number; item: HTMLPdsDropdownMenuItemElement; content: string; }",
                    "references": {
                        "HTMLPdsDropdownMenuItemElement": {
                            "location": "global",
                            "id": "global::HTMLPdsDropdownMenuItemElement"
                        }
                    }
                }
            }];
    }
    static get methods() {
        return {
            "clickItem": {
                "complexType": {
                    "signature": "() => Promise<void>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Trigger the click event",
                    "tags": []
                }
            }
        };
    }
    static get elementRef() { return "host"; }
}
//# sourceMappingURL=pds-dropdown-menu-item.js.map
