var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
  return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { h } from '@stencil/core';
import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
import { DomNodeSubjectObserverFactory } from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
import { VegaClick, VegaPopoverHide, VegaPopoverShow, } from '../../../../../helpers/event-manager/event-id/vega-event-id';
import { VegaInternalComponentDidRender, VegaInternalPopoverUpdateTarget, } from '../../../../../helpers/event-manager/event-id/vega-internal-event-id';
import domNodeSubjectFactory from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
import ChangeManager from '../../../../../helpers/change-manager/change-manager';
import remoteInvocationRegistry from '../../../../../helpers/remote-invocation/remote-invocation-registry';
export class VegaRichTextLinkEditorRenderer extends VegaSlimmer {
  constructor() {
    super(...arguments);
    this.handleKeyDown = (e) => {
      if (e.key === 'Enter') {
        void this.formRef.getValue().then(({ text, url }) => {
          if (url.length > 0) {
            this.changeEventEmitter.emit({
              action: 'link',
              payload: { text: text || url, url },
            });
            void this.popoverRef.hide();
          }
        });
      }
    };
  }
  /**
   * Component lifecycle - [componentDidLoad]{@link VegaRichTextLinkEditor.componentDidLoad}
   */
  componentDidLoad() {
    this.updatePopoverTarget();
  }
  /**
   * Component lifecycle - [componentDidRender]{@link VegaRichTextLinkEditor.componentDidRender}
   */
  componentDidRender() {
    ChangeManager.notify(domNodeSubjectFactory.getSubject(this.host, VegaInternalComponentDidRender), {});
  }
  watchStatusChange() {
    if (this.status === 'linkEdit') {
      setTimeout(() => {
        void this.urlInputRef.doFocus();
      });
    }
  }
  watchTargetChange() {
    this.updatePopoverTarget();
  }
  getPopoverRef() {
    return this.popoverRef;
  }
  render() {
    return (h("vega-popover", { trigger: "click", alignment: "start", placement: "bottom", showArrow: false, ref: (ref) => {
        this.popoverRef = ref;
        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverShow, () => {
          var _a, _b;
          if (this.status === 'linkEdit') {
            void this.urlInputRef.doFocus();
          }
          void this.formRef.setValue({
            text: (_a = this.record) === null || _a === void 0 ? void 0 : _a.text,
            url: (_b = this.record) === null || _b === void 0 ? void 0 : _b.url,
          });
        });
        DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaPopoverHide, () => {
          void this.formRef.reset();
          if (this.resetStatusAfterHide) {
            this.status = 'editOrUnlinkSelection';
          }
        });
      } },
      h("span", { slot: "popover-content" },
        h("slot", null)),
      h("div", { slot: "popover" },
        this.renderLinkUnlinkContent(),
        this.renderLinkEditContent())));
  }
  renderLinkUnlinkContent() {
    return (h("vega-box", { display: this.status === 'editOrUnlinkSelection' ? 'block' : 'none' },
      h("vega-button-group", { size: "small", variant: "tertiary", ref: (node) => {
          DomNodeSubjectObserverFactory.addUniqueObserverToNode(node, VegaClick, ({ detail }) => {
            switch (detail) {
              case 'edit': {
                this.status = 'linkEdit';
                return;
              }
              case 'unlink': {
                this.changeEventEmitter.emit({ action: 'unlink' });
                void this.popoverRef.hide();
              }
            }
          });
        } },
        h("vega-button-group-item", { label: this.translationSlimmer.t('Edit'), itemKey: "edit" }),
        h("vega-button-group-item", { label: this.translationSlimmer.t('Unlink'), itemKey: "unlink" }))));
  }
  renderLinkEditContent() {
    return (h("vega-box", { display: this.status === 'linkEdit' ? 'block' : 'none' },
      h("vega-form", { ref: (ref) => (this.formRef = ref) },
        h("vega-flex", { style: { width: '419px' }, direction: "col", gap: "size-16" },
          h("vega-input", { "data-vega-form": "url", ref: (ref) => {
              this.urlInputRef = ref;
            }, size: "small", label: this.translationSlimmer.t('URL'), onKeyDown: this.handleKeyDown }),
          h("vega-input", { size: "small", label: this.translationSlimmer.t('Text'), "data-vega-form": "text", onKeyDown: this.handleKeyDown })))));
  }
  updatePopoverTarget() {
    remoteInvocationRegistry.call(domNodeSubjectFactory.getSubject(this.popoverRef, VegaInternalPopoverUpdateTarget), this.target);
  }
}
__decorate([
  MapToComponentField()
], VegaRichTextLinkEditorRenderer.prototype, "host", void 0);
__decorate([
  MapToComponentField({ writable: true })
], VegaRichTextLinkEditorRenderer.prototype, "status", void 0);
__decorate([
  MapToComponentField({ writable: true })
], VegaRichTextLinkEditorRenderer.prototype, "record", void 0);
__decorate([
  MapToComponentField()
], VegaRichTextLinkEditorRenderer.prototype, "changeEventEmitter", void 0);
__decorate([
  MapToComponentField()
], VegaRichTextLinkEditorRenderer.prototype, "resetStatusAfterHide", void 0);
__decorate([
  MapToComponentField()
], VegaRichTextLinkEditorRenderer.prototype, "translationSlimmer", void 0);
__decorate([
  MapToComponentField()
], VegaRichTextLinkEditorRenderer.prototype, "target", void 0);
__decorate([
  MapToComponentMethod('componentDidLoad')
], VegaRichTextLinkEditorRenderer.prototype, "componentDidLoad", null);
__decorate([
  MapToComponentMethod('componentDidRender')
], VegaRichTextLinkEditorRenderer.prototype, "componentDidRender", null);
__decorate([
  MapToComponentMethod('watchStatusChange')
], VegaRichTextLinkEditorRenderer.prototype, "watchStatusChange", null);
__decorate([
  MapToComponentMethod('watchTargetChange')
], VegaRichTextLinkEditorRenderer.prototype, "watchTargetChange", null);
