@heartlandone/vega 2.86.0 → 2.87.0-beta.1

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

@@ -5,46 +5,48 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-58ea899e.js');
 const component = require('./component-1e352960.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
-const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-4572c5b7.js');
-const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-9110cb94.js');
-const vegaEventId = require('./vega-event-id-d9994eb3.js');
-const internalIconManager = require('./internal-icon-manager-c989189a.js');
-const typeGuard = require('./type-guard-2e97fc56.js');
-const accessibility = require('./accessibility-a5ef2038.js');
-const ui = require('./ui-ae4ee13d.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-80e1c8ca.js');
-const internalTranslationController = require('./internal-translation-controller-8360a89c.js');
-const monthViewGenerator = require('./month-view-generator-41b6c6b6.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-f3979a03.js');
-const vegaInternalEventId = require('./vega-internal-event-id-87014e4f.js');
+const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-389d1548.js');
+const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-ba6a95f3.js');
+const vegaEventId = require('./vega-event-id-f95480b7.js');
+const internalIconManager = require('./internal-icon-manager-66c48800.js');
+const typeGuard = require('./type-guard-c1195e50.js');
+const accessibility = require('./accessibility-88f8af84.js');
+const ui = require('./ui-3727d685.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-73c42d7e.js');
+const internalTranslationController = require('./internal-translation-controller-f0da24b2.js');
+const monthViewGenerator = require('./month-view-generator-8ed9818e.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-b7498e5a.js');
+const vegaInternalEventId = require('./vega-internal-event-id-e138d4d6.js');
 const observer = require('./observer-f49483e8.js');
 const changeManager = require('./change-manager-a297e4d2.js');
 const array = require('./array-249289f2.js');
 const misc = require('./misc-3d30df91.js');
 const pageResizeObserverSlimmer = require('./page-resize-observer-slimmer-273d62ef.js');
 const timer = require('./timer-5f33058b.js');
-const subStateNotifySlimmer = require('./sub-state-notify-slimmer-b33171b0.js');
-const translationSlimmer = require('./translation-slimmer-3cd7d3b2.js');
+const subStateNotifySlimmer = require('./sub-state-notify-slimmer-757e3a76.js');
+const translationSlimmer = require('./translation-slimmer-a4a7f0eb.js');
 const autoRunWhenReRenderTaskQueueSlimmer_abstract = require('./auto-run-when-re-render-task-queue-slimmer.abstract-5734634d.js');
-const placeholder = require('./placeholder-cb6d37ad.js');
 const vegaNonceManager = require('./vega-nonce-manager-df69d3ed.js');
-const subStateObserverSlimmer = require('./sub-state-observer-slimmer-b8f6f27b.js');
+const keyboardManagerSlimmer = require('./keyboard-manager-slimmer-861d991f.js');
+const tryGetDocument = require('./try-get-document-c0ebd39a.js');
+const placeholder = require('./placeholder-cb6d37ad.js');
+const subStateObserverSlimmer = require('./sub-state-observer-slimmer-aa93ab4f.js');
 const pixel = require('./pixel-98f2a10c.js');
-require('./icon-manager-c12c6ea9.js');
-require('./create-public-api-runtime-metrics-slimmer-9cb09fb2.js');
+require('./icon-manager-e855446d.js');
+require('./create-public-api-runtime-metrics-slimmer-122350c3.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./breakpoints-ebde4837.js');
 require('./ui-32120990.js');
 require('./typography-4560e7f1.js');
-require('./internal-vega-event-manager-7e0d966d.js');
-require('./try-get-document-c0ebd39a.js');
+require('./internal-vega-event-manager-063c17cb.js');
 require('./static-subject-title-5829a298.js');
 require('./vega-env-manager-23b8b23c.js');
-require('./feature-flag-controller-9129ef52.js');
-require('./index-f054eb5d.js');
+require('./feature-flag-controller-5fa21654.js');
+require('./index-3ca118c4.js');
 require('./number-4816603d.js');
 require('./breakpoints-1cc2c4c6.js');
 require('./synchronize-task-queue-1ee80e94.js');
+require('./keyboard-manager-1e045791.js');
 
 /**
  * Day view calendar generator
@@ -78,7 +80,7 @@ class WeekViewGenerator extends monthViewGenerator.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;
@@ -103,13 +105,13 @@ class VegaCalendarRenderer extends globalSlimmerRegistry.VegaSlimmer {
         } })));
   }
 }
-__decorate$w([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarRenderer.prototype, "host", void 0);
-__decorate$w([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarRenderer.prototype, "switchPanelRenderer", void 0);
-__decorate$w([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarRenderer.prototype, "viewRenderer", void 0);
 
@@ -125,7 +127,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;
@@ -283,38 +285,38 @@ VegaCalendarSwitchPanelRenderer.views = [
   { text: 'Week', key: 'week' },
   { text: 'Month', key: 'month' },
 ];
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "viewMode", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "calendarView", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "currentPeriod", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "moreActionDropdownProps", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "moreActionClickEmitter", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "currentPeriodController", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "calendarViewController", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "translationSlimmer", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "postOperationDate", void 0);
-__decorate$v([
+__decorate$x([
   globalSlimmerRegistry.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;
@@ -341,20 +343,20 @@ class VegaCalendarViewRenderer extends globalSlimmerRegistry.VegaSlimmer {
       : this.viewWithTimeRenderer.render()));
   }
 }
-__decorate$u([
+__decorate$w([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "viewMode", void 0);
-__decorate$u([
+__decorate$w([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "showWeekends", void 0);
-__decorate$u([
+__decorate$w([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "monthViewRenderer", void 0);
-__decorate$u([
+__decorate$w([
   globalSlimmerRegistry.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;
@@ -425,17 +427,17 @@ class VegaCalendarDateBlockRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return result;
   }
 }
-__decorate$t([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "enableDateClick", void 0);
-__decorate$t([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "dateClickEmitter", void 0);
-__decorate$t([
+__decorate$v([
   globalSlimmerRegistry.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;
@@ -443,6 +445,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.
    *
@@ -450,7 +471,7 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
    */
   render() {
     const weekHead = this.calendarView.weekdays;
-    return (index.h("div", { class: "calendar-view-month-container" },
+    return (index.h("div", { class: "calendar-view-month-container", ref: (ref) => (this.monthContainerRef = ref) },
       index.h("div", { class: "calendar-view-row calendar-view-title border-divider-bottom" }, weekHead.map((title) => (index.h("div", { key: title, role: "group", tabIndex: -1, "aria-label": this.translationSlimmer.t(typeGuard.WeekdayLongNames[title.toLowerCase()]) },
         index.h("span", { "aria-hidden": "true" }, this.translationSlimmer.t(title)))))),
       this.renderMonthViewContent()));
@@ -520,7 +541,7 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
     const dateLabel = `${item.getMonthName()} ${item.date} ${item.year}`;
     return (index.h("div", { class: "date" },
       isMonthFirstDay && (index.h("div", { role: "group", "aria-label": item.getMonthName(), class: "month-block" }, item.getMonthName(true))),
-      index.h("div", { "aria-label": this.enableDateClick ? undefined : dateLabel, role: isDateClickable ? 'button' : 'group', "aria-disabled": isDateClickable ? 'false' : undefined, tabIndex: 0, class: "grid-col", 
+      index.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);
@@ -538,7 +559,7 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
    */
   goToCurrentDayView(calendarDate, e) {
     this.currentPeriodController.updateCalendarPeriod('day', calendarDate);
-    if (ui.checkIsVoiceOverClick(e)) {
+    if (e instanceof KeyboardEvent || ui.checkIsVoiceOverClick(e)) {
       this.dayViewFocusSlimmer.scheduleFocus();
     }
   }
@@ -571,41 +592,41 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
     return !element.classList.contains('more-button') && element.tagName !== 'VEGA-CALENDAR-EVENT';
   }
 }
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "viewMode", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "calendarView", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "currentPeriod", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "currentPeriodController", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "monthEventRenderer", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "translationSlimmer", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "isDateDisabled", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "showSwitchView", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "timezone", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "host", void 0);
-__decorate$s([
+__decorate$u([
   globalSlimmerRegistry.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;
@@ -706,38 +727,38 @@ class VegaCalendarViewWithTimeRenderer extends VegaCalendarDateBlockRenderer {
     });
   }
 }
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "viewMode", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timeLineRenderer", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timeMarkerRenderer", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "dayViewTimedEventRenderer", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "dayViewFullDayEventRenderer", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "calendarView", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "translationSlimmer", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "isDateDisabled", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "enableDateClick", void 0);
-__decorate$r([
+__decorate$t([
   globalSlimmerRegistry.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;
@@ -784,11 +805,11 @@ class VegaCalendarTimeLineRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return timeLine;
   }
 }
-__decorate$q([
+__decorate$s([
   globalSlimmerRegistry.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;
@@ -841,26 +862,26 @@ class VegaCalendarViewController extends globalSlimmerRegistry.VegaSlimmer {
     this.calendarView = newView;
   }
 }
-__decorate$p([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarViewController.prototype, "calendarView", void 0);
-__decorate$p([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewController.prototype, "currentPeriod", void 0);
-__decorate$p([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewController.prototype, "showWeekends", void 0);
-__decorate$p([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewController.prototype, "currentPeriodController", void 0);
-__decorate$p([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarViewController.prototype, "initialCalendarView", null);
-__decorate$p([
+__decorate$r([
   globalSlimmerRegistry.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;
@@ -964,35 +985,35 @@ class VegaCalendarCurrentPeriodController extends globalSlimmerRegistry.VegaSlim
     };
   }
 }
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarCurrentPeriodController.prototype, "currentPeriod", void 0);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "changeEventEmitter", void 0);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarCurrentPeriodController.prototype, "viewMode", void 0);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "showWeekends", void 0);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "timezone", void 0);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarCurrentPeriodController.prototype, "initialCurrentPeriod", null);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarCurrentPeriodController.prototype, "emitChangeEvent", null);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarCurrentPeriodController.prototype, "updateCurrentPeriodByViewMode", null);
-__decorate$o([
+__decorate$q([
   globalSlimmerRegistry.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;
@@ -1043,6 +1064,15 @@ class VegaCalendarMonthEventRenderer extends globalSlimmerRegistry.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
    *
@@ -1098,7 +1128,7 @@ class VegaCalendarMonthEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
             index.h("vega-box", { padding: 'size-12', width: 256 },
               index.h("vega-flex", { direction: "col", gap: "0", class: "group-events" },
                 index.h("vega-font", { textAlign: "center", variant: "font-field-label", color: "text-primary", style: { padding: '4px 0', marginBottom: '8px' } }, `${calendarDate.date} ${calendarDate.getMonthName()} ${calendarDate.year}`),
-                index.h("vega-box", { maxHeight: 'calc(60vh - 6px)', style: { overflowY: 'auto' }, padding: 'size-4' },
+                index.h("vega-box", { maxHeight: 'calc(60vh - 6px)', style: { overflowY: 'auto' }, padding: 'size-4', ref: (ref) => (this.moreEventsBoxRef = ref) },
                   index.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,
@@ -1176,31 +1206,31 @@ class VegaCalendarMonthEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
       });
   }
 }
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "viewMode", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "host", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "renderer", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventPreviewPopoverController", void 0);
-__decorate$n([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarMonthEventRenderer.prototype, "addMaxDisplayCountChange", null);
 
@@ -2123,7 +2153,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;
@@ -2240,32 +2270,32 @@ class VegaCalendarEventController extends globalSlimmerRegistry.VegaSlimmer {
     }
   }
 }
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "host", void 0);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventController.prototype, "calendarEvents", void 0);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "currentPeriod", void 0);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "events", void 0);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "timezone", void 0);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentMethod('watchEventsChange')
 ], VegaCalendarEventController.prototype, "updateAfterEventChange", null);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventController.prototype, "updateWhenComponentWillLoad", null);
-__decorate$m([
+__decorate$o([
   globalSlimmerRegistry.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;
@@ -2315,6 +2345,7 @@ class VegaCalendarEventItemRenderer extends globalSlimmerRegistry.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]');
@@ -2331,29 +2362,32 @@ class VegaCalendarEventItemRenderer extends globalSlimmerRegistry.VegaSlimmer {
   }
 }
 VegaCalendarEventItemRenderer.backgroundColorModeEventHeight = 18;
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "host", void 0);
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "calendarView", void 0);
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventClickEmitter", void 0);
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "timeFormat", void 0);
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "enabledEventPreview", void 0);
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "renderer", void 0);
-__decorate$l([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventPreviewPopoverController", void 0);
+__decorate$n([
+  globalSlimmerRegistry.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;
@@ -2405,23 +2439,23 @@ class VegaCalendarEventResponsiveController extends pageResizeObserverSlimmer.Pa
   }
 }
 VegaCalendarEventResponsiveController.monthDateTitleHeight = 26;
-__decorate$k([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "host", void 0);
-__decorate$k([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "monthEventRenderer", void 0);
-__decorate$k([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "viewMode", void 0);
-__decorate$k([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentMethod('componentDidLoad')
 ], VegaCalendarEventResponsiveController.prototype, "updateMaxDisplayCount", null);
-__decorate$k([
+__decorate$m([
   globalSlimmerRegistry.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;
@@ -2486,26 +2520,26 @@ class VegaCalendarFullDayEventRenderer extends globalSlimmerRegistry.VegaSlimmer
   }
 }
 VegaCalendarFullDayEventRenderer.maxDisplayEventLength = 2;
-__decorate$j([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "calendarView", void 0);
-__decorate$j([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$j([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$j([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$j([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "showAllEventsInDayOrWeekView", void 0);
-__decorate$j([
+__decorate$l([
   globalSlimmerRegistry.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;
@@ -2570,10 +2604,10 @@ class VegaCalendarDayViewEventLayoutRenderer extends globalSlimmerRegistry.VegaS
   }
 }
 VegaCalendarDayViewEventLayoutRenderer.TOTAL_NUMBER_OF_CELLS = 24 * 4;
-__decorate$i([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDayViewEventLayoutRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$i([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDayViewEventLayoutRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
 
@@ -2861,7 +2895,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;
@@ -2900,13 +2934,13 @@ class VegaCalendarTimedEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return this.dayViewEventLayoutRenderer.render(layout, date);
   }
 }
-__decorate$h([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "calendarView", void 0);
-__decorate$h([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$h([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "dayViewEventLayoutRenderer", void 0);
 
@@ -3075,7 +3109,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;
@@ -3160,20 +3194,20 @@ class VegaCalendarFullDayEventLayoutRenderer extends globalSlimmerRegistry.VegaS
   }
 }
 VegaCalendarFullDayEventLayoutRenderer.monthViewEventOffsetTop = 26;
-__decorate$g([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$g([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "viewMode", void 0);
-__decorate$g([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "calendarView", void 0);
-__decorate$g([
+__decorate$i([
   globalSlimmerRegistry.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;
@@ -3210,14 +3244,14 @@ class VegaCalendarFullDayEventMoreButtonRenderer extends globalSlimmerRegistry.V
     this.showAllEventsInDayOrWeekView = false;
   }
 }
-__decorate$f([
+__decorate$h([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarFullDayEventMoreButtonRenderer.prototype, "showAllEventsInDayOrWeekView", void 0);
-__decorate$f([
+__decorate$h([
   globalSlimmerRegistry.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;
@@ -3382,29 +3416,29 @@ class VegaCalendarTimeMarkerRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return 0;
   }
 }
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "viewMode", void 0);
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "viewRenderer", void 0);
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "timezone", void 0);
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarTimeMarkerRenderer.prototype, "updateTimeLine", null);
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
 ], VegaCalendarTimeMarkerRenderer.prototype, "clearTimer", null);
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
 ], VegaCalendarTimeMarkerRenderer.prototype, "updateTimeLineIfComponentAddBack", null);
-__decorate$e([
+__decorate$g([
   globalSlimmerRegistry.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;
@@ -3464,20 +3498,20 @@ class VegaCalendarPostOperationDateController extends globalSlimmerRegistry.Vega
       !newValue.current.equal(typeGuard.CalendarDate.from(new Date(), this.timezone)));
   }
 }
-__decorate$d([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarPostOperationDateController.prototype, "postOperationDate", void 0);
-__decorate$d([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarPostOperationDateController.prototype, "timezone", void 0);
-__decorate$d([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarPostOperationDateController.prototype, "setDate", null);
-__decorate$d([
+__decorate$f([
   globalSlimmerRegistry.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;
@@ -3519,29 +3553,29 @@ class VegaCalendarEventPreviewPopoverRenderer extends globalSlimmerRegistry.Vega
   }
 }
 VegaCalendarEventPreviewPopoverRenderer.SINGLE_EVENT_PREVIEW_WIDTH = 400;
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "host", void 0);
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "renderer", void 0);
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "viewMode", void 0);
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "timeFormat", void 0);
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "enabledEventPreview", void 0);
-__decorate$c([
+__decorate$e([
   globalSlimmerRegistry.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;
@@ -3637,11 +3671,11 @@ class VegaCalendarEventPreviewPopoverController extends globalSlimmerRegistry.Ve
     return `-${viewDate.year}-${viewDate.month}-${viewDate.date}`;
   }
 }
-__decorate$b([
+__decorate$d([
   globalSlimmerRegistry.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;
@@ -3670,13 +3704,380 @@ class VegaCalendarDayViewFocusSlimmer extends autoRunWhenReRenderTaskQueueSlimme
     }
   }
 }
-__decorate$a([
+__decorate$c([
   globalSlimmerRegistry.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 globalSlimmerRegistry.VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    this.handleActionButtonClick = (el) => {
+      if (el) {
+        const actionType = el.dataset.actionType;
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(el, vegaEventId.VegaClick, () => {
+          this.onHidePopover();
+          if (actionType !== PreviewActionButtonType.Close) {
+            this.calendarRef &&
+              changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.calendarRef, vegaInternalEventId.VegaInternalCalendarPreviewActionClick), {
+                detail: {
+                  event: this.currentEvent,
+                  date: this.previewPayload.targetCalendarViewDate,
+                  actionType,
+                },
+              });
+          }
+        });
+      }
+    };
+  }
+  componentWillLoad() {
+    this.calendarRef = ui.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 = ui.findParent(this.host, 'vega-popover-content-box');
+    if (this.currentEvent && contentBox && !contentBox.classList.contains('vega-force-hidden')) {
+      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(contentBox, vegaInternalEventId.VegaInternalDialogContentReady), {});
+    }
+  }
+  render() {
+    return (this.currentEvent && (index.h("vega-box", { class: "event-preview" },
+      this.injectBackgroundColorStyle(),
+      this.renderActions(),
+      index.h("vega-box", { class: "preview-content" },
+        index.h("vega-flex", { gap: "size-16", direction: "col" },
+          this.renderBasicFields(),
+          this.renderDivider(),
+          index.h("slot", { name: "event-preview-additional-fields" }))))));
+  }
+  renderActions() {
+    const { showEditButton } = this.eventActions || {};
+    return (index.h("vega-flex", { justifyContent: "end", class: "preview-actions" },
+      showEditButton && (index.h("vega-button-circle", { "data-aria-label": internalTranslationController.VegaInternalTranslation.t('Edit event'), icon: internalIconManager.VegaInternalIconManager.getIconKey('pen'), color: "text-primary", variant: "icon-only", "data-action-type": PreviewActionButtonType.Edit, ref: this.handleActionButtonClick })),
+      index.h("vega-button-circle", { "data-aria-label": internalTranslationController.VegaInternalTranslation.t('Close event preview detail'), icon: internalIconManager.VegaInternalIconManager.getIconKey('close'), color: "text-primary", variant: "icon-only", "data-action-type": PreviewActionButtonType.Close, ref: this.handleActionButtonClick })));
+  }
+  renderBasicFields() {
+    const currentEvent = this.currentEvent;
+    return (index.h(index.Fragment, null,
+      index.h("vega-flex", { alignItems: "start", gap: "size-16" }, this.renderEventTitle()),
+      index.h("vega-flex", { alignItems: "start", gap: "size-12" },
+        index.h("vega-icon", { "aria-hidden": "true", icon: internalIconManager.VegaInternalIconManager.getIconKey('clock'), color: "text-secondary" }),
+        index.h("vega-flex", { direction: "col", gap: "size-4" },
+          index.h("vega-font", { variant: "font-footnote1-long", color: "text-primary" }, currentEvent.generateDateTimeString(this.previewPayload.targetCalendarViewDate, this.previewPayload.timeFormat)),
+          currentEvent.isRepeatEvent && (index.h("vega-font", { variant: "font-footnote1-long", color: "text-primary" }, currentEvent.generateRepeatString()))))));
+  }
+  onHidePopover() {
+    this.calendarRef &&
+      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.calendarRef, vegaInternalEventId.VegaInternalCalendarEventPreviewHide), {});
+  }
+  renderEventTitle() {
+    const currentEvent = this.currentEvent;
+    const eventSlotName = typeGuard.getCalendarEventSlotName(currentEvent.event.key);
+    const eventSlot = this.host.querySelector(`[slot=${eventSlotName}]`);
+    return eventSlot ? (index.h("slot", { name: eventSlotName })) : (index.h(index.Fragment, null,
+      index.h("vega-box", { corners: "rounded-full", class: {
+          'event-bg-color': true,
+          'event-bg-disabled': currentEvent.disabled,
+        }, flexShrink: 0 },
+        index.h("span", { class: {
+            [`event-color-dot-${currentEvent.variant}`]: true,
+          } })),
+      index.h("vega-font", { variant: "font-h5", color: "text-primary" }, currentEvent.title)));
+  }
+  renderDivider() {
+    const previewSlot = this.host.querySelector('[slot=event-preview-additional-fields]');
+    return (previewSlot && (index.h("vega-box", null,
+      index.h("vega-divider", null))));
+  }
+  injectBackgroundColorStyle() {
+    return (index.h("style", { nonce: vegaNonceManager.vegaNonceManager.nonce }, typeGuard.getEventStatusBgColorStyle(this.currentEvent.color)));
+  }
+}
+(() => {
+  internalIconManager.VegaInternalIconManager.register({
+    close: closeIcon,
+    clock: clockIcon,
+    pen: penIcon,
+  });
+})();
+__decorate$b([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "host", void 0);
+__decorate$b([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "previewPayload", void 0);
+__decorate$b([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "currentEvent", void 0);
+__decorate$b([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "eventActions", void 0);
+__decorate$b([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarEventPreviewDetailRenderer.prototype, "translationSlimmer", void 0);
+__decorate$b([
+  globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
+], VegaCalendarEventPreviewDetailRenderer.prototype, "componentWillLoad", null);
+__decorate$b([
+  globalSlimmerRegistry.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 globalSlimmerRegistry.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.DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, vegaInternalEventId.VegaInternalCalendarPreviewActionClick, this.handlePreviewActionButtonClick);
+  }
+  /**
+   * Unregisters event listeners for preview action buttons when the component is disconnected from the DOM.
+   */
+  unregisterPreviewActionButtonEvent() {
+    domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalCalendarPreviewActionClick);
+  }
+}
+__decorate$a([
+  globalSlimmerRegistry.MapToComponentField()
+], EventPreviewActionsController.prototype, "host", void 0);
+__decorate$a([
+  globalSlimmerRegistry.MapToComponentField()
+], EventPreviewActionsController.prototype, "eventEditable", void 0);
+__decorate$a([
+  globalSlimmerRegistry.MapToComponentField()
+], EventPreviewActionsController.prototype, "getEventPreviewActions", void 0);
+__decorate$a([
+  globalSlimmerRegistry.MapToComponentField()
+], EventPreviewActionsController.prototype, "eventEditEmitter", void 0);
+__decorate$a([
+  globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
+], EventPreviewActionsController.prototype, "registerPreviewActionButtonEvent", null);
+__decorate$a([
+  globalSlimmerRegistry.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.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 = typeGuard.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.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 = component.getActiveElement(this.host.shadowRoot);
+    if (!activeElement)
+      return;
+    const currentItem = ui.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([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "host", void 0);
+__decorate$9([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "showWeekends", void 0);
+__decorate$9([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "monthViewRenderer", void 0);
+__decorate$9([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarKeyboardController.prototype, "monthEventRenderer", void 0);
+__decorate$9([
+  globalSlimmerRegistry.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);
@@ -3693,6 +4094,8 @@ const VegaCalendar = class {
     this.change = index.createEvent(this, "change", 7);
     this.vegaEventClick = index.createEvent(this, "vegaEventClick", 7);
     this.eventClick = index.createEvent(this, "eventClick", 7);
+    this.vegaEventEdit = index.createEvent(this, "vegaEventEdit", 7);
+    this.eventEdit = index.createEvent(this, "eventEdit", 7);
     this.vegaDateDblClick = index.createEvent(this, "vegaDateDblClick", 7);
     this.dateDblClick = index.createEvent(this, "dateDblClick", 7);
     this.vegaDateClick = index.createEvent(this, "vegaDateClick", 7);
@@ -3713,6 +4116,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();
@@ -3725,12 +4129,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 = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendar, vegaEventId.VegaChange);
     this.eventClickEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendar, vegaEventId.VegaEventClick);
     this.dateDblClickEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendar, vegaEventId.VegaDateDblClick);
     this.moreActionClickEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendar, vegaEventId.VegaMoreActionClick);
     this.dateClickEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendar, vegaEventId.VegaDateClick);
+    this.eventEditEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendar, vegaEventId.VegaEventEdit);
     this.changeEventPrevent = new childNodesEventPreventSlimmer.ChildNodesEventPreventSlimmer([vegaEventId.VegaChange], () => this.switchPanelRenderer.getSwitchPanelRef());
     this.timeFormatNotifySlimmer = subStateNotifySlimmer.createSubStateNotifySlimmer(VegaCalendar, 'timeFormat', 'watchTimeFormat');
     this.showEventColorBarNotifySlimmer = subStateNotifySlimmer.createSubStateNotifySlimmer(VegaCalendar, 'showEventColorBar', 'watchShowEventColorBar');
@@ -3807,6 +4213,13 @@ const VegaCalendar = class {
      * @vegaVersion 2.65.0
      */
     this.timezone = typeGuard.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-beta.1
+     */
+    this.eventEditable = true;
   }
   /**
    * Tracks changes to the current period state.
@@ -3874,103 +4287,112 @@ const VegaCalendar = class {
     "timezone": ["watchTimezoneChange"]
   }; }
 };
-__decorate$9([
+__decorate$8([
   componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
 ], VegaCalendar.prototype, "globalSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "translationSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "renderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "switchPanelRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFocusSlimmer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "viewRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "monthViewRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "viewWithTimeRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeLineRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeMarkerRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "monthEventRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "currentPeriodController", void 0);
-__decorate$9([
+__decorate$8([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendar.prototype, "keyboardController", void 0);
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "calendarViewController", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "postOperationDateController", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFullDayEventRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewPopoverController", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFullDayEventMoreButtonRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewTimedEventRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventItemRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewEventLayoutRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewPopoverRenderer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "calendarEventController", void 0);
-__decorate$9([
+__decorate$8([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendar.prototype, "eventPreviewActionsController", void 0);
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventResponsiveController", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "changeEventEmitter", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateDblClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "moreActionClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateClickEmitter", void 0);
-__decorate$9([
+__decorate$8([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendar.prototype, "eventEditEmitter", void 0);
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "changeEventPrevent", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeFormatNotifySlimmer", void 0);
-__decorate$9([
+__decorate$8([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "showEventColorBarNotifySlimmer", void 0);
 VegaCalendar.style = vegaCalendarCss;
@@ -3979,7 +4401,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;
@@ -4140,23 +4562,23 @@ class VegaCalendarEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
     'clock-three': clockThree,
   });
 })();
-__decorate$8([
+__decorate$7([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "host", void 0);
-__decorate$8([
+__decorate$7([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "timeFormat", void 0);
-__decorate$8([
+__decorate$7([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "calendarEvent", void 0);
-__decorate$8([
+__decorate$7([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "slotMode", void 0);
-__decorate$8([
+__decorate$7([
   globalSlimmerRegistry.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;
@@ -4190,14 +4612,14 @@ class VegaCalendarEventSubStateController extends subStateObserverSlimmer.SubSta
     });
   }
 }
-__decorate$7([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventSubStateController.prototype, "timeFormat", void 0);
-__decorate$7([
+__decorate$6([
   globalSlimmerRegistry.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;
@@ -4229,11 +4651,11 @@ class VegaCalendarTitleMaxHeightController extends globalSlimmerRegistry.VegaSli
     }
   }
 }
-__decorate$6([
+__decorate$5([
   globalSlimmerRegistry.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;
@@ -4290,28 +4712,28 @@ class VegaCalendarEventSlotController extends globalSlimmerRegistry.VegaSlimmer
     return this.host.classList.contains('calendar-event-in-popover');
   }
 }
-__decorate$5([
+__decorate$4([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "host", void 0);
-__decorate$5([
+__decorate$4([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "calendarEvent", void 0);
-__decorate$5([
+__decorate$4([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventSlotController.prototype, "slotMode", void 0);
-__decorate$5([
+__decorate$4([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "renderer", void 0);
-__decorate$5([
+__decorate$4([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventSlotController.prototype, "findTheCalendarEventSlot", null);
-__decorate$5([
+__decorate$4([
   globalSlimmerRegistry.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);
@@ -4350,30 +4772,30 @@ const VegaCalendarEvent = class {
   }
   get host() { return index.getElement(this); }
 };
-__decorate$4([
+__decorate$3([
   componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
 ], VegaCalendarEvent.prototype, "globalSlimmer", void 0);
-__decorate$4([
+__decorate$3([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "pageResizeObserverSlimmer", void 0);
-__decorate$4([
+__decorate$3([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate$4([
+__decorate$3([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "renderer", void 0);
-__decorate$4([
+__decorate$3([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "slotController", void 0);
-__decorate$4([
+__decorate$3([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "subStateController", void 0);
-__decorate$4([
+__decorate$3([
   globalSlimmerRegistry.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;
@@ -4388,6 +4810,7 @@ class VegaCalendarEventPreviewStateController extends globalSlimmerRegistry.Vega
     domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, vegaInternalEventId.VegaInternalCalendarEventPreviewUpdate, (payload) => {
       this.previewPayload = payload;
       this.currentEvent = payload.event;
+      this.eventActions = payload.eventActions;
     });
     domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(this.host, vegaInternalEventId.VegaInternalCalendarEventPreviewClear, () => {
       this.currentEvent = null;
@@ -4401,128 +4824,25 @@ class VegaCalendarEventPreviewStateController extends globalSlimmerRegistry.Vega
     domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalCalendarEventPreviewClear);
   }
 }
-__decorate$3([
+__decorate$2([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewStateController.prototype, "host", void 0);
-__decorate$3([
+__decorate$2([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "currentEvent", void 0);
-__decorate$3([
+__decorate$2([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "previewPayload", void 0);
-__decorate$3([
+__decorate$2([
+  globalSlimmerRegistry.MapToComponentField({ writable: true })
+], VegaCalendarEventPreviewStateController.prototype, "eventActions", void 0);
+__decorate$2([
   globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
 ], VegaCalendarEventPreviewStateController.prototype, "registerEventPreviewUpdateObserver", null);
-__decorate$3([
+__decorate$2([
   globalSlimmerRegistry.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 globalSlimmerRegistry.VegaSlimmer {
-  componentWillLoad() {
-    this.calendarRef = ui.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 = ui.findParent(this.host, 'vega-popover-content-box');
-    if (this.currentEvent && contentBox && !contentBox.classList.contains('vega-force-hidden')) {
-      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(contentBox, vegaInternalEventId.VegaInternalDialogContentReady), {});
-    }
-  }
-  render() {
-    return (this.currentEvent && (index.h("vega-box", { class: "event-preview" },
-      this.injectBackgroundColorStyle(),
-      this.renderActions(),
-      index.h("vega-box", { class: "preview-content" },
-        index.h("vega-flex", { gap: "size-16", direction: "col" },
-          this.renderBasicFields(),
-          this.renderDivider(),
-          index.h("slot", { name: "event-preview-additional-fields" }))))));
-  }
-  renderActions() {
-    return (index.h("vega-flex", { justifyContent: "end", class: "preview-actions" },
-      index.h("vega-button-circle", { "data-aria-label": internalTranslationController.VegaInternalTranslation.t('Close event preview detail'), icon: internalIconManager.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 (index.h(index.Fragment, null,
-      index.h("vega-flex", { alignItems: "start", gap: "size-16" }, this.renderEventTitle()),
-      index.h("vega-flex", { alignItems: "start", gap: "size-12" },
-        index.h("vega-icon", { "aria-hidden": "true", icon: internalIconManager.VegaInternalIconManager.getIconKey('clock'), color: "text-secondary" }),
-        index.h("vega-flex", { direction: "col", gap: "size-4" },
-          index.h("vega-font", { variant: "font-footnote1-long", color: "text-primary" }, currentEvent.generateDateTimeString(this.previewPayload.targetCalendarViewDate, this.previewPayload.timeFormat)),
-          currentEvent.isRepeatEvent && (index.h("vega-font", { variant: "font-footnote1-long", color: "text-primary" }, currentEvent.generateRepeatString()))))));
-  }
-  onHidePopover() {
-    this.calendarRef &&
-      changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.calendarRef, vegaInternalEventId.VegaInternalCalendarEventPreviewHide), {});
-  }
-  renderEventTitle() {
-    const currentEvent = this.currentEvent;
-    const eventSlotName = typeGuard.getCalendarEventSlotName(currentEvent.event.key);
-    const eventSlot = this.host.querySelector(`[slot=${eventSlotName}]`);
-    return eventSlot ? (index.h("slot", { name: eventSlotName })) : (index.h(index.Fragment, null,
-      index.h("vega-box", { corners: "rounded-full", class: {
-          'event-bg-color': true,
-          'event-bg-disabled': currentEvent.disabled,
-        }, flexShrink: 0 },
-        index.h("span", { class: {
-            [`event-color-dot-${currentEvent.variant}`]: true,
-          } })),
-      index.h("vega-font", { variant: "font-h5", color: "text-primary" }, currentEvent.title)));
-  }
-  renderDivider() {
-    const previewSlot = this.host.querySelector('[slot=event-preview-additional-fields]');
-    return (previewSlot && (index.h("vega-box", null,
-      index.h("vega-divider", null))));
-  }
-  injectBackgroundColorStyle() {
-    return (index.h("style", { nonce: vegaNonceManager.vegaNonceManager.nonce }, typeGuard.getEventStatusBgColorStyle(this.currentEvent.color)));
-  }
-}
-(() => {
-  internalIconManager.VegaInternalIconManager.register({
-    close: closeIcon,
-    clock: clockIcon,
-  });
-})();
-__decorate$2([
-  globalSlimmerRegistry.MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "host", void 0);
-__decorate$2([
-  globalSlimmerRegistry.MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "previewPayload", void 0);
-__decorate$2([
-  globalSlimmerRegistry.MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "currentEvent", void 0);
-__decorate$2([
-  globalSlimmerRegistry.MapToComponentField()
-], VegaCalendarEventPreviewDetailRenderer.prototype, "translationSlimmer", void 0);
-__decorate$2([
-  globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
-], VegaCalendarEventPreviewDetailRenderer.prototype, "componentWillLoad", null);
-__decorate$2([
-  globalSlimmerRegistry.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) {
@@ -4543,6 +4863,7 @@ const VegaCalendarEventPreview = class {
     this.translationSlimmer = new translationSlimmer.TranslationSlimmer();
     this.globalSlimmer = {};
     this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer();
+    this.eventActions = {};
   }
   render() {
     return component.sanitizeVegaComponent(index.h(index.Host, null, this.previewPayload && this.detailRenderer.render()), this.host);