import { unsafeCSS, LitElement, nothing, html } from "lit";
import { property } from "lit/decorators.js";
import { customElement } from "../../decorator.js";
import componentStyle from "./form-footer-container.css.js";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __decorateClass = (decorators, target, key, kind) => {
  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
    if (decorator = decorators[i])
      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
  if (kind && result) __defProp(target, key, result);
  return result;
};
let ObcFormFooterContainer = class extends LitElement {
  constructor() {
    super(...arguments);
    this.hasActions = false;
    this.boundActionElements = /* @__PURE__ */ new Set();
    this.syncActionElementListeners = () => {
      for (const action of this.boundActionElements) {
        action.removeEventListener("click", this.handleAssignedActionClick);
      }
      this.boundActionElements.clear();
      if (!this.hasActions) return;
      for (const action of this.resolvedActionElements) {
        action.addEventListener("click", this.handleAssignedActionClick);
        this.boundActionElements.add(action);
      }
    };
    this.handleAssignedActionClick = (event) => {
      const actionElement = event.currentTarget;
      if (!(actionElement instanceof HTMLElement)) return;
      const actions = this.resolvedActionElements;
      const actionIndex = actions.indexOf(actionElement);
      if (actionIndex === -1) return;
      this.dispatchAction(actionIndex + 1);
    };
  }
  get resolvedActionElements() {
    const slot = this.renderRoot.querySelector("slot");
    if (!slot) return [];
    return slot.assignedElements({ flatten: true }).filter((el) => el instanceof HTMLElement);
  }
  dispatchAction(action) {
    this.dispatchEvent(
      new CustomEvent("action-click", {
        detail: { action },
        bubbles: true,
        composed: true
      })
    );
  }
  updated(changedProperties) {
    super.updated(changedProperties);
    if (changedProperties.has("hasActions")) {
      this.syncActionElementListeners();
    }
  }
  disconnectedCallback() {
    super.disconnectedCallback();
    for (const action of this.boundActionElements) {
      action.removeEventListener("click", this.handleAssignedActionClick);
    }
    this.boundActionElements.clear();
  }
  render() {
    return html`
      <div class="wrapper" part="wrapper">
        ${this.hasActions ? html`
              <div class="actions" part="actions">
                <slot @slotchange=${this.syncActionElementListeners}></slot>
              </div>
            ` : nothing}
      </div>
    `;
  }
};
ObcFormFooterContainer.styles = unsafeCSS(componentStyle);
__decorateClass([
  property({ type: Boolean, attribute: "has-actions" })
], ObcFormFooterContainer.prototype, "hasActions", 2);
ObcFormFooterContainer = __decorateClass([
  customElement("obc-form-footer-container")
], ObcFormFooterContainer);
export {
  ObcFormFooterContainer
};
//# sourceMappingURL=form-footer-container.js.map
