diff --git a/packages/pluggableWidgets/calendar-web/CHANGELOG.md b/packages/pluggableWidgets/calendar-web/CHANGELOG.md
index 4bd6ccc4ac..a2538870ad 100644
--- a/packages/pluggableWidgets/calendar-web/CHANGELOG.md
+++ b/packages/pluggableWidgets/calendar-web/CHANGELOG.md
@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
## [Unreleased]
+### Fixed
+
+- Improved handling of the start date attribute to ensure correct calendar initialization.
+
## [2.3.0] - 2026-02-17
### Added
diff --git a/packages/pluggableWidgets/calendar-web/src/Calendar.tsx b/packages/pluggableWidgets/calendar-web/src/Calendar.tsx
index a7d8d31d52..e245ee7b34 100644
--- a/packages/pluggableWidgets/calendar-web/src/Calendar.tsx
+++ b/packages/pluggableWidgets/calendar-web/src/Calendar.tsx
@@ -8,7 +8,7 @@ import "./ui/Calendar.scss";
import { useCalendarEvents } from "./helpers/useCalendarEvents";
import { useLocalizer } from "./helpers/useLocalizer";
-export default function MxCalendar(props: CalendarContainerProps): ReactElement {
+export default function MxCalendar(props: CalendarContainerProps): ReactElement | null {
// useMemo with empty dependency array is used
// because style and calendar controller needs to be created only once
// and not on every re-render
@@ -26,6 +26,11 @@ export default function MxCalendar(props: CalendarContainerProps): ReactElement
}, [props, calendarController, localizer, culture]);
const calendarEvents = useCalendarEvents(props);
+
+ if (props.startDateAttribute && props.startDateAttribute.status !== "available") {
+ return null;
+ }
+
return (
diff --git a/packages/pluggableWidgets/calendar-web/src/Calendar.xml b/packages/pluggableWidgets/calendar-web/src/Calendar.xml
index 0af2436b56..24df8a40ed 100644
--- a/packages/pluggableWidgets/calendar-web/src/Calendar.xml
+++ b/packages/pluggableWidgets/calendar-web/src/Calendar.xml
@@ -62,9 +62,9 @@
-
+
Start date attribute
- The start date that should be shown in the view
+ The DateTime attribute used on initial load
diff --git a/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts b/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts
index 6d3c119b8e..d6176e11a6 100644
--- a/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts
+++ b/packages/pluggableWidgets/calendar-web/src/helpers/CalendarPropsBuilder.ts
@@ -16,6 +16,7 @@ export class CalendarPropsBuilder {
private toolbarItems?: ResolvedToolbarItem[];
private step: number;
private timeSlots: number;
+ private defaultDate?: Date;
constructor(private props: CalendarContainerProps) {
this.isCustomView = props.view === "custom";
@@ -36,6 +37,7 @@ export class CalendarPropsBuilder {
`[Calendar] timeslots value ${props.timeslots} was clamped to ${this.timeSlots}. Must be between 1 and 4.`
);
}
+ this.defaultDate = props.startDateAttribute?.value;
}
updateProps(props: CalendarContainerProps): void {
@@ -43,6 +45,7 @@ export class CalendarPropsBuilder {
this.props = props;
this.events = this.buildEvents(props.databaseDataSource?.items ?? []);
this.toolbarItems = this.buildToolbarItems();
+ this.defaultDate = props.startDateAttribute?.value;
}
build(localizer: DateLocalizer, culture: string): DragAndDropCalendarProps {
@@ -86,7 +89,8 @@ export class CalendarPropsBuilder {
min: this.minTime,
max: this.maxTime,
step: this.step,
- timeslots: this.timeSlots
+ timeslots: this.timeSlots,
+ ...(this.defaultDate ? { defaultDate: this.defaultDate } : {})
};
}
diff --git a/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts b/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts
index b0a1628d5e..644e2f5a08 100644
--- a/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts
+++ b/packages/pluggableWidgets/calendar-web/typings/CalendarProps.d.ts
@@ -4,7 +4,7 @@
* @author Mendix Widgets Framework Team
*/
import { CSSProperties } from "react";
-import { ActionValue, DynamicValue, ListValue, Option, ListActionValue, ListAttributeValue, ListExpressionValue } from "mendix";
+import { ActionValue, DynamicValue, EditableValue, ListValue, Option, ListActionValue, ListAttributeValue, ListExpressionValue } from "mendix";
export type TitleTypeEnum = "attribute" | "expression";
@@ -79,7 +79,7 @@ export interface CalendarContainerProps {
startAttribute?: ListAttributeValue;
endAttribute?: ListAttributeValue;
eventColor?: ListAttributeValue;
- startDateAttribute?: ListAttributeValue;
+ startDateAttribute?: EditableValue;
editable: DynamicValue;
view: ViewEnum;
defaultViewStandard: DefaultViewStandardEnum;