@globalpayments/vega 2.90.0 → 2.91.0

package/dist/cjs/{vega-calendar_4.cjs.entry.js → vega-calendar_5.cjs.entry.js}

@@ -5,82 +5,63 @@ 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 placeholder = require('./placeholder-cb6d37ad.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-389d1548.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-c82df135.js');
-const vegaEventId = require('./vega-event-id-37c1716f.js');
-const internalIconManager = require('./internal-icon-manager-66c48800.js');
-const typeGuard = require('./type-guard-9917b11f.js');
+const vegaEventId = require('./vega-event-id-df22d80e.js');
+const internalIconManager = require('./internal-icon-manager-40bcac72.js');
+const vegaInternalEventId = require('./vega-internal-event-id-ecc5b87a.js');
+const typeGuard = require('./type-guard-0171e779.js');
 const accessibility = require('./accessibility-88f8af84.js');
 const ui = require('./ui-c91c37a7.js');
-const eventEmitSlimmer = require('./event-emit-slimmer-146316b2.js');
-const internalTranslationController = require('./internal-translation-controller-9785d4e8.js');
-const monthViewGenerator = require('./month-view-generator-c7492e06.js');
-const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-85a7fdb0.js');
-const vegaInternalEventId = require('./vega-internal-event-id-e138d4d6.js');
+const eventEmitSlimmer = require('./event-emit-slimmer-5bab10c2.js');
+const internalTranslationController = require('./internal-translation-controller-5905469e.js');
+const monthViewGenerator = require('./month-view-generator-48215a05.js');
+const internalCalendarPeriodFactory = require('./internal-calendar-period-factory-9c66cf36.js');
+const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-76d19d56.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-450277b6.js');
-const translationSlimmer = require('./translation-slimmer-e8549aff.js');
+const subStateNotifySlimmer = require('./sub-state-notify-slimmer-18891389.js');
+const translationSlimmer = require('./translation-slimmer-2af6f141.js');
 const autoRunWhenReRenderTaskQueueSlimmer_abstract = require('./auto-run-when-re-render-task-queue-slimmer.abstract-5734634d.js');
 const vegaNonceManager = require('./vega-nonce-manager-df69d3ed.js');
-const keyboardManagerSlimmer = require('./keyboard-manager-slimmer-eedcfbc8.js');
+const keyboardManagerSlimmer = require('./keyboard-manager-slimmer-079a7e87.js');
 const tryGetDocument = require('./try-get-document-c0ebd39a.js');
-const placeholder = require('./placeholder-cb6d37ad.js');
-const subStateObserverSlimmer = require('./sub-state-observer-slimmer-5bfe8e97.js');
+const subStateObserverSlimmer = require('./sub-state-observer-slimmer-eee2f0ae.js');
 const pixel = require('./pixel-98f2a10c.js');
-require('./icon-manager-e855446d.js');
-require('./create-public-api-runtime-metrics-slimmer-122350c3.js');
+require('./icon-manager-be358b32.js');
+require('./create-public-api-runtime-metrics-slimmer-91b0cbfb.js');
 require('./dynamic-slimmer-f31fdfd7.js');
 require('./breakpoints-ebde4837.js');
 require('./ui-32120990.js');
-require('./typography-4560e7f1.js');
-require('./internal-vega-event-manager-6e49d1ca.js');
+require('./typography-3ea4fe41.js');
+require('./internal-vega-event-manager-7196a847.js');
 require('./static-subject-title-70c73b16.js');
 require('./vega-env-manager-23b8b23c.js');
-require('./feature-flag-controller-5fa21654.js');
+require('./feature-flag-controller-438a1510.js');
 require('./index-3ca118c4.js');
 require('./number-4816603d.js');
 require('./breakpoints-1cc2c4c6.js');
 require('./synchronize-task-queue-1ee80e94.js');
-require('./keyboard-manager-5396083a.js');
+require('./keyboard-manager-61e8ce38.js');
 
 /**
  * Day view calendar generator
  */
-class DayViewGenerator extends monthViewGenerator.CalendarViewGenerator {
-  /**
-   * @inheritDoc
-   */
-  generate(period) {
-    return new monthViewGenerator.CalendarView([this.generateWeekHead()[period.current.toDate().getDay()]], [[period.current]]);
-  }
-}
-
-/**
- * Calendar week view generator
- */
-class WeekViewGenerator extends monthViewGenerator.CalendarViewGenerator {
+class DayViewGenerator extends typeGuard.CalendarViewGenerator {
   /**
    * @inheritDoc
    */
   generate(period) {
-    const dates = this.generateDates(period);
-    const showWeekends = period.showWeekends;
-    let weekDays = this.generateWeekHead();
-    let dateItems = [dates.map((date) => typeGuard.CalendarDate.from(date))];
-    if (showWeekends === false) {
-      weekDays = weekDays.slice(1, 6);
-      dateItems = dateItems.map((items) => items.slice(1, 6));
-    }
-    return new monthViewGenerator.CalendarView(weekDays, dateItems);
+    return new typeGuard.CalendarView([this.generateWeekHead()[period.current.toDate().getDay()]], [[period.current]]);
   }
 }
 
-var __decorate$y = (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;
@@ -105,29 +86,21 @@ class VegaCalendarRenderer extends globalSlimmerRegistry.VegaSlimmer {
         } })));
   }
 }
-__decorate$y([
+__decorate$C([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarRenderer.prototype, "host", void 0);
-__decorate$y([
+__decorate$C([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarRenderer.prototype, "switchPanelRenderer", void 0);
-__decorate$y([
+__decorate$C([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarRenderer.prototype, "viewRenderer", void 0);
 
-const chevronRight = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 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="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>`,
-};
-
-const chevronLeft = {
-  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 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="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z"/></svg>`,
-};
-
-const ellipsisVertical = {
+const ellipsisVerticalIcon = {
   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$x = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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;
@@ -145,24 +118,6 @@ class VegaCalendarSwitchPanelRenderer extends globalSlimmerRegistry.VegaSlimmer
     this.handleViewChange = (input) => {
       this.currentPeriodController.updateCalendarPeriod(input.detail, this.postOperationDate);
     };
-    /**
-     * reset view content to today
-     */
-    this.todayButtonClick = () => {
-      this.currentPeriodController.setCurrentPeriod(this.currentPeriod.now());
-    };
-    /**
-     * update view content after click next button
-     */
-    this.nextButtonClick = () => {
-      this.currentPeriodController.setCurrentPeriod(this.currentPeriod.next());
-    };
-    /**
-     * update view content after click previous button
-     */
-    this.prevButtonClick = () => {
-      this.currentPeriodController.setCurrentPeriod(this.currentPeriod.previous());
-    };
     /**
      * The more action menu item click
      *
@@ -192,31 +147,10 @@ class VegaCalendarSwitchPanelRenderer extends globalSlimmerRegistry.VegaSlimmer
         this.showSwitchView ? this.renderViewSwitch() : null,
         this.renderMoreActionMenu())));
   }
-  /**
-   * The `renderDateSwitch` function returns a container with buttons for switching dates and displaying the current date.
-   *
-   * @returns {HTMLDivElement} action button elements container.
-   */
   renderDateSwitch() {
-    return (index.h("div", { class: "calendar-date-switch-container" },
-      index.h("vega-button", { variant: "secondary", size: "small", ref: (button) => {
-          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(button, vegaEventId.VegaClick, this.todayButtonClick);
-        }, label: this.translationSlimmer.t('Today') }),
-      index.h("vega-button-circle", { variant: "secondary", size: "small", icon: internalIconManager.VegaInternalIconManager.getIconKey('chevron-left'), label: "previous", showTooltip: false, ref: (button) => {
-          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(button, vegaEventId.VegaClick, this.prevButtonClick);
-        } }),
-      index.h("vega-button-circle", { variant: "secondary", size: "small", icon: internalIconManager.VegaInternalIconManager.getIconKey('chevron-right'), label: "next", showTooltip: false, ref: (button) => {
-          domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(button, vegaEventId.VegaClick, this.nextButtonClick);
-        } }),
-      this.renderCurrentPeriod()));
-  }
-  /**
-   * The function `renderCurrentPeriod` returns an HTML element displaying the view date content summary info.
-   *
-   * @returns {HTMLVegaFontElement} The text content inside the element is "Current Date Test".
-   */
-  renderCurrentPeriod() {
-    return (index.h("vega-font", { class: "calendar-current-date", variant: "font-field-label", color: "text-primary" }, this.getViewDateSummary()));
+    return (index.h("vega-calendar-period-switcher", { viewMode: this.viewMode, timezone: this.timezone, showWeekends: this.showWeekends, ref: (ref) => {
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, vegaInternalEventId.VegaInternalCurrentPeriodChange, (input) => this.currentPeriodController.setCurrentPeriod(input.detail));
+      } }));
   }
   /**
    * The function `renderViewSwitch` returns a JSX element for rendering a segment control component in a TypeScript React application.
@@ -242,42 +176,10 @@ class VegaCalendarSwitchPanelRenderer extends globalSlimmerRegistry.VegaSlimmer
         index.h("vega-button-circle", { "data-aria-label": this.translationSlimmer.t('More actions'), size: "small", icon: internalIconManager.VegaInternalIconManager.getIconKey('ellipsis-vertical'), variant: "icon-only" })));
     }
   }
-  /**
-   * Get the view content date summary info, such as `January, 2024` or `10 January, 2024` or `28 December, 2023 - 3 January, 2024`
-   *
-   * @returns {string} string
-   */
-  getViewDateSummary() {
-    const currentDate = this.currentPeriod.current;
-    let result = '';
-    switch (this.viewMode) {
-      case 'day': {
-        const monthName = this.translationSlimmer.t(currentDate.getMonthName());
-        result = `${currentDate.date} ${monthName}, ${currentDate.year}`;
-        break;
-      }
-      case 'week': {
-        const weekItems = this.calendarView.dateItems[0];
-        const start = weekItems[0];
-        const end = weekItems[weekItems.length - 1];
-        const [startMonthName, endMonthName] = [start, end].map((item) => this.translationSlimmer.t(item.getMonthName()));
-        result = `${start.date} ${startMonthName}${start.year === end.year ? '' : ', ' + start.year} - ${end.date} ${endMonthName}, ${end.year}`;
-        break;
-      }
-      case 'month': {
-        const monthName = this.translationSlimmer.t(currentDate.getMonthName());
-        result = `${monthName}, ${currentDate.year}`;
-        break;
-      }
-    }
-    return result;
-  }
 }
 (() => {
   internalIconManager.VegaInternalIconManager.register({
-    'chevron-right': chevronRight,
-    'chevron-left': chevronLeft,
-    'ellipsis-vertical': ellipsisVertical,
+    'ellipsis-vertical': ellipsisVerticalIcon,
   });
 })();
 VegaCalendarSwitchPanelRenderer.views = [
@@ -285,38 +187,44 @@ VegaCalendarSwitchPanelRenderer.views = [
   { text: 'Week', key: 'week' },
   { text: 'Month', key: 'month' },
 ];
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "viewMode", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "calendarView", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "currentPeriod", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "moreActionDropdownProps", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "moreActionClickEmitter", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "currentPeriodController", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "calendarViewController", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "translationSlimmer", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "postOperationDate", void 0);
-__decorate$x([
+__decorate$B([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarSwitchPanelRenderer.prototype, "showSwitchView", void 0);
+__decorate$B([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarSwitchPanelRenderer.prototype, "timezone", void 0);
+__decorate$B([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarSwitchPanelRenderer.prototype, "showWeekends", void 0);
 
-var __decorate$w = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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;
@@ -343,20 +251,20 @@ class VegaCalendarViewRenderer extends globalSlimmerRegistry.VegaSlimmer {
       : this.viewWithTimeRenderer.render()));
   }
 }
-__decorate$w([
+__decorate$A([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "viewMode", void 0);
-__decorate$w([
+__decorate$A([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "showWeekends", void 0);
-__decorate$w([
+__decorate$A([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "monthViewRenderer", void 0);
-__decorate$w([
+__decorate$A([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewRenderer.prototype, "viewWithTimeRenderer", void 0);
 
-var __decorate$v = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+var __decorate$z = (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;
@@ -427,17 +335,17 @@ class VegaCalendarDateBlockRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return result;
   }
 }
-__decorate$v([
+__decorate$z([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "enableDateClick", void 0);
-__decorate$v([
+__decorate$z([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "dateClickEmitter", void 0);
-__decorate$v([
+__decorate$z([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDateBlockRenderer.prototype, "dateDblClickEmitter", void 0);
 
-var __decorate$u = (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;
@@ -592,41 +500,41 @@ class VegaCalendarMonthViewRenderer extends VegaCalendarDateBlockRenderer {
     return !element.classList.contains('more-button') && element.tagName !== 'VEGA-CALENDAR-EVENT';
   }
 }
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "viewMode", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "calendarView", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "currentPeriod", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "currentPeriodController", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "monthEventRenderer", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "translationSlimmer", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "isDateDisabled", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "showSwitchView", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "timezone", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "host", void 0);
-__decorate$u([
+__decorate$y([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthViewRenderer.prototype, "dayViewFocusSlimmer", void 0);
 
-var __decorate$t = (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;
@@ -727,38 +635,38 @@ class VegaCalendarViewWithTimeRenderer extends VegaCalendarDateBlockRenderer {
     });
   }
 }
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "viewMode", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timeLineRenderer", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timeMarkerRenderer", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "dayViewTimedEventRenderer", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "dayViewFullDayEventRenderer", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "calendarView", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "translationSlimmer", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "isDateDisabled", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "enableDateClick", void 0);
-__decorate$t([
+__decorate$x([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewWithTimeRenderer.prototype, "timezone", void 0);
 
-var __decorate$s = (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;
@@ -805,11 +713,11 @@ class VegaCalendarTimeLineRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return timeLine;
   }
 }
-__decorate$s([
+__decorate$w([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeLineRenderer.prototype, "timeFormat", void 0);
 
-var __decorate$r = (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;
@@ -820,7 +728,7 @@ class VegaCalendarViewController extends globalSlimmerRegistry.VegaSlimmer {
   constructor() {
     super(...arguments);
     this.monthViewGenerator = new monthViewGenerator.MonthViewGenerator();
-    this.weekViewGenerator = new WeekViewGenerator();
+    this.weekViewGenerator = new typeGuard.WeekViewGenerator();
     this.dayViewGenerator = new DayViewGenerator();
   }
   /**
@@ -862,26 +770,26 @@ class VegaCalendarViewController extends globalSlimmerRegistry.VegaSlimmer {
     this.calendarView = newView;
   }
 }
-__decorate$r([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarViewController.prototype, "calendarView", void 0);
-__decorate$r([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewController.prototype, "currentPeriod", void 0);
-__decorate$r([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewController.prototype, "showWeekends", void 0);
-__decorate$r([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarViewController.prototype, "currentPeriodController", void 0);
-__decorate$r([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarViewController.prototype, "initialCalendarView", null);
-__decorate$r([
+__decorate$v([
   globalSlimmerRegistry.MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarViewController.prototype, "generateCalendarView", null);
 
-var __decorate$q = (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;
@@ -890,7 +798,7 @@ var __decorate$q = (undefined && undefined.__decorate) || function (decorators,
 /** This TypeScript class `VegaCalendarCurrentPeriodController` updates the current period based on the view mode in a calendar component. */
 class VegaCalendarCurrentPeriodController extends globalSlimmerRegistry.VegaSlimmer {
   /**
-   * set new current period
+   * set new current period from VegaCalendarCurrentPeriodType
    *
    * @param {CalendarPeriod} newPeriod new value
    */
@@ -940,10 +848,7 @@ class VegaCalendarCurrentPeriodController extends globalSlimmerRegistry.VegaSlim
     if (newValue && newValue.type !== this.viewMode) {
       this.viewMode = newValue.type;
     }
-    this.changeEventEmitter.emit({
-      viewMode: newValue.type,
-      currentPeriod: this.getCurrentPeriodSummary(),
-    });
+    this.changeEventEmitter.emit(internalCalendarPeriodFactory.InternalCalendarPeriodConverter.toCalendarPeriodType(newValue));
   }
   /**
    * update the current period when view mode change
@@ -962,58 +867,57 @@ class VegaCalendarCurrentPeriodController extends globalSlimmerRegistry.VegaSlim
     this.updateCalendarPeriod(this.viewMode, this.currentPeriod.current);
   }
   /**
-   * The function `getStartDateAndEndDate` returns an array of `VegaCalendarDateType` objects based on the `startDate` and `endDate` properties of the `currentPeriod` object.
+   * set new current period from VegaCalendarPeriodType
    *
-   * @returns {VegaCalendarChangeEventType['currentPeriod']} An array of objects containing the date, month, and year properties of the currentPeriod's
-   * start date and end date.
+   * @param {VegaCalendarPeriodType} newPeriod new value
    */
-  getCurrentPeriodSummary() {
-    const { current, startDate, endDate } = this.currentPeriod;
-    return {
-      year: current.year,
-      month: current.month,
-      startDate: {
-        date: startDate.date,
-        month: startDate.month,
-        year: startDate.year,
-      },
-      endDate: {
-        date: endDate.date,
-        month: endDate.month,
-        year: endDate.year,
-      },
-    };
+  setCurrentPeriodFromExternal(newPeriod) {
+    this.setCurrentPeriod(internalCalendarPeriodFactory.InternalCalendarPeriodConverter.fromCalendarPeriodType(newPeriod, this.timezone, this.showWeekends));
+  }
+  /**
+   * Get the current calendar period.
+   *
+   * @returns {VegaCalendarPeriodType} the current calendar period
+   */
+  getCurrentPeriod() {
+    return internalCalendarPeriodFactory.InternalCalendarPeriodConverter.toCalendarPeriodType(this.currentPeriod);
   }
 }
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarCurrentPeriodController.prototype, "currentPeriod", void 0);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "changeEventEmitter", void 0);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarCurrentPeriodController.prototype, "viewMode", void 0);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "showWeekends", void 0);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarCurrentPeriodController.prototype, "timezone", void 0);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarCurrentPeriodController.prototype, "initialCurrentPeriod", null);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarCurrentPeriodController.prototype, "emitChangeEvent", null);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarCurrentPeriodController.prototype, "updateCurrentPeriodByViewMode", null);
-__decorate$q([
+__decorate$u([
   globalSlimmerRegistry.MapToComponentMethod('watchShowWeekendsChange')
 ], VegaCalendarCurrentPeriodController.prototype, "updateCurrentPeriodAfterHideWeekEndsChange", null);
+__decorate$u([
+  globalSlimmerRegistry.MapToComponentMethod('setCurrentPeriod')
+], VegaCalendarCurrentPeriodController.prototype, "setCurrentPeriodFromExternal", null);
+__decorate$u([
+  globalSlimmerRegistry.MapToComponentMethod('getCurrentPeriod')
+], VegaCalendarCurrentPeriodController.prototype, "getCurrentPeriod", null);
 
-var __decorate$p = (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;
@@ -1206,31 +1110,31 @@ class VegaCalendarMonthEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
       });
   }
 }
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "viewMode", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "host", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "renderer", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarMonthEventRenderer.prototype, "eventPreviewPopoverController", void 0);
-__decorate$p([
+__decorate$t([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarMonthEventRenderer.prototype, "addMaxDisplayCountChange", null);
 
@@ -2153,7 +2057,7 @@ class CalendarEvent {
   }
 }
 
-var __decorate$o = (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;
@@ -2270,32 +2174,32 @@ class VegaCalendarEventController extends globalSlimmerRegistry.VegaSlimmer {
     }
   }
 }
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "host", void 0);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventController.prototype, "calendarEvents", void 0);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "currentPeriod", void 0);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "events", void 0);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventController.prototype, "timezone", void 0);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentMethod('watchEventsChange')
 ], VegaCalendarEventController.prototype, "updateAfterEventChange", null);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventController.prototype, "updateWhenComponentWillLoad", null);
-__decorate$o([
+__decorate$s([
   globalSlimmerRegistry.MapToComponentMethod('watchTimezoneChange')
 ], VegaCalendarEventController.prototype, "updateAfterTimezoneChange", null);
 
-var __decorate$n = (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;
@@ -2362,32 +2266,32 @@ class VegaCalendarEventItemRenderer extends globalSlimmerRegistry.VegaSlimmer {
   }
 }
 VegaCalendarEventItemRenderer.backgroundColorModeEventHeight = 18;
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "host", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "calendarView", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventClickEmitter", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "timeFormat", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "enabledEventPreview", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "renderer", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventPreviewPopoverController", void 0);
-__decorate$n([
+__decorate$r([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventPreviewActionsController", void 0);
 
-var __decorate$m = (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;
@@ -2439,23 +2343,23 @@ class VegaCalendarEventResponsiveController extends pageResizeObserverSlimmer.Pa
   }
 }
 VegaCalendarEventResponsiveController.monthDateTitleHeight = 26;
-__decorate$m([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "host", void 0);
-__decorate$m([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "monthEventRenderer", void 0);
-__decorate$m([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventResponsiveController.prototype, "viewMode", void 0);
-__decorate$m([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentMethod('componentDidLoad')
 ], VegaCalendarEventResponsiveController.prototype, "updateMaxDisplayCount", null);
-__decorate$m([
+__decorate$q([
   globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarEventResponsiveController.prototype, "updateMaxDisplayCountAfterSwitchToMonthView", null);
 
-var __decorate$l = (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;
@@ -2520,26 +2424,26 @@ class VegaCalendarFullDayEventRenderer extends globalSlimmerRegistry.VegaSlimmer
   }
 }
 VegaCalendarFullDayEventRenderer.maxDisplayEventLength = 2;
-__decorate$l([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "calendarView", void 0);
-__decorate$l([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$l([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$l([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$l([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "showAllEventsInDayOrWeekView", void 0);
-__decorate$l([
+__decorate$p([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventRenderer.prototype, "dayViewFullDayEventMoreButtonRenderer", void 0);
 
-var __decorate$k = (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;
@@ -2604,10 +2508,10 @@ class VegaCalendarDayViewEventLayoutRenderer extends globalSlimmerRegistry.VegaS
   }
 }
 VegaCalendarDayViewEventLayoutRenderer.TOTAL_NUMBER_OF_CELLS = 24 * 4;
-__decorate$k([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDayViewEventLayoutRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$k([
+__decorate$o([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDayViewEventLayoutRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
 
@@ -2895,7 +2799,7 @@ class VegaCalendarEventSorter {
   }
 }
 
-var __decorate$j = (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;
@@ -2934,13 +2838,13 @@ class VegaCalendarTimedEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return this.dayViewEventLayoutRenderer.render(layout, date);
   }
 }
-__decorate$j([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "calendarView", void 0);
-__decorate$j([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "calendarEventController", void 0);
-__decorate$j([
+__decorate$n([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimedEventRenderer.prototype, "dayViewEventLayoutRenderer", void 0);
 
@@ -3109,7 +3013,7 @@ class VegaCalendarFullDayEventLayoutGenerator extends VegaCalendarBaseEventLayou
   }
 }
 
-var __decorate$i = (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;
@@ -3194,20 +3098,20 @@ class VegaCalendarFullDayEventLayoutRenderer extends globalSlimmerRegistry.VegaS
   }
 }
 VegaCalendarFullDayEventLayoutRenderer.monthViewEventOffsetTop = 26;
-__decorate$i([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$i([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "viewMode", void 0);
-__decorate$i([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "calendarView", void 0);
-__decorate$i([
+__decorate$m([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarFullDayEventLayoutRenderer.prototype, "eventPreviewPopoverRenderer", void 0);
 
-var __decorate$h = (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;
@@ -3244,14 +3148,14 @@ class VegaCalendarFullDayEventMoreButtonRenderer extends globalSlimmerRegistry.V
     this.showAllEventsInDayOrWeekView = false;
   }
 }
-__decorate$h([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarFullDayEventMoreButtonRenderer.prototype, "showAllEventsInDayOrWeekView", void 0);
-__decorate$h([
+__decorate$l([
   globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarFullDayEventMoreButtonRenderer.prototype, "resetShowAllFlag", null);
 
-var __decorate$g = (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;
@@ -3416,29 +3320,29 @@ class VegaCalendarTimeMarkerRenderer extends globalSlimmerRegistry.VegaSlimmer {
     return 0;
   }
 }
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "viewMode", void 0);
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "viewRenderer", void 0);
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTimeMarkerRenderer.prototype, "timezone", void 0);
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
 ], VegaCalendarTimeMarkerRenderer.prototype, "updateTimeLine", null);
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
 ], VegaCalendarTimeMarkerRenderer.prototype, "clearTimer", null);
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
 ], VegaCalendarTimeMarkerRenderer.prototype, "updateTimeLineIfComponentAddBack", null);
-__decorate$g([
+__decorate$k([
   globalSlimmerRegistry.MapToComponentMethod('componentDidLoad')
 ], VegaCalendarTimeMarkerRenderer.prototype, "displayCurrentTimeBlockByDefault", null);
 
-var __decorate$f = (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;
@@ -3498,20 +3402,20 @@ class VegaCalendarPostOperationDateController extends globalSlimmerRegistry.Vega
       !newValue.current.equal(typeGuard.CalendarDate.from(new Date(), this.timezone)));
   }
 }
-__decorate$f([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarPostOperationDateController.prototype, "postOperationDate", void 0);
-__decorate$f([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarPostOperationDateController.prototype, "timezone", void 0);
-__decorate$f([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentMethod('watchCurrentPeriodChange')
 ], VegaCalendarPostOperationDateController.prototype, "setDate", null);
-__decorate$f([
+__decorate$j([
   globalSlimmerRegistry.MapToComponentMethod('watchTimezoneChange')
 ], VegaCalendarPostOperationDateController.prototype, "updateAfterTimezoneChange", null);
 
-var __decorate$e = (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;
@@ -3553,29 +3457,29 @@ class VegaCalendarEventPreviewPopoverRenderer extends globalSlimmerRegistry.Vega
   }
 }
 VegaCalendarEventPreviewPopoverRenderer.SINGLE_EVENT_PREVIEW_WIDTH = 400;
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "host", void 0);
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "renderer", void 0);
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "viewMode", void 0);
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "timeFormat", void 0);
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventItemRenderer", void 0);
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "enabledEventPreview", void 0);
-__decorate$e([
+__decorate$i([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventPreviewPopoverController", void 0);
 
-var __decorate$d = (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;
@@ -3671,11 +3575,11 @@ class VegaCalendarEventPreviewPopoverController extends globalSlimmerRegistry.Ve
     return `-${viewDate.year}-${viewDate.month}-${viewDate.date}`;
   }
 }
-__decorate$d([
+__decorate$h([
   globalSlimmerRegistry.MapToComponentMethod('watchTimezoneChange')
 ], VegaCalendarEventPreviewPopoverController.prototype, "clearAllPreviewContainers", null);
 
-var __decorate$c = (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;
@@ -3704,7 +3608,7 @@ class VegaCalendarDayViewFocusSlimmer extends autoRunWhenReRenderTaskQueueSlimme
     }
   }
 }
-__decorate$c([
+__decorate$g([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarDayViewFocusSlimmer.prototype, "host", void 0);
 
@@ -3720,7 +3624,7 @@ 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 __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;
@@ -3826,29 +3730,29 @@ class VegaCalendarEventPreviewDetailRenderer extends globalSlimmerRegistry.VegaS
     pen: penIcon,
   });
 })();
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "host", void 0);
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "previewPayload", void 0);
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "currentEvent", void 0);
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "eventActions", void 0);
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "translationSlimmer", void 0);
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "componentWillLoad", null);
-__decorate$b([
+__decorate$f([
   globalSlimmerRegistry.MapToComponentMethod('componentDidRender')
 ], VegaCalendarEventPreviewDetailRenderer.prototype, "componentDidRender", null);
 
-var __decorate$a = (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;
@@ -3909,26 +3813,26 @@ class EventPreviewActionsController extends globalSlimmerRegistry.VegaSlimmer {
     domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalCalendarPreviewActionClick);
   }
 }
-__decorate$a([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], EventPreviewActionsController.prototype, "host", void 0);
-__decorate$a([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], EventPreviewActionsController.prototype, "eventEditable", void 0);
-__decorate$a([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], EventPreviewActionsController.prototype, "getEventPreviewActions", void 0);
-__decorate$a([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentField()
 ], EventPreviewActionsController.prototype, "eventEditEmitter", void 0);
-__decorate$a([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
 ], EventPreviewActionsController.prototype, "registerPreviewActionButtonEvent", null);
-__decorate$a([
+__decorate$e([
   globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
 ], EventPreviewActionsController.prototype, "unregisterPreviewActionButtonEvent", null);
 
-var __decorate$9 = (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;
@@ -4059,25 +3963,25 @@ class VegaCalendarKeyboardController extends keyboardManagerSlimmer.KeyboardMana
     }
   }
 }
-__decorate$9([
+__decorate$d([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarKeyboardController.prototype, "host", void 0);
-__decorate$9([
+__decorate$d([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarKeyboardController.prototype, "showWeekends", void 0);
-__decorate$9([
+__decorate$d([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarKeyboardController.prototype, "monthViewRenderer", void 0);
-__decorate$9([
+__decorate$d([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarKeyboardController.prototype, "monthEventRenderer", void 0);
-__decorate$9([
+__decorate$d([
   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%}";
+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-view-switch-container{display:flex;gap:16px;align-items:center;flex-direction:row}.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 __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);
@@ -4140,6 +4044,7 @@ const VegaCalendar = class {
     this.changeEventPrevent = new childNodesEventPreventSlimmer.ChildNodesEventPreventSlimmer([vegaEventId.VegaChange], () => this.switchPanelRenderer.getSwitchPanelRef());
     this.timeFormatNotifySlimmer = subStateNotifySlimmer.createSubStateNotifySlimmer(VegaCalendar, 'timeFormat', 'watchTimeFormat');
     this.showEventColorBarNotifySlimmer = subStateNotifySlimmer.createSubStateNotifySlimmer(VegaCalendar, 'showEventColorBar', 'watchShowEventColorBar');
+    this.currentPeriodNotifySlimmer = subStateNotifySlimmer.createSubStateNotifySlimmer(VegaCalendar, 'currentPeriod', 'watchCurrentPeriodChange');
     /**
      * This postOperationDate will record the time after the operation, which will affect the calculation of day/week/month, making the generated interval accurate
      *
@@ -4267,6 +4172,22 @@ const VegaCalendar = class {
    */
   watchTimezoneChange() {
   }
+  /**
+   * Invoke this method to set the current calendar period.
+   * Use `VegaCalendarPeriodFactory.fromDate` to create a `VegaCalendarPeriodType` from a date if needed.
+   *
+   * @vegaVersion 2.91.0
+   */
+  async setCurrentPeriod(period) {
+  }
+  /**
+   * Invoke this method to get the current calendar period.
+   *
+   * @vegaVersion 2.91.0
+   */
+  async getCurrentPeriod() {
+    return placeholder.methodPlaceholder();
+  }
   render() {
     return component.sanitizeVegaComponent(index.h(index.Host, null, this.renderer.render()), this.host);
   }
@@ -4287,121 +4208,124 @@ const VegaCalendar = class {
     "timezone": ["watchTimezoneChange"]
   }; }
 };
-__decorate$8([
+__decorate$c([
   componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
 ], VegaCalendar.prototype, "globalSlimmer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "translationSlimmer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "renderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "switchPanelRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFocusSlimmer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "viewRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "monthViewRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "viewWithTimeRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeLineRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeMarkerRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "monthEventRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "currentPeriodController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "keyboardController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "calendarViewController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "postOperationDateController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFullDayEventRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewPopoverController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewFullDayEventMoreButtonRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewTimedEventRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventItemRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dayViewEventLayoutRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "fullDayEventLayoutRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewPopoverRenderer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "calendarEventController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventPreviewActionsController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventResponsiveController", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "changeEventEmitter", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventClickEmitter", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateDblClickEmitter", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "moreActionClickEmitter", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateClickEmitter", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventEditEmitter", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "changeEventPrevent", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "timeFormatNotifySlimmer", void 0);
-__decorate$8([
+__decorate$c([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendar.prototype, "showEventColorBarNotifySlimmer", void 0);
+__decorate$c([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendar.prototype, "currentPeriodNotifySlimmer", void 0);
 VegaCalendar.style = vegaCalendarCss;
 
 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$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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;
@@ -4562,23 +4486,23 @@ class VegaCalendarEventRenderer extends globalSlimmerRegistry.VegaSlimmer {
     'clock-three': clockThree,
   });
 })();
-__decorate$7([
+__decorate$b([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "host", void 0);
-__decorate$7([
+__decorate$b([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "timeFormat", void 0);
-__decorate$7([
+__decorate$b([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "calendarEvent", void 0);
-__decorate$7([
+__decorate$b([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "slotMode", void 0);
-__decorate$7([
+__decorate$b([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventRenderer.prototype, "showColorBar", void 0);
 
-var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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;
@@ -4612,14 +4536,14 @@ class VegaCalendarEventSubStateController extends subStateObserverSlimmer.SubSta
     });
   }
 }
-__decorate$6([
+__decorate$a([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventSubStateController.prototype, "timeFormat", void 0);
-__decorate$6([
+__decorate$a([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventSubStateController.prototype, "showColorBar", void 0);
 
-var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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;
@@ -4651,11 +4575,11 @@ class VegaCalendarTitleMaxHeightController extends globalSlimmerRegistry.VegaSli
     }
   }
 }
-__decorate$5([
+__decorate$9([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarTitleMaxHeightController.prototype, "renderer", void 0);
 
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+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);
   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;
@@ -4712,28 +4636,28 @@ class VegaCalendarEventSlotController extends globalSlimmerRegistry.VegaSlimmer
     return this.host.classList.contains('calendar-event-in-popover');
   }
 }
-__decorate$4([
+__decorate$8([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "host", void 0);
-__decorate$4([
+__decorate$8([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "calendarEvent", void 0);
-__decorate$4([
+__decorate$8([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventSlotController.prototype, "slotMode", void 0);
-__decorate$4([
+__decorate$8([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventSlotController.prototype, "renderer", void 0);
-__decorate$4([
+__decorate$8([
   globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
 ], VegaCalendarEventSlotController.prototype, "findTheCalendarEventSlot", null);
-__decorate$4([
+__decorate$8([
   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$3 = (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);
@@ -4772,30 +4696,30 @@ const VegaCalendarEvent = class {
   }
   get host() { return index.getElement(this); }
 };
-__decorate$3([
+__decorate$7([
   componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
 ], VegaCalendarEvent.prototype, "globalSlimmer", void 0);
-__decorate$3([
+__decorate$7([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "pageResizeObserverSlimmer", void 0);
-__decorate$3([
+__decorate$7([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
-__decorate$3([
+__decorate$7([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "renderer", void 0);
-__decorate$3([
+__decorate$7([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "slotController", void 0);
-__decorate$3([
+__decorate$7([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "subStateController", void 0);
-__decorate$3([
+__decorate$7([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEvent.prototype, "titleMaxHeightController", void 0);
 VegaCalendarEvent.style = vegaCalendarEventCss;
 
-var __decorate$2 = (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;
@@ -4824,28 +4748,28 @@ class VegaCalendarEventPreviewStateController extends globalSlimmerRegistry.Vega
     domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.host, vegaInternalEventId.VegaInternalCalendarEventPreviewClear);
   }
 }
-__decorate$2([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaCalendarEventPreviewStateController.prototype, "host", void 0);
-__decorate$2([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "currentEvent", void 0);
-__decorate$2([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "previewPayload", void 0);
-__decorate$2([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaCalendarEventPreviewStateController.prototype, "eventActions", void 0);
-__decorate$2([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentMethod('connectedCallback')
 ], VegaCalendarEventPreviewStateController.prototype, "registerEventPreviewUpdateObserver", null);
-__decorate$2([
+__decorate$6([
   globalSlimmerRegistry.MapToComponentMethod('disconnectedCallback')
 ], VegaCalendarEventPreviewStateController.prototype, "unregisterEventPreviewUpdateObserver", 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) {
+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);
@@ -4870,26 +4794,26 @@ const VegaCalendarEventPreview = class {
   }
   get host() { return index.getElement(this); }
 };
-__decorate$1([
+__decorate$5([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEventPreview.prototype, "detailRenderer", void 0);
-__decorate$1([
+__decorate$5([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEventPreview.prototype, "stateController", void 0);
-__decorate$1([
+__decorate$5([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEventPreview.prototype, "translationSlimmer", void 0);
-__decorate$1([
+__decorate$5([
   componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
 ], VegaCalendarEventPreview.prototype, "globalSlimmer", void 0);
-__decorate$1([
+__decorate$5([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEventPreview.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
 VegaCalendarEventPreview.style = vegaCalendarEventPreviewCss;
 
 const vegaCalendarEventSlotCss = ":host{width:100%;height:100%;position:relative}";
 
-var __decorate = (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);
@@ -4910,15 +4834,362 @@ const VegaCalendarEventSlot = class {
   }
   get host() { return index.getElement(this); }
 };
-__decorate([
+__decorate$4([
   componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
 ], VegaCalendarEventSlot.prototype, "globalSlimmer", void 0);
-__decorate([
+__decorate$4([
   globalSlimmerRegistry.InjectVegaSlimmer()
 ], VegaCalendarEventSlot.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
 VegaCalendarEventSlot.style = vegaCalendarEventSlotCss;
 
+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);
+  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 current period of a calendar component.
+ */
+class VegaCalendarPeriodCurrentPeriodController extends globalSlimmerRegistry.VegaSlimmer {
+  /**
+   * Initialize the current period based on the view mode and timezone.
+   * This method is called when the component loads and when relevant properties change.
+   */
+  componentWillLoad() {
+    this.updateCalendarPeriod(this.viewMode, typeGuard.CalendarDate.from(new Date(), this.timezone));
+  }
+  /**
+   * set new current period from VegaCalendarPeriodType
+   *
+   * @param {CalendarPeriod} newPeriod new value
+   */
+  setCurrentPeriod(newPeriod) {
+    this.currentPeriod = newPeriod;
+  }
+  /**
+   * The calendar period should update when the property viewMode changes
+   */
+  watchViewModeChange() {
+    if (this.currentPeriod && this.viewMode !== this.currentPeriod.type) {
+      this.updateCalendarPeriod(this.viewMode, this.currentPeriod.current);
+    }
+  }
+  /**
+   * The calendar period should update when the property showWeekends changes
+   */
+  watchShowWeekendsChange() {
+    if (this.currentPeriod && this.showWeekends !== this.currentPeriod.showWeekends) {
+      this.updateCalendarPeriod(this.viewMode, this.currentPeriod.current);
+    }
+  }
+  /**
+   * The calendar period should update when the property timezone changes
+   */
+  watchTimezoneChange() {
+    if (this.currentPeriod && this.timezone !== this.currentPeriod.timezone) {
+      this.updateCalendarPeriod(this.viewMode, this.currentPeriod.current);
+    }
+  }
+  /**
+   * Watch for changes in the current period and emit an event if it changes.
+   *
+   * @param {CalendarPeriod} newValue - The new current period.
+   * @param {CalendarPeriod} oldValue - The previous current period.
+   */
+  watchCurrentPeriodChange(newValue, oldValue) {
+    if (newValue &&
+      oldValue &&
+      newValue.startDate.equal(oldValue.startDate) &&
+      newValue.endDate.equal(oldValue.endDate)) {
+      return;
+    }
+    if (newValue && newValue.type !== this.viewMode) {
+      this.viewMode = newValue.type;
+    }
+    changeManager.ChangeManager.notify(domNodeSubjectObserverFactory.domNodeSubjectFactory.getSubject(this.host, vegaInternalEventId.VegaInternalCurrentPeriodChange), {
+      detail: this.currentPeriod,
+    });
+    this.changeEventEmitter.emit(internalCalendarPeriodFactory.InternalCalendarPeriodConverter.toCalendarPeriodType(this.currentPeriod));
+  }
+  /**
+   * Get the current calendar period.
+   *
+   * @param {VegaCalendarPeriodType} period - The new calendar period to set.
+   */
+  setCurrentPeriodFromExternal(period) {
+    this.setCurrentPeriod(internalCalendarPeriodFactory.InternalCalendarPeriodConverter.fromCalendarPeriodType(period, this.timezone, this.showWeekends));
+  }
+  /**
+   * Get the current calendar period.
+   *
+   * @returns {VegaCalendarPeriodType} the current calendar period
+   */
+  getCurrentPeriod() {
+    return internalCalendarPeriodFactory.InternalCalendarPeriodConverter.toCalendarPeriodType(this.currentPeriod);
+  }
+  /**
+   * Update the current calendar period based on the view mode and a reference date.
+   *
+   * @param {VegaCalendarViewModeType} viewMode - The current view mode of the calendar.
+   * @param {CalendarDate} date - A reference date to calculate the new period.
+   */
+  updateCalendarPeriod(viewMode, date) {
+    switch (viewMode) {
+      case 'month':
+        this.setCurrentPeriod(new typeGuard.MonthPeriod(date, this.showWeekends, this.timezone));
+        break;
+      case 'week':
+        date = this.showWeekends === false ? typeGuard.getClosestWorkday(date) : date;
+        this.setCurrentPeriod(new typeGuard.WeekPeriod(date, this.showWeekends, this.timezone));
+        break;
+      case 'day':
+        this.setCurrentPeriod(new typeGuard.DayPeriod(date, this.showWeekends, this.timezone));
+        break;
+    }
+  }
+}
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodCurrentPeriodController.prototype, "host", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField({ writable: true })
+], VegaCalendarPeriodCurrentPeriodController.prototype, "currentPeriod", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField({ writable: true })
+], VegaCalendarPeriodCurrentPeriodController.prototype, "viewMode", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodCurrentPeriodController.prototype, "timezone", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodCurrentPeriodController.prototype, "showWeekends", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodCurrentPeriodController.prototype, "changeEventEmitter", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('componentWillLoad')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "componentWillLoad", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('watchViewModeChange')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "watchViewModeChange", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('watchShowWeekendsChange')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "watchShowWeekendsChange", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('watchTimezoneChange')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "watchTimezoneChange", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('watchCurrentPeriodChange')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "watchCurrentPeriodChange", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('setCurrentPeriod')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "setCurrentPeriodFromExternal", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('getCurrentPeriod')
+], VegaCalendarPeriodCurrentPeriodController.prototype, "getCurrentPeriod", null);
+
+const chevronRight = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 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="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>`,
+};
+
+const chevronLeft = {
+  icon: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 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="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z"/></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 VegaCalendarPeriodRenderer extends globalSlimmerRegistry.VegaSlimmer {
+  render() {
+    return (index.h("div", { class: "calendar-date-switch-container" },
+      this.renderTodayButton(),
+      this.renderPreviousButton(),
+      this.renderNextButton(),
+      this.renderDateSummary()));
+  }
+  renderTodayButton() {
+    return (index.h("vega-button", { variant: "secondary", size: "small", ref: (button) => {
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(button, vegaEventId.VegaClick, () => this.currentPeriodController.setCurrentPeriod(this.currentPeriod.now()));
+      }, label: this.translationSlimmer.t('Today') }));
+  }
+  renderPreviousButton() {
+    return (index.h("vega-button-circle", { variant: "secondary", size: "small", icon: internalIconManager.VegaInternalIconManager.getIconKey('chevron-left'), label: this.translationSlimmer.t('Previous'), showTooltip: false, ref: (button) => {
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(button, vegaEventId.VegaClick, () => this.currentPeriodController.setCurrentPeriod(this.currentPeriod.previous()));
+      } }));
+  }
+  renderNextButton() {
+    return (index.h("vega-button-circle", { variant: "secondary", size: "small", icon: internalIconManager.VegaInternalIconManager.getIconKey('chevron-right'), label: this.translationSlimmer.t('Next'), showTooltip: false, ref: (button) => {
+        domNodeSubjectObserverFactory.DomNodeSubjectObserverFactory.addUniqueObserverToNode(button, vegaEventId.VegaClick, () => this.currentPeriodController.setCurrentPeriod(this.currentPeriod.next()));
+      } }));
+  }
+  renderDateSummary() {
+    return (index.h("vega-font", { class: "calendar-current-date", variant: "font-field-label", color: "text-primary" }, this.currentPeriod.getViewDateSummary()));
+  }
+}
+(() => {
+  internalIconManager.VegaInternalIconManager.register({
+    'chevron-right': chevronRight,
+    'chevron-left': chevronLeft,
+  });
+})();
+__decorate$2([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodRenderer.prototype, "currentPeriod", void 0);
+__decorate$2([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodRenderer.prototype, "translationSlimmer", void 0);
+__decorate$2([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodRenderer.prototype, "currentPeriodController", void 0);
+
+var __decorate$1 = (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;
+};
+/** The `VegaCalendarPeriodStateController` class in TypeScript initializes a calendar with specified subStates. */
+class VegaCalendarPeriodStateController extends subStateObserverSlimmer.SubStateObserverSlimmer {
+  /**
+   * The constructor function initializes a calendar with specified subStates in TypeScript.
+   */
+  constructor() {
+    super({
+      parent: 'vega-calendar',
+      subStates: [
+        {
+          subStateName: 'currentPeriod',
+          parentStateName: 'currentPeriod',
+          // eslint-disable-next-line jsdoc/require-jsdoc
+          callback: (value) => {
+            this.currentPeriodController.setCurrentPeriod(value);
+          },
+        },
+      ],
+    });
+  }
+}
+__decorate$1([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaCalendarPeriodStateController.prototype, "currentPeriodController", void 0);
+
+const vegaCalendarPeriodSwitcherCss = ":host{display:flex;align-items:center}.calendar-date-switch-container{display:flex;gap:8px;align-items:center;flex-direction:row}.calendar-current-date{padding-left:8px}";
+
+var __decorate = (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;
+};
+const VegaCalendarPeriodSwitcher = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.vegaChange = index.createEvent(this, "vegaChange", 7);
+    this.change = index.createEvent(this, "change", 7);
+    this.translationSlimmer = new translationSlimmer.TranslationSlimmer();
+    this.changeEventEmitter = eventEmitSlimmer.createEventEmitSlimmer(VegaCalendarPeriodSwitcher, vegaEventId.VegaChange);
+    this.globalSlimmer = {};
+    this.vegaComponentUsageRuntimeMetricsSlimmer = new componentUsageRuntimeMetrics.VegaComponentUsageRuntimeMetricsSlimmer();
+    this.currentPeriodController = new VegaCalendarPeriodCurrentPeriodController();
+    this.stateController = new VegaCalendarPeriodStateController();
+    this.renderer = new VegaCalendarPeriodRenderer();
+    /**
+     * Specifies the current view mode of the calendar period switcher.
+     *
+     * @vegaVersion 2.91.0
+     */
+    /* eslint-disable-next-line @stencil/strict-mutable */
+    this.viewMode = 'month';
+    /**
+     * Specifies the IANA time zone or Etc/GMT±n format.
+     *  It accepts values such as "America/New_York" or "Etc/GMT+12".
+     *  If not set, the component defaults to the system's time zone.
+     *  For a complete list of IANA time zones, see Time Zone DB(https://timezonedb.com/time-zones).
+     *
+     * @vegaVersion 2.91.0
+     */
+    this.timezone = typeGuard.getSystemTimezone();
+    /**
+     * Determines whether weekends are displayed in the calendar period switcher.
+     *
+     * @vegaVersion 2.91.0
+     */
+    this.showWeekends = true;
+  }
+  /**
+   * Tracks changes to the current period state.
+   *
+   * @param {CalendarPeriod} newValue Specifies the new calendar period.
+   * @param {CalendarPeriod} oldValue Specifies the old calendar period.
+   */
+  watchCurrentPeriodChange(newValue, oldValue) {
+  }
+  watchViewModeChange() {
+  }
+  watchTimezoneChange() {
+  }
+  watchShowWeekendsChange() {
+  }
+  /**
+   * Invoke this method to set the current calendar period.
+   * Use `VegaCalendarPeriodFactory.fromDate` to create a `VegaCalendarPeriodType` from a date if needed.
+   *
+   * @vegaVersion 2.91.0
+   */
+  async setCurrentPeriod(period) {
+  }
+  /**
+   * Invoke this method to get the current calendar period.
+   *
+   * @vegaVersion 2.91.0
+   */
+  async getCurrentPeriod() {
+    return placeholder.methodPlaceholder();
+  }
+  render() {
+    return component.sanitizeVegaComponent(index.h(index.Host, null, this.renderer.render()), this.host);
+  }
+  get host() { return index.getElement(this); }
+  static get watchers() { return {
+    "currentPeriod": ["watchCurrentPeriodChange"],
+    "viewMode": ["watchViewModeChange"],
+    "timezone": ["watchTimezoneChange"],
+    "showWeekends": ["watchShowWeekendsChange"]
+  }; }
+};
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "translationSlimmer", void 0);
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "changeEventEmitter", void 0);
+__decorate([
+  componentUsageRuntimeMetrics.InjectVegaGlobalSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "globalSlimmer", void 0);
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "currentPeriodController", void 0);
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "stateController", void 0);
+__decorate([
+  globalSlimmerRegistry.InjectVegaSlimmer()
+], VegaCalendarPeriodSwitcher.prototype, "renderer", void 0);
+VegaCalendarPeriodSwitcher.style = vegaCalendarPeriodSwitcherCss;
+
 exports.vega_calendar = VegaCalendar;
 exports.vega_calendar_event = VegaCalendarEvent;
 exports.vega_calendar_event_preview = VegaCalendarEventPreview;
 exports.vega_calendar_event_slot = VegaCalendarEventSlot;
+exports.vega_calendar_period_switcher = VegaCalendarPeriodSwitcher;