@eui/eds 23.0.0-alpha.11 → 23.0.0-alpha.13

package/fesm2022/eui-eds-eds-calendar.mjs

@@ -20,10 +20,10 @@ import * as i2$2 from '@eui/eds/eds-dropdown';
 import { EDS_DROPDOWN } from '@eui/eds/eds-dropdown';
 
 class EdsCalendar {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCalendar, isStandalone: true, selector: "eds-calendar", host: { properties: { "attr.data-e2e": "\"eds-calendar\"" }, classAttribute: "eds-calendar" }, ngImport: i0, template: "<ng-content select=\"eds-calendar-header\" />\n<ng-content select=\"eds-calendar-monthly\" />\n<ng-content select=\"eds-calendar-weekly\" />\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCalendar, isStandalone: true, selector: "eds-calendar", host: { properties: { "attr.data-e2e": "\"eds-calendar\"" }, classAttribute: "eds-calendar" }, ngImport: i0, template: "<ng-content select=\"eds-calendar-header\" />\n<ng-content select=\"eds-calendar-monthly\" />\n<ng-content select=\"eds-calendar-weekly\" />\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendar, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], host: {
                         class: 'eds-calendar',
@@ -300,10 +300,10 @@ class EdsCalendarHeader {
         }
         throw new Error('Starting day must be a string (day name) or number (0-6).');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarHeader, isStandalone: true, selector: "eds-calendar-header", inputs: { containWeekends: { classPropertyName: "containWeekends", publicName: "containWeekends", isSignal: true, isRequired: false, transformFunction: null }, dateFormatOptions: { classPropertyName: "dateFormatOptions", publicName: "dateFormatOptions", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, currentDate: { classPropertyName: "currentDate", publicName: "currentDate", isSignal: true, isRequired: true, transformFunction: null }, subLabel: { classPropertyName: "subLabel", publicName: "subLabel", isSignal: true, isRequired: false, transformFunction: null }, showTodayButton: { classPropertyName: "showTodayButton", publicName: "showTodayButton", isSignal: true, isRequired: false, transformFunction: null }, showNavigationButtons: { classPropertyName: "showNavigationButtons", publicName: "showNavigationButtons", isSignal: true, isRequired: false, transformFunction: null }, startingDay: { classPropertyName: "startingDay", publicName: "startingDay", isSignal: true, isRequired: false, transformFunction: null }, customTemplate: { classPropertyName: "customTemplate", publicName: "customTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentDate: "currentDateChange", navigationClicked: "navigationClicked", todayClicked: "todayClicked" }, host: { classAttribute: "eds-calendar-header" }, ngImport: i0, template: "@if (customTemplate(); as template) {\n    <ng-container [ngTemplateOutletContext]=\"headerContext()\" [ngTemplateOutlet]=\"template\" />\n} @else {\n    <div class=\"eds-calendar-header__nav\">\n        <div class=\"eds-calendar-header__left\">\n            @if (showNavigationButtons()) {\n                <button edsIconButton edsNeutral edsSizeS icon=\"caret-left:core\" ariaLabel=\"Go to previous\" (click)=\"navigatePrevious()\"></button>\n            }\n            <div class=\"eds-calendar-header__label\" [style.min-width]=\"maxMonthWidth()\">\n                <span class=\"eds-calendar-header__date\">{{ formattedDate() }}</span>\n                @if (subLabel()) {\n                    <span class=\"eds-calendar-header__sublabel\">{{ subLabel() }}</span>\n                }\n            </div>\n            @if (showNavigationButtons()) {\n                <button edsIconButton edsNeutral edsSizeS icon=\"caret-right:core\" ariaLabel=\"Go to next\" (click)=\"navigateNext()\"></button>\n            }\n        </div>\n        @if (showTodayButton()) {\n            <button edsButton edsNeutral [disabled]=\"isCurrentDateToday()\" (click)=\"goToToday()\">Today</button>\n        }\n    </div>\n}\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block}.eui-21 :host .eds-calendar-header__nav{display:flex;justify-content:space-between;align-items:center;gap:var(--eds-sp-s)}.eui-21 :host .eds-calendar-header__left{display:flex;align-items:center;gap:var(--eds-sp-s)}.eui-21 :host .eds-calendar-header__label{display:flex;flex-direction:column;align-items:flex-start}.eui-21 :host .eds-calendar-header__date{font:var(--eds-f-label-l-semi-bold)}.eui-21 :host .eds-calendar-header__sublabel{font:var(--eds-f-paragraph-xs);color:var(--eds-c-foreground-subtler)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i2.EdsButton, selector: "button[edsButton]", inputs: ["e2eAttr", "id", "edsBlockButton", "edsIconButton", "edsAvatarButton", "edsLineWrap", "edsButtonPrimary", "edsButtonSecondary", "edsButtonTertiary", "edsButtonRounded", "edsTypeVariant", "isChecked", "edsDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarHeader, isStandalone: true, selector: "eds-calendar-header", inputs: { containWeekends: { classPropertyName: "containWeekends", publicName: "containWeekends", isSignal: true, isRequired: false, transformFunction: null }, dateFormatOptions: { classPropertyName: "dateFormatOptions", publicName: "dateFormatOptions", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, currentDate: { classPropertyName: "currentDate", publicName: "currentDate", isSignal: true, isRequired: true, transformFunction: null }, subLabel: { classPropertyName: "subLabel", publicName: "subLabel", isSignal: true, isRequired: false, transformFunction: null }, showTodayButton: { classPropertyName: "showTodayButton", publicName: "showTodayButton", isSignal: true, isRequired: false, transformFunction: null }, showNavigationButtons: { classPropertyName: "showNavigationButtons", publicName: "showNavigationButtons", isSignal: true, isRequired: false, transformFunction: null }, startingDay: { classPropertyName: "startingDay", publicName: "startingDay", isSignal: true, isRequired: false, transformFunction: null }, customTemplate: { classPropertyName: "customTemplate", publicName: "customTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { currentDate: "currentDateChange", navigationClicked: "navigationClicked", todayClicked: "todayClicked" }, host: { classAttribute: "eds-calendar-header" }, ngImport: i0, template: "@if (customTemplate(); as template) {\n    <ng-container [ngTemplateOutletContext]=\"headerContext()\" [ngTemplateOutlet]=\"template\" />\n} @else {\n    <div class=\"eds-calendar-header__nav\">\n        <div class=\"eds-calendar-header__left\">\n            @if (showNavigationButtons()) {\n                <button edsIconButton edsNeutral edsSizeS icon=\"caret-left:core\" ariaLabel=\"Go to previous\" (click)=\"navigatePrevious()\"></button>\n            }\n            <div class=\"eds-calendar-header__label\" [style.min-width]=\"maxMonthWidth()\">\n                <span class=\"eds-calendar-header__date\">{{ formattedDate() }}</span>\n                @if (subLabel()) {\n                    <span class=\"eds-calendar-header__sublabel\">{{ subLabel() }}</span>\n                }\n            </div>\n            @if (showNavigationButtons()) {\n                <button edsIconButton edsNeutral edsSizeS icon=\"caret-right:core\" ariaLabel=\"Go to next\" (click)=\"navigateNext()\"></button>\n            }\n        </div>\n        @if (showTodayButton()) {\n            <button edsButton edsNeutral [disabled]=\"isCurrentDateToday()\" (click)=\"goToToday()\">Today</button>\n        }\n    </div>\n}\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block}.eui-21 :host .eds-calendar-header__nav{display:flex;justify-content:space-between;align-items:center;gap:var(--eds-sp-s)}.eui-21 :host .eds-calendar-header__left{display:flex;align-items:center;gap:var(--eds-sp-s)}.eui-21 :host .eds-calendar-header__label{display:flex;flex-direction:column;align-items:flex-start}.eui-21 :host .eds-calendar-header__date{font:var(--eds-f-label-l-semi-bold)}.eui-21 :host .eds-calendar-header__sublabel{font:var(--eds-f-paragraph-xs);color:var(--eds-c-foreground-subtler)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i2.EdsButton, selector: "button[edsButton]", inputs: ["e2eAttr", "id", "edsBlockButton", "edsIconButton", "edsAvatarButton", "edsLineWrap", "edsButtonPrimary", "edsButtonSecondary", "edsButtonTertiary", "edsButtonRounded", "edsTypeVariant", "isChecked", "edsDisabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarHeader, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-header', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         NgTemplateOutlet,
@@ -318,10 +318,10 @@ class EdsCalendarDayCellDef {
     static ngTemplateContextGuard(_dir, ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarDayCellDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EdsCalendarDayCellDef, isStandalone: true, selector: "ng-template[edsCalendarDayCell]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarDayCellDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EdsCalendarDayCellDef, isStandalone: true, selector: "ng-template[edsCalendarDayCell]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarDayCellDef, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarDayCellDef, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[edsCalendarDayCell]' }]
         }] });
@@ -329,10 +329,10 @@ class EdsCalendarHeaderCellDef {
     static ngTemplateContextGuard(_dir, ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarHeaderCellDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EdsCalendarHeaderCellDef, isStandalone: true, selector: "ng-template[edsCalendarHeaderCell]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarHeaderCellDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EdsCalendarHeaderCellDef, isStandalone: true, selector: "ng-template[edsCalendarHeaderCell]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarHeaderCellDef, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarHeaderCellDef, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[edsCalendarHeaderCell]' }]
         }] });
@@ -340,10 +340,10 @@ class EdsCalendarEventCellDef {
     static ngTemplateContextGuard(_dir, ctx) {
         return true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarEventCellDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EdsCalendarEventCellDef, isStandalone: true, selector: "ng-template[edsCalendarEventCell]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarEventCellDef, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EdsCalendarEventCellDef, isStandalone: true, selector: "ng-template[edsCalendarEventCell]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarEventCellDef, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarEventCellDef, decorators: [{
             type: Directive,
             args: [{ selector: 'ng-template[edsCalendarEventCell]' }]
         }] });
@@ -394,10 +394,10 @@ class EdsCalendarDay {
     addNewItemClicked() {
         this.addNewItemEvent.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarDay, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarDay, isStandalone: true, selector: "eds-calendar-day", inputs: { edsDisabled: { classPropertyName: "edsDisabled", publicName: "edsDisabled", isSignal: true, isRequired: false, transformFunction: null }, dayOfTheMonth: { classPropertyName: "dayOfTheMonth", publicName: "dayOfTheMonth", isSignal: true, isRequired: false, transformFunction: null }, maxNumberOfEventsToShow: { classPropertyName: "maxNumberOfEventsToShow", publicName: "maxNumberOfEventsToShow", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, eventTemplate: { classPropertyName: "eventTemplate", publicName: "eventTemplate", isSignal: true, isRequired: false, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { addNewItemEvent: "addNewItemEvent" }, host: { listeners: { "mouseenter": "onMouseOver()", "mouseleave": "onMouseOut()" }, properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "eventTemplateDef", first: true, predicate: EdsCalendarEventCellDef, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (dayOfTheMonth()) {\n    <div class=\"eds-calendar-day__header\">\n        <button edsButton\n                [edsButtonRounded]=\"isSelected()\"\n                [edsPrimary]=\"isSelected()\"\n                [edsNeutral]=\"!isSelected()\">\n            {{ dayOfTheMonth() }}\n        </button>\n        @if (renderNewEvent()) {\n            <button edsIconButton edsInfo edsSizeS icon=\"plus:core\" ariaLabel=\"Add new event\" (click)=\"addNewItemClicked()\"></button>\n        }\n    </div>\n}\n\n<div class=\"eds-calendar-day__events\">\n    @for (event of events(); track event.id; let idx = $index, l = $last) {\n        @if (idx < maxNumberOfEventsToShow()) {\n            @if (resolvedEventTemplate()) {\n                <ng-container\n                    [ngTemplateOutlet]=\"resolvedEventTemplate()\"\n                    [ngTemplateOutletContext]=\"{ $implicit: event, label: event.label(), type: event.type?.() }\">\n                </ng-container>\n            } @else if (event.type) {\n                <eds-tag [edsInfo]=\"event.type() === EventType.primary || event.type() === EventType.info\"\n                         [edsSuccess]=\"event.type() === EventType.success\"\n                         [edsWarning]=\"event.type() === EventType.warning\"\n                         [edsCritical]=\"event.type() === EventType.critical\">\n                    {{ event.label() }}\n                </eds-tag>\n            } @else {\n                <eds-tag>{{ event.label() }}</eds-tag>\n            }\n        }\n\n        @if (l) {\n            @if (events().length > maxNumberOfEventsToShow()) {\n                <span class=\"eds-calendar-day__show-more\" (click)=\"showMoreEvents($event)\">\n                    +{{ events().length - maxNumberOfEventsToShow() }} more\n                </span>\n            }\n        }\n    }\n</div>\n\n<eds-popover #popover [title]=\"'Events'\">\n    <div class=\"eds-calendar-day__popover-events\">\n        @for (event of events(); track event.id) {\n            @if (resolvedEventTemplate()) {\n                <ng-container\n                    [ngTemplateOutlet]=\"resolvedEventTemplate()\"\n                    [ngTemplateOutletContext]=\"{ $implicit: event, label: event.label(), type: event.type?.() }\">\n                </ng-container>\n            } @else if (event.type) {\n                <eds-tag [edsInfo]=\"event.type() === EventType.primary || event.type() === EventType.info\"\n                         [edsSuccess]=\"event.type() === EventType.success\"\n                         [edsWarning]=\"event.type() === EventType.warning\"\n                         [edsCritical]=\"event.type() === EventType.critical\">\n                    {{ event.label() }}\n                </eds-tag>\n            } @else {\n                <eds-tag>{{ event.label() }}</eds-tag>\n            }\n        }\n    </div>\n</eds-popover>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{height:8rem;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:var(--eds-sp-2xs);overflow:hidden;width:100%;padding:var(--eds-sp-xs)}.eui-21 :host.eds-calendar-day--disabled{opacity:.5;pointer-events:none}.eui-21 :host .eds-calendar-day__header{display:flex;flex-direction:row;justify-content:space-between;width:100%}.eui-21 :host .eds-calendar-day__show-more{cursor:pointer;font:var(--eds-f-paragraph-xs);color:var(--eds-c-foreground-subtle)}.eui-21 :host .eds-calendar-day__show-more:hover{text-decoration:underline}.eui-21 :host .eds-calendar-day__events{display:flex;flex-direction:column;align-items:flex-start;gap:var(--eds-sp-2xs);margin-top:auto}.eui-21 :host .eds-calendar-day__popover-events{display:flex;flex-direction:column;align-items:flex-start;gap:var(--eds-sp-xs)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.EdsButton, selector: "button[edsButton]", inputs: ["e2eAttr", "id", "edsBlockButton", "edsIconButton", "edsAvatarButton", "edsLineWrap", "edsButtonPrimary", "edsButtonSecondary", "edsButtonTertiary", "edsButtonRounded", "edsTypeVariant", "isChecked", "edsDisabled"] }, { kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i3.EdsTag, selector: "eds-tag, span[edsTag]", inputs: ["ariaLabel", "e2eAttr", "edsInternalId", "tooltipMessage", "id", "data", "edsOutline", "colorPalette"], outputs: ["remove"] }, { kind: "component", type: i4.EdsPopover, selector: "eds-popover", inputs: ["title", "position", "width", "hasBackDrop", "hasCloseButton", "isDismissable", "hasNoContentPadding"], outputs: ["outsideClick", "popoverOpen", "popoverClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarDay, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarDay, isStandalone: true, selector: "eds-calendar-day", inputs: { edsDisabled: { classPropertyName: "edsDisabled", publicName: "edsDisabled", isSignal: true, isRequired: false, transformFunction: null }, dayOfTheMonth: { classPropertyName: "dayOfTheMonth", publicName: "dayOfTheMonth", isSignal: true, isRequired: false, transformFunction: null }, maxNumberOfEventsToShow: { classPropertyName: "maxNumberOfEventsToShow", publicName: "maxNumberOfEventsToShow", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, eventTemplate: { classPropertyName: "eventTemplate", publicName: "eventTemplate", isSignal: true, isRequired: false, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { addNewItemEvent: "addNewItemEvent" }, host: { listeners: { "mouseenter": "onMouseOver()", "mouseleave": "onMouseOut()" }, properties: { "class": "hostClasses()" } }, queries: [{ propertyName: "eventTemplateDef", first: true, predicate: EdsCalendarEventCellDef, descendants: true, read: TemplateRef, isSignal: true }], viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (dayOfTheMonth()) {\n    <div class=\"eds-calendar-day__header\">\n        <button edsButton\n                [edsButtonRounded]=\"isSelected()\"\n                [edsPrimary]=\"isSelected()\"\n                [edsNeutral]=\"!isSelected()\">\n            {{ dayOfTheMonth() }}\n        </button>\n        @if (renderNewEvent()) {\n            <button edsIconButton edsInfo edsSizeS icon=\"plus:core\" ariaLabel=\"Add new event\" (click)=\"addNewItemClicked()\"></button>\n        }\n    </div>\n}\n\n<div class=\"eds-calendar-day__events\">\n    @for (event of events(); track event.id; let idx = $index, l = $last) {\n        @if (idx < maxNumberOfEventsToShow()) {\n            @if (resolvedEventTemplate()) {\n                <ng-container\n                    [ngTemplateOutlet]=\"resolvedEventTemplate()\"\n                    [ngTemplateOutletContext]=\"{ $implicit: event, label: event.label(), type: event.type?.() }\">\n                </ng-container>\n            } @else if (event.type) {\n                <eds-tag [edsInfo]=\"event.type() === EventType.primary || event.type() === EventType.info\"\n                         [edsSuccess]=\"event.type() === EventType.success\"\n                         [edsWarning]=\"event.type() === EventType.warning\"\n                         [edsCritical]=\"event.type() === EventType.critical\">\n                    {{ event.label() }}\n                </eds-tag>\n            } @else {\n                <eds-tag>{{ event.label() }}</eds-tag>\n            }\n        }\n\n        @if (l) {\n            @if (events().length > maxNumberOfEventsToShow()) {\n                <span class=\"eds-calendar-day__show-more\" (click)=\"showMoreEvents($event)\">\n                    +{{ events().length - maxNumberOfEventsToShow() }} more\n                </span>\n            }\n        }\n    }\n</div>\n\n<eds-popover #popover [title]=\"'Events'\">\n    <div class=\"eds-calendar-day__popover-events\">\n        @for (event of events(); track event.id) {\n            @if (resolvedEventTemplate()) {\n                <ng-container\n                    [ngTemplateOutlet]=\"resolvedEventTemplate()\"\n                    [ngTemplateOutletContext]=\"{ $implicit: event, label: event.label(), type: event.type?.() }\">\n                </ng-container>\n            } @else if (event.type) {\n                <eds-tag [edsInfo]=\"event.type() === EventType.primary || event.type() === EventType.info\"\n                         [edsSuccess]=\"event.type() === EventType.success\"\n                         [edsWarning]=\"event.type() === EventType.warning\"\n                         [edsCritical]=\"event.type() === EventType.critical\">\n                    {{ event.label() }}\n                </eds-tag>\n            } @else {\n                <eds-tag>{{ event.label() }}</eds-tag>\n            }\n        }\n    </div>\n</eds-popover>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{height:8rem;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:var(--eds-sp-2xs);overflow:hidden;width:100%;padding:var(--eds-sp-xs)}.eui-21 :host.eds-calendar-day--disabled{opacity:.5;pointer-events:none}.eui-21 :host .eds-calendar-day__header{display:flex;flex-direction:row;justify-content:space-between;width:100%}.eui-21 :host .eds-calendar-day__show-more{cursor:pointer;font:var(--eds-f-paragraph-xs);color:var(--eds-c-foreground-subtle)}.eui-21 :host .eds-calendar-day__show-more:hover{text-decoration:underline}.eui-21 :host .eds-calendar-day__events{display:flex;flex-direction:column;align-items:flex-start;gap:var(--eds-sp-2xs);margin-top:auto}.eui-21 :host .eds-calendar-day__popover-events{display:flex;flex-direction:column;align-items:flex-start;gap:var(--eds-sp-xs)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.EdsButton, selector: "button[edsButton]", inputs: ["e2eAttr", "id", "edsBlockButton", "edsIconButton", "edsAvatarButton", "edsLineWrap", "edsButtonPrimary", "edsButtonSecondary", "edsButtonTertiary", "edsButtonRounded", "edsTypeVariant", "isChecked", "edsDisabled"] }, { kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i3.EdsTag, selector: "eds-tag, span[edsTag]", inputs: ["ariaLabel", "e2eAttr", "edsInternalId", "tooltipMessage", "id", "data", "edsOutline", "colorPalette"], outputs: ["remove"] }, { kind: "component", type: i4.EdsPopover, selector: "eds-popover", inputs: ["title", "position", "width", "hasBackDrop", "hasCloseButton", "isDismissable", "hasNoContentPadding"], outputs: ["outsideClick", "popoverOpen", "popoverClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarDay, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarDay, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-day', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         NgTemplateOutlet,
@@ -728,10 +728,10 @@ class EdsCalendarMonthly {
         }
         throw new Error('Starting day must be a string (day name) or number (0-6).');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarMonthly, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarMonthly, isStandalone: true, selector: "eds-calendar-monthly", inputs: { disabledDays: { classPropertyName: "disabledDays", publicName: "disabledDays", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, hasEmptyValue: { classPropertyName: "hasEmptyValue", publicName: "hasEmptyValue", isSignal: true, isRequired: false, transformFunction: null }, dayTemplate: { classPropertyName: "dayTemplate", publicName: "dayTemplate", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventTemplate: { classPropertyName: "eventTemplate", publicName: "eventTemplate", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, startingDay: { classPropertyName: "startingDay", publicName: "startingDay", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, fillPreviousMonth: { classPropertyName: "fillPreviousMonth", publicName: "fillPreviousMonth", isSignal: true, isRequired: false, transformFunction: null }, fillNextMonth: { classPropertyName: "fillNextMonth", publicName: "fillNextMonth", isSignal: true, isRequired: false, transformFunction: null }, disableFutureDates: { classPropertyName: "disableFutureDates", publicName: "disableFutureDates", isSignal: true, isRequired: false, transformFunction: null }, disablePastDates: { classPropertyName: "disablePastDates", publicName: "disablePastDates", isSignal: true, isRequired: false, transformFunction: null }, disableWeekends: { classPropertyName: "disableWeekends", publicName: "disableWeekends", isSignal: true, isRequired: false, transformFunction: null }, disabledDaysNotInMonth: { classPropertyName: "disabledDaysNotInMonth", publicName: "disabledDaysNotInMonth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { newEventAddClicked: "newEventAddClicked" }, host: { classAttribute: "eds-calendar-monthly" }, queries: [{ propertyName: "dayTemplateDef", first: true, predicate: EdsCalendarDayCellDef, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerTemplateDef", first: true, predicate: EdsCalendarHeaderCellDef, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "eventTemplateDef", first: true, predicate: EdsCalendarEventCellDef, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<table role=\"grid\" aria-label=\"Calendar\" [ngClass]=\"{ 'eds-calendar-monthly--compact': this.mode() === 'compact', 'eds-calendar-monthly--truncated': this.mode() === 'truncated' }\">\n    <thead>\n    <tr>\n        @for (day of daysHeaderArray(); track $index) {\n            @if (resolvedHeaderTemplate()) {\n                <th class=\"eds-calendar-monthly--day-header\" scope=\"col\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"resolvedHeaderTemplate()\"\n                        [ngTemplateOutletContext]=\"{ date: day.date }\">\n                    </ng-container>\n                </th>\n            } @else {\n                <th class=\"eds-calendar-monthly--day-header\" scope=\"col\">{{ day.short }}</th>\n            }\n        }\n    </tr>\n    </thead>\n    <tbody>\n        @for (week of monthlyCalendar(); track $index; let weekIdx = $index) {\n            <tr>\n                @for (day of week; track trackByDay(dayIdx, day); let dayIdx = $index) {\n                    <td class=\"eds-calendar-monthly--day\"\n                        [ngClass]=\"{ 'weekend': day?.isWeekend, 'disabled': day?.isDisabled }\"\n                        [attr.aria-disabled]=\"day?.isDisabled ? 'true' : null\"\n                        [attr.aria-current]=\"day?.isToday ? 'date' : null\"\n                        (mouseover)=\"onMouseEnterDay(day)\"\n                        (mouseout)=\"onMouseLeaveDay(day)\">\n                        @if (resolvedDayTemplate()) {\n                            <ng-container\n                                [ngTemplateOutlet]=\"resolvedDayTemplate()\"\n                                [ngTemplateOutletContext]=\"{ $implicit: day }\">\n                            </ng-container>\n                        } @else {\n                            <eds-calendar-day [dayOfTheMonth]=\"day?.day\"\n                                     [isSelected]=\"day?.isToday\"\n                                     [edsDisabled]=\"day?.isDisabled\"\n                                     [maxNumberOfEventsToShow]=\"2\"\n                                     [events]=\"day?.events\"\n                                     [eventTemplate]=\"resolvedEventTemplate()\"\n                                     (addNewItemEvent)=\"addNewItemClicked(day)\">\n                            </eds-calendar-day>\n                        }\n                    </td>\n                }\n            </tr>\n        }\n    </tbody>\n</table>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block}.eui-21 :host table{width:100%;table-layout:fixed;border-collapse:collapse;border-radius:var(--eds-br-s);overflow:hidden}.eui-21 :host table.eds-calendar-monthly--compact{width:auto;table-layout:auto}.eui-21 :host table.eds-calendar-monthly--compact .eds-calendar-monthly--day{height:4rem}.eui-21 :host .eds-calendar-monthly--day-header{padding:var(--eds-sp-xs);text-align:left;font:var(--eds-f-label-s-semi-bold)}.eui-21 :host .eds-calendar-monthly--day{overflow:hidden;text-overflow:ellipsis;border:1px solid var(--eds-c-border-divider);padding:var(--eds-sp-xs);vertical-align:top;height:8rem}.eui-21 :host .eds-calendar-monthly--day:hover{background-color:var(--eds-c-surface-hover)}.eui-21 :host .eds-calendar-monthly--day.weekend{background-color:var(--eds-c-surface-default)}.eui-21 :host .eds-calendar-monthly--day.disabled{opacity:.5}\n"], dependencies: [{ kind: "component", type: EdsCalendarDay, selector: "eds-calendar-day", inputs: ["edsDisabled", "dayOfTheMonth", "maxNumberOfEventsToShow", "events", "eventTemplate", "isSelected"], outputs: ["addNewItemEvent"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarMonthly, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarMonthly, isStandalone: true, selector: "eds-calendar-monthly", inputs: { disabledDays: { classPropertyName: "disabledDays", publicName: "disabledDays", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, hasEmptyValue: { classPropertyName: "hasEmptyValue", publicName: "hasEmptyValue", isSignal: true, isRequired: false, transformFunction: null }, dayTemplate: { classPropertyName: "dayTemplate", publicName: "dayTemplate", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventTemplate: { classPropertyName: "eventTemplate", publicName: "eventTemplate", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, startingDay: { classPropertyName: "startingDay", publicName: "startingDay", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, fillPreviousMonth: { classPropertyName: "fillPreviousMonth", publicName: "fillPreviousMonth", isSignal: true, isRequired: false, transformFunction: null }, fillNextMonth: { classPropertyName: "fillNextMonth", publicName: "fillNextMonth", isSignal: true, isRequired: false, transformFunction: null }, disableFutureDates: { classPropertyName: "disableFutureDates", publicName: "disableFutureDates", isSignal: true, isRequired: false, transformFunction: null }, disablePastDates: { classPropertyName: "disablePastDates", publicName: "disablePastDates", isSignal: true, isRequired: false, transformFunction: null }, disableWeekends: { classPropertyName: "disableWeekends", publicName: "disableWeekends", isSignal: true, isRequired: false, transformFunction: null }, disabledDaysNotInMonth: { classPropertyName: "disabledDaysNotInMonth", publicName: "disabledDaysNotInMonth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { newEventAddClicked: "newEventAddClicked" }, host: { classAttribute: "eds-calendar-monthly" }, queries: [{ propertyName: "dayTemplateDef", first: true, predicate: EdsCalendarDayCellDef, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "headerTemplateDef", first: true, predicate: EdsCalendarHeaderCellDef, descendants: true, read: TemplateRef, isSignal: true }, { propertyName: "eventTemplateDef", first: true, predicate: EdsCalendarEventCellDef, descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: "<table role=\"grid\" aria-label=\"Calendar\" [ngClass]=\"{ 'eds-calendar-monthly--compact': this.mode() === 'compact', 'eds-calendar-monthly--truncated': this.mode() === 'truncated' }\">\n    <thead>\n    <tr>\n        @for (day of daysHeaderArray(); track $index) {\n            @if (resolvedHeaderTemplate()) {\n                <th class=\"eds-calendar-monthly--day-header\" scope=\"col\">\n                    <ng-container\n                        [ngTemplateOutlet]=\"resolvedHeaderTemplate()\"\n                        [ngTemplateOutletContext]=\"{ date: day.date }\">\n                    </ng-container>\n                </th>\n            } @else {\n                <th class=\"eds-calendar-monthly--day-header\" scope=\"col\">{{ day.short }}</th>\n            }\n        }\n    </tr>\n    </thead>\n    <tbody>\n        @for (week of monthlyCalendar(); track $index; let weekIdx = $index) {\n            <tr>\n                @for (day of week; track trackByDay(dayIdx, day); let dayIdx = $index) {\n                    <td class=\"eds-calendar-monthly--day\"\n                        [ngClass]=\"{ 'weekend': day?.isWeekend, 'disabled': day?.isDisabled }\"\n                        [attr.aria-disabled]=\"day?.isDisabled ? 'true' : null\"\n                        [attr.aria-current]=\"day?.isToday ? 'date' : null\"\n                        (mouseover)=\"onMouseEnterDay(day)\"\n                        (mouseout)=\"onMouseLeaveDay(day)\">\n                        @if (resolvedDayTemplate()) {\n                            <ng-container\n                                [ngTemplateOutlet]=\"resolvedDayTemplate()\"\n                                [ngTemplateOutletContext]=\"{ $implicit: day }\">\n                            </ng-container>\n                        } @else {\n                            <eds-calendar-day [dayOfTheMonth]=\"day?.day\"\n                                     [isSelected]=\"day?.isToday\"\n                                     [edsDisabled]=\"day?.isDisabled\"\n                                     [maxNumberOfEventsToShow]=\"2\"\n                                     [events]=\"day?.events\"\n                                     [eventTemplate]=\"resolvedEventTemplate()\"\n                                     (addNewItemEvent)=\"addNewItemClicked(day)\">\n                            </eds-calendar-day>\n                        }\n                    </td>\n                }\n            </tr>\n        }\n    </tbody>\n</table>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block}.eui-21 :host table{width:100%;table-layout:fixed;border-collapse:collapse;border-radius:var(--eds-br-s);overflow:hidden}.eui-21 :host table.eds-calendar-monthly--compact{width:auto;table-layout:auto}.eui-21 :host table.eds-calendar-monthly--compact .eds-calendar-monthly--day{height:4rem}.eui-21 :host .eds-calendar-monthly--day-header{padding:var(--eds-sp-xs);text-align:left;font:var(--eds-f-label-s-semi-bold)}.eui-21 :host .eds-calendar-monthly--day{overflow:hidden;text-overflow:ellipsis;border:1px solid var(--eds-c-border-divider);padding:var(--eds-sp-xs);vertical-align:top;height:8rem}.eui-21 :host .eds-calendar-monthly--day:hover{background-color:var(--eds-c-surface-hover)}.eui-21 :host .eds-calendar-monthly--day.weekend{background-color:var(--eds-c-surface-default)}.eui-21 :host .eds-calendar-monthly--day.disabled{opacity:.5}\n"], dependencies: [{ kind: "component", type: EdsCalendarDay, selector: "eds-calendar-day", inputs: ["edsDisabled", "dayOfTheMonth", "maxNumberOfEventsToShow", "events", "eventTemplate", "isSelected"], outputs: ["addNewItemEvent"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarMonthly, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarMonthly, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-monthly', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         EdsCalendarDay,
@@ -758,15 +758,15 @@ class EdsCalendarWeeklyDayHeader {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "dayOfTheMonth" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeeklyDayHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarWeeklyDayHeader, isStandalone: true, selector: "eds-calendar-weekly-day-header", inputs: { date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, sublabel: { classPropertyName: "sublabel", publicName: "sublabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeeklyDayHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarWeeklyDayHeader, isStandalone: true, selector: "eds-calendar-weekly-day-header", inputs: { date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, sublabel: { classPropertyName: "sublabel", publicName: "sublabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange" }, ngImport: i0, template: `
         <span class="eds-calendar-weekly-day-header__day"><strong>{{ dayOfTheWeek() }}</strong> {{ dayOfTheMonth() }}</span>
         @if (sublabel()) {
             <span class="eds-calendar-weekly-day-header__sublabel">{{ sublabel() }}</span>
         }
     `, isInline: true, styles: [":host{display:flex;flex-direction:row;justify-content:space-between;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeeklyDayHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeeklyDayHeader, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-weekly-day-header', template: `
         <span class="eds-calendar-weekly-day-header__day"><strong>{{ dayOfTheWeek() }}</strong> {{ dayOfTheMonth() }}</span>
@@ -789,10 +789,10 @@ class EdsCalendarWeeklyDayContent {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeeklyDayContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarWeeklyDayContent, isStandalone: true, selector: "eds-calendar-weekly-day-content", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, subLabel: { classPropertyName: "subLabel", publicName: "subLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, hostDirectives: [{ directive: i1$1.EdsColorDirective, inputs: ["edsPrimary", "edsPrimary", "edsSuccess", "edsSuccess", "edsInfo", "edsInfo", "edsWarning", "edsWarning", "edsCritical", "edsCritical", "edsColorVariant", "edsColorVariant"] }], ngImport: i0, template: "<eds-card>\n    <eds-card-body>\n        <strong>{{ label() }}</strong>\n        @if (subLabel()) {\n            <div class=\"eds-calendar-event__sublabel\">{{ subLabel() }}</div>\n        }\n    </eds-card-body>\n</eds-card>\n", dependencies: [{ kind: "component", type: i2$1.EdsCard, selector: "eds-card", inputs: ["e2eAttr", "isSelectable", "isSelected", "isCollapsible", "isCollapsed"], outputs: ["isSelectedChange", "isCollapsedChange", "cardSelect", "cardCollapse"] }, { kind: "component", type: i2$1.EdsCardBody, selector: "eds-card-body" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeeklyDayContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarWeeklyDayContent, isStandalone: true, selector: "eds-calendar-weekly-day-content", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, subLabel: { classPropertyName: "subLabel", publicName: "subLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" } }, hostDirectives: [{ directive: i1$1.EdsColorDirective, inputs: ["edsPrimary", "edsPrimary", "edsSuccess", "edsSuccess", "edsInfo", "edsInfo", "edsWarning", "edsWarning", "edsCritical", "edsCritical", "edsColorVariant", "edsColorVariant"] }], ngImport: i0, template: "<eds-card>\n    <eds-card-body>\n        <strong>{{ label() }}</strong>\n        @if (subLabel()) {\n            <div class=\"eds-calendar-event__sublabel\">{{ subLabel() }}</div>\n        }\n    </eds-card-body>\n</eds-card>\n", dependencies: [{ kind: "component", type: i2$1.EdsCard, selector: "eds-card", inputs: ["e2eAttr", "isSelectable", "isSelected", "isCollapsible", "isCollapsed"], outputs: ["isSelectedChange", "isCollapsedChange", "cardSelect", "cardCollapse"] }, { kind: "component", type: i2$1.EdsCardBody, selector: "eds-card-body" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeeklyDayContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeeklyDayContent, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-weekly-day-content', changeDetection: ChangeDetectionStrategy.OnPush, imports: [...EDS_CARD], hostDirectives: [{
                             directive: EdsColorDirective,
@@ -942,10 +942,10 @@ class EdsCalendarWeekly {
         }
         throw new Error('Starting day must be a string (day name) or number (0-6).');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeekly, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarWeekly, isStandalone: true, selector: "eds-calendar-weekly", inputs: { dragAndDrop: { classPropertyName: "dragAndDrop", publicName: "dragAndDrop", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, showWeekends: { classPropertyName: "showWeekends", publicName: "showWeekends", isSignal: true, isRequired: false, transformFunction: null }, startingDay: { classPropertyName: "startingDay", publicName: "startingDay", isSignal: true, isRequired: false, transformFunction: null }, disabledDays: { classPropertyName: "disabledDays", publicName: "disabledDays", isSignal: true, isRequired: false, transformFunction: null }, dayHeaderTemplate: { classPropertyName: "dayHeaderTemplate", publicName: "dayHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventContentTemplate: { classPropertyName: "eventContentTemplate", publicName: "eventContentTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", events: "eventsChange", eventMoved: "eventMoved", dayAction: "dayAction" }, host: { classAttribute: "eds-calendar-weekly" }, ngImport: i0, template: "@for (day of daysInWeek(); track day?.date?.getTime() || i; let i = $index) {\n    <div [ngClass]=\"{ 'eds-day-column--weekend': day.isWeekend, 'eds-day-column--today': day.isToday, 'eds-day-column--disabled': day.disabled }\"\n         [tabindex]=\"0\"\n         [attr.aria-current]=\"day.isToday ? 'date' : null\"\n         [attr.aria-disabled]=\"day.disabled ? 'true' : null\"\n         class=\"eds-day-column\"\n         role=\"region\"\n         [attr.aria-label]=\"day.date.toLocaleDateString()\">\n        <!-- Day Header -->\n        <div class=\"eds-day-header\">\n            @if (dayHeaderTemplate()) {\n                <ng-container *ngTemplateOutlet=\"dayHeaderTemplate(); context: day\" />\n            } @else {\n                <eds-calendar-weekly-day-header [date]=\"day.date\" />\n            }\n        </div>\n        <!-- Day Content Area with Drag-and-Drop Support -->\n        <div (cdkDropListDropped)=\"drop($event)\"\n             [cdkDropListConnectedTo]=\"dropListIds()\"\n             [cdkDropListData]=\"day\"\n             [cdkDropListDisabled]=\"!dragAndDrop()\"\n             [id]=\"id + '_' + day.date.getTime()\"\n             cdkDropList\n             class=\"eds-day-content\">\n            @for (event of day.metadata(); track event.id) {\n                <div [cdkDragData]=\"event\"\n                     cdkDrag\n                     class=\"eds-event-card\">\n                    @if (eventContentTemplate()) {\n                        <ng-container *ngTemplateOutlet=\"eventContentTemplate(); context: event\" />\n                    } @else {\n                        <eds-calendar-weekly-day-content\n                            [edsCritical]=\"event.type ? event.type() === 'critical': false\"\n                            [edsInfo]=\"event.type ? event.type() === 'info' : false\"\n                            [edsPrimary]=\"event.type ? event.type() === 'primary' : false\"\n                            [edsSuccess]=\"event.type ? event.type() === 'success' : false\"\n                            [edsWarning]=\"event.type ? event.type() === 'warning' : false\"\n                            [label]=\"event.label()\"\n                            [subLabel]=\"event.subLabel()\">\n                        </eds-calendar-weekly-day-content>\n                    }\n                </div>\n            }\n        </div>\n    </div>\n}\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;gap:var(--eds-sp-2xs);overflow-x:auto}.eui-21 :host .eds-day-column{flex:1;display:flex;flex-direction:column;background-color:var(--eds-c-surface);border-radius:var(--eds-br-s)}.eui-21 :host .eds-day-column--weekend{background-color:var(--eds-c-surface-neutral-subtle)}.eui-21 :host .eds-day-column--today{background-color:var(--eds-c-surface-info-subtler)}.eui-21 :host .eds-day-column--disabled{opacity:.5}.eui-21 :host .eds-day-header{flex-shrink:0;padding:var(--eds-sp-xs) var(--eds-sp-s)}.eui-21 :host .eds-day-content{display:flex;flex-direction:column;gap:var(--eds-sp-xs);flex:1;overflow-y:auto;padding:var(--eds-sp-xs)}.eui-21 :host .eds-event-card{border-radius:var(--eds-br-s)}\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: EdsCalendarWeeklyDayHeader, selector: "eds-calendar-weekly-day-header", inputs: ["date", "sublabel"], outputs: ["dateChange"] }, { kind: "component", type: EdsCalendarWeeklyDayContent, selector: "eds-calendar-weekly-day-content", inputs: ["label", "subLabel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeekly, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarWeekly, isStandalone: true, selector: "eds-calendar-weekly", inputs: { dragAndDrop: { classPropertyName: "dragAndDrop", publicName: "dragAndDrop", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, showWeekends: { classPropertyName: "showWeekends", publicName: "showWeekends", isSignal: true, isRequired: false, transformFunction: null }, startingDay: { classPropertyName: "startingDay", publicName: "startingDay", isSignal: true, isRequired: false, transformFunction: null }, disabledDays: { classPropertyName: "disabledDays", publicName: "disabledDays", isSignal: true, isRequired: false, transformFunction: null }, dayHeaderTemplate: { classPropertyName: "dayHeaderTemplate", publicName: "dayHeaderTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventContentTemplate: { classPropertyName: "eventContentTemplate", publicName: "eventContentTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", events: "eventsChange", eventMoved: "eventMoved", dayAction: "dayAction" }, host: { classAttribute: "eds-calendar-weekly" }, ngImport: i0, template: "@for (day of daysInWeek(); track day?.date?.getTime() || i; let i = $index) {\n    <div [ngClass]=\"{ 'eds-day-column--weekend': day.isWeekend, 'eds-day-column--today': day.isToday, 'eds-day-column--disabled': day.disabled }\"\n         [tabindex]=\"0\"\n         [attr.aria-current]=\"day.isToday ? 'date' : null\"\n         [attr.aria-disabled]=\"day.disabled ? 'true' : null\"\n         class=\"eds-day-column\"\n         role=\"region\"\n         [attr.aria-label]=\"day.date.toLocaleDateString()\">\n        <!-- Day Header -->\n        <div class=\"eds-day-header\">\n            @if (dayHeaderTemplate()) {\n                <ng-container *ngTemplateOutlet=\"dayHeaderTemplate(); context: day\" />\n            } @else {\n                <eds-calendar-weekly-day-header [date]=\"day.date\" />\n            }\n        </div>\n        <!-- Day Content Area with Drag-and-Drop Support -->\n        <div (cdkDropListDropped)=\"drop($event)\"\n             [cdkDropListConnectedTo]=\"dropListIds()\"\n             [cdkDropListData]=\"day\"\n             [cdkDropListDisabled]=\"!dragAndDrop()\"\n             [id]=\"id + '_' + day.date.getTime()\"\n             cdkDropList\n             class=\"eds-day-content\">\n            @for (event of day.metadata(); track event.id) {\n                <div [cdkDragData]=\"event\"\n                     cdkDrag\n                     class=\"eds-event-card\">\n                    @if (eventContentTemplate()) {\n                        <ng-container *ngTemplateOutlet=\"eventContentTemplate(); context: event\" />\n                    } @else {\n                        <eds-calendar-weekly-day-content\n                            [edsCritical]=\"event.type ? event.type() === 'critical': false\"\n                            [edsInfo]=\"event.type ? event.type() === 'info' : false\"\n                            [edsPrimary]=\"event.type ? event.type() === 'primary' : false\"\n                            [edsSuccess]=\"event.type ? event.type() === 'success' : false\"\n                            [edsWarning]=\"event.type ? event.type() === 'warning' : false\"\n                            [label]=\"event.label()\"\n                            [subLabel]=\"event.subLabel()\">\n                        </eds-calendar-weekly-day-content>\n                    }\n                </div>\n            }\n        </div>\n    </div>\n}\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;gap:var(--eds-sp-2xs);overflow-x:auto}.eui-21 :host .eds-day-column{flex:1;display:flex;flex-direction:column;background-color:var(--eds-c-surface);border-radius:var(--eds-br-s)}.eui-21 :host .eds-day-column--weekend{background-color:var(--eds-c-surface-neutral-subtle)}.eui-21 :host .eds-day-column--today{background-color:var(--eds-c-surface-info-subtler)}.eui-21 :host .eds-day-column--disabled{opacity:.5}.eui-21 :host .eds-day-header{flex-shrink:0;padding:var(--eds-sp-xs) var(--eds-sp-s)}.eui-21 :host .eds-day-content{display:flex;flex-direction:column;gap:var(--eds-sp-xs);flex:1;overflow-y:auto;padding:var(--eds-sp-xs)}.eui-21 :host .eds-event-card{border-radius:var(--eds-br-s)}\n"], dependencies: [{ kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: EdsCalendarWeeklyDayHeader, selector: "eds-calendar-weekly-day-header", inputs: ["date", "sublabel"], outputs: ["dateChange"] }, { kind: "component", type: EdsCalendarWeeklyDayContent, selector: "eds-calendar-weekly-day-content", inputs: ["label", "subLabel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeekly, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeekly, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-weekly', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         CdkDropList,
@@ -979,10 +979,10 @@ class EdsCalendarWeeklyDayHeaderAction {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "dayOfTheMonth" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeeklyDayHeaderAction, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCalendarWeeklyDayHeaderAction, isStandalone: true, selector: "eds-calendar-weekly-day-header-action", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, sublabel: { classPropertyName: "sublabel", publicName: "sublabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", action: "action" }, host: { properties: { "class.eds-calendar-weekly-day-header-action--disabled": "disabled()" }, classAttribute: "eds-calendar-weekly-day-header-action" }, ngImport: i0, template: "<span class=\"eds-calendar-weekly-day-header-action__left\">\n    <strong>{{ dayOfTheWeek() }}</strong> {{ dayOfTheMonth() }}\n    @if (sublabel()) {\n        <span class=\"eds-calendar-weekly-day-header-action__sublabel\">{{ sublabel() }}</span>\n    }\n</span>\n<div class=\"eds-calendar-weekly-day-header-action__right\">\n    <eds-dropdown>\n        <button edsIconButton edsNeutral edsSizeS icon=\"dots-three-vertical:core\" ariaLabel=\"More options\" [disabled]=\"disabled()\"></button>\n        <eds-dropdown-content>\n            @for (option of options(); track option.id) {\n                <eds-dropdown-item (click)=\"option.callback($event, date())\">{{ option.label }}</eds-dropdown-item>\n            }\n        </eds-dropdown-content>\n    </eds-dropdown>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;align-items:center;width:100%}:host(.eds-calendar-weekly-day-header-action--disabled){opacity:.5;pointer-events:none}\n"], dependencies: [{ kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i2$2.EdsDropdown, selector: "eds-dropdown", inputs: ["e2eAttr", "panelTabIndex", "width", "height", "position", "subDropdownPosition", "isBlock", "isDropDownRightAligned", "hasClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation", "isRightClickEnabled", "isTriggerToggle", "edsDisabled"], outputs: ["expand", "isDropdownOpen"] }, { kind: "component", type: i2$2.EdsDropdownItem, selector: "eds-dropdown-item", inputs: ["e2eAttr", "isActive", "edsDisabled", "subDropdown"] }, { kind: "directive", type: i2$2.EdsDropdownContent, selector: "eds-dropdown-content" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeeklyDayHeaderAction, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCalendarWeeklyDayHeaderAction, isStandalone: true, selector: "eds-calendar-weekly-day-header-action", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, date: { classPropertyName: "date", publicName: "date", isSignal: true, isRequired: true, transformFunction: null }, sublabel: { classPropertyName: "sublabel", publicName: "sublabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { date: "dateChange", action: "action" }, host: { properties: { "class.eds-calendar-weekly-day-header-action--disabled": "disabled()" }, classAttribute: "eds-calendar-weekly-day-header-action" }, ngImport: i0, template: "<span class=\"eds-calendar-weekly-day-header-action__left\">\n    <strong>{{ dayOfTheWeek() }}</strong> {{ dayOfTheMonth() }}\n    @if (sublabel()) {\n        <span class=\"eds-calendar-weekly-day-header-action__sublabel\">{{ sublabel() }}</span>\n    }\n</span>\n<div class=\"eds-calendar-weekly-day-header-action__right\">\n    <eds-dropdown>\n        <button edsIconButton edsNeutral edsSizeS icon=\"dots-three-vertical:core\" ariaLabel=\"More options\" [disabled]=\"disabled()\"></button>\n        <eds-dropdown-content>\n            @for (option of options(); track option.id) {\n                <eds-dropdown-item (click)=\"option.callback($event, date())\">{{ option.label }}</eds-dropdown-item>\n            }\n        </eds-dropdown-content>\n    </eds-dropdown>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;align-items:center;width:100%}:host(.eds-calendar-weekly-day-header-action--disabled){opacity:.5;pointer-events:none}\n"], dependencies: [{ kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i2$2.EdsDropdown, selector: "eds-dropdown", inputs: ["e2eAttr", "panelTabIndex", "width", "height", "position", "subDropdownPosition", "isBlock", "isDropDownRightAligned", "hasClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation", "isRightClickEnabled", "isTriggerToggle", "edsDisabled"], outputs: ["expand", "isDropdownOpen"] }, { kind: "component", type: i2$2.EdsDropdownItem, selector: "eds-dropdown-item", inputs: ["e2eAttr", "isActive", "edsDisabled", "subDropdown"] }, { kind: "directive", type: i2$2.EdsDropdownContent, selector: "eds-dropdown-content" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCalendarWeeklyDayHeaderAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCalendarWeeklyDayHeaderAction, decorators: [{
             type: Component,
             args: [{ selector: 'eds-calendar-weekly-day-header-action', changeDetection: ChangeDetectionStrategy.OnPush, imports: [...EDS_ICON_BUTTON, ...EDS_BUTTON, ...EDS_DROPDOWN], host: {
                         class: 'eds-calendar-weekly-day-header-action',

package/fesm2022/eui-eds-eds-card.mjs

@@ -74,10 +74,10 @@ class EdsCard {
     onSelect() {
         this.cardSelect.emit(this.isSelected());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCard, isStandalone: true, selector: "eds-card", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, isSelectable: { classPropertyName: "isSelectable", publicName: "isSelectable", isSignal: true, isRequired: false, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: false, transformFunction: null }, isCollapsible: { classPropertyName: "isCollapsible", publicName: "isCollapsible", isSignal: true, isRequired: false, transformFunction: null }, isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isSelected: "isSelectedChange", isCollapsed: "isCollapsedChange", cardSelect: "cardSelect", cardCollapse: "cardCollapse" }, host: { properties: { "class": "hostClasses()", "attr.data-e2e": "e2eAttr()" } }, ngImport: i0, template: "<div class=\"eds-card__wrapper\">\n    @if (isSelectable()) {\n        <div class=\"eds-card__selection\">\n            <input edsInputCheckbox [checked]=\"isSelected()\" (change)=\"isSelected.set(!isSelected()); onSelect()\" aria-label=\"Select card\"/>\n        </div>\n    }\n\n    <ng-content select=\"eds-card-media\"/>\n\n    <div class=\"eds-card__main\">\n        <ng-content select=\"eds-card-header\"/>\n\n        <div class=\"eds-card__body\">\n            <ng-content select=\"eds-card-body\"/>\n        </div>\n    </div>\n</div>\n\n<ng-content select=\"eds-card-footer\"/>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host.eds-card{display:flex;flex-direction:column;width:100%;height:auto;position:relative;border:var(--eds-bw-xs) solid var(--eds-c-border-divider);background-color:var(--eds-c-surface-elevation);border-radius:var(--eds-br-m);box-shadow:var(--eds-sh-1);font:var(--eds-f-paragraph-m)}.eui-21 :host.eds-card .eds-card__wrapper{display:flex;flex-direction:row}.eui-21 :host.eds-card .eds-card__selection{display:flex;align-items:flex-start;padding:var(--eds-sp-s) var(--eds-sp-s) 0 var(--eds-sp-s)}.eui-21 :host.eds-card .eds-card__main{display:flex;flex-direction:column;width:100%}.eui-21 :host.eds-card .eds-card__body{display:flex;width:100%}.eui-21 :host.eds-card.eds-card--selected{border-color:var(--eds-c-border-primary)}.eui-21 :host.eds-card.eds-card--collapsed .eds-card__body{display:none}@media screen and (max-width:767px){.eui-21 :host.eds-card .eds-card__wrapper{flex-direction:column}.eui-21 :host.eds-card .eds-card__selection{position:absolute;top:var(--eds-sp-s);right:var(--eds-sp-s)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: i1.EdsInputCheckbox, selector: "input[edsInputCheckbox]", inputs: ["e2eAttr", "checked", "indeterminate", "disabled", "readonly", "isInvalid"], outputs: ["checkedChange", "indeterminateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCard, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCard, isStandalone: true, selector: "eds-card", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, isSelectable: { classPropertyName: "isSelectable", publicName: "isSelectable", isSignal: true, isRequired: false, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: false, transformFunction: null }, isCollapsible: { classPropertyName: "isCollapsible", publicName: "isCollapsible", isSignal: true, isRequired: false, transformFunction: null }, isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isSelected: "isSelectedChange", isCollapsed: "isCollapsedChange", cardSelect: "cardSelect", cardCollapse: "cardCollapse" }, host: { properties: { "class": "hostClasses()", "attr.data-e2e": "e2eAttr()" } }, ngImport: i0, template: "<div class=\"eds-card__wrapper\">\n    @if (isSelectable()) {\n        <div class=\"eds-card__selection\">\n            <input edsInputCheckbox [checked]=\"isSelected()\" (change)=\"isSelected.set(!isSelected()); onSelect()\" aria-label=\"Select card\"/>\n        </div>\n    }\n\n    <ng-content select=\"eds-card-media\"/>\n\n    <div class=\"eds-card__main\">\n        <ng-content select=\"eds-card-header\"/>\n\n        <div class=\"eds-card__body\">\n            <ng-content select=\"eds-card-body\"/>\n        </div>\n    </div>\n</div>\n\n<ng-content select=\"eds-card-footer\"/>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host.eds-card{display:flex;flex-direction:column;width:100%;height:auto;position:relative;border:var(--eds-bw-xs) solid var(--eds-c-border-divider);background-color:var(--eds-c-surface-elevation);border-radius:var(--eds-br-m);box-shadow:var(--eds-sh-1);font:var(--eds-f-paragraph-m)}.eui-21 :host.eds-card .eds-card__wrapper{display:flex;flex-direction:row}.eui-21 :host.eds-card .eds-card__selection{display:flex;align-items:flex-start;padding:var(--eds-sp-s) var(--eds-sp-s) 0 var(--eds-sp-s)}.eui-21 :host.eds-card .eds-card__main{display:flex;flex-direction:column;width:100%}.eui-21 :host.eds-card .eds-card__body{display:flex;width:100%}.eui-21 :host.eds-card.eds-card--selected{border-color:var(--eds-c-border-primary)}.eui-21 :host.eds-card.eds-card--collapsed .eds-card__body{display:none}@media screen and (max-width:767px){.eui-21 :host.eds-card .eds-card__wrapper{flex-direction:column}.eui-21 :host.eds-card .eds-card__selection{position:absolute;top:var(--eds-sp-s);right:var(--eds-sp-s)}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: i1.EdsInputCheckbox, selector: "input[edsInputCheckbox]", inputs: ["e2eAttr", "checked", "indeterminate", "disabled", "readonly", "isInvalid"], outputs: ["checkedChange", "indeterminateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCard, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         FormsModule,
@@ -89,10 +89,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
         }], propDecorators: { e2eAttr: [{ type: i0.Input, args: [{ isSignal: true, alias: "e2eAttr", required: false }] }], isSelectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSelectable", required: false }] }], isSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSelected", required: false }] }, { type: i0.Output, args: ["isSelectedChange"] }], isCollapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCollapsible", required: false }] }], isCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCollapsed", required: false }] }, { type: i0.Output, args: ["isCollapsedChange"] }], cardSelect: [{ type: i0.Output, args: ["cardSelect"] }], cardCollapse: [{ type: i0.Output, args: ["cardCollapse"] }] } });
 
 class EdsCardHeaderStart {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderStart, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardHeaderStart, isStandalone: true, selector: "eds-card-header-start", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderStart, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardHeaderStart, isStandalone: true, selector: "eds-card-header-start", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderStart, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderStart, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-header-start', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex}\n"] }]
         }] });
@@ -104,10 +104,10 @@ class EdsCardHeader {
     onToggle() {
         this.card.toggleCollapse();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCardHeader, isStandalone: true, selector: "eds-card-header", queries: [{ propertyName: "headerStartComponent", first: true, predicate: i0.forwardRef(() => EdsCardHeaderStart), descendants: true }], ngImport: i0, template: "@if (headerStartComponent) {\n    <div class=\"eds-card-header__top\">\n        <ng-content select=\"eds-card-header-start\"/>\n\n        @if (card?.isCollapsible()) {\n            <ng-container *ngTemplateOutlet=\"expander\"/>\n        } @else {\n            <ng-container *ngTemplateOutlet=\"headerEnd\"/>\n        }\n    </div>\n    <ng-container *ngTemplateOutlet=\"headerTitle\"/>\n} @else {\n    <div class=\"eds-card-header__top\">\n        <ng-container *ngTemplateOutlet=\"headerTitle\"/>\n\n        @if (card?.isCollapsible()) {\n            <ng-container *ngTemplateOutlet=\"expander\"/>\n        } @else {\n            <ng-container *ngTemplateOutlet=\"headerEnd\"/>\n        }\n    </div>\n}\n<ng-content select=\"eds-card-header-sublabel\"/>\n<ng-content select=\"eds-card-header-metadata\"/>\n\n<ng-template #headerEnd>\n    <ng-content select=\"eds-card-header-end\"/>\n</ng-template>\n<ng-template #headerTitle>\n    <ng-content select=\"eds-card-header-label\"/>\n</ng-template>\n<ng-template #expander>\n    <div class=\"eds-card-header__expander\">\n        <button edsIconButton\n            [icon]=\"card?.isCollapsed() ? 'caret-down' : 'caret-up'\"\n            ariaLabel=\"Toggle card content\"\n            edsRounded edsSizeS\n            (buttonClick)=\"onToggle()\">\n        </button>\n    </div>\n</ng-template>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;flex-direction:column;padding:var(--eds-sp-s)}.eui-21 :host .eds-card-header__top{display:flex;align-items:center;width:100%}.eui-21 :host .eds-card-header__expander{display:flex;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCardHeader, isStandalone: true, selector: "eds-card-header", queries: [{ propertyName: "headerStartComponent", first: true, predicate: i0.forwardRef(() => EdsCardHeaderStart), descendants: true }], ngImport: i0, template: "@if (headerStartComponent) {\n    <div class=\"eds-card-header__top\">\n        <ng-content select=\"eds-card-header-start\"/>\n\n        @if (card?.isCollapsible()) {\n            <ng-container *ngTemplateOutlet=\"expander\"/>\n        } @else {\n            <ng-container *ngTemplateOutlet=\"headerEnd\"/>\n        }\n    </div>\n    <ng-container *ngTemplateOutlet=\"headerTitle\"/>\n} @else {\n    <div class=\"eds-card-header__top\">\n        <ng-container *ngTemplateOutlet=\"headerTitle\"/>\n\n        @if (card?.isCollapsible()) {\n            <ng-container *ngTemplateOutlet=\"expander\"/>\n        } @else {\n            <ng-container *ngTemplateOutlet=\"headerEnd\"/>\n        }\n    </div>\n}\n<ng-content select=\"eds-card-header-sublabel\"/>\n<ng-content select=\"eds-card-header-metadata\"/>\n\n<ng-template #headerEnd>\n    <ng-content select=\"eds-card-header-end\"/>\n</ng-template>\n<ng-template #headerTitle>\n    <ng-content select=\"eds-card-header-label\"/>\n</ng-template>\n<ng-template #expander>\n    <div class=\"eds-card-header__expander\">\n        <button edsIconButton\n            [icon]=\"card?.isCollapsed() ? 'caret-down' : 'caret-up'\"\n            ariaLabel=\"Toggle card content\"\n            edsRounded edsSizeS\n            (buttonClick)=\"onToggle()\">\n        </button>\n    </div>\n</ng-template>\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;flex-direction:column;padding:var(--eds-sp-s)}.eui-21 :host .eds-card-header__top{display:flex;align-items:center;width:100%}.eui-21 :host .eds-card-header__expander{display:flex;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeader, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-header', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         NgTemplateOutlet,
@@ -119,64 +119,64 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
             }] } });
 
 class EdsCardHeaderLabel {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderLabel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardHeaderLabel, isStandalone: true, selector: "eds-card-header-label", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-label-l-semi-bold)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderLabel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardHeaderLabel, isStandalone: true, selector: "eds-card-header-label", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-label-l-semi-bold)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderLabel, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-header-label', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-label-l-semi-bold)}\n"] }]
         }] });
 
 class EdsCardHeaderSublabel {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderSublabel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardHeaderSublabel, isStandalone: true, selector: "eds-card-header-sublabel", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-label-m);color:var(--eds-c-foreground-subtler)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderSublabel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardHeaderSublabel, isStandalone: true, selector: "eds-card-header-sublabel", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-label-m);color:var(--eds-c-foreground-subtler)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderSublabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderSublabel, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-header-sublabel', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-label-m);color:var(--eds-c-foreground-subtler)}\n"] }]
         }] });
 
 class EdsCardHeaderMetadata {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderMetadata, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardHeaderMetadata, isStandalone: true, selector: "eds-card-header-metadata", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-paragraph-s);color:var(--eds-c-on-surface-neutral-subtle);padding-top:var(--eds-sp-3xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderMetadata, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardHeaderMetadata, isStandalone: true, selector: "eds-card-header-metadata", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-paragraph-s);color:var(--eds-c-on-surface-neutral-subtle);padding-top:var(--eds-sp-3xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderMetadata, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderMetadata, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-header-metadata', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;width:100%;font:var(--eds-f-paragraph-s);color:var(--eds-c-on-surface-neutral-subtle);padding-top:var(--eds-sp-3xs)}\n"] }]
         }] });
 
 class EdsCardHeaderEnd {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderEnd, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardHeaderEnd, isStandalone: true, selector: "eds-card-header-end", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;margin-left:auto;align-items:center;gap:var(--eds-sp-2xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderEnd, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardHeaderEnd, isStandalone: true, selector: "eds-card-header-end", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;margin-left:auto;align-items:center;gap:var(--eds-sp-2xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardHeaderEnd, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardHeaderEnd, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-header-end', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;margin-left:auto;align-items:center;gap:var(--eds-sp-2xs)}\n"] }]
         }] });
 
 class EdsCardBody {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardBody, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardBody, isStandalone: true, selector: "eds-card-body", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;flex-direction:column;width:100%;padding:var(--eds-sp-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardBody, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardBody, isStandalone: true, selector: "eds-card-body", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;flex-direction:column;width:100%;padding:var(--eds-sp-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardBody, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardBody, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-body', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;flex-direction:column;width:100%;padding:var(--eds-sp-s)}\n"] }]
         }] });
 
 class EdsCardMedia {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardMedia, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardMedia, isStandalone: true, selector: "eds-card-media", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;align-items:baseline;padding:var(--eds-sp-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardMedia, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardMedia, isStandalone: true, selector: "eds-card-media", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;align-items:baseline;padding:var(--eds-sp-s)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardMedia, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardMedia, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-media', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;align-items:baseline;padding:var(--eds-sp-s)}\n"] }]
         }] });
 
 class EdsCardFooter {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardFooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EdsCardFooter, isStandalone: true, selector: "eds-card-footer", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;border-top:var(--eds-bw-xs) solid var(--eds-c-border-divider);padding:var(--eds-sp-s);width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardFooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EdsCardFooter, isStandalone: true, selector: "eds-card-footer", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;border-top:var(--eds-bw-xs) solid var(--eds-c-border-divider);padding:var(--eds-sp-s);width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCardFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCardFooter, decorators: [{
             type: Component,
             args: [{ selector: 'eds-card-footer', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:flex;border-top:var(--eds-bw-xs) solid var(--eds-c-border-divider);padding:var(--eds-sp-s);width:100%}\n"] }]
         }] });

package/fesm2022/eui-eds-eds-carousel.mjs

@@ -49,10 +49,10 @@ class EdsCarouselItem {
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCarouselItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: EdsCarouselItem, isStandalone: true, selector: "eds-carousel-item", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideClick: "slideClick" }, host: { attributes: { "role": "tabpanel" }, properties: { "class": "hostClasses()", "attr.aria-roledescription": "\"slide\"", "attr.aria-label": "ariaLabel()", "attr.inert": "!isCurrent() || undefined", "attr.aria-hidden": "!isCurrent()", "attr.data-e2e": "e2eAttr()" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block;flex-shrink:0;width:100%;overflow:hidden}.eui-21 :host.eds-carousel-item--active{visibility:visible}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCarouselItem, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", type: EdsCarouselItem, isStandalone: true, selector: "eds-carousel-item", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideClick: "slideClick" }, host: { attributes: { "role": "tabpanel" }, properties: { "class": "hostClasses()", "attr.aria-roledescription": "\"slide\"", "attr.aria-label": "ariaLabel()", "attr.inert": "!isCurrent() || undefined", "attr.aria-hidden": "!isCurrent()", "attr.data-e2e": "e2eAttr()" } }, ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block;flex-shrink:0;width:100%;overflow:hidden}.eui-21 :host.eds-carousel-item--active{visibility:visible}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCarouselItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCarouselItem, decorators: [{
             type: Component,
             args: [{ selector: 'eds-carousel-item', template: '<ng-content/>', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         role: 'tabpanel',
@@ -337,10 +337,10 @@ class EdsCarousel {
         this.isPlaying.set(true);
         this.playSubject.next();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EdsCarousel, isStandalone: true, selector: "eds-carousel", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelValue: { classPropertyName: "ariaLabelValue", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, isAutoplay: { classPropertyName: "isAutoplay", publicName: "isAutoplay", isSignal: true, isRequired: false, transformFunction: null }, interval: { classPropertyName: "interval", publicName: "interval", isSignal: true, isRequired: false, transformFunction: null }, isLoop: { classPropertyName: "isLoop", publicName: "isLoop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideChange: "slideChange" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "focusin": "onFocusIn()", "focusout": "onFocusOut()" }, properties: { "class": "hostClasses()", "attr.aria-roledescription": "\"carousel\"", "attr.aria-label": "ariaLabelValue()", "attr.data-e2e": "e2eAttr()" } }, queries: [{ propertyName: "slides", predicate: EdsCarouselItem, isSignal: true }], viewQueries: [{ propertyName: "slidesTrack", first: true, predicate: ["slidesTrack"], descendants: true, isSignal: true }, { propertyName: "indicators", predicate: ["indicator"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Slides viewport -->\n<div class=\"eds-carousel__viewport\">\n    <div #slidesTrack\n        class=\"eds-carousel__track\"\n        [style.transform]=\"trackTransform()\"\n        [style.transition]=\"trackTransition()\"\n        aria-atomic=\"false\"\n        aria-live=\"off\">\n        <ng-content select=\"eds-carousel-item\"/>\n    </div>\n\n    <!-- Previous / Next navigation \u2014 inside viewport so buttons center to slide content -->\n    @if (hasControls()) {\n        <div class=\"eds-carousel__navigation\">\n            <button edsIconButton\n                class=\"eds-carousel__nav-button eds-carousel__nav-button--prev\"\n                icon=\"caret-left:core\"\n                edsRounded\n                edsSizeM\n                edsNeutral\n                ariaLabel=\"Previous slide\"\n                (buttonClick)=\"onPreviousClick()\">\n            </button>\n\n            <button edsIconButton\n                class=\"eds-carousel__nav-button eds-carousel__nav-button--next\"\n                icon=\"caret-right:core\"\n                edsRounded\n                edsSizeM\n                edsNeutral\n                ariaLabel=\"Next slide\"\n                (buttonClick)=\"onNextClick()\">\n            </button>\n        </div>\n    }\n</div>\n\n<!-- Footer: Indicators + Autoplay -->\n@if (hasControls()) {\n    <div class=\"eds-carousel__footer\">\n        <!-- Autoplay toggle -->\n        @if (isAutoplay()) {\n            <div class=\"eds-carousel__autoplay\">\n                @if (isPlaying()) {\n                    <button edsIconButton\n                        icon=\"pause:core\"\n                        edsRounded\n                        edsSizeS\n                        edsNeutral\n                        ariaLabel=\"Pause autoplay\"\n                        (buttonClick)=\"onPauseClick()\">\n                    </button>\n                } @else {\n                    <button edsIconButton\n                        icon=\"play:core\"\n                        edsRounded\n                        edsSizeS\n                        edsNeutral\n                        ariaLabel=\"Start autoplay\"\n                        (buttonClick)=\"onPlayClick()\">\n                    </button>\n                }\n            </div>\n        }\n\n        <!-- Pagination indicators -->\n        <div class=\"eds-carousel__indicators\" role=\"tablist\" (keydown)=\"onKeydown($event)\">\n            @for (slide of slides(); let i = $index; track slide) {\n                <button #indicator\n                    class=\"eds-carousel__indicator\"\n                    [class.eds-carousel__indicator--active]=\"i === activeIndex()\"\n                    role=\"tab\"\n                    [attr.aria-selected]=\"i === activeIndex()\"\n                    [attr.aria-label]=\"'Go to slide ' + (i + 1)\"\n                    [attr.tabindex]=\"i === activeIndex() ? 0 : -1\"\n                    (click)=\"onIndicatorClick(i)\">\n                </button>\n            }\n        </div>\n    </div>\n}\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block;position:relative;width:100%;overflow:hidden;border-radius:var(--eds-br-m)}.eui-21 :host .eds-carousel__viewport{position:relative;overflow:hidden;width:100%}.eui-21 :host .eds-carousel__track{display:flex;width:100%;will-change:transform}.eui-21 :host .eds-carousel__navigation{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:flex;justify-content:space-between;padding:0 var(--eds-sp-xs);pointer-events:none;z-index:2}.eui-21 :host .eds-carousel__nav-button{pointer-events:auto;background-color:var(--eds-c-surface-elevation);box-shadow:var(--eds-sh-1);transition:opacity .2s ease,box-shadow .2s ease}.eui-21 :host .eds-carousel__nav-button:hover{box-shadow:var(--eds-sh-2)}.eui-21 :host .eds-carousel__footer{display:flex;align-items:center;justify-content:center;gap:var(--eds-sp-s);padding:var(--eds-sp-s) 0}.eui-21 :host .eds-carousel__autoplay{display:flex;align-items:center}.eui-21 :host .eds-carousel__indicators{display:flex;align-items:center;gap:var(--eds-sp-2xs)}.eui-21 :host .eds-carousel__indicator{width:var(--eds-sp-s);height:var(--eds-sp-s);border-radius:var(--eds-br-full);border:var(--eds-bw-xs) solid var(--eds-c-border-neutral);background-color:transparent;padding:0;cursor:pointer;transition:background-color .2s ease,border-color .2s ease,transform .2s ease}.eui-21 :host .eds-carousel__indicator:hover{background-color:var(--eds-c-surface-neutral-subtle-hover);border-color:var(--eds-c-border-primary)}.eui-21 :host .eds-carousel__indicator:focus-visible:not([readonly]){outline:var(--eds-bw-s) solid var(--eds-c-border-primary)!important;outline-offset:1px!important;border-radius:var(--eds-br-full)!important}.eui-21 :host .eds-carousel__indicator--active{background-color:var(--eds-c-surface-primary);border-color:var(--eds-c-border-primary);transform:scale(1.2)}.eui-21 :host .eds-carousel__indicator--active:hover{background-color:var(--eds-c-surface-primary);border-color:var(--eds-c-border-primary)}.eui-21 :host.eds-carousel--single .eds-carousel__navigation,.eui-21 :host.eds-carousel--single .eds-carousel__footer{display:none}@media screen and (max-width:767px){.eui-21 :host{border-radius:0}.eui-21 :host .eds-carousel__navigation{padding:0 var(--eds-sp-3xs)}.eui-21 :host .eds-carousel__footer{padding:var(--eds-sp-xs) 0}.eui-21 :host .eds-carousel__indicator{width:var(--eds-sp-xs);height:var(--eds-sp-xs)}}\n"], dependencies: [{ kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCarousel, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EdsCarousel, isStandalone: true, selector: "eds-carousel", inputs: { e2eAttr: { classPropertyName: "e2eAttr", publicName: "e2eAttr", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelValue: { classPropertyName: "ariaLabelValue", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, isAutoplay: { classPropertyName: "isAutoplay", publicName: "isAutoplay", isSignal: true, isRequired: false, transformFunction: null }, interval: { classPropertyName: "interval", publicName: "interval", isSignal: true, isRequired: false, transformFunction: null }, isLoop: { classPropertyName: "isLoop", publicName: "isLoop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slideChange: "slideChange" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()", "focusin": "onFocusIn()", "focusout": "onFocusOut()" }, properties: { "class": "hostClasses()", "attr.aria-roledescription": "\"carousel\"", "attr.aria-label": "ariaLabelValue()", "attr.data-e2e": "e2eAttr()" } }, queries: [{ propertyName: "slides", predicate: EdsCarouselItem, isSignal: true }], viewQueries: [{ propertyName: "slidesTrack", first: true, predicate: ["slidesTrack"], descendants: true, isSignal: true }, { propertyName: "indicators", predicate: ["indicator"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Slides viewport -->\n<div class=\"eds-carousel__viewport\">\n    <div #slidesTrack\n        class=\"eds-carousel__track\"\n        [style.transform]=\"trackTransform()\"\n        [style.transition]=\"trackTransition()\"\n        aria-atomic=\"false\"\n        aria-live=\"off\">\n        <ng-content select=\"eds-carousel-item\"/>\n    </div>\n\n    <!-- Previous / Next navigation \u2014 inside viewport so buttons center to slide content -->\n    @if (hasControls()) {\n        <div class=\"eds-carousel__navigation\">\n            <button edsIconButton\n                class=\"eds-carousel__nav-button eds-carousel__nav-button--prev\"\n                icon=\"caret-left:core\"\n                edsRounded\n                edsSizeM\n                edsNeutral\n                ariaLabel=\"Previous slide\"\n                (buttonClick)=\"onPreviousClick()\">\n            </button>\n\n            <button edsIconButton\n                class=\"eds-carousel__nav-button eds-carousel__nav-button--next\"\n                icon=\"caret-right:core\"\n                edsRounded\n                edsSizeM\n                edsNeutral\n                ariaLabel=\"Next slide\"\n                (buttonClick)=\"onNextClick()\">\n            </button>\n        </div>\n    }\n</div>\n\n<!-- Footer: Indicators + Autoplay -->\n@if (hasControls()) {\n    <div class=\"eds-carousel__footer\">\n        <!-- Autoplay toggle -->\n        @if (isAutoplay()) {\n            <div class=\"eds-carousel__autoplay\">\n                @if (isPlaying()) {\n                    <button edsIconButton\n                        icon=\"pause:core\"\n                        edsRounded\n                        edsSizeS\n                        edsNeutral\n                        ariaLabel=\"Pause autoplay\"\n                        (buttonClick)=\"onPauseClick()\">\n                    </button>\n                } @else {\n                    <button edsIconButton\n                        icon=\"play:core\"\n                        edsRounded\n                        edsSizeS\n                        edsNeutral\n                        ariaLabel=\"Start autoplay\"\n                        (buttonClick)=\"onPlayClick()\">\n                    </button>\n                }\n            </div>\n        }\n\n        <!-- Pagination indicators -->\n        <div class=\"eds-carousel__indicators\" role=\"tablist\" (keydown)=\"onKeydown($event)\">\n            @for (slide of slides(); let i = $index; track slide) {\n                <button #indicator\n                    class=\"eds-carousel__indicator\"\n                    [class.eds-carousel__indicator--active]=\"i === activeIndex()\"\n                    role=\"tab\"\n                    [attr.aria-selected]=\"i === activeIndex()\"\n                    [attr.aria-label]=\"'Go to slide ' + (i + 1)\"\n                    [attr.tabindex]=\"i === activeIndex() ? 0 : -1\"\n                    (click)=\"onIndicatorClick(i)\">\n                </button>\n            }\n        </div>\n    </div>\n}\n", styles: ["@keyframes eds-spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.eui-21 :host{display:block;position:relative;width:100%;overflow:hidden;border-radius:var(--eds-br-m)}.eui-21 :host .eds-carousel__viewport{position:relative;overflow:hidden;width:100%}.eui-21 :host .eds-carousel__track{display:flex;width:100%;will-change:transform}.eui-21 :host .eds-carousel__navigation{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:flex;justify-content:space-between;padding:0 var(--eds-sp-xs);pointer-events:none;z-index:2}.eui-21 :host .eds-carousel__nav-button{pointer-events:auto;background-color:var(--eds-c-surface-elevation);box-shadow:var(--eds-sh-1);transition:opacity .2s ease,box-shadow .2s ease}.eui-21 :host .eds-carousel__nav-button:hover{box-shadow:var(--eds-sh-2)}.eui-21 :host .eds-carousel__footer{display:flex;align-items:center;justify-content:center;gap:var(--eds-sp-s);padding:var(--eds-sp-s) 0}.eui-21 :host .eds-carousel__autoplay{display:flex;align-items:center}.eui-21 :host .eds-carousel__indicators{display:flex;align-items:center;gap:var(--eds-sp-2xs)}.eui-21 :host .eds-carousel__indicator{width:var(--eds-sp-s);height:var(--eds-sp-s);border-radius:var(--eds-br-full);border:var(--eds-bw-xs) solid var(--eds-c-border-neutral);background-color:transparent;padding:0;cursor:pointer;transition:background-color .2s ease,border-color .2s ease,transform .2s ease}.eui-21 :host .eds-carousel__indicator:hover{background-color:var(--eds-c-surface-neutral-subtle-hover);border-color:var(--eds-c-border-primary)}.eui-21 :host .eds-carousel__indicator:focus-visible:not([readonly]){outline:var(--eds-bw-s) solid var(--eds-c-border-primary)!important;outline-offset:1px!important;border-radius:var(--eds-br-full)!important}.eui-21 :host .eds-carousel__indicator--active{background-color:var(--eds-c-surface-primary);border-color:var(--eds-c-border-primary);transform:scale(1.2)}.eui-21 :host .eds-carousel__indicator--active:hover{background-color:var(--eds-c-surface-primary);border-color:var(--eds-c-border-primary)}.eui-21 :host.eds-carousel--single .eds-carousel__navigation,.eui-21 :host.eds-carousel--single .eds-carousel__footer{display:none}@media screen and (max-width:767px){.eui-21 :host{border-radius:0}.eui-21 :host .eds-carousel__navigation{padding:0 var(--eds-sp-3xs)}.eui-21 :host .eds-carousel__footer{padding:var(--eds-sp-xs) 0}.eui-21 :host .eds-carousel__indicator{width:var(--eds-sp-xs);height:var(--eds-sp-xs)}}\n"], dependencies: [{ kind: "component", type: i1.EdsIconButton, selector: "button[edsIconButton]", inputs: ["icon", "ariaLabel", "edsRounded", "edsDisabled"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EdsCarousel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EdsCarousel, decorators: [{
             type: Component,
             args: [{ selector: 'eds-carousel', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         ...EDS_ICON_BUTTON,