import { r as registerInstance, h, H as Host } from './index-3e697abd.js';

const breadcrumbItemComponentCss = "*{font:inherit;color:inherit;line-height:inherit;text-decoration:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0}*:focus{outline:none}button{background:none;border:none}:host(:last-child) .Breadcrumbs--item{margin-right:0;padding-right:0}:host(:last-child) .Breadcrumbs--item:after{content:none}:host(:last-child) .Breadcrumbs--link{padding-right:0}.Breadcrumbs--item{position:relative;display:inline-block;padding-right:0.5em;margin-right:1em;color:#636363;line-height:1;overflow:hidden;text-overflow:ellipsis;-ms-flex:0 1 auto;flex:0 1 auto}.Breadcrumbs--item:after{content:\"\";position:absolute;font-size:6px;top:50%;width:0.585em;height:0.585em;border-width:1px;border-style:solid none none solid;-webkit-transform-origin:top left;transform-origin:top left;-webkit-transform:rotate(0) translateX(50%) rotate(135deg);transform:rotate(0) translateX(50%) rotate(135deg);right:0;margin-top:0}.Breadcrumbs--item:before{content:\"\";position:absolute;font-size:6px;top:50%;content:none;right:0;margin-top:0}.Breadcrumbs--link{display:inline-block;padding:0.5em 1em 0.5em 0;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;-webkit-transition:color 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);transition:color 0.2s cubic-bezier(0.39, 0.575, 0.565, 1)}.Breadcrumbs--link:active,.Breadcrumbs--link:hover{color:#3C4150}";

const BreadcrumbItem = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        /**
         * Link target
         */
        this.href = '#';
    }
    render() {
        return (h(Host, { "aria-role": "list-item" }, h("div", { class: "Breadcrumbs--item" }, h("a", { class: "Breadcrumbs--link", href: this.href, hrefLang: this.hreflang }, h("slot", null)))));
    }
};
BreadcrumbItem.style = breadcrumbItemComponentCss;

export { BreadcrumbItem as sr_breadcrumb_item };
