@cwellt_software/cwellt-reactjs-lib 1.2.13 → 1.2.14

package/dist/src/components/custom/scheduler-new/presentation/logic/getDefaultDivisions.js

@@ -0,0 +1,113 @@
+import moment from "moment";
+import { calculateDivisionsByDays, getHoursFromDivisions } from "./getDivisions";
+export const getDefaultDivisions = (visibleDays, selectedDate) => {
+    if (visibleDays <= 15) {
+        return getDayDivisions(visibleDays, selectedDate);
+    }
+    if (visibleDays <= 30) {
+        return getWeekDivisions(visibleDays, selectedDate);
+    }
+    // from 31 to infinity
+    return getMonthDivisions(visibleDays, selectedDate);
+};
+const getDayDivisions = (visibleDays, selectedDate) => {
+    const divisionsNumber = calculateDivisionsByDays(visibleDays);
+    const divisions = getHoursFromDivisions(divisionsNumber);
+    const calculatedDivision = [];
+    for (let i = 0; i < visibleDays; i++) {
+        const currentDate = moment(selectedDate).add(i, "days");
+        calculatedDivision.push({
+            top: currentDate.format("DD.MM.YYYY"),
+            bottom: divisions,
+            startDate: currentDate.toDate(),
+            endDate: currentDate.toDate()
+        });
+    }
+    return calculatedDivision;
+};
+const getWeekDivisions = (visibleDays, selectedDate) => {
+    const weeks = getWeeksByDays(visibleDays, selectedDate);
+    const divisions = weeks.map((week) => {
+        const days = Array.from({ length: week.days }, (_, i) => moment(week.start).add(i, "days").date().toString());
+        const weekEnd = moment(week.start).add(week.days - 1, "days");
+        const top = days.length > 2
+            ? moment(week.start).format("DD.MM.YYYY") + " - " + moment(week.start).add(week.days - 1, "days").format("DD.MM.YYYY")
+            : moment(week.start).format("DD.MM.YYYY");
+        const division = {
+            top: top,
+            bottom: days,
+            startDate: moment(week.start).toDate(),
+            endDate: weekEnd.toDate()
+        };
+        return division;
+    });
+    return divisions;
+};
+const getMonthDivisions = (visibleDays, selectedDate) => {
+    const months = getMonthsByDays(visibleDays, selectedDate);
+    const divisions = months.map((month) => {
+        const days = Array.from({ length: month.days }, (_, i) => moment(month.start).add(i, "days").date().toString());
+        const monthEnd = moment(month.start).add(month.days - 1, "days");
+        const division = {
+            top: moment(month.start).format("MM.YYYY"),
+            bottom: days,
+            startDate: moment(month.start).toDate(), // Añadir fecha de inicio
+            endDate: monthEnd.toDate()
+        };
+        return division;
+    });
+    return divisions;
+};
+export const getMonthsByDays = (visibleDays, selectedDate) => {
+    if (visibleDays <= 0) {
+        return [];
+    }
+    const month = [];
+    let temporalDay = moment(selectedDate);
+    for (let i = 0; i < visibleDays; i++) {
+        const currentDay = moment(selectedDate).add(i, "days");
+        const isLastLoop = i + 1 === visibleDays;
+        if (isLastLoop) {
+            month.push({
+                start: temporalDay.toDate(),
+                days: Math.abs(temporalDay.diff(currentDay, "days")) + 1,
+            });
+            break;
+        }
+        if (currentDay.date() === currentDay.daysInMonth()) {
+            month.push({
+                start: temporalDay.toDate(),
+                days: Math.abs(temporalDay.diff(currentDay, "days")) + 1,
+            });
+            temporalDay = currentDay.add(1, "days");
+        }
+    }
+    return month;
+};
+const SUNDAY = 0;
+export const getWeeksByDays = (visibleDays, selectedDate) => {
+    if (visibleDays <= 0) {
+        return [];
+    }
+    const weeks = [];
+    let temporalDay = moment(selectedDate);
+    for (let i = 0; i < visibleDays; i++) {
+        const currentDay = moment(selectedDate).add(i, "days");
+        const isLastLoop = i + 1 === visibleDays;
+        if (isLastLoop) {
+            weeks.push({
+                start: temporalDay.toDate(),
+                days: Math.abs(temporalDay.diff(currentDay, "days")) + 1,
+            });
+            break;
+        }
+        if (currentDay.day() === SUNDAY) {
+            weeks.push({
+                start: temporalDay.toDate(),
+                days: Math.abs(temporalDay.diff(currentDay, "days")) + 1,
+            });
+            temporalDay = currentDay.add(1, "days");
+        }
+    }
+    return weeks;
+};

package/dist/src/components/custom/scheduler-new/presentation/logic/getDivisions.d.ts

@@ -1,3 +1,3 @@
 export declare const calculateDivisionsByDays: (days: number) => number;
-export declare const getHoursFromDivisions: (divisions: number) => string[];
+export declare const getHoursFromDivisions: (divisions: number, useCompactHourFormat?: boolean) => string[];
 //# sourceMappingURL=getDivisions.d.ts.map

package/dist/src/components/custom/scheduler-new/presentation/logic/getDivisions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getDivisions.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getDivisions.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,wBAAwB,SAAU,MAAM,KAAG,MAQvD,CAAC;AAEF,eAAO,MAAM,qBAAqB,cAAe,MAAM,KAAG,MAAM,EAU/D,CAAC"}
+{"version":3,"file":"getDivisions.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getDivisions.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,wBAAwB,GAAI,MAAM,MAAM,KAAG,MAGvD,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,WAAW,MAAM,EAAE,8BAA4B,KAAG,MAAM,EAW7F,CAAC"}

package/dist/src/components/custom/scheduler-new/presentation/logic/getDivisions.js

@@ -0,0 +1,21 @@
+import moment from "moment";
+export const calculateDivisionsByDays = (days) => {
+    if (days <= 3) {
+        return 8;
+    }
+    if (days <= 7) {
+        return 3;
+    }
+    return 2;
+};
+export const getHoursFromDivisions = (divisions) => {
+    const hoursInterval = 24 / divisions;
+    const array = [];
+    for (let i = 0; i < divisions; i++) {
+        const newHour = moment(new Date(1, 1, 1))
+            .add(hoursInterval * i, "hours")
+            .format("HH:mm");
+        array.push(newHour);
+    }
+    return array;
+};

package/dist/src/components/custom/scheduler-new/presentation/logic/getEventSizes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getEventSizes.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getEventSizes.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,UAAW,IAAI,SAAS,IAAI,WAIpD,CAAC;AAEF,eAAO,MAAM,aAAa,kBAAmB,IAAI,aAAa,MAAM,aAAa,IAAI,WAAW,IAAI;;;CA2BnG,CAAC"}
+{"version":3,"file":"getEventSizes.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getEventSizes.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,GAAI,OAAO,IAAI,EAAE,OAAO,IAAI,WAIpD,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,eAAe,IAAI,EAAE,WAAW,MAAM,EAAE,WAAW,IAAI,EAAE,SAAS,IAAI;;;CA8BnG,CAAC"}

package/dist/src/components/custom/scheduler-new/presentation/logic/getEventSizes.js

@@ -0,0 +1,30 @@
+import { eventIsVisible } from "./eventIsVisible";
+export const hoursBetween = (date1, date2) => {
+    const oneHourInMillis = 60 * 60 * 1000; // hours*minutes*seconds*milliseconds
+    const timeDiff = date2.getTime() - date1.getTime();
+    return timeDiff / oneHourInMillis;
+};
+export const getEventSizes = (schedulerDate, totalDays, startDate, endDate) => {
+    if (!eventIsVisible(startDate, endDate, schedulerDate, totalDays)) {
+        return {
+            left: 0,
+            width: 0,
+        };
+    }
+    const totalHours = totalDays * 24;
+    const dateString = schedulerDate.toISOString().split('T')[0];
+    const schedulerDateAtZero = new Date(dateString);
+    let startHours = hoursBetween(schedulerDateAtZero, startDate);
+    let durationHours = hoursBetween(startDate, endDate);
+    const startOutOfScheduler = startHours < 0;
+    if (startOutOfScheduler) {
+        durationHours += startHours;
+        startHours = 0;
+    }
+    const left = (startHours / totalHours) * 100;
+    const width = (durationHours * 100) / totalHours;
+    return {
+        left,
+        width,
+    };
+};

package/dist/src/components/custom/scheduler-new/presentation/logic/getLinesByDivisions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getLinesByDivisions.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getLinesByDivisions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAEvD,wBAAgB,mBAAmB,CAAC,cAAc,EAAE,cAAc,EAAE,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,EAAE,CAe5F"}
+{"version":3,"file":"getLinesByDivisions.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/getLinesByDivisions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAEvD,wBAAgB,mBAAmB,CAAC,cAAc,EAAE,cAAc,EAAE,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,EAAE,CAc5F"}

package/dist/src/components/custom/scheduler-new/presentation/logic/getLinesByDivisions.js

@@ -0,0 +1,13 @@
+export function getLinesByDivisions(headerDivision, _) {
+    const lines = headerDivision.flatMap((division) => {
+        return division.bottom;
+    });
+    const left = 100 / lines.length;
+    const finalLines = lines.map((_, index) => {
+        return {
+            left: left * index,
+            width: 1,
+        };
+    }).filter((_, index) => index !== 0);
+    return finalLines;
+}

package/dist/src/components/custom/scheduler-new/presentation/logic/getPercentageFromMouseEvent.js

@@ -0,0 +1,7 @@
+export function getPercentageFromMouseEvent(event) {
+    const rect = event.currentTarget.getBoundingClientRect();
+    const x = event.clientX - rect.left;
+    const totalWidth = rect.width;
+    const clickPercentage = x / totalWidth;
+    return clickPercentage;
+}

package/dist/src/components/custom/scheduler-new/presentation/logic/separateEventsToInnerRows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"separateEventsToInnerRows.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/separateEventsToInnerRows.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAU3D,eAAO,MAAM,yBAAyB,GAAI,CAAC,SAAS,gBAAgB,UAAU,CAAC,EAAE,KAAG,CAAC,EAAE,EA0BtF,CAAC"}
+{"version":3,"file":"separateEventsToInnerRows.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/separateEventsToInnerRows.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAU3D,eAAO,MAAM,yBAAyB,GAAI,CAAC,SAAS,gBAAgB,EAAE,QAAQ,CAAC,EAAE,KAAG,CAAC,EAAE,EA0BtF,CAAC"}

package/dist/src/components/custom/scheduler-new/presentation/logic/separateEventsToInnerRows.js

@@ -0,0 +1,32 @@
+const eventsCollide = (event1, event2) => {
+    const eventInsideOther = event1.startDate <= event2.startDate && event1.endDate >= event2.endDate;
+    const eventCollideStart = event1.endDate > event2.startDate && event1.endDate < event2.endDate;
+    const eventCollideEnd = event2.endDate > event1.startDate && event2.endDate < event1.endDate;
+    return eventInsideOther || eventCollideStart || eventCollideEnd;
+};
+// Function to separate events into non-colliding rows
+export const separateEventsToInnerRows = (events) => {
+    const sortedEvents = [...events].sort((a, b) => {
+        const aOrder = a.order ?? Number.MAX_SAFE_INTEGER;
+        const bOrder = b.order ?? Number.MAX_SAFE_INTEGER;
+        if (aOrder !== bOrder) {
+            return aOrder - bOrder; // Prioridad al order si ambos están definidos
+        }
+        return a.startDate.getTime() - b.startDate.getTime();
+    });
+    const rows = [];
+    for (const event of sortedEvents) {
+        let placed = false;
+        for (const row of rows) {
+            if (!row.some((existingEvent) => eventsCollide(existingEvent, event))) {
+                row.push(event);
+                placed = true;
+                break;
+            }
+        }
+        if (!placed) {
+            rows.push([event]);
+        }
+    }
+    return rows;
+};

package/dist/src/components/custom/scheduler-new/presentation/logic/sortByCategoryAndTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sortByCategoryAndTitle.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/sortByCategoryAndTitle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,eAAO,MAAM,sBAAsB,GAAI,CAAC,SAAS,WAAW,YACjD,CAAC,QACL,CAAC,mBACU,aAAa,CAAC,CAAC,CAAC,EAAE,WAgBnC,CAAA"}
+{"version":3,"file":"sortByCategoryAndTitle.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/custom/scheduler-new/presentation/logic/sortByCategoryAndTitle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,eAAO,MAAM,sBAAsB,GAAI,CAAC,SAAS,WAAW,EAC3D,UAAU,CAAC,EACX,MAAM,CAAC,EACP,iBAAiB,aAAa,CAAC,CAAC,CAAC,EAAE,WAgBnC,CAAA"}

package/dist/src/components/custom/scheduler-new/presentation/logic/sortByCategoryAndTitle.js

@@ -0,0 +1,12 @@
+export const sortByCategoryAndTitle = (previous, next, orderCategories) => {
+    for (const orderCategory of orderCategories) {
+        const prevOrder = previous[orderCategory];
+        const nextOrder = next[orderCategory];
+        if (prevOrder !== nextOrder) {
+            return prevOrder > nextOrder ? 1 : -1;
+        }
+    }
+    const prevTitle = previous["title"];
+    const nextTitle = next["title"];
+    return prevTitle > nextTitle ? 1 : -1;
+};

package/dist/src/components/custom/scheduler-new/presentation/state/ui/SchedulerState.d.ts

@@ -8,5 +8,6 @@ export interface SchedulerState {
 export type LineState = {
     left: number;
     width: number;
+    isDayBoundary?: boolean;
 };
 //# sourceMappingURL=SchedulerState.d.ts.map

package/dist/src/components/custom/scheduler-new/presentation/state/ui/SchedulerState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SchedulerState.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/custom/scheduler-new/presentation/state/ui/SchedulerState.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc;IAC9B,YAAY,EAAE,IAAI,CAAC;IACnB,KAAK,EAAE,OAAO,CAAC;IACf,eAAe,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACd,CAAA"}
+{"version":3,"file":"SchedulerState.d.ts","sourceRoot":"","sources":["../../../../../../../../src/components/custom/scheduler-new/presentation/state/ui/SchedulerState.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc;IAC9B,YAAY,EAAE,IAAI,CAAC;IACnB,KAAK,EAAE,OAAO,CAAC;IACf,eAAe,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,MAAM,SAAS,GAAG;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,CAAC;CACxB,CAAA"}

package/dist/src/components/custom/scheduler-new/presentation/state/ui/SchedulerState.js

@@ -0,0 +1 @@
+export {};

package/dist/src/components/custom/scheduler-new/presentation/state/ui/WeekRange.js

@@ -0,0 +1 @@
+export {};

package/dist/src/components/custom/scheduler-temporal/CwSchedulerComp2.js

@@ -0,0 +1,267 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import lodash from "lodash";
+import moment from "moment";
+import { Component } from "react";
+import { ResourcesTitleList } from "./components/resources_title_list/ResourcesTitleList";
+import { SchedulerContentArea } from "./components/scheduler_content_area/SchedulerContentArea";
+import { SchedulerHeader } from "./components/scheduler_header/SchedulerHeader";
+import { addMinutesToDateFromPx } from "./logic/dates/addMinutesToDateFromPx";
+import { daysBetweenTwoDates } from "./logic/dates/daysBetweenTwoDates";
+import { daysBetweenTwoDatesIncludingBoth } from "./logic/dates/daysBetweenTwoDatesWithoutCeil";
+import { getUtcToday } from "./logic/dates/getUtcToday";
+import { calculateDivisions } from "./logic/divisions/calculateDivisions";
+import { calculateDivisionType } from "./logic/divisions/calculateDivisionType";
+import { filterAndProcessResources } from "./logic/filtering/filterAndProcessResources";
+import { filterResources } from "./logic/filtering/filterResources";
+import { getEventWithSize } from "./logic/pixels/getPixelsForEvent";
+import { heightScheduler } from "./logic/pixels/heightScheduler";
+import { getEventsInInnerRows, getEventsOfResource } from "./logic/ui/getEventsOfResource";
+import { getTimeHeaders } from "./logic/ui/getTimeHeaders";
+export class CwScheduler2 extends Component {
+    contentArea;
+    constructor(Props) {
+        super(Props);
+        this.init(this.props);
+    }
+    resizeObserver;
+    calculateMaxPx = () => {
+        const mainElement = document.querySelector(".cw-scheduler-main-wrapper");
+        if (!mainElement)
+            return window.innerWidth - 402; // sidebar + first column + padding
+        const mainRect = mainElement.getBoundingClientRect();
+        return Math.floor(mainRect.width - 162); // first column + padding
+    };
+    init = (props) => {
+        const maxPx = this.calculateMaxPx();
+        const timeHeaders = getTimeHeaders(props.startDate, props.endDate);
+        const dayPx = maxPx / Math.floor(daysBetweenTwoDates(props.startDate, props.endDate));
+        const hourPx = dayPx / 24;
+        const minutePx = dayPx / 1440;
+        this.state = {
+            startDate: props.startDate,
+            endDate: props.endDate,
+            maxPx: maxPx,
+            dayPx: dayPx,
+            hourPx: hourPx,
+            minutePx: minutePx,
+            timeHeaders: timeHeaders,
+            eventHeight: 30,
+            events: props.events,
+            resources: props.resources,
+            top: 0,
+            bottom: 1000,
+            lineStyle: 0,
+            nowUtc: getUtcToday(),
+            division: 0,
+            divisionType: "",
+            pinnedResources: props.pinnedResources ? props.pinnedResources : [],
+            selectedEvents: [],
+            showConsoleLogs: false, // Change to false to not show the console.log(...)
+            groupByFunction: props.groupByFunction ?? false,
+        };
+    };
+    initOutside = (events, resources, _nextProps, startDate, endDate) => {
+        // const maxPx: number = (document.getElementById("root")?.clientWidth ?? window.innerWidth) - 150;
+        const maxPx = this.calculateMaxPx();
+        const timeHeaders = getTimeHeaders(startDate, endDate);
+        const days = Math.floor(daysBetweenTwoDates(startDate, endDate));
+        const dayPx = maxPx / days;
+        const hourPx = dayPx / 24;
+        const minutePx = dayPx / 1440;
+        const eventHeight = 30;
+        resources = filterResources(this.props.module, this.props.resourceName, this.props.resources, this.props.groupByFunction, endDate, startDate);
+        resources = resources.map((resource) => {
+            return {
+                ...resource,
+                events: getEventsOfResource(resource, events, this.state, this.props.id, this.props.module, startDate, endDate),
+            };
+        });
+        const groupByFunction = this.props.groupByFunction ?? false;
+        const now = getUtcToday();
+        const isInDateRange = now >= startDate && now <= endDate && this.contentArea !== undefined;
+        const lineStyle = isInDateRange ? daysBetweenTwoDatesIncludingBoth(startDate, now) * dayPx : 0;
+        this.setState({
+            startDate: startDate,
+            endDate: endDate,
+            maxPx: maxPx,
+            dayPx: dayPx,
+            hourPx: hourPx,
+            minutePx: minutePx,
+            timeHeaders: timeHeaders,
+            eventHeight: eventHeight,
+            events: [...events],
+            resources: [...resources],
+            top: 0,
+            bottom: 1000,
+            lineStyle: lineStyle,
+            nowUtc: now,
+            division: 0,
+            divisionType: "",
+            pinnedResources: this.props.pinnedResources ?? [],
+            groupByFunction: groupByFunction,
+        });
+    };
+    componentDidMount() {
+        const eventsCopy = [...this.props.events];
+        const filteredResources = filterAndProcessResources(this.props, this.state);
+        const divisions = calculateDivisions(this.state.startDate, this.state.endDate);
+        const divisionType = calculateDivisionType(this.state.startDate, this.state.endDate);
+        this.setState({
+            events: eventsCopy,
+            resources: filteredResources,
+            division: divisions,
+            divisionType: divisionType,
+        });
+        // Añadir ResizeObserver
+        const mainElement = document.querySelector(".cw-scheduler-main-wrapper");
+        if (mainElement) {
+            this.resizeObserver = new ResizeObserver(() => {
+                this.handleResize();
+            });
+            this.resizeObserver.observe(mainElement);
+        }
+        window?.addEventListener("resize", this.handleResize);
+    }
+    componentWillUnmount() {
+        if (this.resizeObserver) {
+            this.resizeObserver.disconnect();
+        }
+        window?.removeEventListener("resize", this.handleResize);
+    }
+    recalculateEventPositions = (events, dayPx, startDate) => {
+        return events.map(event => getEventWithSize(event, startDate, dayPx));
+    };
+    updateResourcesWithEvents = (resources, events) => {
+        return resources.map(resource => ({
+            ...resource,
+            events: events.filter(event => event.resourceId === resource.id)
+        }));
+    };
+    handleResize = () => {
+        const maxPx = this.calculateMaxPx();
+        const days = Math.floor(daysBetweenTwoDates(this.state.startDate, this.state.endDate));
+        const dayPx = maxPx / days;
+        const hourPx = dayPx / 24;
+        const minutePx = dayPx / 1440;
+        const recalculatedEvents = this.recalculateEventPositions(this.state.events, dayPx, this.state.startDate);
+        const updatedResources = this.updateResourcesWithEvents(this.state.resources, recalculatedEvents);
+        this.setState({
+            maxPx,
+            dayPx,
+            hourPx,
+            minutePx,
+            events: recalculatedEvents,
+            resources: updatedResources
+        });
+    };
+    componentWillReceiveProps(_nextProps) {
+        if (this.state.showConsoleLogs) {
+            console.log("Schedule - componentWillReceiveProps, start: ", moment(new Date()).toString());
+            console.log("Schedule - componentWillReceiveProps - has changes, start: ", moment(new Date()).toString());
+        }
+        const dateChange = _nextProps.startDate.toISOString() !== this.state.startDate.toISOString() ||
+            _nextProps.endDate.toISOString() !== this.state.endDate.toISOString();
+        if (document.getElementById("root") !== null) {
+            this.handleResize();
+        }
+        if (dateChange) {
+            const events = lodash.cloneDeep(this.props.events);
+            const resources = lodash.cloneDeep(this.props.resources);
+            this.initOutside(events, resources, _nextProps, _nextProps.startDate, _nextProps.endDate);
+            if (this.state.showConsoleLogs) {
+                console.log("Schedule - componentWillReceiveProps - print on schedule, end: ", moment(new Date()).toString());
+                console.log("Schedule - componentWillReceiveProps, end: ", moment(new Date()).toString());
+            }
+            return;
+        }
+        const mappedEvents = _nextProps.events
+            .map((event) => {
+            return getEventWithSize(event, _nextProps.startDate, this.state.dayPx);
+        })
+            .filter((event) => {
+            const outOfRange = event.end <= this.props.startDate || event.start >= this.props.endDate;
+            return !outOfRange;
+        });
+        const newResources = _nextProps.resources
+            .map((resource) => {
+            return {
+                ...resource,
+                events: mappedEvents.filter((event) => event.resourceId === resource.id),
+            };
+        })
+            .map((resource) => {
+            const tops = getEventsInInnerRows(resource, this.state, _nextProps.startDate);
+            const height = tops.length === 0 ? this.state.eventHeight : tops.length * this.state.eventHeight;
+            let flatMapEvents = [];
+            for (let h = 0; h < tops.length; h++) {
+                flatMapEvents = flatMapEvents.concat(tops[h]);
+            }
+            return {
+                ...resource,
+                maxTop: height,
+                events: flatMapEvents,
+            };
+        });
+        this.setState({
+            events: mappedEvents,
+            resources: newResources,
+        });
+    }
+    handleOnClickContextMenuResourceScheduler = (_clickEvent, _resource) => {
+        let datetime = new Date();
+        const _ca = this.contentArea;
+        if (_clickEvent.domEvent.currentTarget !== undefined) {
+            const leftPos = _clickEvent.domEvent.currentTarget.parentElement.getBoundingClientRect().left -
+                (_ca?.getBoundingClientRect()?.left ?? 0) -
+                window.scrollX;
+            datetime = addMinutesToDateFromPx(this.state.startDate, leftPos, this.state.minutePx);
+        }
+        if (this.props.scheduler_handleOnClickContextMenuResource) {
+            this.props.scheduler_handleOnClickContextMenuResource(datetime, _resource, _clickEvent.key, this.props.id);
+        }
+    };
+    handleOnClickResourceContextMenu = (_e, resource) => {
+        if (this.props.scheduler_handleOnClickResourceContextMenu) {
+            this.props.scheduler_handleOnClickResourceContextMenu(_e, resource);
+        }
+    };
+    handleCrewPinning = (resource, text) => {
+        if (this.props.scheduler_handlePinned) {
+            this.props.scheduler_handlePinned.call(this.props.parent, resource.id, text, this.props.id);
+        }
+    };
+    render() {
+        const isInDateRange = this.state.nowUtc >= this.state.startDate &&
+            this.state.nowUtc <= this.state.endDate &&
+            this.contentArea !== undefined;
+        const showTimeline = isInDateRange && this.state.lineStyle < this.state.maxPx;
+        const isPinnedTable = this.props.id.toLowerCase().includes("pinned");
+        const schedulerHeight = heightScheduler(this.state.resources, this.props.height, this.props.id === "crewAssignmentsScheduler");
+        const timeHeaders = this.state.timeHeaders;
+        const referenceDate = timeHeaders[0];
+        const divisions = 24 / calculateDivisions(timeHeaders[0], timeHeaders[timeHeaders.length - 1]);
+        const hoursPixels = timeHeaders
+            .filter((_, index) => {
+            return index != 0 && index % divisions == 0;
+        })
+            .map((date) => {
+            const daysDiff = daysBetweenTwoDatesIncludingBoth(date, referenceDate);
+            const pixels = daysDiff * 24 * this.state.hourPx;
+            return pixels;
+        });
+        return (_jsx("div", { id: this.props.id, style: {
+                overflowY: "auto",
+                maxHeight: isPinnedTable ? "auto" : schedulerHeight
+            }, className: this.state.resources.length > 0 ? "cwellt_tb_con" : "cwellt_tb_con cw_tb_con_emptyValues", children: _jsxs("table", { id: "cwelltTableScheduler", children: [this.props.id !== "crewAssignmentsScheduler" && (_jsx(SchedulerHeader, { timelineProps: {
+                            maxPx: this.state.maxPx,
+                            hoursList: this.state.timeHeaders,
+                            pxPerHour: this.state.hourPx,
+                            startDate: this.state.startDate,
+                            endDate: this.state.endDate,
+                            headerName: this.props.resourceName,
+                        }, descriptionColumn: this.props.descriptionColumn })), _jsx("tbody", { style: {
+                            overflow: "visible",
+                            width: this.state.maxPx + 150
+                        }, className: isPinnedTable ? "fc-body cw-fc-body-pinned" : "fc-body", children: _jsxs("tr", { className: "fc_body_row", children: [_jsx(ResourcesTitleList, { resources: this.state.resources, canBePinned: this.props.canBePinned ?? false, includesPinned: this.props.id.toLowerCase().includes("pinned"), onCrewPinning: this.handleCrewPinning, onClickResourceContextMenu: this.handleOnClickResourceContextMenu, ResourceTitleComponent: this.props.resourceComp }), _jsx("td", { className: "dividerArea" }), _jsx(SchedulerContentArea, { now: this.state.nowUtc, showTimeline: showTimeline, timeSeparatorLeftPx: hoursPixels, timeLineLeftPx: this.state.lineStyle, resources: this.state.resources, contextMenuContents: this.props.resourceContextMenuContents, scheduler: this, onEmptyClick: this.props.scheduler_handleEmptyClick, setContentArea: (n) => (this.contentArea = n), onClickContextMenu: this.handleOnClickContextMenuResourceScheduler })] }) })] }) }));
+    }
+}