import {
  HasSlotController
} from "./chunk.IVMQWO2L.js";
import {
  LocalizeController
} from "./chunk.X3FE7OHE.js";
import {
  SolidElement,
  customElement
} from "./chunk.H53WQBDK.js";
import {
  __decorateClass
} from "./chunk.S3NI7NKU.js";

// src/components/navigation-item/navigation-item.ts
import { css } from "lit";
import { html, literal } from "lit/static-html.js";
import { ifDefined } from "lit/directives/if-defined.js";
import { property, query } from "lit/decorators.js";
import cx from "classix";
var SdNavigationItem = class extends SolidElement {
  constructor() {
    super(...arguments);
    this.hasSlotController = new HasSlotController(this, "[default]", "description", "children");
    this.localize = new LocalizeController(this);
    this.vertical = false;
    this.size = "md";
    this.current = false;
    this.disabled = false;
    this.stacked = false;
    this.chevron = false;
    this.relaxed = false;
    this.divider = false;
    this.indented = false;
    this.open = false;
    this.separated = false;
  }
  get isButton() {
    return !this.href && !this.hasSlotController.test("children");
  }
  get isLink() {
    return !!this.href;
  }
  get isAccordion() {
    return !this.separated && !this.href && this.hasSlotController.test("children");
  }
  get isIconOnly() {
    if (!this.defaultSlot) return false;
    const nodes = this.defaultSlot.assignedNodes({ flatten: true });
    return nodes.length > 0 && nodes.every((node) => {
      var _a;
      if (node.nodeType === Node.TEXT_NODE) {
        return !((_a = node.textContent) == null ? void 0 : _a.trim());
      }
      if (node.nodeType === Node.ELEMENT_NODE) {
        const element = node;
        return element.tagName.toLowerCase() === "sd-6-22-0-icon";
      }
      return false;
    });
  }
  get isStackedHorizontal() {
    return !this.vertical && this.stacked;
  }
  handleClickButton(event) {
    if (this.disabled) {
      event.preventDefault();
      event.stopPropagation();
    }
  }
  handleClickSummary(event) {
    event.preventDefault();
    event.stopPropagation();
    if (!this.disabled) {
      if (this.open) {
        this.hideDetails();
      } else {
        this.showDetails();
      }
    }
  }
  hideDetails() {
    this.open = false;
    this.emit("sd-hide", { cancelable: true });
  }
  showDetails() {
    this.open = true;
    this.emit("sd-show", { cancelable: true });
  }
  get calculatePaddingX() {
    if (this.relaxed && this.indented) return "pl-8 pr-4";
    if (this.relaxed) return "px-4";
    if (this.indented) return "pl-4";
    return "";
  }
  get tag() {
    if (this.separated && !this.isLink) {
      return literal`div`;
    }
    if (this.isAccordion && !this.isLink) {
      return literal`summary`;
    }
    if (this.isLink) {
      return literal`a`;
    }
    return literal`button`;
  }
  focus() {
    var _a;
    if (this.disabled) return;
    (_a = this.button) == null ? void 0 : _a.focus();
  }
  blur() {
    var _a;
    (_a = this.button) == null ? void 0 : _a.blur();
  }
  render() {
    const tag = this.tag;
    const isLink = this.isLink;
    const isButton = this.isButton;
    const isAccordion = this.isAccordion;
    const isIconOnly = this.isIconOnly;
    const slots = {
      label: this.hasSlotController.test("[default]"),
      main: this.hasSlotController.test("main"),
      description: this.hasSlotController.test("description"),
      children: this.hasSlotController.test("children")
    };
    const horizontalPadding = this.vertical ? "py-3" : this.isStackedHorizontal ? "pt-1 pb-1" : "py-2";
    const root = html`<${tag} part="base" class="${cx(
      "flex items-center cursor-pointer relative focus-visible:focus-outline group hover:bg-neutral-200 transition-colors duration-fast ease-in-out min-h-[48px] navigable-border-radius",
      this.isStackedHorizontal ? "text-xs leading-4.5" : { md: "navigable-font-size", lg: "text-lg", sm: "text-[14px]" }[this.size],
      this.disabled ? "text-neutral-500 pointer-events-none" : "sd-6-22-0-navigation-item-color-text",
      this.current && !this.disabled && "sd-6-22-0-navigation-item--current-color-text",
      this.current && !this.isStackedHorizontal && "font-bold",
      !this.current && !this.isStackedHorizontal && "choice-control-font-weight",
      !isAccordion && "w-full",
      this.divider && this.vertical && "mt-0.25",
      !this.vertical && (this.isStackedHorizontal ? "inline-flex flex-col items-center justify-center text-center rounded-full wrap" : "inline-flex items-center"),
      !this.separated && "hover:bg-neutral-200 group transition-colors duration-fast ease-in-out min-h-[48px]",
      isIconOnly ? "justify-center aspect-square p-3" : this.isStackedHorizontal ? "px-8" : "px-4"
    )}" aria-current="${ifDefined(this.current ? "page" : void 0)}" aria-disabled="${this.disabled}" aria-labelledby="content" aria-describedby="description" ?disabled="${ifDefined(isButton ? this.disabled : void 0)}" href="${ifDefined(isLink ? this.href : void 0)}" target="${ifDefined(isLink ? this.target : void 0)}" download="${ifDefined(isLink ? this.download : void 0)}" rel="${ifDefined(isLink && this.target ? "noreferrer noopener" : void 0)}" tabindex="${this.disabled ? "-1" : "0"}" @click="${this.separated ? void 0 : isAccordion ? this.handleClickSummary : isButton ? this.handleClickButton : void 0}"><div part="current-indicator" class="${cx(
      "absolute bg-accent pointer-events-none navigable__current-indicator-border-radius",
      this.vertical ? "navigable__current-indicator-width h-[calc(100%-16px)] top-2 left-0 group-hover:h-full group-hover:top-0" : this.isStackedHorizontal ? "h-[2px] left-6 right-6 bottom-0" : "navigable__current-indicator-height w-[calc(100%-16px)] left-2 bottom-0 group-hover:w-full group-hover:left-0 transition-all",
      this.disabled && "bg-neutral-500"
    )}"></div><div class="${cx(
      "inline-flex justify-center gap-1 w-full h-full",
      this.isStackedHorizontal ? "flex-col items-center" : "flex-col"
    )}"><span part="content-area" class="${cx(
      "relative inline-flex justify-between items-center",
      isAccordion ? "grow" : "w-full",
      this.isStackedHorizontal && "justify-center",
      slots["description"] && "pt-3",
      !slots["description"] && !this.separated && horizontalPadding,
      this.calculatePaddingX
    )}">${this.divider && this.vertical ? html`<sd-6-22-0-divider part="divider" class="${cx("w-full transition-all absolute -top-0.25 left-0", this.calculatePaddingX)}"></sd-6-22-0-divider>` : ""} <span id="content" part="content-container" class="${cx(
      this.vertical ? "inline-flex flex-auto items-center gap-2" : this.isStackedHorizontal ? "inline-flex items-center text-center" : "inline-flex flex-auto flex-col items-center justify-center gap-1 text-center"
    )}"><slot part="content" class="${cx(
      this.vertical ? "inline-flex items-center gap-2" : "inline-flex flex-col items-center justify-center gap-1 text-center"
    )}"></slot></span>${this.chevron || slots["children"] && this.vertical && !this.separated ? html`<sd-6-22-0-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
      "h-6 w-6 ml-2 transition-all",
      isAccordion ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
    )}"></sd-6-22-0-icon>` : ""} </span>${slots["description"] && this.vertical ? html`<slot id="description" name="description" part="description" class="${cx(
      "inline-block text-sm text-left font-normal text-black pb-3",
      isAccordion || this.separated ? "grow" : "w-full",
      this.calculatePaddingX
    )}"></slot>` : ""}</div></${tag}>`;
    if (this.separated) {
      return html`<div part="details" id="navigation-item-details" class="relative flex flex-col"><div class="flex items-start">${root} ${slots["children"] && this.vertical ? html`<button type="button" title="${this.open ? this.localize.term("collapseNavigationItem") : this.localize.term("expandNavigationItem")}" class="sd-interactive sd-interactive--reset -mt-1" @click="${this.handleClickSummary}"><sd-6-22-0-icon name="chevron-down" part="chevron" library="_internal" color="currentColor" class="${cx(
        "m-4 h-6 w-6 transition-all",
        isAccordion || this.separated ? this.open ? "rotate-180" : "rotate-0" : "rotate-[270deg]"
      )}"></sd-6-22-0-icon></button>` : ""}</div>${this.open ? html`<slot name="children"></slot>` : ""}</div>`;
    }
    if (isAccordion) {
      return html`<details aria-expanded="${this.open}" part="details" id="navigation-item-details" ?open="${this.open}" class="relative">${root}<slot name="children"></slot></details>`;
    }
    return html`${root}`;
  }
};
/**
 * Inherits global stylesheet including TailwindCSS
 */
SdNavigationItem.styles = [
  ...SolidElement.styles,
  css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
:host{position:relative;box-sizing:border-box;display:inline-block}:host([vertical]){display:block}:host([stacked]:not([vertical])) ::slotted(sd-6-22-0-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}.sd-6-22-0-navigation-item--current-color-text{color:rgb(var(--sd-navigation-item--current-color-text,var(--sd-navigation-item-color-text)))}details summary::-webkit-details-marker{display:none}[part=current-indicator]{--tw-scale-x:0%;--tw-scale-y:0%;--tw-scale-z:0%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-0);--tw-duration:var(--sd-duration-fast, 150ms);transition-duration:var(--sd-duration-fast,150ms);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,opacity var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out var(--sd-duration-fast)}:host([current]) [part=current-indicator]{--tw-scale-x:100%;--tw-scale-y:100%;--tw-scale-z:100%;scale:var(--tw-scale-x) var(--tw-scale-y);opacity:var(--sd-opacity-100);transition:width var(--sd-duration-fast) ease-in-out,height var(--sd-duration-fast) ease-in-out,left var(--sd-duration-fast) ease-in-out,top var(--sd-duration-fast) ease-in-out,transform var(--sd-duration-fast) ease-in-out}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-duration{syntax:"*";inherits:false}`
];
__decorateClass([
  query('[part="base"]')
], SdNavigationItem.prototype, "button", 2);
__decorateClass([
  query("slot:not([name])")
], SdNavigationItem.prototype, "defaultSlot", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "vertical", 2);
__decorateClass([
  property({ type: String, reflect: true })
], SdNavigationItem.prototype, "size", 2);
__decorateClass([
  property({ reflect: true })
], SdNavigationItem.prototype, "href", 2);
__decorateClass([
  property({ type: String, reflect: true })
], SdNavigationItem.prototype, "target", 2);
__decorateClass([
  property({ reflect: true })
], SdNavigationItem.prototype, "download", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "current", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "disabled", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "stacked", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "chevron", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "relaxed", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "divider", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "indented", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "open", 2);
__decorateClass([
  property({ type: Boolean, reflect: true })
], SdNavigationItem.prototype, "separated", 2);
SdNavigationItem = __decorateClass([
  customElement("sd-6-22-0-navigation-item")
], SdNavigationItem);

export {
  SdNavigationItem
};
