@@ -49,9 +49,7 @@ export class CalendarPropsBuilder {
4949 toolbar
5050 } ,
5151 defaultView : this . defaultView ,
52- messages : {
53- work_week : workWeekCaption
54- } ,
52+ messages : this . buildMessages ( workWeekCaption ) ,
5553 events : this . events ,
5654 formats,
5755 localizer,
@@ -71,6 +69,27 @@ export class CalendarPropsBuilder {
7169 } ;
7270 }
7371
72+ private buildMessages ( workWeekCaption : string ) : {
73+ work_week : string ;
74+ allDay ?: string ;
75+ date ?: string ;
76+ time ?: string ;
77+ event ?: string ;
78+ } {
79+ if ( this . isCustomView && this . toolbarItems && this . toolbarItems . length > 0 ) {
80+ const byType = new Map ( this . toolbarItems . map ( i => [ i . itemType , i ] ) ) ;
81+ const agenda = byType . get ( "agenda" ) ;
82+ return {
83+ work_week : workWeekCaption ,
84+ ...( agenda ?. customViewAllDayText ? { allDay : agenda . customViewAllDayText } : { } ) ,
85+ ...( agenda ?. customViewTextHeaderDate ? { date : agenda . customViewTextHeaderDate } : { } ) ,
86+ ...( agenda ?. customViewTextHeaderTime ? { time : agenda . customViewTextHeaderTime } : { } ) ,
87+ ...( agenda ?. customViewTextHeaderEvent ? { event : agenda . customViewTextHeaderEvent } : { } )
88+ } as const ;
89+ }
90+ return { work_week : workWeekCaption } as const ;
91+ }
92+
7493 private buildEvents ( items : ObjectItem [ ] ) : CalendarEvent [ ] {
7594 return items . map ( item => {
7695 return this . buildEventItem ( item ) ;
@@ -127,11 +146,6 @@ export class CalendarPropsBuilder {
127146 ) => `${ formatWith ( start , loc ) } – ${ formatWith ( end , loc ) } ` ;
128147 }
129148
130- // Ensure showEventDate=false always hides event time ranges
131- if ( this . props . showEventDate ?. value === false ) {
132- formats . eventTimeRangeFormat = ( ) => "" ;
133- }
134-
135149 const titlePattern = this . props . topBarDateFormat ?. value ?. trim ( ) ;
136150 if ( titlePattern ) {
137151 formats . dayHeaderFormat = ( date : Date , _culture : string , loc : DateLocalizer ) =>
@@ -150,6 +164,80 @@ export class CalendarPropsBuilder {
150164 ) => `${ loc . format ( start , titlePattern ) } – ${ loc . format ( end , titlePattern ) } ` ;
151165 }
152166
167+ // Apply per-view custom formats only in custom view mode
168+ if ( this . isCustomView && this . toolbarItems && this . toolbarItems . length > 0 ) {
169+ const byType = new Map ( this . toolbarItems . map ( i => [ i . itemType , i ] ) ) ;
170+
171+ type HeaderFormat = Formats [ "dayHeaderFormat" ] ;
172+ const applyHeader = ( pattern ?: string , existing ?: HeaderFormat ) : HeaderFormat | undefined => {
173+ if ( ! pattern ) return existing ;
174+ return ( date : Date , _culture : string , loc : DateLocalizer ) => loc . format ( date , pattern ) ;
175+ } ;
176+
177+ const dayHeaderPattern = byType . get ( "day" ) ?. customViewHeaderDayFormat || this . props . topBarDateFormat ?. value ;
178+ const weekHeaderPattern =
179+ byType . get ( "week" ) ?. customViewHeaderDayFormat ||
180+ byType . get ( "work_week" ) ?. customViewHeaderDayFormat ||
181+ this . props . topBarDateFormat ?. value ;
182+ const monthHeaderPattern =
183+ byType . get ( "month" ) ?. customViewHeaderDayFormat || this . props . topBarDateFormat ?. value ;
184+ const agendaHeaderPattern =
185+ byType . get ( "agenda" ) ?. customViewHeaderDayFormat || this . props . topBarDateFormat ?. value ;
186+
187+ formats . dayHeaderFormat = applyHeader ( dayHeaderPattern , formats . dayHeaderFormat ) ;
188+ formats . dayRangeHeaderFormat = (
189+ range : { start : Date ; end : Date } ,
190+ _culture : string ,
191+ loc : DateLocalizer
192+ ) => {
193+ const pattern = weekHeaderPattern ;
194+ if ( pattern ) {
195+ return `${ loc . format ( range . start , pattern ) } – ${ loc . format ( range . end , pattern ) } ` ;
196+ }
197+ return `${ loc . format ( range . start , "P" ) } – ${ loc . format ( range . end , "P" ) } ` ;
198+ } ;
199+ formats . monthHeaderFormat = applyHeader ( monthHeaderPattern , formats . monthHeaderFormat ) ;
200+ formats . agendaHeaderFormat = ( range : { start : Date ; end : Date } , _culture : string , loc : DateLocalizer ) => {
201+ const pattern = agendaHeaderPattern ;
202+ if ( pattern ) {
203+ return `${ loc . format ( range . start , pattern ) } – ${ loc . format ( range . end , pattern ) } ` ;
204+ }
205+ return `${ loc . format ( range . start , "P" ) } – ${ loc . format ( range . end , "P" ) } ` ;
206+ } ;
207+
208+ // Month day numbers
209+ const monthCellDate = byType . get ( "month" ) ?. customViewCellDateFormat ;
210+ if ( monthCellDate ) {
211+ formats . dateFormat = ( date : Date , _culture : string , loc : DateLocalizer ) =>
212+ loc . format ( date , monthCellDate ) ;
213+ }
214+
215+ // Time gutters
216+ const weekTimeGutter = byType . get ( "week" ) ?. customViewGutterTimeFormat ;
217+ const dayTimeGutter = byType . get ( "day" ) ?. customViewGutterTimeFormat ;
218+ const workWeekTimeGutter = byType . get ( "work_week" ) ?. customViewGutterTimeFormat ;
219+ const chosenTimeGutter = weekTimeGutter || dayTimeGutter || workWeekTimeGutter ;
220+ if ( chosenTimeGutter ) {
221+ formats . timeGutterFormat = ( date : Date , _culture : string , loc : DateLocalizer ) =>
222+ loc . format ( date , chosenTimeGutter ) ;
223+ }
224+ const agendaTime = byType . get ( "agenda" ) ?. customViewGutterTimeFormat ;
225+ if ( agendaTime ) {
226+ formats . agendaTimeFormat = ( date : Date , _culture : string , loc : DateLocalizer ) =>
227+ loc . format ( date , agendaTime ) ;
228+ }
229+ const agendaDate = byType . get ( "agenda" ) ?. customViewGutterDateFormat ;
230+ if ( agendaDate ) {
231+ formats . agendaDateFormat = ( date : Date , _culture : string , loc : DateLocalizer ) =>
232+ loc . format ( date , agendaDate ) ;
233+ }
234+ }
235+
236+ // Ensure showEventDate=false always hides event time ranges
237+ if ( this . props . showEventDate ?. value === false ) {
238+ formats . eventTimeRangeFormat = ( ) => "" ;
239+ }
240+
153241 return formats ;
154242 }
155243
@@ -226,7 +314,15 @@ export class CalendarPropsBuilder {
226314 position : i . position ,
227315 caption : i . caption ?. value ,
228316 tooltip : i . tooltip ?. value ,
229- renderMode : i . renderMode
317+ renderMode : i . renderMode ,
318+ customViewHeaderDayFormat : i . customViewHeaderDayFormat ?. value ,
319+ customViewCellDateFormat : i . customViewCellDateFormat ?. value ,
320+ customViewGutterTimeFormat : i . customViewGutterTimeFormat ?. value ,
321+ customViewGutterDateFormat : i . customViewGutterDateFormat ?. value ,
322+ customViewAllDayText : i . customViewAllDayText ?. value ,
323+ customViewTextHeaderDate : i . customViewTextHeaderDate ?. value ,
324+ customViewTextHeaderTime : i . customViewTextHeaderTime ?. value ,
325+ customViewTextHeaderEvent : i . customViewTextHeaderEvent ?. value
230326 } ) ) ;
231327 }
232328}
0 commit comments