Disable today button if today's date cannot be chosen

packages/datetime/src/common/classes.ts

@@ -34,6 +34,7 @@ export const DATEPICKER_DAY_IS_TODAY = `${DATEPICKER_DAY}--isToday`;
 export const DATEPICKER_DAY_WRAPPER = `${DATEPICKER}-day-wrapper`;
 export const DATEPICKER_FOOTER = `${DATEPICKER}-footer`;
 export const DATEPICKER_MONTH_SELECT = `${DATEPICKER}-month-select`;
+export const DATEPICKER_TODAY_BUTTON_DISABLED = `${NS}-disabled`;
 export const DATEPICKER_YEAR_SELECT = `${DATEPICKER}-year-select`;
 export const DATEPICKER_NAVBAR = `${DATEPICKER}-navbar`;
 export const DATEPICKER_NAVBUTTON = `DayPicker-NavButton`;

packages/datetime/src/datePicker.tsx

@@ -262,11 +262,17 @@ export class DatePicker extends AbstractPureComponent2<DatePickerProps, IDatePic
     );
 
     private renderOptionsBar() {
-        const { clearButtonText, todayButtonText } = this.props;
+        const { clearButtonText, todayButtonText, minDate, maxDate } = this.props;
+        const todayEnabled = isTodayEnabled(minDate, maxDate);
         return [
             <Divider key="div" />,
             <div className={Classes.DATEPICKER_FOOTER} key="footer">
-                <Button minimal={true} onClick={this.handleTodayClick} text={todayButtonText} />
+                <Button
+                    minimal={true}
+                    disabled={!todayEnabled}
+                    onClick={this.handleTodayClick}
+                    text={todayButtonText}
+                />
                 <Button minimal={true} onClick={this.handleClearClick} text={clearButtonText} />
             </div>,
         ];
@@ -458,3 +464,8 @@ function getInitialMonth(props: DatePickerProps, value: Date | null): Date {
         return DateUtils.getDateBetween([props.minDate, props.maxDate]);
     }
 }
+
+function isTodayEnabled(minDate: Date, maxDate: Date): boolean {
+    const today = new Date();
+    return DateUtils.isDayInRange(today, [minDate, maxDate]);
+}

packages/datetime/test/datePickerTests.tsx

@@ -314,6 +314,43 @@ describe("<DatePicker>", () => {
             });
         });
 
+        describe("today button validation", () => {
+            const today = new Date();
+            const MIN_DATE_BEFORE_TODAY = MIN_DATE;
+            const MAX_DATE_BEFORE_TODAY = MAX_DATE;
+
+            const MIN_DATE_AFTER_TODAY = new Date(today.getFullYear() + 1, today.getMonth(), today.getDate());
+            const MAX_DATE_AFTER_TODAY = new Date(today.getFullYear() + 2, today.getMonth(), today.getDate());
+
+            it("min/max before today has disabled button", () => {
+                const { getTodayButton } = wrap(
+                    <DatePicker
+                        minDate={MIN_DATE_BEFORE_TODAY}
+                        maxDate={MAX_DATE_BEFORE_TODAY}
+                        showActionsBar={true}
+                    />,
+                );
+
+                assert.isTrue(getTodayButton().props().disabled);
+            });
+
+            it("min/max after today has disabled button", () => {
+                const { getTodayButton } = wrap(
+                    <DatePicker minDate={MIN_DATE_AFTER_TODAY} maxDate={MAX_DATE_AFTER_TODAY} showActionsBar={true} />,
+                );
+
+                assert.isTrue(getTodayButton().props().disabled);
+            });
+
+            it("valid min/max today has enabled button", () => {
+                const { getTodayButton } = wrap(
+                    <DatePicker minDate={MIN_DATE_BEFORE_TODAY} maxDate={MAX_DATE_AFTER_TODAY} showActionsBar={true} />,
+                );
+
+                assert.isFalse(getTodayButton().props().disabled);
+            });
+        });
+
         it("only days outside bounds have disabled class", () => {
             const minDate = new Date(2000, Months.JANUARY, 10);
             const { getDay } = wrap(<DatePicker initialMonth={minDate} minDate={minDate} />);
@@ -724,6 +761,7 @@ describe("<DatePicker>", () => {
                 wrapper
                     .find(`.${Classes.DATEPICKER_DAY}`)
                     .filterWhere(day => day.text() === "" + dayNumber && !day.hasClass(Classes.DATEPICKER_DAY_OUTSIDE)),
+            getTodayButton: () => wrapper.find(`.${Classes.DATEPICKER_FOOTER}`).find(Button).first(),
             months: wrapper.find(HTMLSelect).filter({ className: Classes.DATEPICKER_MONTH_SELECT }).find("select"),
             root: wrapper,
             setTimeInput: (precision: TimePrecision | "hour", value: number) =>