diff --git a/docs/data/date-pickers/custom-components/CalendarHeaderComponent.js b/docs/data/date-pickers/custom-components/CalendarHeaderComponent.js
index 03a95b9668921..a0ae22cc0f413 100644
--- a/docs/data/date-pickers/custom-components/CalendarHeaderComponent.js
+++ b/docs/data/date-pickers/custom-components/CalendarHeaderComponent.js
@@ -22,12 +22,10 @@ const CustomCalendarHeaderRoot = styled('div')({
 function CustomCalendarHeader(props) {
   const { currentMonth, onMonthChange } = props;
 
-  const selectNextMonth = () => onMonthChange(currentMonth.add(1, 'month'), 'left');
-  const selectNextYear = () => onMonthChange(currentMonth.add(1, 'year'), 'left');
-  const selectPreviousMonth = () =>
-    onMonthChange(currentMonth.subtract(1, 'month'), 'right');
-  const selectPreviousYear = () =>
-    onMonthChange(currentMonth.subtract(1, 'year'), 'right');
+  const selectNextMonth = () => onMonthChange(currentMonth.add(1, 'month'));
+  const selectNextYear = () => onMonthChange(currentMonth.add(1, 'year'));
+  const selectPreviousMonth = () => onMonthChange(currentMonth.subtract(1, 'month'));
+  const selectPreviousYear = () => onMonthChange(currentMonth.subtract(1, 'year'));
 
   return (
     <CustomCalendarHeaderRoot>
diff --git a/docs/data/date-pickers/custom-components/CalendarHeaderComponent.tsx b/docs/data/date-pickers/custom-components/CalendarHeaderComponent.tsx
index 1485aff154fc9..96971187e7436 100644
--- a/docs/data/date-pickers/custom-components/CalendarHeaderComponent.tsx
+++ b/docs/data/date-pickers/custom-components/CalendarHeaderComponent.tsx
@@ -23,12 +23,10 @@ const CustomCalendarHeaderRoot = styled('div')({
 function CustomCalendarHeader(props: PickersCalendarHeaderProps) {
   const { currentMonth, onMonthChange } = props;
 
-  const selectNextMonth = () => onMonthChange(currentMonth.add(1, 'month'), 'left');
-  const selectNextYear = () => onMonthChange(currentMonth.add(1, 'year'), 'left');
-  const selectPreviousMonth = () =>
-    onMonthChange(currentMonth.subtract(1, 'month'), 'right');
-  const selectPreviousYear = () =>
-    onMonthChange(currentMonth.subtract(1, 'year'), 'right');
+  const selectNextMonth = () => onMonthChange(currentMonth.add(1, 'month'));
+  const selectNextYear = () => onMonthChange(currentMonth.add(1, 'year'));
+  const selectPreviousMonth = () => onMonthChange(currentMonth.subtract(1, 'month'));
+  const selectPreviousYear = () => onMonthChange(currentMonth.subtract(1, 'year'));
 
   return (
     <CustomCalendarHeaderRoot>
diff --git a/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.js b/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.js
index 77e1ef974b777..74487eac20c2f 100644
--- a/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.js
+++ b/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.js
@@ -19,10 +19,9 @@ const CustomCalendarHeaderRoot = styled('div')({
 function CustomCalendarHeader(props) {
   const { currentMonth, onMonthChange, month, calendars, monthIndex } = props;
 
-  const selectNextMonth = () =>
-    onMonthChange(currentMonth.add(calendars, 'month'), 'left');
+  const selectNextMonth = () => onMonthChange(currentMonth.add(calendars, 'month'));
   const selectPreviousMonth = () =>
-    onMonthChange(currentMonth.subtract(calendars, 'month'), 'right');
+    onMonthChange(currentMonth.subtract(calendars, 'month'));
 
   return (
     <CustomCalendarHeaderRoot>
diff --git a/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.tsx b/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.tsx
index 5d94074bf0ca2..f4ba605d4445a 100644
--- a/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.tsx
+++ b/docs/data/date-pickers/custom-components/CalendarHeaderComponentRange.tsx
@@ -20,10 +20,9 @@ const CustomCalendarHeaderRoot = styled('div')({
 function CustomCalendarHeader(props: PickersRangeCalendarHeaderProps) {
   const { currentMonth, onMonthChange, month, calendars, monthIndex } = props;
 
-  const selectNextMonth = () =>
-    onMonthChange(currentMonth.add(calendars, 'month'), 'left');
+  const selectNextMonth = () => onMonthChange(currentMonth.add(calendars, 'month'));
   const selectPreviousMonth = () =>
-    onMonthChange(currentMonth.subtract(calendars, 'month'), 'right');
+    onMonthChange(currentMonth.subtract(calendars, 'month'));
 
   return (
     <CustomCalendarHeaderRoot>