@heartlandone/vega 2.86.0 → 2.87.0

package/dist/esm/vega-calendar_4.entry.js

@@ -1,46 +1,48 @@
 import { h, F as Fragment, f as forceUpdate, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-090d31ca.js';
-import { s as sanitizeVegaComponent } from './component-7d906393.js';
+import { g as getActiveElement, s as sanitizeVegaComponent } from './component-7d906393.js';
 import { c as MapToComponentField, V as VegaSlimmer, M as MapToComponentMethod, L as LogUtility, I as InjectVegaSlimmer } from './global-slimmer-registry-17c4efd4.js';
-import { V as VegaComponentUsageRuntimeMetricsSlimmer, I as InjectVegaGlobalSlimmer } from './component-usage-runtime-metrics-46020a03.js';
-import { D as DomNodeSubjectObserverFactory, d as domNodeSubjectFactory } from './dom-node-subject-observer-factory-aca0116e.js';
-import { a as VegaClick, i as VegaChange, V as VegaDropdownClick, b as VegaPopoverHide, j as VegaEventClick, k as VegaDateDblClick, l as VegaMoreActionClick, m as VegaDateClick } from './vega-event-id-a6ccca66.js';
-import { V as VegaInternalIconManager } from './internal-icon-manager-bd80b3bb.js';
-import { a3 as CalendarDate, ae as WeekdayLongNames, ac as pad, af as getClosestWorkday, ag as DayPeriod, ah as WeekPeriod, a5 as MonthPeriod, ai as getSystemTimezone, aj as CalendarTime, ak as CalendarDateTime, al as getCalendarEventSlotName, am as getTimeIndex, an as getEventStatusBgColorStyle } from './type-guard-adc244fd.js';
-import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-524cabd2.js';
-import { l as checkIsVoiceOverClick, f as findParent } from './ui-b7600a48.js';
-import { c as createEventEmitSlimmer } from './event-emit-slimmer-1c57093d.js';
-import { V as VegaInternalTranslation } from './internal-translation-controller-d7dee4a0.js';
-import { C as CalendarViewGenerator, a as CalendarView, M as MonthViewGenerator } from './month-view-generator-70c597a6.js';
-import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-75f93d85.js';
-import { G as VegaInternalCalendarMonthEventsChange, H as VegaInternalCalendarEventPreviewHide, I as VegaInternalCalendarEventPreviewClear, J as VegaInternalCalendarEventPreviewUpdate, C as VegaInternalDialogContentReady } from './vega-internal-event-id-db974a0d.js';
+import { V as VegaComponentUsageRuntimeMetricsSlimmer, I as InjectVegaGlobalSlimmer } from './component-usage-runtime-metrics-4b1afd04.js';
+import { D as DomNodeSubjectObserverFactory, d as domNodeSubjectFactory } from './dom-node-subject-observer-factory-3897e95b.js';
+import { a as VegaClick, i as VegaChange, V as VegaDropdownClick, b as VegaPopoverHide, j as VegaEventClick, k as VegaDateDblClick, l as VegaMoreActionClick, m as VegaDateClick, n as VegaEventEdit } from './vega-event-id-578c6c6d.js';
+import { V as VegaInternalIconManager } from './internal-icon-manager-276f968f.js';
+import { a3 as CalendarDate, ae as WeekdayLongNames, ac as pad, af as getClosestWorkday, ag as DayPeriod, ah as WeekPeriod, a5 as MonthPeriod, ai as getSystemTimezone, aj as CalendarTime, ak as CalendarDateTime, al as getCalendarEventSlotName, am as getTimeIndex, an as getEventStatusBgColorStyle } from './type-guard-ed1004cc.js';
+import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-6af5cf2e.js';
+import { l as checkIsVoiceOverClick, f as findParent } from './ui-64815a12.js';
+import { c as createEventEmitSlimmer } from './event-emit-slimmer-697ad0b7.js';
+import { V as VegaInternalTranslation } from './internal-translation-controller-d8217d93.js';
+import { C as CalendarViewGenerator, a as CalendarView, M as MonthViewGenerator } from './month-view-generator-918f1f88.js';
+import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-0a406a71.js';
+import { G as VegaInternalCalendarMonthEventsChange, H as VegaInternalCalendarEventPreviewHide, I as VegaInternalCalendarEventPreviewClear, J as VegaInternalCalendarEventPreviewUpdate, K as VegaInternalCalendarPreviewActionClick, C as VegaInternalDialogContentReady } from './vega-internal-event-id-913e8be6.js';
 import { O as Observer } from './observer-3959f9dd.js';
 import { C as ChangeManager } from './change-manager-6a7eb88c.js';
 import { f as flatNestedArray } from './array-7888f339.js';
 import { g as generateUUID } from './misc-9fdbcfbb.js';
 import { P as PageResizeObserverSlimmer } from './page-resize-observer-slimmer-e24d36c5.js';
 import { d as debounce } from './timer-9321173b.js';
-import { c as createSubStateNotifySlimmer } from './sub-state-notify-slimmer-63ecb465.js';
-import { T as TranslationSlimmer } from './translation-slimmer-5e2bff5f.js';
+import { c as createSubStateNotifySlimmer } from './sub-state-notify-slimmer-80ac7dee.js';
+import { T as TranslationSlimmer } from './translation-slimmer-32353a1c.js';
 import { A as AutoRunWhenReRenderTaskQueueSlimmer } from './auto-run-when-re-render-task-queue-slimmer.abstract-27820d4c.js';
-import { s as slotPlaceholder } from './placeholder-bf562081.js';
 import { v as vegaNonceManager } from './vega-nonce-manager-497e5eb5.js';
-import { S as SubStateObserverSlimmer } from './sub-state-observer-slimmer-2adbbe00.js';
+import { K as KeyboardManagerSlimmer } from './keyboard-manager-slimmer-012a9a9b.js';
+import { t as tryGetDocument } from './try-get-document-bef0f526.js';
+import { s as slotPlaceholder } from './placeholder-bf562081.js';
+import { S as SubStateObserverSlimmer } from './sub-state-observer-slimmer-81538a8c.js';
 import { b as parsePixelStringToNumber } from './pixel-f32c07ce.js';
-import './icon-manager-539d7cf7.js';
-import './create-public-api-runtime-metrics-slimmer-aaadaa08.js';
+import './icon-manager-691c8682.js';
+import './create-public-api-runtime-metrics-slimmer-da6615bf.js';
 import './dynamic-slimmer-90b8af32.js';
 import './breakpoints-d9faf11c.js';
 import './ui-93922c59.js';
 import './typography-396de03f.js';
-import './internal-vega-event-manager-7cdf3c28.js';
-import './try-get-document-bef0f526.js';
+import './internal-vega-event-manager-1ac5ee9a.js';
 import './static-subject-title-52f93124.js';
 import './vega-env-manager-8f8dc473.js';
-import './feature-flag-controller-30f7b625.js';
-import './index-bfc6dfa2.js';
+import './feature-flag-controller-5ebc0cec.js';
+import './index-9c9865c0.js';
 import './number-4398f2e1.js';
 import './breakpoints-332702ed.js';
 import './synchronize-task-queue-ac8acc3b.js';
+import './keyboard-manager-26e2fc32.js';
 
 /**
  * Day view calendar generator
@@ -74,7 +76,7 @@ class WeekViewGenerator extends CalendarViewGenerator {
   }
 }
 
-var __decorate$w = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$y = (undefined && undefined.__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;
@@ -99,13 +101,13 @@ class VegaCalendarRenderer extends VegaSlimmer {
         } })));
   }
 }
-__decorate$w([
+__decorate$y([
   MapToComponentField()
 ], VegaCalendarRenderer.prototype, "host", void 0);
-__decorate$w([
+__decorate$y([
   MapToComponentField()
 ], VegaCalendarRenderer.prototype, "switchPanelRenderer", void 0);
-__decorate$w([
+__decorate$y([
   MapToComponentField()
 ], VegaCalendarRenderer.prototype, "viewRenderer", void 0);
 
@@ -121,7 +123,7 @@ const ellipsisVertical = {
   icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M48 464a48 48 0 1 1 0-96 48 48 0 1 1 0 96zm0-160a48 48 0 1 1 0-96 48 48 0 1 1 0 96zM0 96a48 48 0 1 1 96 0A48 48 0 1 1 0 96z"/></svg>`,
 };
 
-var __decorate$v = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$x = (undefined && undefined.__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;
@@ -279,38 +281,38 @@ VegaCalendarSwitchPanelRenderer.views = [
   { text: 'Week', key: 'week' },
   { text: 'Month', key: 'month' },
 ];
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "viewMode", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "calendarView", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "currentPeriod", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "moreActionDropdownProps", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "moreActionClickEmitter", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "currentPeriodController", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "calendarViewController", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "translationSlimmer", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "postOperationDate", void 0);
-__decorate$v([
+__decorate$x([
   MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "showSwitchView", void 0);
 
-var __decorate$u = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$w = (undefined && undefined.__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;
@@ -337,20 +339,20 @@ class VegaCalendarViewRenderer extends VegaSlimmer {
       : this.viewWithTimeRenderer.render()));
   }
 }
-__decorate$u([
+__decorate$w([
   MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "viewMode", void 0);
-__decorate$u([
+__decorate$w([
   MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "showWeekends", void 0);
-__decorate$u([
+__decorate$w([
   MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "monthViewRenderer", void 0);
-__decorate$u([
+__decorate$w([
   MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "viewWithTimeRenderer", void 0);
 
-var __decorate$t = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$v = (undefined && undefined.__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;
@@ -421,17 +423,17 @@ class VegaCalendarDateBlockRenderer extends VegaSlimmer {
     return result;
   }
 }
-__decorate$t([
+__decorate$v([
   MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "enableDateClick", void 0);
-__decorate$t([
+__decorate$v([
   MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "dateClickEmitter", void 0);
-__decorate$t([
+__decorate$v([
   MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "dateDblClickEmitter", void 0);
 
-var __decorate$s = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$u = (undefined && undefined.__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;
@@ -439,6 +441,25 @@ var __decorate$s = (undefined && undefined.__decorate) || function (decorators,
 };
 /** The code provided is defining a TypeScript class called `VegaCalendarMonthViewRenderer` that extends `VegaSlimmer`. This class is responsible for rendering a month view of a calendar component. */
 class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
+  /* istanbul ignore next */
+  /**
+   * The function returns a reference to the HTML element that represents the month view of a calendar component.
+   *
+   * @returns {Nullable<HTMLDivElement>} the month view calendar content
+   */
+  getMonthContainerRef() {
+    return this.monthContainerRef;
+  }
+  /**
+   * The function handles the key down event on a day item in the month view of a calendar component
+   *     and switches to the day view if the "Enter" key is pressed.
+   *
+   * @param {KeyboardEvent} event - the keyboard event object
+   * @param {CalendarDate} date - the calendar date object associated with the day item
+   */
+  onDayItemKeyDown(event, date) {
+    this.goToCurrentDayView(date, event);
+  }
   /**
    * the HTML elements that represent the month view of a calendar component.
    *
@@ -446,7 +467,7 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
    */
   render() {
     const weekHead = this.calendarView.weekdays;
-    return (h("div", { class: "calendar-view-month-container" },
+    return (h("div", { class: "calendar-view-month-container", ref: (ref) => (this.monthContainerRef = ref) },
       h("div", { class: "calendar-view-row calendar-view-title border-divider-bottom" }, weekHead.map((title) => (h("div", { key: title, role: "group", tabIndex: -1, "aria-label": this.translationSlimmer.t(WeekdayLongNames[title.toLowerCase()]) },
         h("span", { "aria-hidden": "true" }, this.translationSlimmer.t(title)))))),
       this.renderMonthViewContent()));
@@ -516,7 +537,7 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
     const dateLabel = `${item.getMonthName()} ${item.date} ${item.year}`;
     return (h("div", { class: "date" },
       isMonthFirstDay && (h("div", { role: "group", "aria-label": item.getMonthName(), class: "month-block" }, item.getMonthName(true))),
-      h("div", { "aria-label": this.enableDateClick ? undefined : dateLabel, role: isDateClickable ? 'button' : 'group', "aria-disabled": isDateClickable ? 'false' : undefined, tabIndex: 0, class: "grid-col", 
+      h("div", { "aria-label": this.enableDateClick ? undefined : dateLabel, role: isDateClickable ? 'button' : 'group', "aria-disabled": isDateClickable ? 'false' : undefined, tabIndex: 0, "data-date": item.toString(), class: "grid-col", 
         // eslint-disable-next-line react/jsx-no-bind
         onDblClick: (e) => {
           this.handleDateLabelClick(e, item);
@@ -534,7 +555,7 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
    */
   goToCurrentDayView(calendarDate, e) {
     this.currentPeriodController.updateCalendarPeriod('day', calendarDate);
-    if (checkIsVoiceOverClick(e)) {
+    if (e instanceof KeyboardEvent || checkIsVoiceOverClick(e)) {
       this.dayViewFocusSlimmer.scheduleFocus();
     }
   }
@@ -567,41 +588,41 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
     return !element.classList.contains('more-button') && element.tagName !== 'VEGA-CALENDAR-EVENT';
   }
 }
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "viewMode", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "calendarView", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "currentPeriod", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "currentPeriodController", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "monthEventRenderer", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "translationSlimmer", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "isDateDisabled", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "showSwitchView", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "timezone", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "host", void 0);
-__decorate$s([
+__decorate$u([
   MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "dayViewFocusSlimmer", void 0);
 
-var __decorate$r = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$t = (undefined && undefined.__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;
@@ -702,38 +723,38 @@ class VegaCalendarViewWithTimeRenderer extends VegaCalendarDateBlockRenderer {
     });
   }
 }
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "viewMode", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timeLineRenderer", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timeMarkerRenderer", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "dayViewTimedEventRenderer", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "dayViewFullDayEventRenderer", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "calendarView", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "translationSlimmer", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "isDateDisabled", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "enableDateClick", void 0);
-__decorate$r([
+__decorate$t([
   MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timezone", void 0);
 
-var __decorate$q = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$s = (undefined && undefined.__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;
@@ -780,11 +801,11 @@ class VegaCalendarTimeLineRenderer extends VegaSlimmer {
     return timeLine;
   }
 }
-__decorate$q([
+__decorate$s([
   MapToComponentField()
 ], VegaCalendarTimeLineRenderer.prototype, "timeFormat", void 0);
 
-var __decorate$p = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$r = (undefined && undefined.__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;
@@ -837,26 +858,26 @@ class VegaCalendarViewController extends VegaSlimmer {
     this.calendarView = newView;
   }
 }
-__decorate$p([
+__decorate$r([
   MapToComponentField({ writable: true })
 ], VegaCalendarViewController.prototype, "calendarView", void 0);
-__decorate$p([
+__decorate$r([
   MapToComponentField()
 ], VegaCalendarViewController.prototype, "currentPeriod", void 0);
-__decorate$p([
+__decorate$r([
   MapToComponentField()
 ], VegaCalendarViewController.prototype, "showWeekends", void 0);
-__decorate$p([
+__decorate$r([
   MapToComponentField()
 ], VegaCalendarViewController.prototype, "currentPeriodController", void 0);
-__decorate$p([
+__decorate$r([
   MapToComponentMethod('componentWillLoad')
 ], VegaCalendarViewController.prototype, "initialCalendarView", null);
-__decorate$p([
+__decorate$r([
   MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarViewController.prototype, "generateCalendarView", null);
 
-var __decorate$o = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$q = (undefined && undefined.__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;
@@ -960,35 +981,35 @@ class VegaCalendarCurrentPeriodController extends VegaSlimmer {
     };
   }
 }
-__decorate$o([
+__decorate$q([
   MapToComponentField({ writable: true })
 ], VegaCalendarCurrentPeriodController.prototype, "currentPeriod", void 0);
-__decorate$o([
+__decorate$q([
   MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "changeEventEmitter", void 0);
-__decorate$o([
+__decorate$q([
   MapToComponentField({ writable: true })
 ], VegaCalendarCurrentPeriodController.prototype, "viewMode", void 0);
-__decorate$o([
+__decorate$q([
   MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "showWeekends", void 0);
-__decorate$o([
+__decorate$q([
   MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "timezone", void 0);
-__decorate$o([
+__decorate$q([
   MapToComponentMethod('componentWillLoad')
 ], VegaCalendarCurrentPeriodController.prototype, "initialCurrentPeriod", null);
-__decorate$o([
+__decorate$q([
   MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarCurrentPeriodController.prototype, "emitChangeEvent", null);
-__decorate$o([
+__decorate$q([
   MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarCurrentPeriodController.prototype, "updateCurrentPeriodByViewMode", null);
-__decorate$o([
+__decorate$q([
   MapToComponentMethod('watchShowWeekendsChange')
 ], VegaCalendarCurrentPeriodController.prototype, "updateCurrentPeriodAfterHideWeekEndsChange", null);
 
-var __decorate$n = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$p = (undefined && undefined.__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;
@@ -1039,6 +1060,15 @@ class VegaCalendarMonthEventRenderer extends VegaSlimmer {
   getMonthEventContainerRef() {
     return this.eventContainerRef;
   }
+  /* istanbul ignore next */
+  /**
+   * Get the more events popover box ref
+   *
+   * @returns {Nullable<HTMLVegaBoxElement>} the more events popover box element
+   */
+  getMoreEventsBoxRef() {
+    return this.moreEventsBoxRef;
+  }
   /**
    * render the current date events
    *
@@ -1094,7 +1124,7 @@ class VegaCalendarMonthEventRenderer extends VegaSlimmer {
             h("vega-box", { padding: 'size-12', width: 256 },
               h("vega-flex", { direction: "col", gap: "0", class: "group-events" },
                 h("vega-font", { textAlign: "center", variant: "font-field-label", color: "text-primary", style: { padding: '4px 0', marginBottom: '8px' } }, `${calendarDate.date} ${calendarDate.getMonthName()} ${calendarDate.year}`),
-                h("vega-box", { maxHeight: 'calc(60vh - 6px)', style: { overflowY: 'auto' }, padding: 'size-4' },
+                h("vega-box", { maxHeight: 'calc(60vh - 6px)', style: { overflowY: 'auto' }, padding: 'size-4', ref: (ref) => (this.moreEventsBoxRef = ref) },
                   h("vega-flex", { direction: "col", gap: "size-4", style: { paddingBottom: otherEvents.length ? '4px' : '0px' } }, backgroundColorEvents.map((item) => {
                     return this.eventItemRenderer.render(item, {
                       'month-event': true,
@@ -1172,31 +1202,31 @@ class VegaCalendarMonthEventRenderer extends VegaSlimmer {
       });
   }
 }
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "viewMode", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "host", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "renderer", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventPreviewPopoverController", void 0);
-__decorate$n([
+__decorate$p([
   MapToComponentMethod('componentWillLoad')
 ], VegaCalendarMonthEventRenderer.prototype, "addMaxDisplayCountChange", null);
 
@@ -2119,7 +2149,7 @@ class CalendarEvent {
   }
 }
 
-var __decorate$m = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$o = (undefined && undefined.__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;
@@ -2236,32 +2266,32 @@ class VegaCalendarEventController extends VegaSlimmer {
     }
   }
 }
-__decorate$m([
+__decorate$o([
   MapToComponentField()
 ], VegaCalendarEventController.prototype, "host", void 0);
-__decorate$m([
+__decorate$o([
   MapToComponentField({ writable: true })
 ], VegaCalendarEventController.prototype, "calendarEvents", void 0);
-__decorate$m([
+__decorate$o([
   MapToComponentField()
 ], VegaCalendarEventController.prototype, "currentPeriod", void 0);
-__decorate$m([
+__decorate$o([
   MapToComponentField()
 ], VegaCalendarEventController.prototype, "events", void 0);
-__decorate$m([
+__decorate$o([
   MapToComponentField()
 ], VegaCalendarEventController.prototype, "timezone", void 0);
-__decorate$m([
+__decorate$o([
   MapToComponentMethod('watchEventsChange')
 ], VegaCalendarEventController.prototype, "updateAfterEventChange", null);
-__decorate$m([
+__decorate$o([
   MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventController.prototype, "updateWhenComponentWillLoad", null);
-__decorate$m([
+__decorate$o([
   MapToComponentMethod('watchTimezoneChange')
 ], VegaCalendarEventController.prototype, "updateAfterTimezoneChange", null);
 
-var __decorate$l = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$n = (undefined && undefined.__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;
@@ -2311,6 +2341,7 @@ class VegaCalendarEventItemRenderer extends VegaSlimmer {
         event,
         targetCalendarViewDate,
         timeFormat: this.timeFormat,
+        eventActions: this.eventPreviewActionsController.retrieveActionsVisibility(event, targetCalendarViewDate),
       });
       // Step 2: append preview additional fields slot to preview component.
       const additionalFieldsSlot = this.host.querySelector('[slot=event-preview-additional-fields]');
@@ -2327,29 +2358,32 @@ class VegaCalendarEventItemRenderer extends VegaSlimmer {
   }
 }
 VegaCalendarEventItemRenderer.backgroundColorModeEventHeight = 18;
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "host", void 0);
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "calendarView", void 0);
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventClickEmitter", void 0);
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "timeFormat", void 0);
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "enabledEventPreview", void 0);
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "renderer", void 0);
-__decorate$l([
+__decorate$n([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventPreviewPopoverController", void 0);
+__decorate$n([
+  MapToComponentField()
+], VegaCalendarEventItemRenderer.prototype, "eventPreviewActionsController", void 0);
 
-var __decorate$k = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$m = (undefined && undefined.__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;
@@ -2401,23 +2435,23 @@ class VegaCalendarEventResponsiveController extends PageResizeObserverSlimmer {
   }
 }
 VegaCalendarEventResponsiveController.monthDateTitleHeight = 26;
-__decorate$k([
+__decorate$m([
   MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "host", void 0);
-__decorate$k([
+__decorate$m([
   MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "monthEventRenderer", void 0);
-__decorate$k([
+__decorate$m([
   MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "viewMode", void 0);
-__decorate$k([
+__decorate$m([
   MapToComponentMethod('componentDidLoad')
 ], VegaCalendarEventResponsiveController.prototype, "updateMaxDisplayCount", null);
-__decorate$k([
+__decorate$m([
   MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarEventResponsiveController.prototype, "updateMaxDisplayCountAfterSwitchToMonthView", null);
 
-var __decorate$j = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$l = (undefined && undefined.__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;
@@ -2482,26 +2516,26 @@ class VegaCalendarFullDayEventRenderer extends VegaSlimmer {
   }
 }
 VegaCalendarFullDayEventRenderer.maxDisplayEventLength = 2;
-__decorate$j([
+__decorate$l([
   MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "calendarView", void 0);
-__decorate$j([
+__decorate$l([
   MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$j([
+__decorate$l([
   MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$j([
+__decorate$l([
   MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$j([
+__decorate$l([
   MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "showAllEventsInDayOrWeekView", void 0);
-__decorate$j([
+__decorate$l([
   MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "dayViewFullDayEventMoreButtonRenderer", void 0);
 
-var __decorate$i = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$k = (undefined && undefined.__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;
@@ -2566,10 +2600,10 @@ class VegaCalendarDayViewEventLayoutRenderer extends VegaSlimmer {
   }
 }
 VegaCalendarDayViewEventLayoutRenderer.TOTAL_NUMBER_OF_CELLS = 24 * 4;
-__decorate$i([
+__decorate$k([
   MapToComponentField()
 ], VegaCalendarDayViewEventLayoutRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$i([
+__decorate$k([
   MapToComponentField()
 ], VegaCalendarDayViewEventLayoutRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
 
@@ -2857,7 +2891,7 @@ class VegaCalendarEventSorter {
   }
 }
 
-var __decorate$h = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$j = (undefined && undefined.__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;
@@ -2896,13 +2930,13 @@ class VegaCalendarTimedEventRenderer extends VegaSlimmer {
     return this.dayViewEventLayoutRenderer.render(layout, date);
   }
 }
-__decorate$h([
+__decorate$j([
   MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "calendarView", void 0);
-__decorate$h([
+__decorate$j([
   MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$h([
+__decorate$j([
   MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "dayViewEventLayoutRenderer", void 0);
 
@@ -3071,7 +3105,7 @@ class VegaCalendarFullDayEventLayoutGenerator extends VegaCalendarBaseEventLayou
   }
 }
 
-var __decorate$g = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$i = (undefined && undefined.__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;
@@ -3156,20 +3190,20 @@ class VegaCalendarFullDayEventLayoutRenderer extends VegaSlimmer {
   }
 }
 VegaCalendarFullDayEventLayoutRenderer.monthViewEventOffsetTop = 26;
-__decorate$g([
+__decorate$i([
   MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$g([
+__decorate$i([
   MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "viewMode", void 0);
-__decorate$g([
+__decorate$i([
   MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "calendarView", void 0);
-__decorate$g([
+__decorate$i([
   MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
 
-var __decorate$f = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$h = (undefined && undefined.__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;
@@ -3206,14 +3240,14 @@ class VegaCalendarFullDayEventMoreButtonRenderer extends VegaSlimmer {
     this.showAllEventsInDayOrWeekView = false;
   }
 }
-__decorate$f([
+__decorate$h([
   MapToComponentField({ writable: true })
 ], VegaCalendarFullDayEventMoreButtonRenderer.prototype, "showAllEventsInDayOrWeekView", void 0);
-__decorate$f([
+__decorate$h([
   MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarFullDayEventMoreButtonRenderer.prototype, "resetShowAllFlag", null);
 
-var __decorate$e = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$g = (undefined && undefined.__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;
@@ -3378,29 +3412,29 @@ class VegaCalendarTimeMarkerRenderer extends VegaSlimmer {
     return 0;
   }
 }
-__decorate$e([
+__decorate$g([
   MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "viewMode", void 0);
-__decorate$e([
+__decorate$g([
   MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "viewRenderer", void 0);
-__decorate$e([
+__decorate$g([
   MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "timezone", void 0);
-__decorate$e([
+__decorate$g([
   MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarTimeMarkerRenderer.prototype, "updateTimeLine", null);
-__decorate$e([
+__decorate$g([
   MapToComponentMethod('disconnectedCallback')
 ], VegaCalendarTimeMarkerRenderer.prototype, "clearTimer", null);
-__decorate$e([
+__decorate$g([
   MapToComponentMethod('connectedCallback')
 ], VegaCalendarTimeMarkerRenderer.prototype, "updateTimeLineIfComponentAddBack", null);
-__decorate$e([
+__decorate$g([
   MapToComponentMethod('componentDidLoad')
 ], VegaCalendarTimeMarkerRenderer.prototype, "displayCurrentTimeBlockByDefault", null);
 
-var __decorate$d = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$f = (undefined && undefined.__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;
@@ -3460,20 +3494,20 @@ class VegaCalendarPostOperationDateController extends VegaSlimmer {
       !newValue.current.equal(CalendarDate.from(new Date(), this.timezone)));
   }
 }
-__decorate$d([
+__decorate$f([
   MapToComponentField({ writable: true })
 ], VegaCalendarPostOperationDateController.prototype, "postOperationDate", void 0);
-__decorate$d([
+__decorate$f([
   MapToComponentField()
 ], VegaCalendarPostOperationDateController.prototype, "timezone", void 0);
-__decorate$d([
+__decorate$f([
   MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarPostOperationDateController.prototype, "setDate", null);
-__decorate$d([
+__decorate$f([
   MapToComponentMethod('watchTimezoneChange')
 ], VegaCalendarPostOperationDateController.prototype, "updateAfterTimezoneChange", null);
 
-var __decorate$c = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$e = (undefined && undefined.__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;
@@ -3515,29 +3549,29 @@ class VegaCalendarEventPreviewPopoverRenderer extends VegaSlimmer {
   }
 }
 VegaCalendarEventPreviewPopoverRenderer.SINGLE_EVENT_PREVIEW_WIDTH = 400;
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "host", void 0);
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "renderer", void 0);
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "viewMode", void 0);
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "timeFormat", void 0);
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "enabledEventPreview", void 0);
-__decorate$c([
+__decorate$e([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventPreviewPopoverController", void 0);
 
-var __decorate$b = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$d = (undefined && undefined.__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;
@@ -3633,11 +3667,11 @@ class VegaCalendarEventPreviewPopoverController extends VegaSlimmer {
     return `-${viewDate.year}-${viewDate.month}-${viewDate.date}`;
   }
 }
-__decorate$b([
+__decorate$d([
   MapToComponentMethod('watchTimezoneChange')
 ], VegaCalendarEventPreviewPopoverController.prototype, "clearAllPreviewContainers", null);
 
-var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$c = (undefined && undefined.__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;
@@ -3666,13 +3700,380 @@ class VegaCalendarDayViewFocusSlimmer extends AutoRunWhenReRenderTaskQueueSlimme
     }
   }
 }
-__decorate$a([
+__decorate$c([
   MapToComponentField()
 ], VegaCalendarDayViewFocusSlimmer.prototype, "host", void 0);
 
-const vegaCalendarCss = ".border-divider-top{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-left-width:0px;border-right-width:0px;border-bottom-width:0px}.border-divider-top.disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}.border-divider-left{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-top-width:0px;border-right-width:0px;border-bottom-width:0px}.border-divider-left.disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}.border-divider-right{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-top-width:0px;border-left-width:0px;border-bottom-width:0px}.border-divider-bottom{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-top-width:0px;border-left-width:0px;border-right-width:0px}:host{display:flex;flex-direction:column;border-radius:12px;border:1px solid rgba(var(--v-border-divider, 171, 198, 216, 1));background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));overflow:hidden;width:100%;height:100%;box-sizing:border-box;max-height:1966px}.calendar-switch-panel{padding:24px;border-bottom-width:1px;border-top-width:0px;border-left-width:0px;border-right-width:0px;border-style:solid;border-color:rgba(var(--v-border-color-divider, 171, 198, 216, 1));flex-shrink:0;width:100%;box-sizing:border-box}.calendar-switch-panel .calendar-date-switch-container{display:flex;gap:8px;align-items:center;flex-direction:row}.calendar-switch-panel .calendar-view-switch-container{display:flex;gap:16px;align-items:center;flex-direction:row}.calendar-switch-panel .calendar-current-date{padding-left:8px}.calendar-view{width:100%;position:relative;flex-grow:1;overflow-y:auto;overflow-x:hidden;--calendar-weekday-columns:7}.calendar-view.calendar-hide-weekends{--calendar-weekday-columns:5}.calendar-view-month .calendar-view-month-container{width:100%;display:grid;min-height:100%;grid-template-rows:43px repeat(6, minmax(64px, 1fr))}.calendar-view-month .calendar-view-title{background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));top:0;left:0;z-index:62}.calendar-view-month .calendar-view-title div{padding-top:12px;padding-bottom:12px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;text-align:center}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-month .calendar-view-title div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-month .calendar-view-title div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-month .calendar-view-title div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}.calendar-view-month .calendar-view-row{position:relative;display:grid;grid-template-rows:1fr;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-month .calendar-view-row.calendar-view-title{position:sticky}.calendar-view-month .calendar-view-row:last-child{border-bottom-width:0px}.calendar-view-month .calendar-view-row .row-cell{overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.calendar-view-month .calendar-view-row .row-cell:last-child{border-right-width:0px}.calendar-view-month .calendar-view-row .row-cell .date{padding-top:4px;padding-bottom:4px;padding-right:12px;padding-left:8px}.calendar-view-month .calendar-view-row .row-cell .date>div{display:inline-block;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-month .calendar-view-row .row-cell .date>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-month .calendar-view-row .row-cell .date>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-month .calendar-view-row .row-cell .date>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}.calendar-view-month .calendar-view-row .row-cell .date .month-block{margin-right:2px}.calendar-view-month .calendar-view-row .row-cell .date .grid-col{text-align:center;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px;cursor:pointer;width:18px;height:18px;line-height:18px}.calendar-view-month .calendar-view-row .row-cell .date .grid-col:hover{background-color:rgba(var(--v-bg-action-secondary-hover, 4, 112, 236, 0.1))}.calendar-view-month .calendar-view-row .row-cell .date .grid-col:active{background-color:rgba(var(--v-bg-action-secondary-active, 29, 65, 195, 0.1))}.calendar-view-month .calendar-view-row .row-cell .date .grid-col:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:2px}.calendar-view-month .calendar-view-row .row-cell.current-month-day .date>div{color:rgba(var(--v-text-primary, 32, 54, 69, 1))}.calendar-view-month .calendar-view-row .row-cell.disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}.calendar-view-month .calendar-view-row .row-cell.disabled .date>div{color:rgba(var(--v-text-disabled, 176, 180, 181, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col{background-color:rgba(var(--v-bg-action, 19, 98, 226, 1));border-top-left-radius:9999px;border-bottom-left-radius:9999px;color:rgba(var(--v-text-on-action, 252, 252, 252, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col:hover{background-color:rgba(var(--v-bg-action-hover, 4, 112, 236, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col:active{background-color:rgba(var(--v-bg-action-active, 29, 65, 195, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:2px}.calendar-view-container{width:100%}.calendar-view-container .calendar-view-title-container{background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));position:sticky;top:0;left:0;z-index:62}.calendar-view-container .calendar-view-row{box-sizing:border-box;width:100%;display:flex;flex-direction:row}.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{width:72px;text-align:right;padding-right:8px;box-sizing:border-box;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));flex-shrink:0}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}.calendar-view-container .calendar-view-title{width:100%}.calendar-view-container .calendar-view-title>div{padding:12px;padding-bottom:8px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;text-align:center;display:flex;flex-direction:column;gap:8px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-title>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-title>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-title>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}.calendar-view-container .calendar-view-title .week-day{color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-title .week-day{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-title .week-day{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-title .week-day{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}}.calendar-view-container .calendar-view-title .active div{color:rgba(var(--v-text-link, 19, 98, 226, 1))}.calendar-view-container .calendar-view-event-all-container{align-items:center}.calendar-view-container .calendar-view-event-all{display:grid;grid-template-rows:1fr;flex-grow:1;min-height:18px}.calendar-view-container .calendar-view-day-container .time-line{display:grid;grid-template-rows:16px repeat(24, minmax(74px, 1fr))}.calendar-view-container .calendar-view-day-container .time-line .time-text{margin-top:-9px}.calendar-view-container .calendar-view-day-container .calendar-view-content{width:100%}.calendar-view-container .calendar-view-day-container .calendar-view-content .grid-col{display:grid;grid-template-rows:16px repeat(24, minmax(74px, 1fr));grid-template-columns:minmax(64px, 1fr)}.calendar-view-container .calendar-view-day-container .calendar-view-content .grid-col>.border-divider-top:first-child{border-top-width:0px}.calendar-view-container .calendar-view-content-container{width:100%;position:relative}.calendar-view-week .calendar-view-container{min-height:100%}.calendar-view-week .calendar-view-container .calendar-view-title{display:grid;grid-template-rows:1fr;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .calendar-view-container .calendar-view-event-all{grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .calendar-view-container .calendar-view-day-container .calendar-view-content{display:grid;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .time-marker-container .time-marker{display:grid;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .day-event-container{display:grid;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-day .calendar-view-container{min-height:100%}.time-marker-container{position:absolute;min-width:100%;left:0;top:16px;height:calc(100% - 16px);pointer-events:none}.time-marker-container.hidden{display:none}.time-marker-container .time-marker{position:absolute;height:2px;display:grid;min-width:100%;left:0;top:0;z-index:61}.time-marker-container .time-marker div{width:100%;height:2px;background-color:rgba(var(--v-bg-status-error, 255, 110, 139, 1));opacity:0.3}.time-marker-container .time-marker div.active{opacity:1;position:relative}.time-marker-container .time-marker div.active::before{content:\"\";display:block;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px;position:absolute;width:8px;height:8px;background-color:rgba(var(--v-bg-status-error, 255, 110, 139, 1));top:-3px;left:-4px}.day-event-container{position:absolute;min-width:100%;left:0;top:16px;height:calc(100% - 16px);pointer-events:none}.day-event-container .day-event-col{height:100%;overflow:hidden}.day-event-container vega-calendar-event{pointer-events:auto;height:100%}.calendar-view-month .month-event-row{position:absolute;width:100%;overflow:hidden;height:calc(100% - 26px);left:0;bottom:0}.calendar-view-month .events-container{width:100%;box-sizing:border-box;overflow:hidden;padding:2px;display:flex;flex-direction:column;gap:2px;justify-content:space-between;flex-grow:1}.calendar-view-month .events-container .event-list{display:flex;flex-direction:column;gap:2px;flex-grow:1}.calendar-view-month .events-container .event-list .month-event-block{box-sizing:border-box;padding-left:2px;padding-right:3px}.calendar-view-month .events-container .month-event-more .more-button{display:inline-block;height:16px;font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px;color:rgba(var(--v-text-link, 19, 98, 226, 1));cursor:pointer;border-radius:2px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-month .events-container .month-event-more .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-month .events-container .month-event-more .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-month .events-container .month-event-more .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}.calendar-view-month .events-container .month-event-more .more-button:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px}.calendar-view-container .calendar-view-event-all{position:relative}.calendar-view-container .calendar-view-event-all .placeholder-block{padding-top:2px;padding-bottom:2px;box-sizing:content-box}.calendar-view-container .calendar-view-event-all .placeholder-block span{display:none}.calendar-view-container .calendar-view-event-all .day-event-block{padding-top:2px;padding-right:2px;box-sizing:border-box;padding-left:3px}.calendar-view-container .calendar-view-event-all .more-button{display:inline-block;height:16px;font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px;color:rgba(var(--v-text-link, 19, 98, 226, 1));cursor:pointer;border-radius:2px;margin-left:2px;padding:2px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-event-all .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-event-all .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-event-all .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}.calendar-view-container .calendar-view-event-all .more-button:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px}.calendar-view-container .calendar-view-event-all .event-all-col{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}.calendar-view-container .day-event-col{position:relative}.calendar-view-container .day-event-col .time-event-block{box-sizing:border-box;padding-right:8px;padding-bottom:2px;padding-top:3px}.calendar-view-container .day-event-col .time-event-block vega-calendar-event.bg-shadow:not(:focus)::part(event-container){outline:2px solid rgba(var(--v-bg-primary, 252, 252, 252, 1))}.calendar-view-container .day-event-col .time-event-block:focus-within{z-index:60 !important}.calendar-event-slot-container{display:none}.event-preview-popover{height:100%}.event-preview-popover.block{display:block}.event-preview-popover .event-preview-popover-content{height:100%}";
+const closeIcon = {
+  icon: `<svg width="17" height="16" viewBox="0 0 17 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_80261_51160)"><path d="M13.9604 1.29376C14.3511 0.903137 14.9854 0.903137 15.3761 1.29376C15.7667 1.68439 15.7667 2.31876 15.3761 2.70939L10.0823 8.00001L15.3729 13.2938C15.7636 13.6844 15.7636 14.3188 15.3729 14.7094C14.9823 15.1 14.3479 15.1 13.9573 14.7094L8.66668 9.41564L3.37293 14.7063C2.98231 15.0969 2.34793 15.0969 1.95731 14.7063C1.56668 14.3156 1.56668 13.6813 1.95731 13.2906L7.25106 8.00001L1.96043 2.70626C1.56981 2.31564 1.56981 1.68439 1.96043 1.29376C2.35106 0.903137 2.98543 0.903137 3.37606 1.29376L8.66668 6.58439L13.9604 1.29376Z" fill="currentColor" fill-opacity="0.95"/></g><defs><clipPath id="clip0_80261_51160"><rect width="14" height="16" fill="currentColor" transform="translate(1.66669)"/></clipPath></defs></svg>`,
+};
+
+const clockIcon = {
+  icon: `<svg width="17" height="16" viewBox="0 0 17 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_80261_52574)"><path d="M7.91669 3.75C7.91669 3.33437 8.25106 3 8.66669 3C9.08231 3 9.41669 3.33437 9.41669 3.75V7.6L12.0823 9.375C12.4261 9.60625 12.5198 10.0719 12.2636 10.4156C12.0604 10.7594 11.5948 10.8531 11.2511 10.5969L8.25106 8.59688C8.04169 8.48438 7.91669 8.25 7.91669 7.97188V3.75ZM8.66669 0C13.0854 0 16.6667 3.58125 16.6667 8C16.6667 12.4187 13.0854 16 8.66669 16C4.24794 16 0.666687 12.4187 0.666687 8C0.666687 3.58125 4.24794 0 8.66669 0ZM2.16669 8C2.16669 11.5906 5.07606 14.5 8.66669 14.5C12.2573 14.5 15.1667 11.5906 15.1667 8C15.1667 4.40938 12.2573 1.5 8.66669 1.5C5.07606 1.5 2.16669 4.40938 2.16669 8Z" fill="currentColor" fill-opacity="0.64"/></g><defs><clipPath id="clip0_80261_52574"><rect width="16" height="16" fill="currentColor" transform="translate(0.666687)"/></defs></svg>`,
+};
+
+const penIcon = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M36.4 360.9L13.4 439 1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1L73 498.6l78.1-23c12.4-3.6 23.7-9.9 33.4-18.4c1.4-1.2 2.7-2.5 4-3.8L492.7 149.3c21.9-21.9 24.6-55.6 8.2-80.5c-2.3-3.5-5.1-6.9-8.2-10L453.3 19.3c-25-25-65.5-25-90.5 0L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4zm46 13.5c1.7-5.6 4.5-10.8 8.4-15.2c.6-.6 1.1-1.2 1.7-1.8L321 129 383 191 154.6 419.5c-4.7 4.7-10.6 8.2-17 10.1l-23.4 6.9L59.4 452.6l16.1-54.8 6.9-23.4z"/></svg>`,
+};
+
+var __decorate$b = (undefined && undefined.__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;
+};
+var PreviewActionButtonType;
+(function (PreviewActionButtonType) {
+  PreviewActionButtonType["Edit"] = "Edit";
+  PreviewActionButtonType["Close"] = "Close";
+})(PreviewActionButtonType || (PreviewActionButtonType = {}));
+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$b([
+  MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "host", void 0);
+__decorate$b([
+  MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "previewPayload", void 0);
+__decorate$b([
+  MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "currentEvent", void 0);
+__decorate$b([
+  MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "eventActions", void 0);
+__decorate$b([
+  MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "translationSlimmer", void 0);
+__decorate$b([
+  MapToComponentMethod('componentWillLoad')
+], VegaCalendarEventPreviewDetailRenderer.prototype, "componentWillLoad", null);
+__decorate$b([
+  MapToComponentMethod('componentDidRender')
+], VegaCalendarEventPreviewDetailRenderer.prototype, "componentDidRender", null);
+
+var __decorate$a = (undefined && undefined.__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;
+};
+/**
+ * Controller for managing the visibility of event action buttons in the calendar component.
+ */
+class EventPreviewActionsController extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /**
+     * Handles the click event for preview action buttons.
+     *
+     * @param {NotifyObserverPayload} payload The payload containing information about the clicked action button.
+     */
+    this.handlePreviewActionButtonClick = (payload) => {
+      if (payload && payload.detail) {
+        const { event, date, actionType } = payload.detail;
+        if (actionType === PreviewActionButtonType.Edit) {
+          this.eventEditEmitter.emit({
+            rawEvent: event.event,
+            date: {
+              year: date.year,
+              month: date.month,
+              date: date.date,
+            },
+          });
+        }
+      }
+    };
+  }
+  /**
+   * Checks the visibility of event action buttons based on the calendar's eventEditable state and the presence of a getEventPreviewActions callback.
+   *
+   * @param {CalendarEvent} calendarEvent - The calendar event for which to check the action buttons visibility.
+   * @param {CalendarDate} calendarDate - The date associated with the event.
+   * @returns {CalendarEventActions} An object indicating which event action buttons should be visible.
+   */
+  retrieveActionsVisibility(calendarEvent, calendarDate) {
+    let result = {};
+    if (this.eventEditable && typeof this.getEventPreviewActions === 'function') {
+      const { date, month, year } = calendarDate;
+      result = this.getEventPreviewActions(calendarEvent.event, { date, month, year });
+    }
+    return result;
+  }
+  /**
+   * Registers event listeners for preview action buttons when the component is connected to the DOM.
+   */
+  registerPreviewActionButtonEvent() {
+    DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, VegaInternalCalendarPreviewActionClick, this.handlePreviewActionButtonClick);
+  }
+  /**
+   * Unregisters event listeners for preview action buttons when the component is disconnected from the DOM.
+   */
+  unregisterPreviewActionButtonEvent() {
+    DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, VegaInternalCalendarPreviewActionClick);
+  }
+}
+__decorate$a([
+  MapToComponentField()
+], EventPreviewActionsController.prototype, "host", void 0);
+__decorate$a([
+  MapToComponentField()
+], EventPreviewActionsController.prototype, "eventEditable", void 0);
+__decorate$a([
+  MapToComponentField()
+], EventPreviewActionsController.prototype, "getEventPreviewActions", void 0);
+__decorate$a([
+  MapToComponentField()
+], EventPreviewActionsController.prototype, "eventEditEmitter", void 0);
+__decorate$a([
+  MapToComponentMethod('connectedCallback')
+], EventPreviewActionsController.prototype, "registerPreviewActionButtonEvent", null);
+__decorate$a([
+  MapToComponentMethod('disconnectedCallback')
+], EventPreviewActionsController.prototype, "unregisterPreviewActionButtonEvent", null);
 
 var __decorate$9 = (undefined && undefined.__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;
+};
+/* istanbul ignore next */
+/**
+ * The `VegaCalendarKeyboardController` class is responsible for managing keyboard events
+ * for a calendar component.
+ */
+class VegaCalendarKeyboardController extends KeyboardManagerSlimmer {
+  /**
+   * The constructor function sets up keyboard event listeners for a calendar component.
+   */
+  constructor() {
+    super((target) => {
+      return [
+        {
+          keyCode: ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'],
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          activeElementInScope: () => [
+            target.monthViewRenderer.getMonthContainerRef(),
+          ],
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          callback: (event) => target.onDaysDirectionKeyDown(event),
+        },
+        {
+          keyCode: ['ArrowUp', 'ArrowDown'],
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          activeElementInScope: () => [
+            target.monthEventRenderer.getMoreEventsBoxRef(),
+          ],
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          callback: (event) => target.onEventsDirectionKeyDown(event),
+        },
+        {
+          keyCode: ['Enter'],
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          activeElementInScope: () => [
+            target.monthViewRenderer.getMonthContainerRef(),
+          ],
+          eventName: 'keydown',
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          callback: (event) => target.onDayEnter(event),
+        },
+      ];
+    });
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-calendar-day-click-keyboard-e2e}
+   */
+  /**
+   * It handles the keyboard event when the user presses the Enter key on a day cell in the month view.
+   *
+   * @param {KeyboardEvent} event - The keyboard event object.
+   */
+  onDayEnter(event) {
+    const target = event.composedPath()[0];
+    if (target.classList.contains('grid-col') && target.dataset['date'] && this.showSwitchView) {
+      const date = CalendarDate.fromString(target.dataset['date']);
+      date && this.monthViewRenderer.onDayItemKeyDown(event, date);
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-calendar-event-direction-switch-keyboard-e2e}
+   */
+  /**
+   * It handles the keyboard event when the user presses the Arrow Up or Arrow Down key on an event item in the more events popover.
+   *
+   * @param {KeyboardEvent} event - The keyboard event object.
+   */
+  onEventsDirectionKeyDown(event) {
+    const document = tryGetDocument();
+    const currentItem = document === null || document === void 0 ? void 0 : document.activeElement;
+    if (!currentItem)
+      return;
+    const boxRef = this.monthEventRenderer.getMoreEventsBoxRef();
+    if (!boxRef)
+      return;
+    const items = Array.from(boxRef.querySelectorAll('vega-calendar-event'));
+    const currentIndex = items.findIndex((item) => item === currentItem);
+    const nextIndex = event.code === 'ArrowDown' ? currentIndex + 1 : currentIndex - 1;
+    if (nextIndex >= 0 && nextIndex < items.length) {
+      items[nextIndex].focus();
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-calendar-day-direction-switch-keyboard-e2e}
+   */
+  /**
+   * It handles the keyboard event when the user presses the Arrow keys on a day cell in the month view to navigate between days.
+   *
+   * @param {KeyboardEvent} event - The keyboard event object.
+   */
+  onDaysDirectionKeyDown(event) {
+    const activeElement = getActiveElement(this.host.shadowRoot);
+    if (!activeElement)
+      return;
+    const currentItem = findParent(activeElement, '.row-cell');
+    if (!currentItem)
+      return;
+    const container = this.monthViewRenderer.getMonthContainerRef();
+    if (!container)
+      return;
+    const items = Array.from(container.querySelectorAll('.row-cell'));
+    const currentIndex = items.findIndex((item) => item === currentItem);
+    let nextIndex = -1;
+    const verticalStep = this.showWeekends ? 7 : 5;
+    switch (event.code) {
+      case 'ArrowRight':
+        nextIndex = currentIndex + 1;
+        break;
+      case 'ArrowLeft':
+        nextIndex = currentIndex - 1;
+        break;
+      case 'ArrowDown':
+        nextIndex = currentIndex + verticalStep;
+        break;
+      case 'ArrowUp':
+        nextIndex = currentIndex - verticalStep;
+        break;
+    }
+    if (nextIndex >= 0 && nextIndex < items.length) {
+      items[nextIndex].querySelector('.grid-col').focus();
+    }
+  }
+}
+__decorate$9([
+  MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "host", void 0);
+__decorate$9([
+  MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "showWeekends", void 0);
+__decorate$9([
+  MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "monthViewRenderer", void 0);
+__decorate$9([
+  MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "monthEventRenderer", void 0);
+__decorate$9([
+  MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "showSwitchView", void 0);
+
+const vegaCalendarCss = ".border-divider-top{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-left-width:0px;border-right-width:0px;border-bottom-width:0px}.border-divider-top.disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}.border-divider-left{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-top-width:0px;border-right-width:0px;border-bottom-width:0px}.border-divider-left.disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}.border-divider-right{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-top-width:0px;border-left-width:0px;border-bottom-width:0px}.border-divider-bottom{border:1px solid rgba(var(--v-border-divider-secondary, 199, 217, 229, 1));border-top-width:0px;border-left-width:0px;border-right-width:0px}:host{display:flex;flex-direction:column;border-radius:12px;border:1px solid rgba(var(--v-border-divider, 171, 198, 216, 1));background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));overflow:hidden;width:100%;height:100%;box-sizing:border-box;max-height:1966px}.calendar-switch-panel{padding:24px;border-bottom-width:1px;border-top-width:0px;border-left-width:0px;border-right-width:0px;border-style:solid;border-color:rgba(var(--v-border-color-divider, 171, 198, 216, 1));flex-shrink:0;width:100%;box-sizing:border-box}.calendar-switch-panel .calendar-date-switch-container{display:flex;gap:8px;align-items:center;flex-direction:row}.calendar-switch-panel .calendar-view-switch-container{display:flex;gap:16px;align-items:center;flex-direction:row}.calendar-switch-panel .calendar-current-date{padding-left:8px}.calendar-view{width:100%;position:relative;flex-grow:1;overflow-y:auto;overflow-x:hidden;--calendar-weekday-columns:7}.calendar-view.calendar-hide-weekends{--calendar-weekday-columns:5}.calendar-view-month .calendar-view-month-container{width:100%;display:grid;min-height:100%;grid-template-rows:43px repeat(6, minmax(64px, 1fr))}.calendar-view-month .calendar-view-title{background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));top:0;left:0;z-index:62}.calendar-view-month .calendar-view-title div{padding-top:12px;padding-bottom:12px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;text-align:center}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-month .calendar-view-title div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-month .calendar-view-title div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-month .calendar-view-title div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}.calendar-view-month .calendar-view-row{position:relative;display:grid;grid-template-rows:1fr;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-month .calendar-view-row.calendar-view-title{position:sticky}.calendar-view-month .calendar-view-row:last-child{border-bottom-width:0px}.calendar-view-month .calendar-view-row .row-cell{overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}.calendar-view-month .calendar-view-row .row-cell:last-child{border-right-width:0px}.calendar-view-month .calendar-view-row .row-cell .date{padding-top:4px;padding-bottom:4px;padding-right:12px;padding-left:8px}.calendar-view-month .calendar-view-row .row-cell .date>div{display:inline-block;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-month .calendar-view-row .row-cell .date>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-month .calendar-view-row .row-cell .date>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-month .calendar-view-row .row-cell .date>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}.calendar-view-month .calendar-view-row .row-cell .date .month-block{margin-right:2px}.calendar-view-month .calendar-view-row .row-cell .date .grid-col{text-align:center;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px;cursor:pointer;width:18px;height:18px;line-height:18px}.calendar-view-month .calendar-view-row .row-cell .date .grid-col:hover{background-color:rgba(var(--v-bg-action-secondary-hover, 4, 112, 236, 0.1))}.calendar-view-month .calendar-view-row .row-cell .date .grid-col:active{background-color:rgba(var(--v-bg-action-secondary-active, 29, 65, 195, 0.1))}.calendar-view-month .calendar-view-row .row-cell .date .grid-col:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:2px}.calendar-view-month .calendar-view-row .row-cell.current-month-day .date>div{color:rgba(var(--v-text-primary, 32, 54, 69, 1))}.calendar-view-month .calendar-view-row .row-cell.disabled{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1))}.calendar-view-month .calendar-view-row .row-cell.disabled .date>div{color:rgba(var(--v-text-disabled, 176, 180, 181, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col{background-color:rgba(var(--v-bg-action, 19, 98, 226, 1));border-top-left-radius:9999px;border-bottom-left-radius:9999px;color:rgba(var(--v-text-on-action, 252, 252, 252, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col:hover{background-color:rgba(var(--v-bg-action-hover, 4, 112, 236, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col:active{background-color:rgba(var(--v-bg-action-active, 29, 65, 195, 1))}.calendar-view-month .calendar-view-row .row-cell.active .date .grid-col:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:2px}.calendar-view-container{width:100%}.calendar-view-container .calendar-view-title-container{background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));position:sticky;top:0;left:0;z-index:62}.calendar-view-container .calendar-view-row{box-sizing:border-box;width:100%;display:flex;flex-direction:row}.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{width:72px;text-align:right;padding-right:8px;box-sizing:border-box;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));flex-shrink:0}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-row .time-line,.calendar-view-container .calendar-view-row .time-line-empty,.calendar-view-container .calendar-view-row .time-line-all{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px}}.calendar-view-container .calendar-view-title{width:100%}.calendar-view-container .calendar-view-title>div{padding:12px;padding-bottom:8px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1));font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px;text-align:center;display:flex;flex-direction:column;gap:8px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-title>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-title>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-title>div{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:700;line-height:18px}}.calendar-view-container .calendar-view-title .week-day{color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-title .week-day{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-title .week-day{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-title .week-day{font-family:\"Inter\", sans-serif;font-size:20px;font-weight:500;line-height:24px;letter-spacing:0px}}.calendar-view-container .calendar-view-title .active div{color:rgba(var(--v-text-link, 19, 98, 226, 1))}.calendar-view-container .calendar-view-event-all-container{align-items:center}.calendar-view-container .calendar-view-event-all{display:grid;grid-template-rows:1fr;flex-grow:1;min-height:18px}.calendar-view-container .calendar-view-day-container .time-line{display:grid;grid-template-rows:16px repeat(24, minmax(74px, 1fr))}.calendar-view-container .calendar-view-day-container .time-line .time-text{margin-top:-9px}.calendar-view-container .calendar-view-day-container .calendar-view-content{width:100%}.calendar-view-container .calendar-view-day-container .calendar-view-content .grid-col{display:grid;grid-template-rows:16px repeat(24, minmax(74px, 1fr));grid-template-columns:minmax(64px, 1fr)}.calendar-view-container .calendar-view-day-container .calendar-view-content .grid-col>.border-divider-top:first-child{border-top-width:0px}.calendar-view-container .calendar-view-content-container{width:100%;position:relative}.calendar-view-week .calendar-view-container{min-height:100%}.calendar-view-week .calendar-view-container .calendar-view-title{display:grid;grid-template-rows:1fr;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .calendar-view-container .calendar-view-event-all{grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .calendar-view-container .calendar-view-day-container .calendar-view-content{display:grid;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .time-marker-container .time-marker{display:grid;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-week .day-event-container{display:grid;grid-template-columns:repeat(var(--calendar-weekday-columns), minmax(64px, 1fr))}.calendar-view-day .calendar-view-container{min-height:100%}.time-marker-container{position:absolute;min-width:100%;left:0;top:16px;height:calc(100% - 16px);pointer-events:none}.time-marker-container.hidden{display:none}.time-marker-container .time-marker{position:absolute;height:2px;display:grid;min-width:100%;left:0;top:0;z-index:61}.time-marker-container .time-marker div{width:100%;height:2px;background-color:rgba(var(--v-bg-status-error, 255, 110, 139, 1));opacity:0.3}.time-marker-container .time-marker div.active{opacity:1;position:relative}.time-marker-container .time-marker div.active::before{content:\"\";display:block;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px;position:absolute;width:8px;height:8px;background-color:rgba(var(--v-bg-status-error, 255, 110, 139, 1));top:-3px;left:-4px}.day-event-container{position:absolute;min-width:100%;left:0;top:16px;height:calc(100% - 16px);pointer-events:none}.day-event-container .day-event-col{height:100%;overflow:hidden}.day-event-container vega-calendar-event{pointer-events:auto;height:100%}.calendar-view-month .month-event-row{position:absolute;width:100%;overflow:hidden;height:calc(100% - 26px);left:0;bottom:0}.calendar-view-month .events-container{width:100%;box-sizing:border-box;overflow:hidden;padding:2px;display:flex;flex-direction:column;gap:2px;justify-content:space-between;flex-grow:1}.calendar-view-month .events-container .event-list{display:flex;flex-direction:column;gap:2px;flex-grow:1}.calendar-view-month .events-container .event-list .month-event-block{box-sizing:border-box;padding-left:2px;padding-right:3px}.calendar-view-month .events-container .month-event-more .more-button{display:inline-block;height:16px;font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px;color:rgba(var(--v-text-link, 19, 98, 226, 1));cursor:pointer;border-radius:2px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-month .events-container .month-event-more .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-month .events-container .month-event-more .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-month .events-container .month-event-more .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}.calendar-view-month .events-container .month-event-more .more-button:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px}.calendar-view-container .calendar-view-event-all{position:relative}.calendar-view-container .calendar-view-event-all .placeholder-block{padding-top:2px;padding-bottom:2px;box-sizing:content-box}.calendar-view-container .calendar-view-event-all .placeholder-block span{display:none}.calendar-view-container .calendar-view-event-all .day-event-block{padding-top:2px;padding-right:2px;box-sizing:border-box;padding-left:3px}.calendar-view-container .calendar-view-event-all .more-button{display:inline-block;height:16px;font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px;color:rgba(var(--v-text-link, 19, 98, 226, 1));cursor:pointer;border-radius:2px;margin-left:2px;padding:2px}@media screen and (min-width: 768px) and (max-width: 1023px){.calendar-view-container .calendar-view-event-all .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.calendar-view-container .calendar-view-event-all .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.calendar-view-container .calendar-view-event-all .more-button{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}.calendar-view-container .calendar-view-event-all .more-button:focus-visible{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px}.calendar-view-container .calendar-view-event-all .event-all-col{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start}.calendar-view-container .day-event-col{position:relative}.calendar-view-container .day-event-col .time-event-block{box-sizing:border-box;padding-right:8px;padding-bottom:2px;padding-top:3px}.calendar-view-container .day-event-col .time-event-block vega-calendar-event.bg-shadow:not(:focus)::part(event-container){outline:2px solid rgba(var(--v-bg-primary, 252, 252, 252, 1))}.calendar-view-container .day-event-col .time-event-block:focus-within{z-index:60 !important}.calendar-event-slot-container{display:none}.event-preview-popover{height:100%}.event-preview-popover.block{display:block}.event-preview-popover .event-preview-popover-content{height:100%}";
+
+var __decorate$8 = (undefined && undefined.__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);
@@ -3689,6 +4090,8 @@ const VegaCalendar = class {
     this.change = createEvent(this, "change", 7);
     this.vegaEventClick = createEvent(this, "vegaEventClick", 7);
     this.eventClick = createEvent(this, "eventClick", 7);
+    this.vegaEventEdit = createEvent(this, "vegaEventEdit", 7);
+    this.eventEdit = createEvent(this, "eventEdit", 7);
     this.vegaDateDblClick = createEvent(this, "vegaDateDblClick", 7);
     this.dateDblClick = createEvent(this, "dateDblClick", 7);
     this.vegaDateClick = createEvent(this, "vegaDateClick", 7);
@@ -3709,6 +4112,7 @@ const VegaCalendar = class {
     this.monthEventRenderer = new VegaCalendarMonthEventRenderer();
     // The current period controller should be before the calendar view controller because the initial current period should be before the initial calendar view
     this.currentPeriodController = new VegaCalendarCurrentPeriodController();
+    this.keyboardController = new VegaCalendarKeyboardController();
     this.calendarViewController = new VegaCalendarViewController();
     // Date after recording the operation
     this.postOperationDateController = new VegaCalendarPostOperationDateController();
@@ -3721,12 +4125,14 @@ const VegaCalendar = class {
     this.fullDayEventLayoutRenderer = new VegaCalendarFullDayEventLayoutRenderer();
     this.eventPreviewPopoverRenderer = new VegaCalendarEventPreviewPopoverRenderer();
     this.calendarEventController = new VegaCalendarEventController();
+    this.eventPreviewActionsController = new EventPreviewActionsController();
     this.eventResponsiveController = new VegaCalendarEventResponsiveController();
     this.changeEventEmitter = createEventEmitSlimmer(VegaCalendar, VegaChange);
     this.eventClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaEventClick);
     this.dateDblClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaDateDblClick);
     this.moreActionClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaMoreActionClick);
     this.dateClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaDateClick);
+    this.eventEditEmitter = createEventEmitSlimmer(VegaCalendar, VegaEventEdit);
     this.changeEventPrevent = new ChildNodesEventPreventSlimmer([VegaChange], () => this.switchPanelRenderer.getSwitchPanelRef());
     this.timeFormatNotifySlimmer = createSubStateNotifySlimmer(VegaCalendar, 'timeFormat', 'watchTimeFormat');
     this.showEventColorBarNotifySlimmer = createSubStateNotifySlimmer(VegaCalendar, 'showEventColorBar', 'watchShowEventColorBar');
@@ -3803,6 +4209,13 @@ const VegaCalendar = class {
      * @vegaVersion 2.65.0
      */
     this.timezone = getSystemTimezone();
+    /**
+     * Controls whether the calendar is editable, allowing users to interact with events and dates.
+     * When set to `false`, all interactive features such as clicking on events or dates will be disabled, making the calendar view-only.
+     *
+     * @vegaVersion 2.87.0
+     */
+    this.eventEditable = true;
   }
   /**
    * Tracks changes to the current period state.
@@ -3870,103 +4283,112 @@ const VegaCalendar = class {
     "timezone": ["watchTimezoneChange"]
   }; }
 };
-__decorate$9([
+__decorate$8([
   InjectVegaGlobalSlimmer()
 ], VegaCalendar.prototype, "globalSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "translationSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "renderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "switchPanelRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFocusSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "viewRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "monthViewRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "viewWithTimeRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeLineRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeMarkerRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "monthEventRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "currentPeriodController", void 0);
-__decorate$9([
+__decorate$8([
+  InjectVegaSlimmer()
+], VegaCalendar.prototype, "keyboardController", void 0);
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "calendarViewController", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "postOperationDateController", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFullDayEventRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewPopoverController", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFullDayEventMoreButtonRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewTimedEventRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventItemRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewEventLayoutRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewPopoverRenderer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "calendarEventController", void 0);
-__decorate$9([
+__decorate$8([
+  InjectVegaSlimmer()
+], VegaCalendar.prototype, "eventPreviewActionsController", void 0);
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventResponsiveController", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "changeEventEmitter", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateDblClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "moreActionClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
+  InjectVegaSlimmer()
+], VegaCalendar.prototype, "eventEditEmitter", void 0);
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "changeEventPrevent", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeFormatNotifySlimmer", void 0);
-__decorate$9([
+__decorate$8([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "showEventColorBarNotifySlimmer", void 0);
 VegaCalendar.style = vegaCalendarCss;
@@ -3975,7 +4397,7 @@ const clockThree = {
   icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path fill="currentColor" d="M464 256A208 208 0 1 1 48 256a208 208 0 1 1 416 0zM0 256a256 256 0 1 0 512 0A256 256 0 1 0 0 256zM232 120V256c0 13.3 10.7 24 24 24H360c13.3 0 24-10.7 24-24s-10.7-24-24-24H280V120c0-13.3-10.7-24-24-24s-24 10.7-24 24z"/></svg>`,
 };
 
-var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$7 = (undefined && undefined.__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;
@@ -4136,23 +4558,23 @@ class VegaCalendarEventRenderer extends VegaSlimmer {
     'clock-three': clockThree,
   });
 })();
-__decorate$8([
+__decorate$7([
   MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "host", void 0);
-__decorate$8([
+__decorate$7([
   MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "timeFormat", void 0);
-__decorate$8([
+__decorate$7([
   MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "calendarEvent", void 0);
-__decorate$8([
+__decorate$7([
   MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "slotMode", void 0);
-__decorate$8([
+__decorate$7([
   MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "showColorBar", void 0);
 
-var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$6 = (undefined && undefined.__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;
@@ -4186,14 +4608,14 @@ class VegaCalendarEventSubStateController extends SubStateObserverSlimmer {
     });
   }
 }
-__decorate$7([
+__decorate$6([
   MapToComponentField({ writable: true })
 ], VegaCalendarEventSubStateController.prototype, "timeFormat", void 0);
-__decorate$7([
+__decorate$6([
   MapToComponentField({ writable: true })
 ], VegaCalendarEventSubStateController.prototype, "showColorBar", void 0);
 
-var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$5 = (undefined && undefined.__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;
@@ -4225,11 +4647,11 @@ class VegaCalendarTitleMaxHeightController extends VegaSlimmer {
     }
   }
 }
-__decorate$6([
+__decorate$5([
   MapToComponentField()
 ], VegaCalendarTitleMaxHeightController.prototype, "renderer", void 0);
 
-var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$4 = (undefined && undefined.__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;
@@ -4286,28 +4708,28 @@ class VegaCalendarEventSlotController extends VegaSlimmer {
     return this.host.classList.contains('calendar-event-in-popover');
   }
 }
-__decorate$5([
+__decorate$4([
   MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "host", void 0);
-__decorate$5([
+__decorate$4([
   MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "calendarEvent", void 0);
-__decorate$5([
+__decorate$4([
   MapToComponentField({ writable: true })
 ], VegaCalendarEventSlotController.prototype, "slotMode", void 0);
-__decorate$5([
+__decorate$4([
   MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "renderer", void 0);
-__decorate$5([
+__decorate$4([
   MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventSlotController.prototype, "findTheCalendarEventSlot", null);
-__decorate$5([
+__decorate$4([
   MapToComponentMethod('componentDidLoad')
 ], VegaCalendarEventSlotController.prototype, "appendTheRepeatEventSlotToContainer", null);
 
 const vegaCalendarEventCss = ".bg-disabled{background-color:rgba(var(--v-bg-disabled, 176, 180, 181, 1))}:host{display:block;box-sizing:border-box;width:100%;outline:none}:host .background-color-mode{border-radius:2px;color:rgba(var(--v-text-black, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px;cursor:pointer;overflow:hidden;white-space:nowrap}@media screen and (min-width: 768px) and (max-width: 1023px){:host .background-color-mode{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .background-color-mode{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .background-color-mode{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}:host .background-color-mode:not(.slot-container){padding-left:8px;padding-right:8px}:host .event-container{display:block;width:100%;border-radius:4px;cursor:pointer;box-sizing:border-box;overflow:hidden}:host .background-color-mode.slot-container{height:16px;line-height:16px}:host ::slotted(vega-calendar-event-slot){position:relative;pointer-events:none}:host(.month-event) .event-container{display:flex;flex-direction:row;gap:4px;align-items:center;min-height:16px}:host(.month-event) .event-container:not(.slot-container){padding-left:2px;padding-right:2px}:host(.month-event) .event-container .event-status{width:8px;height:8px;box-sizing:border-box;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px;margin-left:2px;flex-shrink:0}:host(.month-event) .event-container .event-status span{display:none;width:100%;height:100%;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px}:host(.month-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));flex-grow:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media screen and (min-width: 768px) and (max-width: 1023px){:host(.month-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host(.month-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host(.month-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}:host(.month-event) .event-container.secondary .event-status span{display:block;background-size:4px 4px;opacity:0.8}:host(.month-event) .event-container.tertiary .event-status{padding:1px}:host(.month-event) .event-container.tertiary .event-status span{display:block;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1))}:host(.month-event) .event-container.disabled .event-status{background-color:rgba(var(--v-bg-disabled, 176, 180, 181, 1))}:host(.month-event) .event-container:hover{background-color:rgba(var(--v-bg-action-secondary-hover, 4, 112, 236, 0.1))}:host(.month-event) .event-container:active{background-color:rgba(var(--v-bg-action-secondary-active, 29, 65, 195, 0.1))}:host(.day-event) .event-container{position:relative}:host(.day-event) .event-container:not(.slot-container){padding-left:8px;padding-right:8px}:host(.day-event) .event-container .event-status{position:absolute;width:4px;height:100%;left:0;top:0;z-index:1}:host(.day-event) .event-container .event-status span{display:none}:host(.day-event) .event-container .cover-block{position:absolute;height:100%;width:100%;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));border-radius:4px;left:0;top:0;opacity:0.7}:host(.day-event) .event-container .event-content,:host(.day-event) .event-container .event-time{display:flex;flex-direction:row;align-items:center}:host(.day-event) .event-container .event-content{gap:8px;position:relative;height:100%;box-sizing:border-box}:host(.day-event) .event-container .event-time{gap:4px;color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}@media screen and (min-width: 768px) and (max-width: 1023px){:host(.day-event) .event-container .event-time{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host(.day-event) .event-container .event-time{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host(.day-event) .event-container .event-time{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:400;line-height:16px}}:host(.day-event) .event-container .event-time vega-icon{flex-shrink:0}:host(.day-event) .event-container .event-time span{white-space:nowrap}:host(.day-event) .event-container .event-title{color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}@media screen and (min-width: 768px) and (max-width: 1023px){:host(.day-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host(.day-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host(.day-event) .event-container .event-title{font-family:\"Inter\", sans-serif;font-size:12px;font-weight:700;line-height:16px;letter-spacing:0px}}:host(.day-event) .event-container .event-title.title-word-wrap{overflow:hidden}:host(.day-event) .event-container .event-title:not(.title-word-wrap){white-space:nowrap}:host(.day-event) .event-container.duration-half-an-hour{padding-top:8px;padding-bottom:8px}:host(.day-event) .event-container.vertical{height:100%}:host(.day-event) .event-container.vertical .event-content{flex-direction:column;align-items:flex-start;gap:4px;padding-top:8px;padding-bottom:8px}:host(.day-event) .event-container.secondary .event-status span,:host(.day-event) .event-container.tertiary .event-status span{display:block;position:absolute;border-top-left-radius:4px;border-bottom-left-radius:4px}:host(.day-event) .event-container.secondary .cover-block,:host(.day-event) .event-container.tertiary .cover-block{width:calc(100% - 2px);height:calc(100% - 2px);top:1px;left:1px}:host(.day-event) .event-container.secondary .event-status span{width:100%;height:100%;top:0px;left:0px;background-size:4px 4px;opacity:0.8}:host(.day-event) .event-container.secondary .cover-block{opacity:0.9}:host(.day-event) .event-container.tertiary .event-status span{background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));width:2px;height:calc(100% - 2px);top:1px;left:1px}:host(.day-event) .event-container.tertiary .cover-block{opacity:1}:host(.day-event) .event-container.disabled{background-color:rgba(var(--v-bg-disabled, 176, 180, 181, 1))}:host(.day-event) .event-container.disabled .event-status{background-color:rgba(var(--v-bg-disabled, 176, 180, 181, 1))}:host(.day-event) .slot-container{min-height:16px}:host(.month-event.calendar-event-large-size) .background-color-mode{border-radius:4px}:host(.month-event.calendar-event-large-size) .background-color-mode:not(.slot-container){padding-top:4px;padding-bottom:4px}:host(.month-event.calendar-event-large-size) .event-container:not(.slot-container){padding-top:4px;padding-bottom:4px}:host(.month-event.calendar-event-large-size) .slot-container{height:24px;display:flex;align-items:center;line-height:24px}:host(:focus) .background-color-mode,:host(:focus-visible) .background-color-mode{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px}:host(.month-event:focus) .event-container,:host(.month-event:focus-visible) .event-container,:host(.day-event:focus) .event-container,:host(.day-event:focus-visible) .event-container{outline:2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));outline-offset:0px}.stripe{background-image:linear-gradient(-45deg, transparent 25%, rgba(var(--v-bg-primary, 252, 252, 252, 1)) 25% 50%, transparent 50% 75%, rgba(var(--v-bg-primary, 252, 252, 252, 1)) 75% 100%)}";
 
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$3 = (undefined && undefined.__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);
@@ -4346,30 +4768,30 @@ const VegaCalendarEvent = class {
   }
   get host() { return getElement(this); }
 };
-__decorate$4([
+__decorate$3([
   InjectVegaGlobalSlimmer()
 ], VegaCalendarEvent.prototype, "globalSlimmer", void 0);
-__decorate$4([
+__decorate$3([
   InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "pageResizeObserverSlimmer", void 0);
-__decorate$4([
+__decorate$3([
   InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate$4([
+__decorate$3([
   InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "renderer", void 0);
-__decorate$4([
+__decorate$3([
   InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "slotController", void 0);
-__decorate$4([
+__decorate$3([
   InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "subStateController", void 0);
-__decorate$4([
+__decorate$3([
   InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "titleMaxHeightController", void 0);
 VegaCalendarEvent.style = vegaCalendarEventCss;
 
-var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$2 = (undefined && undefined.__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;
@@ -4384,6 +4806,7 @@ class VegaCalendarEventPreviewStateController extends VegaSlimmer {
     DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, VegaInternalCalendarEventPreviewUpdate, (payload) => {
       this.previewPayload = payload;
       this.currentEvent = payload.event;
+      this.eventActions = payload.eventActions;
     });
     DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, VegaInternalCalendarEventPreviewClear, () => {
       this.currentEvent = null;
@@ -4397,128 +4820,25 @@ class VegaCalendarEventPreviewStateController extends VegaSlimmer {
     DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, VegaInternalCalendarEventPreviewClear);
   }
 }
-__decorate$3([
+__decorate$2([
   MapToComponentField()
 ], VegaCalendarEventPreviewStateController.prototype, "host", void 0);
-__decorate$3([
+__decorate$2([
   MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "currentEvent", void 0);
-__decorate$3([
+__decorate$2([
   MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "previewPayload", void 0);
-__decorate$3([
+__decorate$2([
+  MapToComponentField({ writable: true })
+], VegaCalendarEventPreviewStateController.prototype, "eventActions", void 0);
+__decorate$2([
   MapToComponentMethod('connectedCallback')
 ], VegaCalendarEventPreviewStateController.prototype, "registerEventPreviewUpdateObserver", null);
-__decorate$3([
+__decorate$2([
   MapToComponentMethod('disconnectedCallback')
 ], VegaCalendarEventPreviewStateController.prototype, "unregisterEventPreviewUpdateObserver", null);
 
-const closeIcon = {
-  icon: `<svg width="17" height="16" viewBox="0 0 17 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_80261_51160)"><path d="M13.9604 1.29376C14.3511 0.903137 14.9854 0.903137 15.3761 1.29376C15.7667 1.68439 15.7667 2.31876 15.3761 2.70939L10.0823 8.00001L15.3729 13.2938C15.7636 13.6844 15.7636 14.3188 15.3729 14.7094C14.9823 15.1 14.3479 15.1 13.9573 14.7094L8.66668 9.41564L3.37293 14.7063C2.98231 15.0969 2.34793 15.0969 1.95731 14.7063C1.56668 14.3156 1.56668 13.6813 1.95731 13.2906L7.25106 8.00001L1.96043 2.70626C1.56981 2.31564 1.56981 1.68439 1.96043 1.29376C2.35106 0.903137 2.98543 0.903137 3.37606 1.29376L8.66668 6.58439L13.9604 1.29376Z" fill="currentColor" fill-opacity="0.95"/></g><defs><clipPath id="clip0_80261_51160"><rect width="14" height="16" fill="currentColor" transform="translate(1.66669)"/></clipPath></defs></svg>`,
-};
-
-const clockIcon = {
-  icon: `<svg width="17" height="16" viewBox="0 0 17 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_80261_52574)"><path d="M7.91669 3.75C7.91669 3.33437 8.25106 3 8.66669 3C9.08231 3 9.41669 3.33437 9.41669 3.75V7.6L12.0823 9.375C12.4261 9.60625 12.5198 10.0719 12.2636 10.4156C12.0604 10.7594 11.5948 10.8531 11.2511 10.5969L8.25106 8.59688C8.04169 8.48438 7.91669 8.25 7.91669 7.97188V3.75ZM8.66669 0C13.0854 0 16.6667 3.58125 16.6667 8C16.6667 12.4187 13.0854 16 8.66669 16C4.24794 16 0.666687 12.4187 0.666687 8C0.666687 3.58125 4.24794 0 8.66669 0ZM2.16669 8C2.16669 11.5906 5.07606 14.5 8.66669 14.5C12.2573 14.5 15.1667 11.5906 15.1667 8C15.1667 4.40938 12.2573 1.5 8.66669 1.5C5.07606 1.5 2.16669 4.40938 2.16669 8Z" fill="currentColor" fill-opacity="0.64"/></g><defs><clipPath id="clip0_80261_52574"><rect width="16" height="16" fill="currentColor" transform="translate(0.666687)"/></defs></svg>`,
-};
-
-var __decorate$2 = (undefined && undefined.__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;
-};
-class VegaCalendarEventPreviewDetailRenderer extends VegaSlimmer {
-  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() {
-    return (h("vega-flex", { justifyContent: "end", class: "preview-actions" },
-      h("vega-button-circle", { "data-aria-label": VegaInternalTranslation.t('Close event preview detail'), icon: VegaInternalIconManager.getIconKey('close'), color: "text-primary", variant: "icon-only", 
-        /* eslint-disable-next-line react/jsx-no-bind */
-        onVegaClick: this.onHidePopover.bind(this) })));
-  }
-  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,
-  });
-})();
-__decorate$2([
-  MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "host", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "previewPayload", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "currentEvent", void 0);
-__decorate$2([
-  MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "translationSlimmer", void 0);
-__decorate$2([
-  MapToComponentMethod('componentWillLoad')
-], VegaCalendarEventPreviewDetailRenderer.prototype, "componentWillLoad", null);
-__decorate$2([
-  MapToComponentMethod('componentDidRender')
-], VegaCalendarEventPreviewDetailRenderer.prototype, "componentDidRender", null);
-
 const vegaCalendarEventPreviewCss = ":host(.single-event-preview) .event-preview{width:398px;box-sizing:border-box}:host(.single-event-preview) .preview-actions{padding-top:4px;padding-left:4px;padding-right:4px}:host(.single-event-preview) .preview-content{margin-bottom:24px;margin-left:12px;margin-right:12px;padding-left:12px;padding-right:12px}:host(.group-event-preview) .event-preview{width:320px;box-sizing:border-box;height:100%}:host(.group-event-preview) .event-preview{border:1px solid rgba(var(--v-border-divider, 171, 198, 216, 1));border-right-width:0px;border-top-width:0px;border-bottom-width:0px;border-left-width:1px;border-left-style:solid}:host(.group-event-preview) .preview-actions{padding-top:4px;padding-left:4px;padding-right:4px}:host(.group-event-preview) .preview-content{margin-bottom:16px;margin-left:12px;margin-right:12px;padding-left:4px;padding-right:4px}:host .preview-content{max-height:60vh;overflow-y:auto}:host .event-bg-color{width:12px;height:12px;margin-top:8px;position:relative}:host .event-bg-color.event-bg-disabled{background-color:rgba(var(--v-bg-disabled, 176, 180, 181, 1))}:host .event-bg-color span{display:block;position:absolute;top:0px;left:0px;opacity:0.8}:host .event-bg-color span.event-color-dot-secondary{width:100%;height:100%;background-size:4px 4px;background-image:linear-gradient(-45deg, transparent 25%, rgba(var(--v-bg-primary, 252, 252, 252, 1)) 25% 50%, transparent 50% 75%, rgba(var(--v-bg-primary, 252, 252, 252, 1)) 75% 100%)}:host .event-bg-color span.event-color-dot-tertiary{width:calc(100% - 2px);height:calc(100% - 2px);top:1px;left:1px;border-top-left-radius:9999px;border-bottom-left-radius:9999px;border-top-right-radius:9999px;border-bottom-right-radius:9999px;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));opacity:1}";
 
 var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -4539,6 +4859,7 @@ const VegaCalendarEventPreview = class {
     this.translationSlimmer = new TranslationSlimmer();
     this.globalSlimmer = {};
     this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
+    this.eventActions = {};
   }
   render() {
     return sanitizeVegaComponent(h(Host, null, this.previewPayload && this.detailRenderer.render()), this.host);