/**
 * 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 { TABLE_SORT_CYCLE, TABLE_SORT_CYCLES, TABLE_SORT_DIRECTION } from "./defs.js";
import data_table_default from "./data-table.scss.js";
import { LitElement, html } from "lit";
import { property } from "lit/decorators.js";
import { classMap } from "lit/directives/class-map.js";
import ArrowsVertical32 from "@carbon/icons/es/arrows--vertical/32.js";
import ArrowDown32 from "@carbon/icons/es/arrow--down/32.js";
//#region src/components/data-table/table-header-cell.ts
/**
* Copyright IBM Corp. 2019, 2024
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* Data table header cell.
*
* @element cds-custom-table-header-cell
* @fires cds-custom-table-header-cell-sort
*   The custom event fired before a new sort direction is set upon a user gesture.
*   Cancellation of this event stops the user-initiated change in sort direction.
*/
let CDSTableHeaderCell = class CDSTableHeaderCell extends FocusMixin(LitElement) {
	constructor(..._args) {
		super(..._args);
		this._hasAILabel = false;
		this.isExpandable = false;
		this.isSelectable = false;
		this.isSortable = false;
		this.sortActive = false;
	}
	/**
	* Handles `click` event on the sort button.
	*
	*/
	_handleClickSortButton(event) {
		if (!event.target.matches(this.constructor.aiLabelItem) && !event.target.matches(this.constructor.slugItem)) {
			const nextSortDirection = this._getNextSort();
			const init = {
				bubbles: true,
				cancelable: true,
				composed: true,
				detail: {
					oldSortDirection: this.sortDirection,
					sortDirection: nextSortDirection
				}
			};
			const constructor = this.constructor;
			if (this.dispatchEvent(new CustomEvent(constructor.eventBeforeSort, init))) {
				this.sortActive = true;
				this.sortDirection = nextSortDirection;
			}
		}
	}
	/**
	* Handles `slotchange` event.
	*
	*/
	_handleSlotChange() {
		this.requestUpdate();
	}
	/**
	* 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) {
			this._hasAILabel = Boolean(hasContent);
			hasContent[0].setAttribute("size", "mini");
		}
		this.requestUpdate();
	}
	/**
	* @returns The next sort direction.
	*/
	_getNextSort() {
		const { sortCycle = "tri-states-from-ascending", sortDirection } = this;
		if (!sortDirection) throw new TypeError("Table sort direction is not defined. Likely that `_getNextSort()` is called with non-sorted table column, which should not happen in regular condition.");
		const directions = this.constructor.TABLE_SORT_CYCLES[sortCycle];
		const index = directions.indexOf(sortDirection);
		if (index < 0) {
			if (sortDirection === "none") return directions[0];
			throw new RangeError(`The given sort state (${sortDirection}) is not found in the given table sort cycle: ${sortCycle}`);
		}
		return directions[(index + 1) % directions.length];
	}
	/**
	* TODO: Uncomment when Carbon fully implements sticky header
	* Specify whether the header should be sticky.
	* Still experimental: may not work with every combination of table props
	*/
	connectedCallback() {
		if (!this.hasAttribute("role")) this.setAttribute("role", "columnheader");
		super.connectedCallback();
	}
	updated(changedProperties) {
		if (this.isSortable && !changedProperties.has("sortDirection") && !this.sortDirection) this.sortDirection = "none";
		if (this._hasAILabel) this.setAttribute("ai-label", "");
		else this.removeAttribute("ai-label");
	}
	render() {
		const { sortDirection } = this;
		const labelClasses = classMap({
			[`cds-custom--table-header-label`]: true,
			[`cds-custom--table-header-label--slug`]: this._hasAILabel
		});
		if (sortDirection) {
			const sortIcon = sortDirection === "none" ? iconLoader(ArrowsVertical32, {
				part: "sort-icon",
				class: `cds-custom--table-sort__icon-unsorted`
			}) : iconLoader(ArrowDown32, {
				part: "sort-icon",
				class: `cds-custom--table-sort__icon`
			});
			return html`
        <button
          part="sort-button"
          class="${"cds-custom"}--table-sort"
          title="${this.innerText}"
          @click=${this._handleClickSortButton}>
          <span class="${"cds-custom"}--table-sort__flex">
            <span part="label-text" class="${"cds-custom"}--table-header-label"
              ><slot @slotchange=${this._handleSlotChange}></slot
            ></span>
            ${sortIcon}
            <slot
              name="ai-label"
              @slotchange="${this._handleAILabelSlotChange}"></slot>
            <slot
              name="slug"
              @slotchange="${this._handleAILabelSlotChange}"></slot>
          </span>
        </button>
      `;
		}
		return html`<span part="label-text" class="${labelClasses}">
      <slot></slot
      ><slot
        name="ai-label"
        @slotchange="${this._handleAILabelSlotChange}"></slot>
      <slot name="slug" @slotchange="${this._handleAILabelSlotChange}"></slot
    ></span> `;
	}
	/**
	* 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 a new sort direction is set upon a user gesture.
	* Cancellation of this event stops the user-initiated change in sort direction.
	*/
	static get eventBeforeSort() {
		return `cds-custom-table-header-cell-sort`;
	}
	static {
		this.shadowRootOptions = {
			...LitElement.shadowRootOptions,
			delegatesFocus: true
		};
	}
	static {
		this.styles = data_table_default;
	}
	static {
		this.TABLE_SORT_CYCLES = TABLE_SORT_CYCLES;
	}
};
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "expandable"
})], CDSTableHeaderCell.prototype, "isExpandable", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "is-selectable"
})], CDSTableHeaderCell.prototype, "isSelectable", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "is-sortable"
})], CDSTableHeaderCell.prototype, "isSortable", void 0);
__decorate([property({
	type: Boolean,
	reflect: true,
	attribute: "sort-active"
})], CDSTableHeaderCell.prototype, "sortActive", void 0);
__decorate([property({
	reflect: true,
	attribute: "sort-cycle"
})], CDSTableHeaderCell.prototype, "sortCycle", void 0);
__decorate([property({
	reflect: true,
	attribute: "sort-direction"
})], CDSTableHeaderCell.prototype, "sortDirection", void 0);
CDSTableHeaderCell = __decorate([carbonElement(`cds-custom-table-header-cell`)], CDSTableHeaderCell);
var table_header_cell_default = CDSTableHeaderCell;
//#endregion
export { TABLE_SORT_CYCLE, TABLE_SORT_CYCLES, TABLE_SORT_DIRECTION, table_header_cell_default as default };

//# sourceMappingURL=table-header-cell.js.map