import { Host, h } from "@stencil/core";
import { copy as copyIcon } from "@pine-ds/icons/icons";
export class PdsCopytext {
    constructor() {
        this.copyToClipboard = async (value) => {
            try {
                if (typeof navigator.clipboard !== 'undefined') {
                    await navigator.clipboard.writeText(value);
                    this.pdsCopyTextClick.emit('Copied to clipboard');
                }
            }
            catch (err) {
                this.pdsCopyTextClick.emit(`Error writing text to clipboard: ${err}`);
            }
        };
        this.handleClick = () => {
            this.copyToClipboard(this.value);
        };
        this.border = true;
        this.componentId = undefined;
        this.fullWidth = false;
        this.truncate = false;
        this.value = undefined;
    }
    classNames() {
        const classNames = ['pds-copytext'];
        if (this.border) {
            classNames.push('pds-copytext--bordered');
        }
        if (this.fullWidth) {
            classNames.push('pds-copytext--full-width');
        }
        if (this.truncate) {
            classNames.push('pds-copytext--truncated');
        }
        return classNames.join('  ');
    }
    render() {
        return (h(Host, { key: '9960146a3ac3810bc14834a976f2e50627569dad', class: this.classNames(), id: this.componentId }, h("pds-button", { key: '9d8c6dc9824be2483982d4362a5c8d8c4c232432', type: "button", variant: "unstyled", onClick: this.handleClick }, h("span", { key: '7c093ec0ae96afdbad02adda3901be87989c9ce4' }, this.value), h("pds-icon", { key: '466f5c685e32be0067938869afee751db522d3d3', icon: copyIcon, size: "16px" }))));
    }
    static get is() { return "pds-copytext"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["pds-copytext.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pds-copytext.css"]
        };
    }
    static get properties() {
        return {
            "border": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "true"
                        }],
                    "text": "Determines whether `copytext` should have a border."
                },
                "attribute": "border",
                "reflect": true,
                "defaultValue": "true"
            },
            "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."
                },
                "attribute": "component-id",
                "reflect": false
            },
            "fullWidth": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines whether `copytext` should expand to the full width of its container."
                },
                "attribute": "full-width",
                "reflect": false,
                "defaultValue": "false"
            },
            "truncate": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines whether the `value` should truncate and display with an ellipsis."
                },
                "attribute": "truncate",
                "reflect": false,
                "defaultValue": "false"
            },
            "value": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "String that is displayed and that is also copied to the clipboard upon interaction."
                },
                "attribute": "value",
                "reflect": false
            }
        };
    }
    static get events() {
        return [{
                "method": "pdsCopyTextClick",
                "name": "pdsCopyTextClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Event when copyText button is clicked."
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }];
    }
}
//# sourceMappingURL=pds-copytext.js.map
