diff --git a/README.md b/README.md
index 3da4049..204a4a6 100644
--- a/README.md
+++ b/README.md
@@ -60,6 +60,7 @@ Inspired by [FullCalendar](https://fullcalendar.io/), implements similar options
- [filterResourcesWithEvents](#filterresourceswithevents)
- [firstDay](#firstday)
- [flexibleSlotTimeLimits](#flexibleslottimelimits)
+ - [gridDayFormat](#griddayformat)
- [headerToolbar](#headertoolbar)
- [height](#height)
- [hiddenDays](#hiddendays)
@@ -1392,6 +1393,29 @@ The function must return `true` to have this event counted, or `false` to ignore
+### gridDayFormat
+- Type `object` or `function`
+- Default `{day: 'numeric'}`
+
+Defines the day-text that is displayed on the grid view.
+
+This value can be either an object with options for the native JavaScript [Intl.DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat) object, or a callback function that returns formatted string:
+
+```js
+function (date) {
+ // return formatted date string
+}
+```
+
+
+
+
+`date`
+ |
+JavaScript Date object that needs to be formatted |
+
+
+
### headerToolbar
- Type `object`
- Default `{start: 'title', center: '', end: 'today prev,next'}`
diff --git a/packages/day-grid/src/Day.svelte b/packages/day-grid/src/Day.svelte
index e6d47c6..3415aed 100644
--- a/packages/day-grid/src/Day.svelte
+++ b/packages/day-grid/src/Day.svelte
@@ -12,7 +12,7 @@
export let iChunks = [];
let {date: currentDate, dayMaxEvents, highlightedDates, moreLinkContent, theme,
- _hiddenEvents, _popupDate, _popupChunks, _interaction, _queue} = getContext('state');
+ _hiddenEvents, _intlGridDayFormat, _popupDate, _popupChunks, _interaction, _queue} = getContext('state');
let el;
let dayChunks;
@@ -111,7 +111,7 @@
on:pointerleave={$_interaction.pointer?.leave}
on:pointerdown={$_interaction.action?.select}
>
- {date.getUTCDate()}
+ {$_intlGridDayFormat.format(date)}
{#if iChunks[1] && datesEqual(iChunks[1].date, date)}
diff --git a/packages/day-grid/src/index.js b/packages/day-grid/src/index.js
index 80d0c21..ab977ca 100644
--- a/packages/day-grid/src/index.js
+++ b/packages/day-grid/src/index.js
@@ -11,6 +11,7 @@ export default {
// Common options
options.buttonText.dayGridMonth = 'month';
options.buttonText.close = 'Close';
+ options.gridDayFormat = {day: 'numeric'};
options.theme.uniform = 'ec-uniform';
options.theme.dayFoot = 'ec-day-foot';
options.theme.popup = 'ec-popup';
@@ -29,6 +30,7 @@ export default {
createStores(state) {
state._days = days(state);
state._intlDayPopover = intl(state.locale, state.dayPopoverFormat);
+ state._intlGridDayFormat = intl(state.locale, state.gridDayFormat);
state._hiddenEvents = writable({});
state._popupDate = writable(null);
state._popupChunks = writable([]);