@idea-ionic/agenda 8.10.2 → 8.11.0

package/fesm2022/idea-ionic-agenda.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, inject, ChangeDetectorRef, EventEmitter, Output, Input, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
+import { Injectable, inject, ChangeDetectorRef, input, output, Input, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { formatDate, CommonModule } from '@angular/common';
 import * as i1$1 from '@angular/forms';
@@ -34,10 +34,10 @@ class CustomDateFormatter extends CalendarDateFormatter {
         this.dayViewHour = ({ date, locale }) => locale === 'it' ? formatDate(date, 'HH:mm', locale) : formatDate(date, 'h aa', locale);
         this.dayViewTitle = ({ date, locale }) => locale === 'it' ? formatDate(date, 'EEEE, dd MMM yyyy', locale) : formatDate(date, 'EEEE, MMM dd, yyyy', locale);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CustomDateFormatter, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CustomDateFormatter }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CustomDateFormatter, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CustomDateFormatter }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: CustomDateFormatter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: CustomDateFormatter, decorators: [{
             type: Injectable
         }] });
 
@@ -49,80 +49,99 @@ class IDEAAgendaComponent {
         /**
          * The events to display in the calendar.
          */
+        // TODO: Skipped for migration because:
+        //  Your application code writes to the input. This prevents migration.
         this.events = [];
         /**
          * An array of day indexes (0 = sunday, 1 = monday, etc.) that will be hidden on the view.
          */
-        this.excludeDays = [];
+        this.excludeDays = input([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "excludeDays" }] : /* istanbul ignore next */ []));
         /**
          * The day start hours in 24 hour time. Must be 0-23
          */
-        this.dayStartHour = 0;
+        this.dayStartHour = input(0, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "dayStartHour" }] : /* istanbul ignore next */ []));
         /**
          * The day start hours in 24 hour time. Must be 0-23
          */
-        this.dayEndHour = 23;
+        this.dayEndHour = input(23, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "dayEndHour" }] : /* istanbul ignore next */ []));
         /**
          * The number of segments in an hour. Must divide equally into 60.
          */
-        this.hourSegments = 2;
+        this.hourSegments = input(2, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hourSegments" }] : /* istanbul ignore next */ []));
         /**
          * Whether to open the current day's details right away in month view.
          */
+        // TODO: Skipped for migration because:
+        //  Your application code writes to the input. This prevents migration.
         this.activeDayIsOpen = false;
         /**
          * The view mode for the agenda.
          */
+        // TODO: Skipped for migration because:
+        //  Your application code writes to the input. This prevents migration.
         this.view = CalendarView.Week;
         /**
          * The allowed view mode for the agenda.
          */
+        // TODO: Skipped for migration because: This input is used in a control flow expression (e.g. `@if` or `*ngIf`) and migrating would break narrowing currently.
         this.allowedViews = [CalendarView.Day, CalendarView.Week, CalendarView.Month];
         /**
          * Whether to block any day/slot in the past.
          */
-        this.onlyFuture = false;
+        this.onlyFuture = input(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "onlyFuture" }] : /* istanbul ignore next */ []));
         /**
          * The template for new events created by drag&drop.
          */
-        this.newEventTemplate = { title: 'New', start: null, meta: {} };
+        this.newEventTemplate = input({ title: 'New', start: null, meta: {} }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "newEventTemplate" }] : /* istanbul ignore next */ []));
         /**
          * Whether (and how) to allow the creation of events by drag&drop.
          * If enabled, on mobile it requires the `parentContent` to be set for a correct execution.
          */
-        this.allowDragToCreate = DragToCreateOptions.DISABLED;
+        this.allowDragToCreate = input(DragToCreateOptions.DISABLED, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "allowDragToCreate" }] : /* istanbul ignore next */ []));
+        /**
+         * The parent ion-content, in case we want to control its scrollability for drag&drop features.
+         */
+        this.parentContent = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "parentContent" }] : /* istanbul ignore next */ []));
         /**
          * Trigger when an event is selected.
          */
-        this.selectEvent = new EventEmitter();
+        this.selectEvent = output();
         /**
          * Trigger when a day is selected.
          */
-        this.selectDay = new EventEmitter();
+        this.selectDay = output();
         /**
          * Trigger when a time slot is selected.
          */
-        this.selectSlot = new EventEmitter();
+        this.selectSlot = output();
         /**
          * Trigger when a new event is added by drag and drop.
          */
-        this.newEventByDrag = new EventEmitter();
+        this.newEventByDrag = output();
         /**
          * Trigger when an event changed date (drag&drop or resize).
          */
-        this.changeEvent = new EventEmitter();
+        this.changeEvent = output();
         /**
          * Trigger when the view date of reference changed (because we moved inside the calendar).
          */
-        this.changeDate = new EventEmitter();
+        this.changeDate = output();
         /**
          * Trigger before the rendering of the week or day view.
          */
-        this.beforeWeekOrDayViewRenderEmitter = new EventEmitter();
+        this.beforeWeekOrDayViewRenderEmitter = output();
         /**
          * Trigger before the rendering of the month view.
          */
-        this.beforeMonthViewRenderEmitter = new EventEmitter();
+        this.beforeMonthViewRenderEmitter = output();
         this.CalendarView = CalendarView;
         this.Attendance = EventAttendance;
         this.viewDate = new Date();
@@ -168,7 +187,7 @@ class IDEAAgendaComponent {
         });
     }
     dateIsValid(date, sameDayIsValid) {
-        if (!this.onlyFuture)
+        if (!this.onlyFuture())
             return true;
         return isFuture(date) || (sameDayIsValid ? isToday(date) : false);
     }
@@ -230,11 +249,12 @@ class IDEAAgendaComponent {
         return description && description.length > 100 ? description.slice(0, 100).concat('...') : description;
     }
     startDragToCreate(event, segmentDate, segmentElement) {
-        if (!this.allowDragToCreate)
+        if (!this.allowDragToCreate())
             return;
-        if (this.parentContent)
-            this.parentContent.scrollY = false;
-        const eventByDragAndDrop = { ...this.newEventTemplate, start: segmentDate };
+        const parentContent = this.parentContent();
+        if (parentContent)
+            parentContent.scrollY = false;
+        const eventByDragAndDrop = { ...this.newEventTemplate(), start: segmentDate };
         this.events = [...this.events, eventByDragAndDrop];
         const segmentPosition = segmentElement.getBoundingClientRect();
         const endOfView = endOfWeek(this.viewDate, { weekStartsOn: this.weekStartsOn });
@@ -243,7 +263,7 @@ class IDEAAgendaComponent {
             const minutesDiff = ceilToNearest(clientY - segmentPosition.top, 30);
             const daysDiff = floorToNearest(clientX - segmentPosition.left, segmentPosition.width) / segmentPosition.width;
             let newEnd;
-            if (this.allowDragToCreate === DragToCreateOptions.ONLY_SAME_DAY)
+            if (this.allowDragToCreate() === DragToCreateOptions.ONLY_SAME_DAY)
                 newEnd = addMinutes(segmentDate, minutesDiff);
             else
                 newEnd = addDays(addMinutes(segmentDate, minutesDiff), daysDiff);
@@ -252,8 +272,9 @@ class IDEAAgendaComponent {
             refreshView();
         };
         const endOfDrag = () => {
-            if (this.parentContent)
-                this.parentContent.scrollY = true;
+            const parentContentValue = this.parentContent();
+            if (parentContentValue)
+                parentContentValue.scrollY = true;
             eventByDragAndDrop.end = this.getFixedEndDateWithMinimumSegmentDuration(eventByDragAndDrop);
             refreshView();
             this.newEventByDrag.emit(eventByDragAndDrop);
@@ -275,60 +296,28 @@ class IDEAAgendaComponent {
     }
     getFixedEndDateWithMinimumSegmentDuration(agendaBooking) {
         const fixedEnd = new Date(agendaBooking.end || agendaBooking.start);
-        const segmentSizeInMinutes = 60 / this.hourSegments;
+        const segmentSizeInMinutes = 60 / this.hourSegments();
         if (fixedEnd.getTime() <= agendaBooking.start.getTime() + segmentSizeInMinutes * 60 * 1000)
             fixedEnd.setMinutes(agendaBooking.start.getMinutes() + segmentSizeInMinutes);
         return fixedEnd;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEAAgendaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IDEAAgendaComponent, isStandalone: false, selector: "idea-agenda", inputs: { events: "events", excludeDays: "excludeDays", dayStartHour: "dayStartHour", dayEndHour: "dayEndHour", hourSegments: "hourSegments", activeDayIsOpen: "activeDayIsOpen", view: "view", allowedViews: "allowedViews", onlyFuture: "onlyFuture", titleNotes: "titleNotes", newEventTemplate: "newEventTemplate", allowDragToCreate: "allowDragToCreate", parentContent: "parentContent" }, outputs: { selectEvent: "selectEvent", selectDay: "selectDay", selectSlot: "selectSlot", newEventByDrag: "newEventByDrag", changeEvent: "changeEvent", changeDate: "changeDate", beforeWeekOrDayViewRenderEmitter: "beforeWeekOrDayViewRenderEmitter", beforeMonthViewRenderEmitter: "beforeMonthViewRenderEmitter" }, ngImport: i0, template: "<div class=\"agenda\">\n  <!-- TOOLBAR -->\n  <ion-row class=\"ion-align-items-center\">\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"5\"\n      [sizeSm]=\"3\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      @if (allowedViews.length > 1) {\n        <ion-item lines=\"none\" class=\"calendarViewSelector\">\n          <ion-select\n            interface=\"popover\"\n            [value]=\"view\"\n            (ionChange)=\"$event?.detail ? setView($event.detail.value) : null\"\n          >\n            @for (view of allowedViews; track view) {\n              <ion-select-option [value]=\"view\">\n                {{ 'IDEA_AGENDA.' + view | uppercase | translate }}\n              </ion-select-option>\n            }\n          </ion-select>\n        </ion-item>\n      }\n    </ion-col>\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"7\"\n      [sizeSm]=\"4\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarPreviousView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-back-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarToday\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"today-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarNextView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-forward-outline\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-col>\n    <ion-col class=\"ion-align-self-center titleCol\" [size]=\"12\" [sizeSm]=\"5\" [pullSm]=\"7\" [sizeLg]=\"8\" [pullLg]=\"4\">\n      <h2>{{ viewDate | calendarDate: view + 'ViewTitle' : locale }}</h2>\n      @if (titleNotes) {\n        <p>{{ titleNotes }}</p>\n      }\n    </ion-col>\n  </ion-row>\n  <!-- TEMPLATES (touch only what's necessary and leave everything else as it is) -->\n  <ng-template #eventTitleTemplate let-event=\"event\" let-view=\"view\">\n    <span\n      class=\"cal-event-title\"\n      [class.noWrap]=\"event.allDay\"\n      [attr.aria-hidden]=\"{} | calendarA11y: 'hideEventTitle'\"\n    >\n      {{ event.title | calendarEventTitle: view : event }}\n      @if (event.target) {\n        <p>{{ event.target }}</p>\n      } @else {\n        @if (event.location) {\n          <p>{{ event.location }}</p>\n        }\n      }\n      @if (!event.allDay) {\n        <p>{{ getPreviewDescription(event.description) }}</p>\n      }\n    </span>\n  </ng-template>\n  <ng-template\n    #eventTemplate\n    let-weekEvent=\"weekEvent\"\n    let-tooltipPlacement=\"tooltipPlacement\"\n    let-eventClicked=\"eventClicked\"\n    let-tooltipTemplate=\"tooltipTemplate\"\n    let-tooltipAppendToBody=\"tooltipAppendToBody\"\n    let-tooltipDisabled=\"tooltipDisabled\"\n    let-tooltipDelay=\"tooltipDelay\"\n    let-column=\"column\"\n    let-daysInWeek=\"daysInWeek\"\n  >\n    <div\n      class=\"cal-event\"\n      [class.external]=\"weekEvent.event.external\"\n      [class.allDay]=\"weekEvent.event.allDay\"\n      [class.needsAction]=\"Attendance.NEEDS_ACTION === weekEvent.event.attendance\"\n      [class.declined]=\"Attendance.DECLINED === weekEvent.event.attendance\"\n      [class.tentative]=\"Attendance.TENTATIVE === weekEvent.event.attendance\"\n      [style.border-left-color]=\"weekEvent.event.color?.primary\"\n      [style.color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 80 : -40)\"\n      [style.background-color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 60 : 80, 0.2)\"\n      [mwlCalendarTooltip]=\"!tooltipDisabled && !isMobile() ? getTooltipContent(weekEvent.event) : ''\"\n      [tooltipPlacement]=\"tooltipPlacement\"\n      [tooltipEvent]=\"weekEvent.tempEvent || weekEvent.event\"\n      [tooltipTemplate]=\"tooltipTemplate\"\n      [tooltipAppendToBody]=\"tooltipAppendToBody\"\n      [tooltipDelay]=\"tooltipDelay\"\n      (mwlClick)=\"eventClicked.emit({ sourceEvent: $event })\"\n      (mwlKeydownEnter)=\"eventClicked.emit({ sourceEvent: $event })\"\n      tabindex=\"0\"\n      role=\"application\"\n      [attr.aria-label]=\"\n        { event: weekEvent.tempEvent || weekEvent.event, locale: locale } | calendarA11y: 'eventDescription'\n      \"\n    >\n      <mwl-calendar-event-actions [event]=\"weekEvent.tempEvent || weekEvent.event\" />\n      &ngsp;\n      <mwl-calendar-event-title\n        [event]=\"weekEvent.tempEvent || weekEvent.event\"\n        [customTemplate]=\"eventTitleTemplate\"\n        [view]=\"daysInWeek === 1 ? 'day' : 'week'\"\n      >\n      </mwl-calendar-event-title>\n      @if (!weekEvent.event.allDay) {\n        <div class=\"eventGadgets\">\n          @for (icon of weekEvent.event.icons; track icon) {\n            <ion-icon [name]=\"icon.name\" [title]=\"icon.title\" />\n          }\n          @for (avatar of weekEvent.event.avatars; track avatar) {\n            <idea-user-avatar size=\"mini\" [src]=\"avatar.url\" [name]=\"avatar.title\" />\n          }\n        </div>\n      }\n    </div>\n  </ng-template>\n  <ng-template\n    #hourSegmentTemplate\n    let-segment=\"segment\"\n    let-locale=\"locale\"\n    let-segmentHeight=\"segmentHeight\"\n    let-isTimeLabel=\"isTimeLabel\"\n  >\n    <div\n      #segmentElement\n      class=\"cal-hour-segment\"\n      [style.height.px]=\"segmentHeight\"\n      [class.cal-hour-start]=\"segment.isStart\"\n      [class.cal-after-hour-start]=\"!segment.isStart\"\n      [ngClass]=\"segment.cssClass\"\n      (mousedown)=\"allowDragToCreate ? startDragToCreate($event, segment.date, segmentElement) : null\"\n      (touchstart)=\"allowDragToCreate ? startDragToCreate($event, segment.date, segmentElement) : null\"\n    >\n      @if (isTimeLabel) {\n        <div class=\"cal-time\">\n          {{ segment.date | calendarDate: 'weekViewHour' : locale }}\n        </div>\n      }\n    </div>\n  </ng-template>\n  <!-- VIEWS -->\n  <div>\n    @switch (view) {\n      @case (CalendarView.Month) {\n        <mwl-calendar-month-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [activeDayIsOpen]=\"activeDayIsOpen\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [eventTitleTemplate]=\"eventTitleTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayClicked)=\"changeDay($event.day)\"\n          (beforeViewRender)=\"beforeMonthViewRender($event)\"\n        >\n        </mwl-calendar-month-view>\n      }\n      @case (CalendarView.Week) {\n        <mwl-calendar-week-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [dayStartHour]=\"dayStartHour\"\n          [dayEndHour]=\"dayEndHour\"\n          [hourSegments]=\"hourSegments\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayHeaderClicked)=\"dateIsValid($event.day.date) ? selectDay.emit($event.day.date) : null\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-week-view>\n      }\n      @case (CalendarView.Day) {\n        <mwl-calendar-day-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [dayStartHour]=\"dayStartHour\"\n          [dayEndHour]=\"dayEndHour\"\n          [hourSegments]=\"hourSegments\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-day-view>\n      }\n    }\n  </div>\n</div>\n", styles: [".agenda{margin-top:15px}.agenda ion-col.titleCol{padding-left:8px}.agenda ion-col.titleCol h2,.agenda ion-col.titleCol p{margin:0}.agenda ion-col.titleCol h2{font-size:1.2em}.agenda ion-col.titleCol p{font-size:.8em;font-style:italic}.agenda .calendarViewSelector{background-color:transparent;--ion-background-color: transparent;--background: transparent}.agenda .calendarViewSelector ion-select{max-width:100%;width:100%;padding-left:0;font-weight:500}.agenda .eventGadgets{margin-top:4px;margin-left:5px;text-align:right}.agenda .eventGadgets idea-user-avatar{display:block;float:left;margin:2px 1px}.agenda .eventGadgets ion-icon{padding-right:2px;opacity:.7;font-size:1.15em}@media only screen and (max-width: 575px){.agenda ion-col.titleCol{padding:0 8px 12px;text-align:center}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonRow, selector: "ion-row" }, { kind: "component", type: i2.IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "errorText", "expandedIcon", "fill", "helperText", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "mode", "multiple", "name", "okText", "placeholder", "required", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: i2.IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "directive", type: i2.SelectValueAccessor, selector: "ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "component", type: i3.IDEAUserAvatarComponent, selector: "idea-user-avatar", inputs: ["src", "name", "size", "color"] }, { kind: "component", type: i4.ɵCalendarEventActionsComponent, selector: "mwl-calendar-event-actions", inputs: ["event", "customTemplate"] }, { kind: "component", type: i4.ɵCalendarEventTitleComponent, selector: "mwl-calendar-event-title", inputs: ["event", "customTemplate", "view"] }, { kind: "directive", type: i4.ɵCalendarTooltipDirective, selector: "[mwlCalendarTooltip]", inputs: ["mwlCalendarTooltip", "tooltipPlacement", "tooltipTemplate", "tooltipEvent", "tooltipAppendToBody", "tooltipDelay"] }, { kind: "directive", type: i4.ɵCalendarPreviousViewDirective, selector: "[mwlCalendarPreviousView]", inputs: ["view", "viewDate", "excludeDays", "daysInWeek"], outputs: ["viewDateChange"] }, { kind: "directive", type: i4.ɵCalendarNextViewDirective, selector: "[mwlCalendarNextView]", inputs: ["view", "viewDate", "excludeDays", "daysInWeek"], outputs: ["viewDateChange"] }, { kind: "directive", type: i4.ɵCalendarTodayDirective, selector: "[mwlCalendarToday]", inputs: ["viewDate"], outputs: ["viewDateChange"] }, { kind: "directive", type: i4.ɵClickDirective, selector: "[mwlClick]", inputs: ["clickListenerDisabled"], outputs: ["mwlClick"] }, { kind: "directive", type: i4.ɵKeydownEnterDirective, selector: "[mwlKeydownEnter]", outputs: ["mwlKeydownEnter"] }, { kind: "component", type: i4.CalendarMonthViewComponent, selector: "mwl-calendar-month-view", inputs: ["viewDate", "events", "excludeDays", "activeDayIsOpen", "activeDay", "refresh", "locale", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "weekStartsOn", "headerTemplate", "cellTemplate", "openDayEventsTemplate", "eventTitleTemplate", "eventActionsTemplate", "weekendDays"], outputs: ["beforeViewRender", "dayClicked", "eventClicked", "columnHeaderClicked", "eventTimesChanged"] }, { kind: "component", type: i4.CalendarWeekViewComponent, selector: "mwl-calendar-week-view", inputs: ["viewDate", "events", "excludeDays", "refresh", "locale", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "weekStartsOn", "headerTemplate", "eventTemplate", "eventTitleTemplate", "eventActionsTemplate", "precision", "weekendDays", "snapDraggedEvents", "hourSegments", "hourDuration", "hourSegmentHeight", "minimumEventHeight", "dayStartHour", "dayStartMinute", "dayEndHour", "dayEndMinute", "hourSegmentTemplate", "eventSnapSize", "allDayEventsLabelTemplate", "daysInWeek", "currentTimeMarkerTemplate", "validateEventTimesChanged", "resizeCursors"], outputs: ["dayHeaderClicked", "eventClicked", "eventTimesChanged", "beforeViewRender", "hourSegmentClicked"] }, { kind: "component", type: i4.CalendarDayViewComponent, selector: "mwl-calendar-day-view", inputs: ["viewDate", "events", "hourSegments", "hourSegmentHeight", "hourDuration", "minimumEventHeight", "dayStartHour", "dayStartMinute", "dayEndHour", "dayEndMinute", "refresh", "locale", "eventSnapSize", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "hourSegmentTemplate", "eventTemplate", "eventTitleTemplate", "eventActionsTemplate", "snapDraggedEvents", "allDayEventsLabelTemplate", "currentTimeMarkerTemplate", "validateEventTimesChanged", "resizeCursors"], outputs: ["eventClicked", "hourSegmentClicked", "eventTimesChanged", "beforeViewRender"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }, { kind: "pipe", type: i4.ɵCalendarDatePipe, name: "calendarDate" }, { kind: "pipe", type: i4.ɵCalendarEventTitlePipe, name: "calendarEventTitle" }, { kind: "pipe", type: i4.ɵCalendarA11yPipe, name: "calendarA11y" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEAAgendaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: IDEAAgendaComponent, isStandalone: false, selector: "idea-agenda", inputs: { events: { classPropertyName: "events", publicName: "events", isSignal: false, isRequired: false, transformFunction: null }, excludeDays: { classPropertyName: "excludeDays", publicName: "excludeDays", isSignal: true, isRequired: false, transformFunction: null }, dayStartHour: { classPropertyName: "dayStartHour", publicName: "dayStartHour", isSignal: true, isRequired: false, transformFunction: null }, dayEndHour: { classPropertyName: "dayEndHour", publicName: "dayEndHour", isSignal: true, isRequired: false, transformFunction: null }, hourSegments: { classPropertyName: "hourSegments", publicName: "hourSegments", isSignal: true, isRequired: false, transformFunction: null }, activeDayIsOpen: { classPropertyName: "activeDayIsOpen", publicName: "activeDayIsOpen", isSignal: false, isRequired: false, transformFunction: null }, view: { classPropertyName: "view", publicName: "view", isSignal: false, isRequired: false, transformFunction: null }, allowedViews: { classPropertyName: "allowedViews", publicName: "allowedViews", isSignal: false, isRequired: false, transformFunction: null }, onlyFuture: { classPropertyName: "onlyFuture", publicName: "onlyFuture", isSignal: true, isRequired: false, transformFunction: null }, titleNotes: { classPropertyName: "titleNotes", publicName: "titleNotes", isSignal: false, isRequired: false, transformFunction: null }, newEventTemplate: { classPropertyName: "newEventTemplate", publicName: "newEventTemplate", isSignal: true, isRequired: false, transformFunction: null }, allowDragToCreate: { classPropertyName: "allowDragToCreate", publicName: "allowDragToCreate", isSignal: true, isRequired: false, transformFunction: null }, parentContent: { classPropertyName: "parentContent", publicName: "parentContent", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectEvent: "selectEvent", selectDay: "selectDay", selectSlot: "selectSlot", newEventByDrag: "newEventByDrag", changeEvent: "changeEvent", changeDate: "changeDate", beforeWeekOrDayViewRenderEmitter: "beforeWeekOrDayViewRenderEmitter", beforeMonthViewRenderEmitter: "beforeMonthViewRenderEmitter" }, ngImport: i0, template: "<div class=\"agenda\">\n  <!-- TOOLBAR -->\n  <ion-row class=\"ion-align-items-center\">\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"5\"\n      [sizeSm]=\"3\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      @if (allowedViews.length > 1) {\n        <ion-item lines=\"none\" class=\"calendarViewSelector\">\n          <ion-select\n            interface=\"popover\"\n            [value]=\"view\"\n            (ionChange)=\"$event?.detail ? setView($event.detail.value) : null\"\n          >\n            @for (view of allowedViews; track view) {\n              <ion-select-option [value]=\"view\">\n                {{ 'IDEA_AGENDA.' + view | uppercase | translate }}\n              </ion-select-option>\n            }\n          </ion-select>\n        </ion-item>\n      }\n    </ion-col>\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"7\"\n      [sizeSm]=\"4\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarPreviousView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-back-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarToday\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"today-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarNextView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-forward-outline\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-col>\n    <ion-col class=\"ion-align-self-center titleCol\" [size]=\"12\" [sizeSm]=\"5\" [pullSm]=\"7\" [sizeLg]=\"8\" [pullLg]=\"4\">\n      <h2>{{ viewDate | calendarDate: view + 'ViewTitle' : locale }}</h2>\n      @if (titleNotes) {\n        <p>{{ titleNotes }}</p>\n      }\n    </ion-col>\n  </ion-row>\n  <!-- TEMPLATES (touch only what's necessary and leave everything else as it is) -->\n  <ng-template #eventTitleTemplate let-event=\"event\" let-view=\"view\">\n    <span\n      class=\"cal-event-title\"\n      [class.noWrap]=\"event.allDay\"\n      [attr.aria-hidden]=\"{} | calendarA11y: 'hideEventTitle'\"\n    >\n      {{ event.title | calendarEventTitle: view : event }}\n      @if (event.target) {\n        <p>{{ event.target }}</p>\n      } @else {\n        @if (event.location) {\n          <p>{{ event.location }}</p>\n        }\n      }\n      @if (!event.allDay) {\n        <p>{{ getPreviewDescription(event.description) }}</p>\n      }\n    </span>\n  </ng-template>\n  <ng-template\n    #eventTemplate\n    let-weekEvent=\"weekEvent\"\n    let-tooltipPlacement=\"tooltipPlacement\"\n    let-eventClicked=\"eventClicked\"\n    let-tooltipTemplate=\"tooltipTemplate\"\n    let-tooltipAppendToBody=\"tooltipAppendToBody\"\n    let-tooltipDisabled=\"tooltipDisabled\"\n    let-tooltipDelay=\"tooltipDelay\"\n    let-column=\"column\"\n    let-daysInWeek=\"daysInWeek\"\n  >\n    <div\n      class=\"cal-event\"\n      [class.external]=\"weekEvent.event.external\"\n      [class.allDay]=\"weekEvent.event.allDay\"\n      [class.needsAction]=\"Attendance.NEEDS_ACTION === weekEvent.event.attendance\"\n      [class.declined]=\"Attendance.DECLINED === weekEvent.event.attendance\"\n      [class.tentative]=\"Attendance.TENTATIVE === weekEvent.event.attendance\"\n      [style.border-left-color]=\"weekEvent.event.color?.primary\"\n      [style.color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 80 : -40)\"\n      [style.background-color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 60 : 80, 0.2)\"\n      [mwlCalendarTooltip]=\"!tooltipDisabled && !isMobile() ? getTooltipContent(weekEvent.event) : ''\"\n      [tooltipPlacement]=\"tooltipPlacement\"\n      [tooltipEvent]=\"weekEvent.tempEvent || weekEvent.event\"\n      [tooltipTemplate]=\"tooltipTemplate\"\n      [tooltipAppendToBody]=\"tooltipAppendToBody\"\n      [tooltipDelay]=\"tooltipDelay\"\n      (mwlClick)=\"eventClicked.emit({ sourceEvent: $event })\"\n      (mwlKeydownEnter)=\"eventClicked.emit({ sourceEvent: $event })\"\n      tabindex=\"0\"\n      role=\"application\"\n      [attr.aria-label]=\"\n        { event: weekEvent.tempEvent || weekEvent.event, locale: locale } | calendarA11y: 'eventDescription'\n      \"\n    >\n      <mwl-calendar-event-actions [event]=\"weekEvent.tempEvent || weekEvent.event\" />\n      &ngsp;\n      <mwl-calendar-event-title\n        [event]=\"weekEvent.tempEvent || weekEvent.event\"\n        [customTemplate]=\"eventTitleTemplate\"\n        [view]=\"daysInWeek === 1 ? 'day' : 'week'\"\n      >\n      </mwl-calendar-event-title>\n      @if (!weekEvent.event.allDay) {\n        <div class=\"eventGadgets\">\n          @for (icon of weekEvent.event.icons; track icon) {\n            <ion-icon [name]=\"icon.name\" [title]=\"icon.title\" />\n          }\n          @for (avatar of weekEvent.event.avatars; track avatar) {\n            <idea-user-avatar size=\"mini\" [src]=\"avatar.url\" [name]=\"avatar.title\" />\n          }\n        </div>\n      }\n    </div>\n  </ng-template>\n  <ng-template\n    #hourSegmentTemplate\n    let-segment=\"segment\"\n    let-locale=\"locale\"\n    let-segmentHeight=\"segmentHeight\"\n    let-isTimeLabel=\"isTimeLabel\"\n  >\n    <div\n      #segmentElement\n      class=\"cal-hour-segment\"\n      [style.height.px]=\"segmentHeight\"\n      [class.cal-hour-start]=\"segment.isStart\"\n      [class.cal-after-hour-start]=\"!segment.isStart\"\n      [ngClass]=\"segment.cssClass\"\n      (mousedown)=\"allowDragToCreate() ? startDragToCreate($event, segment.date, segmentElement) : null\"\n      (touchstart)=\"allowDragToCreate() ? startDragToCreate($event, segment.date, segmentElement) : null\"\n    >\n      @if (isTimeLabel) {\n        <div class=\"cal-time\">\n          {{ segment.date | calendarDate: 'weekViewHour' : locale }}\n        </div>\n      }\n    </div>\n  </ng-template>\n  <!-- VIEWS -->\n  <div>\n    @switch (view) {\n      @case (CalendarView.Month) {\n        <mwl-calendar-month-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [activeDayIsOpen]=\"activeDayIsOpen\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays()\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [eventTitleTemplate]=\"eventTitleTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayClicked)=\"changeDay($event.day)\"\n          (beforeViewRender)=\"beforeMonthViewRender($event)\"\n        >\n        </mwl-calendar-month-view>\n      }\n      @case (CalendarView.Week) {\n        <mwl-calendar-week-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays()\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [dayStartHour]=\"dayStartHour()\"\n          [dayEndHour]=\"dayEndHour()\"\n          [hourSegments]=\"hourSegments()\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayHeaderClicked)=\"dateIsValid($event.day.date) ? selectDay.emit($event.day.date) : null\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-week-view>\n      }\n      @case (CalendarView.Day) {\n        <mwl-calendar-day-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [dayStartHour]=\"dayStartHour()\"\n          [dayEndHour]=\"dayEndHour()\"\n          [hourSegments]=\"hourSegments()\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-day-view>\n      }\n    }\n  </div>\n</div>\n", styles: [".agenda{margin-top:15px}.agenda ion-col.titleCol{padding-left:8px}.agenda ion-col.titleCol h2,.agenda ion-col.titleCol p{margin:0}.agenda ion-col.titleCol h2{font-size:1.2em}.agenda ion-col.titleCol p{font-size:.8em;font-style:italic}.agenda .calendarViewSelector{background-color:transparent;--ion-background-color: transparent;--background: transparent}.agenda .calendarViewSelector ion-select{max-width:100%;width:100%;padding-left:0;font-weight:500}.agenda .eventGadgets{margin-top:4px;margin-left:5px;text-align:right}.agenda .eventGadgets idea-user-avatar{display:block;float:left;margin:2px 1px}.agenda .eventGadgets ion-icon{padding-right:2px;opacity:.7;font-size:1.15em}@media only screen and (max-width:575px){.agenda ion-col.titleCol{padding:0 8px 12px;text-align:center}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonRow, selector: "ion-row" }, { kind: "component", type: i2.IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "errorText", "expandedIcon", "fill", "helperText", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "mode", "multiple", "name", "okText", "placeholder", "required", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: i2.IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "directive", type: i2.SelectValueAccessor, selector: "ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "component", type: i3.IDEAUserAvatarComponent, selector: "idea-user-avatar", inputs: ["src", "name", "size", "color"] }, { kind: "component", type: i4.CalendarEventActionsComponent, selector: "mwl-calendar-event-actions", inputs: ["event", "customTemplate"] }, { kind: "component", type: i4.CalendarEventTitleComponent, selector: "mwl-calendar-event-title", inputs: ["event", "customTemplate", "view"] }, { kind: "directive", type: i4.CalendarTooltipDirective, selector: "[mwlCalendarTooltip]", inputs: ["mwlCalendarTooltip", "tooltipPlacement", "tooltipTemplate", "tooltipEvent", "tooltipAppendToBody", "tooltipDelay"] }, { kind: "directive", type: i4.CalendarPreviousViewDirective, selector: "[mwlCalendarPreviousView]", inputs: ["view", "viewDate", "excludeDays", "daysInWeek"], outputs: ["viewDateChange"] }, { kind: "directive", type: i4.CalendarNextViewDirective, selector: "[mwlCalendarNextView]", inputs: ["view", "viewDate", "excludeDays", "daysInWeek"], outputs: ["viewDateChange"] }, { kind: "directive", type: i4.CalendarTodayDirective, selector: "[mwlCalendarToday]", inputs: ["viewDate"], outputs: ["viewDateChange"] }, { kind: "directive", type: i4.ClickDirective, selector: "[mwlClick]", inputs: ["clickListenerDisabled"], outputs: ["mwlClick"] }, { kind: "directive", type: i4.KeydownEnterDirective, selector: "[mwlKeydownEnter]", outputs: ["mwlKeydownEnter"] }, { kind: "component", type: i4.CalendarMonthViewComponent, selector: "mwl-calendar-month-view", inputs: ["viewDate", "events", "excludeDays", "activeDayIsOpen", "activeDay", "refresh", "locale", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "weekStartsOn", "headerTemplate", "cellTemplate", "openDayEventsTemplate", "eventTitleTemplate", "eventActionsTemplate", "weekendDays"], outputs: ["beforeViewRender", "dayClicked", "eventClicked", "columnHeaderClicked", "eventTimesChanged"] }, { kind: "component", type: i4.CalendarWeekViewComponent, selector: "mwl-calendar-week-view", inputs: ["viewDate", "events", "excludeDays", "refresh", "locale", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "weekStartsOn", "headerTemplate", "eventTemplate", "eventTitleTemplate", "eventActionsTemplate", "precision", "weekendDays", "snapDraggedEvents", "hourSegments", "hourDuration", "hourSegmentHeight", "minimumEventHeight", "dayStartHour", "dayStartMinute", "dayEndHour", "dayEndMinute", "hourSegmentTemplate", "eventSnapSize", "allDayEventsLabelTemplate", "daysInWeek", "currentTimeMarkerTemplate", "validateEventTimesChanged", "resizeCursors"], outputs: ["dayHeaderClicked", "eventClicked", "eventTimesChanged", "beforeViewRender", "hourSegmentClicked"] }, { kind: "component", type: i4.CalendarDayViewComponent, selector: "mwl-calendar-day-view", inputs: ["viewDate", "events", "hourSegments", "hourSegmentHeight", "hourDuration", "minimumEventHeight", "dayStartHour", "dayStartMinute", "dayEndHour", "dayEndMinute", "refresh", "locale", "eventSnapSize", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "hourSegmentTemplate", "eventTemplate", "eventTitleTemplate", "eventActionsTemplate", "snapDraggedEvents", "allDayEventsLabelTemplate", "currentTimeMarkerTemplate", "validateEventTimesChanged", "resizeCursors"], outputs: ["eventClicked", "hourSegmentClicked", "eventTimesChanged", "beforeViewRender"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }, { kind: "pipe", type: i4.CalendarDatePipe, name: "calendarDate" }, { kind: "pipe", type: i4.CalendarEventTitlePipe, name: "calendarEventTitle" }, { kind: "pipe", type: i4.CalendarA11yPipe, name: "calendarA11y" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEAAgendaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEAAgendaComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'idea-agenda', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"agenda\">\n  <!-- TOOLBAR -->\n  <ion-row class=\"ion-align-items-center\">\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"5\"\n      [sizeSm]=\"3\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      @if (allowedViews.length > 1) {\n        <ion-item lines=\"none\" class=\"calendarViewSelector\">\n          <ion-select\n            interface=\"popover\"\n            [value]=\"view\"\n            (ionChange)=\"$event?.detail ? setView($event.detail.value) : null\"\n          >\n            @for (view of allowedViews; track view) {\n              <ion-select-option [value]=\"view\">\n                {{ 'IDEA_AGENDA.' + view | uppercase | translate }}\n              </ion-select-option>\n            }\n          </ion-select>\n        </ion-item>\n      }\n    </ion-col>\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"7\"\n      [sizeSm]=\"4\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarPreviousView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-back-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarToday\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"today-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarNextView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-forward-outline\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-col>\n    <ion-col class=\"ion-align-self-center titleCol\" [size]=\"12\" [sizeSm]=\"5\" [pullSm]=\"7\" [sizeLg]=\"8\" [pullLg]=\"4\">\n      <h2>{{ viewDate | calendarDate: view + 'ViewTitle' : locale }}</h2>\n      @if (titleNotes) {\n        <p>{{ titleNotes }}</p>\n      }\n    </ion-col>\n  </ion-row>\n  <!-- TEMPLATES (touch only what's necessary and leave everything else as it is) -->\n  <ng-template #eventTitleTemplate let-event=\"event\" let-view=\"view\">\n    <span\n      class=\"cal-event-title\"\n      [class.noWrap]=\"event.allDay\"\n      [attr.aria-hidden]=\"{} | calendarA11y: 'hideEventTitle'\"\n    >\n      {{ event.title | calendarEventTitle: view : event }}\n      @if (event.target) {\n        <p>{{ event.target }}</p>\n      } @else {\n        @if (event.location) {\n          <p>{{ event.location }}</p>\n        }\n      }\n      @if (!event.allDay) {\n        <p>{{ getPreviewDescription(event.description) }}</p>\n      }\n    </span>\n  </ng-template>\n  <ng-template\n    #eventTemplate\n    let-weekEvent=\"weekEvent\"\n    let-tooltipPlacement=\"tooltipPlacement\"\n    let-eventClicked=\"eventClicked\"\n    let-tooltipTemplate=\"tooltipTemplate\"\n    let-tooltipAppendToBody=\"tooltipAppendToBody\"\n    let-tooltipDisabled=\"tooltipDisabled\"\n    let-tooltipDelay=\"tooltipDelay\"\n    let-column=\"column\"\n    let-daysInWeek=\"daysInWeek\"\n  >\n    <div\n      class=\"cal-event\"\n      [class.external]=\"weekEvent.event.external\"\n      [class.allDay]=\"weekEvent.event.allDay\"\n      [class.needsAction]=\"Attendance.NEEDS_ACTION === weekEvent.event.attendance\"\n      [class.declined]=\"Attendance.DECLINED === weekEvent.event.attendance\"\n      [class.tentative]=\"Attendance.TENTATIVE === weekEvent.event.attendance\"\n      [style.border-left-color]=\"weekEvent.event.color?.primary\"\n      [style.color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 80 : -40)\"\n      [style.background-color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 60 : 80, 0.2)\"\n      [mwlCalendarTooltip]=\"!tooltipDisabled && !isMobile() ? getTooltipContent(weekEvent.event) : ''\"\n      [tooltipPlacement]=\"tooltipPlacement\"\n      [tooltipEvent]=\"weekEvent.tempEvent || weekEvent.event\"\n      [tooltipTemplate]=\"tooltipTemplate\"\n      [tooltipAppendToBody]=\"tooltipAppendToBody\"\n      [tooltipDelay]=\"tooltipDelay\"\n      (mwlClick)=\"eventClicked.emit({ sourceEvent: $event })\"\n      (mwlKeydownEnter)=\"eventClicked.emit({ sourceEvent: $event })\"\n      tabindex=\"0\"\n      role=\"application\"\n      [attr.aria-label]=\"\n        { event: weekEvent.tempEvent || weekEvent.event, locale: locale } | calendarA11y: 'eventDescription'\n      \"\n    >\n      <mwl-calendar-event-actions [event]=\"weekEvent.tempEvent || weekEvent.event\" />\n      &ngsp;\n      <mwl-calendar-event-title\n        [event]=\"weekEvent.tempEvent || weekEvent.event\"\n        [customTemplate]=\"eventTitleTemplate\"\n        [view]=\"daysInWeek === 1 ? 'day' : 'week'\"\n      >\n      </mwl-calendar-event-title>\n      @if (!weekEvent.event.allDay) {\n        <div class=\"eventGadgets\">\n          @for (icon of weekEvent.event.icons; track icon) {\n            <ion-icon [name]=\"icon.name\" [title]=\"icon.title\" />\n          }\n          @for (avatar of weekEvent.event.avatars; track avatar) {\n            <idea-user-avatar size=\"mini\" [src]=\"avatar.url\" [name]=\"avatar.title\" />\n          }\n        </div>\n      }\n    </div>\n  </ng-template>\n  <ng-template\n    #hourSegmentTemplate\n    let-segment=\"segment\"\n    let-locale=\"locale\"\n    let-segmentHeight=\"segmentHeight\"\n    let-isTimeLabel=\"isTimeLabel\"\n  >\n    <div\n      #segmentElement\n      class=\"cal-hour-segment\"\n      [style.height.px]=\"segmentHeight\"\n      [class.cal-hour-start]=\"segment.isStart\"\n      [class.cal-after-hour-start]=\"!segment.isStart\"\n      [ngClass]=\"segment.cssClass\"\n      (mousedown)=\"allowDragToCreate ? startDragToCreate($event, segment.date, segmentElement) : null\"\n      (touchstart)=\"allowDragToCreate ? startDragToCreate($event, segment.date, segmentElement) : null\"\n    >\n      @if (isTimeLabel) {\n        <div class=\"cal-time\">\n          {{ segment.date | calendarDate: 'weekViewHour' : locale }}\n        </div>\n      }\n    </div>\n  </ng-template>\n  <!-- VIEWS -->\n  <div>\n    @switch (view) {\n      @case (CalendarView.Month) {\n        <mwl-calendar-month-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [activeDayIsOpen]=\"activeDayIsOpen\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [eventTitleTemplate]=\"eventTitleTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayClicked)=\"changeDay($event.day)\"\n          (beforeViewRender)=\"beforeMonthViewRender($event)\"\n        >\n        </mwl-calendar-month-view>\n      }\n      @case (CalendarView.Week) {\n        <mwl-calendar-week-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [dayStartHour]=\"dayStartHour\"\n          [dayEndHour]=\"dayEndHour\"\n          [hourSegments]=\"hourSegments\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayHeaderClicked)=\"dateIsValid($event.day.date) ? selectDay.emit($event.day.date) : null\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-week-view>\n      }\n      @case (CalendarView.Day) {\n        <mwl-calendar-day-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [dayStartHour]=\"dayStartHour\"\n          [dayEndHour]=\"dayEndHour\"\n          [hourSegments]=\"hourSegments\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-day-view>\n      }\n    }\n  </div>\n</div>\n", styles: [".agenda{margin-top:15px}.agenda ion-col.titleCol{padding-left:8px}.agenda ion-col.titleCol h2,.agenda ion-col.titleCol p{margin:0}.agenda ion-col.titleCol h2{font-size:1.2em}.agenda ion-col.titleCol p{font-size:.8em;font-style:italic}.agenda .calendarViewSelector{background-color:transparent;--ion-background-color: transparent;--background: transparent}.agenda .calendarViewSelector ion-select{max-width:100%;width:100%;padding-left:0;font-weight:500}.agenda .eventGadgets{margin-top:4px;margin-left:5px;text-align:right}.agenda .eventGadgets idea-user-avatar{display:block;float:left;margin:2px 1px}.agenda .eventGadgets ion-icon{padding-right:2px;opacity:.7;font-size:1.15em}@media only screen and (max-width: 575px){.agenda ion-col.titleCol{padding:0 8px 12px;text-align:center}}\n"] }]
+            args: [{ standalone: false, selector: 'idea-agenda', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"agenda\">\n  <!-- TOOLBAR -->\n  <ion-row class=\"ion-align-items-center\">\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"5\"\n      [sizeSm]=\"3\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      @if (allowedViews.length > 1) {\n        <ion-item lines=\"none\" class=\"calendarViewSelector\">\n          <ion-select\n            interface=\"popover\"\n            [value]=\"view\"\n            (ionChange)=\"$event?.detail ? setView($event.detail.value) : null\"\n          >\n            @for (view of allowedViews; track view) {\n              <ion-select-option [value]=\"view\">\n                {{ 'IDEA_AGENDA.' + view | uppercase | translate }}\n              </ion-select-option>\n            }\n          </ion-select>\n        </ion-item>\n      }\n    </ion-col>\n    <ion-col\n      class=\"ion-align-self-center ion-text-right\"\n      [size]=\"7\"\n      [sizeSm]=\"4\"\n      [pushSm]=\"5\"\n      [sizeLg]=\"2\"\n      [pushLg]=\"8\"\n    >\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarPreviousView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-back-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarToday\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"today-outline\" slot=\"icon-only\" />\n      </ion-button>\n      <ion-button\n        fill=\"clear\"\n        color=\"dark\"\n        size=\"small\"\n        mwlCalendarNextView\n        [view]=\"view\"\n        [(viewDate)]=\"viewDate\"\n        (viewDateChange)=\"viewDateChanged($event)\"\n      >\n        <ion-icon name=\"chevron-forward-outline\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-col>\n    <ion-col class=\"ion-align-self-center titleCol\" [size]=\"12\" [sizeSm]=\"5\" [pullSm]=\"7\" [sizeLg]=\"8\" [pullLg]=\"4\">\n      <h2>{{ viewDate | calendarDate: view + 'ViewTitle' : locale }}</h2>\n      @if (titleNotes) {\n        <p>{{ titleNotes }}</p>\n      }\n    </ion-col>\n  </ion-row>\n  <!-- TEMPLATES (touch only what's necessary and leave everything else as it is) -->\n  <ng-template #eventTitleTemplate let-event=\"event\" let-view=\"view\">\n    <span\n      class=\"cal-event-title\"\n      [class.noWrap]=\"event.allDay\"\n      [attr.aria-hidden]=\"{} | calendarA11y: 'hideEventTitle'\"\n    >\n      {{ event.title | calendarEventTitle: view : event }}\n      @if (event.target) {\n        <p>{{ event.target }}</p>\n      } @else {\n        @if (event.location) {\n          <p>{{ event.location }}</p>\n        }\n      }\n      @if (!event.allDay) {\n        <p>{{ getPreviewDescription(event.description) }}</p>\n      }\n    </span>\n  </ng-template>\n  <ng-template\n    #eventTemplate\n    let-weekEvent=\"weekEvent\"\n    let-tooltipPlacement=\"tooltipPlacement\"\n    let-eventClicked=\"eventClicked\"\n    let-tooltipTemplate=\"tooltipTemplate\"\n    let-tooltipAppendToBody=\"tooltipAppendToBody\"\n    let-tooltipDisabled=\"tooltipDisabled\"\n    let-tooltipDelay=\"tooltipDelay\"\n    let-column=\"column\"\n    let-daysInWeek=\"daysInWeek\"\n  >\n    <div\n      class=\"cal-event\"\n      [class.external]=\"weekEvent.event.external\"\n      [class.allDay]=\"weekEvent.event.allDay\"\n      [class.needsAction]=\"Attendance.NEEDS_ACTION === weekEvent.event.attendance\"\n      [class.declined]=\"Attendance.DECLINED === weekEvent.event.attendance\"\n      [class.tentative]=\"Attendance.TENTATIVE === weekEvent.event.attendance\"\n      [style.border-left-color]=\"weekEvent.event.color?.primary\"\n      [style.color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 80 : -40)\"\n      [style.background-color]=\"getAlternateColor(weekEvent.event.color?.primary, darkMode ? 60 : 80, 0.2)\"\n      [mwlCalendarTooltip]=\"!tooltipDisabled && !isMobile() ? getTooltipContent(weekEvent.event) : ''\"\n      [tooltipPlacement]=\"tooltipPlacement\"\n      [tooltipEvent]=\"weekEvent.tempEvent || weekEvent.event\"\n      [tooltipTemplate]=\"tooltipTemplate\"\n      [tooltipAppendToBody]=\"tooltipAppendToBody\"\n      [tooltipDelay]=\"tooltipDelay\"\n      (mwlClick)=\"eventClicked.emit({ sourceEvent: $event })\"\n      (mwlKeydownEnter)=\"eventClicked.emit({ sourceEvent: $event })\"\n      tabindex=\"0\"\n      role=\"application\"\n      [attr.aria-label]=\"\n        { event: weekEvent.tempEvent || weekEvent.event, locale: locale } | calendarA11y: 'eventDescription'\n      \"\n    >\n      <mwl-calendar-event-actions [event]=\"weekEvent.tempEvent || weekEvent.event\" />\n      &ngsp;\n      <mwl-calendar-event-title\n        [event]=\"weekEvent.tempEvent || weekEvent.event\"\n        [customTemplate]=\"eventTitleTemplate\"\n        [view]=\"daysInWeek === 1 ? 'day' : 'week'\"\n      >\n      </mwl-calendar-event-title>\n      @if (!weekEvent.event.allDay) {\n        <div class=\"eventGadgets\">\n          @for (icon of weekEvent.event.icons; track icon) {\n            <ion-icon [name]=\"icon.name\" [title]=\"icon.title\" />\n          }\n          @for (avatar of weekEvent.event.avatars; track avatar) {\n            <idea-user-avatar size=\"mini\" [src]=\"avatar.url\" [name]=\"avatar.title\" />\n          }\n        </div>\n      }\n    </div>\n  </ng-template>\n  <ng-template\n    #hourSegmentTemplate\n    let-segment=\"segment\"\n    let-locale=\"locale\"\n    let-segmentHeight=\"segmentHeight\"\n    let-isTimeLabel=\"isTimeLabel\"\n  >\n    <div\n      #segmentElement\n      class=\"cal-hour-segment\"\n      [style.height.px]=\"segmentHeight\"\n      [class.cal-hour-start]=\"segment.isStart\"\n      [class.cal-after-hour-start]=\"!segment.isStart\"\n      [ngClass]=\"segment.cssClass\"\n      (mousedown)=\"allowDragToCreate() ? startDragToCreate($event, segment.date, segmentElement) : null\"\n      (touchstart)=\"allowDragToCreate() ? startDragToCreate($event, segment.date, segmentElement) : null\"\n    >\n      @if (isTimeLabel) {\n        <div class=\"cal-time\">\n          {{ segment.date | calendarDate: 'weekViewHour' : locale }}\n        </div>\n      }\n    </div>\n  </ng-template>\n  <!-- VIEWS -->\n  <div>\n    @switch (view) {\n      @case (CalendarView.Month) {\n        <mwl-calendar-month-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [activeDayIsOpen]=\"activeDayIsOpen\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays()\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [eventTitleTemplate]=\"eventTitleTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayClicked)=\"changeDay($event.day)\"\n          (beforeViewRender)=\"beforeMonthViewRender($event)\"\n        >\n        </mwl-calendar-month-view>\n      }\n      @case (CalendarView.Week) {\n        <mwl-calendar-week-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [excludeDays]=\"excludeDays()\"\n          [weekStartsOn]=\"weekStartsOn\"\n          [dayStartHour]=\"dayStartHour()\"\n          [dayEndHour]=\"dayEndHour()\"\n          [hourSegments]=\"hourSegments()\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (dayHeaderClicked)=\"dateIsValid($event.day.date) ? selectDay.emit($event.day.date) : null\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-week-view>\n      }\n      @case (CalendarView.Day) {\n        <mwl-calendar-day-view\n          [viewDate]=\"viewDate\"\n          [events]=\"events\"\n          [refresh]=\"refresh\"\n          [locale]=\"locale\"\n          [dayStartHour]=\"dayStartHour()\"\n          [dayEndHour]=\"dayEndHour()\"\n          [hourSegments]=\"hourSegments()\"\n          [eventTemplate]=\"eventTemplate\"\n          [hourSegmentTemplate]=\"hourSegmentTemplate\"\n          (eventClicked)=\"selectEvent.emit($event.event)\"\n          (eventTimesChanged)=\"eventTimesChanged($event)\"\n          (hourSegmentClicked)=\"dateIsValid($event.date) ? selectSlot.emit($event.date) : null\"\n          (beforeViewRender)=\"beforeWeekOrDayViewRender($event)\"\n        >\n        </mwl-calendar-day-view>\n      }\n    }\n  </div>\n</div>\n", styles: [".agenda{margin-top:15px}.agenda ion-col.titleCol{padding-left:8px}.agenda ion-col.titleCol h2,.agenda ion-col.titleCol p{margin:0}.agenda ion-col.titleCol h2{font-size:1.2em}.agenda ion-col.titleCol p{font-size:.8em;font-style:italic}.agenda .calendarViewSelector{background-color:transparent;--ion-background-color: transparent;--background: transparent}.agenda .calendarViewSelector ion-select{max-width:100%;width:100%;padding-left:0;font-weight:500}.agenda .eventGadgets{margin-top:4px;margin-left:5px;text-align:right}.agenda .eventGadgets idea-user-avatar{display:block;float:left;margin:2px 1px}.agenda .eventGadgets ion-icon{padding-right:2px;opacity:.7;font-size:1.15em}@media only screen and (max-width:575px){.agenda ion-col.titleCol{padding:0 8px 12px;text-align:center}}\n"] }]
         }], propDecorators: { events: [{
                 type: Input
-            }], excludeDays: [{
-                type: Input
-            }], dayStartHour: [{
-                type: Input
-            }], dayEndHour: [{
-                type: Input
-            }], hourSegments: [{
-                type: Input
-            }], activeDayIsOpen: [{
+            }], excludeDays: [{ type: i0.Input, args: [{ isSignal: true, alias: "excludeDays", required: false }] }], dayStartHour: [{ type: i0.Input, args: [{ isSignal: true, alias: "dayStartHour", required: false }] }], dayEndHour: [{ type: i0.Input, args: [{ isSignal: true, alias: "dayEndHour", required: false }] }], hourSegments: [{ type: i0.Input, args: [{ isSignal: true, alias: "hourSegments", required: false }] }], activeDayIsOpen: [{
                 type: Input
             }], view: [{
                 type: Input
             }], allowedViews: [{
                 type: Input
-            }], onlyFuture: [{
+            }], onlyFuture: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyFuture", required: false }] }], titleNotes: [{
                 type: Input
-            }], titleNotes: [{
-                type: Input
-            }], newEventTemplate: [{
-                type: Input
-            }], allowDragToCreate: [{
-                type: Input
-            }], parentContent: [{
-                type: Input
-            }], selectEvent: [{
-                type: Output
-            }], selectDay: [{
-                type: Output
-            }], selectSlot: [{
-                type: Output
-            }], newEventByDrag: [{
-                type: Output
-            }], changeEvent: [{
-                type: Output
-            }], changeDate: [{
-                type: Output
-            }], beforeWeekOrDayViewRenderEmitter: [{
-                type: Output
-            }], beforeMonthViewRenderEmitter: [{
-                type: Output
-            }] } });
+            }], newEventTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "newEventTemplate", required: false }] }], allowDragToCreate: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowDragToCreate", required: false }] }], parentContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentContent", required: false }] }], selectEvent: [{ type: i0.Output, args: ["selectEvent"] }], selectDay: [{ type: i0.Output, args: ["selectDay"] }], selectSlot: [{ type: i0.Output, args: ["selectSlot"] }], newEventByDrag: [{ type: i0.Output, args: ["newEventByDrag"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }], changeDate: [{ type: i0.Output, args: ["changeDate"] }], beforeWeekOrDayViewRenderEmitter: [{ type: i0.Output, args: ["beforeWeekOrDayViewRenderEmitter"] }], beforeMonthViewRenderEmitter: [{ type: i0.Output, args: ["beforeMonthViewRenderEmitter"] }] } });
 /**
  * Possible attendance statuses for the event.
  */
@@ -549,10 +538,10 @@ class IDEACalendarsService {
         })
             .catch(err => done(err));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarsService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarsService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarsService, decorators: [{
             type: Injectable
         }] });
 
@@ -566,12 +555,28 @@ class IDEACalendarComponent {
         this._API = inject(IDEAAWSAPIService);
         this._translate = inject(IDEATranslationsService);
         this._calendars = inject(IDEACalendarsService);
+        this._cdr = inject(ChangeDetectorRef);
+        /**
+         * The calendar to manage.
+         */
+        this.calendar = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "calendar" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether we want to enable advanced permissions (based on the memberships) on the calendar.
+         */
+        this.advancedPermissions = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "advancedPermissions" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether the calendar color is an important detail or it shouldn't be shown.
+         */
+        this.hideColor = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "hideColor" }] : /* istanbul ignore next */ []));
         this.errors = new Set();
         this.DEFAULT_COLOR = '#555';
     }
     async ngOnInit() {
         this.membership = this._tc.get('membership');
-        this.calendarWC = new Calendar(this.calendar);
+        this.calendarWC = new Calendar(this.calendar());
         try {
             const memberships = await this._API.getResource(`teams/${this.membership.teamId}/memberships`);
             this.membershipsChecks = memberships.map(m => new Check({
@@ -579,6 +584,7 @@ class IDEACalendarComponent {
                 name: m.name,
                 checked: (this.calendarWC.usersCanManageAppointments || []).some(x => x === m.userId)
             }));
+            this._cdr.markForCheck();
         }
         catch (error) {
             this._message.error('COMMON.COULDNT_LOAD_LIST');
@@ -590,7 +596,7 @@ class IDEACalendarComponent {
     async save() {
         if (!this.calendarWC.color)
             this.calendarWC.color = this.DEFAULT_COLOR;
-        if (this.calendarWC.isShared() && this.advancedPermissions)
+        if (this.calendarWC.isShared() && this.advancedPermissions())
             this.calendarWC.usersCanManageAppointments = this.membershipsChecks
                 .filter(x => x.checked)
                 .map(x => String(x.value));
@@ -602,9 +608,9 @@ class IDEACalendarComponent {
         try {
             await this._loading.show();
             const res = await this._calendars.putCalendar(this.calendarWC);
-            this.calendar.load(res);
+            this.calendar().load(res);
             this._message.success('IDEA_AGENDA.CALENDARS.CALENDAR_SAVED');
-            this._modal.dismiss(this.calendar);
+            this._modal.dismiss(this.calendar());
         }
         catch (error) {
             this._message.error('COMMON.OPERATION_FAILED');
@@ -641,19 +647,13 @@ class IDEACalendarComponent {
     close() {
         this._modal.dismiss();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IDEACalendarComponent, isStandalone: false, selector: "idea-calendar", inputs: { calendar: "calendar", advancedPermissions: "advancedPermissions", hideColor: "hideColor" }, ngImport: i0, template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n        <ion-icon name=\"close-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n    <ion-title>{{ 'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate }}</ion-title>\n    <ion-buttons slot=\"end\">\n      <ion-button [title]=\"'COMMON.SAVE' | translate\" (click)=\"save()\">\n        <ion-icon name=\"checkmark-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  @if (calendarWC) {\n    <div class=\"maxWidthContainer\">\n      <ion-list class=\"aList\">\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('name')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.NAME' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.name\"\n          />\n        </ion-item>\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('description')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.description\"\n          />\n        </ion-item>\n        @if (!hideColor) {\n          <idea-color-picker\n            [lines]=\"'inset'\"\n            [current]=\"calendarWC.color\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.COLOR' | translate\"\n            [class.fieldHasError]=\"hasFieldAnError('color')\"\n            (select)=\"$event ? (calendarWC.color = $event) : null\"\n          />\n        }\n        @if (membershipsChecks && calendarWC.isShared() && advancedPermissions) {\n          <idea-checker\n            [data]=\"membershipsChecks\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.USERS_ALLOWED_TO_MANAGE_APPOINTMENTS' | translate\"\n            [searchPlaceholder]=\"'IDEA_AGENDA.CALENDARS.WHO_CAN_MANAGE_APPOINTMENTS' | translate\"\n            [noneText]=\"'IDEA_AGENDA.CALENDARS.NOBODY' | translate\"\n            [allText]=\"'IDEA_AGENDA.CALENDARS.EVERYONE' | translate\"\n            [allowSelectDeselectAll]=\"true\"\n            [lines]=\"'inset'\"\n          />\n        }\n      </ion-list>\n      @if (calendarWC.external?.service) {\n        <ion-list class=\"aList\">\n          <ion-list-header>\n            <ion-label>\n              <h2>{{ 'IDEA_AGENDA.CALENDARS.INFO_ON_CALENDAR' | translate }}</h2>\n            </ion-label>\n          </ion-list-header>\n          @if (calendar.userId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"person\" />\n            </ion-item>\n          }\n          @if (calendar.teamId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"people\" />\n            </ion-item>\n          }\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.LINKED_TO' | translate }}\n              {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + calendarWC.external.service | translate }}\n              <p>{{ calendarWC.external.name }} ({{ calendarWC.external.email }})</p>\n            </ion-label>\n            <ion-icon slot=\"end\" [name]=\"_calendars.getServiceIcon(calendarWC.external.service)\" />\n          </ion-item>\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.ACCESS_LEVELS.' + calendarWC.external.userAccess | translate }}\n              <p>{{ 'IDEA_AGENDA.CALENDARS.BASED_ON_EXTERNAL_SERVICE_SHARING_PERMISSION' | translate }}</p>\n            </ion-label>\n            <ion-icon slot=\"end\" name=\"shield\" />\n          </ion-item>\n        </ion-list>\n      }\n      <ion-list class=\"aList\">\n        <ion-list-header>\n          <ion-label color=\"danger\">\n            <h2>{{ 'IDEA_AGENDA.CALENDARS.DANGEROUS_ZONE' | translate }}</h2>\n          </ion-label>\n        </ion-list-header>\n        <ion-item lines=\"inset\">\n          <ion-label class=\"ion-text-wrap\">\n            {{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR' | translate }}\n            <p>{{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate }}</p>\n          </ion-label>\n          <ion-button\n            color=\"danger\"\n            [title]=\"'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate\"\n            (click)=\"delete()\"\n          >\n            {{ 'COMMON.DELETE' | translate }}\n          </ion-button>\n        </ion-item>\n      </ion-list>\n    </div>\n  }\n</ion-content>\n", styles: [".maxWidthContainer{max-width:500px;padding-top:20px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonInput, selector: "ion-input", inputs: ["autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearInputIcon", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i2.IonListHeader, selector: "ion-list-header", inputs: ["color", "lines", "mode"] }, { kind: "component", type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i2.TextValueAccessor, selector: "ion-input:not([type=number]),ion-input-otp[type=text],ion-textarea,ion-searchbar" }, { kind: "component", type: i3$1.IDEAColorPickerComponent, selector: "idea-color-picker", inputs: ["colors", "current", "label", "placeholder", "icon", "iconColor", "disabled", "obligatory", "lines", "color"], outputs: ["select", "iconSelect"] }, { kind: "component", type: i3.IDEACheckerComponent, selector: "idea-checker", inputs: ["data", "dataProvider", "label", "icon", "iconColor", "searchPlaceholder", "noPreviewText", "noElementsFoundText", "noneEqualsAll", "noneText", "allText", "previewTextKey", "lines", "color", "disabled", "tappableWhenDisabled", "obligatory", "sortData", "numMaxElementsInPreview", "showAvatars", "limitSelectionToNum", "allowSelectDeselectAll", "category1", "category2", "showCategoriesFilters"], outputs: ["change", "iconSelect"] }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: IDEACalendarComponent, isStandalone: false, selector: "idea-calendar", inputs: { calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: true, isRequired: false, transformFunction: null }, advancedPermissions: { classPropertyName: "advancedPermissions", publicName: "advancedPermissions", isSignal: true, isRequired: false, transformFunction: null }, hideColor: { classPropertyName: "hideColor", publicName: "hideColor", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n        <ion-icon name=\"close-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n    <ion-title>{{ 'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate }}</ion-title>\n    <ion-buttons slot=\"end\">\n      <ion-button [title]=\"'COMMON.SAVE' | translate\" (click)=\"save()\">\n        <ion-icon name=\"checkmark-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  @if (calendarWC) {\n    <div class=\"maxWidthContainer\">\n      <ion-list class=\"aList\">\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('name')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.NAME' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.name\"\n          />\n        </ion-item>\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('description')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.description\"\n          />\n        </ion-item>\n        @if (!hideColor()) {\n          <idea-color-picker\n            [lines]=\"'inset'\"\n            [current]=\"calendarWC.color\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.COLOR' | translate\"\n            [class.fieldHasError]=\"hasFieldAnError('color')\"\n            (select)=\"$event ? (calendarWC.color = $event) : null\"\n          />\n        }\n        @if (membershipsChecks && calendarWC.isShared() && advancedPermissions()) {\n          <idea-checker\n            [data]=\"membershipsChecks\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.USERS_ALLOWED_TO_MANAGE_APPOINTMENTS' | translate\"\n            [searchPlaceholder]=\"'IDEA_AGENDA.CALENDARS.WHO_CAN_MANAGE_APPOINTMENTS' | translate\"\n            [noneText]=\"'IDEA_AGENDA.CALENDARS.NOBODY' | translate\"\n            [allText]=\"'IDEA_AGENDA.CALENDARS.EVERYONE' | translate\"\n            [allowSelectDeselectAll]=\"true\"\n            [lines]=\"'inset'\"\n          />\n        }\n      </ion-list>\n      @if (calendarWC.external?.service) {\n        <ion-list class=\"aList\">\n          <ion-list-header>\n            <ion-label>\n              <h2>{{ 'IDEA_AGENDA.CALENDARS.INFO_ON_CALENDAR' | translate }}</h2>\n            </ion-label>\n          </ion-list-header>\n          @if (calendar().userId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"person\" />\n            </ion-item>\n          }\n          @if (calendar().teamId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"people\" />\n            </ion-item>\n          }\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.LINKED_TO' | translate }}\n              {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + calendarWC.external.service | translate }}\n              <p>{{ calendarWC.external.name }} ({{ calendarWC.external.email }})</p>\n            </ion-label>\n            <ion-icon slot=\"end\" [name]=\"_calendars.getServiceIcon(calendarWC.external.service)\" />\n          </ion-item>\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.ACCESS_LEVELS.' + calendarWC.external.userAccess | translate }}\n              <p>{{ 'IDEA_AGENDA.CALENDARS.BASED_ON_EXTERNAL_SERVICE_SHARING_PERMISSION' | translate }}</p>\n            </ion-label>\n            <ion-icon slot=\"end\" name=\"shield\" />\n          </ion-item>\n        </ion-list>\n      }\n      <ion-list class=\"aList\">\n        <ion-list-header>\n          <ion-label color=\"danger\">\n            <h2>{{ 'IDEA_AGENDA.CALENDARS.DANGEROUS_ZONE' | translate }}</h2>\n          </ion-label>\n        </ion-list-header>\n        <ion-item lines=\"inset\">\n          <ion-label class=\"ion-text-wrap\">\n            {{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR' | translate }}\n            <p>{{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate }}</p>\n          </ion-label>\n          <ion-button\n            color=\"danger\"\n            [title]=\"'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate\"\n            (click)=\"delete()\"\n          >\n            {{ 'COMMON.DELETE' | translate }}\n          </ion-button>\n        </ion-item>\n      </ion-list>\n    </div>\n  }\n</ion-content>\n", styles: [".maxWidthContainer{max-width:500px;padding-top:20px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonInput, selector: "ion-input", inputs: ["autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearInputIcon", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i2.IonListHeader, selector: "ion-list-header", inputs: ["color", "lines", "mode"] }, { kind: "component", type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i2.TextValueAccessor, selector: "ion-input:not([type=number]),ion-input-otp[type=text],ion-textarea,ion-searchbar" }, { kind: "component", type: i3$1.IDEAColorPickerComponent, selector: "idea-color-picker", inputs: ["colors", "current", "label", "placeholder", "icon", "iconColor", "disabled", "obligatory", "lines", "color"], outputs: ["select", "iconSelect"] }, { kind: "component", type: i3.IDEACheckerComponent, selector: "idea-checker", inputs: ["data", "dataProvider", "label", "icon", "iconColor", "searchPlaceholder", "noPreviewText", "noElementsFoundText", "noneEqualsAll", "noneText", "allText", "previewTextKey", "lines", "color", "disabled", "tappableWhenDisabled", "obligatory", "sortData", "numMaxElementsInPreview", "showAvatars", "limitSelectionToNum", "allowSelectDeselectAll", "category1", "category2", "showCategoriesFilters"], outputs: ["change", "iconSelect"] }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'idea-calendar', template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n        <ion-icon name=\"close-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n    <ion-title>{{ 'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate }}</ion-title>\n    <ion-buttons slot=\"end\">\n      <ion-button [title]=\"'COMMON.SAVE' | translate\" (click)=\"save()\">\n        <ion-icon name=\"checkmark-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  @if (calendarWC) {\n    <div class=\"maxWidthContainer\">\n      <ion-list class=\"aList\">\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('name')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.NAME' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.name\"\n          />\n        </ion-item>\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('description')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.description\"\n          />\n        </ion-item>\n        @if (!hideColor) {\n          <idea-color-picker\n            [lines]=\"'inset'\"\n            [current]=\"calendarWC.color\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.COLOR' | translate\"\n            [class.fieldHasError]=\"hasFieldAnError('color')\"\n            (select)=\"$event ? (calendarWC.color = $event) : null\"\n          />\n        }\n        @if (membershipsChecks && calendarWC.isShared() && advancedPermissions) {\n          <idea-checker\n            [data]=\"membershipsChecks\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.USERS_ALLOWED_TO_MANAGE_APPOINTMENTS' | translate\"\n            [searchPlaceholder]=\"'IDEA_AGENDA.CALENDARS.WHO_CAN_MANAGE_APPOINTMENTS' | translate\"\n            [noneText]=\"'IDEA_AGENDA.CALENDARS.NOBODY' | translate\"\n            [allText]=\"'IDEA_AGENDA.CALENDARS.EVERYONE' | translate\"\n            [allowSelectDeselectAll]=\"true\"\n            [lines]=\"'inset'\"\n          />\n        }\n      </ion-list>\n      @if (calendarWC.external?.service) {\n        <ion-list class=\"aList\">\n          <ion-list-header>\n            <ion-label>\n              <h2>{{ 'IDEA_AGENDA.CALENDARS.INFO_ON_CALENDAR' | translate }}</h2>\n            </ion-label>\n          </ion-list-header>\n          @if (calendar.userId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"person\" />\n            </ion-item>\n          }\n          @if (calendar.teamId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"people\" />\n            </ion-item>\n          }\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.LINKED_TO' | translate }}\n              {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + calendarWC.external.service | translate }}\n              <p>{{ calendarWC.external.name }} ({{ calendarWC.external.email }})</p>\n            </ion-label>\n            <ion-icon slot=\"end\" [name]=\"_calendars.getServiceIcon(calendarWC.external.service)\" />\n          </ion-item>\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.ACCESS_LEVELS.' + calendarWC.external.userAccess | translate }}\n              <p>{{ 'IDEA_AGENDA.CALENDARS.BASED_ON_EXTERNAL_SERVICE_SHARING_PERMISSION' | translate }}</p>\n            </ion-label>\n            <ion-icon slot=\"end\" name=\"shield\" />\n          </ion-item>\n        </ion-list>\n      }\n      <ion-list class=\"aList\">\n        <ion-list-header>\n          <ion-label color=\"danger\">\n            <h2>{{ 'IDEA_AGENDA.CALENDARS.DANGEROUS_ZONE' | translate }}</h2>\n          </ion-label>\n        </ion-list-header>\n        <ion-item lines=\"inset\">\n          <ion-label class=\"ion-text-wrap\">\n            {{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR' | translate }}\n            <p>{{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate }}</p>\n          </ion-label>\n          <ion-button\n            color=\"danger\"\n            [title]=\"'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate\"\n            (click)=\"delete()\"\n          >\n            {{ 'COMMON.DELETE' | translate }}\n          </ion-button>\n        </ion-item>\n      </ion-list>\n    </div>\n  }\n</ion-content>\n", styles: [".maxWidthContainer{max-width:500px;padding-top:20px}\n"] }]
-        }], propDecorators: { calendar: [{
-                type: Input
-            }], advancedPermissions: [{
-                type: Input
-            }], hideColor: [{
-                type: Input
-            }] } });
+            args: [{ standalone: false, selector: 'idea-calendar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n        <ion-icon name=\"close-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n    <ion-title>{{ 'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate }}</ion-title>\n    <ion-buttons slot=\"end\">\n      <ion-button [title]=\"'COMMON.SAVE' | translate\" (click)=\"save()\">\n        <ion-icon name=\"checkmark-circle\" slot=\"icon-only\" />\n      </ion-button>\n    </ion-buttons>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  @if (calendarWC) {\n    <div class=\"maxWidthContainer\">\n      <ion-list class=\"aList\">\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('name')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.NAME' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.NAME_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.name\"\n          />\n        </ion-item>\n        <ion-item\n          lines=\"inset\"\n          [class.fieldHasError]=\"hasFieldAnError('description')\"\n          [title]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n        >\n          <ion-input\n            labelPlacement=\"stacked\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION' | translate\"\n            [placeholder]=\"'IDEA_AGENDA.CALENDARS.DESCRIPTION_HINT' | translate\"\n            [(ngModel)]=\"calendarWC.description\"\n          />\n        </ion-item>\n        @if (!hideColor()) {\n          <idea-color-picker\n            [lines]=\"'inset'\"\n            [current]=\"calendarWC.color\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.COLOR' | translate\"\n            [class.fieldHasError]=\"hasFieldAnError('color')\"\n            (select)=\"$event ? (calendarWC.color = $event) : null\"\n          />\n        }\n        @if (membershipsChecks && calendarWC.isShared() && advancedPermissions()) {\n          <idea-checker\n            [data]=\"membershipsChecks\"\n            [label]=\"'IDEA_AGENDA.CALENDARS.USERS_ALLOWED_TO_MANAGE_APPOINTMENTS' | translate\"\n            [searchPlaceholder]=\"'IDEA_AGENDA.CALENDARS.WHO_CAN_MANAGE_APPOINTMENTS' | translate\"\n            [noneText]=\"'IDEA_AGENDA.CALENDARS.NOBODY' | translate\"\n            [allText]=\"'IDEA_AGENDA.CALENDARS.EVERYONE' | translate\"\n            [allowSelectDeselectAll]=\"true\"\n            [lines]=\"'inset'\"\n          />\n        }\n      </ion-list>\n      @if (calendarWC.external?.service) {\n        <ion-list class=\"aList\">\n          <ion-list-header>\n            <ion-label>\n              <h2>{{ 'IDEA_AGENDA.CALENDARS.INFO_ON_CALENDAR' | translate }}</h2>\n            </ion-label>\n          </ion-list-header>\n          @if (calendar().userId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.PRIVATE_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"person\" />\n            </ion-item>\n          }\n          @if (calendar().teamId) {\n            <ion-item lines=\"inset\">\n              <ion-label>\n                {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}\n                <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n              </ion-label>\n              <ion-icon slot=\"end\" name=\"people\" />\n            </ion-item>\n          }\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.LINKED_TO' | translate }}\n              {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + calendarWC.external.service | translate }}\n              <p>{{ calendarWC.external.name }} ({{ calendarWC.external.email }})</p>\n            </ion-label>\n            <ion-icon slot=\"end\" [name]=\"_calendars.getServiceIcon(calendarWC.external.service)\" />\n          </ion-item>\n          <ion-item lines=\"inset\">\n            <ion-label>\n              {{ 'IDEA_AGENDA.CALENDARS.ACCESS_LEVELS.' + calendarWC.external.userAccess | translate }}\n              <p>{{ 'IDEA_AGENDA.CALENDARS.BASED_ON_EXTERNAL_SERVICE_SHARING_PERMISSION' | translate }}</p>\n            </ion-label>\n            <ion-icon slot=\"end\" name=\"shield\" />\n          </ion-item>\n        </ion-list>\n      }\n      <ion-list class=\"aList\">\n        <ion-list-header>\n          <ion-label color=\"danger\">\n            <h2>{{ 'IDEA_AGENDA.CALENDARS.DANGEROUS_ZONE' | translate }}</h2>\n          </ion-label>\n        </ion-list-header>\n        <ion-item lines=\"inset\">\n          <ion-label class=\"ion-text-wrap\">\n            {{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR' | translate }}\n            <p>{{ 'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate }}</p>\n          </ion-label>\n          <ion-button\n            color=\"danger\"\n            [title]=\"'IDEA_AGENDA.CALENDARS.DELETE_CALENDAR_HINT' | translate\"\n            (click)=\"delete()\"\n          >\n            {{ 'COMMON.DELETE' | translate }}\n          </ion-button>\n        </ion-item>\n      </ion-list>\n    </div>\n  }\n</ion-content>\n", styles: [".maxWidthContainer{max-width:500px;padding-top:20px}\n"] }]
+        }], propDecorators: { calendar: [{ type: i0.Input, args: [{ isSignal: true, alias: "calendar", required: false }] }], advancedPermissions: [{ type: i0.Input, args: [{ isSignal: true, alias: "advancedPermissions", required: false }] }], hideColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideColor", required: false }] }] } });
 
 class IDEACalendarItemComponent {
     constructor() {
@@ -663,20 +663,40 @@ class IDEACalendarItemComponent {
         this._loading = inject(IDEALoadingService);
         this._translate = inject(IDEATranslationsService);
         this._calendars = inject(IDEACalendarsService);
+        /**
+         * Whether the component is disabled.
+         */
+        this.disabled = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "disabled" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether we want to enable advanced permissions (based on the memberships) on the calendar.
+         */
+        this.advancedPermissions = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "advancedPermissions" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether the calendar color is an important detail or it shouldn't be shown.
+         */
+        this.hideColor = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "hideColor" }] : /* istanbul ignore next */ []));
+        /**
+         * The URL to be used on the redirect calls.
+         */
+        this.baseURL = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "baseURL" }] : /* istanbul ignore next */ []));
         /**
          * Report to parent components a change.
          */
-        this.somethingChanged = new EventEmitter();
+        this.somethingChanged = output();
     }
     async manageCalendar() {
-        if (this.disabled)
+        if (this.disabled())
             return;
         const modal = await this._modal.create({
             component: IDEACalendarComponent,
             componentProps: {
                 calendar: this.calendar,
-                advancedPermissions: this.advancedPermissions,
-                hideColor: this.hideColor
+                advancedPermissions: this.advancedPermissions(),
+                hideColor: this.hideColor()
             }
         });
         modal.onDidDismiss().then(res => {
@@ -687,12 +707,12 @@ class IDEACalendarItemComponent {
                 this.calendar = null;
             else
                 this.calendar.load(cal);
-            this.somethingChanged.emit();
+            this.somethingChanged.emit(this.calendar);
         });
         modal.present();
     }
     async linkExtCalendarOrDelete() {
-        if (this.disabled)
+        if (this.disabled())
             return;
         try {
             const cal = await this._calendars.chooseAndSetExternalCalendar(this.calendar);
@@ -710,7 +730,7 @@ class IDEACalendarItemComponent {
             }
             finally {
                 this._loading.hide();
-                this.somethingChanged.emit();
+                this.somethingChanged.emit(this.calendar);
             }
         }
         catch (error) {
@@ -719,7 +739,7 @@ class IDEACalendarItemComponent {
                     await this._loading.show();
                     await this._calendars.deleteCalendar(this.calendar);
                     this._message.success('COMMON.OPERATION_COMPLETED');
-                    this.somethingChanged.emit();
+                    this.somethingChanged.emit(this.calendar);
                 }
                 catch (error) {
                     this._message.error('COMMON.OPERATION_FAILED');
@@ -730,7 +750,7 @@ class IDEACalendarItemComponent {
             };
             const doLink = async () => {
                 try {
-                    await this._calendars.linkExtService(this.calendar, this.baseURL);
+                    await this._calendars.linkExtService(this.calendar, this.baseURL());
                     this.linkExtCalendarOrDelete();
                 }
                 catch (error) {
@@ -747,25 +767,15 @@ class IDEACalendarItemComponent {
             alert.present();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IDEACalendarItemComponent, isStandalone: false, selector: "idea-calendar-item", inputs: { calendar: "calendar", disabled: "disabled", advancedPermissions: "advancedPermissions", hideColor: "hideColor", baseURL: "baseURL" }, outputs: { somethingChanged: "somethingChanged" }, ngImport: i0, template: "@if (calendar) {\n  <ion-item\n    class=\"calendarItem\"\n    [button]=\"!disabled\"\n    [title]=\"'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate\"\n    (click)=\"calendar.external && !calendar.external.calendarId ? linkExtCalendarOrDelete() : manageCalendar()\"\n  >\n    @if (!hideColor) {\n      <ion-avatar slot=\"start\" class=\"colorCircle\" [style.background-color]=\"calendar.color\" />\n    }\n    <ion-label>\n      {{ calendar.name }}\n      <p>\n        @if (calendar.external && !calendar.external.calendarId) {\n          <ion-text color=\"danger\">\n            {{ 'IDEA_AGENDA.CALENDARS.TAP_TO_CONFIGURE' | translate }}\n          </ion-text>\n        }\n        {{ calendar.description }}\n      </p>\n    </ion-label>\n    @if (calendar.external && !calendar.external.calendarId) {\n      <ion-icon\n        slot=\"end\"\n        color=\"danger\"\n        name=\"flash-off\"\n        [title]=\"'IDEA_AGENDA.CALENDARS.CALENDAR_NOT_YET_LINKED_HINT' | translate\"\n      />\n    }\n    @if (calendar.external?.service) {\n      <ion-icon\n        slot=\"end\"\n        [name]=\"_calendars.getServiceIcon(calendar.external.service)\"\n        [title]=\"\n          ('IDEA_AGENDA.CALENDARS.LINKED_TO' | translate) +\n          ' ' +\n          ('IDEA_AGENDA.CALENDARS.SERVICES.' + calendar.external.service | translate)\n        \"\n      />\n    }\n  </ion-item>\n}\n", styles: [".calendarItem ion-avatar.colorCircle{width:20px;height:20px;background-color:#555}\n"], dependencies: [{ kind: "component", type: i2.IonAvatar, selector: "ion-avatar" }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: IDEACalendarItemComponent, isStandalone: false, selector: "idea-calendar-item", inputs: { calendar: { classPropertyName: "calendar", publicName: "calendar", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, advancedPermissions: { classPropertyName: "advancedPermissions", publicName: "advancedPermissions", isSignal: true, isRequired: false, transformFunction: null }, hideColor: { classPropertyName: "hideColor", publicName: "hideColor", isSignal: true, isRequired: false, transformFunction: null }, baseURL: { classPropertyName: "baseURL", publicName: "baseURL", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { somethingChanged: "somethingChanged" }, ngImport: i0, template: "@if (calendar) {\n  <ion-item\n    class=\"calendarItem\"\n    [button]=\"!disabled()\"\n    [title]=\"'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate\"\n    (click)=\"calendar.external && !calendar.external.calendarId ? linkExtCalendarOrDelete() : manageCalendar()\"\n  >\n    @if (!hideColor()) {\n      <ion-avatar slot=\"start\" class=\"colorCircle\" [style.background-color]=\"calendar.color\" />\n    }\n    <ion-label>\n      {{ calendar.name }}\n      <p>\n        @if (calendar.external && !calendar.external.calendarId) {\n          <ion-text color=\"danger\">\n            {{ 'IDEA_AGENDA.CALENDARS.TAP_TO_CONFIGURE' | translate }}\n          </ion-text>\n        }\n        {{ calendar.description }}\n      </p>\n    </ion-label>\n    @if (calendar.external && !calendar.external.calendarId) {\n      <ion-icon\n        slot=\"end\"\n        color=\"danger\"\n        name=\"flash-off\"\n        [title]=\"'IDEA_AGENDA.CALENDARS.CALENDAR_NOT_YET_LINKED_HINT' | translate\"\n      />\n    }\n    @if (calendar.external?.service) {\n      <ion-icon\n        slot=\"end\"\n        [name]=\"_calendars.getServiceIcon(calendar.external.service)\"\n        [title]=\"\n          ('IDEA_AGENDA.CALENDARS.LINKED_TO' | translate) +\n          ' ' +\n          ('IDEA_AGENDA.CALENDARS.SERVICES.' + calendar.external.service | translate)\n        \"\n      />\n    }\n  </ion-item>\n}\n", styles: [".calendarItem ion-avatar.colorCircle{width:20px;height:20px;background-color:#555}\n"], dependencies: [{ kind: "component", type: i2.IonAvatar, selector: "ion-avatar" }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarItemComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'idea-calendar-item', template: "@if (calendar) {\n  <ion-item\n    class=\"calendarItem\"\n    [button]=\"!disabled\"\n    [title]=\"'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate\"\n    (click)=\"calendar.external && !calendar.external.calendarId ? linkExtCalendarOrDelete() : manageCalendar()\"\n  >\n    @if (!hideColor) {\n      <ion-avatar slot=\"start\" class=\"colorCircle\" [style.background-color]=\"calendar.color\" />\n    }\n    <ion-label>\n      {{ calendar.name }}\n      <p>\n        @if (calendar.external && !calendar.external.calendarId) {\n          <ion-text color=\"danger\">\n            {{ 'IDEA_AGENDA.CALENDARS.TAP_TO_CONFIGURE' | translate }}\n          </ion-text>\n        }\n        {{ calendar.description }}\n      </p>\n    </ion-label>\n    @if (calendar.external && !calendar.external.calendarId) {\n      <ion-icon\n        slot=\"end\"\n        color=\"danger\"\n        name=\"flash-off\"\n        [title]=\"'IDEA_AGENDA.CALENDARS.CALENDAR_NOT_YET_LINKED_HINT' | translate\"\n      />\n    }\n    @if (calendar.external?.service) {\n      <ion-icon\n        slot=\"end\"\n        [name]=\"_calendars.getServiceIcon(calendar.external.service)\"\n        [title]=\"\n          ('IDEA_AGENDA.CALENDARS.LINKED_TO' | translate) +\n          ' ' +\n          ('IDEA_AGENDA.CALENDARS.SERVICES.' + calendar.external.service | translate)\n        \"\n      />\n    }\n  </ion-item>\n}\n", styles: [".calendarItem ion-avatar.colorCircle{width:20px;height:20px;background-color:#555}\n"] }]
+            args: [{ standalone: false, selector: 'idea-calendar-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (calendar) {\n  <ion-item\n    class=\"calendarItem\"\n    [button]=\"!disabled()\"\n    [title]=\"'IDEA_AGENDA.CALENDARS.EDIT_CALENDAR' | translate\"\n    (click)=\"calendar.external && !calendar.external.calendarId ? linkExtCalendarOrDelete() : manageCalendar()\"\n  >\n    @if (!hideColor()) {\n      <ion-avatar slot=\"start\" class=\"colorCircle\" [style.background-color]=\"calendar.color\" />\n    }\n    <ion-label>\n      {{ calendar.name }}\n      <p>\n        @if (calendar.external && !calendar.external.calendarId) {\n          <ion-text color=\"danger\">\n            {{ 'IDEA_AGENDA.CALENDARS.TAP_TO_CONFIGURE' | translate }}\n          </ion-text>\n        }\n        {{ calendar.description }}\n      </p>\n    </ion-label>\n    @if (calendar.external && !calendar.external.calendarId) {\n      <ion-icon\n        slot=\"end\"\n        color=\"danger\"\n        name=\"flash-off\"\n        [title]=\"'IDEA_AGENDA.CALENDARS.CALENDAR_NOT_YET_LINKED_HINT' | translate\"\n      />\n    }\n    @if (calendar.external?.service) {\n      <ion-icon\n        slot=\"end\"\n        [name]=\"_calendars.getServiceIcon(calendar.external.service)\"\n        [title]=\"\n          ('IDEA_AGENDA.CALENDARS.LINKED_TO' | translate) +\n          ' ' +\n          ('IDEA_AGENDA.CALENDARS.SERVICES.' + calendar.external.service | translate)\n        \"\n      />\n    }\n  </ion-item>\n}\n", styles: [".calendarItem ion-avatar.colorCircle{width:20px;height:20px;background-color:#555}\n"] }]
         }], propDecorators: { calendar: [{
                 type: Input
-            }], disabled: [{
-                type: Input
-            }], advancedPermissions: [{
-                type: Input
-            }], hideColor: [{
-                type: Input
-            }], baseURL: [{
-                type: Input
-            }], somethingChanged: [{
-                type: Output
-            }] } });
+            }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], advancedPermissions: [{ type: i0.Input, args: [{ isSignal: true, alias: "advancedPermissions", required: false }] }], hideColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideColor", required: false }] }], baseURL: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseURL", required: false }] }], somethingChanged: [{ type: i0.Output, args: ["somethingChanged"] }] } });
 
 class IDEACalendarCreationComponent {
     constructor() {
@@ -775,6 +785,21 @@ class IDEACalendarCreationComponent {
         this._translate = inject(IDEATranslationsService);
         this._tc = inject(IDEATinCanService);
         this._calendars = inject(IDEACalendarsService);
+        /**
+         * Whether we want to allow the creation of only a particular type of calendar, based on the scope.
+         */
+        this.fixScope = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "fixScope" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether we want to allow the creation of local calendars.
+         */
+        this.onlyExternalCalendars = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "onlyExternalCalendars" }] : /* istanbul ignore next */ []));
+        /**
+         * The URL to be used on the redirect calls.
+         */
+        this.baseURL = input(/* @ts-ignore */
+        ...(ngDevMode ? [undefined, { debugName: "baseURL" }] : /* istanbul ignore next */ []));
         this.DEFAULT_COLOR = '#555';
         this.SOURCES = Object.keys(ExternalCalendarSources);
     }
@@ -782,9 +807,10 @@ class IDEACalendarCreationComponent {
         this.calendar = new Calendar();
         this.team = this._tc.get('team');
         this.membership = this._tc.get('membership');
-        if (this.fixScope === CalendarScopes.SHARED)
+        const fixScope = this.fixScope();
+        if (fixScope === CalendarScopes.SHARED)
             this.calendar.teamId = this.team.teamId;
-        if (this.fixScope === CalendarScopes.PRIVATE)
+        if (fixScope === CalendarScopes.PRIVATE)
             this.calendar.userId = this.membership.userId;
     }
     resetScope() {
@@ -792,7 +818,7 @@ class IDEACalendarCreationComponent {
             this.calendar.teamId = this.calendar.userId = null;
     }
     canChangeScope() {
-        return !this.fixScope && this.scopeIsSet();
+        return !this.fixScope() && this.scopeIsSet();
     }
     scopeIsSet() {
         return Boolean(this.calendar.userId) || Boolean(this.calendar.teamId);
@@ -800,7 +826,7 @@ class IDEACalendarCreationComponent {
     async saveNewCalendar(service) {
         if (!this.scopeIsSet())
             return;
-        if (!service && this.onlyExternalCalendars)
+        if (!service && this.onlyExternalCalendars())
             return;
         if (service) {
             this.calendar.external = new ExternalCalendarInfo({ service });
@@ -823,7 +849,7 @@ class IDEACalendarCreationComponent {
             }
             try {
                 await this._loading.hide();
-                await this._calendars.linkExtService(this.calendar, this.baseURL);
+                await this._calendars.linkExtService(this.calendar, this.baseURL());
                 const res = await this._calendars.chooseAndSetExternalCalendar(this.calendar);
                 if (!res) {
                     await this._modal.dismiss(this.calendar);
@@ -857,19 +883,13 @@ class IDEACalendarCreationComponent {
     close() {
         this._modal.dismiss();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarCreationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: IDEACalendarCreationComponent, isStandalone: false, selector: "idea-calendar-creation", inputs: { fixScope: "fixScope", onlyExternalCalendars: "onlyExternalCalendars", baseURL: "baseURL" }, ngImport: i0, template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      @if (!canChangeScope()) {\n        <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n          <ion-icon name=\"close\" slot=\"icon-only\" />\n        </ion-button>\n      }\n      @if (canChangeScope()) {\n        <ion-button (click)=\"resetScope()\">\n          <ion-icon name=\"arrow-back\" slot=\"icon-only\" />\n        </ion-button>\n      }\n    </ion-buttons>\n    <ion-title>\n      @if (!scopeIsSet()) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.ADD_A_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.userId) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.teamId) {\n        <span>\n          {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate: { team: team.name } }}\n        </span>\n      }\n    </ion-title>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  <!-- 1st STEP -->\n  @if (!scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.CREATE_PRIVATE_OR_TEAM' | translate }}</h1>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.userId = membership.userId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"person\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.teamId = membership.teamId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"people\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  }\n  <!-- 2nd STEP -->\n  @if (scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK' | translate }}</h1>\n          <p>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK_HINT' | translate }}</p>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        @if (!onlyExternalCalendars) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar()\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon name=\"remove\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK' | translate }}</h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n        @for (s of SOURCES; track s) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar(s)\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon [name]=\"_calendars.getServiceIcon(s)\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>\n                  {{ 'IDEA_AGENDA.CALENDARS.LINK_TO' | translate }}\n                  {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + s | translate }}\n                </h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.LINK_TO_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n      </ion-row>\n    </ion-grid>\n  }\n</ion-content>\n", styles: ["ion-content{--background: var(--ion-color-white-shade)}.choiceGrid ion-row ion-col>h1{margin:10px 0 0;font-size:1.1em}.choiceGrid ion-row ion-col>p{margin-top:0;margin-bottom:0;font-size:.9em}.choiceGrid ion-row:first-child ion-col{padding-bottom:25px}.choiceGrid ion-card{--ion-item-background: var(--ion-color-white);--color: var(--ion-color-dark-tint);height:240px;margin:0 auto;text-align:center}.choiceGrid ion-card ion-card-header{padding-bottom:10px}.choiceGrid ion-card ion-card-header ion-card-title{font-size:2.5em}.choiceGrid ion-card ion-card-content h1{font-size:1.4em;height:60px}.choiceGrid ion-card.step2{height:135px}.choiceGrid ion-card.step2 ion-card-header{padding-top:10px;padding-bottom:0}.choiceGrid ion-card.step2 ion-card-content h1{height:auto}\n"], dependencies: [{ kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i2.IonCardHeader, selector: "ion-card-header", inputs: ["color", "mode", "translucent"] }, { kind: "component", type: i2.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { kind: "component", type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonRow, selector: "ion-row" }, { kind: "component", type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarCreationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: IDEACalendarCreationComponent, isStandalone: false, selector: "idea-calendar-creation", inputs: { fixScope: { classPropertyName: "fixScope", publicName: "fixScope", isSignal: true, isRequired: false, transformFunction: null }, onlyExternalCalendars: { classPropertyName: "onlyExternalCalendars", publicName: "onlyExternalCalendars", isSignal: true, isRequired: false, transformFunction: null }, baseURL: { classPropertyName: "baseURL", publicName: "baseURL", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      @if (!canChangeScope()) {\n        <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n          <ion-icon name=\"close\" slot=\"icon-only\" />\n        </ion-button>\n      }\n      @if (canChangeScope()) {\n        <ion-button (click)=\"resetScope()\">\n          <ion-icon name=\"arrow-back\" slot=\"icon-only\" />\n        </ion-button>\n      }\n    </ion-buttons>\n    <ion-title>\n      @if (!scopeIsSet()) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.ADD_A_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.userId) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.teamId) {\n        <span>\n          {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate: { team: team.name } }}\n        </span>\n      }\n    </ion-title>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  <!-- 1st STEP -->\n  @if (!scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.CREATE_PRIVATE_OR_TEAM' | translate }}</h1>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.userId = membership.userId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"person\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.teamId = membership.teamId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"people\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  }\n  <!-- 2nd STEP -->\n  @if (scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK' | translate }}</h1>\n          <p>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK_HINT' | translate }}</p>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        @if (!onlyExternalCalendars()) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar()\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon name=\"remove\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK' | translate }}</h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n        @for (s of SOURCES; track s) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar(s)\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon [name]=\"_calendars.getServiceIcon(s)\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>\n                  {{ 'IDEA_AGENDA.CALENDARS.LINK_TO' | translate }}\n                  {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + s | translate }}\n                </h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.LINK_TO_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n      </ion-row>\n    </ion-grid>\n  }\n</ion-content>\n", styles: ["ion-content{--background: var(--ion-color-white-shade)}.choiceGrid ion-row ion-col>h1{margin:10px 0 0;font-size:1.1em}.choiceGrid ion-row ion-col>p{margin-top:0;margin-bottom:0;font-size:.9em}.choiceGrid ion-row:first-child ion-col{padding-bottom:25px}.choiceGrid ion-card{--ion-item-background: var(--ion-color-white);--color: var(--ion-color-dark-tint);height:240px;margin:0 auto;text-align:center}.choiceGrid ion-card ion-card-header{padding-bottom:10px}.choiceGrid ion-card ion-card-header ion-card-title{font-size:2.5em}.choiceGrid ion-card ion-card-content h1{font-size:1.4em;height:60px}.choiceGrid ion-card.step2{height:135px}.choiceGrid ion-card.step2 ion-card-header{padding-top:10px;padding-bottom:0}.choiceGrid ion-card.step2 ion-card-content h1{height:auto}\n"], dependencies: [{ kind: "component", type: i2.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i2.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i2.IonCardHeader, selector: "ion-card-header", inputs: ["color", "mode", "translucent"] }, { kind: "component", type: i2.IonCardTitle, selector: "ion-card-title", inputs: ["color", "mode"] }, { kind: "component", type: i2.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonRow, selector: "ion-row" }, { kind: "component", type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "pipe", type: i3.IDEATranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEACalendarCreationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEACalendarCreationComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'idea-calendar-creation', template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      @if (!canChangeScope()) {\n        <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n          <ion-icon name=\"close\" slot=\"icon-only\" />\n        </ion-button>\n      }\n      @if (canChangeScope()) {\n        <ion-button (click)=\"resetScope()\">\n          <ion-icon name=\"arrow-back\" slot=\"icon-only\" />\n        </ion-button>\n      }\n    </ion-buttons>\n    <ion-title>\n      @if (!scopeIsSet()) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.ADD_A_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.userId) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.teamId) {\n        <span>\n          {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate: { team: team.name } }}\n        </span>\n      }\n    </ion-title>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  <!-- 1st STEP -->\n  @if (!scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.CREATE_PRIVATE_OR_TEAM' | translate }}</h1>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.userId = membership.userId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"person\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.teamId = membership.teamId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"people\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  }\n  <!-- 2nd STEP -->\n  @if (scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK' | translate }}</h1>\n          <p>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK_HINT' | translate }}</p>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        @if (!onlyExternalCalendars) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar()\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon name=\"remove\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK' | translate }}</h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n        @for (s of SOURCES; track s) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar(s)\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon [name]=\"_calendars.getServiceIcon(s)\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>\n                  {{ 'IDEA_AGENDA.CALENDARS.LINK_TO' | translate }}\n                  {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + s | translate }}\n                </h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.LINK_TO_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n      </ion-row>\n    </ion-grid>\n  }\n</ion-content>\n", styles: ["ion-content{--background: var(--ion-color-white-shade)}.choiceGrid ion-row ion-col>h1{margin:10px 0 0;font-size:1.1em}.choiceGrid ion-row ion-col>p{margin-top:0;margin-bottom:0;font-size:.9em}.choiceGrid ion-row:first-child ion-col{padding-bottom:25px}.choiceGrid ion-card{--ion-item-background: var(--ion-color-white);--color: var(--ion-color-dark-tint);height:240px;margin:0 auto;text-align:center}.choiceGrid ion-card ion-card-header{padding-bottom:10px}.choiceGrid ion-card ion-card-header ion-card-title{font-size:2.5em}.choiceGrid ion-card ion-card-content h1{font-size:1.4em;height:60px}.choiceGrid ion-card.step2{height:135px}.choiceGrid ion-card.step2 ion-card-header{padding-top:10px;padding-bottom:0}.choiceGrid ion-card.step2 ion-card-content h1{height:auto}\n"] }]
-        }], propDecorators: { fixScope: [{
-                type: Input
-            }], onlyExternalCalendars: [{
-                type: Input
-            }], baseURL: [{
-                type: Input
-            }] } });
+            args: [{ standalone: false, selector: 'idea-calendar-creation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-header>\n  <ion-toolbar color=\"ideaToolbar\">\n    <ion-buttons slot=\"start\">\n      @if (!canChangeScope()) {\n        <ion-button [title]=\"'COMMON.CLOSE' | translate\" (click)=\"close()\">\n          <ion-icon name=\"close\" slot=\"icon-only\" />\n        </ion-button>\n      }\n      @if (canChangeScope()) {\n        <ion-button (click)=\"resetScope()\">\n          <ion-icon name=\"arrow-back\" slot=\"icon-only\" />\n        </ion-button>\n      }\n    </ion-buttons>\n    <ion-title>\n      @if (!scopeIsSet()) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.ADD_A_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.userId) {\n        <span>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</span>\n      }\n      @if (calendar.teamId) {\n        <span>\n          {{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate: { team: team.name } }}\n        </span>\n      }\n    </ion-title>\n  </ion-toolbar>\n</ion-header>\n<ion-content>\n  <!-- 1st STEP -->\n  @if (!scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.CREATE_PRIVATE_OR_TEAM' | translate }}</h1>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.userId = membership.userId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"person\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.PERSONAL_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n        <ion-col class=\"ion-text-center\" [size]=\"12\" [sizeSm]=\"6\">\n          <ion-card [button]=\"true\" (click)=\"calendar.teamId = membership.teamId\">\n            <ion-card-header>\n              <ion-card-title>\n                <ion-icon name=\"people\" />\n              </ion-card-title>\n            </ion-card-header>\n            <ion-card-content>\n              <h1>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR' | translate }}</h1>\n              <p>{{ 'IDEA_AGENDA.CALENDARS.TEAM_CALENDAR_HINT' | translate }}</p>\n            </ion-card-content>\n          </ion-card>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  }\n  <!-- 2nd STEP -->\n  @if (scopeIsSet()) {\n    <ion-grid class=\"ion-padding choiceGrid\">\n      <ion-row>\n        <ion-col class=\"ion-text-center\">\n          <h1>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK' | translate }}</h1>\n          <p>{{ 'IDEA_AGENDA.CALENDARS.WHICH_EXTERNAL_SERVICE_TO_LINK_HINT' | translate }}</p>\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"ion-align-items-center\">\n        @if (!onlyExternalCalendars()) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar()\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon name=\"remove\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK' | translate }}</h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.DONT_LINK_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n        @for (s of SOURCES; track s) {\n          <ion-col class=\"ion-text-center\" [size]=\"12\">\n            <ion-card class=\"step2\" [button]=\"true\" (click)=\"saveNewCalendar(s)\">\n              <ion-card-header>\n                <ion-card-title>\n                  <ion-icon [name]=\"_calendars.getServiceIcon(s)\" />\n                </ion-card-title>\n              </ion-card-header>\n              <ion-card-content>\n                <h1>\n                  {{ 'IDEA_AGENDA.CALENDARS.LINK_TO' | translate }}\n                  {{ 'IDEA_AGENDA.CALENDARS.SERVICES.' + s | translate }}\n                </h1>\n                <p>{{ 'IDEA_AGENDA.CALENDARS.LINK_TO_HINT' | translate }}</p>\n              </ion-card-content>\n            </ion-card>\n          </ion-col>\n        }\n      </ion-row>\n    </ion-grid>\n  }\n</ion-content>\n", styles: ["ion-content{--background: var(--ion-color-white-shade)}.choiceGrid ion-row ion-col>h1{margin:10px 0 0;font-size:1.1em}.choiceGrid ion-row ion-col>p{margin-top:0;margin-bottom:0;font-size:.9em}.choiceGrid ion-row:first-child ion-col{padding-bottom:25px}.choiceGrid ion-card{--ion-item-background: var(--ion-color-white);--color: var(--ion-color-dark-tint);height:240px;margin:0 auto;text-align:center}.choiceGrid ion-card ion-card-header{padding-bottom:10px}.choiceGrid ion-card ion-card-header ion-card-title{font-size:2.5em}.choiceGrid ion-card ion-card-content h1{font-size:1.4em;height:60px}.choiceGrid ion-card.step2{height:135px}.choiceGrid ion-card.step2 ion-card-header{padding-top:10px;padding-bottom:0}.choiceGrid ion-card.step2 ion-card-content h1{height:auto}\n"] }]
+        }], propDecorators: { fixScope: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixScope", required: false }] }], onlyExternalCalendars: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyExternalCalendars", required: false }] }], baseURL: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseURL", required: false }] }] } });
 /**
  * The possible scopes of the calendar.
  */
@@ -880,15 +900,15 @@ var CalendarScopes;
 })(CalendarScopes || (CalendarScopes = {}));
 
 class IDEAAgendaModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEAAgendaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: IDEAAgendaModule, declarations: [IDEAAgendaComponent, IDEACalendarComponent, IDEACalendarItemComponent, IDEACalendarCreationComponent], imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEAAgendaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.2", ngImport: i0, type: IDEAAgendaModule, declarations: [IDEAAgendaComponent, IDEACalendarComponent, IDEACalendarItemComponent, IDEACalendarCreationComponent], imports: [CommonModule,
             FormsModule,
             IonicModule,
             IDEATranslationsModule,
             IDEAColorPickerComponent,
             IDEACheckerComponent,
             IDEAUserAvatarComponent, i4.CalendarModule], exports: [IDEAAgendaComponent, IDEACalendarComponent, IDEACalendarItemComponent, IDEACalendarCreationComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEAAgendaModule, providers: [{ provide: CalendarDateFormatter, useClass: CustomDateFormatter }, IDEACalendarsService], imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEAAgendaModule, providers: [{ provide: CalendarDateFormatter, useClass: CustomDateFormatter }, IDEACalendarsService], imports: [CommonModule,
             FormsModule,
             IonicModule,
             IDEATranslationsModule,
@@ -897,7 +917,7 @@ class IDEAAgendaModule {
             IDEAUserAvatarComponent,
             CalendarModule.forRoot({ provide: DateAdapter, useFactory: adapterFactory })] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: IDEAAgendaModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: IDEAAgendaModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [