/**
 * 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 FocusMixin from "../../globals/mixins/focus.js";
import HostListener from "../../globals/decorators/host-listener.js";
import HostListenerMixin from "../../globals/mixins/host-listener.js";
import { TAG_SIZE, TAG_TYPE } from "./defs.js";
import tag_default$1 from "./tag.scss.js";
import { LitElement, html } from "lit";
import { property, query, state } from "lit/decorators.js";
import Close16 from "@carbon/icons/es/close/16.js";
//#region src/components/tag/tag.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.
*/
/**
* Tag.
* @element cds-custom-tag
* @fires cds-custom-tag-beingclosed - The custom event fired as the element is being closed
* @fires cds-custom-tag-closed - The custom event fired after the element has been closed
*/
let CDSTag = class CDSTag extends HostListenerMixin(FocusMixin(LitElement)) {
	constructor(..._args) {
		super(..._args);
		this._handleClick = (event) => {
			if (event.composedPath().indexOf(this._buttonNode) >= 0) {
				if (this.disabled) event.stopPropagation();
				else if (this.open) {
					const init = {
						bubbles: true,
						cancelable: true,
						composed: true,
						detail: { triggeredBy: event.target }
					};
					if (this.dispatchEvent(new CustomEvent(this.constructor.eventBeforeClose, init))) {
						this.open = false;
						this.dispatchEvent(new CustomEvent(this.constructor.eventClose, init));
					}
				}
			}
		};
		this.title = "Clear filter";
		this.disabled = false;
		this.filter = false;
		this.hasCustomIcon = false;
		this.open = true;
		this.size = "md";
		this.type = "gray";
		this._hasEllipsisApplied = false;
	}
	/**
	* Handles `slotchange` event.
	*/
	_handleAILabelSlotChange({ target }) {
		const hasContent = target.assignedNodes().filter((elem) => elem.matches !== void 0 ? elem.matches(this.constructor.aiLabelItem) || elem.matches(this.constructor.slugItem) : false);
		if (hasContent.length > 0) {
			hasContent[0].setAttribute("tag", `${this.type}`);
			hasContent[0].setAttribute("size", "sm");
			hasContent[0].setAttribute("kind", "inline");
		}
		this.requestUpdate();
	}
	/**
	* Handles `slotchange` event.
	*/
	_handleIconSlotChange({ target }) {
		const hasIcon = target.assignedNodes();
		this.hasCustomIcon = hasIcon.length > 0;
		this.requestUpdate();
	}
	updated() {
		const textContainer = this.shadowRoot?.querySelector(`.cds-custom--tag__label`);
		if (!textContainer || this._hasEllipsisApplied === true) return;
		this._hasEllipsisApplied = textContainer.scrollWidth > textContainer.clientWidth;
		const root = this.getRootNode();
		if (root instanceof ShadowRoot) {
			const parent = root.host.tagName.toLowerCase();
			if (parent === `cds-custom-selectable-tag` || parent === `cds-custom-operational-tag`) {
				this.setAttribute("role", "button");
				this.tabIndex = this.disabled ? -1 : 0;
			}
		}
	}
	render() {
		const { disabled, filter, _handleAILabelSlotChange: handleAILabelSlotChange, _handleIconSlotChange: handleIconSlotChange, size, title } = this;
		return html`
      ${size !== "sm" ? html`<slot name="icon" @slotchange="${handleIconSlotChange}"></slot>` : ""}
      <span class="${"cds-custom"}--tag__label">
        <slot></slot>
      </span>
      <slot name="decorator" @slotchange="${handleAILabelSlotChange}"></slot>
      <slot name="ai-label" @slotchange="${handleAILabelSlotChange}"></slot>
      <slot name="slug" @slotchange="${handleAILabelSlotChange}"></slot>
      ${filter ? html`
            <button class="${"cds-custom"}--tag__close-icon" ?disabled=${disabled}>
              ${iconLoader(Close16, { "aria-label": title })}
            </button>
          ` : ``}
    `;
	}
	/**
	* A selector that will return the slug item.
	*
	* remove in v12
	*/
	static get slugItem() {
		return `cds-custom-slug`;
	}
	/**
	* A selector that will return the AI Label item.
	*/
	static get aiLabelItem() {
		return `cds-custom-ai-label`;
	}
	/**
	* The name of the custom event fired before this tag is being closed upon a user gesture.
	* Cancellation of this event stops the user-initiated action of closing this tag.
	*/
	static get eventBeforeClose() {
		return `cds-custom-tag-beingclosed`;
	}
	/**
	* The name of the custom event fired after this tag is closed upon a user gesture.
	*/
	static get eventClose() {
		return `cds-custom-tag-closed`;
	}
	static {
		this.styles = tag_default$1;
	}
};
__decorate([query("button")], CDSTag.prototype, "_buttonNode", void 0);
__decorate([HostListener("shadowRoot:click")], CDSTag.prototype, "_handleClick", void 0);
__decorate([property({ type: String })], CDSTag.prototype, "title", void 0);
__decorate([property({
	type: Boolean,
	reflect: true
})], CDSTag.prototype, "disabled", void 0);
__decorate([property({
	type: Boolean,
	reflect: true
})], CDSTag.prototype, "filter", void 0);
__decorate([property({
	type: Boolean,
	attribute: "has-custom-icon",
	reflect: true
})], CDSTag.prototype, "hasCustomIcon", void 0);
__decorate([property({
	type: Boolean,
	reflect: true
})], CDSTag.prototype, "open", void 0);
__decorate([property({ reflect: true })], CDSTag.prototype, "size", void 0);
__decorate([property({ reflect: true })], CDSTag.prototype, "type", void 0);
__decorate([state()], CDSTag.prototype, "_hasEllipsisApplied", void 0);
CDSTag = __decorate([carbonElement(`cds-custom-tag`)], CDSTag);
var tag_default = CDSTag;
//#endregion
export { TAG_SIZE, TAG_TYPE, tag_default as default };

//# sourceMappingURL=tag.js.map