feat(CalendarView): cellFocusable prop

Author: dandmechenko

src/components/Calendar/README.md

@@ -183,6 +183,7 @@ LANDING_BLOCK-->
 | aria-label                            | The control's `aria-label` attribute                                                                                 |                             `string`                             |                                                             |
 | aria-labelledby                       | The control's `aria-labelledby` attribute                                                                            |                             `string`                             |                                                             |
 | autoFocus                             | The control's `autofocus` attribute                                                                                  |                            `boolean`                             |                                                             |
+| cellFocusable                         | The control's `cellFocusable` attribute                                                                              |                            `boolean`                             |                                                             |
 | className                             | The control's wrapper class name                                                                                     |                             `string`                             |                                                             |
 | [defaultFocusedValue](#focused-value) | The date that is focused when the calendar first mounts (uncontrolled)                                               |                            `DateTime`                            |                                                             |
 | [defaultMode](#mode)                  | Initial mode to show in calendar                                                                                     |                `days` `months` `quarters` `years`                |                                                             |

src/components/CalendarView/hooks/types.ts

@@ -25,6 +25,10 @@ export interface CalendarStateOptionsBase extends InputBase {
     autoFocus?: boolean;
     /** Controls the currently focused date within the calendar. */
     focusedValue?: DateTime | null;
+    /** Whether to automatically focus the cell
+     * * @default true
+     */
+    cellFocusable?: boolean;
     /** The date that is focused when the calendar first mounts (uncontrolled). */
     defaultFocusedValue?: DateTime;
     /** Handler that is called when the focused date changes. */

src/components/CalendarView/hooks/useCalendarState.ts

@@ -46,6 +46,8 @@ export function useCalendarState(props: CalendarStateOptions): CalendarState {
     );
     const timeZone = props.timeZone || inputTimeZone;
 
+    const cellFocusable = props.cellFocusable ?? true;
+
     const minValue = React.useMemo(
         () => (props.minValue ? props.minValue.timeZone(timeZone) : undefined),
         [timeZone, props.minValue],
@@ -225,7 +227,12 @@ export function useCalendarState(props: CalendarStateOptions): CalendarState {
             }
         },
         isCellFocused(date: DateTime) {
-            return this.isFocused && focusedDate && date.isSame(focusedDate, currentMode);
+            return (
+                cellFocusable &&
+                this.isFocused &&
+                focusedDate &&
+                date.isSame(focusedDate, currentMode)
+            );
         },
         isCellDisabled(date: DateTime) {
             return this.disabled || this.isInvalid(date);