@elliemae/ds-controlled-form 2.2.0 → 2.3.0-alpha.3

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/useKeyboardHandlers.js

@@ -1,20 +1,45 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var ControlledDateTimePickerCTX = require('../../../ControlledDateTimePickerCTX.js');
-var constants = require('../../../utils/constants.js');
-
-/* eslint-disable @typescript-eslint/indent */
-const useKeyboardHandlers = _ref => {
-  let {
-    handlePrevHour,
-    handleNextHour,
-    handlePrevMinute,
-    handleNextMinute,
-    handleTimeWheelBtnChangeMeridiem
-  } = _ref;
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var useKeyboardHandlers_exports = {};
+__export(useKeyboardHandlers_exports, {
+  useKeyboardHandlers: () => useKeyboardHandlers
+});
+var React = __toESM(require("react"));
+var import_react = require("react");
+var import_ControlledDateTimePickerCTX = require("../../../ControlledDateTimePickerCTX");
+var import_constants = require("../../../utils/constants");
+const useKeyboardHandlers = ({
+  handlePrevHour,
+  handleNextHour,
+  handlePrevMinute,
+  handleNextMinute,
+  handleTimeWheelBtnChangeMeridiem
+}) => {
   const {
     withAnyInputs,
     isWithTimeInputs,
@@ -37,304 +62,267 @@ const useKeyboardHandlers = _ref => {
     prevMeridiemBtnRef,
     currMeridiemBtnRef,
     nextMeridiemBtnRef
-  } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
-  const onHomeKeyDownInsideTimeWheel = React.useCallback(() => {
-    var _prevMonthBtnRef$curr, _prevMonthBtnRef$curr2, _currHourBtnRef$curre, _currHourBtnRef$curre2;
-
-    if (isWithCalendarToo) prevMonthBtnRef === null || prevMonthBtnRef === void 0 ? void 0 : (_prevMonthBtnRef$curr = prevMonthBtnRef.current) === null || _prevMonthBtnRef$curr === void 0 ? void 0 : (_prevMonthBtnRef$curr2 = _prevMonthBtnRef$curr.focus) === null || _prevMonthBtnRef$curr2 === void 0 ? void 0 : _prevMonthBtnRef$curr2.call(_prevMonthBtnRef$curr);else currHourBtnRef === null || currHourBtnRef === void 0 ? void 0 : (_currHourBtnRef$curre = currHourBtnRef.current) === null || _currHourBtnRef$curre === void 0 ? void 0 : (_currHourBtnRef$curre2 = _currHourBtnRef$curre.focus) === null || _currHourBtnRef$curre2 === void 0 ? void 0 : _currHourBtnRef$curre2.call(_currHourBtnRef$curre);
+  } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
+  const onHomeKeyDownInsideTimeWheel = (0, import_react.useCallback)(() => {
+    if (isWithCalendarToo)
+      prevMonthBtnRef?.current?.focus?.();
+    else
+      currHourBtnRef?.current?.focus?.();
   }, [currHourBtnRef, isWithCalendarToo, prevMonthBtnRef]);
-  const onEndKeyDownInsideTimeWheel = React.useCallback(() => {
-    var _currMeridiemBtnRef$c, _currMeridiemBtnRef$c2;
-
-    currMeridiemBtnRef === null || currMeridiemBtnRef === void 0 ? void 0 : (_currMeridiemBtnRef$c = currMeridiemBtnRef.current) === null || _currMeridiemBtnRef$c === void 0 ? void 0 : (_currMeridiemBtnRef$c2 = _currMeridiemBtnRef$c.focus) === null || _currMeridiemBtnRef$c2 === void 0 ? void 0 : _currMeridiemBtnRef$c2.call(_currMeridiemBtnRef$c);
+  const onEndKeyDownInsideTimeWheel = (0, import_react.useCallback)(() => {
+    currMeridiemBtnRef?.current?.focus?.();
   }, [currMeridiemBtnRef]);
-  const onHomeKeyDownTriggerIcon = React.useCallback(() => {
-    var _monthInputRef$curren, _monthInputRef$curren2, _hourInputRef$current, _hourInputRef$current2;
-
-    if (!hideDate) monthInputRef === null || monthInputRef === void 0 ? void 0 : (_monthInputRef$curren = monthInputRef.current) === null || _monthInputRef$curren === void 0 ? void 0 : (_monthInputRef$curren2 = _monthInputRef$curren.focus) === null || _monthInputRef$curren2 === void 0 ? void 0 : _monthInputRef$curren2.call(_monthInputRef$curren);else if (!hideTime) hourInputRef === null || hourInputRef === void 0 ? void 0 : (_hourInputRef$current = hourInputRef.current) === null || _hourInputRef$current === void 0 ? void 0 : (_hourInputRef$current2 = _hourInputRef$current.focus) === null || _hourInputRef$current2 === void 0 ? void 0 : _hourInputRef$current2.call(_hourInputRef$current);
+  const onHomeKeyDownTriggerIcon = (0, import_react.useCallback)(() => {
+    if (!hideDate)
+      monthInputRef?.current?.focus?.();
+    else if (!hideTime)
+      hourInputRef?.current?.focus?.();
   }, [hideDate, hideTime, monthInputRef, hourInputRef]);
-  const handlePickerIconKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndKeys.includes(key)) e.stopPropagation();
-    if (key === 'Home') onHomeKeyDownTriggerIcon();
-
-    if (key === 'Backspace' && withAnyInputs) {
-      var _meridiemInputRef$cur, _meridiemInputRef$cur2, _yearInputRef$current, _yearInputRef$current2;
-
-      if (isWithTimeInputs) meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur = meridiemInputRef.current) === null || _meridiemInputRef$cur === void 0 ? void 0 : (_meridiemInputRef$cur2 = _meridiemInputRef$cur.focus) === null || _meridiemInputRef$cur2 === void 0 ? void 0 : _meridiemInputRef$cur2.call(_meridiemInputRef$cur);else if (isWithDateInputs) yearInputRef === null || yearInputRef === void 0 ? void 0 : (_yearInputRef$current = yearInputRef.current) === null || _yearInputRef$current === void 0 ? void 0 : (_yearInputRef$current2 = _yearInputRef$current.focus) === null || _yearInputRef$current2 === void 0 ? void 0 : _yearInputRef$current2.call(_yearInputRef$current);
+  const handlePickerIconKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndKeys.includes(key))
+      e.stopPropagation();
+    if (key === "Home")
+      onHomeKeyDownTriggerIcon();
+    if (key === "Backspace" && withAnyInputs) {
+      if (isWithTimeInputs)
+        meridiemInputRef?.current?.focus?.();
+      else if (isWithDateInputs)
+        yearInputRef?.current?.focus?.();
     }
   }, [isWithDateInputs, isWithTimeInputs, meridiemInputRef, onHomeKeyDownTriggerIcon, withAnyInputs, yearInputRef]);
-  const handleCurrHourOnKeyDown = React.useCallback(e => {
-    const {
-      key,
-      shiftKey
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
+  const handleCurrHourOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key, shiftKey } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
     let didTriggerHourChange = false;
-
-    if (key === 'ArrowUp') {
+    if (key === "ArrowUp") {
       handlePrevHour(e);
       didTriggerHourChange = true;
     }
-
-    if (key === 'ArrowDown') {
+    if (key === "ArrowDown") {
       handleNextHour(e);
       didTriggerHourChange = true;
     }
-
-    if (key === 'ArrowRight') {
-      var _currMinutesBtnRef$cu, _currMinutesBtnRef$cu2;
-
-      currMinutesBtnRef === null || currMinutesBtnRef === void 0 ? void 0 : (_currMinutesBtnRef$cu = currMinutesBtnRef.current) === null || _currMinutesBtnRef$cu === void 0 ? void 0 : (_currMinutesBtnRef$cu2 = _currMinutesBtnRef$cu.focus) === null || _currMinutesBtnRef$cu2 === void 0 ? void 0 : _currMinutesBtnRef$cu2.call(_currMinutesBtnRef$cu);
+    if (key === "ArrowRight") {
+      currMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel(); // ensure the focus is in the correct button after up/down arrow
-
-    if (didTriggerHourChange) setTimeout(() => {
-      var _currHourBtnRef$curre3, _currHourBtnRef$curre4;
-
-      return currHourBtnRef === null || currHourBtnRef === void 0 ? void 0 : (_currHourBtnRef$curre3 = currHourBtnRef.current) === null || _currHourBtnRef$curre3 === void 0 ? void 0 : (_currHourBtnRef$curre4 = _currHourBtnRef$curre3.focus) === null || _currHourBtnRef$curre4 === void 0 ? void 0 : _currHourBtnRef$curre4.call(_currHourBtnRef$curre3);
-    }); // TAB CYCLE IMPLEMENTATION
-
-    if (!isControllerOnly) if (key === 'Tab' && shiftKey && !isWithCalendarToo) {
-      var _currMeridiemBtnRef$c3, _currMeridiemBtnRef$c4;
-
-      e.preventDefault();
-      currMeridiemBtnRef === null || currMeridiemBtnRef === void 0 ? void 0 : (_currMeridiemBtnRef$c3 = currMeridiemBtnRef.current) === null || _currMeridiemBtnRef$c3 === void 0 ? void 0 : (_currMeridiemBtnRef$c4 = _currMeridiemBtnRef$c3.focus) === null || _currMeridiemBtnRef$c4 === void 0 ? void 0 : _currMeridiemBtnRef$c4.call(_currMeridiemBtnRef$c3);
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
+    if (didTriggerHourChange)
+      setTimeout(() => currHourBtnRef?.current?.focus?.());
+    if (!isControllerOnly) {
+      if (key === "Tab" && shiftKey && !isWithCalendarToo) {
+        e.preventDefault();
+        currMeridiemBtnRef?.current?.focus?.();
+      }
     }
-  }, [currHourBtnRef, currMeridiemBtnRef, currMinutesBtnRef, handleNextHour, handlePrevHour, isControllerOnly, isWithCalendarToo, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  const handleCurrMinutesOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
+  }, [
+    currHourBtnRef,
+    currMeridiemBtnRef,
+    currMinutesBtnRef,
+    handleNextHour,
+    handlePrevHour,
+    isControllerOnly,
+    isWithCalendarToo,
+    onEndKeyDownInsideTimeWheel,
+    onHomeKeyDownInsideTimeWheel
+  ]);
+  const handleCurrMinutesOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
     let didTriggerMinuteChange = false;
-
-    if (key === 'ArrowUp') {
+    if (key === "ArrowUp") {
       handlePrevMinute(e);
       didTriggerMinuteChange = true;
     }
-
-    if (key === 'ArrowDown') {
+    if (key === "ArrowDown") {
       handleNextMinute(e);
       didTriggerMinuteChange = true;
     }
-
-    if (key === 'ArrowLeft') {
-      var _currHourBtnRef$curre5, _currHourBtnRef$curre6;
-
-      currHourBtnRef === null || currHourBtnRef === void 0 ? void 0 : (_currHourBtnRef$curre5 = currHourBtnRef.current) === null || _currHourBtnRef$curre5 === void 0 ? void 0 : (_currHourBtnRef$curre6 = _currHourBtnRef$curre5.focus) === null || _currHourBtnRef$curre6 === void 0 ? void 0 : _currHourBtnRef$curre6.call(_currHourBtnRef$curre5);
+    if (key === "ArrowLeft") {
+      currHourBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowRight') {
-      var _currMeridiemBtnRef$c5, _currMeridiemBtnRef$c6;
-
-      currMeridiemBtnRef === null || currMeridiemBtnRef === void 0 ? void 0 : (_currMeridiemBtnRef$c5 = currMeridiemBtnRef.current) === null || _currMeridiemBtnRef$c5 === void 0 ? void 0 : (_currMeridiemBtnRef$c6 = _currMeridiemBtnRef$c5.focus) === null || _currMeridiemBtnRef$c6 === void 0 ? void 0 : _currMeridiemBtnRef$c6.call(_currMeridiemBtnRef$c5);
+    if (key === "ArrowRight") {
+      currMeridiemBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel(); // ensure the focus is in the correct button after up/down arrow
-
-    if (didTriggerMinuteChange) setTimeout(() => {
-      var _currMinutesBtnRef$cu3, _currMinutesBtnRef$cu4;
-
-      return currMinutesBtnRef === null || currMinutesBtnRef === void 0 ? void 0 : (_currMinutesBtnRef$cu3 = currMinutesBtnRef.current) === null || _currMinutesBtnRef$cu3 === void 0 ? void 0 : (_currMinutesBtnRef$cu4 = _currMinutesBtnRef$cu3.focus) === null || _currMinutesBtnRef$cu4 === void 0 ? void 0 : _currMinutesBtnRef$cu4.call(_currMinutesBtnRef$cu3);
-    });
-  }, [onHomeKeyDownInsideTimeWheel, onEndKeyDownInsideTimeWheel, handlePrevMinute, handleNextMinute, currHourBtnRef, currMeridiemBtnRef, currMinutesBtnRef]);
-  const handleCurrMeridiemOnKeyDown = React.useCallback(e => {
-    const {
-      key,
-      shiftKey
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
+    if (didTriggerMinuteChange)
+      setTimeout(() => currMinutesBtnRef?.current?.focus?.());
+  }, [
+    onHomeKeyDownInsideTimeWheel,
+    onEndKeyDownInsideTimeWheel,
+    handlePrevMinute,
+    handleNextMinute,
+    currHourBtnRef,
+    currMeridiemBtnRef,
+    currMinutesBtnRef
+  ]);
+  const handleCurrMeridiemOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key, shiftKey } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
     let didTriggerMeridiemChange = false;
-
-    if (key === 'ArrowUp') {
-      handleTimeWheelBtnChangeMeridiem('AM', e);
+    if (key === "ArrowUp") {
+      handleTimeWheelBtnChangeMeridiem("AM", e);
       didTriggerMeridiemChange = true;
     }
-
-    if (key === 'ArrowDown') {
-      handleTimeWheelBtnChangeMeridiem('PM', e);
+    if (key === "ArrowDown") {
+      handleTimeWheelBtnChangeMeridiem("PM", e);
       didTriggerMeridiemChange = true;
     }
-
-    if (key === 'ArrowLeft') {
-      var _currMinutesBtnRef$cu5, _currMinutesBtnRef$cu6;
-
-      // currSecondsBtnRef?.current?.focus?.();
-      currMinutesBtnRef === null || currMinutesBtnRef === void 0 ? void 0 : (_currMinutesBtnRef$cu5 = currMinutesBtnRef.current) === null || _currMinutesBtnRef$cu5 === void 0 ? void 0 : (_currMinutesBtnRef$cu6 = _currMinutesBtnRef$cu5.focus) === null || _currMinutesBtnRef$cu6 === void 0 ? void 0 : _currMinutesBtnRef$cu6.call(_currMinutesBtnRef$cu5);
+    if (key === "ArrowLeft") {
+      currMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel(); // ensure the focus is in the correct button after up/down arrow
-
-    if (didTriggerMeridiemChange) setTimeout(() => {
-      var _currMeridiemBtnRef$c7, _currMeridiemBtnRef$c8;
-
-      return currMeridiemBtnRef === null || currMeridiemBtnRef === void 0 ? void 0 : (_currMeridiemBtnRef$c7 = currMeridiemBtnRef.current) === null || _currMeridiemBtnRef$c7 === void 0 ? void 0 : (_currMeridiemBtnRef$c8 = _currMeridiemBtnRef$c7.focus) === null || _currMeridiemBtnRef$c8 === void 0 ? void 0 : _currMeridiemBtnRef$c8.call(_currMeridiemBtnRef$c7);
-    }); // TAB CYCLE IMPLEMENTATION
-
-    if (!isControllerOnly) if (key === 'Tab' && !shiftKey) {
-      var _prevMonthBtnRef$curr3, _prevMonthBtnRef$curr4, _currHourBtnRef$curre7, _currHourBtnRef$curre8;
-
-      e.preventDefault();
-      if (isWithCalendarToo) prevMonthBtnRef === null || prevMonthBtnRef === void 0 ? void 0 : (_prevMonthBtnRef$curr3 = prevMonthBtnRef.current) === null || _prevMonthBtnRef$curr3 === void 0 ? void 0 : (_prevMonthBtnRef$curr4 = _prevMonthBtnRef$curr3.focus) === null || _prevMonthBtnRef$curr4 === void 0 ? void 0 : _prevMonthBtnRef$curr4.call(_prevMonthBtnRef$curr3);else currHourBtnRef === null || currHourBtnRef === void 0 ? void 0 : (_currHourBtnRef$curre7 = currHourBtnRef.current) === null || _currHourBtnRef$curre7 === void 0 ? void 0 : (_currHourBtnRef$curre8 = _currHourBtnRef$curre7.focus) === null || _currHourBtnRef$curre8 === void 0 ? void 0 : _currHourBtnRef$curre8.call(_currHourBtnRef$curre7);
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
+    if (didTriggerMeridiemChange)
+      setTimeout(() => currMeridiemBtnRef?.current?.focus?.());
+    if (!isControllerOnly) {
+      if (key === "Tab" && !shiftKey) {
+        e.preventDefault();
+        if (isWithCalendarToo)
+          prevMonthBtnRef?.current?.focus?.();
+        else
+          currHourBtnRef?.current?.focus?.();
+      }
     }
-  }, [currHourBtnRef, currMeridiemBtnRef, currMinutesBtnRef, handleTimeWheelBtnChangeMeridiem, isControllerOnly, isWithCalendarToo, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevMonthBtnRef]);
-  const handlePrevHourBtnOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-
-    if (key === 'ArrowRight') {
-      var _prevMinutesBtnRef$cu, _prevMinutesBtnRef$cu2;
-
-      prevMinutesBtnRef === null || prevMinutesBtnRef === void 0 ? void 0 : (_prevMinutesBtnRef$cu = prevMinutesBtnRef.current) === null || _prevMinutesBtnRef$cu === void 0 ? void 0 : (_prevMinutesBtnRef$cu2 = _prevMinutesBtnRef$cu.focus) === null || _prevMinutesBtnRef$cu2 === void 0 ? void 0 : _prevMinutesBtnRef$cu2.call(_prevMinutesBtnRef$cu);
+  }, [
+    currHourBtnRef,
+    currMeridiemBtnRef,
+    currMinutesBtnRef,
+    handleTimeWheelBtnChangeMeridiem,
+    isControllerOnly,
+    isWithCalendarToo,
+    onEndKeyDownInsideTimeWheel,
+    onHomeKeyDownInsideTimeWheel,
+    prevMonthBtnRef
+  ]);
+  const handlePrevHourBtnOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
+    if (key === "ArrowRight") {
+      prevMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowDown') {
-      var _currHourBtnRef$curre9, _currHourBtnRef$curre10;
-
-      currHourBtnRef === null || currHourBtnRef === void 0 ? void 0 : (_currHourBtnRef$curre9 = currHourBtnRef.current) === null || _currHourBtnRef$curre9 === void 0 ? void 0 : (_currHourBtnRef$curre10 = _currHourBtnRef$curre9.focus) === null || _currHourBtnRef$curre10 === void 0 ? void 0 : _currHourBtnRef$curre10.call(_currHourBtnRef$curre9);
+    if (key === "ArrowDown") {
+      currHourBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
   }, [currHourBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevMinutesBtnRef]);
-  const handlePrevMinuteBtnOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-
-    if (key === 'ArrowRight') {
-      var _prevMeridiemBtnRef$c, _prevMeridiemBtnRef$c2;
-
-      // prevSecondsBtnRef?.current?.focus?.();
-      prevMeridiemBtnRef === null || prevMeridiemBtnRef === void 0 ? void 0 : (_prevMeridiemBtnRef$c = prevMeridiemBtnRef.current) === null || _prevMeridiemBtnRef$c === void 0 ? void 0 : (_prevMeridiemBtnRef$c2 = _prevMeridiemBtnRef$c.focus) === null || _prevMeridiemBtnRef$c2 === void 0 ? void 0 : _prevMeridiemBtnRef$c2.call(_prevMeridiemBtnRef$c);
+  const handlePrevMinuteBtnOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
+    if (key === "ArrowRight") {
+      prevMeridiemBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowLeft') {
-      var _prevHourBtnRef$curre, _prevHourBtnRef$curre2;
-
-      prevHourBtnRef === null || prevHourBtnRef === void 0 ? void 0 : (_prevHourBtnRef$curre = prevHourBtnRef.current) === null || _prevHourBtnRef$curre === void 0 ? void 0 : (_prevHourBtnRef$curre2 = _prevHourBtnRef$curre.focus) === null || _prevHourBtnRef$curre2 === void 0 ? void 0 : _prevHourBtnRef$curre2.call(_prevHourBtnRef$curre);
+    if (key === "ArrowLeft") {
+      prevHourBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowDown') {
-      var _currMinutesBtnRef$cu7, _currMinutesBtnRef$cu8;
-
-      currMinutesBtnRef === null || currMinutesBtnRef === void 0 ? void 0 : (_currMinutesBtnRef$cu7 = currMinutesBtnRef.current) === null || _currMinutesBtnRef$cu7 === void 0 ? void 0 : (_currMinutesBtnRef$cu8 = _currMinutesBtnRef$cu7.focus) === null || _currMinutesBtnRef$cu8 === void 0 ? void 0 : _currMinutesBtnRef$cu8.call(_currMinutesBtnRef$cu7);
+    if (key === "ArrowDown") {
+      currMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
   }, [currMinutesBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevHourBtnRef, prevMeridiemBtnRef]);
-  const handlePrevMeridiemBtnOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-
-    if (key === 'ArrowLeft') {
-      var _prevMinutesBtnRef$cu3, _prevMinutesBtnRef$cu4;
-
-      prevMinutesBtnRef === null || prevMinutesBtnRef === void 0 ? void 0 : (_prevMinutesBtnRef$cu3 = prevMinutesBtnRef.current) === null || _prevMinutesBtnRef$cu3 === void 0 ? void 0 : (_prevMinutesBtnRef$cu4 = _prevMinutesBtnRef$cu3.focus) === null || _prevMinutesBtnRef$cu4 === void 0 ? void 0 : _prevMinutesBtnRef$cu4.call(_prevMinutesBtnRef$cu3);
+  const handlePrevMeridiemBtnOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
+    if (key === "ArrowLeft") {
+      prevMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowDown') {
-      var _currMeridiemBtnRef$c9, _currMeridiemBtnRef$c10;
-
-      currMeridiemBtnRef === null || currMeridiemBtnRef === void 0 ? void 0 : (_currMeridiemBtnRef$c9 = currMeridiemBtnRef.current) === null || _currMeridiemBtnRef$c9 === void 0 ? void 0 : (_currMeridiemBtnRef$c10 = _currMeridiemBtnRef$c9.focus) === null || _currMeridiemBtnRef$c10 === void 0 ? void 0 : _currMeridiemBtnRef$c10.call(_currMeridiemBtnRef$c9);
+    if (key === "ArrowDown") {
+      currMeridiemBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
   }, [currMeridiemBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevMinutesBtnRef]);
-  const handleNextHourBtnOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-
-    if (key === 'ArrowRight') {
-      var _nextMinutesBtnRef$cu, _nextMinutesBtnRef$cu2;
-
-      nextMinutesBtnRef === null || nextMinutesBtnRef === void 0 ? void 0 : (_nextMinutesBtnRef$cu = nextMinutesBtnRef.current) === null || _nextMinutesBtnRef$cu === void 0 ? void 0 : (_nextMinutesBtnRef$cu2 = _nextMinutesBtnRef$cu.focus) === null || _nextMinutesBtnRef$cu2 === void 0 ? void 0 : _nextMinutesBtnRef$cu2.call(_nextMinutesBtnRef$cu);
+  const handleNextHourBtnOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
+    if (key === "ArrowRight") {
+      nextMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowUp') {
-      var _currHourBtnRef$curre11, _currHourBtnRef$curre12;
-
-      currHourBtnRef === null || currHourBtnRef === void 0 ? void 0 : (_currHourBtnRef$curre11 = currHourBtnRef.current) === null || _currHourBtnRef$curre11 === void 0 ? void 0 : (_currHourBtnRef$curre12 = _currHourBtnRef$curre11.focus) === null || _currHourBtnRef$curre12 === void 0 ? void 0 : _currHourBtnRef$curre12.call(_currHourBtnRef$curre11);
+    if (key === "ArrowUp") {
+      currHourBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
   }, [currHourBtnRef, nextMinutesBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  const handleNextMinuteBtnOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-
-    if (key === 'ArrowRight') {
-      var _nextMeridiemBtnRef$c, _nextMeridiemBtnRef$c2;
-
-      nextMeridiemBtnRef === null || nextMeridiemBtnRef === void 0 ? void 0 : (_nextMeridiemBtnRef$c = nextMeridiemBtnRef.current) === null || _nextMeridiemBtnRef$c === void 0 ? void 0 : (_nextMeridiemBtnRef$c2 = _nextMeridiemBtnRef$c.focus) === null || _nextMeridiemBtnRef$c2 === void 0 ? void 0 : _nextMeridiemBtnRef$c2.call(_nextMeridiemBtnRef$c);
+  const handleNextMinuteBtnOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
+    if (key === "ArrowRight") {
+      nextMeridiemBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowLeft') {
-      var _nextHourBtnRef$curre, _nextHourBtnRef$curre2;
-
-      nextHourBtnRef === null || nextHourBtnRef === void 0 ? void 0 : (_nextHourBtnRef$curre = nextHourBtnRef.current) === null || _nextHourBtnRef$curre === void 0 ? void 0 : (_nextHourBtnRef$curre2 = _nextHourBtnRef$curre.focus) === null || _nextHourBtnRef$curre2 === void 0 ? void 0 : _nextHourBtnRef$curre2.call(_nextHourBtnRef$curre);
+    if (key === "ArrowLeft") {
+      nextHourBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowUp') {
-      var _currMinutesBtnRef$cu9, _currMinutesBtnRef$cu10;
-
-      currMinutesBtnRef === null || currMinutesBtnRef === void 0 ? void 0 : (_currMinutesBtnRef$cu9 = currMinutesBtnRef.current) === null || _currMinutesBtnRef$cu9 === void 0 ? void 0 : (_currMinutesBtnRef$cu10 = _currMinutesBtnRef$cu9.focus) === null || _currMinutesBtnRef$cu10 === void 0 ? void 0 : _currMinutesBtnRef$cu10.call(_currMinutesBtnRef$cu9);
+    if (key === "ArrowUp") {
+      currMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
   }, [currMinutesBtnRef, nextHourBtnRef, nextMeridiemBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  const handleNextMeridiemBtnOnKeyDown = React.useCallback(e => {
-    const {
-      key
-    } = e;
-    if (constants.homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (constants.homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-
-    if (key === 'ArrowLeft') {
-      var _nextMinutesBtnRef$cu3, _nextMinutesBtnRef$cu4;
-
-      nextMinutesBtnRef === null || nextMinutesBtnRef === void 0 ? void 0 : (_nextMinutesBtnRef$cu3 = nextMinutesBtnRef.current) === null || _nextMinutesBtnRef$cu3 === void 0 ? void 0 : (_nextMinutesBtnRef$cu4 = _nextMinutesBtnRef$cu3.focus) === null || _nextMinutesBtnRef$cu4 === void 0 ? void 0 : _nextMinutesBtnRef$cu4.call(_nextMinutesBtnRef$cu3);
+  const handleNextMeridiemBtnOnKeyDown = (0, import_react.useCallback)((e) => {
+    const { key } = e;
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.preventDefault();
+    if (import_constants.homeEndAllArrowKeys.includes(key))
+      e.stopPropagation();
+    if (key === "ArrowLeft") {
+      nextMinutesBtnRef?.current?.focus?.();
     }
-
-    if (key === 'ArrowUp') {
-      var _currMeridiemBtnRef$c11, _currMeridiemBtnRef$c12;
-
-      currMeridiemBtnRef === null || currMeridiemBtnRef === void 0 ? void 0 : (_currMeridiemBtnRef$c11 = currMeridiemBtnRef.current) === null || _currMeridiemBtnRef$c11 === void 0 ? void 0 : (_currMeridiemBtnRef$c12 = _currMeridiemBtnRef$c11.focus) === null || _currMeridiemBtnRef$c12 === void 0 ? void 0 : _currMeridiemBtnRef$c12.call(_currMeridiemBtnRef$c11);
+    if (key === "ArrowUp") {
+      currMeridiemBtnRef?.current?.focus?.();
     }
-
-    if (key === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
+    if (key === "Home")
+      onHomeKeyDownInsideTimeWheel();
+    if (key === "End")
+      onEndKeyDownInsideTimeWheel();
   }, [currMeridiemBtnRef, nextMinutesBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  return React.useMemo(() => ({
+  return (0, import_react.useMemo)(() => ({
     handlePrevHourBtnOnKeyDown,
     handleCurrHourOnKeyDown,
     handleNextHourBtnOnKeyDown,
@@ -345,7 +333,18 @@ const useKeyboardHandlers = _ref => {
     handleCurrMeridiemOnKeyDown,
     handleNextMeridiemBtnOnKeyDown,
     handlePickerIconKeyDown
-  }), [handleCurrHourOnKeyDown, handleCurrMeridiemOnKeyDown, handleCurrMinutesOnKeyDown, handleNextHourBtnOnKeyDown, handleNextMeridiemBtnOnKeyDown, handleNextMinuteBtnOnKeyDown, handlePrevHourBtnOnKeyDown, handlePrevMeridiemBtnOnKeyDown, handlePrevMinuteBtnOnKeyDown, handlePickerIconKeyDown]);
+  }), [
+    handleCurrHourOnKeyDown,
+    handleCurrMeridiemOnKeyDown,
+    handleCurrMinutesOnKeyDown,
+    handleNextHourBtnOnKeyDown,
+    handleNextMeridiemBtnOnKeyDown,
+    handleNextMinuteBtnOnKeyDown,
+    handlePrevHourBtnOnKeyDown,
+    handlePrevMeridiemBtnOnKeyDown,
+    handlePrevMinuteBtnOnKeyDown,
+    handlePickerIconKeyDown
+  ]);
 };
-
-exports.useKeyboardHandlers = useKeyboardHandlers;
+module.exports = __toCommonJS(useKeyboardHandlers_exports);
+//# sourceMappingURL=useKeyboardHandlers.js.map