var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f)
        throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
        throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var _GxIdeBreadcrumbItem_resolveImageSrc, _GxIdeBreadcrumbItem_getCaption, _GxIdeBreadcrumbItem_getAccessibleName, _GxIdeBreadcrumbItem_renderStartImage;
import { Host, h } from "@stencil/core";
export class GxIdeBreadcrumbItem {
    constructor() {
        _GxIdeBreadcrumbItem_resolveImageSrc.set(this, () => {
            var _a, _b;
            if (this.getImagePathCallback) {
                const result = this.getImagePathCallback(this.model);
                if (result === null || result === void 0 ? void 0 : result.base)
                    return result.base;
            }
            return (_a = this.startImgSrc) !== null && _a !== void 0 ? _a : (_b = this.model) === null || _b === void 0 ? void 0 : _b.startImgSrc;
        });
        _GxIdeBreadcrumbItem_getCaption.set(this, () => { var _a, _b, _c; return (_c = (_a = this.caption) !== null && _a !== void 0 ? _a : (_b = this.model) === null || _b === void 0 ? void 0 : _b.caption) !== null && _c !== void 0 ? _c : ""; });
        _GxIdeBreadcrumbItem_getAccessibleName.set(this, () => {
            var _a, _b, _c, _d;
            return (_d = (_c = (_a = this.accessibleName) !== null && _a !== void 0 ? _a : (_b = this.model) === null || _b === void 0 ? void 0 : _b.accessibleName) !== null && _c !== void 0 ? _c : __classPrivateFieldGet(this, _GxIdeBreadcrumbItem_getCaption, "f").call(this)) !== null && _d !== void 0 ? _d : "";
        });
        _GxIdeBreadcrumbItem_renderStartImage.set(this, () => {
            var _a, _b;
            const src = __classPrivateFieldGet(this, _GxIdeBreadcrumbItem_resolveImageSrc, "f").call(this);
            if (!src)
                return undefined;
            const type = (_a = this.startImgType) !== null && _a !== void 0 ? _a : (_b = this.model) === null || _b === void 0 ? void 0 : _b.startImgType;
            const isUrl = src.trim().toLowerCase().startsWith("url(");
            if (isUrl && (type === "background" || type === "mask")) {
                return (h("span", { class: {
                        "item__img": true,
                        "item__img--background": type === "background",
                        "item__img--mask": type === "mask"
                    }, style: type === "background"
                        ? { backgroundImage: src }
                        : { maskImage: src, WebkitMaskImage: src }, "aria-hidden": "true" }));
            }
            return (h("ch-image", { class: "item__img item__img-icon icon-m", src: src, "aria-hidden": "true" }));
        });
        this.model = undefined;
        this.caption = undefined;
        this.accessibleName = undefined;
        this.disabled = undefined;
        this.link = undefined;
        this.selected = false;
        this.selectedLinkIndicator = false;
        this.startImgSrc = undefined;
        this.startImgType = undefined;
        this.getImagePathCallback = undefined;
        this.itemId = undefined;
    }
    render() {
        var _a, _b, _c, _d, _e;
        const caption = __classPrivateFieldGet(this, _GxIdeBreadcrumbItem_getCaption, "f").call(this);
        const ariaLabel = __classPrivateFieldGet(this, _GxIdeBreadcrumbItem_getAccessibleName, "f").call(this);
        const isDisabled = (_c = (_a = this.disabled) !== null && _a !== void 0 ? _a : (_b = this.model) === null || _b === void 0 ? void 0 : _b.disabled) !== null && _c !== void 0 ? _c : false;
        const hasLink = ((_d = this.link) === null || _d === void 0 ? void 0 : _d.url) !== undefined && ((_e = this.link) === null || _e === void 0 ? void 0 : _e.url) !== "";
        const imgContent = __classPrivateFieldGet(this, _GxIdeBreadcrumbItem_renderStartImage, "f").call(this);
        const captionClass = {
            "caption": true,
            "body-regular-s": !this.selected || !this.selectedLinkIndicator,
            "body-semi-bold-s": this.selected && this.selectedLinkIndicator
        };
        const content = (h("span", { class: "item-content" }, imgContent, caption ? (h("span", { class: captionClass, part: "item-caption" }, caption)) : null));
        const actionClass = {
            "action": true,
            "disabled": isDisabled,
            "selected": this.selected && this.selectedLinkIndicator,
            "not-selected": !this.selected
        };
        if (hasLink && !isDisabled) {
            return (h(Host, { role: "listitem", "data-item-id": this.itemId, "data-has-link": "true", part: "item-action item-link" }, h("a", { class: Object.assign(Object.assign({}, actionClass), { "link-primary": true }), href: this.link.url, "aria-current": this.selected ? "page" : undefined, "aria-label": ariaLabel || undefined, part: "item-link" }, content)));
        }
        if (hasLink && isDisabled) {
            return (h(Host, { role: "listitem", "data-item-id": this.itemId, "data-has-link": "true", part: "item-action disabled" }, h("span", { class: actionClass, "aria-disabled": "true", "aria-label": ariaLabel || undefined, part: "item-link disabled" }, content)));
        }
        return (h(Host, { role: "listitem", "data-item-id": this.itemId, "data-has-link": "false", part: "item-action item-button" }, h("button", { type: "button", class: actionClass, disabled: isDisabled, "aria-label": ariaLabel || undefined, part: "item-button" }, content)));
    }
    static get is() { return "gx-ide-breadcrumb-item"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["breadcrumb-item.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["breadcrumb-item.css"]
        };
    }
    static get properties() {
        return {
            "model": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "BreadcrumbItemModel",
                    "resolved": "BreadcrumbItemModel",
                    "references": {
                        "BreadcrumbItemModel": {
                            "location": "import",
                            "path": "../types",
                            "id": "src/components/breadcrumb/types.ts::BreadcrumbItemModel"
                        }
                    }
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Model of the item (used for image resolution and data)."
                }
            },
            "caption": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Visible text. Falls back to model.caption when not set."
                },
                "attribute": "caption",
                "reflect": false
            },
            "accessibleName": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "aria-label for the item. Falls back to accessibleName or caption when not set."
                },
                "attribute": "accessible-name",
                "reflect": false
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Whether the item is disabled."
                },
                "attribute": "disabled",
                "reflect": false
            },
            "link": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "ItemLink",
                    "resolved": "ItemLink",
                    "references": {
                        "ItemLink": {
                            "location": "import",
                            "path": "../types",
                            "id": "src/components/breadcrumb/types.ts::ItemLink"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "When set, the item renders as an anchor; otherwise as a button."
                }
            },
            "selected": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Whether this item is the current page (selected)."
                },
                "attribute": "selected",
                "reflect": false,
                "defaultValue": "false"
            },
            "selectedLinkIndicator": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Whether to show visual indicator when selected is true."
                },
                "attribute": "selected-link-indicator",
                "reflect": false,
                "defaultValue": "false"
            },
            "startImgSrc": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Image source (URL or CSS url())."
                },
                "attribute": "start-img-src",
                "reflect": false
            },
            "startImgType": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "\"background\" | \"mask\"",
                    "resolved": "\"background\" | \"mask\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "How to render the start image: \"background\" or \"mask\"."
                },
                "attribute": "start-img-type",
                "reflect": false
            },
            "getImagePathCallback": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "GetImagePathCallback",
                    "resolved": "(item: BreadcrumbItemModel) => GxImageMultiState",
                    "references": {
                        "GetImagePathCallback": {
                            "location": "import",
                            "path": "../types",
                            "id": "src/components/breadcrumb/types.ts::GetImagePathCallback"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Optional callback to resolve image path for this item."
                }
            },
            "itemId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Item id used by the container for click delegation (data-item-id)."
                },
                "attribute": "item-id",
                "reflect": false
            }
        };
    }
}
_GxIdeBreadcrumbItem_resolveImageSrc = new WeakMap(), _GxIdeBreadcrumbItem_getCaption = new WeakMap(), _GxIdeBreadcrumbItem_getAccessibleName = new WeakMap(), _GxIdeBreadcrumbItem_renderStartImage = new WeakMap();
//# sourceMappingURL=breadcrumb-item.js.map
