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

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-date-time-picker/parts/TimeInputs/MinutesInput.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid';\nimport { Styled2DigitsInput } from '../Styleds';\nimport type { onChangeFuncT, onBlurFuncT, onFocusFuncT, onKeyDownT } from '../../index.d';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidMinute = (minutes) => {\n  if (minutes === '') return false;\n  const numberOnly = regExpNumbers.test(minutes);\n  return minutes.length > 2 || !numberOnly || Number.parseInt(minutes, 10) > 60;\n};\ninterface MinutesInputsPropsT {\n  onChange: onChangeFuncT;\n  onBlur: onBlurFuncT;\n  onFocus: onFocusFuncT;\n  onKeyDown: onKeyDownT;\n  value: string;\n  disabled: boolean;\n  contextRef: React.RefObject<HTMLInputElement>;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n}\nexport const MinutesInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    placeholder,\n    ariaCurrentValueForInputs,\n    contextRef,\n  }: MinutesInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e) => {\n        if (isInvalidMinute(e?.target?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n    return (\n      <Styled2DigitsInput\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        ref={contextRef}\n        placeholder={placeholder}\n        aria-label={`minutes input field ${ariaCurrentValueForInputs}`}\n        data-testid={ControlledDateTimePickerDatatestid.TIME_INPUTS.MINUTE}\n        disabled={disabled}\n        aria-disabled={disabled}\n      />\n    );\n  },\n);\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AAGA,MAAM,gBAAgB;AACtB,MAAM,kBAAkB,CAAC,YAAY;AACnC,MAAI,YAAY;AAAI,WAAO;AAC3B,QAAM,aAAa,cAAc,KAAK;AACtC,SAAO,QAAQ,SAAS,KAAK,CAAC,cAAc,OAAO,SAAS,SAAS,MAAM;AAAA;AAatE,MAAM,eAAe,OAAM,KAChC,CAAC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACsC;AACtC,QAAM,mBAAmB,YACvB,CAAC,MAAM;AACL,QAAI,gBAAgB,GAAG,QAAQ,QAAQ;AACrC,QAAE;AACF;AAAA;AAEF,aAAS;AAAA,KAEX,CAAC;AAEH,SACE,qCAAC,oBAAD;AAAA,IACE,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA,cAAY,uBAAuB;AAAA,IACnC,eAAa,mCAAmC,YAAY;AAAA,IAC5D;AAAA,IACA,iBAAe;AAAA;AAAA;",
+  "names": []
+}

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

@@ -1,49 +1,43 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import { useContext } from 'react';
-import { Grid } from '@elliemae/ds-grid';
-import { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';
-import { HHInput } from './HHInput.js';
-import { MinutesInput } from './MinutesInput.js';
-import { MeridiemInput } from './MeridiemInput.js';
-import { useTimeInputs } from './useTimeInputs.js';
-import { fixedValues } from '../config.js';
-import { StyledFocusWithIn, StyledColonSeparator, StyledSeparator } from '../Styleds.js';
-
-var _StyledColonSeparator, _StyledSeparator;
+import * as React from "react";
+import React2, { useContext } from "react";
+import { Grid } from "@elliemae/ds-grid";
+import { ControlledDateTimePickerContext } from "../../ControlledDateTimePickerCTX";
+import { HHInput } from "./HHInput";
+import { MinutesInput } from "./MinutesInput";
+import { MeridiemInput } from "./MeridiemInput";
+import { useTimeInputs } from "./useTimeInputs";
+import { fixedValues } from "../config";
+import { StyledColonSeparator, StyledSeparator, StyledFocusWithIn } from "../Styleds";
 const TimeInputs = () => {
   const {
     hours,
     minutes,
-    // seconds,
     meridiem,
     autoFocusHourInput,
     disabled,
     onHoursChange,
     onMinutesChange,
-    // onSecondsChange,
     onMeridiemChange,
     onHoursBlur,
     onMinutesBlur,
-    // onSecondsBlur,
     onMeridiemBlur,
     onHoursFocus,
     onMeridiemFocus,
     onMinutesFocus,
     onHoursKeyDown,
     onMinutesKeyDown,
-    // onSecondsKeyDown,
     onMeridiemKeyDown
-  } = useTimeInputs(); // we do this here so HHInput,MinutesInput, MeridiemInput can be pure components memoized via React.memo
-
-  const {
-    hourInputRef,
-    minutesInputRef,
-    meridiemInputRef,
-    ariaCurrentValueForInputs
-  } = useContext(ControlledDateTimePickerContext);
-  return /*#__PURE__*/_jsx(Grid, {
-    cols: [fixedValues.smallInputWidth, fixedValues.separatorWidth, fixedValues.smallInputWidth, fixedValues.separatorWidth, fixedValues.smallInputWidth]
-  }, void 0, /*#__PURE__*/_jsx(StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx(HHInput, {
+  } = useTimeInputs();
+  const { hourInputRef, minutesInputRef, meridiemInputRef, ariaCurrentValueForInputs } = useContext(ControlledDateTimePickerContext);
+  return /* @__PURE__ */ React2.createElement(Grid, {
+    cols: [
+      fixedValues.smallInputWidth,
+      fixedValues.separatorWidth,
+      fixedValues.smallInputWidth,
+      fixedValues.separatorWidth,
+      fixedValues.smallInputWidth
+    ]
+  }, /* @__PURE__ */ React2.createElement(StyledFocusWithIn, null, /* @__PURE__ */ React2.createElement(HHInput, {
     value: hours,
     onChange: onHoursChange,
     onBlur: onHoursBlur,
@@ -51,12 +45,12 @@ const TimeInputs = () => {
     onKeyDown: onHoursKeyDown,
     contextRef: hourInputRef,
     placeholder: "HH",
-    ariaCurrentValueForInputs: ariaCurrentValueForInputs,
-    autoFocusHourInput: autoFocusHourInput,
-    disabled: disabled
-  })), _StyledColonSeparator || (_StyledColonSeparator = /*#__PURE__*/_jsx(StyledColonSeparator, {
+    ariaCurrentValueForInputs,
+    autoFocusHourInput,
+    disabled
+  })), /* @__PURE__ */ React2.createElement(StyledColonSeparator, {
     alignItems: "center"
-  }, void 0, ":")), /*#__PURE__*/_jsx(StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx(MinutesInput, {
+  }, ":"), /* @__PURE__ */ React2.createElement(StyledFocusWithIn, null, /* @__PURE__ */ React2.createElement(MinutesInput, {
     value: minutes,
     onChange: onMinutesChange,
     onBlur: onMinutesBlur,
@@ -64,9 +58,9 @@ const TimeInputs = () => {
     onKeyDown: onMinutesKeyDown,
     contextRef: minutesInputRef,
     placeholder: "MM",
-    ariaCurrentValueForInputs: ariaCurrentValueForInputs,
-    disabled: disabled
-  })), _StyledSeparator || (_StyledSeparator = /*#__PURE__*/_jsx(StyledSeparator, {}, void 0, " ")), /*#__PURE__*/_jsx(StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx(MeridiemInput, {
+    ariaCurrentValueForInputs,
+    disabled
+  })), /* @__PURE__ */ React2.createElement(StyledSeparator, null, " "), /* @__PURE__ */ React2.createElement(StyledFocusWithIn, null, /* @__PURE__ */ React2.createElement(MeridiemInput, {
     value: meridiem,
     onChange: onMeridiemChange,
     onBlur: onMeridiemBlur,
@@ -74,9 +68,11 @@ const TimeInputs = () => {
     onKeyDown: onMeridiemKeyDown,
     contextRef: meridiemInputRef,
     placeholder: "AM",
-    ariaCurrentValueForInputs: ariaCurrentValueForInputs,
-    disabled: disabled
+    ariaCurrentValueForInputs,
+    disabled
   })));
 };
-
-export { TimeInputs };
+export {
+  TimeInputs
+};
+//# sourceMappingURL=TimeInputs.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-date-time-picker/parts/TimeInputs/TimeInputs.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX';\nimport { HHInput } from './HHInput';\nimport { MinutesInput } from './MinutesInput';\n// import { SSInput } from './SSInput';\nimport { MeridiemInput } from './MeridiemInput';\nimport { useTimeInputs } from './useTimeInputs';\nimport { fixedValues } from '../config';\nimport { StyledColonSeparator, StyledSeparator, StyledFocusWithIn } from '../Styleds';\n\nexport const TimeInputs = (): JSX.Element => {\n  const {\n    hours,\n    minutes,\n    // seconds,\n    meridiem,\n    autoFocusHourInput,\n    disabled,\n    onHoursChange,\n    onMinutesChange,\n    // onSecondsChange,\n    onMeridiemChange,\n    onHoursBlur,\n    onMinutesBlur,\n    // onSecondsBlur,\n    onMeridiemBlur,\n    onHoursFocus,\n    onMeridiemFocus,\n    onMinutesFocus,\n    onHoursKeyDown,\n    onMinutesKeyDown,\n    // onSecondsKeyDown,\n    onMeridiemKeyDown,\n  } = useTimeInputs();\n\n  // we do this here so HHInput,MinutesInput, MeridiemInput can be pure components memoized via React.memo\n  const { hourInputRef, minutesInputRef, meridiemInputRef, ariaCurrentValueForInputs } = useContext(\n    ControlledDateTimePickerContext,\n  );\n  return (\n    <Grid\n      cols={[\n        fixedValues.smallInputWidth,\n        fixedValues.separatorWidth,\n        fixedValues.smallInputWidth,\n        fixedValues.separatorWidth,\n        fixedValues.smallInputWidth,\n      ]}\n    >\n      <StyledFocusWithIn>\n        <HHInput\n          value={hours}\n          onChange={onHoursChange}\n          onBlur={onHoursBlur}\n          onFocus={onHoursFocus}\n          onKeyDown={onHoursKeyDown}\n          contextRef={hourInputRef}\n          placeholder=\"HH\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          autoFocusHourInput={autoFocusHourInput}\n          disabled={disabled}\n        />\n      </StyledFocusWithIn>\n      <StyledColonSeparator alignItems=\"center\">:</StyledColonSeparator>\n      <StyledFocusWithIn>\n        <MinutesInput\n          value={minutes}\n          onChange={onMinutesChange}\n          onBlur={onMinutesBlur}\n          onFocus={onMeridiemFocus}\n          onKeyDown={onMinutesKeyDown}\n          contextRef={minutesInputRef}\n          placeholder=\"MM\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n        />\n      </StyledFocusWithIn>\n      <StyledSeparator> </StyledSeparator>\n      <StyledFocusWithIn>\n        <MeridiemInput\n          value={meridiem}\n          onChange={onMeridiemChange}\n          onBlur={onMeridiemBlur}\n          onFocus={onMinutesFocus}\n          onKeyDown={onMeridiemKeyDown}\n          contextRef={meridiemInputRef}\n          placeholder=\"AM\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n        />\n      </StyledFocusWithIn>\n    </Grid>\n  );\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEO,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAEA;AAAA,MACE;AAGJ,QAAM,EAAE,cAAc,iBAAiB,kBAAkB,8BAA8B,WACrF;AAEF,SACE,qCAAC,MAAD;AAAA,IACE,MAAM;AAAA,MACJ,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,YAAY;AAAA;AAAA,KAGd,qCAAC,mBAAD,MACE,qCAAC,SAAD;AAAA,IACE,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,aAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,OAGJ,qCAAC,sBAAD;AAAA,IAAsB,YAAW;AAAA,KAAS,MAC1C,qCAAC,mBAAD,MACE,qCAAC,cAAD;AAAA,IACE,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,aAAY;AAAA,IACZ;AAAA,IACA;AAAA,OAGJ,qCAAC,iBAAD,MAAiB,MACjB,qCAAC,mBAAD,MACE,qCAAC,eAAD;AAAA,IACE,OAAO;AAAA,IACP,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,aAAY;AAAA,IACZ;AAAA,IACA;AAAA;AAAA;",
+  "names": []
+}

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

@@ -1,15 +1,11 @@
-import { useContext, useCallback, useMemo } from 'react';
-import { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';
-import { homeEndArrowUpDownSemiKeys, homeEndArrowUpDownSpaceKeys, homeEndArrowUpDownKeys } from '../../utils/constants.js';
-import { prependStringWithPlaceHolders } from '../../utils/stringHelpers.js';
-
-/* eslint-disable complexity */
+import * as React from "react";
+import { useCallback, useMemo, useContext } from "react";
+import { ControlledDateTimePickerContext } from "../../ControlledDateTimePickerCTX";
+import { homeEndArrowUpDownKeys, homeEndArrowUpDownSemiKeys, homeEndArrowUpDownSpaceKeys } from "../../utils/constants";
+import { prependStringWithPlaceHolders } from "../../utils/stringHelpers";
 const useTimeInputs = () => {
   const {
-    props: {
-      minutesInterval,
-      disabled
-    },
+    props: { minutesInterval, disabled },
     lastSegmentRef,
     hours,
     minutes,
@@ -33,196 +29,199 @@ const useTimeInputs = () => {
     setLatestInteractionRegion
   } = useContext(ControlledDateTimePickerContext);
   const setLatestInteractionRegionTimeInputs = useCallback(() => {
-    setLatestInteractionRegion('time-inputs');
+    setLatestInteractionRegion("time-inputs");
   }, [setLatestInteractionRegion]);
   const onHomeKeyDown = 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 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);
+    if (!hideDate)
+      monthInputRef?.current?.focus?.();
+    else
+      hourInputRef?.current?.focus?.();
   }, [hideDate, monthInputRef, hourInputRef]);
   const onEndKeyDown = useCallback(() => {
-    var _pickerButtonRef$curr, _pickerButtonRef$curr2, _clearButtonRef$curre, _clearButtonRef$curre2, _meridiemInputRef$cur, _meridiemInputRef$cur2;
-
-    if (withAnyPicker) pickerButtonRef === null || pickerButtonRef === void 0 ? void 0 : (_pickerButtonRef$curr = pickerButtonRef.current) === null || _pickerButtonRef$curr === void 0 ? void 0 : (_pickerButtonRef$curr2 = _pickerButtonRef$curr.focus) === null || _pickerButtonRef$curr2 === void 0 ? void 0 : _pickerButtonRef$curr2.call(_pickerButtonRef$curr);else if (withClearBtn) clearButtonRef === null || clearButtonRef === void 0 ? void 0 : (_clearButtonRef$curre = clearButtonRef.current) === null || _clearButtonRef$curre === void 0 ? void 0 : (_clearButtonRef$curre2 = _clearButtonRef$curre.focus) === null || _clearButtonRef$curre2 === void 0 ? void 0 : _clearButtonRef$curre2.call(_clearButtonRef$curre);else 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);
+    if (withAnyPicker)
+      pickerButtonRef?.current?.focus?.();
+    else if (withClearBtn)
+      clearButtonRef?.current?.focus?.();
+    else
+      meridiemInputRef?.current?.focus?.();
   }, [withAnyPicker, pickerButtonRef, withClearBtn, clearButtonRef, meridiemInputRef]);
   const onHoursFocus = useCallback(() => {
     setLatestInteractionRegionTimeInputs();
   }, [setLatestInteractionRegionTimeInputs]);
-  const onHoursChange = useCallback(e => {
-    var _e$target, _minutesInputRef$curr, _minutesInputRef$curr2;
-
-    let newHours = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value; // converts hours 2~9 to 07~09
-
-    if (Number.parseInt(newHours, 10) > 1) newHours = prependStringWithPlaceHolders(newHours, 2);
-    handleChangeHours(newHours, e); // auto-advance functionality:
-
-    if (newHours.length === 2) minutesInputRef === null || minutesInputRef === void 0 ? void 0 : (_minutesInputRef$curr = minutesInputRef.current) === null || _minutesInputRef$curr === void 0 ? void 0 : (_minutesInputRef$curr2 = _minutesInputRef$curr.focus) === null || _minutesInputRef$curr2 === void 0 ? void 0 : _minutesInputRef$curr2.call(_minutesInputRef$curr);
+  const onHoursChange = useCallback((e) => {
+    let newHours = e?.target?.value;
+    if (Number.parseInt(newHours, 10) > 1)
+      newHours = prependStringWithPlaceHolders(newHours, 2);
+    handleChangeHours(newHours, e);
+    if (newHours.length === 2)
+      minutesInputRef?.current?.focus?.();
   }, [minutesInputRef, handleChangeHours]);
-  const onHoursKeyDown = useCallback(e => {
-    var _lastSegmentRef$curre, _lastSegmentRef$curre2;
-
-    const {
-      key,
-      ctrlKey,
-      metaKey
-    } = e;
+  const onHoursKeyDown = useCallback((e) => {
+    const { key, ctrlKey, metaKey } = e;
     const hoursStringConvertedToInteger = Number.parseInt(hours, 10);
-    if (homeEndArrowUpDownSemiKeys.includes(key)) e.preventDefault();
-    if (homeEndArrowUpDownSemiKeys.includes(key)) e.stopPropagation();
-    if (key === 'Home') onHomeKeyDown();
-    if (key === 'End') onEndKeyDown();
-
-    if (key === 'ArrowUp' || key === 'ArrowDown') {
+    if (homeEndArrowUpDownSemiKeys.includes(key))
+      e.preventDefault();
+    if (homeEndArrowUpDownSemiKeys.includes(key))
+      e.stopPropagation();
+    if (key === "Home")
+      onHomeKeyDown();
+    if (key === "End")
+      onEndKeyDown();
+    if (key === "ArrowUp" || key === "ArrowDown") {
       const hoursInteger = Number.isNaN(hoursStringConvertedToInteger) ? 0 : hoursStringConvertedToInteger;
       let newHours;
-      if (key === 'ArrowUp') newHours = hoursInteger + 1 <= 12 ? hoursInteger + 1 : hoursInteger;else newHours = hoursInteger - 1 > 1 ? hoursInteger - 1 : 1;
-      newHours = prependStringWithPlaceHolders("".concat(newHours), 2);
+      if (key === "ArrowUp")
+        newHours = hoursInteger + 1 <= 12 ? hoursInteger + 1 : hoursInteger;
+      else
+        newHours = hoursInteger - 1 > 1 ? hoursInteger - 1 : 1;
+      newHours = prependStringWithPlaceHolders(`${newHours}`, 2);
       handleChangeHours(newHours, e);
     }
-
-    if (!Number.isNaN(hoursStringConvertedToInteger) && key === ':') {
-      var _minutesInputRef$curr3, _minutesInputRef$curr4;
-
-      const newHours = prependStringWithPlaceHolders("".concat(hoursStringConvertedToInteger), 2);
-      handleChangeHours(newHours, e); // auto-advance functionality:
-
-      if (newHours.length === 2) minutesInputRef === null || minutesInputRef === void 0 ? void 0 : (_minutesInputRef$curr3 = minutesInputRef.current) === null || _minutesInputRef$curr3 === void 0 ? void 0 : (_minutesInputRef$curr4 = _minutesInputRef$curr3.focus) === null || _minutesInputRef$curr4 === void 0 ? void 0 : _minutesInputRef$curr4.call(_minutesInputRef$curr3);
-    } // regressive backspace functionality
-
-
-    if (key === 'Backspace' && hours.length === 0 && isWithDateInputs) {
-      var _yearInputRef$current, _yearInputRef$current2;
-
-      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);
-    } // focus last fragment on fill with now
-
-
-    if ((ctrlKey || metaKey) && key === ';') lastSegmentRef === null || lastSegmentRef === void 0 ? void 0 : (_lastSegmentRef$curre = lastSegmentRef.current) === null || _lastSegmentRef$curre === void 0 ? void 0 : (_lastSegmentRef$curre2 = _lastSegmentRef$curre.focus) === null || _lastSegmentRef$curre2 === void 0 ? void 0 : _lastSegmentRef$curre2.call(_lastSegmentRef$curre);
-  }, [hours, onHomeKeyDown, onEndKeyDown, isWithDateInputs, lastSegmentRef, handleChangeHours, minutesInputRef, yearInputRef]);
-  const onHoursBlur = useCallback(e => {
-    var _e$target2;
-
-    const newHours = e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value;
-    if (newHours === '0') handleChangeHours('01', e, {
-      isAutomaticFillTrigger: true
-    });else if (newHours.length > 0 && newHours.length < 2) handleChangeHours(prependStringWithPlaceHolders(newHours, 2), e, {
-      isAutomaticFillTrigger: true
-    });
+    if (!Number.isNaN(hoursStringConvertedToInteger) && key === ":") {
+      const newHours = prependStringWithPlaceHolders(`${hoursStringConvertedToInteger}`, 2);
+      handleChangeHours(newHours, e);
+      if (newHours.length === 2)
+        minutesInputRef?.current?.focus?.();
+    }
+    if (key === "Backspace" && hours.length === 0 && isWithDateInputs) {
+      yearInputRef?.current?.focus?.();
+    }
+    if ((ctrlKey || metaKey) && key === ";")
+      lastSegmentRef?.current?.focus?.();
+  }, [
+    hours,
+    onHomeKeyDown,
+    onEndKeyDown,
+    isWithDateInputs,
+    lastSegmentRef,
+    handleChangeHours,
+    minutesInputRef,
+    yearInputRef
+  ]);
+  const onHoursBlur = useCallback((e) => {
+    const newHours = e?.target?.value;
+    if (newHours === "0")
+      handleChangeHours("01", e, { isAutomaticFillTrigger: true });
+    else if (newHours.length > 0 && newHours.length < 2)
+      handleChangeHours(prependStringWithPlaceHolders(newHours, 2), e, {
+        isAutomaticFillTrigger: true
+      });
   }, [handleChangeHours]);
   const onMinutesFocus = useCallback(() => {
     setLatestInteractionRegionTimeInputs();
   }, [setLatestInteractionRegionTimeInputs]);
-  const onMinutesChange = useCallback(e => {
-    var _e$target3, _meridiemInputRef$cur3, _meridiemInputRef$cur4;
-
-    let newMinutes = e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value; // converts minutes 7~9 to 07~09
-
-    if (Number.parseInt(newMinutes, 10) > 6) newMinutes = prependStringWithPlaceHolders(newMinutes, 2);
-    handleChangeMinutes(newMinutes, e); // auto-advance functionality:
-    // if (newMinutes.length === 2) secondsInputRef?.current?.focus?.();
-
-    if (newMinutes.length === 2) meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur3 = meridiemInputRef.current) === null || _meridiemInputRef$cur3 === void 0 ? void 0 : (_meridiemInputRef$cur4 = _meridiemInputRef$cur3.focus) === null || _meridiemInputRef$cur4 === void 0 ? void 0 : _meridiemInputRef$cur4.call(_meridiemInputRef$cur3);
+  const onMinutesChange = useCallback((e) => {
+    let newMinutes = e?.target?.value;
+    if (Number.parseInt(newMinutes, 10) > 6)
+      newMinutes = prependStringWithPlaceHolders(newMinutes, 2);
+    handleChangeMinutes(newMinutes, e);
+    if (newMinutes.length === 2)
+      meridiemInputRef?.current?.focus?.();
   }, [meridiemInputRef, handleChangeMinutes]);
-  const onMinutesKeyDown = useCallback(e => {
-    var _lastSegmentRef$curre3, _lastSegmentRef$curre4;
-
-    const {
-      key,
-      ctrlKey,
-      metaKey
-    } = e;
+  const onMinutesKeyDown = useCallback((e) => {
+    const { key, ctrlKey, metaKey } = e;
     const minutesStringConvertedToInteger = Number.parseInt(minutes, 10);
-    if (homeEndArrowUpDownSpaceKeys.includes(key)) e.preventDefault();
-    if (homeEndArrowUpDownSpaceKeys.includes(key)) e.stopPropagation();
-    if (key === 'Home') onHomeKeyDown();
-    if (key === 'End') onEndKeyDown();
-
-    if (key === 'ArrowUp' || key === 'ArrowDown') {
+    if (homeEndArrowUpDownSpaceKeys.includes(key))
+      e.preventDefault();
+    if (homeEndArrowUpDownSpaceKeys.includes(key))
+      e.stopPropagation();
+    if (key === "Home")
+      onHomeKeyDown();
+    if (key === "End")
+      onEndKeyDown();
+    if (key === "ArrowUp" || key === "ArrowDown") {
       const minutesInteger = Number.isNaN(minutesStringConvertedToInteger) ? 0 : minutesStringConvertedToInteger;
       let newMinutes;
-      if (key === 'ArrowUp') newMinutes = minutesInteger + minutesInterval <= 59 ? minutesInteger + minutesInterval : minutesInteger;else newMinutes = minutesInteger - minutesInterval > 0 ? minutesInteger - minutesInterval : 0;
-      newMinutes = prependStringWithPlaceHolders("".concat(newMinutes), 2);
+      if (key === "ArrowUp")
+        newMinutes = minutesInteger + minutesInterval <= 59 ? minutesInteger + minutesInterval : minutesInteger;
+      else
+        newMinutes = minutesInteger - minutesInterval > 0 ? minutesInteger - minutesInterval : 0;
+      newMinutes = prependStringWithPlaceHolders(`${newMinutes}`, 2);
       handleChangeMinutes(newMinutes, e);
     }
-
-    if (!Number.isNaN(minutesStringConvertedToInteger) && key === ' ') {
-      var _meridiemInputRef$cur5, _meridiemInputRef$cur6;
-
-      const newMinutes = prependStringWithPlaceHolders("".concat(minutesStringConvertedToInteger), 2);
-      handleChangeMinutes(newMinutes, e); // auto-advance functionality:
-      // if (newMinutes.length === 2) secondsInputRef?.current?.focus?.();
-
-      if (newMinutes.length === 2) meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur5 = meridiemInputRef.current) === null || _meridiemInputRef$cur5 === void 0 ? void 0 : (_meridiemInputRef$cur6 = _meridiemInputRef$cur5.focus) === null || _meridiemInputRef$cur6 === void 0 ? void 0 : _meridiemInputRef$cur6.call(_meridiemInputRef$cur5);
-    } // regressive backspace functionality
-
-
-    if (key === 'Backspace' && (minutes === null || minutes === void 0 ? void 0 : minutes.length) === 0) {
-      var _hourInputRef$current3, _hourInputRef$current4;
-
-      hourInputRef === null || hourInputRef === void 0 ? void 0 : (_hourInputRef$current3 = hourInputRef.current) === null || _hourInputRef$current3 === void 0 ? void 0 : (_hourInputRef$current4 = _hourInputRef$current3.focus) === null || _hourInputRef$current4 === void 0 ? void 0 : _hourInputRef$current4.call(_hourInputRef$current3);
-    } // focus last fragment on fill with now
-
-
-    if ((ctrlKey || metaKey) && key === ';') lastSegmentRef === null || lastSegmentRef === void 0 ? void 0 : (_lastSegmentRef$curre3 = lastSegmentRef.current) === null || _lastSegmentRef$curre3 === void 0 ? void 0 : (_lastSegmentRef$curre4 = _lastSegmentRef$curre3.focus) === null || _lastSegmentRef$curre4 === void 0 ? void 0 : _lastSegmentRef$curre4.call(_lastSegmentRef$curre3);
-  }, [minutes, onHomeKeyDown, onEndKeyDown, lastSegmentRef, minutesInterval, handleChangeMinutes, meridiemInputRef, hourInputRef]);
-  const onMinutesBlur = useCallback(e => {
-    var _e$target4;
-
-    const newMinutes = e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : _e$target4.value;
-    if (newMinutes.length > 0 && newMinutes.length < 2) handleChangeMinutes(prependStringWithPlaceHolders(newMinutes, 2), e, {
-      isAutomaticFillTrigger: true
-    });
+    if (!Number.isNaN(minutesStringConvertedToInteger) && key === " ") {
+      const newMinutes = prependStringWithPlaceHolders(`${minutesStringConvertedToInteger}`, 2);
+      handleChangeMinutes(newMinutes, e);
+      if (newMinutes.length === 2)
+        meridiemInputRef?.current?.focus?.();
+    }
+    if (key === "Backspace" && minutes?.length === 0) {
+      hourInputRef?.current?.focus?.();
+    }
+    if ((ctrlKey || metaKey) && key === ";")
+      lastSegmentRef?.current?.focus?.();
+  }, [
+    minutes,
+    onHomeKeyDown,
+    onEndKeyDown,
+    lastSegmentRef,
+    minutesInterval,
+    handleChangeMinutes,
+    meridiemInputRef,
+    hourInputRef
+  ]);
+  const onMinutesBlur = useCallback((e) => {
+    const newMinutes = e?.target?.value;
+    if (newMinutes.length > 0 && newMinutes.length < 2)
+      handleChangeMinutes(prependStringWithPlaceHolders(newMinutes, 2), e, {
+        isAutomaticFillTrigger: true
+      });
   }, [handleChangeMinutes]);
   const onMeridiemFocus = useCallback(() => {
     setLatestInteractionRegionTimeInputs();
   }, [setLatestInteractionRegionTimeInputs]);
-  const onMeridiemChange = useCallback(e => {
-    var _e$target5, _e$target5$value, _e$target5$value$toUp;
-
-    let newMeridiem = e === null || e === void 0 ? void 0 : (_e$target5 = e.target) === null || _e$target5 === void 0 ? void 0 : (_e$target5$value = _e$target5.value) === null || _e$target5$value === void 0 ? void 0 : (_e$target5$value$toUp = _e$target5$value.toUpperCase) === null || _e$target5$value$toUp === void 0 ? void 0 : _e$target5$value$toUp.call(_e$target5$value); // if new value is length 1,
-    //   if previous value was empty, auto-complete
-    //   if previous value was not empty, set to empty (regressive backspace)
-
-    if (newMeridiem.length === 1) if (meridiem === '') newMeridiem = "".concat(newMeridiem, "M");else newMeridiem = '';
-    handleChangeMeridiem(newMeridiem, e); // auto-advance functionality:
-
+  const onMeridiemChange = useCallback((e) => {
+    let newMeridiem = e?.target?.value?.toUpperCase?.();
+    if (newMeridiem.length === 1)
+      if (meridiem === "")
+        newMeridiem = `${newMeridiem}M`;
+      else
+        newMeridiem = "";
+    handleChangeMeridiem(newMeridiem, e);
     if (newMeridiem.length === 2 && withAnyRightController) {
-      var _clearButtonRef$curre3, _clearButtonRef$curre4, _pickerButtonRef$curr3, _pickerButtonRef$curr4;
-
-      if (withClearBtn) (_clearButtonRef$curre3 = clearButtonRef.current) === null || _clearButtonRef$curre3 === void 0 ? void 0 : (_clearButtonRef$curre4 = _clearButtonRef$curre3.focus) === null || _clearButtonRef$curre4 === void 0 ? void 0 : _clearButtonRef$curre4.call(_clearButtonRef$curre3);else if (withAnyPicker) 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);
+      if (withClearBtn)
+        clearButtonRef.current?.focus?.();
+      else if (withAnyPicker)
+        pickerButtonRef?.current?.focus?.();
+    }
+  }, [
+    meridiem,
+    handleChangeMeridiem,
+    withAnyRightController,
+    withClearBtn,
+    clearButtonRef,
+    withAnyPicker,
+    pickerButtonRef
+  ]);
+  const onMeridiemKeyDown = useCallback((e) => {
+    const { key, ctrlKey, metaKey } = e;
+    if (homeEndArrowUpDownKeys.includes(key))
+      e.preventDefault();
+    if (homeEndArrowUpDownKeys.includes(key))
+      e.stopPropagation();
+    if (key === "Home")
+      onHomeKeyDown();
+    if (key === "End")
+      onEndKeyDown();
+    if (key === "ArrowUp" && meridiem !== "AM")
+      handleChangeMeridiem("AM", e);
+    if (key === "ArrowDown" && meridiem !== "PM")
+      handleChangeMeridiem("PM", e);
+    if (key === "Backspace") {
+      if (meridiem?.length === 2)
+        handleChangeMeridiem("", e);
+      else
+        minutesInputRef?.current?.focus?.();
     }
-  }, [meridiem, handleChangeMeridiem, withAnyRightController, withClearBtn, clearButtonRef, withAnyPicker, pickerButtonRef]);
-  const onMeridiemKeyDown = useCallback(e => {
-    var _lastSegmentRef$curre5, _lastSegmentRef$curre6;
-
-    const {
-      key,
-      ctrlKey,
-      metaKey
-    } = e;
-    if (homeEndArrowUpDownKeys.includes(key)) e.preventDefault();
-    if (homeEndArrowUpDownKeys.includes(key)) e.stopPropagation();
-    if (key === 'Home') onHomeKeyDown();
-    if (key === 'End') onEndKeyDown();
-    if (key === 'ArrowUp' && meridiem !== 'AM') handleChangeMeridiem('AM', e);
-    if (key === 'ArrowDown' && meridiem !== 'PM') handleChangeMeridiem('PM', e); // regressive backspace functionality
-
-    if (key === 'Backspace') {
-      var _minutesInputRef$curr5, _minutesInputRef$curr6;
-
-      if ((meridiem === null || meridiem === void 0 ? void 0 : meridiem.length) === 2) handleChangeMeridiem('', e);else minutesInputRef === null || minutesInputRef === void 0 ? void 0 : (_minutesInputRef$curr5 = minutesInputRef.current) === null || _minutesInputRef$curr5 === void 0 ? void 0 : (_minutesInputRef$curr6 = _minutesInputRef$curr5.focus) === null || _minutesInputRef$curr6 === void 0 ? void 0 : _minutesInputRef$curr6.call(_minutesInputRef$curr5);
-    } // focus last fragment on fill with now
-
-
-    if ((ctrlKey || metaKey) && key === ';') lastSegmentRef === null || lastSegmentRef === void 0 ? void 0 : (_lastSegmentRef$curre5 = lastSegmentRef.current) === null || _lastSegmentRef$curre5 === void 0 ? void 0 : (_lastSegmentRef$curre6 = _lastSegmentRef$curre5.focus) === null || _lastSegmentRef$curre6 === void 0 ? void 0 : _lastSegmentRef$curre6.call(_lastSegmentRef$curre5);
+    if ((ctrlKey || metaKey) && key === ";")
+      lastSegmentRef?.current?.focus?.();
   }, [onHomeKeyDown, onEndKeyDown, meridiem, handleChangeMeridiem, lastSegmentRef, minutesInputRef]);
-  const onMeridiemBlur = useCallback(e => {
-    var _e$target6, _e$target6$value, _e$target6$value$toUp;
-
-    const newMeridiem = e === null || e === void 0 ? void 0 : (_e$target6 = e.target) === null || _e$target6 === void 0 ? void 0 : (_e$target6$value = _e$target6.value) === null || _e$target6$value === void 0 ? void 0 : (_e$target6$value$toUp = _e$target6$value.toUpperCase) === null || _e$target6$value$toUp === void 0 ? void 0 : _e$target6$value$toUp.call(_e$target6$value);
-    if (newMeridiem.length === 1) handleChangeMeridiem("".concat(newMeridiem, "M"), e, {
-      isAutomaticFillTrigger: true
-    });
+  const onMeridiemBlur = useCallback((e) => {
+    const newMeridiem = e?.target?.value?.toUpperCase?.();
+    if (newMeridiem.length === 1)
+      handleChangeMeridiem(`${newMeridiem}M`, e, {
+        isAutomaticFillTrigger: true
+      });
   }, [handleChangeMeridiem]);
   return useMemo(() => ({
     hours,
@@ -245,7 +244,30 @@ const useTimeInputs = () => {
     onHoursKeyDown,
     onMinutesKeyDown,
     onMeridiemKeyDown
-  }), [hours, minutes, meridiem, autoFocusHourInput, disabled, handleChangeHours, onHoursFocus, onHoursChange, handleChangeMinutes, onMinutesFocus, onMinutesChange, handleChangeMeridiem, onMeridiemFocus, onMeridiemChange, onHoursBlur, onMinutesBlur, onMeridiemBlur, onHoursKeyDown, onMinutesKeyDown, onMeridiemKeyDown]);
+  }), [
+    hours,
+    minutes,
+    meridiem,
+    autoFocusHourInput,
+    disabled,
+    handleChangeHours,
+    onHoursFocus,
+    onHoursChange,
+    handleChangeMinutes,
+    onMinutesFocus,
+    onMinutesChange,
+    handleChangeMeridiem,
+    onMeridiemFocus,
+    onMeridiemChange,
+    onHoursBlur,
+    onMinutesBlur,
+    onMeridiemBlur,
+    onHoursKeyDown,
+    onMinutesKeyDown,
+    onMeridiemKeyDown
+  ]);
+};
+export {
+  useTimeInputs
 };
-
-export { useTimeInputs };
+//# sourceMappingURL=useTimeInputs.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/controlled-date-time-picker/parts/TimeInputs/useTimeInputs.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport { useCallback, useMemo, useContext } from 'react';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX';\nimport type { onChangeFuncT, useTimeInputsRT, onBlurFuncT, onFocusFuncT, onKeyDownT } from '../../index.d';\nimport { homeEndArrowUpDownKeys, homeEndArrowUpDownSemiKeys, homeEndArrowUpDownSpaceKeys } from '../../utils/constants';\nimport { prependStringWithPlaceHolders } from '../../utils/stringHelpers';\n\nexport const useTimeInputs = (): useTimeInputsRT => {\n  const {\n    props: { minutesInterval, disabled },\n    lastSegmentRef,\n    hours,\n    minutes,\n    meridiem,\n    hideDate,\n    withAnyRightController,\n    withAnyPicker,\n    withClearBtn,\n    isWithDateInputs,\n    hourInputRef,\n    minutesInputRef,\n    meridiemInputRef,\n    yearInputRef,\n    clearButtonRef,\n    pickerButtonRef,\n    monthInputRef,\n    autoFocusHourInput,\n    handleChangeHours,\n    handleChangeMinutes,\n    handleChangeMeridiem,\n    setLatestInteractionRegion,\n  } = useContext(ControlledDateTimePickerContext);\n\n  const setLatestInteractionRegionTimeInputs = useCallback(() => {\n    setLatestInteractionRegion('time-inputs');\n  }, [setLatestInteractionRegion]);\n\n  const onHomeKeyDown = useCallback(() => {\n    if (!hideDate) monthInputRef?.current?.focus?.();\n    else hourInputRef?.current?.focus?.();\n  }, [hideDate, monthInputRef, hourInputRef]);\n  const onEndKeyDown = useCallback(() => {\n    if (withAnyPicker) pickerButtonRef?.current?.focus?.();\n    else if (withClearBtn) clearButtonRef?.current?.focus?.();\n    else meridiemInputRef?.current?.focus?.();\n  }, [withAnyPicker, pickerButtonRef, withClearBtn, clearButtonRef, meridiemInputRef]);\n\n  const onHoursFocus: onFocusFuncT = useCallback(() => {\n    setLatestInteractionRegionTimeInputs();\n  }, [setLatestInteractionRegionTimeInputs]);\n  const onHoursChange: onChangeFuncT = useCallback(\n    (e) => {\n      let newHours = e?.target?.value;\n      // converts hours 2~9 to 07~09\n      if (Number.parseInt(newHours, 10) > 1) newHours = prependStringWithPlaceHolders(newHours, 2);\n      handleChangeHours(newHours, e);\n      // auto-advance functionality:\n      if (newHours.length === 2) minutesInputRef?.current?.focus?.();\n    },\n    [minutesInputRef, handleChangeHours],\n  );\n  const onHoursKeyDown: onKeyDownT = useCallback(\n    (e) => {\n      const { key, ctrlKey, metaKey } = e;\n      const hoursStringConvertedToInteger = Number.parseInt(hours, 10);\n      if (homeEndArrowUpDownSemiKeys.includes(key)) e.preventDefault();\n      if (homeEndArrowUpDownSemiKeys.includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        const hoursInteger = Number.isNaN(hoursStringConvertedToInteger) ? 0 : hoursStringConvertedToInteger;\n        let newHours;\n        if (key === 'ArrowUp') newHours = hoursInteger + 1 <= 12 ? hoursInteger + 1 : hoursInteger;\n        else newHours = hoursInteger - 1 > 1 ? hoursInteger - 1 : 1;\n        newHours = prependStringWithPlaceHolders(`${newHours}`, 2);\n        handleChangeHours(newHours, e);\n      }\n      if (!Number.isNaN(hoursStringConvertedToInteger) && key === ':') {\n        const newHours = prependStringWithPlaceHolders(`${hoursStringConvertedToInteger}`, 2);\n        handleChangeHours(newHours, e);\n        // auto-advance functionality:\n        if (newHours.length === 2) minutesInputRef?.current?.focus?.();\n      }\n      // regressive backspace functionality\n      if (key === 'Backspace' && hours.length === 0 && isWithDateInputs) {\n        yearInputRef?.current?.focus?.();\n      }\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') lastSegmentRef?.current?.focus?.();\n    },\n    [\n      hours,\n      onHomeKeyDown,\n      onEndKeyDown,\n      isWithDateInputs,\n      lastSegmentRef,\n      handleChangeHours,\n      minutesInputRef,\n      yearInputRef,\n    ],\n  );\n  const onHoursBlur: onBlurFuncT = useCallback(\n    (e) => {\n      const newHours = e?.target?.value;\n      if (newHours === '0') handleChangeHours('01', e, { isAutomaticFillTrigger: true });\n      else if (newHours.length > 0 && newHours.length < 2)\n        handleChangeHours(prependStringWithPlaceHolders(newHours, 2), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeHours],\n  );\n\n  const onMinutesFocus: onFocusFuncT = useCallback(() => {\n    setLatestInteractionRegionTimeInputs();\n  }, [setLatestInteractionRegionTimeInputs]);\n  const onMinutesChange: onChangeFuncT = useCallback(\n    (e) => {\n      let newMinutes = e?.target?.value;\n      // converts minutes 7~9 to 07~09\n      if (Number.parseInt(newMinutes, 10) > 6) newMinutes = prependStringWithPlaceHolders(newMinutes, 2);\n      handleChangeMinutes(newMinutes, e);\n\n      // auto-advance functionality:\n      // if (newMinutes.length === 2) secondsInputRef?.current?.focus?.();\n      if (newMinutes.length === 2) meridiemInputRef?.current?.focus?.();\n    },\n    [meridiemInputRef, handleChangeMinutes],\n  );\n  const onMinutesKeyDown: onKeyDownT = useCallback(\n    (e) => {\n      const { key, ctrlKey, metaKey } = e;\n      const minutesStringConvertedToInteger = Number.parseInt(minutes, 10);\n      if (homeEndArrowUpDownSpaceKeys.includes(key)) e.preventDefault();\n      if (homeEndArrowUpDownSpaceKeys.includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        const minutesInteger = Number.isNaN(minutesStringConvertedToInteger) ? 0 : minutesStringConvertedToInteger;\n        let newMinutes;\n        if (key === 'ArrowUp')\n          newMinutes = minutesInteger + minutesInterval <= 59 ? minutesInteger + minutesInterval : minutesInteger;\n        else newMinutes = minutesInteger - minutesInterval > 0 ? minutesInteger - minutesInterval : 0;\n        newMinutes = prependStringWithPlaceHolders(`${newMinutes}`, 2);\n        handleChangeMinutes(newMinutes, e);\n      }\n      if (!Number.isNaN(minutesStringConvertedToInteger) && key === ' ') {\n        const newMinutes = prependStringWithPlaceHolders(`${minutesStringConvertedToInteger}`, 2);\n        handleChangeMinutes(newMinutes, e);\n        // auto-advance functionality:\n        // if (newMinutes.length === 2) secondsInputRef?.current?.focus?.();\n        if (newMinutes.length === 2) meridiemInputRef?.current?.focus?.();\n      }\n      // regressive backspace functionality\n      if (key === 'Backspace' && minutes?.length === 0) {\n        hourInputRef?.current?.focus?.();\n      }\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') lastSegmentRef?.current?.focus?.();\n    },\n    [\n      minutes,\n      onHomeKeyDown,\n      onEndKeyDown,\n      lastSegmentRef,\n      minutesInterval,\n      handleChangeMinutes,\n      meridiemInputRef,\n      hourInputRef,\n    ],\n  );\n  const onMinutesBlur: onBlurFuncT = useCallback(\n    (e) => {\n      const newMinutes = e?.target?.value;\n      if (newMinutes.length > 0 && newMinutes.length < 2)\n        handleChangeMinutes(prependStringWithPlaceHolders(newMinutes, 2), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeMinutes],\n  );\n\n  const onMeridiemFocus: onFocusFuncT = useCallback(() => {\n    setLatestInteractionRegionTimeInputs();\n  }, [setLatestInteractionRegionTimeInputs]);\n  const onMeridiemChange: onChangeFuncT = useCallback(\n    (e) => {\n      let newMeridiem = e?.target?.value?.toUpperCase?.();\n      // if new value is length 1,\n      //   if previous value was empty, auto-complete\n      //   if previous value was not empty, set to empty (regressive backspace)\n      if (newMeridiem.length === 1)\n        if (meridiem === '') newMeridiem = `${newMeridiem}M`;\n        else newMeridiem = '';\n      handleChangeMeridiem(newMeridiem, e);\n      // auto-advance functionality:\n      if (newMeridiem.length === 2 && withAnyRightController) {\n        if (withClearBtn) clearButtonRef.current?.focus?.();\n        else if (withAnyPicker) pickerButtonRef?.current?.focus?.();\n      }\n    },\n    [\n      meridiem,\n      handleChangeMeridiem,\n      withAnyRightController,\n      withClearBtn,\n      clearButtonRef,\n      withAnyPicker,\n      pickerButtonRef,\n    ],\n  );\n  const onMeridiemKeyDown: onKeyDownT = useCallback(\n    (e) => {\n      const { key, ctrlKey, metaKey } = e;\n      if (homeEndArrowUpDownKeys.includes(key)) e.preventDefault();\n      if (homeEndArrowUpDownKeys.includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' && meridiem !== 'AM') handleChangeMeridiem('AM', e);\n      if (key === 'ArrowDown' && meridiem !== 'PM') handleChangeMeridiem('PM', e);\n      // regressive backspace functionality\n      if (key === 'Backspace') {\n        if (meridiem?.length === 2) handleChangeMeridiem('', e);\n        else minutesInputRef?.current?.focus?.();\n      }\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') lastSegmentRef?.current?.focus?.();\n    },\n    [onHomeKeyDown, onEndKeyDown, meridiem, handleChangeMeridiem, lastSegmentRef, minutesInputRef],\n  );\n  const onMeridiemBlur: onBlurFuncT = useCallback(\n    (e) => {\n      const newMeridiem = e?.target?.value?.toUpperCase?.();\n\n      if (newMeridiem.length === 1)\n        handleChangeMeridiem(`${newMeridiem}M`, e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeMeridiem],\n  );\n\n  return useMemo(\n    () => ({\n      hours,\n      minutes,\n      meridiem,\n      autoFocusHourInput,\n      disabled,\n      handleChangeHours,\n      onHoursFocus,\n      onHoursChange,\n      handleChangeMinutes,\n      onMinutesFocus,\n      onMinutesChange,\n      handleChangeMeridiem,\n      onMeridiemFocus,\n      onMeridiemChange,\n      onHoursBlur,\n      onMinutesBlur,\n      onMeridiemBlur,\n      onHoursKeyDown,\n      onMinutesKeyDown,\n      onMeridiemKeyDown,\n    }),\n    [\n      hours,\n      minutes,\n      meridiem,\n      autoFocusHourInput,\n      disabled,\n      handleChangeHours,\n      onHoursFocus,\n      onHoursChange,\n      handleChangeMinutes,\n      onMinutesFocus,\n      onMinutesChange,\n      handleChangeMeridiem,\n      onMeridiemFocus,\n      onMeridiemChange,\n      onHoursBlur,\n      onMinutesBlur,\n      onMeridiemBlur,\n      onHoursKeyDown,\n      onMinutesKeyDown,\n      onMeridiemKeyDown,\n    ],\n  );\n};\n"],
+  "mappings": "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",
+  "names": []
+}

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

@@ -1,7 +1,10 @@
+import * as React from "react";
 const fixedValues = {
-  smallInputWidth: '28px',
-  largeInputWidth: '40px',
-  separatorWidth: '7px'
+  smallInputWidth: "28px",
+  largeInputWidth: "40px",
+  separatorWidth: "7px"
 };
-
-export { fixedValues };
+export {
+  fixedValues
+};
+//# sourceMappingURL=config.js.map