@solcre-org/core-ui 2.20.13 → 2.20.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -17206,11 +17206,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
17206
17206
  // Este archivo es generado automáticamente por scripts/update-version.js
17207
17207
  // No edites manualmente este archivo
17208
17208
  const VERSION = {
17209
- full: '2.20.13',
17209
+ full: '2.20.14',
17210
17210
  major: 2,
17211
17211
  minor: 20,
17212
- patch: 13,
17213
- timestamp: '2026-02-06T12:08:17.601Z',
17212
+ patch: 14,
17213
+ timestamp: '2026-02-06T14:40:17.534Z',
17214
17214
  buildDate: '6/2/2026'
17215
17215
  };
17216
17216
 
@@ -22315,7 +22315,7 @@ class GenericSchedulerComponent {
22315
22315
  this.eventCancel.emit({ event, column });
22316
22316
  }
22317
22317
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSchedulerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
22318
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericSchedulerComponent, isStandalone: true, selector: "core-generic-scheduler", inputs: { selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, showTimeColumn: { classPropertyName: "showTimeColumn", publicName: "showTimeColumn", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, timeColumnLabel: { classPropertyName: "timeColumnLabel", publicName: "timeColumnLabel", isSignal: true, isRequired: false, transformFunction: null }, emptySlotLabel: { classPropertyName: "emptySlotLabel", publicName: "emptySlotLabel", isSignal: true, isRequired: false, transformFunction: null }, disabledSlotLabel: { classPropertyName: "disabledSlotLabel", publicName: "disabledSlotLabel", isSignal: true, isRequired: false, transformFunction: null }, todayLabel: { classPropertyName: "todayLabel", publicName: "todayLabel", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, weekLabel: { classPropertyName: "weekLabel", publicName: "weekLabel", isSignal: true, isRequired: false, transformFunction: null }, dayLabel: { classPropertyName: "dayLabel", publicName: "dayLabel", isSignal: true, isRequired: false, transformFunction: null }, monthLabel: { classPropertyName: "monthLabel", publicName: "monthLabel", isSignal: true, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClick: "slotClick", eventClick: "eventClick", eventHover: "eventHover", eventLeave: "eventLeave", eventApprove: "eventApprove", eventReject: "eventReject", eventCancel: "eventCancel", todayClick: "todayClick", previousDay: "previousDay", nextDay: "nextDay", previousWeek: "previousWeek", nextWeek: "nextWeek", previousMonth: "previousMonth", nextMonth: "nextMonth", viewModeChange: "viewModeChange" }, host: { properties: { "class.c-bookings-grid--weekly": "viewMode() === \"week\"", "style.--cols": "columns().length" }, classAttribute: "c-bookings-grid c-bookings-card" }, ngImport: i0, template: "@if (showHeader()) {\n<div class=\"c-bookings-header\">\n <button class=\"c-bookings-header__today\" (click)=\"onTodayClick()\">\n {{ todayLabel() }}\n </button>\n\n <div class=\"c-bookings-header__date\">\n <button class=\"c-bookings-header__date-arrow icon-arrow-left\"\n [title]=\"viewMode() === 'week' ? 'Semana anterior' : 'D\u00EDa anterior'\" (click)=\"onPrevious()\"></button>\n <span>{{ formattedDate() }}</span>\n <button class=\"c-bookings-header__date-arrow icon-arrow-right\"\n [title]=\"viewMode() === 'week' ? 'Semana siguiente' : 'D\u00EDa siguiente'\" (click)=\"onNext()\"></button>\n </div>\n\n <div class=\"c-bookings-header__view-toggle\">\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'day'\" (click)=\"setViewMode('day')\">\n {{ dayLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'week'\" (click)=\"setViewMode('week')\">\n {{ weekLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'month'\"\n (click)=\"setViewMode('month')\">\n {{ monthLabel() }}\n </button>\n </div>\n</div>\n} @if (viewMode() === 'day') {\n<!-- DAILY VIEW -->\n<div class=\"c-bookings-grid__wrapper\" [style.--cols]=\"columns().length\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (isToday() && currentTimePosition() !== null) {\n <div class=\"c-bookings-grid__current-time-line\" [style.--time-position-rem]=\"currentTimePosition()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (column of columns(); track column.id) {\n <div class=\"c-bookings-grid__col\">\n <div class=\"c-bookings-grid__top\">\n <p class=\"c-bookings-grid__title\">{{ column.name }}</p>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupied(column.id, slot)) { @if (isSlotDisabled(column.id,\n slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled [title]=\"disabledSlotLabel()\">\n {{ disabledSlotLabel() }}\n </button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\" (click)=\"onSlotClick(column.id, slot)\">\n {{ emptySlotLabel() }}\n </button>\n } } @if (shouldShowEvent(column.id, slot)) { @let event =\n getEventForSlot(column.id, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onEventClick(event, column)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.subtitle || event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n\n @if (event.canCancel) {\n <button class=\"c-bookings-grid__link c-link--underlined\"\n (click)=\"$event.stopPropagation(); onCancelClick(event, column)\">\n <span class=\"icon-cross-thin\"></span>\n Cancelar\n </button>\n } @if (event.canApprove || event.canReject) {\n <div class=\"c-bookings-grid__quick-actions\">\n @if (event.canApprove) {\n <button class=\"c-icon-btn--fill context:success icon-check\" title=\"Aprobar\"\n [style.width.rem]=\"event.canApproveHeightRem\" [style.height.rem]=\"event.canApproveHeightRem\"\n (click)=\"$event.stopPropagation(); onApproveClick(event, column)\"></button>\n } @if (event.canReject) {\n <button class=\"c-icon-btn--fill context:error icon-cross\" title=\"Rechazar\"\n [style.width.rem]=\"event.canRejectHeightRem\" [style.height.rem]=\"event.canRejectHeightRem\"\n (click)=\"$event.stopPropagation(); onRejectClick(event, column)\"></button>\n }\n </div>\n }\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'week') {\n<!-- WEEKLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--weekly\" [style.--cols]=\"7\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (currentTimePosition() !== null && currentTimeDayIndex() >= 0) {\n <div class=\"c-bookings-grid__current-time-line c-bookings-grid__current-time-line--weekly\"\n [style.--time-position-rem]=\"currentTimePosition()\" [style.--day-index]=\"currentTimeDayIndex()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (day of weekDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__col\" [class.c-bookings-grid__col--weekend]=\"day.isWeekend\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__day-header\" [class.is-today]=\"day.isToday\">\n <span class=\"c-bookings-grid__day-name\">{{ day.dayName }}</span>\n <span class=\"c-bookings-grid__day-number\" [class.is-today]=\"day.isToday\">{{ day.dayNumber }}</span>\n </div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupiedForDay(day.date, slot)) { @if\n (isSlotDisabledForDay(day.date, slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled\n [title]=\"disabledSlotLabel()\"></button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\"\n (click)=\"onWeekSlotClick(day.date, slot)\"></button>\n } } @if (shouldShowEventForDay(day.date, slot)) { @let event =\n getEventForDaySlot(day.date, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onWeekEventClick(event, day.date)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.subtitle || event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'month') {\n<!-- MONTHLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--monthly\">\n <!-- Header Row -->\n <div class=\"c-bookings-grid__header-row\">\n @for (day of monthDays().slice(0, 7); track day.dayName) {\n <div class=\"c-bookings-grid__header-cell\">\n {{ day.dayName }}\n </div>\n }\n </div>\n\n <!-- Days Grid -->\n <div class=\"c-bookings-grid__month-grid\">\n @for (day of monthDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__month-cell\" [class.is-today]=\"day.isToday\" [class.is-weekend]=\"day.isWeekend\"\n [class.is-other-month]=\"\n day.date.getUTCMonth() !== selectedDate().getUTCMonth()\n \" [class.is-disabled]=\"isDayDisabled(day.date)\" (click)=\"!isDayDisabled(day.date) && onMonthDayClick(day.date)\">\n <div class=\"c-bookings-grid__month-day-number\">\n {{ day.dayNumber }}\n </div>\n\n <div class=\"c-bookings-grid__month-events\">\n @let dayEvents = getEventsForDay(day.date); @for (event of\n dayEvents.slice(0, 3); track event.id) {\n <div class=\"c-bookings-grid__month-event\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"$event.stopPropagation(); onMonthEventClick(event, day.date)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n } @if (dayEvents.length > 3) {\n <div class=\"c-bookings-grid__more-events\" (click)=\"openDayPopover(day.date, $event)\">\n {{ dayEvents.length - 3 }} m\u00E1s\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n @if (expandedDay()) {\n <div class=\"c-bookings-grid__popover-overlay\" (click)=\"closeDayPopover()\">\n <div class=\"c-bookings-grid__popover\" (click)=\"$event.stopPropagation()\">\n <div class=\"c-bookings-grid__popover-header\">\n <div class=\"c-bookings-grid__popover-date\">\n <span class=\"c-bookings-grid__popover-weekday\">{{\n expandedDay() | date : \"EEE\" : \"UTC\" : locale() | uppercase\n }}</span>\n <span class=\"c-bookings-grid__popover-daynum\">{{\n expandedDay() | date : \"d\" : \"UTC\"\n }}</span>\n </div>\n <button class=\"c-bookings-grid__popover-close\" (click)=\"closeDayPopover()\">\n <span class=\"icon-cross\"></span>\n </button>\n </div>\n <div class=\"c-bookings-grid__popover-content\">\n @for (event of getExpandedDayEvents(); track event.id) {\n <div class=\"c-bookings-grid__month-event c-bookings-grid__month-event--popover\" [attr.data-type]=\"event.type\"\n [attr.data-status]=\"event.status\" [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"onMonthEventClick(event, expandedDay()!)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</div>\n}", styles: [":host{display:block;width:100%;overflow:visible}.c-bookings-grid__month-cell.is-disabled{background-color:#f3f4f6;cursor:not-allowed;opacity:.7}.c-bookings-grid__month-cell.is-disabled:hover{background-color:#f3f4f6}.c-bookings-grid__month-cell.is-disabled .c-bookings-grid__month-day-number{color:#9ca3af}.c-bookings-grid__slot--disabled{background-color:#f3f4f6;cursor:not-allowed}.c-bookings-grid__slot--disabled:hover{background-color:#f3f4f6}.c-bookings-grid__row{height:calc(var(--row-height-rem, 4) * 1rem)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
22318
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericSchedulerComponent, isStandalone: true, selector: "core-generic-scheduler", inputs: { selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, showTimeColumn: { classPropertyName: "showTimeColumn", publicName: "showTimeColumn", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, timeColumnLabel: { classPropertyName: "timeColumnLabel", publicName: "timeColumnLabel", isSignal: true, isRequired: false, transformFunction: null }, emptySlotLabel: { classPropertyName: "emptySlotLabel", publicName: "emptySlotLabel", isSignal: true, isRequired: false, transformFunction: null }, disabledSlotLabel: { classPropertyName: "disabledSlotLabel", publicName: "disabledSlotLabel", isSignal: true, isRequired: false, transformFunction: null }, todayLabel: { classPropertyName: "todayLabel", publicName: "todayLabel", isSignal: true, isRequired: false, transformFunction: null }, locale: { classPropertyName: "locale", publicName: "locale", isSignal: true, isRequired: false, transformFunction: null }, weekLabel: { classPropertyName: "weekLabel", publicName: "weekLabel", isSignal: true, isRequired: false, transformFunction: null }, dayLabel: { classPropertyName: "dayLabel", publicName: "dayLabel", isSignal: true, isRequired: false, transformFunction: null }, monthLabel: { classPropertyName: "monthLabel", publicName: "monthLabel", isSignal: true, isRequired: false, transformFunction: null }, disabledDates: { classPropertyName: "disabledDates", publicName: "disabledDates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { slotClick: "slotClick", eventClick: "eventClick", eventHover: "eventHover", eventLeave: "eventLeave", eventApprove: "eventApprove", eventReject: "eventReject", eventCancel: "eventCancel", todayClick: "todayClick", previousDay: "previousDay", nextDay: "nextDay", previousWeek: "previousWeek", nextWeek: "nextWeek", previousMonth: "previousMonth", nextMonth: "nextMonth", viewModeChange: "viewModeChange" }, host: { properties: { "class.c-bookings-grid--weekly": "viewMode() === \"week\"", "style.--cols": "columns().length" }, classAttribute: "c-bookings-grid c-bookings-card" }, ngImport: i0, template: "@if (showHeader()) {\n<div class=\"c-bookings-header\">\n <button class=\"c-bookings-header__today\" (click)=\"onTodayClick()\">\n {{ todayLabel() }}\n </button>\n\n <div class=\"c-bookings-header__date\">\n <button class=\"c-bookings-header__date-arrow icon-arrow-left\"\n [title]=\"viewMode() === 'week' ? 'Semana anterior' : 'D\u00EDa anterior'\" (click)=\"onPrevious()\"></button>\n <span>{{ formattedDate() }}</span>\n <button class=\"c-bookings-header__date-arrow icon-arrow-right\"\n [title]=\"viewMode() === 'week' ? 'Semana siguiente' : 'D\u00EDa siguiente'\" (click)=\"onNext()\"></button>\n </div>\n\n <div class=\"c-bookings-header__view-toggle\">\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'day'\" (click)=\"setViewMode('day')\">\n {{ dayLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'week'\" (click)=\"setViewMode('week')\">\n {{ weekLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'month'\"\n (click)=\"setViewMode('month')\">\n {{ monthLabel() }}\n </button>\n </div>\n</div>\n} @if (viewMode() === 'day') {\n<!-- DAILY VIEW -->\n<div class=\"c-bookings-grid__wrapper\" [style.--cols]=\"columns().length\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (isToday() && currentTimePosition() !== null) {\n <div class=\"c-bookings-grid__current-time-line\" [style.--time-position-rem]=\"currentTimePosition()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (column of columns(); track column.id) {\n <div class=\"c-bookings-grid__col\">\n <div class=\"c-bookings-grid__top\">\n <p class=\"c-bookings-grid__title\">{{ column.name }}</p>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupied(column.id, slot) && !mergedConfig().emptySlotEventsDisabled) {\n @if (isSlotDisabled(column.id, slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled [title]=\"disabledSlotLabel()\">\n {{ disabledSlotLabel() }}\n </button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\" (click)=\"onSlotClick(column.id, slot)\">\n {{ emptySlotLabel() }}\n </button>\n }\n } @if (shouldShowEvent(column.id, slot)) { @let event =\n getEventForSlot(column.id, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onEventClick(event, column)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n @if (event.subtitle) {\n <p class=\"c-bookings-grid__text\">\n {{ event.subtitle }}\n </p>\n }\n\n @if (event.canCancel) {\n <button class=\"c-bookings-grid__link c-link--underlined\"\n (click)=\"$event.stopPropagation(); onCancelClick(event, column)\">\n <span class=\"icon-cross-thin\"></span>\n Cancelar\n </button>\n } @if (event.canApprove || event.canReject) {\n <div class=\"c-bookings-grid__quick-actions\">\n @if (event.canApprove) {\n <button class=\"c-icon-btn--fill context:success icon-check\" title=\"Aprobar\"\n [style.width.rem]=\"event.canApproveHeightRem\" [style.height.rem]=\"event.canApproveHeightRem\"\n (click)=\"$event.stopPropagation(); onApproveClick(event, column)\"></button>\n } @if (event.canReject) {\n <button class=\"c-icon-btn--fill context:error icon-cross\" title=\"Rechazar\"\n [style.width.rem]=\"event.canRejectHeightRem\" [style.height.rem]=\"event.canRejectHeightRem\"\n (click)=\"$event.stopPropagation(); onRejectClick(event, column)\"></button>\n }\n </div>\n }\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'week') {\n<!-- WEEKLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--weekly\" [style.--cols]=\"7\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (currentTimePosition() !== null && currentTimeDayIndex() >= 0) {\n <div class=\"c-bookings-grid__current-time-line c-bookings-grid__current-time-line--weekly\"\n [style.--time-position-rem]=\"currentTimePosition()\" [style.--day-index]=\"currentTimeDayIndex()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (day of weekDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__col\" [class.c-bookings-grid__col--weekend]=\"day.isWeekend\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__day-header\" [class.is-today]=\"day.isToday\">\n <span class=\"c-bookings-grid__day-name\">{{ day.dayName }}</span>\n <span class=\"c-bookings-grid__day-number\" [class.is-today]=\"day.isToday\">{{ day.dayNumber }}</span>\n </div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupiedForDay(day.date, slot)) { @if\n (isSlotDisabledForDay(day.date, slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled\n [title]=\"disabledSlotLabel()\"></button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\"\n (click)=\"onWeekSlotClick(day.date, slot)\"></button>\n } } @if (shouldShowEventForDay(day.date, slot)) { @let event =\n getEventForDaySlot(day.date, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onWeekEventClick(event, day.date)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.subtitle || event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'month') {\n<!-- MONTHLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--monthly\">\n <!-- Header Row -->\n <div class=\"c-bookings-grid__header-row\">\n @for (day of monthDays().slice(0, 7); track day.dayName) {\n <div class=\"c-bookings-grid__header-cell\">\n {{ day.dayName }}\n </div>\n }\n </div>\n\n <!-- Days Grid -->\n <div class=\"c-bookings-grid__month-grid\">\n @for (day of monthDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__month-cell\" [class.is-today]=\"day.isToday\" [class.is-weekend]=\"day.isWeekend\"\n [class.is-other-month]=\"\n day.date.getUTCMonth() !== selectedDate().getUTCMonth()\n \" [class.is-disabled]=\"isDayDisabled(day.date)\" (click)=\"!isDayDisabled(day.date) && onMonthDayClick(day.date)\">\n <div class=\"c-bookings-grid__month-day-number\">\n {{ day.dayNumber }}\n </div>\n\n <div class=\"c-bookings-grid__month-events\">\n @let dayEvents = getEventsForDay(day.date); @for (event of\n dayEvents.slice(0, 3); track event.id) {\n <div class=\"c-bookings-grid__month-event\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"$event.stopPropagation(); onMonthEventClick(event, day.date)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n } @if (dayEvents.length > 3) {\n <div class=\"c-bookings-grid__more-events\" (click)=\"openDayPopover(day.date, $event)\">\n {{ dayEvents.length - 3 }} m\u00E1s\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n @if (expandedDay()) {\n <div class=\"c-bookings-grid__popover-overlay\" (click)=\"closeDayPopover()\">\n <div class=\"c-bookings-grid__popover\" (click)=\"$event.stopPropagation()\">\n <div class=\"c-bookings-grid__popover-header\">\n <div class=\"c-bookings-grid__popover-date\">\n <span class=\"c-bookings-grid__popover-weekday\">{{\n expandedDay() | date : \"EEE\" : \"UTC\" : locale() | uppercase\n }}</span>\n <span class=\"c-bookings-grid__popover-daynum\">{{\n expandedDay() | date : \"d\" : \"UTC\"\n }}</span>\n </div>\n <button class=\"c-bookings-grid__popover-close\" (click)=\"closeDayPopover()\">\n <span class=\"icon-cross\"></span>\n </button>\n </div>\n <div class=\"c-bookings-grid__popover-content\">\n @for (event of getExpandedDayEvents(); track event.id) {\n <div class=\"c-bookings-grid__month-event c-bookings-grid__month-event--popover\" [attr.data-type]=\"event.type\"\n [attr.data-status]=\"event.status\" [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"onMonthEventClick(event, expandedDay()!)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</div>\n}", styles: [":host{display:block;width:100%;overflow:visible}.c-bookings-grid__month-cell.is-disabled{background-color:#f3f4f6;cursor:not-allowed;opacity:.7}.c-bookings-grid__month-cell.is-disabled:hover{background-color:#f3f4f6}.c-bookings-grid__month-cell.is-disabled .c-bookings-grid__month-day-number{color:#9ca3af}.c-bookings-grid__slot--disabled{background-color:#f3f4f6;cursor:not-allowed}.c-bookings-grid__slot--disabled:hover{background-color:#f3f4f6}.c-bookings-grid__row{height:calc(var(--row-height-rem, 4) * 1rem)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2.DatePipe, name: "date" }] });
22319
22319
  }
22320
22320
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSchedulerComponent, decorators: [{
22321
22321
  type: Component,
@@ -22323,7 +22323,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
22323
22323
  'class': 'c-bookings-grid c-bookings-card',
22324
22324
  '[class.c-bookings-grid--weekly]': 'viewMode() === "week"',
22325
22325
  '[style.--cols]': 'columns().length'
22326
- }, template: "@if (showHeader()) {\n<div class=\"c-bookings-header\">\n <button class=\"c-bookings-header__today\" (click)=\"onTodayClick()\">\n {{ todayLabel() }}\n </button>\n\n <div class=\"c-bookings-header__date\">\n <button class=\"c-bookings-header__date-arrow icon-arrow-left\"\n [title]=\"viewMode() === 'week' ? 'Semana anterior' : 'D\u00EDa anterior'\" (click)=\"onPrevious()\"></button>\n <span>{{ formattedDate() }}</span>\n <button class=\"c-bookings-header__date-arrow icon-arrow-right\"\n [title]=\"viewMode() === 'week' ? 'Semana siguiente' : 'D\u00EDa siguiente'\" (click)=\"onNext()\"></button>\n </div>\n\n <div class=\"c-bookings-header__view-toggle\">\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'day'\" (click)=\"setViewMode('day')\">\n {{ dayLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'week'\" (click)=\"setViewMode('week')\">\n {{ weekLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'month'\"\n (click)=\"setViewMode('month')\">\n {{ monthLabel() }}\n </button>\n </div>\n</div>\n} @if (viewMode() === 'day') {\n<!-- DAILY VIEW -->\n<div class=\"c-bookings-grid__wrapper\" [style.--cols]=\"columns().length\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (isToday() && currentTimePosition() !== null) {\n <div class=\"c-bookings-grid__current-time-line\" [style.--time-position-rem]=\"currentTimePosition()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (column of columns(); track column.id) {\n <div class=\"c-bookings-grid__col\">\n <div class=\"c-bookings-grid__top\">\n <p class=\"c-bookings-grid__title\">{{ column.name }}</p>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupied(column.id, slot)) { @if (isSlotDisabled(column.id,\n slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled [title]=\"disabledSlotLabel()\">\n {{ disabledSlotLabel() }}\n </button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\" (click)=\"onSlotClick(column.id, slot)\">\n {{ emptySlotLabel() }}\n </button>\n } } @if (shouldShowEvent(column.id, slot)) { @let event =\n getEventForSlot(column.id, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onEventClick(event, column)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.subtitle || event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n\n @if (event.canCancel) {\n <button class=\"c-bookings-grid__link c-link--underlined\"\n (click)=\"$event.stopPropagation(); onCancelClick(event, column)\">\n <span class=\"icon-cross-thin\"></span>\n Cancelar\n </button>\n } @if (event.canApprove || event.canReject) {\n <div class=\"c-bookings-grid__quick-actions\">\n @if (event.canApprove) {\n <button class=\"c-icon-btn--fill context:success icon-check\" title=\"Aprobar\"\n [style.width.rem]=\"event.canApproveHeightRem\" [style.height.rem]=\"event.canApproveHeightRem\"\n (click)=\"$event.stopPropagation(); onApproveClick(event, column)\"></button>\n } @if (event.canReject) {\n <button class=\"c-icon-btn--fill context:error icon-cross\" title=\"Rechazar\"\n [style.width.rem]=\"event.canRejectHeightRem\" [style.height.rem]=\"event.canRejectHeightRem\"\n (click)=\"$event.stopPropagation(); onRejectClick(event, column)\"></button>\n }\n </div>\n }\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'week') {\n<!-- WEEKLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--weekly\" [style.--cols]=\"7\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (currentTimePosition() !== null && currentTimeDayIndex() >= 0) {\n <div class=\"c-bookings-grid__current-time-line c-bookings-grid__current-time-line--weekly\"\n [style.--time-position-rem]=\"currentTimePosition()\" [style.--day-index]=\"currentTimeDayIndex()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (day of weekDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__col\" [class.c-bookings-grid__col--weekend]=\"day.isWeekend\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__day-header\" [class.is-today]=\"day.isToday\">\n <span class=\"c-bookings-grid__day-name\">{{ day.dayName }}</span>\n <span class=\"c-bookings-grid__day-number\" [class.is-today]=\"day.isToday\">{{ day.dayNumber }}</span>\n </div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupiedForDay(day.date, slot)) { @if\n (isSlotDisabledForDay(day.date, slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled\n [title]=\"disabledSlotLabel()\"></button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\"\n (click)=\"onWeekSlotClick(day.date, slot)\"></button>\n } } @if (shouldShowEventForDay(day.date, slot)) { @let event =\n getEventForDaySlot(day.date, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onWeekEventClick(event, day.date)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.subtitle || event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'month') {\n<!-- MONTHLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--monthly\">\n <!-- Header Row -->\n <div class=\"c-bookings-grid__header-row\">\n @for (day of monthDays().slice(0, 7); track day.dayName) {\n <div class=\"c-bookings-grid__header-cell\">\n {{ day.dayName }}\n </div>\n }\n </div>\n\n <!-- Days Grid -->\n <div class=\"c-bookings-grid__month-grid\">\n @for (day of monthDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__month-cell\" [class.is-today]=\"day.isToday\" [class.is-weekend]=\"day.isWeekend\"\n [class.is-other-month]=\"\n day.date.getUTCMonth() !== selectedDate().getUTCMonth()\n \" [class.is-disabled]=\"isDayDisabled(day.date)\" (click)=\"!isDayDisabled(day.date) && onMonthDayClick(day.date)\">\n <div class=\"c-bookings-grid__month-day-number\">\n {{ day.dayNumber }}\n </div>\n\n <div class=\"c-bookings-grid__month-events\">\n @let dayEvents = getEventsForDay(day.date); @for (event of\n dayEvents.slice(0, 3); track event.id) {\n <div class=\"c-bookings-grid__month-event\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"$event.stopPropagation(); onMonthEventClick(event, day.date)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n } @if (dayEvents.length > 3) {\n <div class=\"c-bookings-grid__more-events\" (click)=\"openDayPopover(day.date, $event)\">\n {{ dayEvents.length - 3 }} m\u00E1s\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n @if (expandedDay()) {\n <div class=\"c-bookings-grid__popover-overlay\" (click)=\"closeDayPopover()\">\n <div class=\"c-bookings-grid__popover\" (click)=\"$event.stopPropagation()\">\n <div class=\"c-bookings-grid__popover-header\">\n <div class=\"c-bookings-grid__popover-date\">\n <span class=\"c-bookings-grid__popover-weekday\">{{\n expandedDay() | date : \"EEE\" : \"UTC\" : locale() | uppercase\n }}</span>\n <span class=\"c-bookings-grid__popover-daynum\">{{\n expandedDay() | date : \"d\" : \"UTC\"\n }}</span>\n </div>\n <button class=\"c-bookings-grid__popover-close\" (click)=\"closeDayPopover()\">\n <span class=\"icon-cross\"></span>\n </button>\n </div>\n <div class=\"c-bookings-grid__popover-content\">\n @for (event of getExpandedDayEvents(); track event.id) {\n <div class=\"c-bookings-grid__month-event c-bookings-grid__month-event--popover\" [attr.data-type]=\"event.type\"\n [attr.data-status]=\"event.status\" [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"onMonthEventClick(event, expandedDay()!)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</div>\n}", styles: [":host{display:block;width:100%;overflow:visible}.c-bookings-grid__month-cell.is-disabled{background-color:#f3f4f6;cursor:not-allowed;opacity:.7}.c-bookings-grid__month-cell.is-disabled:hover{background-color:#f3f4f6}.c-bookings-grid__month-cell.is-disabled .c-bookings-grid__month-day-number{color:#9ca3af}.c-bookings-grid__slot--disabled{background-color:#f3f4f6;cursor:not-allowed}.c-bookings-grid__slot--disabled:hover{background-color:#f3f4f6}.c-bookings-grid__row{height:calc(var(--row-height-rem, 4) * 1rem)}\n"] }]
22326
+ }, template: "@if (showHeader()) {\n<div class=\"c-bookings-header\">\n <button class=\"c-bookings-header__today\" (click)=\"onTodayClick()\">\n {{ todayLabel() }}\n </button>\n\n <div class=\"c-bookings-header__date\">\n <button class=\"c-bookings-header__date-arrow icon-arrow-left\"\n [title]=\"viewMode() === 'week' ? 'Semana anterior' : 'D\u00EDa anterior'\" (click)=\"onPrevious()\"></button>\n <span>{{ formattedDate() }}</span>\n <button class=\"c-bookings-header__date-arrow icon-arrow-right\"\n [title]=\"viewMode() === 'week' ? 'Semana siguiente' : 'D\u00EDa siguiente'\" (click)=\"onNext()\"></button>\n </div>\n\n <div class=\"c-bookings-header__view-toggle\">\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'day'\" (click)=\"setViewMode('day')\">\n {{ dayLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'week'\" (click)=\"setViewMode('week')\">\n {{ weekLabel() }}\n </button>\n <button class=\"c-bookings-header__view-btn\" [class.is-active]=\"viewMode() === 'month'\"\n (click)=\"setViewMode('month')\">\n {{ monthLabel() }}\n </button>\n </div>\n</div>\n} @if (viewMode() === 'day') {\n<!-- DAILY VIEW -->\n<div class=\"c-bookings-grid__wrapper\" [style.--cols]=\"columns().length\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (isToday() && currentTimePosition() !== null) {\n <div class=\"c-bookings-grid__current-time-line\" [style.--time-position-rem]=\"currentTimePosition()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (column of columns(); track column.id) {\n <div class=\"c-bookings-grid__col\">\n <div class=\"c-bookings-grid__top\">\n <p class=\"c-bookings-grid__title\">{{ column.name }}</p>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupied(column.id, slot) && !mergedConfig().emptySlotEventsDisabled) {\n @if (isSlotDisabled(column.id, slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled [title]=\"disabledSlotLabel()\">\n {{ disabledSlotLabel() }}\n </button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\" (click)=\"onSlotClick(column.id, slot)\">\n {{ emptySlotLabel() }}\n </button>\n }\n } @if (shouldShowEvent(column.id, slot)) { @let event =\n getEventForSlot(column.id, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onEventClick(event, column)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n @if (event.subtitle) {\n <p class=\"c-bookings-grid__text\">\n {{ event.subtitle }}\n </p>\n }\n\n @if (event.canCancel) {\n <button class=\"c-bookings-grid__link c-link--underlined\"\n (click)=\"$event.stopPropagation(); onCancelClick(event, column)\">\n <span class=\"icon-cross-thin\"></span>\n Cancelar\n </button>\n } @if (event.canApprove || event.canReject) {\n <div class=\"c-bookings-grid__quick-actions\">\n @if (event.canApprove) {\n <button class=\"c-icon-btn--fill context:success icon-check\" title=\"Aprobar\"\n [style.width.rem]=\"event.canApproveHeightRem\" [style.height.rem]=\"event.canApproveHeightRem\"\n (click)=\"$event.stopPropagation(); onApproveClick(event, column)\"></button>\n } @if (event.canReject) {\n <button class=\"c-icon-btn--fill context:error icon-cross\" title=\"Rechazar\"\n [style.width.rem]=\"event.canRejectHeightRem\" [style.height.rem]=\"event.canRejectHeightRem\"\n (click)=\"$event.stopPropagation(); onRejectClick(event, column)\"></button>\n }\n </div>\n }\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'week') {\n<!-- WEEKLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--weekly\" [style.--cols]=\"7\"\n [style.--row-height-rem]=\"mergedConfig().rowHeightRem\" style=\"position: relative\">\n @if (currentTimePosition() !== null && currentTimeDayIndex() >= 0) {\n <div class=\"c-bookings-grid__current-time-line c-bookings-grid__current-time-line--weekly\"\n [style.--time-position-rem]=\"currentTimePosition()\" [style.--day-index]=\"currentTimeDayIndex()\"></div>\n } @if (showTimeColumn()) {\n <div class=\"c-bookings-grid__times\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__title\">{{ timeColumnLabel() }}</div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (slot.displayTime) {\n <span class=\"c-bookings-grid__time\">{{ slot.time }}</span>\n }\n </div>\n }\n </div>\n } @for (day of weekDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__col\" [class.c-bookings-grid__col--weekend]=\"day.isWeekend\">\n <div class=\"c-bookings-grid__top c-bookings-grid__top--weekly\">\n <div class=\"c-bookings-grid__day-header\" [class.is-today]=\"day.isToday\">\n <span class=\"c-bookings-grid__day-name\">{{ day.dayName }}</span>\n <span class=\"c-bookings-grid__day-number\" [class.is-today]=\"day.isToday\">{{ day.dayNumber }}</span>\n </div>\n </div>\n\n @for (slot of timeSlots(); track slot.time) {\n <div class=\"c-bookings-grid__row\">\n @if (!isSlotOccupiedForDay(day.date, slot)) { @if\n (isSlotDisabledForDay(day.date, slot)) {\n <button class=\"c-bookings-grid__slot c-bookings-grid__slot--disabled\" disabled\n [title]=\"disabledSlotLabel()\"></button>\n } @else {\n <button class=\"c-bookings-grid__slot\" [title]=\"emptySlotLabel()\"\n (click)=\"onWeekSlotClick(day.date, slot)\"></button>\n } } @if (shouldShowEventForDay(day.date, slot)) { @let event =\n getEventForDaySlot(day.date, slot); @if (event) {\n <div [class]=\"getEventClasses(event)\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.--rows]=\"getEventRowSpan(event)\" (mouseenter)=\"onEventHover($event, event)\" (mouseleave)=\"onEventLeave()\"\n (click)=\"onWeekEventClick(event, day.date)\">\n <p class=\"c-bookings-grid__title\">\n {{ event.subtitle || event.title }}\n </p>\n <p class=\"c-bookings-grid__text\">\n {{ event.startTime }} - {{ event.endTime }}\n </p>\n </div>\n } }\n </div>\n }\n </div>\n }\n</div>\n} @else if (viewMode() === 'month') {\n<!-- MONTHLY VIEW -->\n<div class=\"c-bookings-grid__wrapper c-bookings-grid__wrapper--monthly\">\n <!-- Header Row -->\n <div class=\"c-bookings-grid__header-row\">\n @for (day of monthDays().slice(0, 7); track day.dayName) {\n <div class=\"c-bookings-grid__header-cell\">\n {{ day.dayName }}\n </div>\n }\n </div>\n\n <!-- Days Grid -->\n <div class=\"c-bookings-grid__month-grid\">\n @for (day of monthDays(); track day.date.getTime()) {\n <div class=\"c-bookings-grid__month-cell\" [class.is-today]=\"day.isToday\" [class.is-weekend]=\"day.isWeekend\"\n [class.is-other-month]=\"\n day.date.getUTCMonth() !== selectedDate().getUTCMonth()\n \" [class.is-disabled]=\"isDayDisabled(day.date)\" (click)=\"!isDayDisabled(day.date) && onMonthDayClick(day.date)\">\n <div class=\"c-bookings-grid__month-day-number\">\n {{ day.dayNumber }}\n </div>\n\n <div class=\"c-bookings-grid__month-events\">\n @let dayEvents = getEventsForDay(day.date); @for (event of\n dayEvents.slice(0, 3); track event.id) {\n <div class=\"c-bookings-grid__month-event\" [attr.data-type]=\"event.type\" [attr.data-status]=\"event.status\"\n [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"$event.stopPropagation(); onMonthEventClick(event, day.date)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n } @if (dayEvents.length > 3) {\n <div class=\"c-bookings-grid__more-events\" (click)=\"openDayPopover(day.date, $event)\">\n {{ dayEvents.length - 3 }} m\u00E1s\n </div>\n }\n </div>\n </div>\n }\n </div>\n\n @if (expandedDay()) {\n <div class=\"c-bookings-grid__popover-overlay\" (click)=\"closeDayPopover()\">\n <div class=\"c-bookings-grid__popover\" (click)=\"$event.stopPropagation()\">\n <div class=\"c-bookings-grid__popover-header\">\n <div class=\"c-bookings-grid__popover-date\">\n <span class=\"c-bookings-grid__popover-weekday\">{{\n expandedDay() | date : \"EEE\" : \"UTC\" : locale() | uppercase\n }}</span>\n <span class=\"c-bookings-grid__popover-daynum\">{{\n expandedDay() | date : \"d\" : \"UTC\"\n }}</span>\n </div>\n <button class=\"c-bookings-grid__popover-close\" (click)=\"closeDayPopover()\">\n <span class=\"icon-cross\"></span>\n </button>\n </div>\n <div class=\"c-bookings-grid__popover-content\">\n @for (event of getExpandedDayEvents(); track event.id) {\n <div class=\"c-bookings-grid__month-event c-bookings-grid__month-event--popover\" [attr.data-type]=\"event.type\"\n [attr.data-status]=\"event.status\" [style.background-color]=\"event.metadata?.['color']\"\n [style.border-left]=\"event.metadata?.['color'] ? '3px solid ' + event.metadata?.['color'] : ''\"\n (click)=\"onMonthEventClick(event, expandedDay()!)\">\n <span class=\"c-bookings-grid__month-event-title\">{{\n event.title\n }}</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n</div>\n}", styles: [":host{display:block;width:100%;overflow:visible}.c-bookings-grid__month-cell.is-disabled{background-color:#f3f4f6;cursor:not-allowed;opacity:.7}.c-bookings-grid__month-cell.is-disabled:hover{background-color:#f3f4f6}.c-bookings-grid__month-cell.is-disabled .c-bookings-grid__month-day-number{color:#9ca3af}.c-bookings-grid__slot--disabled{background-color:#f3f4f6;cursor:not-allowed}.c-bookings-grid__slot--disabled:hover{background-color:#f3f4f6}.c-bookings-grid__row{height:calc(var(--row-height-rem, 4) * 1rem)}\n"] }]
22327
22327
  }] });
22328
22328
 
22329
22329
  class CacheBustingInterceptor {