@elliemae/ds-controlled-form 2.3.1 → 3.0.0-alpha.3

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

@@ -1,32 +0,0 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import { useContext, useMemo } from 'react';
-import { DSButtonV2, BUTTON_SIZES } from '@elliemae/ds-button';
-import { RecentDocuments } from '@elliemae/ds-icons';
-import { TimeWheelContext } from './TimeWheelContext.js';
-import { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';
-
-var _RecentDocuments;
-// this is particularly useful due to how usePopper needs to check the references
-// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders
-
-const TimeWheelIconTrigger = () => {
-  const {
-    handleSetTriggerRef,
-    handleToggleTimePicker,
-    handlePickerIconKeyDown,
-    ariaCurrentValueForInputs,
-    disabled
-  } = useContext(TimeWheelContext);
-  return useMemo(() => /*#__PURE__*/_jsx(DSButtonV2, {
-    "aria-label": "time picker context menu trigger, ".concat(ariaCurrentValueForInputs),
-    buttonType: "icon",
-    size: BUTTON_SIZES.M,
-    innerRef: handleSetTriggerRef,
-    onClick: handleToggleTimePicker,
-    onKeyDown: handlePickerIconKeyDown,
-    "data-testid": ControlledDateTimePickerDatatestid.PICKER_ICONS.TIMEWHEEL,
-    disabled: disabled
-  }, void 0, _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx(RecentDocuments, {}))), [ariaCurrentValueForInputs, disabled, handlePickerIconKeyDown, handleSetTriggerRef, handleToggleTimePicker]);
-};
-
-export { TimeWheelIconTrigger };

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

@@ -1,49 +0,0 @@
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import { useContext } from 'react';
-import { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';
-import { TimeWheelContent } from './TimeWheelContent.js';
-import { TimeWheelContext } from './TimeWheelContext.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var _TimeWheelContent, _TimeWheelContent2;
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const TimeWheelWrapper = () => {
-  const {
-    setArrowElement,
-    setPopperElement,
-    usePopperHelpers: {
-      styles,
-      attributes
-    },
-    isControllerOnly
-  } = useContext(TimeWheelContext);
-  if (isControllerOnly) return _TimeWheelContent || (_TimeWheelContent = /*#__PURE__*/_jsx(TimeWheelContent, {
-    showShadow: true
-  }));
-  return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({
-    ref: setPopperElement,
-    style: _objectSpread(_objectSpread({}, styles.popper), {}, {
-      background: 'white',
-      zIndex: 110
-    })
-  }, attributes.popper), {}, {
-    "data-testid": ControlledDateTimePickerDatatestid.CONTEXTUAL_MENU.TIMEWHEEL,
-    children: [_TimeWheelContent2 || (_TimeWheelContent2 = /*#__PURE__*/_jsx(TimeWheelContent, {
-      showShadow: true
-    })), /*#__PURE__*/jsx("div", {
-      ref: setArrowElement,
-      style: styles.arrow
-    })]
-  }));
-};
-
-export { TimeWheelWrapper };

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

@@ -1,126 +0,0 @@
-import { useContext, useMemo } from 'react';
-import { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';
-import { usePopperTriggerLogic } from './usePopperTriggerLogic.js';
-import { useCurrentDisplayedWheelsLogic } from './useCurrentDisplayedWheelsLogic.js';
-import { useKeyboardHandlers } from './useKeyboardHandlers.js';
-
-/* eslint-disable max-statements */
-const useConfigTimePickerCTX = () => {
-  const {
-    props: {
-      minutesInterval,
-      getIsDisabledTime,
-      disabled
-    },
-    tempTimeString,
-    prevHourBtnRef,
-    currHourBtnRef,
-    nextHourBtnRef,
-    prevMinutesBtnRef,
-    currMinutesBtnRef,
-    nextMinutesBtnRef,
-    prevMeridiemBtnRef,
-    currMeridiemBtnRef,
-    nextMeridiemBtnRef,
-    isControllerOnly,
-    autoFocusHourTimeWheel,
-    ariaCurrentValueForInputs
-  } = useContext(ControlledDateTimePickerContext);
-  const {
-    currHourNum,
-    hours,
-    visibleHours,
-    handlePrevHour,
-    handleNextHour,
-    handleTimeWheelBtnChangeHours,
-    currMinuteNum,
-    minutes,
-    visibleMinutes,
-    handlePrevMinute,
-    handleNextMinute,
-    handleTimeWheelBtnChangeMinutes,
-    meridiem,
-    handleTimeWheelBtnChangeMeridiem
-  } = useCurrentDisplayedWheelsLogic({
-    minutesInterval
-  });
-  const {
-    showTimePicker,
-    setShowTimePicker,
-    setPopperElement,
-    setArrowElement,
-    usePopperHelpers,
-    handleToggleTimePicker,
-    handleSetTriggerRef,
-    handleMenuWrapperKeyDown
-  } = usePopperTriggerLogic();
-  const {
-    handlePrevHourBtnOnKeyDown,
-    handleCurrHourOnKeyDown,
-    handleNextHourBtnOnKeyDown,
-    handlePrevMinuteBtnOnKeyDown,
-    handleCurrMinutesOnKeyDown,
-    handleNextMinuteBtnOnKeyDown,
-    handlePrevMeridiemBtnOnKeyDown,
-    handleCurrMeridiemOnKeyDown,
-    handleNextMeridiemBtnOnKeyDown,
-    handlePickerIconKeyDown
-  } = useKeyboardHandlers({
-    handlePrevHour,
-    handleNextHour,
-    handlePrevMinute,
-    handleNextMinute,
-    handleTimeWheelBtnChangeMeridiem
-  });
-  return useMemo(() => ({
-    tempTimeString,
-    isControllerOnly,
-    autoFocusHourTimeWheel,
-    showTimePicker,
-    setShowTimePicker,
-    setPopperElement,
-    setArrowElement,
-    usePopperHelpers,
-    handleToggleTimePicker,
-    handleSetTriggerRef,
-    handleMenuWrapperKeyDown,
-    currHourNum,
-    hours,
-    visibleHours,
-    handlePrevHour,
-    handleNextHour,
-    handleTimeWheelBtnChangeHours,
-    currMinuteNum,
-    minutes,
-    visibleMinutes,
-    handlePrevMinute,
-    handleNextMinute,
-    handleTimeWheelBtnChangeMinutes,
-    meridiem,
-    handleTimeWheelBtnChangeMeridiem,
-    handlePrevHourBtnOnKeyDown,
-    handleCurrHourOnKeyDown,
-    handleNextHourBtnOnKeyDown,
-    handlePrevMinuteBtnOnKeyDown,
-    handleCurrMinutesOnKeyDown,
-    handleNextMinuteBtnOnKeyDown,
-    handlePrevMeridiemBtnOnKeyDown,
-    handleCurrMeridiemOnKeyDown,
-    handleNextMeridiemBtnOnKeyDown,
-    handlePickerIconKeyDown,
-    prevHourBtnRef,
-    currHourBtnRef,
-    nextHourBtnRef,
-    prevMinutesBtnRef,
-    currMinutesBtnRef,
-    nextMinutesBtnRef,
-    prevMeridiemBtnRef,
-    currMeridiemBtnRef,
-    nextMeridiemBtnRef,
-    getIsDisabledTime,
-    ariaCurrentValueForInputs,
-    disabled
-  }), [tempTimeString, isControllerOnly, autoFocusHourTimeWheel, showTimePicker, setShowTimePicker, setPopperElement, setArrowElement, usePopperHelpers, handleToggleTimePicker, handleSetTriggerRef, handleMenuWrapperKeyDown, currHourNum, hours, visibleHours, handlePrevHour, handleNextHour, handleTimeWheelBtnChangeHours, currMinuteNum, minutes, visibleMinutes, handlePrevMinute, handleNextMinute, handleTimeWheelBtnChangeMinutes, meridiem, handleTimeWheelBtnChangeMeridiem, handlePrevHourBtnOnKeyDown, handleCurrHourOnKeyDown, handleNextHourBtnOnKeyDown, handlePrevMinuteBtnOnKeyDown, handleCurrMinutesOnKeyDown, handleNextMinuteBtnOnKeyDown, handlePrevMeridiemBtnOnKeyDown, handleCurrMeridiemOnKeyDown, handleNextMeridiemBtnOnKeyDown, handlePickerIconKeyDown, prevHourBtnRef, currHourBtnRef, nextHourBtnRef, prevMinutesBtnRef, currMinutesBtnRef, nextMinutesBtnRef, prevMeridiemBtnRef, currMeridiemBtnRef, nextMeridiemBtnRef, getIsDisabledTime, ariaCurrentValueForInputs, disabled]);
-};
-
-export { useConfigTimePickerCTX };

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

@@ -1,176 +0,0 @@
-import 'core-js/modules/esnext.async-iterator.map.js';
-import 'core-js/modules/esnext.iterator.map.js';
-import { useMemo, useCallback } from 'react';
-import { useTimeInputs } from '../../TimeInputs/useTimeInputs.js';
-import { convertToPositiveNumberIfPossible } from '../../../utils/numberHelpers.js';
-import { prependStringWithPlaceHolders } from '../../../utils/stringHelpers.js';
-
-const totalHoursList = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'];
-const hoursInterval = 1; // using this just to unify the logic between how hours and minutes are handled
-
-const hoursStartPositionOffset = 1; // if array start from 01, this is 1, if start from 02, it's 2 ...
-
-const getTotalMinuteListWithStep = function () {
-  let step = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
-  const length = Math.ceil(60 / step);
-  return new Array(length).fill('_').map((_v, i) => prependStringWithPlaceHolders("".concat(i * step), 2));
-};
-
-const useCurrentDisplayedWheelsLogic = _ref => {
-  let {
-    minutesInterval
-  } = _ref;
-  const {
-    hours,
-    minutes,
-    // seconds,
-    meridiem = 'AM',
-    handleChangeHours,
-    handleChangeMinutes,
-    // handleChangeSeconds,
-    handleChangeMeridiem
-  } = useTimeInputs();
-  const currHourNum = useMemo(() => {
-    const hoursAsNum = convertToPositiveNumberIfPossible(hours);
-    if (hoursAsNum === -1) return 1;
-    return hoursAsNum;
-  }, [hours]);
-  const currMinuteNum = useMemo(() => {
-    const minutesAsNum = convertToPositiveNumberIfPossible(minutes);
-    if (minutesAsNum === -1) return 0;
-    return minutesAsNum;
-  }, [minutes]);
-  const totalMinutesList = useMemo(() => getTotalMinuteListWithStep(minutesInterval), [minutesInterval]);
-  const currMinuteIndex = useMemo(() => Math.floor(currMinuteNum / minutesInterval), [currMinuteNum, minutesInterval]);
-  const currHoursIndex = useMemo(() => Math.floor(currHourNum / hoursInterval) - hoursStartPositionOffset, [currHourNum]); // const currSecondNum = useMemo(() => {
-  //   const secondsAsNum = convertToPositiveNumberIfPossible(seconds);
-  //   if (secondsAsNum === -1) return 0;
-  //   return secondsAsNum;
-  // }, [seconds]);
-
-  const visibleHours = useMemo(() => {
-    const newHours = []; // if (currHoursIndex >= 2) newHours.push(totalHoursList[currHoursIndex - 2]);
-    // else newHours.push(null);
-
-    if (currHoursIndex >= 1) newHours.push(totalHoursList[currHoursIndex - 1]);else newHours.push(null);
-    newHours.push(totalHoursList[currHoursIndex]);
-    if (currHoursIndex <= 11) newHours.push(totalHoursList[currHoursIndex + 1]);else newHours.push(null); // if (currHoursIndex <= 10) newHours.push(totalHoursList[currHoursIndex + 2]);
-    // else newHours.push(null);
-
-    return newHours;
-  }, [currHoursIndex]);
-  const visibleMinutes = useMemo(() => {
-    const newMinutes = []; // if (currMinuteIndex >= 2)
-    //   newMinutes.push(totalMinutesList[currMinuteIndex - 2]);
-    // else newMinutes.push(null);
-
-    if (currMinuteIndex >= 1) newMinutes.push(totalMinutesList[currMinuteIndex - 1]);else newMinutes.push(null);
-    newMinutes.push(totalMinutesList[currMinuteIndex]);
-    if (currMinuteIndex < totalMinutesList.length) newMinutes.push(totalMinutesList[currMinuteIndex + 1]);else newMinutes.push(null); // if (currMinuteIndex < totalMinutesList.length -1)
-    //   newMinutes.push(totalMinutesList[currMinuteIndex + 2]);
-    // else newMinutes.push(null);
-
-    return newMinutes;
-  }, [currMinuteIndex, totalMinutesList]); // const visibleSeconds = useMemo(() => {
-  //   const newSeconds = [];
-  //   if (currSecondNum >= 3)
-  //     newSeconds.push(totalMinutesList[currSecondNum - 3]);
-  //   else newSeconds.push(null);
-  //   if (currSecondNum >= 2)
-  //     newSeconds.push(totalMinutesList[currSecondNum - 2]);
-  //   else newSeconds.push(null);
-  //   newSeconds.push(totalMinutesList[currSecondNum - 1]);
-  //   if (currSecondNum <= 59) newSeconds.push(totalMinutesList[currSecondNum]);
-  //   else newSeconds.push(null);
-  //   if (currSecondNum <= 58)
-  //     newSeconds.push(totalMinutesList[currSecondNum + 1]);
-  //   else newSeconds.push(null);
-  //   return newSeconds;
-  // }, [currSecondNum]);
-
-  const handleTimeWheelBtnChangeHours = useCallback((newHours, e) => {
-    handleChangeHours(newHours, e);
-  }, [handleChangeHours]);
-  const handleChangeCurrHour = useCallback((offset, e) => {
-    const newH = currHourNum + offset;
-    if (newH > 0 && newH <= 12) handleChangeHours(prependStringWithPlaceHolders("".concat(newH), 2), e);
-  }, [currHourNum, handleChangeHours]);
-  const handlePrevHour = useCallback(e => {
-    handleChangeCurrHour(-1, e);
-  }, [handleChangeCurrHour]);
-  const handleNextHour = useCallback(e => {
-    handleChangeCurrHour(1, e);
-  }, [handleChangeCurrHour]);
-  const handleTimeWheelBtnChangeMinutes = useCallback((newMinutes, e) => {
-    handleChangeMinutes(newMinutes, e);
-  }, [handleChangeMinutes]);
-  const handleChangeCurrMinute = useCallback((offset, e) => {
-    const newM = currMinuteNum + offset;
-    if (newM >= 0 && newM <= 59) handleChangeMinutes(prependStringWithPlaceHolders("".concat(newM), 2), e);
-  }, [currMinuteNum, handleChangeMinutes]);
-  const handlePrevMinute = useCallback(e => {
-    handleChangeCurrMinute(-minutesInterval, e);
-  }, [handleChangeCurrMinute, minutesInterval]);
-  const handleNextMinute = useCallback(e => {
-    handleChangeCurrMinute(minutesInterval, e);
-  }, [handleChangeCurrMinute, minutesInterval]); // const handleTimeWheelBtnChangeSeconds = useCallback(
-  //   (newSeconds, e) => {
-  //     handleChangeSeconds(newSeconds, e);
-  //   },
-  //   [handleChangeSeconds],
-  // );
-  // const handleChangeCurrSecond = useCallback(
-  //   (offset, e) => {
-  //     const newS = currSecondNum + offset;
-  //     if (newS >= 0 && newS <= 59)
-  //       handleChangeSeconds(prependStringWithPlaceHolders(`${newS}`, 2), e);
-  //   },
-  //   [currSecondNum, handleChangeSeconds],
-  // );
-  // const handlePrevSecond = useCallback(
-  //   (e) => {
-  //     handleChangeCurrSecond(-1, e);
-  //   },
-  //   [handleChangeCurrSecond],
-  // );
-  // const handleNextSecond = useCallback(
-  //   (e) => {
-  //     handleChangeCurrSecond(1, e);
-  //   },
-  //   [handleChangeCurrSecond],
-  // );
-
-  const handleTimeWheelBtnChangeMeridiem = useCallback((newMeridiem, e) => {
-    handleChangeMeridiem(newMeridiem, e);
-  }, [handleChangeMeridiem]);
-  return useMemo(() => ({
-    currHourNum,
-    hours,
-    visibleHours,
-    handlePrevHour,
-    handleNextHour,
-    handleTimeWheelBtnChangeHours,
-    currMinuteNum,
-    minutes,
-    visibleMinutes,
-    handlePrevMinute,
-    handleNextMinute,
-    handleTimeWheelBtnChangeMinutes,
-    // currSecondNum,
-    // seconds,
-    // visibleSeconds,
-    // handlePrevSecond,
-    // handleNextSecond,
-    // handleTimeWheelBtnChangeSeconds,
-    meridiem,
-    handleTimeWheelBtnChangeMeridiem
-  }), [currHourNum, currMinuteNum, // currSecondNum,
-  handleNextHour, handleNextMinute, // handleNextSecond,
-  handlePrevHour, handlePrevMinute, // handlePrevSecond,
-  handleTimeWheelBtnChangeHours, handleTimeWheelBtnChangeMeridiem, handleTimeWheelBtnChangeMinutes, // handleTimeWheelBtnChangeSeconds,
-  hours, meridiem, minutes, // seconds,
-  visibleHours, visibleMinutes // visibleSeconds,
-  ]);
-};
-
-export { useCurrentDisplayedWheelsLogic };