@elliemae/ds-form 2.0.0-alpha.1 → 2.0.0-alpha.13

package/esm/TimeInput/TimeInputs.js

@@ -1,5 +1,15 @@
+import 'core-js/modules/esnext.async-iterator.filter.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 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.some.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.some.js';
+import 'core-js/modules/esnext.async-iterator.reduce.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
 import React, { useState, useEffect, createElement } from 'react';
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 import moment from 'moment';
@@ -12,34 +22,41 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 const blockName = 'input-times-group';
 const InputTimesGroup = aggregatedClasses('div')(blockName);
 const TimeInput = aggregatedClasses('input')(blockName, 'input');
-const Divider = aggregatedClasses('span')(blockName, 'divider', ({
-  value
-}) => ({
-  value
-})); // eslint-disable-next-line react/prop-types
-
-const TimeDivider = ({
-  content = ':',
-  value = ''
-}) => /*#__PURE__*/_jsx(Divider, {
-  value: !!value
-}, void 0, content);
-
-const TimeInputs = ({
-  time,
-  format,
-  use12Hours,
-  step = 1,
-  showHours,
-  showMinutes,
-  showSeconds,
-  onChange,
-  disabled,
-  innerRef,
-  clearable,
-  'arial-label': ariaLabel,
-  'aria-label': ariaLabel2
-}) => {
+const Divider = aggregatedClasses('span')(blockName, 'divider', _ref => {
+  let {
+    value
+  } = _ref;
+  return {
+    value
+  };
+}); // eslint-disable-next-line react/prop-types
+
+const TimeDivider = _ref2 => {
+  let {
+    content = ':',
+    value = ''
+  } = _ref2;
+  return /*#__PURE__*/_jsx(Divider, {
+    value: !!value
+  }, void 0, content);
+};
+
+const TimeInputs = _ref3 => {
+  let {
+    time,
+    format,
+    use12Hours,
+    step = 1,
+    showHours,
+    showMinutes,
+    showSeconds,
+    onChange,
+    disabled,
+    innerRef,
+    clearable,
+    'arial-label': ariaLabel,
+    'aria-label': ariaLabel2
+  } = _ref3;
   const [meridiem, setMeridiem] = useState('');
   const [hours, setHours] = useState('');
   const [minutes, setMinutes] = useState('');
@@ -86,7 +103,8 @@ const TimeInputs = ({
     }
   };
 
-  const getNextTimeValue = (value, incrementing = true) => {
+  const getNextTimeValue = function (value) {
+    let incrementing = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
     const parsedValue = parseTimeNumberFromText(value);
     return incrementing ? parsedValue + step : parsedValue - step;
   };

package/esm/TimeInput/utils.js

@@ -1,5 +1,4 @@
-import { addLeadingZeros } from '@elliemae/ds-utilities/timeUtils';
-import { parseInt, isNaN } from '@elliemae/ds-utilities/utils';
+import { parseInt, isNaN, addLeadingZeros } from '@elliemae/ds-utilities';
 import { ARROW_DOWN, ARROW_UP, SHIFT, PLACEHOLDER_TIME, PM, AM } from '@elliemae/ds-shared/constants';
 
 const isAM = time => time && time.hour() < 12;
@@ -84,10 +83,11 @@ const focusPreviousInput = currentEl => {
     previousElement.previousElementSibling.focus();
   }
 };
-const getValidTimeNumber = ({
-  min,
-  max
-}, number, typed) => {
+const getValidTimeNumber = (_ref, number, typed) => {
+  let {
+    min,
+    max
+  } = _ref;
   if (number === undefined || number === null) return null;
 
   if (number > max) {
@@ -98,7 +98,9 @@ const getValidTimeNumber = ({
   if (number < min) return min;
   return number;
 };
-const shouldFocusNextInput = (max, number = 0, stringValue) => {
+const shouldFocusNextInput = function (max) {
+  let number = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  let stringValue = arguments.length > 2 ? arguments[2] : undefined;
   const safeString = String(stringValue);
   const cleanString = safeString.startsWith('00') ? safeString.slice(1) : safeString;
   return number * 10 > max || String(max).length === cleanString.length;

package/esm/Toggle/DSToggle.js

@@ -1,3 +1,8 @@
+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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import 'react';

package/esm/Toggle/DSToggleImpl.js

@@ -1,6 +1,11 @@
+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 React, { Component } from 'react';
-import { isValidDrag, cleanDrag, dragStartingPoints, calculateDrag } from './toggleHelper.js';
+import { calculateDrag, isValidDrag, cleanDrag, dragStartingPoints } from './toggleHelper.js';
 import DSToggleRender from './DSToggleRender.js';
 import { jsx } from 'react/jsx-runtime';
 
@@ -12,7 +17,7 @@ class DSToggleImpl extends Component {
   constructor(props) {
     super(props);
 
-    _defineProperty(this, "onDragStart", clientX => {
+    this.onDragStart = clientX => {
       const {
         startPoint,
         checked,
@@ -32,9 +37,9 @@ class DSToggleImpl extends Component {
         drag
       }); // else this.setDragOnChange(checkedProp != null ? checkedProp : checked) // set initial position
       else this.setDragOnChange(checked); // set initial position
-    });
+    };
 
-    _defineProperty(this, "onDragStop", e => {
+    this.onDragStop = e => {
       const {
         checked
       } = this.state; // const { checked: checkedProp, } = this.props
@@ -44,25 +49,25 @@ class DSToggleImpl extends Component {
         this.setState(cleanDrag); // } else this.setDragOnChange(checkedProp != null ? checkedProp : checked) // set initial position
       } else this.setDragOnChange(checked); // set initial position
 
-    });
+    };
 
-    _defineProperty(this, "onBlur", e => {
+    this.onBlur = e => {
       const {
         onBlur,
         id
       } = this.props;
       if (onBlur) onBlur(e, id);
-    });
+    };
 
-    _defineProperty(this, "onFocus", e => {
+    this.onFocus = e => {
       const {
         onFocus,
         id
       } = this.props;
       if (onFocus) onFocus(e, id);
-    });
+    };
 
-    _defineProperty(this, "onChange", e => {
+    this.onChange = e => {
       const {
         checked
       } = this.state;
@@ -85,26 +90,26 @@ class DSToggleImpl extends Component {
       onChange(e, id); // this.setDragOnChange(checkedProp != null ? checkedProp : newCheck) // set new position
 
       this.setDragOnChange(newCheck); // set new position
-    });
+    };
 
-    _defineProperty(this, "onMouseEnter", () => {
+    this.onMouseEnter = () => {
       this.setState({
         inside: true
       });
-    });
+    };
 
-    _defineProperty(this, "onMouseLeave", () => {
+    this.onMouseLeave = () => {
       this.setState({
         inside: false
       });
-    });
+    };
 
-    _defineProperty(this, "onMouseMove", event => {
+    this.onMouseMove = event => {
       event.preventDefault();
       this.onDragStart(event.clientX);
-    });
+    };
 
-    _defineProperty(this, "onMouseDown", event => {
+    this.onMouseDown = event => {
       this.onDragStart(event.clientX);
       this.setState({
         startPoint: event.clientX,
@@ -112,36 +117,36 @@ class DSToggleImpl extends Component {
       });
       window.addEventListener('mousemove', this.onMouseMove);
       window.addEventListener('mouseup', this.onMouseUp);
-    });
+    };
 
-    _defineProperty(this, "onMouseUp", event => {
+    this.onMouseUp = event => {
       this.onDragStop(event);
       window.removeEventListener('mousemove', this.onMouseMove);
       window.removeEventListener('mouseup', this.onMouseUp);
-    });
+    };
 
-    _defineProperty(this, "onTouchCancel", () => {
+    this.onTouchCancel = () => {
       this.setState({
         inside: false
       });
-    });
+    };
 
-    _defineProperty(this, "onTouchEnd", event => {
+    this.onTouchEnd = event => {
       event.preventDefault();
       this.onDragStop(event);
-    });
+    };
 
-    _defineProperty(this, "onTouchMove", event => {
+    this.onTouchMove = event => {
       this.onDragStart(event.touches[0].clientX);
-    });
+    };
 
-    _defineProperty(this, "onTouchStart", event => {
+    this.onTouchStart = event => {
       this.onDragStart(event.touches[0].clientX);
       this.setState({
         startPoint: event.touches[0].clientX,
         isDragging: true
       });
-    });
+    };
 
     this.state = {
       checked: props.checked || false,
@@ -256,7 +261,7 @@ class DSToggleImpl extends Component {
       hide
     } = this.state;
     const dragStyle = drag !== null || checked || this.props.checked ? {
-      left: `${drag}px`
+      left: "".concat(drag, "px")
     } : null;
     return /*#__PURE__*/jsx(DSToggleRender, _objectSpread(_objectSpread({}, this.props), {}, {
       defaultState: this.props.checked,

package/esm/Toggle/DSToggleRender.js

@@ -1,7 +1,12 @@
+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';
-import onClickHandlerForNonInteractiveElements from '@elliemae/ds-utilities/onClickHandlerForNonInteractiveElements';
+import { onClickHandlerForNonInteractiveElements } from '@elliemae/ds-utilities';
 import { convertPropToCssClassName } from '@elliemae/ds-classnames';
 import DSTooltip from '@elliemae/ds-tooltip';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -10,36 +15,37 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const DSToggleRender = ({
-  containerProps,
-  id,
-  className = '',
-  style = {},
-  hasError = false,
-  hide,
-  readOnly = false,
-  disabled = false,
-  checked = false,
-  onBlur = () => null,
-  onFocus = () => null,
-  onChange = () => null,
-  onMouseDown = () => null,
-  onMouseEnter = () => null,
-  onMouseLeave = () => null,
-  onTouchCancel = () => null,
-  onTouchEnd = () => null,
-  onTouchMove = () => null,
-  onTouchStart = () => null,
-  labelOn = 'ON',
-  labelOff = 'OFF',
-  dragStyle = {},
-  containerRef = null,
-  handRef = null,
-  name = '',
-  value = '',
-  size = 's',
-  defaultState
-}) => {
+const DSToggleRender = _ref => {
+  let {
+    containerProps,
+    id,
+    className = '',
+    style = {},
+    hasError = false,
+    hide,
+    readOnly = false,
+    disabled = false,
+    checked = false,
+    onBlur = () => null,
+    onFocus = () => null,
+    onChange = () => null,
+    onMouseDown = () => null,
+    onMouseEnter = () => null,
+    onMouseLeave = () => null,
+    onTouchCancel = () => null,
+    onTouchEnd = () => null,
+    onTouchMove = () => null,
+    onTouchStart = () => null,
+    labelOn = 'ON',
+    labelOff = 'OFF',
+    dragStyle = {},
+    containerRef = null,
+    handRef = null,
+    name = '',
+    value = '',
+    size = 's',
+    defaultState
+  } = _ref;
   const {
     cssClassName,
     classNameBlock,
@@ -75,7 +81,7 @@ const DSToggleRender = ({
     defaultValue: value
   }, onClickHandlerForNonInteractiveElements(allowChange ? null : onChange)), {}, {
     ref: containerRef,
-    className: `${cssClassName} ${defaultState ? 'default-state-checked' : ''}${hide ? ' ds-form-element-toggle-hide' : ''}`,
+    className: "".concat(cssClassName, " ").concat(defaultState ? 'default-state-checked' : '').concat(hide ? ' ds-form-element-toggle-hide' : ''),
     onBlur: onBlur,
     onFocus: onFocus // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
     ,
@@ -88,7 +94,7 @@ const DSToggleRender = ({
       ref: handRef,
       "aria-checked": checked,
       "aria-disabled": disabled,
-      className: `${classNameElement('input')} ${defaultState ? 'default-state-checked' : ''}`,
+      className: "".concat(classNameElement('input'), " ").concat(defaultState ? 'default-state-checked' : ''),
       onMouseDown: allowChange ? null : onMouseDown,
       onMouseEnter: allowChange ? null : onMouseEnter,
       onMouseLeave: allowChange ? null : onMouseLeave,

package/esm/Toggle/toggleHelper.js

@@ -1,10 +1,11 @@
-const isValidDrag = ({
-  inside,
-  circleWidth,
-  drag,
-  checked,
-  boxWidth
-}) => {
+const isValidDrag = _ref => {
+  let {
+    inside,
+    circleWidth,
+    drag,
+    checked,
+    boxWidth
+  } = _ref;
   const difference = boxWidth - circleWidth;
   return checked ? !inside && -drag > difference / 2 : !inside && drag > boxWidth / 3;
 };
@@ -13,13 +14,14 @@ const cleanDrag = () => ({
   isDragging: false
 }); // eslint-disable-next-line complexity
 
-const calculateDrag = (clientX, {
-  startPoint,
-  checked,
-  isDragging,
-  boxWidth,
-  circleWidth
-}) => {
+const calculateDrag = (clientX, _ref2) => {
+  let {
+    startPoint,
+    checked,
+    isDragging,
+    boxWidth,
+    circleWidth
+  } = _ref2;
   if (!isDragging) return null;
   const move = startPoint - clientX;
   const drag = !checked ? clientX - startPoint : boxWidth - circleWidth - move;
@@ -27,10 +29,11 @@ const calculateDrag = (clientX, {
   if (checked && clientX > 0 && clientX < startPoint && move < boxWidth * 0.7) return drag;
   return null;
 };
-const dragStartingPoints = checked => ({
-  circleWidth,
-  boxWidth
-}) => {
+const dragStartingPoints = checked => _ref3 => {
+  let {
+    circleWidth,
+    boxWidth
+  } = _ref3;
   if (checked) return {
     drag: boxWidth - circleWidth
   };

package/esm/index.js

@@ -1,29 +1,42 @@
-export { default as ComboBoxFreeSolo } from './ComboBoxFreeSolo/ComboBoxFreeSolo.js';
-export { DSCheckboxGroup } from './CheckboxGroup/DSCheckboxGroup.js';
+export { CheckboxWithSchema, DSCheckbox } from './Checkbox/DSCheckbox.js';
+export { DSCheckboxGroup, DSCheckboxGroupWithSchema } from './CheckboxGroup/DSCheckboxGroup.js';
 import './ComboBox/v1/DSComboBox.js';
-export { DSComboBox2 as DSComboBox } from './ComboBox/v2/Combobox.js';
-export { default as DSDateInput } from './DateInput/DSDateInput.js';
+export { ComboBoxWithSchema, DSComboBox2 as DSComboBox, DSComboBox2 } from './ComboBox/v2/Combobox.js';
+export { DSComboBoxWithSchema } from './ComboBox/v3/ComboBox.js';
+export { default as ComboBoxFreeSolo } from './ComboBoxFreeSolo/ComboBoxFreeSolo.js';
+export { default as DSDateInput, DSDateInputWithSchema } from './DateInput/DSDateInput.js';
+export { DateInputs as DateInputsV2Impl } from './DateInputV2/components/DateInputs.js';
+export { DSDateInputV2, DSDateInputV2WithSchema } from './DateInputV2/components/DSDateInput.js';
 export { default as DSExpandableInput } from './ExpandableInput/DSExpandableInput.js';
 export { default as DSFloatingLabelInput } from './FloatingLabelInput/DSFloatingLabelInput.js';
-export { default as DSFormItemLayout } from './FormItem/DSFormItemLayout.js';
-import './FormItem/Error/DSError.js';
+export { default as DSFormItemLayout, DSFormItemLayoutWithSchema } from './FormItem/DSFormItemLayout.js';
+export { default as DSError, DSErrorWithSchema } from './FormItem/Error/DSError.js';
 export { default as DSInput } from './Input/DSInput.js';
-export { default as DSInputGroup } from './InputGroup/DSInputGroup.js';
+export { default as DSInputGroup, DSInputGroupWithSchema } from './InputGroup/DSInputGroup.js';
+export { DSInputMask, DSInputMaskWithSchema } from './InputMask/DSInputMask.js';
+export { DSInputProtected, DSInputProtectedWithSchema } from './InputProtected/DSInputProtected.js';
+export { LEFT_ADDON_OPTIONS, RIGHT_ADDON_OPTIONS } from './InputProtected/options.js';
 export { default as DSLargeInputText, DSLargeInputTextWithSchema } from './LargeInputText/DSLargeInputText.js';
+export { SingleMenuItem } from './MenuItem/components/SingleMenuItem/SingleMenuItem.js';
+export { MultiMenuItem, MultiMenuItemWithSchema } from './MenuItem/components/MultiMenuItem/MultiMenuItem.js';
+export { MenuItem, MenuItemWithSchema } from './MenuItem/components/MenuItem/index.js';
+export { SubmenuItem, SubmenuItemWithSchema } from './MenuItem/components/SubmenuItem/index.js';
+export { Section } from './MenuItem/components/Section/index.js';
+export { Separator } from './MenuItem/components/Separator/index.js';
 export { default as DSRadio, DSRadioWithSchema } from './Radio/DSRadio.js';
 export { default as DSRadioGroup } from './RadioGroup/DSRadioGroup.js';
 export { default as DSRequiredMark } from './RequiredMark/RequiredMark.js';
 export { default as SearchBoxToggle } from './SearchBox/SearchBoxToggle.js';
 export { default as DSSearchBox, SearchBoxWithSchema } from './SearchBox/DSSearchBox.js';
 export { NavSearchBox as DSNavSearchBox, DSNavSearchBoxWithSchema } from './SearchBox/NavSearchBox.js';
-export { default as DSTextBox } from './TextBox/DSTextBox.js';
-export { default as DSTimeInput } from './TimeInput/DSTimeInput.js';
+export { default as DSTextBox, DSTextBoxWithSchema } from './TextBox/DSTextBox.js';
+export { default as DSTimeInput, DSTimeInputWithSchema } from './TimeInput/DSTimeInput.js';
 export { default as DSToggle, DSToggleWithSchema } from './Toggle/DSToggle.js';
-export { default as DSInputProtected, InputProtectedWithSchema } from './InputProtected/DSInputProtected.js';
-export { DSCheckbox } from './Checkbox/DSCheckbox.js';
 export { default as TimeInputImpl } from './TimeInput/TimeInputImpl.js';
-export { COMBOBOX_VARIANT } from '@elliemae/ds-shared/prop-types';
+export { CHECKBOX_VARIANT, COMBOBOX_VARIANT } from '@elliemae/ds-shared/prop-types';
 export { components } from 'react-select';
+export { default as DateInputImpl } from './DateInput/components/DateInputImpl.js';
 export { FORMITEM_LAYOUT_VARIANTS } from './FormItem/variants.js';
 export { default as InputAddonWrapper } from './Input/InputAddonWrapper.js';
-export { LEFT_ADDON_OPTIONS, RIGHT_ADDON_OPTIONS } from './InputProtected/options.js';
+export { MASK_TYPES } from './InputMask/MaskTypes.js';
+export { MASK_PIPES } from './InputMask/MaskPipes.js';