import { Host, h } from "@stencil/core";
import { handle as handleIcon } from "@pine-ds/icons/icons";
/**
 * @slot sortable-item-actions - Content is placed within the `pds-sortable-item__actions` element as children. This slot is only rendered if `actions` is set to `true`.
 */
export class PdsSortableItem {
    constructor() {
        /**
         * Determines whether `sortable-item-actions` slot should be enabled.
         * @defaultValue false
         */
        this.enableActions = false;
        /**
         * Determines whether `sortable-item` should have a handle.
         * @defaultValue false
         */
        this.showHandle = false;
    }
    componentWillRender() {
        // When the parent sortable has a type of 'handle', the sortable items
        // will automatically set showHandle to 'true'.
        this.sortableRef = this.el.closest('pds-sortable');
        if (this.sortableRef && this.sortableRef.handleType === 'handle') {
            this.showHandle = true;
        }
    }
    render() {
        return (h(Host, { key: '631a0c1150226256cdb47d1a7bc6635144bb56d0', class: "pds-sortable-item", id: this.componentId }, this.showHandle && (h("div", { key: 'bdb6ff779a5d750b75d404521bc91cad02176ea8', class: "pds-sortable-item__handle" }, h("pds-icon", { key: '144f4b6fe33a3a3a864ac48041fc93935fbf99c3', icon: handleIcon }))), h("slot", { key: 'cdddce9c5fa3fde34481c41c46c5f6504e33a358' }), this.enableActions && (h("div", { key: '527e1d22f20223a850dbd956dea4db93878fd9f9', class: "pds-sortable-item__actions" }, h("slot", { key: '85ea35dbfdf0393721471dd229e80e9e57f58230', name: "sortable-item-actions" })))));
    }
    static get is() { return "pds-sortable-item"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["pds-sortable-item.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pds-sortable-item.css"]
        };
    }
    static get properties() {
        return {
            "enableActions": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines whether `sortable-item-actions` slot should be enabled."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "enable-actions",
                "defaultValue": "false"
            },
            "componentId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "A unique identifier used for the sortable item `id` attribute."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "component-id"
            },
            "showHandle": {
                "type": "boolean",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines whether `sortable-item` should have a handle."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "show-handle",
                "defaultValue": "false"
            }
        };
    }
    static get elementRef() { return "el"; }
}
//# sourceMappingURL=pds-sortable-item.js.map
