import { C as _ } from "./button.CAa1kvwe.js";
import { C as u, D as h } from "./dialog.BLaxLMSc.js";
import g from "../components/dropdown.js";
import { C as x } from "./typography.DJC_UXgs.js";
import { n as e, C as b } from "./lib-cortex-element.CVMmyPMC.js";
import { c as y } from "./component.styles.CRO4Odto.js";
import { c as w } from "./custom-element.L4WJXn1j.js";
import { L as $ } from "./i18n.BABe9hN4.js";
import { i as z, x as d } from "./lit-element.jLBm65_O.js";
import { e as m } from "./query.BBf1UFkC.js";
import { e as a } from "./class-map.BiVq-cVR.js";
var f = /* @__PURE__ */ ((t) => (t.Horizontal = "horizontal", t.HorizontalReverse = "horizontal-reverse", t.Vertical = "vertical", t.VerticalReverse = "vertical-reverse", t))(f || {}), v = /* @__PURE__ */ ((t) => (t.Center = "center", t.End = "end", t.Start = "start", t))(v || {});
const S = z`.confirm-popover--dropdown .confirm-popover__dropdown-content{padding:var(--cx-spacing-medium);text-align:center;flex-direction:column;width:max-content;display:flex}.confirm-popover cx-divider{--spacing:var(--cx-spacing-medium)}.confirm-popover .confirm-popover__actions{gap:var(--cx-spacing-medium);display:flex}.confirm-popover--dialog{--width:var(--confirm-popover-dialog-width)}.confirm-popover__actions--direction-horizontal{flex-direction:row}.confirm-popover__actions--direction-horizontal-reverse{flex-direction:row-reverse}.confirm-popover__actions--direction-horizontal.confirm-popover__actions--alignment-end,.confirm-popover__actions--direction-horizontal-reverse.confirm-popover__actions--alignment-start{justify-content:flex-end}.confirm-popover__actions--direction-horizontal.confirm-popover__actions--alignment-start,.confirm-popover__actions--direction-horizontal-reverse.confirm-popover__actions--alignment-end{justify-content:flex-start}.confirm-popover__actions--direction-horizontal.confirm-popover__actions--alignment-center,.confirm-popover__actions--direction-horizontal-reverse.confirm-popover__actions--alignment-center{justify-content:center}.confirm-popover__actions--direction-vertical{flex-direction:column}.confirm-popover__actions--direction-vertical-reverse{flex-direction:column-reverse}.confirm-popover__actions--direction-vertical.confirm-popover__actions--alignment-start,.confirm-popover__actions--direction-vertical-reverse.confirm-popover__actions--alignment-start{align-items:flex-start}.confirm-popover__actions--direction-vertical.confirm-popover__actions--alignment-end,.confirm-popover__actions--direction-vertical-reverse.confirm-popover__actions--alignment-end{align-items:flex-end}.confirm-popover__actions--direction-vertical.confirm-popover__actions--alignment-center,.confirm-popover__actions--direction-vertical-reverse.confirm-popover__actions--alignment-center{align-items:center}.confirm-popover--dropdown .confirm-popover__actions{margin-top:var(--cx-spacing-small);justify-content:center}.confirm-popover__confirm-button{--background-color:var(--confirm-button-background-color,var(--cx-color-danger));--color:var(--confirm-button-color,var(--cx-color-neutral-0))}.confirm-popover__cancel-button{--background-color:var(--cancel-button-background-color,var(--cx-color-primary-500));--color:var(--cancel-button-color,var(--cx-color-neutral-0))}`;
var C = Object.defineProperty, D = Object.getOwnPropertyDescriptor, r = (t, n, s, c) => {
  for (var i = c > 1 ? void 0 : c ? D(n, s) : n, p = t.length - 1, l; p >= 0; p--)
    (l = t[p]) && (i = (c ? l(n, s, i) : l(i)) || i);
  return c && i && C(n, s, i), i;
};
let o = class extends b {
  constructor() {
    super(...arguments), this.localize = new $(this), this.message = "", this.disabled = !1, this.buttonsDirection = f.Horizontal, this.buttonsAlignment = v.End, this.dividerPosition = h.Header, this.dialogLabel = "", this.confirmText = "", this.cancelText = "", this.variant = "dropdown", this.boundary = document.body;
  }
  get open() {
    return this.variant === "dialog" ? this.dialog.open : this.dropdown.open;
  }
  hide() {
    this.variant === "dialog" ? this.dialog.hide() : this.dropdown.hide();
  }
  show() {
    this.variant === "dialog" ? this.dialog.show() : this.dropdown.show();
  }
  confirm() {
    this.emit("cx-confirm").defaultPrevented || this.hide();
  }
  cancel() {
    this.emit("cx-cancel").defaultPrevented || this.hide();
  }
  handleSlotClick() {
    if (this.disabled) {
      this.confirm();
      return;
    }
    this.variant === "dialog" && (this.dialog.open ? this.dialog.hide() : this.dialog.show());
  }
  renderSlot() {
    return d`<slot class="confirm-popover__trigger" name="trigger" slot="trigger" @click=${this.handleSlotClick}></slot>`;
  }
  renderDialog() {
    return d`${this.renderSlot()}<cx-dialog part="dialog" label=${this.dialogLabel || this.localize.term("confirm")} divider-position=${this.dividerPosition} .boundary=${this.boundary} class=${a({
      "confirm-popover": !0,
      "confirm-popover--dialog": !0
    })}><cx-typography variant="body2">${this.message}</cx-typography><div part="actions" class=${a({
      "confirm-popover__actions": !0,
      [`confirm-popover__actions--direction-${this.buttonsDirection}`]: !0,
      [`confirm-popover__actions--alignment-${this.buttonsAlignment}`]: !0
    })} slot="footer"><cx-button part="confirm-button" class="confirm-popover__confirm-button" @click=${this.confirm} variant="custom">${this.confirmText || this.localize.term("confirm")}</cx-button><cx-button part="cancel-button" class="confirm-popover__cancel-button" @click=${this.cancel} variant="custom">${this.cancelText || this.localize.term("cancel")}</cx-button></div><div part="footer" class="confirm-popover__footer"><slot name="footer"></slot></div></cx-dialog>`;
  }
  renderDropdown() {
    return d`<cx-dropdown part="dropdown" class=${a({
      "confirm-popover": !0,
      "confirm-popover--dropdown": !0
    })} no-header ?disabled=${this.disabled} ?hoist=${!this.boundary || this.boundary === document.body}>${this.renderSlot()}<div class="confirm-popover__dropdown-content"><cx-typography variant="body2">${this.message}</cx-typography><div part="actions" class=${a({
      "confirm-popover__actions": !0,
      [`confirm-popover__actions--direction-${this.buttonsDirection}`]: !0
      /** Dropdown variant alignment is always center */
    })} slot="footer"><cx-button part="confirm-button" class="confirm-popover__confirm-button" @click=${this.confirm} variant="custom">${this.confirmText || this.localize.term("confirm")}</cx-button><cx-button part="cancel-button" class="confirm-popover__cancel-button" @click=${this.cancel} variant="custom">${this.cancelText || this.localize.term("cancel")}</cx-button></div><div part="footer" class="confirm-popover__footer" slot="footer"><slot name="footer"></slot></div></div></cx-dropdown>`;
  }
  render() {
    return this.variant === "dialog" ? this.renderDialog() : this.renderDropdown();
  }
};
o.styles = [y, S];
o.dependencies = {
  "cx-button": _,
  "cx-dialog": u,
  "cx-dropdown": g,
  "cx-typography": x
};
r([
  m("cx-dropdown")
], o.prototype, "dropdown", 2);
r([
  m("cx-dialog")
], o.prototype, "dialog", 2);
r([
  e({ reflect: !0, type: String })
], o.prototype, "message", 2);
r([
  e({ reflect: !0, type: Boolean })
], o.prototype, "disabled", 2);
r([
  e({ attribute: "buttons-direction", reflect: !0, type: String })
], o.prototype, "buttonsDirection", 2);
r([
  e({ attribute: "buttons-alignment", reflect: !0, type: String })
], o.prototype, "buttonsAlignment", 2);
r([
  e({ attribute: "divider-position", reflect: !0, type: String })
], o.prototype, "dividerPosition", 2);
r([
  e({ attribute: "dialog-label", reflect: !0, type: String })
], o.prototype, "dialogLabel", 2);
r([
  e({ attribute: "confirm-text", reflect: !0, type: String })
], o.prototype, "confirmText", 2);
r([
  e({ attribute: "cancel-text", reflect: !0, type: String })
], o.prototype, "cancelText", 2);
r([
  e({ reflect: !0 })
], o.prototype, "variant", 2);
r([
  e({ type: Object })
], o.prototype, "boundary", 2);
o = r([
  w("cx-confirm-popover")
], o);
export {
  o as C,
  f as a
};
