import { downSmall, remove } from "@pine-ds/icons/icons";
import { Host, h } from "@stencil/core";
/**
 * @slot (default) - The chip's label text.
 * @part button
 */
export class PdsChip {
    constructor() {
        /**
         * Determines whether a dot should be displayed on the chip.
         * Note: This prop is ignored when sentiment is 'brand'.
         * @defaultValue false
         */
        this.dot = false;
        /**
         * Determines whether the chip should be displayed in a larger size. DEPRECATED.
         * @defaultValue false
         * @deprecated Use `size` prop instead. Set `size="lg"` for the large variant.
         */
        this.large = false;
        /**
         * Defines the color scheme of the chip.
         * @defaultValue 'neutral'
         */
        this.sentiment = 'neutral';
        /**
         * Sets the style variant of the chip.
         * Note: This prop is ignored when sentiment is 'brand'.
         * @defaultValue 'text'
         */
        this.variant = 'text';
        this.handleCloseClick = () => {
            this.pdsTagCloseClick.emit();
        };
    }
    get effectiveSize() {
        if (this.size != null)
            return this.size;
        if (this.large)
            return 'lg';
        return 'md';
    }
    classNames() {
        const classNames = ['pds-chip'];
        const size = this.effectiveSize;
        if (size && size !== 'md') {
            classNames.push('pds-chip--' + size);
        }
        // For brand sentiment, always use text variant
        const effectiveVariant = this.sentiment === 'brand' ? 'text' : this.variant;
        if (effectiveVariant) {
            classNames.push('pds-chip--' + effectiveVariant);
        }
        if (this.sentiment) {
            classNames.push('pds-chip--' + this.sentiment);
        }
        return classNames.join(' ');
    }
    get effectiveVariant() {
        // For brand sentiment, force text variant behavior
        return this.sentiment === 'brand' ? 'text' : this.variant;
    }
    get iconSize() {
        switch (this.effectiveSize) {
            case 'sm': return '10px';
            case 'lg': return '14px';
            default: return '12px';
        }
    }
    setChipContent() {
        const isDropdown = this.effectiveVariant === 'dropdown';
        // For brand sentiment, ignore dot prop
        const showDot = this.sentiment === 'brand' ? false : this.dot;
        const chipContent = isDropdown ? (h("button", { class: "pds-chip__button", type: "button", part: "button" }, this.icon && h("pds-icon", { icon: this.icon, size: this.iconSize, "aria-hidden": "true" }), showDot && h("i", { class: "pds-chip__dot", "aria-hidden": "true" }), h("slot", null), h("pds-icon", { icon: downSmall, size: this.iconSize, "aria-hidden": "true" }))) : (h("span", { class: "pds-chip__label" }, this.icon && h("pds-icon", { icon: this.icon, size: this.iconSize, "aria-hidden": "true" }), showDot && h("i", { class: "pds-chip__dot", "aria-hidden": "true" }), h("slot", null)));
        return chipContent;
    }
    renderCloseButton() {
        const CloseElement = this.removeUrl ? 'a' : 'button';
        const closeAttributes = () => {
            if (this.removeUrl) {
                // Link attributes
                const linkAttrs = {
                    class: 'pds-chip__close',
                    href: this.removeUrl,
                    'aria-label': 'Remove',
                };
                // Add target if specified
                if (this.removeTarget) {
                    linkAttrs.target = this.removeTarget;
                }
                // Add HTTP method attributes if specified
                if (this.removeHttpMethod) {
                    linkAttrs['data-method'] = this.removeHttpMethod;
                    linkAttrs['data-turbo-method'] = this.removeHttpMethod;
                }
                // Build rel attribute by collecting all required values
                const relValues = [];
                // Add noopener noreferrer if target is _blank
                if (this.removeTarget === '_blank') {
                    relValues.push('noopener', 'noreferrer');
                }
                // Add nofollow for non-GET methods (best practice)
                if (this.removeHttpMethod && this.removeHttpMethod !== 'get') {
                    relValues.push('nofollow');
                }
                // Set rel attribute if we have any values
                if (relValues.length > 0) {
                    linkAttrs.rel = relValues.join(' ');
                }
                return linkAttrs;
            }
            // Button attributes
            return {
                class: 'pds-chip__close',
                type: 'button',
                'aria-label': 'Remove',
            };
        };
        return (h(CloseElement, Object.assign({}, closeAttributes(), { onClick: this.handleCloseClick }), h("pds-icon", { icon: remove, size: this.iconSize })));
    }
    render() {
        return (h(Host, { key: '1d75f8ea7583f53191467b568352664ea0313c79', class: this.classNames(), id: this.componentId }, this.setChipContent(), this.effectiveVariant === 'tag' && this.renderCloseButton()));
    }
    static get is() { return "pds-chip"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["pds-chip.tokens.scss", "pds-chip.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pds-chip.tokens.css", "pds-chip.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"
            },
            "dot": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines whether a dot should be displayed on the chip.\nNote: This prop is ignored when sentiment is 'brand'."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "dot",
                "defaultValue": "false"
            },
            "icon": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The name of the icon to display before the chip text."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "icon"
            },
            "large": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }, {
                            "name": "deprecated",
                            "text": "Use `size` prop instead. Set `size=\"lg\"` for the large variant."
                        }],
                    "text": "Determines whether the chip should be displayed in a larger size. DEPRECATED."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "large",
                "defaultValue": "false"
            },
            "size": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ChipSizeType",
                    "resolved": "\"lg\" | \"md\" | \"sm\"",
                    "references": {
                        "ChipSizeType": {
                            "location": "import",
                            "path": "@utils/types",
                            "id": "src/utils/types.ts::ChipSizeType"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "'md'"
                        }],
                    "text": "Sets the size of the chip."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "size"
            },
            "sentiment": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ChipSentimentType",
                    "resolved": "\"accent\" | \"brand\" | \"danger\" | \"info\" | \"neutral\" | \"success\" | \"warning\"",
                    "references": {
                        "ChipSentimentType": {
                            "location": "import",
                            "path": "@utils/types",
                            "id": "src/utils/types.ts::ChipSentimentType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "'neutral'"
                        }],
                    "text": "Defines the color scheme of the chip."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "sentiment",
                "defaultValue": "'neutral'"
            },
            "variant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "ChipVariantType",
                    "resolved": "\"dropdown\" | \"tag\" | \"text\"",
                    "references": {
                        "ChipVariantType": {
                            "location": "import",
                            "path": "@utils/types",
                            "id": "src/utils/types.ts::ChipVariantType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "'text'"
                        }],
                    "text": "Sets the style variant of the chip.\nNote: This prop is ignored when sentiment is 'brand'."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "variant",
                "defaultValue": "'text'"
            },
            "removeUrl": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "URL to navigate to when the remove button is clicked.\nWhen provided, renders the close button as a link instead of a button.\nOnly applies to tag variant."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "remove-url"
            },
            "removeHttpMethod": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'get' | 'post' | 'put' | 'patch' | 'delete'",
                    "resolved": "\"delete\" | \"get\" | \"patch\" | \"post\" | \"put\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "HTTP method to use for the remove action.\nAdds data-method and data-turbo-method attributes for Rails/Turbo compatibility.\nOnly applies when removeUrl is provided."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "remove-http-method"
            },
            "removeTarget": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'_blank' | '_self' | '_parent' | '_top'",
                    "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Specifies where to open the linked document when removeUrl is provided.\nOnly applies when removeUrl is set."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "remove-target"
            }
        };
    }
    static get events() {
        return [{
                "method": "pdsTagCloseClick",
                "name": "pdsTagCloseClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Event emitted when the close button is clicked on a tag variant chip."
                },
                "complexType": {
                    "original": "void",
                    "resolved": "void",
                    "references": {}
                }
            }];
    }
}
//# sourceMappingURL=pds-chip.js.map
