import {
  __decorateClass,
  __privateAdd,
  __privateGet,
  __privateMethod
} from "../../chunks/chunk.QU3DSPNU.js";
var _handleSlotChange, _GdsFieldBase_instances, renderFieldContents_fn, renderSlotLead_fn, renderSlotMain_fn, renderSlotAction_fn, renderSlotTrail_fn;
import { localized } from "@lit/localize";
import { property, query, state } from "lit/decorators.js";
import { classMap } from "lit/directives/class-map.js";
import { GdsElement } from "../../gds-element.js";
import { gdsCustomElement, html } from "../../scoping.js";
import { TransitionalStyles } from "../../transitional-styles.js";
import { watch } from "../../utils/decorators/watch.js";
import FieldBaseStyles from "./field-base.styles.js";
let GdsFieldBase = class extends GdsElement {
  constructor() {
    super();
    __privateAdd(this, _GdsFieldBase_instances);
    this.size = "large";
    this.multiline = false;
    this.disabled = false;
    this.invalid = false;
    this._leadSlotOccupied = false;
    this._leadHasBadge = false;
    this._trailSlotOccupied = false;
    this._actionSlotOccupied = false;
    __privateAdd(this, _handleSlotChange, (slotName, event) => {
      const slot = event.target;
      const assignedNodes = slot.assignedNodes({ flatten: true });
      const slotOccupied = assignedNodes.length > 0 && assignedNodes.some(
        (node) => node.nodeType === Node.ELEMENT_NODE || node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== ""
      );
      if (slotName === "lead") {
        this._leadSlotOccupied = slotOccupied;
        this._leadHasBadge = slotOccupied && assignedNodes.some(
          (node) => node.getAttribute?.("gds-element") === "gds-badge"
        );
      } else if (slotName === "trail") {
        this._trailSlotOccupied = slotOccupied;
      } else if (slotName === "action") {
        this._actionSlotOccupied = slotOccupied;
      } else if (slotName === "main") {
      }
    });
  }
  connectedCallback() {
    super.connectedCallback();
    TransitionalStyles.instance.apply(this, "gds-field-base");
  }
  render() {
    const classes = {
      invalid: this.invalid ?? false,
      multiline: this.multiline,
      disabled: this.disabled,
      "lead-slot-occupied": this._leadSlotOccupied,
      "lead-has-badge": this._leadHasBadge,
      "trail-slot-occupied": this._trailSlotOccupied,
      "action-slot-occupied": this._actionSlotOccupied,
      small: this.size === "small"
    };
    return html`
      <div class="field ${classMap(classes)}" part="_base">
        ${__privateMethod(this, _GdsFieldBase_instances, renderFieldContents_fn).call(this)}
      </div>
    `;
  }
  _handleDisabledChange() {
    if (this.disabled) {
      this.setAttribute("inert", "");
    } else {
      this.removeAttribute("inert");
    }
  }
};
_handleSlotChange = new WeakMap();
_GdsFieldBase_instances = new WeakSet();
renderFieldContents_fn = function() {
  const rightSlotsWrapClasses = {
    right: true,
    "as-flex": this.multiline && (this._trailSlotOccupied || this._actionSlotOccupied)
  };
  return html`
      ${__privateMethod(this, _GdsFieldBase_instances, renderSlotLead_fn).call(this)} ${__privateMethod(this, _GdsFieldBase_instances, renderSlotMain_fn).call(this)}
      <div class="${classMap(rightSlotsWrapClasses)}">
        ${__privateMethod(this, _GdsFieldBase_instances, renderSlotAction_fn).call(this)} ${__privateMethod(this, _GdsFieldBase_instances, renderSlotTrail_fn).call(this)}
      </div>
    `;
};
renderSlotLead_fn = function() {
  return html` <slot
      name="lead"
      @slotchange=${(e) => __privateGet(this, _handleSlotChange).call(this, "lead", e)}
    ></slot>`;
};
renderSlotMain_fn = function() {
  return html`<div
      class="main-slot-wrap ${classMap({ multiline: this.multiline })}"
    >
      <slot
        @slotchange=${(e) => __privateGet(this, _handleSlotChange).call(this, "main", e)}
      ></slot>
    </div>`;
};
renderSlotAction_fn = function() {
  return html`
      <slot
        name="action"
        @slotchange=${(e) => __privateGet(this, _handleSlotChange).call(this, "action", e)}
      ></slot>
    `;
};
renderSlotTrail_fn = function() {
  return html`
      <slot
        name="trail"
        @slotchange=${(e) => __privateGet(this, _handleSlotChange).call(this, "trail", e)}
      ></slot>
    `;
};
GdsFieldBase.styles = [FieldBaseStyles];
__decorateClass([
  property()
], GdsFieldBase.prototype, "size", 2);
__decorateClass([
  property({ type: Boolean })
], GdsFieldBase.prototype, "multiline", 2);
__decorateClass([
  property({
    type: Boolean,
    reflect: true
  })
], GdsFieldBase.prototype, "disabled", 2);
__decorateClass([
  property({ type: Boolean })
], GdsFieldBase.prototype, "invalid", 2);
__decorateClass([
  query("slot:not([name])")
], GdsFieldBase.prototype, "_mainSlotElement", 2);
__decorateClass([
  state()
], GdsFieldBase.prototype, "_leadSlotOccupied", 2);
__decorateClass([
  state()
], GdsFieldBase.prototype, "_leadHasBadge", 2);
__decorateClass([
  state()
], GdsFieldBase.prototype, "_trailSlotOccupied", 2);
__decorateClass([
  state()
], GdsFieldBase.prototype, "_actionSlotOccupied", 2);
__decorateClass([
  watch("disabled")
], GdsFieldBase.prototype, "_handleDisabledChange", 1);
GdsFieldBase = __decorateClass([
  gdsCustomElement("gds-field-base"),
  localized()
], GdsFieldBase);
export {
  GdsFieldBase
};
