@transferwise/components 46.156.0 → 46.157.0

package/build/Calendar/DayCalendar/Table/DayCalendarTable.js

@@ -7,9 +7,11 @@ var React = require('react');
 var injectIntl = require('../../../common/injectIntl.js');
 var getDayNames = require('../../../common/DateUtils/getDayNames/getDayNames.js');
 var isWithinRange = require('../../../common/DateUtils/isWithinRange/isWithinRange.js');
+var isDateDisabled = require('../../_helpers/isDateDisabled/isDateDisabled.js');
+var Calendar_constants = require('../../Calendar.constants.js');
 var GetFocusableTime = require('../../GetFocusableTime/GetFocusableTime.js');
 var GetStartOfDay = require('../../GetStartOfDay/GetStartOfDay.js');
-var TableLink = require('../../tableLink/TableLink.js');
+var TableLink = require('../../TableLink/TableLink.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 const SHORT_DAY_FORMAT = {
@@ -62,7 +64,15 @@ let DayCalendarTable$1 = class DayCalendarTable extends React.PureComponent {
     } = this.props;
     onSelect(new Date(viewYear, viewMonth, day));
   };
-  isDisabled = day => {
+  focusDay = day => {
+    const {
+      viewMonth,
+      viewYear,
+      onDayFocus
+    } = this.props;
+    onDayFocus?.(new Date(viewYear, viewMonth, day));
+  };
+  isOutOfRange = day => {
     if (day < 0) {
       return true;
     }
@@ -75,6 +85,19 @@ let DayCalendarTable$1 = class DayCalendarTable extends React.PureComponent {
     const date = new Date(viewYear, viewMonth, day);
     return !isWithinRange.isWithinRange(date, min, max);
   };
+  isDisabled = day => {
+    if (day < 0) {
+      return false;
+    }
+    const {
+      viewMonth,
+      viewYear,
+      disabledRules
+    } = this.props;
+    const date = new Date(viewYear, viewMonth, day);
+    return isDateDisabled.isDateDisabled(date, disabledRules);
+  };
+  isUnavailable = day => this.isOutOfRange(day) || this.isDisabled(day);
   isActive = day => {
     const {
       selectedDate,
@@ -83,6 +106,14 @@ let DayCalendarTable$1 = class DayCalendarTable extends React.PureComponent {
     } = this.props;
     return !!(selectedDate && Number(new Date(viewYear, viewMonth, day)) === Number(selectedDate));
   };
+  isFocused = day => {
+    const {
+      focusedDate,
+      viewMonth,
+      viewYear
+    } = this.props;
+    return !!(focusedDate && Number(new Date(viewYear, viewMonth, day)) === Number(focusedDate));
+  };
   isToday = day => {
     const {
       viewMonth,
@@ -93,9 +124,9 @@ let DayCalendarTable$1 = class DayCalendarTable extends React.PureComponent {
   getAutofocusDay = weeks => {
     const days = weeks.flatMap(week => week);
     return GetFocusableTime.getFocusableTime({
-      isActive: this.isActive,
+      isActive: this.isFocused,
       isNow: this.isToday,
-      isDisabled: this.isDisabled,
+      isDisabled: this.isUnavailable,
       timeSpan: days
     });
   };
@@ -103,7 +134,9 @@ let DayCalendarTable$1 = class DayCalendarTable extends React.PureComponent {
     const {
       viewMonth,
       viewYear,
-      intl
+      intl,
+      disabledReasonId,
+      announceReasonOnFocus
     } = this.props;
     const weeks = this.getTableStructure();
     const autoFocusDay = this.getAutofocusDay(weeks);
@@ -130,20 +163,28 @@ let DayCalendarTable$1 = class DayCalendarTable extends React.PureComponent {
         })
       }), /*#__PURE__*/jsxRuntime.jsx("tbody", {
         children: weeks.map((week, weekIndex) => /*#__PURE__*/jsxRuntime.jsx("tr", {
-          children: week.map((day, dayIndex) => /*#__PURE__*/jsxRuntime.jsx("td", {
-            className: dayIndex > 4 ? 'weekend' : '',
-            children: day !== -1 && /*#__PURE__*/jsxRuntime.jsx(TableLink.default, {
-              item: day,
-              type: "day",
-              title: formatting.formatDate(new Date(viewYear, viewMonth, day), intl.locale, SHORT_DAY_FORMAT),
-              autofocus: day === autoFocusDay,
-              longTitle: formatting.formatDate(new Date(viewYear, viewMonth, day), intl.locale),
-              active: this.isActive(day),
-              disabled: this.isDisabled(day),
-              today: this.isToday(day),
-              onClick: this.selectDay
-            })
-          }, dayIndex))
+          children: week.map((day, dayIndex) => {
+            const dayOutOfRange = this.isOutOfRange(day);
+            const dayDisabled = this.isDisabled(day);
+            return /*#__PURE__*/jsxRuntime.jsx("td", {
+              className: dayIndex > 4 ? 'weekend' : '',
+              children: day !== -1 && /*#__PURE__*/jsxRuntime.jsx(TableLink.default, {
+                item: day,
+                type: "day",
+                title: formatting.formatDate(new Date(viewYear, viewMonth, day), intl.locale, SHORT_DAY_FORMAT),
+                autofocus: day === autoFocusDay,
+                longTitle: formatting.formatDate(new Date(viewYear, viewMonth, day), intl.locale, Calendar_constants.LONG_DAY_FORMAT),
+                active: this.isActive(day),
+                outOfRange: dayOutOfRange,
+                disabled: dayDisabled,
+                today: this.isToday(day),
+                disabledReasonId: disabledReasonId,
+                announceReasonOnFocus: announceReasonOnFocus,
+                onClick: this.selectDay,
+                onFocus: this.focusDay
+              })
+            }, dayIndex);
+          })
         }, weekIndex))
       })]
     });

package/build/Calendar/DayCalendar/Table/DayCalendarTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DayCalendarTable.js","sources":["../../../../src/Calendar/DayCalendar/Table/DayCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../../common/injectIntl';\n\nimport { getDayNames, isWithinRange } from '../../../common/DateUtils';\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport { getStartOfDay } from '../../GetStartOfDay';\nimport TableLink from '../../tableLink';\n\nconst SHORT_DAY_FORMAT: Intl.DateTimeFormatOptions = { day: 'numeric' };\n\ninterface DayCalendarTableProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewMonth: number;\n  viewYear: number;\n  onSelect: (date: Date) => void;\n}\n\nclass DayCalendarTable extends PureComponent<DayCalendarTableProps> {\n  getTableStructure = () => {\n    const { viewMonth, viewYear } = this.props;\n    let firstDayOfMonth = new Date(viewYear, viewMonth, 1).getDay();\n    // JS Sunday is 0, we're setting it last\n    if (firstDayOfMonth === 0) {\n      firstDayOfMonth = 7;\n    }\n    const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();\n\n    let week: number[] = [];\n    const weeks: number[][] = [];\n    let i;\n\n    // Pad first week\n    for (i = 1; i < firstDayOfMonth; i += 1) {\n      week.push(-1);\n    }\n    // Fill in days\n    for (i = 1; i <= daysInMonth; i += 1) {\n      week.push(i);\n      if ((firstDayOfMonth + i - 1) % 7 === 0) {\n        weeks.push(week);\n        week = [];\n      }\n    }\n    if (week.length > 0) {\n      // Pad last week\n      for (i = week.length; i < 7; i += 1) {\n        week.push(-1);\n      }\n      weeks.push(week);\n    }\n    return weeks;\n  };\n\n  days = getDayNames(this.props.intl.locale, 'short');\n  daysShort = getDayNames(this.props.intl.locale, 'narrow');\n  daysLong = getDayNames(this.props.intl.locale, 'long');\n\n  selectDay = (day: number) => {\n    const { viewMonth, viewYear, onSelect } = this.props;\n    onSelect(new Date(viewYear, viewMonth, day));\n  };\n\n  isDisabled = (day: number) => {\n    if (day < 0) {\n      return true;\n    }\n    const { min, max, viewMonth, viewYear } = this.props;\n    const date = new Date(viewYear, viewMonth, day);\n\n    return !isWithinRange(date, min, max);\n  };\n\n  isActive = (day: number) => {\n    const { selectedDate, viewMonth, viewYear } = this.props;\n    return !!(selectedDate && Number(new Date(viewYear, viewMonth, day)) === Number(selectedDate));\n  };\n\n  isToday = (day: number) => {\n    const { viewMonth, viewYear } = this.props;\n    return Number(getStartOfDay(new Date())) === Number(new Date(viewYear, viewMonth, day));\n  };\n\n  getAutofocusDay = (weeks: number[][]) => {\n    const days = weeks.flatMap((week) => week);\n    return getFocusableTime({\n      isActive: this.isActive,\n      isNow: this.isToday,\n      isDisabled: this.isDisabled,\n      timeSpan: days,\n    });\n  };\n\n  render() {\n    const { viewMonth, viewYear, intl } = this.props;\n    const weeks = this.getTableStructure();\n    const autoFocusDay = this.getAutofocusDay(weeks);\n    return (\n      <table className=\"table table-condensed table-bordered tw-date-lookup-calendar m-b-0\">\n        <thead>\n          <tr>\n            {this.days.map((day, index) => (\n              <th\n                key={day}\n                className={\n                  index > 4\n                    ? 'text-xs-center np-text-body-default'\n                    : 'text-xs-center np-text-body-default-bold'\n                }\n              >\n                <span className=\"hidden-xs\">\n                  <abbr title={this.daysLong[index]}>{day.slice(0, 3)}</abbr>\n                </span>\n                <span className=\"visible-xs-inline-block\">\n                  <abbr title={this.daysLong[index]}>{this.daysShort[index].slice(0, 2)}</abbr>\n                </span>\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {/* eslint-disable react/no-array-index-key */}\n          {weeks.map((week, weekIndex) => (\n            <tr key={weekIndex}>\n              {week.map((day, dayIndex) => (\n                <td key={dayIndex} className={dayIndex > 4 ? 'weekend' : ''}>\n                  {day !== -1 && (\n                    <TableLink\n                      item={day}\n                      type=\"day\"\n                      title={formatDate(\n                        new Date(viewYear, viewMonth, day),\n                        intl.locale,\n                        SHORT_DAY_FORMAT,\n                      )}\n                      autofocus={day === autoFocusDay}\n                      longTitle={formatDate(new Date(viewYear, viewMonth, day), intl.locale)}\n                      active={this.isActive(day)}\n                      disabled={this.isDisabled(day)}\n                      today={this.isToday(day)}\n                      onClick={this.selectDay}\n                    />\n                  )}\n                </td>\n              ))}\n            </tr>\n          ))}\n          {/* eslint-enable react/no-array-index-key */}\n        </tbody>\n      </table>\n    );\n  }\n}\n\nexport default injectIntl(DayCalendarTable);\n"],"names":["SHORT_DAY_FORMAT","day","DayCalendarTable","PureComponent","getTableStructure","viewMonth","viewYear","props","firstDayOfMonth","Date","getDay","daysInMonth","getDate","week","weeks","i","push","length","days","getDayNames","intl","locale","daysShort","daysLong","selectDay","onSelect","isDisabled","min","max","date","isWithinRange","isActive","selectedDate","Number","isToday","getStartOfDay","getAutofocusDay","flatMap","getFocusableTime","isNow","timeSpan","render","autoFocusDay","_jsxs","className","children","_jsx","map","index","title","slice","weekIndex","dayIndex","TableLink","item","type","formatDate","autofocus","longTitle","active","disabled","today","onClick","injectIntl"],"mappings":"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"}
+{"version":3,"file":"DayCalendarTable.js","sources":["../../../../src/Calendar/DayCalendar/Table/DayCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../../common/injectIntl';\n\nimport { getDayNames, isWithinRange } from '../../../common/DateUtils';\nimport { isDateDisabled } from '../../_helpers';\nimport { LONG_DAY_FORMAT } from '../../Calendar.constants';\nimport type { DisabledRules } from '../../Calendar.types';\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport { getStartOfDay } from '../../GetStartOfDay';\nimport TableLink from '../../TableLink';\n\nconst SHORT_DAY_FORMAT: Intl.DateTimeFormatOptions = { day: 'numeric' };\n\ninterface DayCalendarTableProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  focusedDate?: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewMonth: number;\n  viewYear: number;\n  disabledRules?: DisabledRules;\n  disabledReasonId?: string;\n  announceReasonOnFocus?: boolean;\n  onSelect: (date: Date) => void;\n  onDayFocus?: (date: Date) => void;\n}\n\nclass DayCalendarTable extends PureComponent<DayCalendarTableProps> {\n  getTableStructure = () => {\n    const { viewMonth, viewYear } = this.props;\n    let firstDayOfMonth = new Date(viewYear, viewMonth, 1).getDay();\n    // JS Sunday is 0, we're setting it last\n    if (firstDayOfMonth === 0) {\n      firstDayOfMonth = 7;\n    }\n    const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();\n\n    let week: number[] = [];\n    const weeks: number[][] = [];\n    let i;\n\n    // Pad first week\n    for (i = 1; i < firstDayOfMonth; i += 1) {\n      week.push(-1);\n    }\n    // Fill in days\n    for (i = 1; i <= daysInMonth; i += 1) {\n      week.push(i);\n      if ((firstDayOfMonth + i - 1) % 7 === 0) {\n        weeks.push(week);\n        week = [];\n      }\n    }\n    if (week.length > 0) {\n      // Pad last week\n      for (i = week.length; i < 7; i += 1) {\n        week.push(-1);\n      }\n      weeks.push(week);\n    }\n    return weeks;\n  };\n\n  days = getDayNames(this.props.intl.locale, 'short');\n  daysShort = getDayNames(this.props.intl.locale, 'narrow');\n  daysLong = getDayNames(this.props.intl.locale, 'long');\n\n  selectDay = (day: number) => {\n    const { viewMonth, viewYear, onSelect } = this.props;\n    onSelect(new Date(viewYear, viewMonth, day));\n  };\n\n  focusDay = (day: number) => {\n    const { viewMonth, viewYear, onDayFocus } = this.props;\n    onDayFocus?.(new Date(viewYear, viewMonth, day));\n  };\n\n  isOutOfRange = (day: number) => {\n    if (day < 0) {\n      return true;\n    }\n    const { min, max, viewMonth, viewYear } = this.props;\n    const date = new Date(viewYear, viewMonth, day);\n    return !isWithinRange(date, min, max);\n  };\n\n  isDisabled = (day: number) => {\n    if (day < 0) {\n      return false;\n    }\n    const { viewMonth, viewYear, disabledRules } = this.props;\n    const date = new Date(viewYear, viewMonth, day);\n    return isDateDisabled(date, disabledRules);\n  };\n\n  isUnavailable = (day: number) => this.isOutOfRange(day) || this.isDisabled(day);\n\n  isActive = (day: number) => {\n    const { selectedDate, viewMonth, viewYear } = this.props;\n    return !!(selectedDate && Number(new Date(viewYear, viewMonth, day)) === Number(selectedDate));\n  };\n\n  isFocused = (day: number) => {\n    const { focusedDate, viewMonth, viewYear } = this.props;\n    return !!(focusedDate && Number(new Date(viewYear, viewMonth, day)) === Number(focusedDate));\n  };\n\n  isToday = (day: number) => {\n    const { viewMonth, viewYear } = this.props;\n    return Number(getStartOfDay(new Date())) === Number(new Date(viewYear, viewMonth, day));\n  };\n\n  getAutofocusDay = (weeks: number[][]) => {\n    const days = weeks.flatMap((week) => week);\n    return getFocusableTime({\n      isActive: this.isFocused,\n      isNow: this.isToday,\n      isDisabled: this.isUnavailable,\n      timeSpan: days,\n    });\n  };\n\n  render() {\n    const { viewMonth, viewYear, intl, disabledReasonId, announceReasonOnFocus } = this.props;\n    const weeks = this.getTableStructure();\n    const autoFocusDay = this.getAutofocusDay(weeks);\n    return (\n      <table className=\"table table-condensed table-bordered tw-date-lookup-calendar m-b-0\">\n        <thead>\n          <tr>\n            {this.days.map((day, index) => (\n              <th\n                key={day}\n                className={\n                  index > 4\n                    ? 'text-xs-center np-text-body-default'\n                    : 'text-xs-center np-text-body-default-bold'\n                }\n              >\n                <span className=\"hidden-xs\">\n                  <abbr title={this.daysLong[index]}>{day.slice(0, 3)}</abbr>\n                </span>\n                <span className=\"visible-xs-inline-block\">\n                  <abbr title={this.daysLong[index]}>{this.daysShort[index].slice(0, 2)}</abbr>\n                </span>\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {/* eslint-disable react/no-array-index-key */}\n          {weeks.map((week, weekIndex) => (\n            <tr key={weekIndex}>\n              {week.map((day, dayIndex) => {\n                const dayOutOfRange = this.isOutOfRange(day);\n                const dayDisabled = this.isDisabled(day);\n                return (\n                  <td key={dayIndex} className={dayIndex > 4 ? 'weekend' : ''}>\n                    {day !== -1 && (\n                      <TableLink\n                        item={day}\n                        type=\"day\"\n                        title={formatDate(\n                          new Date(viewYear, viewMonth, day),\n                          intl.locale,\n                          SHORT_DAY_FORMAT,\n                        )}\n                        autofocus={day === autoFocusDay}\n                        longTitle={formatDate(\n                          new Date(viewYear, viewMonth, day),\n                          intl.locale,\n                          LONG_DAY_FORMAT,\n                        )}\n                        active={this.isActive(day)}\n                        outOfRange={dayOutOfRange}\n                        disabled={dayDisabled}\n                        today={this.isToday(day)}\n                        disabledReasonId={disabledReasonId}\n                        announceReasonOnFocus={announceReasonOnFocus}\n                        onClick={this.selectDay}\n                        onFocus={this.focusDay}\n                      />\n                    )}\n                  </td>\n                );\n              })}\n            </tr>\n          ))}\n          {/* eslint-enable react/no-array-index-key */}\n        </tbody>\n      </table>\n    );\n  }\n}\n\nexport default injectIntl(DayCalendarTable);\n"],"names":["SHORT_DAY_FORMAT","day","DayCalendarTable","PureComponent","getTableStructure","viewMonth","viewYear","props","firstDayOfMonth","Date","getDay","daysInMonth","getDate","week","weeks","i","push","length","days","getDayNames","intl","locale","daysShort","daysLong","selectDay","onSelect","focusDay","onDayFocus","isOutOfRange","min","max","date","isWithinRange","isDisabled","disabledRules","isDateDisabled","isUnavailable","isActive","selectedDate","Number","isFocused","focusedDate","isToday","getStartOfDay","getAutofocusDay","flatMap","getFocusableTime","isNow","timeSpan","render","disabledReasonId","announceReasonOnFocus","autoFocusDay","_jsxs","className","children","_jsx","map","index","title","slice","weekIndex","dayIndex","dayOutOfRange","dayDisabled","TableLink","item","type","formatDate","autofocus","longTitle","LONG_DAY_FORMAT","active","outOfRange","disabled","today","onClick","onFocus","injectIntl"],"mappings":"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"}

package/build/Calendar/DayCalendar/Table/DayCalendarTable.mjs

@@ -3,9 +3,11 @@ import { PureComponent } from 'react';
 import { injectIntl } from '../../../common/injectIntl.mjs';
 import { getDayNames } from '../../../common/DateUtils/getDayNames/getDayNames.mjs';
 import { isWithinRange } from '../../../common/DateUtils/isWithinRange/isWithinRange.mjs';
+import { isDateDisabled } from '../../_helpers/isDateDisabled/isDateDisabled.mjs';
+import { LONG_DAY_FORMAT } from '../../Calendar.constants.mjs';
 import { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime.mjs';
 import { getStartOfDay } from '../../GetStartOfDay/GetStartOfDay.mjs';
-import TableLink from '../../tableLink/TableLink.mjs';
+import TableLink from '../../TableLink/TableLink.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 const SHORT_DAY_FORMAT = {
@@ -58,7 +60,15 @@ class DayCalendarTable extends PureComponent {
     } = this.props;
     onSelect(new Date(viewYear, viewMonth, day));
   };
-  isDisabled = day => {
+  focusDay = day => {
+    const {
+      viewMonth,
+      viewYear,
+      onDayFocus
+    } = this.props;
+    onDayFocus?.(new Date(viewYear, viewMonth, day));
+  };
+  isOutOfRange = day => {
     if (day < 0) {
       return true;
     }
@@ -71,6 +81,19 @@ class DayCalendarTable extends PureComponent {
     const date = new Date(viewYear, viewMonth, day);
     return !isWithinRange(date, min, max);
   };
+  isDisabled = day => {
+    if (day < 0) {
+      return false;
+    }
+    const {
+      viewMonth,
+      viewYear,
+      disabledRules
+    } = this.props;
+    const date = new Date(viewYear, viewMonth, day);
+    return isDateDisabled(date, disabledRules);
+  };
+  isUnavailable = day => this.isOutOfRange(day) || this.isDisabled(day);
   isActive = day => {
     const {
       selectedDate,
@@ -79,6 +102,14 @@ class DayCalendarTable extends PureComponent {
     } = this.props;
     return !!(selectedDate && Number(new Date(viewYear, viewMonth, day)) === Number(selectedDate));
   };
+  isFocused = day => {
+    const {
+      focusedDate,
+      viewMonth,
+      viewYear
+    } = this.props;
+    return !!(focusedDate && Number(new Date(viewYear, viewMonth, day)) === Number(focusedDate));
+  };
   isToday = day => {
     const {
       viewMonth,
@@ -89,9 +120,9 @@ class DayCalendarTable extends PureComponent {
   getAutofocusDay = weeks => {
     const days = weeks.flatMap(week => week);
     return getFocusableTime({
-      isActive: this.isActive,
+      isActive: this.isFocused,
       isNow: this.isToday,
-      isDisabled: this.isDisabled,
+      isDisabled: this.isUnavailable,
       timeSpan: days
     });
   };
@@ -99,7 +130,9 @@ class DayCalendarTable extends PureComponent {
     const {
       viewMonth,
       viewYear,
-      intl
+      intl,
+      disabledReasonId,
+      announceReasonOnFocus
     } = this.props;
     const weeks = this.getTableStructure();
     const autoFocusDay = this.getAutofocusDay(weeks);
@@ -126,20 +159,28 @@ class DayCalendarTable extends PureComponent {
         })
       }), /*#__PURE__*/jsx("tbody", {
         children: weeks.map((week, weekIndex) => /*#__PURE__*/jsx("tr", {
-          children: week.map((day, dayIndex) => /*#__PURE__*/jsx("td", {
-            className: dayIndex > 4 ? 'weekend' : '',
-            children: day !== -1 && /*#__PURE__*/jsx(TableLink, {
-              item: day,
-              type: "day",
-              title: formatDate(new Date(viewYear, viewMonth, day), intl.locale, SHORT_DAY_FORMAT),
-              autofocus: day === autoFocusDay,
-              longTitle: formatDate(new Date(viewYear, viewMonth, day), intl.locale),
-              active: this.isActive(day),
-              disabled: this.isDisabled(day),
-              today: this.isToday(day),
-              onClick: this.selectDay
-            })
-          }, dayIndex))
+          children: week.map((day, dayIndex) => {
+            const dayOutOfRange = this.isOutOfRange(day);
+            const dayDisabled = this.isDisabled(day);
+            return /*#__PURE__*/jsx("td", {
+              className: dayIndex > 4 ? 'weekend' : '',
+              children: day !== -1 && /*#__PURE__*/jsx(TableLink, {
+                item: day,
+                type: "day",
+                title: formatDate(new Date(viewYear, viewMonth, day), intl.locale, SHORT_DAY_FORMAT),
+                autofocus: day === autoFocusDay,
+                longTitle: formatDate(new Date(viewYear, viewMonth, day), intl.locale, LONG_DAY_FORMAT),
+                active: this.isActive(day),
+                outOfRange: dayOutOfRange,
+                disabled: dayDisabled,
+                today: this.isToday(day),
+                disabledReasonId: disabledReasonId,
+                announceReasonOnFocus: announceReasonOnFocus,
+                onClick: this.selectDay,
+                onFocus: this.focusDay
+              })
+            }, dayIndex);
+          })
         }, weekIndex))
       })]
     });

package/build/Calendar/DayCalendar/Table/DayCalendarTable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DayCalendarTable.mjs","sources":["../../../../src/Calendar/DayCalendar/Table/DayCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../../common/injectIntl';\n\nimport { getDayNames, isWithinRange } from '../../../common/DateUtils';\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport { getStartOfDay } from '../../GetStartOfDay';\nimport TableLink from '../../tableLink';\n\nconst SHORT_DAY_FORMAT: Intl.DateTimeFormatOptions = { day: 'numeric' };\n\ninterface DayCalendarTableProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewMonth: number;\n  viewYear: number;\n  onSelect: (date: Date) => void;\n}\n\nclass DayCalendarTable extends PureComponent<DayCalendarTableProps> {\n  getTableStructure = () => {\n    const { viewMonth, viewYear } = this.props;\n    let firstDayOfMonth = new Date(viewYear, viewMonth, 1).getDay();\n    // JS Sunday is 0, we're setting it last\n    if (firstDayOfMonth === 0) {\n      firstDayOfMonth = 7;\n    }\n    const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();\n\n    let week: number[] = [];\n    const weeks: number[][] = [];\n    let i;\n\n    // Pad first week\n    for (i = 1; i < firstDayOfMonth; i += 1) {\n      week.push(-1);\n    }\n    // Fill in days\n    for (i = 1; i <= daysInMonth; i += 1) {\n      week.push(i);\n      if ((firstDayOfMonth + i - 1) % 7 === 0) {\n        weeks.push(week);\n        week = [];\n      }\n    }\n    if (week.length > 0) {\n      // Pad last week\n      for (i = week.length; i < 7; i += 1) {\n        week.push(-1);\n      }\n      weeks.push(week);\n    }\n    return weeks;\n  };\n\n  days = getDayNames(this.props.intl.locale, 'short');\n  daysShort = getDayNames(this.props.intl.locale, 'narrow');\n  daysLong = getDayNames(this.props.intl.locale, 'long');\n\n  selectDay = (day: number) => {\n    const { viewMonth, viewYear, onSelect } = this.props;\n    onSelect(new Date(viewYear, viewMonth, day));\n  };\n\n  isDisabled = (day: number) => {\n    if (day < 0) {\n      return true;\n    }\n    const { min, max, viewMonth, viewYear } = this.props;\n    const date = new Date(viewYear, viewMonth, day);\n\n    return !isWithinRange(date, min, max);\n  };\n\n  isActive = (day: number) => {\n    const { selectedDate, viewMonth, viewYear } = this.props;\n    return !!(selectedDate && Number(new Date(viewYear, viewMonth, day)) === Number(selectedDate));\n  };\n\n  isToday = (day: number) => {\n    const { viewMonth, viewYear } = this.props;\n    return Number(getStartOfDay(new Date())) === Number(new Date(viewYear, viewMonth, day));\n  };\n\n  getAutofocusDay = (weeks: number[][]) => {\n    const days = weeks.flatMap((week) => week);\n    return getFocusableTime({\n      isActive: this.isActive,\n      isNow: this.isToday,\n      isDisabled: this.isDisabled,\n      timeSpan: days,\n    });\n  };\n\n  render() {\n    const { viewMonth, viewYear, intl } = this.props;\n    const weeks = this.getTableStructure();\n    const autoFocusDay = this.getAutofocusDay(weeks);\n    return (\n      <table className=\"table table-condensed table-bordered tw-date-lookup-calendar m-b-0\">\n        <thead>\n          <tr>\n            {this.days.map((day, index) => (\n              <th\n                key={day}\n                className={\n                  index > 4\n                    ? 'text-xs-center np-text-body-default'\n                    : 'text-xs-center np-text-body-default-bold'\n                }\n              >\n                <span className=\"hidden-xs\">\n                  <abbr title={this.daysLong[index]}>{day.slice(0, 3)}</abbr>\n                </span>\n                <span className=\"visible-xs-inline-block\">\n                  <abbr title={this.daysLong[index]}>{this.daysShort[index].slice(0, 2)}</abbr>\n                </span>\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {/* eslint-disable react/no-array-index-key */}\n          {weeks.map((week, weekIndex) => (\n            <tr key={weekIndex}>\n              {week.map((day, dayIndex) => (\n                <td key={dayIndex} className={dayIndex > 4 ? 'weekend' : ''}>\n                  {day !== -1 && (\n                    <TableLink\n                      item={day}\n                      type=\"day\"\n                      title={formatDate(\n                        new Date(viewYear, viewMonth, day),\n                        intl.locale,\n                        SHORT_DAY_FORMAT,\n                      )}\n                      autofocus={day === autoFocusDay}\n                      longTitle={formatDate(new Date(viewYear, viewMonth, day), intl.locale)}\n                      active={this.isActive(day)}\n                      disabled={this.isDisabled(day)}\n                      today={this.isToday(day)}\n                      onClick={this.selectDay}\n                    />\n                  )}\n                </td>\n              ))}\n            </tr>\n          ))}\n          {/* eslint-enable react/no-array-index-key */}\n        </tbody>\n      </table>\n    );\n  }\n}\n\nexport default injectIntl(DayCalendarTable);\n"],"names":["SHORT_DAY_FORMAT","day","DayCalendarTable","PureComponent","getTableStructure","viewMonth","viewYear","props","firstDayOfMonth","Date","getDay","daysInMonth","getDate","week","weeks","i","push","length","days","getDayNames","intl","locale","daysShort","daysLong","selectDay","onSelect","isDisabled","min","max","date","isWithinRange","isActive","selectedDate","Number","isToday","getStartOfDay","getAutofocusDay","flatMap","getFocusableTime","isNow","timeSpan","render","autoFocusDay","_jsxs","className","children","_jsx","map","index","title","slice","weekIndex","dayIndex","TableLink","item","type","formatDate","autofocus","longTitle","active","disabled","today","onClick","injectIntl"],"mappings":"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"}
+{"version":3,"file":"DayCalendarTable.mjs","sources":["../../../../src/Calendar/DayCalendar/Table/DayCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../../common/injectIntl';\n\nimport { getDayNames, isWithinRange } from '../../../common/DateUtils';\nimport { isDateDisabled } from '../../_helpers';\nimport { LONG_DAY_FORMAT } from '../../Calendar.constants';\nimport type { DisabledRules } from '../../Calendar.types';\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport { getStartOfDay } from '../../GetStartOfDay';\nimport TableLink from '../../TableLink';\n\nconst SHORT_DAY_FORMAT: Intl.DateTimeFormatOptions = { day: 'numeric' };\n\ninterface DayCalendarTableProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  focusedDate?: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewMonth: number;\n  viewYear: number;\n  disabledRules?: DisabledRules;\n  disabledReasonId?: string;\n  announceReasonOnFocus?: boolean;\n  onSelect: (date: Date) => void;\n  onDayFocus?: (date: Date) => void;\n}\n\nclass DayCalendarTable extends PureComponent<DayCalendarTableProps> {\n  getTableStructure = () => {\n    const { viewMonth, viewYear } = this.props;\n    let firstDayOfMonth = new Date(viewYear, viewMonth, 1).getDay();\n    // JS Sunday is 0, we're setting it last\n    if (firstDayOfMonth === 0) {\n      firstDayOfMonth = 7;\n    }\n    const daysInMonth = new Date(viewYear, viewMonth + 1, 0).getDate();\n\n    let week: number[] = [];\n    const weeks: number[][] = [];\n    let i;\n\n    // Pad first week\n    for (i = 1; i < firstDayOfMonth; i += 1) {\n      week.push(-1);\n    }\n    // Fill in days\n    for (i = 1; i <= daysInMonth; i += 1) {\n      week.push(i);\n      if ((firstDayOfMonth + i - 1) % 7 === 0) {\n        weeks.push(week);\n        week = [];\n      }\n    }\n    if (week.length > 0) {\n      // Pad last week\n      for (i = week.length; i < 7; i += 1) {\n        week.push(-1);\n      }\n      weeks.push(week);\n    }\n    return weeks;\n  };\n\n  days = getDayNames(this.props.intl.locale, 'short');\n  daysShort = getDayNames(this.props.intl.locale, 'narrow');\n  daysLong = getDayNames(this.props.intl.locale, 'long');\n\n  selectDay = (day: number) => {\n    const { viewMonth, viewYear, onSelect } = this.props;\n    onSelect(new Date(viewYear, viewMonth, day));\n  };\n\n  focusDay = (day: number) => {\n    const { viewMonth, viewYear, onDayFocus } = this.props;\n    onDayFocus?.(new Date(viewYear, viewMonth, day));\n  };\n\n  isOutOfRange = (day: number) => {\n    if (day < 0) {\n      return true;\n    }\n    const { min, max, viewMonth, viewYear } = this.props;\n    const date = new Date(viewYear, viewMonth, day);\n    return !isWithinRange(date, min, max);\n  };\n\n  isDisabled = (day: number) => {\n    if (day < 0) {\n      return false;\n    }\n    const { viewMonth, viewYear, disabledRules } = this.props;\n    const date = new Date(viewYear, viewMonth, day);\n    return isDateDisabled(date, disabledRules);\n  };\n\n  isUnavailable = (day: number) => this.isOutOfRange(day) || this.isDisabled(day);\n\n  isActive = (day: number) => {\n    const { selectedDate, viewMonth, viewYear } = this.props;\n    return !!(selectedDate && Number(new Date(viewYear, viewMonth, day)) === Number(selectedDate));\n  };\n\n  isFocused = (day: number) => {\n    const { focusedDate, viewMonth, viewYear } = this.props;\n    return !!(focusedDate && Number(new Date(viewYear, viewMonth, day)) === Number(focusedDate));\n  };\n\n  isToday = (day: number) => {\n    const { viewMonth, viewYear } = this.props;\n    return Number(getStartOfDay(new Date())) === Number(new Date(viewYear, viewMonth, day));\n  };\n\n  getAutofocusDay = (weeks: number[][]) => {\n    const days = weeks.flatMap((week) => week);\n    return getFocusableTime({\n      isActive: this.isFocused,\n      isNow: this.isToday,\n      isDisabled: this.isUnavailable,\n      timeSpan: days,\n    });\n  };\n\n  render() {\n    const { viewMonth, viewYear, intl, disabledReasonId, announceReasonOnFocus } = this.props;\n    const weeks = this.getTableStructure();\n    const autoFocusDay = this.getAutofocusDay(weeks);\n    return (\n      <table className=\"table table-condensed table-bordered tw-date-lookup-calendar m-b-0\">\n        <thead>\n          <tr>\n            {this.days.map((day, index) => (\n              <th\n                key={day}\n                className={\n                  index > 4\n                    ? 'text-xs-center np-text-body-default'\n                    : 'text-xs-center np-text-body-default-bold'\n                }\n              >\n                <span className=\"hidden-xs\">\n                  <abbr title={this.daysLong[index]}>{day.slice(0, 3)}</abbr>\n                </span>\n                <span className=\"visible-xs-inline-block\">\n                  <abbr title={this.daysLong[index]}>{this.daysShort[index].slice(0, 2)}</abbr>\n                </span>\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {/* eslint-disable react/no-array-index-key */}\n          {weeks.map((week, weekIndex) => (\n            <tr key={weekIndex}>\n              {week.map((day, dayIndex) => {\n                const dayOutOfRange = this.isOutOfRange(day);\n                const dayDisabled = this.isDisabled(day);\n                return (\n                  <td key={dayIndex} className={dayIndex > 4 ? 'weekend' : ''}>\n                    {day !== -1 && (\n                      <TableLink\n                        item={day}\n                        type=\"day\"\n                        title={formatDate(\n                          new Date(viewYear, viewMonth, day),\n                          intl.locale,\n                          SHORT_DAY_FORMAT,\n                        )}\n                        autofocus={day === autoFocusDay}\n                        longTitle={formatDate(\n                          new Date(viewYear, viewMonth, day),\n                          intl.locale,\n                          LONG_DAY_FORMAT,\n                        )}\n                        active={this.isActive(day)}\n                        outOfRange={dayOutOfRange}\n                        disabled={dayDisabled}\n                        today={this.isToday(day)}\n                        disabledReasonId={disabledReasonId}\n                        announceReasonOnFocus={announceReasonOnFocus}\n                        onClick={this.selectDay}\n                        onFocus={this.focusDay}\n                      />\n                    )}\n                  </td>\n                );\n              })}\n            </tr>\n          ))}\n          {/* eslint-enable react/no-array-index-key */}\n        </tbody>\n      </table>\n    );\n  }\n}\n\nexport default injectIntl(DayCalendarTable);\n"],"names":["SHORT_DAY_FORMAT","day","DayCalendarTable","PureComponent","getTableStructure","viewMonth","viewYear","props","firstDayOfMonth","Date","getDay","daysInMonth","getDate","week","weeks","i","push","length","days","getDayNames","intl","locale","daysShort","daysLong","selectDay","onSelect","focusDay","onDayFocus","isOutOfRange","min","max","date","isWithinRange","isDisabled","disabledRules","isDateDisabled","isUnavailable","isActive","selectedDate","Number","isFocused","focusedDate","isToday","getStartOfDay","getAutofocusDay","flatMap","getFocusableTime","isNow","timeSpan","render","disabledReasonId","announceReasonOnFocus","autoFocusDay","_jsxs","className","children","_jsx","map","index","title","slice","weekIndex","dayIndex","dayOutOfRange","dayDisabled","TableLink","item","type","formatDate","autofocus","longTitle","LONG_DAY_FORMAT","active","outOfRange","disabled","today","onClick","onFocus","injectIntl"],"mappings":"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"}

package/build/Calendar/MonthCalendar/MonthCalendar.js

@@ -30,6 +30,7 @@ let MonthCalendar$1 = class MonthCalendar extends React.PureComponent {
   render() {
     const {
       selectedDate,
+      focusedDate,
       min,
       max,
       viewYear,
@@ -40,17 +41,22 @@ let MonthCalendar$1 = class MonthCalendar extends React.PureComponent {
       placeholder,
       onLabelClick
     } = this.props;
+    const isPreviousDisabled = !!(min && viewYear - 1 < min.getFullYear());
+    const isNextDisabled = !!(max && viewYear + 1 > max.getFullYear());
     return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/*#__PURE__*/jsxRuntime.jsx(DateHeader.default, {
         dateMode: formatMessage(Calendar_messages.default.year),
         label: formatting.formatDate(new Date(viewYear, 0), locale, {
           year: 'numeric'
         }),
+        isPreviousDisabled: isPreviousDisabled,
+        isNextDisabled: isNextDisabled,
         onLabelClick: onLabelClick,
         onPreviousClick: this.selectPreviousYear,
         onNextClick: this.selectNextYear
       }), /*#__PURE__*/jsxRuntime.jsx(MonthCalendarTable.default, {
         selectedDate: selectedDate,
+        focusedDate: focusedDate,
         min: min,
         max: max,
         viewYear: viewYear,

package/build/Calendar/MonthCalendar/MonthCalendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthCalendar.js","sources":["../../../src/Calendar/MonthCalendar/MonthCalendar.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport MonthCalendarTable from './Table';\n\ninterface MonthCalendarProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewYear: number;\n  placeholder?: string;\n  onSelect: () => void;\n  onLabelClick: () => void;\n  onViewDateUpdate: (date: { year?: number; month?: number }) => void;\n}\n\nclass MonthCalendar extends PureComponent<MonthCalendarProps> {\n  onMonthSelect = (month: number) => {\n    this.props.onViewDateUpdate({ month });\n    this.props.onSelect();\n  };\n\n  selectPreviousYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear - 1 });\n  };\n\n  selectNextYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear + 1 });\n  };\n\n  render() {\n    const {\n      selectedDate,\n      min,\n      max,\n      viewYear,\n      intl: { locale, formatMessage },\n      placeholder,\n      onLabelClick,\n    } = this.props;\n    return (\n      <>\n        <DateHeader\n          dateMode={formatMessage(messages.year)}\n          label={formatDate(new Date(viewYear, 0), locale, { year: 'numeric' })}\n          onLabelClick={onLabelClick}\n          onPreviousClick={this.selectPreviousYear}\n          onNextClick={this.selectNextYear}\n        />\n        <MonthCalendarTable\n          selectedDate={selectedDate}\n          min={min}\n          max={max}\n          viewYear={viewYear}\n          placeholder={placeholder}\n          onSelect={this.onMonthSelect}\n        />\n      </>\n    );\n  }\n}\n\nexport default injectIntl(MonthCalendar);\n"],"names":["MonthCalendar","PureComponent","onMonthSelect","month","props","onViewDateUpdate","onSelect","selectPreviousYear","year","viewYear","selectNextYear","render","selectedDate","min","max","intl","locale","formatMessage","placeholder","onLabelClick","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","label","formatDate","Date","onPreviousClick","onNextClick","MonthCalendarTable","injectIntl"],"mappings":";;;;;;;;;;;;sBAoBA,MAAMA,aAAc,SAAQC,mBAAiC,CAAA;EAC3DC,aAAa,GAAIC,KAAa,IAAI;AAChC,IAAA,IAAI,CAACC,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA;AAAK,KAAE,CAAC;AACtC,IAAA,IAAI,CAACC,KAAK,CAACE,QAAQ,EAAE;EACvB,CAAC;EAEDC,kBAAkB,GAAGA,MAAK;AACxB,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;EAEDC,cAAc,GAAGA,MAAK;AACpB,IAAA,IAAI,CAACN,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;AAEDE,EAAAA,MAAMA,GAAA;IACJ,MAAM;MACJC,YAAY;MACZC,GAAG;MACHC,GAAG;MACHL,QAAQ;AACRM,MAAAA,IAAI,EAAE;QAAEC,MAAM;AAAEC,QAAAA;OAAe;MAC/BC,WAAW;AACXC,MAAAA;KACD,GAAG,IAAI,CAACf,KAAK;IACd,oBACEgB,eAAA,CAAAC,mBAAA,EAAA;MAAAC,QAAA,EAAA,cACEC,cAAA,CAACC,kBAAU,EAAA;AACTC,QAAAA,QAAQ,EAAER,aAAa,CAACS,yBAAQ,CAAClB,IAAI,CAAE;AACvCmB,QAAAA,KAAK,EAAEC,qBAAU,CAAC,IAAIC,IAAI,CAACpB,QAAQ,EAAE,CAAC,CAAC,EAAEO,MAAM,EAAE;AAAER,UAAAA,IAAI,EAAE;AAAS,SAAE,CAAE;AACtEW,QAAAA,YAAY,EAAEA,YAAa;QAC3BW,eAAe,EAAE,IAAI,CAACvB,kBAAmB;QACzCwB,WAAW,EAAE,IAAI,CAACrB;AAAe,OAAA,CAEnC,eAAAa,cAAA,CAACS,0BAAkB,EAAA;AACjBpB,QAAAA,YAAY,EAAEA,YAAa;AAC3BC,QAAAA,GAAG,EAAEA,GAAI;AACTC,QAAAA,GAAG,EAAEA,GAAI;AACTL,QAAAA,QAAQ,EAAEA,QAAS;AACnBS,QAAAA,WAAW,EAAEA,WAAY;QACzBZ,QAAQ,EAAE,IAAI,CAACJ;AAAc,OAAA,CAEjC;AAAA,KAAA,CAAG;AAEP,EAAA;AACD;AAED,oBAAe+B,qBAAU,CAACjC,eAAa,CAAC;;;;"}
+{"version":3,"file":"MonthCalendar.js","sources":["../../../src/Calendar/MonthCalendar/MonthCalendar.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport MonthCalendarTable from './Table';\n\ninterface MonthCalendarProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  focusedDate?: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewYear: number;\n  placeholder?: string;\n  onSelect: () => void;\n  onLabelClick: () => void;\n  onViewDateUpdate: (date: { year?: number; month?: number }) => void;\n}\n\nclass MonthCalendar extends PureComponent<MonthCalendarProps> {\n  onMonthSelect = (month: number) => {\n    this.props.onViewDateUpdate({ month });\n    this.props.onSelect();\n  };\n\n  selectPreviousYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear - 1 });\n  };\n\n  selectNextYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear + 1 });\n  };\n\n  render() {\n    const {\n      selectedDate,\n      focusedDate,\n      min,\n      max,\n      viewYear,\n      intl: { locale, formatMessage },\n      placeholder,\n      onLabelClick,\n    } = this.props;\n    const isPreviousDisabled = !!(min && viewYear - 1 < min.getFullYear());\n    const isNextDisabled = !!(max && viewYear + 1 > max.getFullYear());\n\n    return (\n      <>\n        <DateHeader\n          dateMode={formatMessage(messages.year)}\n          label={formatDate(new Date(viewYear, 0), locale, { year: 'numeric' })}\n          isPreviousDisabled={isPreviousDisabled}\n          isNextDisabled={isNextDisabled}\n          onLabelClick={onLabelClick}\n          onPreviousClick={this.selectPreviousYear}\n          onNextClick={this.selectNextYear}\n        />\n        <MonthCalendarTable\n          selectedDate={selectedDate}\n          focusedDate={focusedDate}\n          min={min}\n          max={max}\n          viewYear={viewYear}\n          placeholder={placeholder}\n          onSelect={this.onMonthSelect}\n        />\n      </>\n    );\n  }\n}\n\nexport default injectIntl(MonthCalendar);\n"],"names":["MonthCalendar","PureComponent","onMonthSelect","month","props","onViewDateUpdate","onSelect","selectPreviousYear","year","viewYear","selectNextYear","render","selectedDate","focusedDate","min","max","intl","locale","formatMessage","placeholder","onLabelClick","isPreviousDisabled","getFullYear","isNextDisabled","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","label","formatDate","Date","onPreviousClick","onNextClick","MonthCalendarTable","injectIntl"],"mappings":";;;;;;;;;;;;sBAqBA,MAAMA,aAAc,SAAQC,mBAAiC,CAAA;EAC3DC,aAAa,GAAIC,KAAa,IAAI;AAChC,IAAA,IAAI,CAACC,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA;AAAK,KAAE,CAAC;AACtC,IAAA,IAAI,CAACC,KAAK,CAACE,QAAQ,EAAE;EACvB,CAAC;EAEDC,kBAAkB,GAAGA,MAAK;AACxB,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;EAEDC,cAAc,GAAGA,MAAK;AACpB,IAAA,IAAI,CAACN,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;AAEDE,EAAAA,MAAMA,GAAA;IACJ,MAAM;MACJC,YAAY;MACZC,WAAW;MACXC,GAAG;MACHC,GAAG;MACHN,QAAQ;AACRO,MAAAA,IAAI,EAAE;QAAEC,MAAM;AAAEC,QAAAA;OAAe;MAC/BC,WAAW;AACXC,MAAAA;KACD,GAAG,IAAI,CAAChB,KAAK;AACd,IAAA,MAAMiB,kBAAkB,GAAG,CAAC,EAAEP,GAAG,IAAIL,QAAQ,GAAG,CAAC,GAAGK,GAAG,CAACQ,WAAW,EAAE,CAAC;AACtE,IAAA,MAAMC,cAAc,GAAG,CAAC,EAAER,GAAG,IAAIN,QAAQ,GAAG,CAAC,GAAGM,GAAG,CAACO,WAAW,EAAE,CAAC;IAElE,oBACEE,eAAA,CAAAC,mBAAA,EAAA;MAAAC,QAAA,EAAA,cACEC,cAAA,CAACC,kBAAU,EAAA;AACTC,QAAAA,QAAQ,EAAEX,aAAa,CAACY,yBAAQ,CAACtB,IAAI,CAAE;AACvCuB,QAAAA,KAAK,EAAEC,qBAAU,CAAC,IAAIC,IAAI,CAACxB,QAAQ,EAAE,CAAC,CAAC,EAAEQ,MAAM,EAAE;AAAET,UAAAA,IAAI,EAAE;AAAS,SAAE,CAAE;AACtEa,QAAAA,kBAAkB,EAAEA,kBAAmB;AACvCE,QAAAA,cAAc,EAAEA,cAAe;AAC/BH,QAAAA,YAAY,EAAEA,YAAa;QAC3Bc,eAAe,EAAE,IAAI,CAAC3B,kBAAmB;QACzC4B,WAAW,EAAE,IAAI,CAACzB;AAAe,OAAA,CAEnC,eAAAiB,cAAA,CAACS,0BAAkB,EAAA;AACjBxB,QAAAA,YAAY,EAAEA,YAAa;AAC3BC,QAAAA,WAAW,EAAEA,WAAY;AACzBC,QAAAA,GAAG,EAAEA,GAAI;AACTC,QAAAA,GAAG,EAAEA,GAAI;AACTN,QAAAA,QAAQ,EAAEA,QAAS;AACnBU,QAAAA,WAAW,EAAEA,WAAY;QACzBb,QAAQ,EAAE,IAAI,CAACJ;AAAc,OAAA,CAEjC;AAAA,KAAA,CAAG;AAEP,EAAA;AACD;AAED,oBAAemC,qBAAU,CAACrC,eAAa,CAAC;;;;"}

package/build/Calendar/MonthCalendar/MonthCalendar.mjs

@@ -26,6 +26,7 @@ class MonthCalendar extends PureComponent {
   render() {
     const {
       selectedDate,
+      focusedDate,
       min,
       max,
       viewYear,
@@ -36,17 +37,22 @@ class MonthCalendar extends PureComponent {
       placeholder,
       onLabelClick
     } = this.props;
+    const isPreviousDisabled = !!(min && viewYear - 1 < min.getFullYear());
+    const isNextDisabled = !!(max && viewYear + 1 > max.getFullYear());
     return /*#__PURE__*/jsxs(Fragment, {
       children: [/*#__PURE__*/jsx(DateHeader, {
         dateMode: formatMessage(messages.year),
         label: formatDate(new Date(viewYear, 0), locale, {
           year: 'numeric'
         }),
+        isPreviousDisabled: isPreviousDisabled,
+        isNextDisabled: isNextDisabled,
         onLabelClick: onLabelClick,
         onPreviousClick: this.selectPreviousYear,
         onNextClick: this.selectNextYear
       }), /*#__PURE__*/jsx(MonthCalendarTable, {
         selectedDate: selectedDate,
+        focusedDate: focusedDate,
         min: min,
         max: max,
         viewYear: viewYear,

package/build/Calendar/MonthCalendar/MonthCalendar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MonthCalendar.mjs","sources":["../../../src/Calendar/MonthCalendar/MonthCalendar.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport MonthCalendarTable from './Table';\n\ninterface MonthCalendarProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewYear: number;\n  placeholder?: string;\n  onSelect: () => void;\n  onLabelClick: () => void;\n  onViewDateUpdate: (date: { year?: number; month?: number }) => void;\n}\n\nclass MonthCalendar extends PureComponent<MonthCalendarProps> {\n  onMonthSelect = (month: number) => {\n    this.props.onViewDateUpdate({ month });\n    this.props.onSelect();\n  };\n\n  selectPreviousYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear - 1 });\n  };\n\n  selectNextYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear + 1 });\n  };\n\n  render() {\n    const {\n      selectedDate,\n      min,\n      max,\n      viewYear,\n      intl: { locale, formatMessage },\n      placeholder,\n      onLabelClick,\n    } = this.props;\n    return (\n      <>\n        <DateHeader\n          dateMode={formatMessage(messages.year)}\n          label={formatDate(new Date(viewYear, 0), locale, { year: 'numeric' })}\n          onLabelClick={onLabelClick}\n          onPreviousClick={this.selectPreviousYear}\n          onNextClick={this.selectNextYear}\n        />\n        <MonthCalendarTable\n          selectedDate={selectedDate}\n          min={min}\n          max={max}\n          viewYear={viewYear}\n          placeholder={placeholder}\n          onSelect={this.onMonthSelect}\n        />\n      </>\n    );\n  }\n}\n\nexport default injectIntl(MonthCalendar);\n"],"names":["MonthCalendar","PureComponent","onMonthSelect","month","props","onViewDateUpdate","onSelect","selectPreviousYear","year","viewYear","selectNextYear","render","selectedDate","min","max","intl","locale","formatMessage","placeholder","onLabelClick","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","label","formatDate","Date","onPreviousClick","onNextClick","MonthCalendarTable","injectIntl"],"mappings":";;;;;;;;AAoBA,MAAMA,aAAc,SAAQC,aAAiC,CAAA;EAC3DC,aAAa,GAAIC,KAAa,IAAI;AAChC,IAAA,IAAI,CAACC,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA;AAAK,KAAE,CAAC;AACtC,IAAA,IAAI,CAACC,KAAK,CAACE,QAAQ,EAAE;EACvB,CAAC;EAEDC,kBAAkB,GAAGA,MAAK;AACxB,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;EAEDC,cAAc,GAAGA,MAAK;AACpB,IAAA,IAAI,CAACN,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;AAEDE,EAAAA,MAAMA,GAAA;IACJ,MAAM;MACJC,YAAY;MACZC,GAAG;MACHC,GAAG;MACHL,QAAQ;AACRM,MAAAA,IAAI,EAAE;QAAEC,MAAM;AAAEC,QAAAA;OAAe;MAC/BC,WAAW;AACXC,MAAAA;KACD,GAAG,IAAI,CAACf,KAAK;IACd,oBACEgB,IAAA,CAAAC,QAAA,EAAA;MAAAC,QAAA,EAAA,cACEC,GAAA,CAACC,UAAU,EAAA;AACTC,QAAAA,QAAQ,EAAER,aAAa,CAACS,QAAQ,CAAClB,IAAI,CAAE;AACvCmB,QAAAA,KAAK,EAAEC,UAAU,CAAC,IAAIC,IAAI,CAACpB,QAAQ,EAAE,CAAC,CAAC,EAAEO,MAAM,EAAE;AAAER,UAAAA,IAAI,EAAE;AAAS,SAAE,CAAE;AACtEW,QAAAA,YAAY,EAAEA,YAAa;QAC3BW,eAAe,EAAE,IAAI,CAACvB,kBAAmB;QACzCwB,WAAW,EAAE,IAAI,CAACrB;AAAe,OAAA,CAEnC,eAAAa,GAAA,CAACS,kBAAkB,EAAA;AACjBpB,QAAAA,YAAY,EAAEA,YAAa;AAC3BC,QAAAA,GAAG,EAAEA,GAAI;AACTC,QAAAA,GAAG,EAAEA,GAAI;AACTL,QAAAA,QAAQ,EAAEA,QAAS;AACnBS,QAAAA,WAAW,EAAEA,WAAY;QACzBZ,QAAQ,EAAE,IAAI,CAACJ;AAAc,OAAA,CAEjC;AAAA,KAAA,CAAG;AAEP,EAAA;AACD;AAED,sBAAe+B,UAAU,CAACjC,aAAa,CAAC;;;;"}
+{"version":3,"file":"MonthCalendar.mjs","sources":["../../../src/Calendar/MonthCalendar/MonthCalendar.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport MonthCalendarTable from './Table';\n\ninterface MonthCalendarProps extends WrappedComponentProps {\n  selectedDate: Date | null;\n  focusedDate?: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewYear: number;\n  placeholder?: string;\n  onSelect: () => void;\n  onLabelClick: () => void;\n  onViewDateUpdate: (date: { year?: number; month?: number }) => void;\n}\n\nclass MonthCalendar extends PureComponent<MonthCalendarProps> {\n  onMonthSelect = (month: number) => {\n    this.props.onViewDateUpdate({ month });\n    this.props.onSelect();\n  };\n\n  selectPreviousYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear - 1 });\n  };\n\n  selectNextYear = () => {\n    this.props.onViewDateUpdate({ year: this.props.viewYear + 1 });\n  };\n\n  render() {\n    const {\n      selectedDate,\n      focusedDate,\n      min,\n      max,\n      viewYear,\n      intl: { locale, formatMessage },\n      placeholder,\n      onLabelClick,\n    } = this.props;\n    const isPreviousDisabled = !!(min && viewYear - 1 < min.getFullYear());\n    const isNextDisabled = !!(max && viewYear + 1 > max.getFullYear());\n\n    return (\n      <>\n        <DateHeader\n          dateMode={formatMessage(messages.year)}\n          label={formatDate(new Date(viewYear, 0), locale, { year: 'numeric' })}\n          isPreviousDisabled={isPreviousDisabled}\n          isNextDisabled={isNextDisabled}\n          onLabelClick={onLabelClick}\n          onPreviousClick={this.selectPreviousYear}\n          onNextClick={this.selectNextYear}\n        />\n        <MonthCalendarTable\n          selectedDate={selectedDate}\n          focusedDate={focusedDate}\n          min={min}\n          max={max}\n          viewYear={viewYear}\n          placeholder={placeholder}\n          onSelect={this.onMonthSelect}\n        />\n      </>\n    );\n  }\n}\n\nexport default injectIntl(MonthCalendar);\n"],"names":["MonthCalendar","PureComponent","onMonthSelect","month","props","onViewDateUpdate","onSelect","selectPreviousYear","year","viewYear","selectNextYear","render","selectedDate","focusedDate","min","max","intl","locale","formatMessage","placeholder","onLabelClick","isPreviousDisabled","getFullYear","isNextDisabled","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","label","formatDate","Date","onPreviousClick","onNextClick","MonthCalendarTable","injectIntl"],"mappings":";;;;;;;;AAqBA,MAAMA,aAAc,SAAQC,aAAiC,CAAA;EAC3DC,aAAa,GAAIC,KAAa,IAAI;AAChC,IAAA,IAAI,CAACC,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA;AAAK,KAAE,CAAC;AACtC,IAAA,IAAI,CAACC,KAAK,CAACE,QAAQ,EAAE;EACvB,CAAC;EAEDC,kBAAkB,GAAGA,MAAK;AACxB,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;EAEDC,cAAc,GAAGA,MAAK;AACpB,IAAA,IAAI,CAACN,KAAK,CAACC,gBAAgB,CAAC;AAAEG,MAAAA,IAAI,EAAE,IAAI,CAACJ,KAAK,CAACK,QAAQ,GAAG;AAAC,KAAE,CAAC;EAChE,CAAC;AAEDE,EAAAA,MAAMA,GAAA;IACJ,MAAM;MACJC,YAAY;MACZC,WAAW;MACXC,GAAG;MACHC,GAAG;MACHN,QAAQ;AACRO,MAAAA,IAAI,EAAE;QAAEC,MAAM;AAAEC,QAAAA;OAAe;MAC/BC,WAAW;AACXC,MAAAA;KACD,GAAG,IAAI,CAAChB,KAAK;AACd,IAAA,MAAMiB,kBAAkB,GAAG,CAAC,EAAEP,GAAG,IAAIL,QAAQ,GAAG,CAAC,GAAGK,GAAG,CAACQ,WAAW,EAAE,CAAC;AACtE,IAAA,MAAMC,cAAc,GAAG,CAAC,EAAER,GAAG,IAAIN,QAAQ,GAAG,CAAC,GAAGM,GAAG,CAACO,WAAW,EAAE,CAAC;IAElE,oBACEE,IAAA,CAAAC,QAAA,EAAA;MAAAC,QAAA,EAAA,cACEC,GAAA,CAACC,UAAU,EAAA;AACTC,QAAAA,QAAQ,EAAEX,aAAa,CAACY,QAAQ,CAACtB,IAAI,CAAE;AACvCuB,QAAAA,KAAK,EAAEC,UAAU,CAAC,IAAIC,IAAI,CAACxB,QAAQ,EAAE,CAAC,CAAC,EAAEQ,MAAM,EAAE;AAAET,UAAAA,IAAI,EAAE;AAAS,SAAE,CAAE;AACtEa,QAAAA,kBAAkB,EAAEA,kBAAmB;AACvCE,QAAAA,cAAc,EAAEA,cAAe;AAC/BH,QAAAA,YAAY,EAAEA,YAAa;QAC3Bc,eAAe,EAAE,IAAI,CAAC3B,kBAAmB;QACzC4B,WAAW,EAAE,IAAI,CAACzB;AAAe,OAAA,CAEnC,eAAAiB,GAAA,CAACS,kBAAkB,EAAA;AACjBxB,QAAAA,YAAY,EAAEA,YAAa;AAC3BC,QAAAA,WAAW,EAAEA,WAAY;AACzBC,QAAAA,GAAG,EAAEA,GAAI;AACTC,QAAAA,GAAG,EAAEA,GAAI;AACTN,QAAAA,QAAQ,EAAEA,QAAS;AACnBU,QAAAA,WAAW,EAAEA,WAAY;QACzBb,QAAQ,EAAE,IAAI,CAACJ;AAAc,OAAA,CAEjC;AAAA,KAAA,CAAG;AAEP,EAAA;AACD;AAED,sBAAemC,UAAU,CAACrC,aAAa,CAAC;;;;"}

package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var formatting = require('@transferwise/formatting');
 var reactIntl = require('react-intl');
 var GetFocusableTime = require('../../GetFocusableTime/GetFocusableTime.js');
-var TableLink = require('../../tableLink/TableLink.js');
+var TableLink = require('../../TableLink/TableLink.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 const ROWS = 3;
@@ -15,6 +15,7 @@ const MONTH_ONLY_FORMAT = {
 };
 const MonthCalendarTable = ({
   selectedDate,
+  focusedDate,
   min,
   max,
   viewYear,
@@ -30,7 +31,8 @@ const MonthCalendarTable = ({
       type: "month",
       title: formatting.formatDate(new Date(viewYear, month), locale, MONTH_ONLY_FORMAT),
       active: isActive(month),
-      disabled: isDisabled(month),
+      outOfRange: isDisabled(month),
+      disabled: false,
       today: viewYear === new Date().getFullYear() && month === new Date().getMonth(),
       autofocus: autofocusMonth === month,
       onClick: onSelect
@@ -39,6 +41,9 @@ const MonthCalendarTable = ({
   const isActive = month => {
     return !!(month === selectedDate?.getMonth() && viewYear === selectedDate?.getFullYear());
   };
+  const isFocused = month => {
+    return !!(month === focusedDate?.getMonth() && viewYear === focusedDate?.getFullYear());
+  };
   const isThisMonth = month => {
     return viewYear === new Date().getFullYear() && month === new Date().getMonth();
   };
@@ -51,7 +56,7 @@ const MonthCalendarTable = ({
       length: ROWS * COLS
     }, (_, index) => index);
     return GetFocusableTime.getFocusableTime({
-      isActive,
+      isActive: isFocused,
       isNow: isThisMonth,
       isDisabled,
       timeSpan: months

package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"MonthCalendarTable.js","sources":["../../../../src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../tableLink';\n\ninterface MonthCalendarTableProps {\n  selectedDate: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewYear: number;\n  placeholder?: string;\n  onSelect: (date: number) => void;\n}\n\nconst ROWS = 3;\nconst COLS = 4;\nconst MONTH_ONLY_FORMAT: Intl.DateTimeFormatOptions = { month: 'short' };\n\nconst MonthCalendarTable = ({\n  selectedDate,\n  min,\n  max,\n  viewYear,\n  placeholder,\n  onSelect,\n}: MonthCalendarTableProps) => {\n  const { locale } = useIntl();\n\n  const getLink = (month: number) => {\n    return (\n      <TableLink\n        item={month}\n        type=\"month\"\n        title={formatDate(new Date(viewYear, month), locale, MONTH_ONLY_FORMAT)}\n        active={isActive(month)}\n        disabled={isDisabled(month)}\n        today={viewYear === new Date().getFullYear() && month === new Date().getMonth()}\n        autofocus={autofocusMonth === month}\n        onClick={onSelect}\n      />\n    );\n  };\n\n  const isActive = (month: number) => {\n    return !!(month === selectedDate?.getMonth() && viewYear === selectedDate?.getFullYear());\n  };\n\n  const isThisMonth = (month: number) => {\n    return viewYear === new Date().getFullYear() && month === new Date().getMonth();\n  };\n\n  const isDisabled = (month: number) => {\n    const date = new Date(viewYear, month);\n    return !!(\n      (min && date < new Date(min.getFullYear(), min.getMonth())) ||\n      (max && date > new Date(max.getFullYear(), max.getMonth()))\n    );\n  };\n\n  const autofocusMonth = (() => {\n    const months = Array.from({ length: ROWS * COLS }, (_, index) => index);\n    return getFocusableTime({ isActive, isNow: isThisMonth, isDisabled, timeSpan: months });\n  })();\n\n  return (\n    <table className=\"table table-condensed table-bordered tw-date-lookup-calendar np-text-body-default-bold m-b-0\">\n      <thead className=\"sr-only\">\n        <tr>\n          <th colSpan={COLS}>{placeholder}</th>\n        </tr>\n      </thead>\n      <tbody>\n        {Array.from({ length: ROWS }, (_, rowIndex) => (\n          <tr key={rowIndex}>\n            {Array.from({ length: COLS }, (_, colIndex) => (\n              <td key={colIndex}>{getLink(rowIndex * COLS + colIndex)}</td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n\nexport default MonthCalendarTable;\n"],"names":["ROWS","COLS","MONTH_ONLY_FORMAT","month","MonthCalendarTable","selectedDate","min","max","viewYear","placeholder","onSelect","locale","useIntl","getLink","_jsx","TableLink","item","type","title","formatDate","Date","active","isActive","disabled","isDisabled","today","getFullYear","getMonth","autofocus","autofocusMonth","onClick","isThisMonth","date","months","Array","from","length","_","index","getFocusableTime","isNow","timeSpan","_jsxs","className","children","colSpan","rowIndex","colIndex"],"mappings":"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"}
+{"version":3,"file":"MonthCalendarTable.js","sources":["../../../../src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../TableLink';\n\ninterface MonthCalendarTableProps {\n  selectedDate: Date | null;\n  focusedDate?: Date | null;\n  min: Date | null;\n  max: Date | null;\n  viewYear: number;\n  placeholder?: string;\n  onSelect: (date: number) => void;\n}\n\nconst ROWS = 3;\nconst COLS = 4;\nconst MONTH_ONLY_FORMAT: Intl.DateTimeFormatOptions = { month: 'short' };\n\nconst MonthCalendarTable = ({\n  selectedDate,\n  focusedDate,\n  min,\n  max,\n  viewYear,\n  placeholder,\n  onSelect,\n}: MonthCalendarTableProps) => {\n  const { locale } = useIntl();\n\n  const getLink = (month: number) => {\n    return (\n      <TableLink\n        item={month}\n        type=\"month\"\n        title={formatDate(new Date(viewYear, month), locale, MONTH_ONLY_FORMAT)}\n        active={isActive(month)}\n        outOfRange={isDisabled(month)}\n        disabled={false}\n        today={viewYear === new Date().getFullYear() && month === new Date().getMonth()}\n        autofocus={autofocusMonth === month}\n        onClick={onSelect}\n      />\n    );\n  };\n\n  const isActive = (month: number) => {\n    return !!(month === selectedDate?.getMonth() && viewYear === selectedDate?.getFullYear());\n  };\n\n  const isFocused = (month: number) => {\n    return !!(month === focusedDate?.getMonth() && viewYear === focusedDate?.getFullYear());\n  };\n\n  const isThisMonth = (month: number) => {\n    return viewYear === new Date().getFullYear() && month === new Date().getMonth();\n  };\n\n  const isDisabled = (month: number) => {\n    const date = new Date(viewYear, month);\n    return !!(\n      (min && date < new Date(min.getFullYear(), min.getMonth())) ||\n      (max && date > new Date(max.getFullYear(), max.getMonth()))\n    );\n  };\n\n  const autofocusMonth = (() => {\n    const months = Array.from({ length: ROWS * COLS }, (_, index) => index);\n    return getFocusableTime({\n      isActive: isFocused,\n      isNow: isThisMonth,\n      isDisabled,\n      timeSpan: months,\n    });\n  })();\n\n  return (\n    <table className=\"table table-condensed table-bordered tw-date-lookup-calendar np-text-body-default-bold m-b-0\">\n      <thead className=\"sr-only\">\n        <tr>\n          <th colSpan={COLS}>{placeholder}</th>\n        </tr>\n      </thead>\n      <tbody>\n        {Array.from({ length: ROWS }, (_, rowIndex) => (\n          <tr key={rowIndex}>\n            {Array.from({ length: COLS }, (_, colIndex) => (\n              <td key={colIndex}>{getLink(rowIndex * COLS + colIndex)}</td>\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n\nexport default MonthCalendarTable;\n"],"names":["ROWS","COLS","MONTH_ONLY_FORMAT","month","MonthCalendarTable","selectedDate","focusedDate","min","max","viewYear","placeholder","onSelect","locale","useIntl","getLink","_jsx","TableLink","item","type","title","formatDate","Date","active","isActive","outOfRange","isDisabled","disabled","today","getFullYear","getMonth","autofocus","autofocusMonth","onClick","isFocused","isThisMonth","date","months","Array","from","length","_","index","getFocusableTime","isNow","timeSpan","_jsxs","className","children","colSpan","rowIndex","colIndex"],"mappings":"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"}

package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.mjs

@@ -1,7 +1,7 @@
 import { formatDate } from '@transferwise/formatting';
 import { useIntl } from 'react-intl';
 import { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime.mjs';
-import TableLink from '../../tableLink/TableLink.mjs';
+import TableLink from '../../TableLink/TableLink.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 const ROWS = 3;
@@ -11,6 +11,7 @@ const MONTH_ONLY_FORMAT = {
 };
 const MonthCalendarTable = ({
   selectedDate,
+  focusedDate,
   min,
   max,
   viewYear,
@@ -26,7 +27,8 @@ const MonthCalendarTable = ({
       type: "month",
       title: formatDate(new Date(viewYear, month), locale, MONTH_ONLY_FORMAT),
       active: isActive(month),
-      disabled: isDisabled(month),
+      outOfRange: isDisabled(month),
+      disabled: false,
       today: viewYear === new Date().getFullYear() && month === new Date().getMonth(),
       autofocus: autofocusMonth === month,
       onClick: onSelect
@@ -35,6 +37,9 @@ const MonthCalendarTable = ({
   const isActive = month => {
     return !!(month === selectedDate?.getMonth() && viewYear === selectedDate?.getFullYear());
   };
+  const isFocused = month => {
+    return !!(month === focusedDate?.getMonth() && viewYear === focusedDate?.getFullYear());
+  };
   const isThisMonth = month => {
     return viewYear === new Date().getFullYear() && month === new Date().getMonth();
   };
@@ -47,7 +52,7 @@ const MonthCalendarTable = ({
       length: ROWS * COLS
     }, (_, index) => index);
     return getFocusableTime({
-      isActive,
+      isActive: isFocused,
       isNow: isThisMonth,
       isDisabled,
       timeSpan: months