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 { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
import { Fragment, h } from '@stencil/core';
import { getCalendarEventSlotName, getEventStatusBgColorStyle } from '../../../utils';
import ChangeManager from '../../../../../helpers/change-manager/change-manager';
import { VegaInternalIconManager } from '../../../../../helpers/icon/internal-icon-manager';
import closeIcon from '../../assets/close';
import clockIcon from '../../assets/clock';
import penIcon from '../../assets/pen';
import { vegaNonceManager } from '../../../../../helpers/csp/vega-nonce-manager';
import { findParent } from '../../../../../utils/ui';
import DomNodeSubjectFactory from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
import { VegaInternalCalendarEventPreviewHide, VegaInternalCalendarPreviewActionClick, VegaInternalDialogContentReady, } from '../../../../../helpers/event-manager/event-id/vega-internal-event-id';
import { VegaInternalTranslation } from '../../../../../helpers/translation/internal-translation-controller';
import { DomNodeSubjectObserverFactory } from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
import { VegaClick } from '../../../../../helpers/event-manager/event-id/vega-event-id';
export var PreviewActionButtonType;
(function (PreviewActionButtonType) {
  PreviewActionButtonType["Edit"] = "Edit";
  PreviewActionButtonType["Close"] = "Close";
})(PreviewActionButtonType || (PreviewActionButtonType = {}));
export class VegaCalendarEventPreviewDetailRenderer extends VegaSlimmer {
  constructor() {
    super(...arguments);
    this.handleActionButtonClick = (el) => {
      if (el) {
        const actionType = el.dataset.actionType;
        DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, VegaClick, () => {
          this.onHidePopover();
          if (actionType !== PreviewActionButtonType.Close) {
            this.calendarRef &&
              ChangeManager.notify(DomNodeSubjectFactory.getSubject(this.calendarRef, VegaInternalCalendarPreviewActionClick), {
                detail: {
                  event: this.currentEvent,
                  date: this.previewPayload.targetCalendarViewDate,
                  actionType,
                },
              });
          }
        });
      }
    };
  }
  componentWillLoad() {
    this.calendarRef = findParent(this.host, 'vega-calendar');
  }
  /**
   * Notifies the calendar host via ChangeManager that the event preview content has been rendered
   * and is ready for focus management (e.g., focusing the close button for VoiceOver).
   */
  componentDidRender() {
    const contentBox = findParent(this.host, 'vega-popover-content-box');
    if (this.currentEvent && contentBox && !contentBox.classList.contains('vega-force-hidden')) {
      ChangeManager.notify(DomNodeSubjectFactory.getSubject(contentBox, VegaInternalDialogContentReady), {});
    }
  }
  render() {
    return (this.currentEvent && (h("vega-box", { class: "event-preview" },
      this.injectBackgroundColorStyle(),
      this.renderActions(),
      h("vega-box", { class: "preview-content" },
        h("vega-flex", { gap: "size-16", direction: "col" },
          this.renderBasicFields(),
          this.renderDivider(),
          h("slot", { name: "event-preview-additional-fields" }))))));
  }
  renderActions() {
    const { showEditButton } = this.eventActions || {};
    return (h("vega-flex", { justifyContent: "end", class: "preview-actions" },
      showEditButton && (h("vega-button-circle", { "data-aria-label": VegaInternalTranslation.t('Edit event'), icon: VegaInternalIconManager.getIconKey('pen'), color: "text-primary", variant: "icon-only", "data-action-type": PreviewActionButtonType.Edit, ref: this.handleActionButtonClick })),
      h("vega-button-circle", { "data-aria-label": VegaInternalTranslation.t('Close event preview detail'), icon: VegaInternalIconManager.getIconKey('close'), color: "text-primary", variant: "icon-only", "data-action-type": PreviewActionButtonType.Close, ref: this.handleActionButtonClick })));
  }
  renderBasicFields() {
    const currentEvent = this.currentEvent;
    return (h(Fragment, null,
      h("vega-flex", { alignItems: "start", gap: "size-16" }, this.renderEventTitle()),
      h("vega-flex", { alignItems: "start", gap: "size-12" },
        h("vega-icon", { "aria-hidden": "true", icon: VegaInternalIconManager.getIconKey('clock'), color: "text-secondary" }),
        h("vega-flex", { direction: "col", gap: "size-4" },
          h("vega-font", { variant: "font-footnote1-long", color: "text-primary" }, currentEvent.generateDateTimeString(this.previewPayload.targetCalendarViewDate, this.previewPayload.timeFormat)),
          currentEvent.isRepeatEvent && (h("vega-font", { variant: "font-footnote1-long", color: "text-primary" }, currentEvent.generateRepeatString()))))));
  }
  onHidePopover() {
    this.calendarRef &&
      ChangeManager.notify(DomNodeSubjectFactory.getSubject(this.calendarRef, VegaInternalCalendarEventPreviewHide), {});
  }
  renderEventTitle() {
    const currentEvent = this.currentEvent;
    const eventSlotName = getCalendarEventSlotName(currentEvent.event.key);
    const eventSlot = this.host.querySelector(`[slot=${eventSlotName}]`);
    return eventSlot ? (h("slot", { name: eventSlotName })) : (h(Fragment, null,
      h("vega-box", { corners: "rounded-full", class: {
          'event-bg-color': true,
          'event-bg-disabled': currentEvent.disabled,
        }, flexShrink: 0 },
        h("span", { class: {
            [`event-color-dot-${currentEvent.variant}`]: true,
          } })),
      h("vega-font", { variant: "font-h5", color: "text-primary" }, currentEvent.title)));
  }
  renderDivider() {
    const previewSlot = this.host.querySelector('[slot=event-preview-additional-fields]');
    return (previewSlot && (h("vega-box", null,
      h("vega-divider", null))));
  }
  injectBackgroundColorStyle() {
    return (h("style", { nonce: vegaNonceManager.nonce }, getEventStatusBgColorStyle(this.currentEvent.color)));
  }
}
(() => {
  VegaInternalIconManager.register({
    close: closeIcon,
    clock: clockIcon,
    pen: penIcon,
  });
})();
__decorate([
  MapToComponentField()
], VegaCalendarEventPreviewDetailRenderer.prototype, "host", void 0);
__decorate([
  MapToComponentField()
], VegaCalendarEventPreviewDetailRenderer.prototype, "previewPayload", void 0);
__decorate([
  MapToComponentField()
], VegaCalendarEventPreviewDetailRenderer.prototype, "currentEvent", void 0);
__decorate([
  MapToComponentField()
], VegaCalendarEventPreviewDetailRenderer.prototype, "eventActions", void 0);
__decorate([
  MapToComponentField()
], VegaCalendarEventPreviewDetailRenderer.prototype, "translationSlimmer", void 0);
__decorate([
  MapToComponentMethod('componentWillLoad')
], VegaCalendarEventPreviewDetailRenderer.prototype, "componentWillLoad", null);
__decorate([
  MapToComponentMethod('componentDidRender')
], VegaCalendarEventPreviewDetailRenderer.prototype, "componentDidRender", null);
