import{breadcrumb_item_styles_default as t}from"./chunk.2DIBQ5MD.js";import{HasSlotController as r}from"./chunk.NYIIDP5N.js";import{ShoelaceElement as e}from"./chunk.Z7XDKKOD.js";import{__decorateClass as s}from"./chunk.6M63UXML.js";import{classMap as a}from"../../../../lit/directives/class-map.js";import{html as i}from"../../../../lit/index.js";import{ifDefined as o}from"../../../../lit/directives/if-defined.js";import{property as l}from"../../../../lit/decorators.js";var m=class extends e{constructor(){super(...arguments),this.hasSlotController=new r(this,"prefix","suffix"),this.rel="noreferrer noopener"}render(){const t=!!this.href;return i`
      <div
        part="base"
        class=${a({"breadcrumb-item":!0,"breadcrumb-item--has-prefix":this.hasSlotController.test("prefix"),"breadcrumb-item--has-suffix":this.hasSlotController.test("suffix")})}
      >
        <span part="prefix" class="breadcrumb-item__prefix">
          <slot name="prefix"></slot>
        </span>

        ${t?i`
              <a
                part="label"
                class="breadcrumb-item__label breadcrumb-item__label--link"
                href="${this.href}"
                target="${o(this.target?this.target:void 0)}"
                rel=${o(this.target?this.rel:void 0)}
              >
                <slot></slot>
              </a>
            `:i`
              <button part="label" type="button" class="breadcrumb-item__label breadcrumb-item__label--button">
                <slot></slot>
              </button>
            `}

        <span part="suffix" class="breadcrumb-item__suffix">
          <slot name="suffix"></slot>
        </span>

        <span part="separator" class="breadcrumb-item__separator" aria-hidden="true">
          <slot name="separator"></slot>
        </span>
      </div>
    `}};m.styles=t,s([l()],m.prototype,"href",2),s([l()],m.prototype,"target",2),s([l()],m.prototype,"rel",2);export{m as SlBreadcrumbItem};