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 _GxIdeBreadcrumb_isItemSelected, _GxIdeBreadcrumb_handleListClick;
import { Host, h } from "@stencil/core";
const CSS_BUNDLES = [
    "resets/box-sizing",
    "components/icon",
    "utils/link",
    "utils/typography",
    "utils/spacing"
];
const DEFAULT_SELECTED_LINK = { link: { url: undefined } };
export class GxIdeBreadcrumb {
    constructor() {
        _GxIdeBreadcrumb_isItemSelected.set(this, (item) => {
            var _a, _b, _c, _d, _e;
            if (!this.selectedLinkIndicator)
                return false;
            const sel = (_a = this.selectedLink) !== null && _a !== void 0 ? _a : DEFAULT_SELECTED_LINK;
            const matchById = sel.id !== undefined && item.id === sel.id;
            const matchByUrl = ((_b = sel.link) === null || _b === void 0 ? void 0 : _b.url) !== undefined &&
                ((_c = sel.link) === null || _c === void 0 ? void 0 : _c.url) !== "" &&
                ((_d = item.link) === null || _d === void 0 ? void 0 : _d.url) === ((_e = sel.link) === null || _e === void 0 ? void 0 : _e.url);
            return matchById || matchByUrl;
        });
        _GxIdeBreadcrumb_handleListClick.set(this, (event) => {
            var _a, _b, _c, _d, _e;
            if (this.disabled)
                return;
            const target = event.target;
            const itemEl = (_a = target.closest) === null || _a === void 0 ? void 0 : _a.call(target, "gx-ide-breadcrumb-item");
            if (!itemEl)
                return;
            const itemId = (_b = itemEl.getAttribute) === null || _b === void 0 ? void 0 : _b.call(itemEl, "data-item-id");
            const hasLink = ((_c = itemEl.getAttribute) === null || _c === void 0 ? void 0 : _c.call(itemEl, "data-has-link")) === "true";
            if (!itemId || !this.model)
                return;
            const item = this.model.find(i => i.id === itemId);
            if (!item)
                return;
            if (hasLink) {
                event.preventDefault();
                (_d = this.hyperlinkClick) === null || _d === void 0 ? void 0 : _d.emit(item);
                return;
            }
            (_e = this.buttonClick) === null || _e === void 0 ? void 0 : _e.emit(item);
        });
        this.model = undefined;
        this.accessibleName = undefined;
        this.disabled = false;
        this.separator = "›";
        this.selectedLink = DEFAULT_SELECTED_LINK;
        this.selectedLinkIndicator = false;
        this.getImagePathCallback = undefined;
    }
    render() {
        var _a, _b;
        const items = (_a = this.model) !== null && _a !== void 0 ? _a : [];
        const separator = this.separator;
        const ariaLabel = (_b = this.accessibleName) !== null && _b !== void 0 ? _b : undefined;
        return (h(Host, { class: "breadcrumb", role: "navigation", "aria-label": ariaLabel }, h("ch-theme", { model: CSS_BUNDLES }), h("ol", { class: "list", onClick: __classPrivateFieldGet(this, _GxIdeBreadcrumb_handleListClick, "f") }, items.map((item, index) => (h("li", { key: item.id, class: "list-item", role: "presentation" }, h("gx-ide-breadcrumb-item", { itemId: item.id, model: item, caption: item.caption, accessibleName: item.accessibleName, disabled: this.disabled || item.disabled, link: item.link, selected: __classPrivateFieldGet(this, _GxIdeBreadcrumb_isItemSelected, "f").call(this, item), selectedLinkIndicator: this.selectedLinkIndicator, startImgSrc: item.startImgSrc, startImgType: item.startImgType, getImagePathCallback: this.getImagePathCallback }), index < items.length - 1 && (h("span", { class: "separator body-regular-s", "aria-hidden": "true" }, separator))))))));
    }
    static get is() { return "gx-ide-breadcrumb"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["breadcrumb.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["breadcrumb.css"]
        };
    }
    static get properties() {
        return {
            "model": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "BreadcrumbModel",
                    "resolved": "BreadcrumbItemModel[]",
                    "references": {
                        "BreadcrumbModel": {
                            "location": "import",
                            "path": "./types",
                            "id": "src/components/breadcrumb/types.ts::BreadcrumbModel"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "List of breadcrumb items to display."
                }
            },
            "accessibleName": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "aria-label for the navigation container (accessible-name attribute)."
                },
                "attribute": "accessible-name",
                "reflect": false
            },
            "disabled": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "When true, disables all interaction with the breadcrumb."
                },
                "attribute": "disabled",
                "reflect": true,
                "defaultValue": "false"
            },
            "separator": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Text shown between items. Examples: \"\u203A\" (recommended), \"/\", \">\", \"\u00B7\", \"\u2022\".\nDefault \"\u203A\" (single right-pointing angle quotation mark, U+203A)."
                },
                "attribute": "separator",
                "reflect": false,
                "defaultValue": "\"\u203A\""
            },
            "selectedLink": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "SelectedLink",
                    "resolved": "SelectedLink",
                    "references": {
                        "SelectedLink": {
                            "location": "import",
                            "path": "./types",
                            "id": "src/components/breadcrumb/types.ts::SelectedLink"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Currently selected link (for highlighting the current page)."
                },
                "defaultValue": "DEFAULT_SELECTED_LINK"
            },
            "selectedLinkIndicator": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "When true, show visual indicator on the item matching selectedLink (selected-link-indicator attribute)."
                },
                "attribute": "selected-link-indicator",
                "reflect": false,
                "defaultValue": "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 each item."
                }
            }
        };
    }
    static get events() {
        return [{
                "method": "hyperlinkClick",
                "name": "hyperlinkClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Fired when the user clicks an item that has a link."
                },
                "complexType": {
                    "original": "BreadcrumbItemModel",
                    "resolved": "BreadcrumbItemModel",
                    "references": {
                        "BreadcrumbItemModel": {
                            "location": "import",
                            "path": "./types",
                            "id": "src/components/breadcrumb/types.ts::BreadcrumbItemModel"
                        }
                    }
                }
            }, {
                "method": "buttonClick",
                "name": "buttonClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Fired when the user clicks an item without a link (button)."
                },
                "complexType": {
                    "original": "BreadcrumbItemModel",
                    "resolved": "BreadcrumbItemModel",
                    "references": {
                        "BreadcrumbItemModel": {
                            "location": "import",
                            "path": "./types",
                            "id": "src/components/breadcrumb/types.ts::BreadcrumbItemModel"
                        }
                    }
                }
            }];
    }
    static get elementRef() { return "el"; }
}
_GxIdeBreadcrumb_isItemSelected = new WeakMap(), _GxIdeBreadcrumb_handleListClick = new WeakMap();
//# sourceMappingURL=breadcrumb.js.map
