@elliemae/ds-form 2.3.0-next.3 → 3.0.0-alpha.0

package/dist/cjs/TimeInput/TimeInputs.js

@@ -0,0 +1,339 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var TimeInputs_exports = {};
+__export(TimeInputs_exports, {
+  TimeInputs: () => TimeInputs,
+  default: () => TimeInputs_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_classnames = require("@elliemae/ds-classnames");
+var import_moment = __toESM(require("moment"));
+var import_utils = require("./utils");
+var import_constants = require("@elliemae/ds-shared/constants");
+const blockName = "input-times-group";
+const InputTimesGroup = (0, import_ds_classnames.aggregatedClasses)("div")(blockName);
+const TimeInput = (0, import_ds_classnames.aggregatedClasses)("input")(blockName, "input");
+const Divider = (0, import_ds_classnames.aggregatedClasses)("span")(blockName, "divider", ({ value }) => ({
+  value
+}));
+const TimeDivider = ({ content = ":", value = "" }) => /* @__PURE__ */ import_react.default.createElement(Divider, {
+  value: !!value
+}, content);
+const TimeInputs = ({
+  time,
+  format,
+  use12Hours,
+  step = 1,
+  showHours,
+  showMinutes,
+  showSeconds,
+  onChange,
+  disabled,
+  innerRef,
+  clearable,
+  "arial-label": ariaLabel,
+  "aria-label": ariaLabel2
+}) => {
+  const [meridiem, setMeridiem] = (0, import_react.useState)("");
+  const [hours, setHours] = (0, import_react.useState)("");
+  const [minutes, setMinutes] = (0, import_react.useState)("");
+  const [hasInputValue, setHasInputValue] = (0, import_react.useState)(false);
+  const [seconds, setSeconds] = (0, import_react.useState)("");
+  const [currentKey, setCurrentKey] = (0, import_react.useState)("");
+  const [hasInputBeenTriggered, setHasInputBeenTriggered] = (0, import_react.useState)(false);
+  const [lastTypedNumber, setLastTypedNumber] = (0, import_react.useState)(null);
+  const inputRefs = {
+    hours: null,
+    minutes: null,
+    seconds: null,
+    meridiem: null
+  };
+  (0, import_react.useEffect)(() => {
+    if (time && (0, import_moment.default)(time).isValid()) {
+      const timeValues = (0, import_utils.getTimeValuesFromTime)(time, format, use12Hours);
+      setMeridiem(timeValues.meridiem);
+      setHours(timeValues.hours);
+      setMinutes(timeValues.minutes);
+      setSeconds(timeValues.seconds);
+    } else {
+      setMeridiem("");
+      setHours("");
+      setMinutes("");
+      setSeconds("");
+    }
+  }, [time, format, use12Hours]);
+  (0, import_react.useEffect)(() => {
+    const selectedTime = time || (0, import_moment.default)();
+    if (isTimeCompletelySet() && selectedTime.hours && hasInputBeenTriggered) {
+      if (showHours && hours)
+        selectedTime.hours(hours);
+      if (showMinutes && minutes)
+        selectedTime.minutes(minutes);
+      if (showSeconds && seconds)
+        selectedTime.seconds(seconds);
+      if (use12Hours && meridiem) {
+        const nextHours = meridiem.toLowerCase() === import_constants.AM ? hours % 12 : hours % 12 + 12;
+        selectedTime.hour(nextHours);
+      }
+      onChange(selectedTime);
+      setHasInputBeenTriggered(false);
+    }
+  }, [hours, minutes, seconds, meridiem]);
+  const focusNextInputIfNeeded = (currentEl, max, number) => {
+    if ((0, import_utils.shouldFocusNextInput)(max, number, currentEl.value) && !(0, import_utils.isArrowIncrementDecrement)(currentKey) && !hasInputValue) {
+      (0, import_utils.focusNextInput)(currentEl);
+    }
+  };
+  const getNextTimeValue = (value, incrementing = true) => {
+    const parsedValue = (0, import_utils.parseTimeNumberFromText)(value);
+    return incrementing ? parsedValue + step : parsedValue - step;
+  };
+  const onInputFocus = (e) => {
+    e.preventDefault();
+    e.stopPropagation();
+    e.target.select();
+  };
+  const onClick = (e) => {
+    if (e.target.value) {
+      setHasInputValue(true);
+    }
+  };
+  const onKeyDown = (event, max) => {
+    const { target } = event;
+    const { value } = target;
+    setLastTypedNumber(event.key);
+    switch (event.key) {
+      case import_constants.ARROW_UP: {
+        event.preventDefault();
+        setCurrentKey(event.key);
+        const incrementedValue = getNextTimeValue(value);
+        (0, import_utils.setNativeValue)(event.target, incrementedValue);
+        break;
+      }
+      case import_constants.ARROW_DOWN: {
+        event.preventDefault();
+        setCurrentKey(event.key);
+        const decrementedValue = getNextTimeValue(value, false);
+        (0, import_utils.setNativeValue)(event.target, decrementedValue);
+        break;
+      }
+      case import_constants.BACKSPACE: {
+        event.preventDefault();
+        if (!value) {
+          (0, import_utils.focusPreviousInput)(event.target);
+        } else {
+          (0, import_utils.setNativeValue)(event.target, "");
+        }
+        break;
+      }
+      case import_constants.ESCAPE: {
+        event.preventDefault();
+        event.target.blur();
+        break;
+      }
+      case import_constants.HOME: {
+        event.preventDefault();
+        (0, import_utils.setNativeValue)(event.target, String(max));
+        (0, import_utils.focusNextInput)(event.target);
+        break;
+      }
+      case import_constants.END: {
+        event.preventDefault();
+        (0, import_utils.setNativeValue)(event.target, "00");
+        (0, import_utils.focusNextInput)(event.target);
+        break;
+      }
+      case import_constants.SHIFT:
+        event.preventDefault();
+        setCurrentKey(event.key);
+        break;
+      default:
+        break;
+    }
+  };
+  const isTimeCompletelySet = () => {
+    let neededValues = [];
+    if (showHours)
+      neededValues = [...neededValues, hours || null];
+    if (showMinutes)
+      neededValues = [...neededValues, minutes || null];
+    if (showSeconds)
+      neededValues = [...neededValues, seconds || null];
+    if (use12Hours)
+      neededValues = [...neededValues, meridiem || null];
+    return !neededValues.some((value) => !value);
+  };
+  const handleSecondsChange = (e) => {
+    const { value } = e.target;
+    const secondsHandled = (0, import_utils.parseTimeNumberFromText)(value);
+    const nextSeconds = (0, import_utils.getValidTimeNumber)(import_constants.GENERAL_TIME_RANGE, secondsHandled, lastTypedNumber);
+    setSeconds((0, import_utils.formatSeconds)(format, nextSeconds));
+    setHasInputBeenTriggered(true);
+    focusNextInputIfNeeded(e.target, import_constants.GENERAL_TIME_RANGE.max, value);
+  };
+  const handleMinutesChange = (e) => {
+    const { value } = e.target;
+    const minutesHandled = (0, import_utils.parseTimeNumberFromText)(value);
+    const nextMinutes = (0, import_utils.getValidTimeNumber)(import_constants.GENERAL_TIME_RANGE, minutesHandled, lastTypedNumber);
+    setMinutes((0, import_utils.formatMinutes)(format, nextMinutes));
+    setHasInputBeenTriggered(true);
+    focusNextInputIfNeeded(e.target, import_constants.GENERAL_TIME_RANGE.max, value);
+  };
+  const handleHoursChange = (e) => {
+    const { value } = e.target;
+    const hour = (0, import_utils.parseTimeNumberFromText)(value);
+    const hoursRange = use12Hours ? import_constants.HOUR_RANGE_12 : import_constants.HOUR_RANGE_24;
+    const nextHour = (0, import_utils.getValidTimeNumber)(hoursRange, hour, lastTypedNumber);
+    setHours((0, import_utils.formatHour)(format, nextHour));
+    setHasInputBeenTriggered(true);
+    focusNextInputIfNeeded(e.target, hoursRange.max, value);
+  };
+  const handleMeridiemKeyDown = (e) => {
+    if (e.key === import_constants.ARROW_UP || e.key === "a") {
+      setMeridiem((0, import_utils.formatMeridiem)(format, import_constants.AM));
+    } else if (e.key === import_constants.ARROW_DOWN || e.key === "p") {
+      setMeridiem((0, import_utils.formatMeridiem)(format, import_constants.PM));
+    } else if (e.key === import_constants.SHIFT) {
+      setCurrentKey(e.key);
+    } else if (e.key === import_constants.BACKSPACE) {
+      setMeridiem("");
+    }
+    setHasInputBeenTriggered(true);
+  };
+  const handleMeridiemBlur = (e) => {
+    const { value } = e.target;
+    if (value !== import_constants.AM && value !== import_constants.PM) {
+      setMeridiem("");
+    }
+  };
+  const handleOnBlur = (event) => {
+    const selectedTime = (0, import_moment.default)();
+    if (clearable && !event.currentTarget.contains(event.relatedTarget)) {
+      if (showHours && hours)
+        selectedTime.hours(hours);
+      if (showMinutes && minutes)
+        selectedTime.minutes(minutes);
+      if (showSeconds && seconds)
+        selectedTime.seconds(seconds);
+      if (use12Hours && meridiem) {
+        const nextHours = meridiem.toLowerCase() === import_constants.AM ? hours % 12 : hours % 12 + 12;
+        selectedTime.hour(nextHours);
+      }
+      onChange(selectedTime);
+    }
+  };
+  const renderSecondsInput = () => {
+    if (!showSeconds)
+      return null;
+    return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
+      ...(0, import_utils.commonInputProps)((e) => onKeyDown(e, import_constants.GENERAL_TIME_RANGE.max), onInputFocus, onClick),
+      key: "seconds-input",
+      "data-testid": "ds-time-input__seconds",
+      "aria-label": ariaLabel || ariaLabel2 || "Seconds Input",
+      disabled,
+      innerRef: (node) => inputRefs.seconds = node,
+      onChange: handleSecondsChange,
+      placeholder: (0, import_utils.placeholderFormat)(import_constants.PLACEHOLDER_TIME.seconds, format),
+      value: seconds
+    });
+  };
+  const renderMinutesInput = () => {
+    if (!showMinutes)
+      return null;
+    return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
+      ...(0, import_utils.commonInputProps)((e) => onKeyDown(e, import_constants.GENERAL_TIME_RANGE.max), onInputFocus, onClick),
+      key: "minutes-input",
+      "data-testid": "ds-time-input__minutes",
+      "aria-label": ariaLabel || ariaLabel2 || "Minutes Input",
+      disabled,
+      innerRef: (node) => inputRefs.minutes = node,
+      onChange: handleMinutesChange,
+      placeholder: (0, import_utils.placeholderFormat)(import_constants.PLACEHOLDER_TIME.minutes, format),
+      value: minutes
+    });
+  };
+  const renderHoursInput = () => {
+    if (!showHours)
+      return null;
+    const hourFormatRange = use12Hours ? import_constants.HOUR_RANGE_12 : import_constants.HOUR_RANGE_24;
+    return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
+      ...(0, import_utils.commonInputProps)((e) => onKeyDown(e, hourFormatRange.max), onInputFocus, onClick),
+      key: "hour-input",
+      "data-testid": "ds-time-input__hours",
+      "aria-label": ariaLabel || ariaLabel2 || "Hours Input",
+      disabled,
+      innerRef: (node) => inputRefs.hours = node,
+      onChange: handleHoursChange,
+      placeholder: (0, import_utils.placeholderFormat)(import_constants.PLACEHOLDER_TIME.hour, format, use12Hours),
+      value: hours
+    });
+  };
+  const renderMeridiemInput = () => {
+    if (!use12Hours)
+      return null;
+    return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
+      ...import_utils.commonInputProps,
+      key: "meridiem-input",
+      "data-testid": "ds-time-input__ampm",
+      "aria-label": ariaLabel || ariaLabel2 || "Meridiem Input",
+      disabled,
+      onBlur: handleMeridiemBlur,
+      onKeyDown: handleMeridiemKeyDown,
+      placeholder: (0, import_utils.placeholderFormat)(import_constants.PLACEHOLDER_TIME.meridiem, format),
+      value: meridiem
+    });
+  };
+  const renderTimeInputs = () => {
+    const inputs = [
+      renderHoursInput(),
+      renderMinutesInput(),
+      renderSecondsInput()
+    ];
+    const inputsWithDividers = inputs.reduce((acc, input, index) => input ? acc.concat([
+      index ? /* @__PURE__ */ import_react.default.createElement(TimeDivider, {
+        key: index,
+        content: ":",
+        value: input.props.value
+      }) : null,
+      input
+    ]) : acc, []);
+    return [
+      inputsWithDividers,
+      import_react.default.createElement("span", { key: "span" }),
+      renderMeridiemInput()
+    ];
+  };
+  return /* @__PURE__ */ import_react.default.createElement(InputTimesGroup, {
+    onBlur: handleOnBlur,
+    innerRef
+  }, renderTimeInputs());
+};
+var TimeInputs_default = TimeInputs;
+module.exports = __toCommonJS(TimeInputs_exports);
+//# sourceMappingURL=TimeInputs.js.map

package/dist/cjs/TimeInput/TimeInputs.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/TimeInput/TimeInputs.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useEffect, useState } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport {\n  commonInputProps,\n  formatHour,\n  formatMinutes,\n  formatSeconds,\n  formatMeridiem,\n  getValidTimeNumber,\n  setNativeValue,\n  parseTimeNumberFromText,\n  focusNextInput,\n  focusPreviousInput,\n  getTimeValuesFromTime,\n  isArrowIncrementDecrement,\n  shouldFocusNextInput,\n  placeholderFormat,\n} from './utils';\nimport {\n  AM,\n  PM,\n  ARROW_UP,\n  ARROW_DOWN,\n  BACKSPACE,\n  ESCAPE,\n  HOME,\n  HOUR_RANGE_12,\n  HOUR_RANGE_24,\n  GENERAL_TIME_RANGE,\n  END,\n  PLACEHOLDER_TIME,\n  SHIFT,\n} from '@elliemae/ds-shared/constants';\n\nconst blockName = 'input-times-group';\n\nconst InputTimesGroup = aggregatedClasses('div')(blockName);\nconst TimeInput = aggregatedClasses('input')(blockName, 'input');\nconst Divider = aggregatedClasses('span')(\n  blockName,\n  'divider',\n  ({ value }) => ({\n    value,\n  }),\n);\n\n// eslint-disable-next-line react/prop-types\nconst TimeDivider = ({ content = ':', value = '' }) => (\n  <Divider value={!!value}>{content}</Divider>\n);\n\nconst TimeInputs = ({\n  time,\n  format,\n  use12Hours,\n  step = 1,\n  showHours,\n  showMinutes,\n  showSeconds,\n  onChange,\n  disabled,\n  innerRef,\n  clearable,\n  'arial-label': ariaLabel,\n  'aria-label': ariaLabel2,\n}) => {\n  const [meridiem, setMeridiem] = useState('');\n  const [hours, setHours] = useState('');\n  const [minutes, setMinutes] = useState('');\n  const [hasInputValue, setHasInputValue] = useState(false);\n  const [seconds, setSeconds] = useState('');\n  const [currentKey, setCurrentKey] = useState('');\n  const [hasInputBeenTriggered, setHasInputBeenTriggered] = useState(false);\n\n  const [lastTypedNumber, setLastTypedNumber] = useState(null);\n  const inputRefs = {\n    hours: null,\n    minutes: null,\n    seconds: null,\n    meridiem: null,\n  };\n\n  useEffect(() => {\n    if (time && moment(time).isValid()) {\n      const timeValues = getTimeValuesFromTime(time, format, use12Hours);\n\n      setMeridiem(timeValues.meridiem);\n      setHours(timeValues.hours);\n      setMinutes(timeValues.minutes);\n      setSeconds(timeValues.seconds);\n    } else {\n      setMeridiem('');\n      setHours('');\n      setMinutes('');\n      setSeconds('');\n    }\n  }, [time, format, use12Hours]);\n\n  useEffect(() => {\n    const selectedTime = time || moment();\n    if (isTimeCompletelySet() && selectedTime.hours && hasInputBeenTriggered) {\n      if (showHours && hours) selectedTime.hours(hours);\n      if (showMinutes && minutes) selectedTime.minutes(minutes);\n      if (showSeconds && seconds) selectedTime.seconds(seconds);\n      if (use12Hours && meridiem) {\n        const nextHours =\n          meridiem.toLowerCase() === AM ? hours % 12 : (hours % 12) + 12;\n        selectedTime.hour(nextHours);\n      }\n      onChange(selectedTime);\n      setHasInputBeenTriggered(false);\n    }\n  }, [hours, minutes, seconds, meridiem]);\n\n  const focusNextInputIfNeeded = (currentEl, max, number) => {\n    if (\n      shouldFocusNextInput(max, number, currentEl.value) &&\n      !isArrowIncrementDecrement(currentKey) &&\n      !hasInputValue\n    ) {\n      focusNextInput(currentEl);\n    }\n  };\n\n  const getNextTimeValue = (value, incrementing = true) => {\n    const parsedValue = parseTimeNumberFromText(value);\n    return incrementing ? parsedValue + step : parsedValue - step;\n  };\n\n  const onInputFocus = (e) => {\n    e.preventDefault();\n    e.stopPropagation();\n    e.target.select();\n  };\n\n  const onClick = (e) => {\n    if (e.target.value) {\n      setHasInputValue(true);\n    }\n  };\n\n  // eslint-disable-next-line max-statements\n  const onKeyDown = (event, max) => {\n    const { target } = event;\n    const { value } = target;\n    setLastTypedNumber(event.key);\n    switch (event.key) {\n      case ARROW_UP: {\n        event.preventDefault();\n        setCurrentKey(event.key);\n        const incrementedValue = getNextTimeValue(value);\n        setNativeValue(event.target, incrementedValue);\n        break;\n      }\n      case ARROW_DOWN: {\n        event.preventDefault();\n        setCurrentKey(event.key);\n        const decrementedValue = getNextTimeValue(value, false);\n        setNativeValue(event.target, decrementedValue);\n        break;\n      }\n      case BACKSPACE: {\n        event.preventDefault();\n        if (!value) {\n          focusPreviousInput(event.target);\n        } else {\n          setNativeValue(event.target, '');\n        }\n        break;\n      }\n      case ESCAPE: {\n        event.preventDefault();\n        event.target.blur();\n        break;\n      }\n      case HOME: {\n        event.preventDefault();\n        setNativeValue(event.target, String(max));\n        focusNextInput(event.target);\n        break;\n      }\n      case END: {\n        event.preventDefault();\n        setNativeValue(event.target, '00');\n        focusNextInput(event.target);\n        break;\n      }\n      case SHIFT:\n        event.preventDefault();\n        setCurrentKey(event.key);\n        break;\n      default:\n        break;\n    }\n  };\n\n  const isTimeCompletelySet = () => {\n    let neededValues = [];\n\n    if (showHours) neededValues = [...neededValues, hours || null];\n    if (showMinutes) neededValues = [...neededValues, minutes || null];\n    if (showSeconds) neededValues = [...neededValues, seconds || null];\n    if (use12Hours) neededValues = [...neededValues, meridiem || null];\n\n    return !neededValues.some((value) => !value);\n  };\n\n  const handleSecondsChange = (e) => {\n    const { value } = e.target;\n    const secondsHandled = parseTimeNumberFromText(value);\n\n    const nextSeconds = getValidTimeNumber(\n      GENERAL_TIME_RANGE,\n      secondsHandled,\n      lastTypedNumber,\n    );\n\n    setSeconds(formatSeconds(format, nextSeconds));\n    setHasInputBeenTriggered(true);\n    focusNextInputIfNeeded(e.target, GENERAL_TIME_RANGE.max, value);\n  };\n\n  const handleMinutesChange = (e) => {\n    const { value } = e.target;\n    const minutesHandled = parseTimeNumberFromText(value);\n    const nextMinutes = getValidTimeNumber(\n      GENERAL_TIME_RANGE,\n      minutesHandled,\n      lastTypedNumber,\n    );\n\n    setMinutes(formatMinutes(format, nextMinutes));\n    setHasInputBeenTriggered(true);\n    focusNextInputIfNeeded(e.target, GENERAL_TIME_RANGE.max, value);\n  };\n\n  const handleHoursChange = (e) => {\n    const { value } = e.target;\n    const hour = parseTimeNumberFromText(value);\n    const hoursRange = use12Hours ? HOUR_RANGE_12 : HOUR_RANGE_24;\n\n    const nextHour = getValidTimeNumber(hoursRange, hour, lastTypedNumber);\n    setHours(formatHour(format, nextHour));\n    setHasInputBeenTriggered(true);\n    focusNextInputIfNeeded(e.target, hoursRange.max, value);\n  };\n\n  const handleMeridiemKeyDown = (e) => {\n    if (e.key === ARROW_UP || e.key === 'a') {\n      setMeridiem(formatMeridiem(format, AM));\n    } else if (e.key === ARROW_DOWN || e.key === 'p') {\n      setMeridiem(formatMeridiem(format, PM));\n    } else if (e.key === SHIFT) {\n      setCurrentKey(e.key);\n    } else if (e.key === BACKSPACE) {\n      setMeridiem('');\n    }\n    setHasInputBeenTriggered(true);\n  };\n\n  const handleMeridiemBlur = (e) => {\n    const { value } = e.target;\n    if (value !== AM && value !== PM) {\n      setMeridiem('');\n    }\n  };\n\n  const handleOnBlur = (event) => {\n    const selectedTime = moment();\n    if (clearable && !event.currentTarget.contains(event.relatedTarget)) {\n      if (showHours && hours) selectedTime.hours(hours);\n      if (showMinutes && minutes) selectedTime.minutes(minutes);\n      if (showSeconds && seconds) selectedTime.seconds(seconds);\n      if (use12Hours && meridiem) {\n        const nextHours =\n          meridiem.toLowerCase() === AM ? hours % 12 : (hours % 12) + 12;\n        selectedTime.hour(nextHours);\n      }\n      onChange(selectedTime);\n    }\n  };\n\n  const renderSecondsInput = () => {\n    if (!showSeconds) return null;\n\n    return (\n      <TimeInput\n        {...commonInputProps(\n          (e) => onKeyDown(e, GENERAL_TIME_RANGE.max),\n          onInputFocus,\n          onClick,\n        )}\n        key=\"seconds-input\"\n        data-testid=\"ds-time-input__seconds\"\n        aria-label={ariaLabel || ariaLabel2 || 'Seconds Input'}\n        disabled={disabled}\n        // eslint-disable-next-line no-return-assign\n        innerRef={(node) => (inputRefs.seconds = node)}\n        onChange={handleSecondsChange}\n        placeholder={placeholderFormat(PLACEHOLDER_TIME.seconds, format)}\n        value={seconds}\n      />\n    );\n  };\n\n  const renderMinutesInput = () => {\n    if (!showMinutes) return null;\n\n    return (\n      <TimeInput\n        {...commonInputProps(\n          (e) => onKeyDown(e, GENERAL_TIME_RANGE.max),\n          onInputFocus,\n          onClick,\n        )}\n        key=\"minutes-input\"\n        data-testid=\"ds-time-input__minutes\"\n        aria-label={ariaLabel || ariaLabel2 || 'Minutes Input'}\n        disabled={disabled}\n        // eslint-disable-next-line no-return-assign\n        innerRef={(node) => (inputRefs.minutes = node)}\n        onChange={handleMinutesChange}\n        placeholder={placeholderFormat(PLACEHOLDER_TIME.minutes, format)}\n        value={minutes}\n      />\n    );\n  };\n\n  const renderHoursInput = () => {\n    if (!showHours) return null;\n    const hourFormatRange = use12Hours ? HOUR_RANGE_12 : HOUR_RANGE_24;\n\n    return (\n      <TimeInput\n        {...commonInputProps(\n          (e) => onKeyDown(e, hourFormatRange.max),\n          onInputFocus,\n          onClick,\n        )}\n        key=\"hour-input\"\n        data-testid=\"ds-time-input__hours\"\n        aria-label={ariaLabel || ariaLabel2 || 'Hours Input'}\n        disabled={disabled}\n        // eslint-disable-next-line no-return-assign\n        innerRef={(node) => (inputRefs.hours = node)}\n        onChange={handleHoursChange}\n        placeholder={placeholderFormat(\n          PLACEHOLDER_TIME.hour,\n          format,\n          use12Hours,\n        )}\n        value={hours}\n      />\n    );\n  };\n\n  const renderMeridiemInput = () => {\n    if (!use12Hours) return null;\n\n    return (\n      <TimeInput\n        {...commonInputProps}\n        key=\"meridiem-input\"\n        data-testid=\"ds-time-input__ampm\"\n        aria-label={ariaLabel || ariaLabel2 || 'Meridiem Input'}\n        disabled={disabled}\n        onBlur={handleMeridiemBlur}\n        onKeyDown={handleMeridiemKeyDown}\n        placeholder={placeholderFormat(PLACEHOLDER_TIME.meridiem, format)}\n        value={meridiem}\n      />\n    );\n  };\n\n  const renderTimeInputs = () => {\n    const inputs = [\n      renderHoursInput(),\n      renderMinutesInput(),\n      renderSecondsInput(),\n    ];\n    /* eslint-disable indent */\n    const inputsWithDividers = inputs.reduce(\n      (acc, input, index) =>\n        input\n          ? acc.concat([\n              index ? (\n                <TimeDivider\n                  // eslint-disable-next-line react/no-array-index-key\n                  key={index}\n                  content=\":\"\n                  value={input.props.value}\n                />\n              ) : null,\n              input,\n            ])\n          : acc,\n      [],\n    );\n    /* eslint-enable indent */\n\n    return [\n      inputsWithDividers,\n      React.createElement('span', { key: 'span' }), // hack for next/prev focus\n      renderMeridiemInput(),\n    ];\n  };\n\n  return (\n    <InputTimesGroup onBlur={handleOnBlur} innerRef={innerRef}>\n      {renderTimeInputs()}\n    </InputTimesGroup>\n  );\n};\n\nexport { TimeInputs };\nexport default TimeInputs;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/cjs/TimeInput/index.js

@@ -0,0 +1,28 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var TimeInput_exports = {};
+var React = __toESM(require("react"));
+__reExport(TimeInput_exports, require("./DSTimeInput"));
+module.exports = __toCommonJS(TimeInput_exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/TimeInput/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/TimeInput/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["export * from './DSTimeInput';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;ADAvB,8BAAc;",
+  "names": []
+}

package/dist/cjs/TimeInput/utils.js

@@ -0,0 +1,166 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var utils_exports = {};
+__export(utils_exports, {
+  commonInputProps: () => commonInputProps,
+  focusNextInput: () => focusNextInput,
+  focusPreviousInput: () => focusPreviousInput,
+  formatHour: () => formatHour,
+  formatMeridiem: () => formatMeridiem,
+  formatMinutes: () => formatMinutes,
+  formatSeconds: () => formatSeconds,
+  getTimeValuesFromTime: () => getTimeValuesFromTime,
+  getValidTimeNumber: () => getValidTimeNumber,
+  isArrowIncrementDecrement: () => isArrowIncrementDecrement,
+  parseTimeNumberFromText: () => parseTimeNumberFromText,
+  placeholderFormat: () => placeholderFormat,
+  resetTimeValues: () => resetTimeValues,
+  setNativeValue: () => setNativeValue,
+  shouldFocusNextInput: () => shouldFocusNextInput
+});
+var React = __toESM(require("react"));
+var import_ds_utilities = require("@elliemae/ds-utilities");
+var import_ds_utilities2 = require("@elliemae/ds-utilities");
+var import_constants = require("@elliemae/ds-shared/constants");
+const isAM = (time) => time && time.hour() < 12;
+const isArrowIncrementDecrement = (key) => key === import_constants.ARROW_DOWN || key === import_constants.ARROW_UP || key === import_constants.SHIFT;
+const setNativeValue = (element, value) => {
+  if (!Object.getOwnPropertyDescriptor(element, "value"))
+    return;
+  const valueSetter = Object.getOwnPropertyDescriptor(element, "value").set;
+  const prototype = Object.getPrototypeOf(element);
+  const prototypeValueSetter = Object.getOwnPropertyDescriptor(prototype, "value").set;
+  if (valueSetter && valueSetter !== prototypeValueSetter) {
+    prototypeValueSetter.call(element, value);
+  } else {
+    valueSetter.call(element, value);
+  }
+  element.dispatchEvent(new Event("input", { bubbles: true }));
+};
+const placeholderFormat = (position, format, use12Hours) => {
+  if (position === import_constants.PLACEHOLDER_TIME.hour) {
+    return _placeholderHour(format, use12Hours);
+  }
+  if (position === import_constants.PLACEHOLDER_TIME.minutes) {
+    return format.indexOf("mm") > -1 ? "mm" : "m";
+  }
+  if (position === import_constants.PLACEHOLDER_TIME.seconds) {
+    return format.indexOf("ss") > -1 ? "ss" : "s";
+  }
+  if (position === import_constants.PLACEHOLDER_TIME.meridiem) {
+    return format.indexOf("A") > -1 ? "A" : "a";
+  }
+};
+const _placeholderHour = (format, use12Hours) => {
+  if (use12Hours) {
+    return format.indexOf("hh") > -1 ? "hh" : "h";
+  }
+  return format.indexOf("HH") > -1 ? "HH" : "H";
+};
+const formatTimeNumber = (value, shouldAddLeadingZeros) => {
+  if (value === null || value === void 0)
+    return "";
+  return shouldAddLeadingZeros ? (0, import_ds_utilities.addLeadingZeros)(2)(value) : String(value);
+};
+const formatMinutes = (format, value) => {
+  const shouldAddLeadingZeros = format.indexOf("mm") > -1;
+  return formatTimeNumber(value, shouldAddLeadingZeros);
+};
+const formatSeconds = (format, value) => {
+  const shouldAddLeadingZeros = format.indexOf("ss") > -1;
+  return formatTimeNumber(value, shouldAddLeadingZeros);
+};
+const formatHour = (format, value) => {
+  const shouldAddLeadingZeros = format.indexOf("HH") > -1 || format.indexOf("hh") > -1;
+  return formatTimeNumber(value, shouldAddLeadingZeros);
+};
+const formatMeridiem = (format, value) => format.indexOf("A") > -1 ? value.toUpperCase() : value.toLowerCase();
+const parseTimeNumberFromText = (stringValue) => {
+  const parsedInt = (0, import_ds_utilities2.parseInt)(stringValue);
+  if ((0, import_ds_utilities2.isNaN)(parsedInt))
+    return null;
+  return parsedInt;
+};
+const focusNextInput = (currentEl) => {
+  const nextElement = currentEl.nextElementSibling;
+  if (nextElement && nextElement.nextElementSibling) {
+    nextElement.nextElementSibling.focus();
+  }
+};
+const focusPreviousInput = (currentEl) => {
+  const previousElement = currentEl.previousElementSibling;
+  if (previousElement && previousElement.previousElementSibling) {
+    previousElement.previousElementSibling.focus();
+  }
+};
+const getValidTimeNumber = ({ min, max }, number, typed) => {
+  if (number === void 0 || number === null)
+    return null;
+  if (number > max) {
+    if ((0, import_ds_utilities2.isNaN)(typed))
+      return (0, import_ds_utilities2.parseInt)(typed);
+    return max;
+  }
+  if (number < min)
+    return min;
+  return number;
+};
+const shouldFocusNextInput = (max, number = 0, stringValue) => {
+  const safeString = String(stringValue);
+  const cleanString = safeString.startsWith("00") ? safeString.slice(1) : safeString;
+  return number * 10 > max || String(max).length === cleanString.length;
+};
+const getTimeValuesFromTime = (time, format, use12Hours) => {
+  if (!time || !time.hour)
+    return {};
+  const hours = use12Hours ? time.hour() % 12 || 12 : time.hour();
+  const minutes = time.minutes();
+  const seconds = time.seconds();
+  const meridiem = !isAM(time) ? import_constants.PM : import_constants.AM;
+  return {
+    hours: formatHour(format, hours),
+    minutes: formatMinutes(format, minutes),
+    seconds: formatSeconds(format, seconds),
+    meridiem
+  };
+};
+const resetTimeValues = () => ({
+  hours: "",
+  minutes: "",
+  seconds: "",
+  meridiem: import_constants.AM
+});
+const commonInputProps = (onKeyDown, onInputFocus, onClick) => ({
+  pattern: "[0-9]*",
+  type: "text",
+  onKeyDown,
+  onClick,
+  onFocus: onInputFocus
+});
+module.exports = __toCommonJS(utils_exports);
+//# sourceMappingURL=utils.js.map

package/dist/cjs/TimeInput/utils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/TimeInput/utils.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { addLeadingZeros } from '@elliemae/ds-utilities';\nimport { parseInt, isNaN } from '@elliemae/ds-utilities';\nimport {\n  AM,\n  PM,\n  ARROW_UP,\n  ARROW_DOWN,\n  SHIFT,\n  PLACEHOLDER_TIME,\n} from '@elliemae/ds-shared/constants';\n\nconst isAM = (time) => time && time.hour() < 12;\n\nexport const isArrowIncrementDecrement = (key) =>\n  key === ARROW_DOWN || key === ARROW_UP || key === SHIFT;\n\nexport const setNativeValue = (element, value) => {\n  if (!Object.getOwnPropertyDescriptor(element, 'value')) return;\n  const valueSetter = Object.getOwnPropertyDescriptor(element, 'value').set;\n  const prototype = Object.getPrototypeOf(element);\n  const prototypeValueSetter = Object.getOwnPropertyDescriptor(\n    prototype,\n    'value',\n  ).set;\n\n  if (valueSetter && valueSetter !== prototypeValueSetter) {\n    prototypeValueSetter.call(element, value);\n  } else {\n    valueSetter.call(element, value);\n  }\n  element.dispatchEvent(new Event('input', { bubbles: true }));\n};\n\nexport const placeholderFormat = (position, format, use12Hours) => {\n  if (position === PLACEHOLDER_TIME.hour) {\n    return _placeholderHour(format, use12Hours);\n  }\n  if (position === PLACEHOLDER_TIME.minutes) {\n    return format.indexOf('mm') > -1 ? 'mm' : 'm';\n  }\n  if (position === PLACEHOLDER_TIME.seconds) {\n    return format.indexOf('ss') > -1 ? 'ss' : 's';\n  }\n  if (position === PLACEHOLDER_TIME.meridiem) {\n    return format.indexOf('A') > -1 ? 'A' : 'a';\n  }\n};\n\nconst _placeholderHour = (format, use12Hours) => {\n  if (use12Hours) {\n    return format.indexOf('hh') > -1 ? 'hh' : 'h';\n  }\n  return format.indexOf('HH') > -1 ? 'HH' : 'H';\n};\n\nconst formatTimeNumber = (value, shouldAddLeadingZeros) => {\n  if (value === null || value === undefined) return '';\n  return shouldAddLeadingZeros ? addLeadingZeros(2)(value) : String(value);\n};\n\nexport const formatMinutes = (format, value) => {\n  const shouldAddLeadingZeros = format.indexOf('mm') > -1;\n  return formatTimeNumber(value, shouldAddLeadingZeros);\n};\nexport const formatSeconds = (format, value) => {\n  const shouldAddLeadingZeros = format.indexOf('ss') > -1;\n  return formatTimeNumber(value, shouldAddLeadingZeros);\n};\nexport const formatHour = (format, value) => {\n  const shouldAddLeadingZeros =\n    format.indexOf('HH') > -1 || format.indexOf('hh') > -1;\n  return formatTimeNumber(value, shouldAddLeadingZeros);\n};\n\nexport const formatMeridiem = (format, value) =>\n  format.indexOf('A') > -1 ? value.toUpperCase() : value.toLowerCase();\n\nexport const parseTimeNumberFromText = (stringValue) => {\n  const parsedInt = parseInt(stringValue);\n  if (isNaN(parsedInt)) return null;\n\n  return parsedInt;\n};\n\nexport const focusNextInput = (currentEl) => {\n  const nextElement = currentEl.nextElementSibling;\n  if (nextElement && nextElement.nextElementSibling) {\n    nextElement.nextElementSibling.focus();\n  }\n};\n\nexport const focusPreviousInput = (currentEl) => {\n  const previousElement = currentEl.previousElementSibling;\n  if (previousElement && previousElement.previousElementSibling) {\n    previousElement.previousElementSibling.focus();\n  }\n};\n\nexport const getValidTimeNumber = ({ min, max }, number, typed) => {\n  if (number === undefined || number === null) return null;\n  if (number > max) {\n    if (isNaN(typed)) return parseInt(typed);\n    return max;\n  }\n  if (number < min) return min;\n  return number;\n};\n\nexport const shouldFocusNextInput = (max, number = 0, stringValue) => {\n  const safeString = String(stringValue);\n  const cleanString = safeString.startsWith('00')\n    ? safeString.slice(1)\n    : safeString;\n  return number * 10 > max || String(max).length === cleanString.length;\n};\n\nexport const getTimeValuesFromTime = (time, format, use12Hours) => {\n  if (!time || !time.hour) return {};\n  const hours = use12Hours ? time.hour() % 12 || 12 : time.hour();\n  const minutes = time.minutes();\n  const seconds = time.seconds();\n  const meridiem = !isAM(time) ? PM : AM;\n\n  return {\n    hours: formatHour(format, hours),\n    minutes: formatMinutes(format, minutes),\n    seconds: formatSeconds(format, seconds),\n    meridiem,\n  };\n};\n\nexport const resetTimeValues = () => ({\n  hours: '',\n  minutes: '',\n  seconds: '',\n  meridiem: AM,\n});\n\nexport const commonInputProps = (onKeyDown, onInputFocus, onClick) => ({\n  pattern: '[0-9]*',\n  type: 'text',\n  onKeyDown,\n  onClick,\n  onFocus: onInputFocus,\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": []
+}