/**
 * Copyright IBM Corp. 2026
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

import "../../globals/settings.js";
import { carbonElement } from "../../globals/decorators/carbon-element.js";
import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
import iconLoader from "../../globals/internal/icon-loader.js";
import "../button/button.js";
import content_switcher_item_default from "../content-switcher/content-switcher-item.js";
import "./defs.js";
import tabs_default from "./tabs.scss.js";
import { html } from "lit";
import { property, state } from "lit/decorators.js";
import { classMap } from "lit/directives/class-map.js";
import { ifDefined } from "lit/directives/if-defined.js";
import Close16 from "@carbon/icons/es/close/16.js";
//#region src/components/tabs/tab.ts
/**
* Copyright IBM Corp. 2019, 2026
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
let CDSTab = class CDSTab extends content_switcher_item_default {
	constructor(..._args) {
		super(..._args);
		this.highlighted = false;
		this.type = "";
		this.iconOnly = false;
		this.badgeIndicator = false;
		this._dismissable = false;
		this._index = -1;
	}
	/**
	* Handles `slotchange` event.
	*/
	_handleSlotChange({ target }) {
		const content = target.assignedNodes();
		this.tabTitle = content[0]?.textContent?.trim() || void 0;
	}
	connectedCallback() {
		if (!this.hasAttribute("role")) this.setAttribute("role", "listitem");
		super.connectedCallback();
	}
	render() {
		const navLinkClasses = classMap({
			[`cds--tabs__nav-link`]: true,
			[`cds--tabs__nav-link--dismissable`]: this._dismissable
		});
		const closeButtonClasses = classMap({
			[`cds--tabs__nav-item--close`]: this._dismissable,
			[`cds--tabs__nav-item--close--hidden`]: !this._dismissable
		});
		const { badgeIndicator, disabled, selected, tabTitle, _handleSlotChange: handleSlotChange, _handleClick: handleClick } = this;
		const iconButton = html`
      <cds-button
        title="${this.textContent?.trim() ? `Remove ${this.textContent.trim()} tab` : "Remove tab"}"
        class="${closeButtonClasses}"
        kind="ghost"
        size="xs"
        @click="${handleClick}"
        tab-index="${-1}"
        aria-hidden="${this.selected && this._dismissable ? "false" : "true"}"
        ?disabled="${disabled}">
        ${iconLoader(Close16, {
			"aria-label": "close",
			slot: "icon"
		})}
      </cds-button>
    `;
		const accessibleLabel = tabTitle || this.getAttribute("aria-label");
		const isIconOnly = this.iconOnly || this.classList.contains(`cds--tabs__nav-item--icon-only`);
		const tabLink = html`
      <a
        class="${navLinkClasses}"
        role="tab"
        aria-label="${ifDefined(accessibleLabel || void 0)}"
        tabindex="${selected ? 0 : -1}"
        ?disabled="${disabled}"
        aria-selected="${selected}">
        <span class="${"cds"}--tabs__nav-item-label-wrapper">
          <slot @slotchange="${handleSlotChange}"></slot>
        </span>
        ${!disabled && badgeIndicator ? html`<cds-badge-indicator></cds-badge-indicator>` : ""}
      </a>
      ${iconButton}
    `;
		if (isIconOnly && accessibleLabel && !disabled) return html`
        <cds-tooltip align="bottom" class="${"cds"}--icon-tooltip">
          ${tabLink}
          <cds-tooltip-content>${accessibleLabel}</cds-tooltip-content>
        </cds-tooltip>
      `;
		return tabLink;
	}
	_handleClick(event) {
		event.stopPropagation();
		const init = {
			bubbles: true,
			cancelable: true,
			composed: true,
			detail: { index: this._index }
		};
		if (this.dispatchEvent(new CustomEvent(this.constructor.eventBeforeClose, init))) this.dispatchEvent(new CustomEvent(this.constructor.eventClose, init));
	}
	/**
	* The name of the custom event fired before a tab is closed upon a user gesture.
	* Cancellation of this event stops changing the user-initiated action.
	*/
	static get eventBeforeClose() {
		return `cds-tab-beingclosed`;
	}
	/**
	* The name of the custom event fired after a a tab is closed upon a user gesture.
	*/
	static get eventClose() {
		return `cds-tab-closed`;
	}
	static {
		this.styles = tabs_default;
	}
};
__decorate([property({
	type: Boolean,
	reflect: true
})], CDSTab.prototype, "highlighted", void 0);
__decorate([property({ reflect: true })], CDSTab.prototype, "type", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "icon-only"
})], CDSTab.prototype, "iconOnly", void 0);
__decorate([property({
	attribute: "icon-size",
	reflect: true
})], CDSTab.prototype, "iconSize", void 0);
__decorate([property()], CDSTab.prototype, "tabTitle", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "badge-indicator"
})], CDSTab.prototype, "badgeIndicator", void 0);
__decorate([state()], CDSTab.prototype, "_dismissable", void 0);
__decorate([state()], CDSTab.prototype, "_index", void 0);
CDSTab = __decorate([carbonElement(`cds-tab`)], CDSTab);
var tab_default = CDSTab;
//#endregion
export { tab_default as default };

//# sourceMappingURL=tab.js.map