@elliemae/ds-controlled-form 2.2.0-alpha.4 → 3.0.0-next.2

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

@@ -1,12 +1,25 @@
-import * as React from "react";
-import React2 from "react";
-import { Grid } from "@elliemae/ds-grid";
-import { ControlledDateTimePickerContext } from "../ControlledDateTimePickerCTX";
-import { StyledInputsWrapperGrid } from "./Styleds";
-import { DateInputs } from "./DateInputs/DateInputs";
-import { TimeInputs } from "./TimeInputs/TimeInputs";
-import { PickersIcons } from "./Pickers/PickersIcons";
-import { ClearButton } from "./ClearButton/ClearButton";
+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 React from 'react';
+import { Grid } from '@elliemae/ds-grid';
+import { ControlledDateTimePickerContext } from '../ControlledDateTimePickerCTX.js';
+import { StyledInputsWrapperGrid } from './Styleds.js';
+import { DateInputs } from './DateInputs/DateInputs.js';
+import { TimeInputs } from './TimeInputs/TimeInputs.js';
+import { PickersIcons } from './Pickers/PickersIcons.js';
+import { ClearButton } from './ClearButton/ClearButton.js';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+
+var _DateInputs, _TimeInputs, _ClearButton, _PickersIcons;
+
+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 ControlledDateTimePickerContent = () => {
   const {
     hideDate,
@@ -19,41 +32,41 @@ const ControlledDateTimePickerContent = () => {
     withAnyRightController,
     shouldPreserveClearableSpace,
     isControllerOnly,
-    props: { hasError, dataAttrs, disabled },
+    props: {
+      hasError,
+      dataAttrs,
+      disabled
+    },
     onGlobalKeyDown
-  } = React2.useContext(ControlledDateTimePickerContext);
-  const resetLatestInteraction = React2.useCallback(() => {
-    setLatestInteractionRegion("");
+  } = React.useContext(ControlledDateTimePickerContext);
+  const resetLatestInteraction = React.useCallback(() => {
+    setLatestInteractionRegion('');
   }, [setLatestInteractionRegion]);
   const mainCols = [];
-  if (!hideDate)
-    mainCols.push("auto");
-  if (!hideTime)
-    mainCols.push("auto");
-  if (withAnyRightController)
-    mainCols.push("auto");
+  if (!hideDate) mainCols.push('auto');
+  if (!hideTime) mainCols.push('auto');
+  if (withAnyRightController) mainCols.push('auto');
   const rightControlCols = [];
-  if (shouldPreserveClearableSpace)
-    rightControlCols.push("28px");
-  if (withAnyPicker)
-    rightControlCols.push("auto");
-  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(StyledInputsWrapperGrid, {
-    cols: mainCols,
-    gutter: "xxs",
-    pr: hideDatePicker && hideTimePicker && hideDateTimePicker ? "2px" : null,
-    justPicker: hideDate && hideTime,
-    withAnyPicker,
-    onBlur: resetLatestInteraction,
-    onKeyDown: onGlobalKeyDown,
-    hasError,
-    isControllerOnly,
-    disabled,
-    ...dataAttrs
-  }, hideDate ? null : /* @__PURE__ */ React2.createElement(DateInputs, null), hideTime ? null : /* @__PURE__ */ React2.createElement(TimeInputs, null), withAnyRightController ? /* @__PURE__ */ React2.createElement(Grid, {
-    cols: rightControlCols
-  }, shouldPreserveClearableSpace ? /* @__PURE__ */ React2.createElement(ClearButton, null) : null, withAnyPicker ? /* @__PURE__ */ React2.createElement(PickersIcons, null) : null) : null));
-};
-export {
-  ControlledDateTimePickerContent
+  if (shouldPreserveClearableSpace) rightControlCols.push('28px');
+  if (withAnyPicker) rightControlCols.push('auto');
+  return /*#__PURE__*/jsx(Fragment, {
+    children: /*#__PURE__*/jsxs(StyledInputsWrapperGrid, _objectSpread(_objectSpread({
+      cols: mainCols,
+      gutter: "xxs",
+      pr: hideDatePicker && hideTimePicker && hideDateTimePicker ? '2px' : null,
+      justPicker: hideDate && hideTime,
+      withAnyPicker: withAnyPicker,
+      onBlur: resetLatestInteraction,
+      onKeyDown: onGlobalKeyDown,
+      hasError: hasError,
+      isControllerOnly: isControllerOnly,
+      disabled: disabled
+    }, dataAttrs), {}, {
+      children: [hideDate ? null : _DateInputs || (_DateInputs = /*#__PURE__*/_jsx(DateInputs, {})), hideTime ? null : _TimeInputs || (_TimeInputs = /*#__PURE__*/_jsx(TimeInputs, {})), withAnyRightController ? /*#__PURE__*/_jsx(Grid, {
+        cols: rightControlCols
+      }, void 0, shouldPreserveClearableSpace ? _ClearButton || (_ClearButton = /*#__PURE__*/_jsx(ClearButton, {})) : null, withAnyPicker ? _PickersIcons || (_PickersIcons = /*#__PURE__*/_jsx(PickersIcons, {})) : null) : null]
+    }))
+  });
 };
-//# sourceMappingURL=ControlledDateTimePickerContent.js.map
+
+export { ControlledDateTimePickerContent };

package/esm/controlled-date-time-picker/parts/DateInputs/DDInput.js

@@ -1,47 +1,51 @@
-import * as React from "react";
-import React2, { useCallback } from "react";
-import { ControlledDateTimePickerDatatestid } from "../../ControlledDateTimePickerDatatestid";
-import { Styled2DigitsInput } from "../Styleds";
+import React, { useCallback } from 'react';
+import { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';
+import { Styled2DigitsInput } from '../Styleds.js';
+import { jsx } from 'react/jsx-runtime';
+
 const regExpNumbers = /^[0-9]+$/;
-const isInvalidDay = (day) => {
-  if (day === "")
-    return false;
+
+const isInvalidDay = day => {
+  if (day === '') return false;
   const numberOnly = regExpNumbers.test(day);
-  return day.length > 2 || day === "00" || !numberOnly || Number.parseInt(day, 10) > 31;
+  return day.length > 2 || day === '00' || !numberOnly || Number.parseInt(day, 10) > 31;
 };
-const DDInput = React2.memo(({
-  onChange,
-  onBlur,
-  onFocus,
-  onKeyDown,
-  value,
-  disabled,
-  contextRef,
-  placeholder,
-  ariaCurrentValueForInputs
-}) => {
-  const validateOnChange = useCallback((e) => {
-    if (isInvalidDay(e?.target?.value)) {
+
+const DDInput = /*#__PURE__*/React.memo(_ref => {
+  let {
+    onChange,
+    onBlur,
+    onFocus,
+    onKeyDown,
+    value,
+    disabled,
+    contextRef,
+    placeholder,
+    ariaCurrentValueForInputs
+  } = _ref;
+  const validateOnChange = useCallback(e => {
+    var _e$target;
+
+    if (isInvalidDay(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
       e.preventDefault();
       return;
     }
+
     onChange(e);
   }, [onChange]);
-  return /* @__PURE__ */ React2.createElement(Styled2DigitsInput, {
+  return /*#__PURE__*/jsx(Styled2DigitsInput, {
     onChange: validateOnChange,
-    onBlur,
-    onFocus,
-    onKeyDown,
-    value,
+    onBlur: onBlur,
+    onFocus: onFocus,
+    onKeyDown: onKeyDown,
+    value: value,
     ref: contextRef,
-    placeholder,
-    "aria-label": `day input field, ${ariaCurrentValueForInputs}`,
+    placeholder: placeholder,
+    "aria-label": "day input field, ".concat(ariaCurrentValueForInputs),
     "data-testid": ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY,
-    disabled,
+    disabled: disabled,
     "aria-disabled": disabled
   });
 });
-export {
-  DDInput
-};
-//# sourceMappingURL=DDInput.js.map
+
+export { DDInput };

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

@@ -1,13 +1,15 @@
-import * as React from "react";
-import React2, { useContext } from "react";
-import { Grid } from "@elliemae/ds-grid";
-import { ControlledDateTimePickerContext } from "../../ControlledDateTimePickerCTX";
-import { MMInput } from "./MMInput";
-import { DDInput } from "./DDInput";
-import { YYYYInput } from "./YYYYInput";
-import { StyledFocusWithIn, StyledSeparator } from "../Styleds";
-import { useDateInputs } from "./useDateInputs";
-import { fixedValues } from "../config";
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useContext } from 'react';
+import { Grid } from '@elliemae/ds-grid';
+import { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';
+import { MMInput } from './MMInput.js';
+import { DDInput } from './DDInput.js';
+import { YYYYInput } from './YYYYInput.js';
+import { StyledFocusWithIn, StyledSeparator } from '../Styleds.js';
+import { useDateInputs } from './useDateInputs.js';
+import { fixedValues } from '../config.js';
+
+var _StyledSeparator, _StyledSeparator2;
 const DateInputs = () => {
   const {
     month,
@@ -27,30 +29,30 @@ const DateInputs = () => {
     onDayKeyDown,
     onYearKeyDown,
     disabled
-  } = useDateInputs();
-  const { monthInputRef, dayInputRef, yearInputRef, ariaCurrentValueForInputs } = useContext(ControlledDateTimePickerContext);
-  return /* @__PURE__ */ React2.createElement(Grid, {
-    cols: [
-      fixedValues.smallInputWidth,
-      fixedValues.separatorWidth,
-      fixedValues.smallInputWidth,
-      fixedValues.separatorWidth,
-      fixedValues.largeInputWidth
-    ]
-  }, /* @__PURE__ */ React2.createElement(StyledFocusWithIn, null, /* @__PURE__ */ React2.createElement(MMInput, {
+  } = useDateInputs(); // we do this here so MMInput,DDInput,YYYYInput can be pure component memoized via React.memo
+
+  const {
+    monthInputRef,
+    dayInputRef,
+    yearInputRef,
+    ariaCurrentValueForInputs
+  } = useContext(ControlledDateTimePickerContext);
+  return /*#__PURE__*/_jsx(Grid, {
+    cols: [fixedValues.smallInputWidth, fixedValues.separatorWidth, fixedValues.smallInputWidth, fixedValues.separatorWidth, fixedValues.largeInputWidth]
+  }, void 0, /*#__PURE__*/_jsx(StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx(MMInput, {
     onChange: onMonthChange,
     onBlur: onMonthBlur,
     onFocus: onMonthFocus,
     onKeyDown: onMonthKeyDown,
     value: month,
     contextRef: monthInputRef,
-    autoFocusMonthInput,
+    autoFocusMonthInput: autoFocusMonthInput,
     placeholder: "MM",
-    ariaCurrentValueForInputs,
-    disabled
-  })), /* @__PURE__ */ React2.createElement(StyledSeparator, {
+    ariaCurrentValueForInputs: ariaCurrentValueForInputs,
+    disabled: disabled
+  })), _StyledSeparator || (_StyledSeparator = /*#__PURE__*/_jsx(StyledSeparator, {
     alignItems: "center"
-  }, "/"), /* @__PURE__ */ React2.createElement(StyledFocusWithIn, null, /* @__PURE__ */ React2.createElement(DDInput, {
+  }, void 0, "/")), /*#__PURE__*/_jsx(StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx(DDInput, {
     onChange: onDayChange,
     onBlur: onDayBlur,
     onFocus: onDayFocus,
@@ -58,11 +60,11 @@ const DateInputs = () => {
     value: day,
     contextRef: dayInputRef,
     placeholder: "DD",
-    ariaCurrentValueForInputs,
-    disabled
-  })), /* @__PURE__ */ React2.createElement(StyledSeparator, {
+    ariaCurrentValueForInputs: ariaCurrentValueForInputs,
+    disabled: disabled
+  })), _StyledSeparator2 || (_StyledSeparator2 = /*#__PURE__*/_jsx(StyledSeparator, {
     alignItems: "center"
-  }, "/"), /* @__PURE__ */ React2.createElement(StyledFocusWithIn, null, /* @__PURE__ */ React2.createElement(YYYYInput, {
+  }, void 0, "/")), /*#__PURE__*/_jsx(StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx(YYYYInput, {
     onChange: onYearChange,
     onBlur: onYearBlur,
     onFocus: onYearFocus,
@@ -70,11 +72,9 @@ const DateInputs = () => {
     value: year,
     contextRef: yearInputRef,
     placeholder: "YYYY",
-    ariaCurrentValueForInputs,
-    disabled
+    ariaCurrentValueForInputs: ariaCurrentValueForInputs,
+    disabled: disabled
   })));
 };
-export {
-  DateInputs
-};
-//# sourceMappingURL=DateInputs.js.map
+
+export { DateInputs };

package/esm/controlled-date-time-picker/parts/DateInputs/MMInput.js

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

package/esm/controlled-date-time-picker/parts/DateInputs/YYYYInput.js

@@ -1,47 +1,51 @@
-import * as React from "react";
-import React2, { useCallback } from "react";
-import { ControlledDateTimePickerDatatestid } from "../../ControlledDateTimePickerDatatestid";
-import { StyledMin4DigitsInput } from "../Styleds";
+import React, { useCallback } from 'react';
+import { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';
+import { StyledMin4DigitsInput } from '../Styleds.js';
+import { jsx } from 'react/jsx-runtime';
+
 const regExpNumbers = /^[0-9]+$/;
-const isInvalidYear = (year) => {
-  if (year === "")
-    return false;
+
+const isInvalidYear = year => {
+  if (year === '') return false;
   const numberOnly = regExpNumbers.test(year);
   return year.length > 4 || !numberOnly || Number.parseInt(year, 10) > 9999;
 };
-const YYYYInput = React2.memo(({
-  onChange,
-  onBlur,
-  onFocus,
-  onKeyDown,
-  value,
-  disabled,
-  placeholder,
-  contextRef,
-  ariaCurrentValueForInputs
-}) => {
-  const validateOnChange = useCallback((e) => {
-    if (isInvalidYear(e?.target?.value)) {
+
+const YYYYInput = /*#__PURE__*/React.memo(_ref => {
+  let {
+    onChange,
+    onBlur,
+    onFocus,
+    onKeyDown,
+    value,
+    disabled,
+    placeholder,
+    contextRef,
+    ariaCurrentValueForInputs
+  } = _ref;
+  const validateOnChange = useCallback(e => {
+    var _e$target;
+
+    if (isInvalidYear(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
       e.preventDefault();
       return;
     }
+
     onChange(e);
   }, [onChange]);
-  return /* @__PURE__ */ React2.createElement(StyledMin4DigitsInput, {
+  return /*#__PURE__*/jsx(StyledMin4DigitsInput, {
     onChange: validateOnChange,
-    onBlur,
-    onFocus,
-    onKeyDown,
-    value,
+    onBlur: onBlur,
+    onFocus: onFocus,
+    onKeyDown: onKeyDown,
+    value: value,
     ref: contextRef,
-    placeholder,
-    "aria-label": `year input field, ${ariaCurrentValueForInputs}`,
+    placeholder: placeholder,
+    "aria-label": "year input field, ".concat(ariaCurrentValueForInputs),
     "data-testid": ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR,
-    disabled,
+    disabled: disabled,
     "aria-disabled": disabled
   });
 });
-export {
-  YYYYInput
-};
-//# sourceMappingURL=YYYYInput.js.map
+
+export { YYYYInput };