@elliemae/ds-controlled-form 3.0.0-next.2 → 3.0.0-next.3

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

@@ -1,347 +0,0 @@
-import { useContext, useCallback, useMemo } from 'react';
-import { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';
-import { homeEndKeys, homeEndAllArrowKeys } from '../../../utils/constants.js';
-
-/* eslint-disable @typescript-eslint/indent */
-const useKeyboardHandlers = _ref => {
-  let {
-    handlePrevHour,
-    handleNextHour,
-    handlePrevMinute,
-    handleNextMinute,
-    handleTimeWheelBtnChangeMeridiem
-  } = _ref;
-  const {
-    withAnyInputs,
-    isWithTimeInputs,
-    isWithDateInputs,
-    isWithCalendarToo,
-    isControllerOnly,
-    hideDate,
-    hideTime,
-    monthInputRef,
-    hourInputRef,
-    meridiemInputRef,
-    yearInputRef,
-    prevMonthBtnRef,
-    prevHourBtnRef,
-    currHourBtnRef,
-    nextHourBtnRef,
-    prevMinutesBtnRef,
-    currMinutesBtnRef,
-    nextMinutesBtnRef,
-    prevMeridiemBtnRef,
-    currMeridiemBtnRef,
-    nextMeridiemBtnRef
-  } = useContext(ControlledDateTimePickerContext);
-  const onHomeKeyDownInsideTimeWheel = 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);
-  }, [currHourBtnRef, isWithCalendarToo, prevMonthBtnRef]);
-  const onEndKeyDownInsideTimeWheel = 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);
-  }, [currMeridiemBtnRef]);
-  const onHomeKeyDownTriggerIcon = 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);
-  }, [hideDate, hideTime, monthInputRef, hourInputRef]);
-  const handlePickerIconKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-  }, [isWithDateInputs, isWithTimeInputs, meridiemInputRef, onHomeKeyDownTriggerIcon, withAnyInputs, yearInputRef]);
-  const handleCurrHourOnKeyDown = useCallback(e => {
-    const {
-      key,
-      shiftKey
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-    let didTriggerHourChange = false;
-
-    if (key === 'ArrowUp') {
-      handlePrevHour(e);
-      didTriggerHourChange = true;
-    }
-
-    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 === '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);
-    }
-  }, [currHourBtnRef, currMeridiemBtnRef, currMinutesBtnRef, handleNextHour, handlePrevHour, isControllerOnly, isWithCalendarToo, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  const handleCurrMinutesOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-    let didTriggerMinuteChange = false;
-
-    if (key === 'ArrowUp') {
-      handlePrevMinute(e);
-      didTriggerMinuteChange = true;
-    }
-
-    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 === '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 === '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 = useCallback(e => {
-    const {
-      key,
-      shiftKey
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (homeEndAllArrowKeys.includes(key)) e.stopPropagation();
-    let didTriggerMeridiemChange = false;
-
-    if (key === 'ArrowUp') {
-      handleTimeWheelBtnChangeMeridiem('AM', e);
-      didTriggerMeridiemChange = true;
-    }
-
-    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 === '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);
-    }
-  }, [currHourBtnRef, currMeridiemBtnRef, currMinutesBtnRef, handleTimeWheelBtnChangeMeridiem, isControllerOnly, isWithCalendarToo, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevMonthBtnRef]);
-  const handlePrevHourBtnOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-
-    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 === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
-  }, [currHourBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevMinutesBtnRef]);
-  const handlePrevMinuteBtnOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-
-    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 === '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 === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
-  }, [currMinutesBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevHourBtnRef, prevMeridiemBtnRef]);
-  const handlePrevMeridiemBtnOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-
-    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 === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
-  }, [currMeridiemBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel, prevMinutesBtnRef]);
-  const handleNextHourBtnOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-
-    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 === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
-  }, [currHourBtnRef, nextMinutesBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  const handleNextMinuteBtnOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-
-    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 === '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 === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
-  }, [currMinutesBtnRef, nextHourBtnRef, nextMeridiemBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  const handleNextMeridiemBtnOnKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-    if (homeEndAllArrowKeys.includes(key)) e.preventDefault();
-    if (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);
-    }
-
-    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 === 'Home') onHomeKeyDownInsideTimeWheel();
-    if (key === 'End') onEndKeyDownInsideTimeWheel();
-  }, [currMeridiemBtnRef, nextMinutesBtnRef, onEndKeyDownInsideTimeWheel, onHomeKeyDownInsideTimeWheel]);
-  return useMemo(() => ({
-    handlePrevHourBtnOnKeyDown,
-    handleCurrHourOnKeyDown,
-    handleNextHourBtnOnKeyDown,
-    handlePrevMinuteBtnOnKeyDown,
-    handleCurrMinutesOnKeyDown,
-    handleNextMinuteBtnOnKeyDown,
-    handlePrevMeridiemBtnOnKeyDown,
-    handleCurrMeridiemOnKeyDown,
-    handleNextMeridiemBtnOnKeyDown,
-    handlePickerIconKeyDown
-  }), [handleCurrHourOnKeyDown, handleCurrMeridiemOnKeyDown, handleCurrMinutesOnKeyDown, handleNextHourBtnOnKeyDown, handleNextMeridiemBtnOnKeyDown, handleNextMinuteBtnOnKeyDown, handlePrevHourBtnOnKeyDown, handlePrevMeridiemBtnOnKeyDown, handlePrevMinuteBtnOnKeyDown, handlePickerIconKeyDown]);
-};
-
-export { useKeyboardHandlers };

package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/usePopperTriggerLogic.js

@@ -1,80 +0,0 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
-import { useContext, useState, useCallback, useMemo } from 'react';
-import { usePopper } from 'react-popper';
-import { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';
-import { useOnClickOutside } from '../../../utils/hooks/useOnClickOutside.js';
-
-const usePopperTriggerLogic = () => {
-  const {
-    pickerButtonRef,
-    props: {
-      onPickerClose,
-      onPickerOpen
-    },
-    currHourBtnRef,
-    isWithCalendarToo
-  } = useContext(ControlledDateTimePickerContext);
-  const [showTimePicker, setShowTimePicker] = useState(false);
-  const [referenceElement, setReferenceElement] = useState(null);
-  const [popperElement, setPopperElement] = useState(null);
-  const [arrowElement, setArrowElement] = useState(null);
-  const usePopperHelpers = usePopper(referenceElement, popperElement, {
-    modifiers: [{
-      name: 'arrow',
-      options: {
-        element: arrowElement
-      }
-    }]
-  });
-  const closeTimePicker = useCallback(() => {
-    setShowTimePicker(false);
-    onPickerClose();
-  }, [onPickerClose]);
-  const handleToggleTimePicker = useCallback(() => {
-    setShowTimePicker(oldShowCalendar => {
-      if (!oldShowCalendar) {
-        onPickerOpen();
-        if (!isWithCalendarToo) setTimeout(() => {
-          var _currHourBtnRef$curre, _currHourBtnRef$curre2;
-
-          return 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);
-        });
-      } else onPickerClose();
-
-      return !oldShowCalendar;
-    });
-  }, [currHourBtnRef, isWithCalendarToo, onPickerClose, onPickerOpen]);
-  useOnClickOutside(popperElement, e => {
-    var _pickerButtonRef$curr, _pickerButtonRef$curr2;
-
-    if (!(pickerButtonRef !== null && pickerButtonRef !== void 0 && (_pickerButtonRef$curr = pickerButtonRef.current) !== null && _pickerButtonRef$curr !== void 0 && (_pickerButtonRef$curr2 = _pickerButtonRef$curr.contains) !== null && _pickerButtonRef$curr2 !== void 0 && _pickerButtonRef$curr2.call(_pickerButtonRef$curr, e === null || e === void 0 ? void 0 : e.target))) closeTimePicker();
-  });
-  const handleSetTriggerRef = useCallback(newRef => {
-    pickerButtonRef.current = newRef;
-    setReferenceElement(newRef);
-  }, [pickerButtonRef]);
-  const handleMenuWrapperKeyDown = useCallback(e => {
-    const {
-      key
-    } = e;
-
-    if (key === 'Escape') {
-      var _pickerButtonRef$curr3, _pickerButtonRef$curr4;
-
-      closeTimePicker();
-      pickerButtonRef === null || pickerButtonRef === void 0 ? void 0 : (_pickerButtonRef$curr3 = pickerButtonRef.current) === null || _pickerButtonRef$curr3 === void 0 ? void 0 : (_pickerButtonRef$curr4 = _pickerButtonRef$curr3.focus) === null || _pickerButtonRef$curr4 === void 0 ? void 0 : _pickerButtonRef$curr4.call(_pickerButtonRef$curr3);
-    }
-  }, [closeTimePicker, pickerButtonRef]);
-  return useMemo(() => ({
-    showTimePicker,
-    setShowTimePicker,
-    setPopperElement,
-    setArrowElement,
-    usePopperHelpers,
-    handleToggleTimePicker,
-    handleSetTriggerRef,
-    handleMenuWrapperKeyDown
-  }), [handleMenuWrapperKeyDown, handleSetTriggerRef, handleToggleTimePicker, showTimePicker, usePopperHelpers]);
-};
-
-export { usePopperTriggerLogic };

package/esm/controlled-date-time-picker/parts/Styleds.js

@@ -1,102 +0,0 @@
-import styled from 'styled-components';
-import { Grid } from '@elliemae/ds-grid';
-import { DSButtonV2 } from '@elliemae/ds-button';
-
-/* eslint-disable max-lines */
-const ResettedInput = /*#__PURE__*/styled.input.withConfig({
-  componentId: "sc-1t4k08s-0"
-})(["border:none;box-shadow:none;background:none;text-align:center;height:100%;display:flex;align-items:center;:focus{outline:none;}padding-top:2px;"]);
-const StyledSeparator = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1t4k08s-1"
-})(["padding-top:2px;margin:auto;"]);
-const StyledColonSeparator = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1t4k08s-2"
-})(["padding-bottom:1px;margin:auto;"]);
-const Styled2DigitsInput = /*#__PURE__*/styled(ResettedInput).withConfig({
-  componentId: "sc-1t4k08s-3"
-})(["width:100%;height:100%;", ""], _ref => {
-  let {
-    disabled
-  } = _ref;
-  return disabled ? "color: #616b7f;" : "";
-});
-const StyledMin4DigitsInput = /*#__PURE__*/styled(ResettedInput).withConfig({
-  componentId: "sc-1t4k08s-4"
-})(["width:100%;height:100%;", ""], _ref2 => {
-  let {
-    disabled
-  } = _ref2;
-  return disabled ? "color: #616b7f;" : "";
-});
-const StyledInputsWrapperGrid = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1t4k08s-5"
-})(["width:max-content;align-items:center;", " border-color:", ";border-radius:2px;padding-left:", ";padding-right:", ";position:relative;", ""], _ref3 => {
-  let {
-    isControllerOnly
-  } = _ref3;
-  return isControllerOnly ? "" : "\n  height: 28px;    \n  border-width: 1px;\n  border-style: solid;\n  ";
-}, _ref4 => {
-  let {
-    theme,
-    hasError,
-    disabled
-  } = _ref4;
-  if (hasError) return theme.colors.danger[900];
-  if (disabled) return theme.colors.neutral[400];
-  return theme.colors.neutral[200];
-}, _ref5 => {
-  let {
-    justPicker
-  } = _ref5;
-  return justPicker ? '0' : '2px';
-}, _ref6 => {
-  let {
-    withAnyPicker
-  } = _ref6;
-  return withAnyPicker ? '' : '0';
-}, _ref7 => {
-  let {
-    theme,
-    disabled
-  } = _ref7;
-  return disabled ? "background-color: ".concat(theme.colors.neutral[100], ";") : "";
-});
-const StyledDateInputsWrapperGrid = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-1t4k08s-6"
-})(["display:grid;grid-template-columns:24px min-content 24px min-content 48px;grid-template-rows:min-content;padding:6px 0;gap:0px 0px;align-items:center;input,p{margin:0;}"]);
-const StyledTimeInputsWrapperGrid = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-1t4k08s-7"
-})(["display:grid;grid-template-columns:24px min-content 24px min-content 24px min-content 24px;grid-template-rows:min-content;padding:6px 0;gap:0px 0px;align-items:center;input,p{margin:0;}"]);
-const StyledPickersIconsWrapperGrid = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1t4k08s-8"
-})(["position:relative;", ":before{content:'';position:absolute;top:0px;left:-1px;width:100%;height:100%;border-radius:2px;z-index:-1;", "}"], _ref8 => {
-  let {
-    isControllerOnly
-  } = _ref8;
-  return isControllerOnly ? "" : "height: 26px;";
-}, _ref9 => {
-  let {
-    theme,
-    isControllerOnly,
-    hasError
-  } = _ref9;
-  return isControllerOnly ? "" : "\n    border-left: 1px solid ".concat(hasError ? theme.colors.danger[900] : theme.colors.neutral[200], "\n    ");
-});
-const StyledFocusWithIn = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1t4k08s-9"
-})(["position:relative;&:focus-within{&:after{display:block;content:' ';position:absolute;top:-5px;left:-2px;width:calc(100% + 4px);height:calc(100% + 10px);border:2px solid ", ";border-radius:2px;pointer-events:none;}}"], _ref10 => {
-  let {
-    theme
-  } = _ref10;
-  return theme.colors.brand[700];
-});
-const StyledClearButton = /*#__PURE__*/styled(DSButtonV2).withConfig({
-  componentId: "sc-1t4k08s-10"
-})(["height:26px;position:relative;visibility:", ";"], _ref11 => {
-  let {
-    shouldDisplay
-  } = _ref11;
-  return shouldDisplay ? 'visible' : 'hidden';
-});
-
-export { Styled2DigitsInput, StyledClearButton, StyledColonSeparator, StyledDateInputsWrapperGrid, StyledFocusWithIn, StyledInputsWrapperGrid, StyledMin4DigitsInput, StyledPickersIconsWrapperGrid, StyledSeparator, StyledTimeInputsWrapperGrid };

package/esm/controlled-date-time-picker/parts/TimeInputs/HHInput.js

@@ -1,53 +0,0 @@
-import React, { useCallback } from 'react';
-import { Styled2DigitsInput } from '../Styleds.js';
-import { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';
-import { jsx } from 'react/jsx-runtime';
-
-const regExpNumbers = /^[0-9]+$/;
-
-const isInvalidHour = hours => {
-  if (hours === '') return false;
-  const numberOnly = regExpNumbers.test(hours);
-  return hours.length > 2 || hours === '00' || !numberOnly || Number.parseInt(hours, 10) > 12;
-};
-
-const HHInput = /*#__PURE__*/React.memo(_ref => {
-  let {
-    onChange,
-    onBlur,
-    onFocus,
-    onKeyDown,
-    value,
-    disabled,
-    placeholder,
-    ariaCurrentValueForInputs,
-    contextRef,
-    autoFocusHourInput
-  } = _ref;
-  const validateOnChange = useCallback(e => {
-    var _e$target;
-
-    if (isInvalidHour(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
-      e.preventDefault();
-      return;
-    }
-
-    onChange(e);
-  }, [onChange]);
-  return /*#__PURE__*/jsx(Styled2DigitsInput, {
-    autoFocus: autoFocusHourInput,
-    onChange: validateOnChange,
-    onBlur: onBlur,
-    onFocus: onFocus,
-    onKeyDown: onKeyDown,
-    value: value,
-    ref: contextRef,
-    placeholder: placeholder,
-    "aria-label": "hours input field ".concat(ariaCurrentValueForInputs),
-    "data-testid": ControlledDateTimePickerDatatestid.TIME_INPUTS.HOUR,
-    disabled: disabled,
-    "aria-disabled": disabled
-  });
-});
-
-export { HHInput };

package/esm/controlled-date-time-picker/parts/TimeInputs/MeridiemInput.js

@@ -1,55 +0,0 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
-import React, { useCallback } from 'react';
-import { Styled2DigitsInput } from '../Styleds.js';
-import { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';
-import { jsx } from 'react/jsx-runtime';
-
-const validFirstDigits = ['a', 'A', 'p', 'P'];
-const validSecondDigits = ['m', 'M'];
-
-const isInvalidMeridiem = meridiem => {
-  if (meridiem === '') return false;
-  const [firstDigit, secondDigit] = meridiem === null || meridiem === void 0 ? void 0 : meridiem.split('');
-  const isValidFirstDigit = meridiem.length < 1 && !firstDigit || validFirstDigits.includes(firstDigit);
-  const isValidSecondDigit = !secondDigit || validSecondDigits.includes(secondDigit);
-  return meridiem.length > 2 || !isValidFirstDigit || !isValidSecondDigit;
-};
-
-const MeridiemInput = /*#__PURE__*/React.memo(_ref => {
-  let {
-    onChange,
-    onBlur,
-    onFocus,
-    onKeyDown,
-    value,
-    disabled,
-    placeholder,
-    ariaCurrentValueForInputs,
-    contextRef
-  } = _ref;
-  const validateOnChange = useCallback(e => {
-    var _e$target;
-
-    if (isInvalidMeridiem(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
-      e.preventDefault();
-      return;
-    }
-
-    onChange(e);
-  }, [onChange]);
-  return /*#__PURE__*/jsx(Styled2DigitsInput, {
-    onChange: validateOnChange,
-    onBlur: onBlur,
-    onFocus: onFocus,
-    onKeyDown: onKeyDown,
-    value: value,
-    ref: contextRef,
-    placeholder: placeholder,
-    "aria-label": "meridiem input field ".concat(ariaCurrentValueForInputs),
-    "data-testid": ControlledDateTimePickerDatatestid.TIME_INPUTS.MERIDIEM,
-    disabled: disabled,
-    "aria-disabled": disabled
-  });
-});
-
-export { MeridiemInput };