Add prop to render elements after calendar (mui#1795)

This allows us to render anything after the calendar (buttons, text…) by passing the renderCalendarInfo props to DateRangePicker.
BureauxLocaux · Jun 26, 2020 · 2aef2d2 · 2aef2d2
1 parent 757384e
commit 2aef2d2
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/lib/src/DateRangePicker/DateRangePickerViewDesktop.tsx b/lib/src/DateRangePicker/DateRangePickerViewDesktop.tsx
@@ -25,6 +25,7 @@ export interface ExportedDesktopDateRangeCalendarProps {
    * @default 2
    */
   calendars?: 1 | 2 | 3;
+  renderCalendarInfo?: React.ReactNode;
 }
 
 interface DesktopDateRangeCalendarProps
@@ -93,6 +94,7 @@ export const DateRangePickerViewDesktop: React.FC<DesktopDateRangeCalendarProps>
   maxDate: __maxDate,
   currentlySelectingRangeEnd,
   currentMonth,
+  renderCalendarInfo,
   ...other
 }) => {
   const utils = useUtils();
@@ -188,6 +190,7 @@ export const DateRangePickerViewDesktop: React.FC<DesktopDateRangeCalendarProps>
                 />
               )}
             />
+            {renderCalendarInfo}
           </div>
         );
       })}

diff --git a/lib/src/DateRangePicker/DateRangePickerViewMobile.tsx b/lib/src/DateRangePicker/DateRangePickerViewMobile.tsx
@@ -14,7 +14,9 @@ import {
   DateValidationProps,
 } from '../_helpers/date-utils';
 
-export interface ExportedMobileDateRangeCalendarProps {}
+export interface ExportedMobileDateRangeCalendarProps {
+  renderCalendarInfo?: React.ReactNode;
+}
 
 interface DesktopDateRangeCalendarProps
   extends ExportedMobileDateRangeCalendarProps,
@@ -39,6 +41,7 @@ export const DateRangePickerViewMobile: React.FC<DesktopDateRangeCalendarProps>
   rightArrowButtonProps,
   rightArrowButtonText,
   rightArrowIcon,
+  renderCalendarInfo,
   ...other
 }) => {
   const utils = useUtils();
@@ -79,6 +82,7 @@ export const DateRangePickerViewMobile: React.FC<DesktopDateRangeCalendarProps>
           />
         )}
       />
+      {renderCalendarInfo}
     </>
   );
 };
diff --git a/lib/src/wrappers/Wrapper.tsx b/lib/src/wrappers/Wrapper.tsx
@@ -4,6 +4,7 @@ import { MobileWrapper, MobileWrapperProps } from './MobileWrapper';
 import { DesktopWrapper, DesktopWrapperProps } from './DesktopWrapper';
 import { ResponsiveWrapper, ResponsiveWrapperProps } from './ResponsiveWrapper';
 import { DesktopPopperWrapper, DesktopPopperWrapperProps } from './DesktopPopperWrapper';
+import { PropTypes } from '@material-ui/core';
 
 export type DateInputPropsLike<TInputValue, TDateValue> = Omit<
   DateInputProps<TInputValue, TDateValue>,