import { c as a } from "../../chunks/runtime.js";
import { css as n, html as l } from "lit";
import { LitElement as c, createEvent as o, safeClassMap as e, nothing as d } from "@arcgis/lumina";
import { createRef as s, ref as r } from "lit/directives/ref.js";
import { Task as p } from "@lit/task";
import { unsafeGetElementDirection as h } from "@arcgis/toolkit/dom";
import { generateGuid as g } from "@arcgis/toolkit/string";
import { i as u } from "../../chunks/commonFunctions.js";
import { C as i } from "../../chunks/resources.js";
/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/5.0/esri/copyright.txt for details.
v5.0.0-next.137 */
const m = n`.arcgis-app-ckeditor-popover-footer{display:flex;justify-content:flex-end;margin-top:var(--calcite-space-sm);padding:0 var(--calcite-space-lg)}.arcgis-app-ckeditor-popover-container{margin:0 var(--calcite-space-md) 0 0;padding-bottom:var(--calcite-space-lg);box-shadow:val(--calcite-shadow-1)}`;
class f extends c {
  constructor() {
    super(), this.okButton = s(), this.popoverNode = s(), this._propWatcherTask = new p(this, {
      task: async ([t]) => {
        if (!u(t)) {
          console.error("[ckeditor5] Required properties are missing.");
          return;
        }
      },
      args: () => [this.refElement]
    }), this.guid = g(), this.intlOk = "Ok", this.intlCancel = "Cancel", this.arcgisCkeditor5PopoverClosed = o(), this.arcgisPopoverClosed = o(), this.listen("arcgisCreated", this.afterEditorCreated), this.listen("arcgisSourceEditingChanged", this.onSourceEditingStatusChanged);
  }
  static {
    this.properties = { guid: 1, refElement: 0, intlOk: 1, intlCancel: 1, intlLabel: 1 };
  }
  static {
    this.styles = m;
  }
  async reposition() {
    this.popoverNode.value?.reposition();
  }
  afterEditorCreated(t) {
    this.editor = t.target, this.reposition(), this.requestUpdate();
  }
  onSourceEditingStatusChanged(t) {
    this.okButton.value && (this.okButton.value.disabled = t.detail);
  }
  render() {
    return this.el.classList.add("js-app-flyout"), this._propWatcherTask.render({
      complete: () => l`<calcite-popover class=${e(i.popover)} dir=${h(this.el) ?? d} placement=leading-start open pointer-disabled .referenceElement=${this.refElement} .offsetDistance=${-Math.round(this.refElement.getBoundingClientRect().width)} offset-skidding=50 .label=${this.intlLabel ?? ""} focus-trap-disabled trigger-disabled ${r(this.popoverNode)}><div class=${e(i.arcgisAppCkeditorPopoverContainer)}><slot></slot><div class=${e(i.arcgisAppCkeditorPopoverFooter)}><calcite-button .label=${this.intlOk} @click=${async (t) => {
        this.okButton.value?.disabled || (t.stopPropagation(), this.arcgisCkeditor5PopoverClosed.emit({
          guid: this.guid,
          data: await this.editor?.getData()
        }), this.arcgisPopoverClosed.emit({
          guid: this.guid,
          data: await this.editor?.getData()
        }));
      }} ${r(this.okButton)}>${this.intlOk}</calcite-button><calcite-button appearance=outline-fill .label=${this.intlCancel} @click=${(t) => {
        t.stopPropagation(), this.arcgisCkeditor5PopoverClosed.emit({ guid: this.guid }), this.arcgisPopoverClosed.emit({ guid: this.guid });
      }}>${this.intlCancel}</calcite-button></div></div></calcite-popover>`
    });
  }
}
a("arcgis-ckeditor5-popover", f);
export {
  f as ArcgisCkeditor5Popover
};
