@elliemae/ds-date-time-picker 2.2.0-alpha.2 → 2.2.0-next.1

package/esm/DSDateTimePicker.js

@@ -1,78 +1,111 @@
-import * as React from "react";
-import React2 from "react";
-import { PropTypes, describe } from "react-desc";
-import moment from "moment";
-import { convertPropToCssClassName } from "@elliemae/ds-classnames";
-import { SingleDatePickerPhrases } from "@elliemae/ds-date-picker";
-import { DSDateTimePickerImpl } from "./components/DateTimePickerImpl";
-import english from "./lang/english";
+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 { PropTypes, describe } from 'react-desc';
+import moment from 'moment';
+import { convertPropToCssClassName } from '@elliemae/ds-classnames';
+import { SingleDatePickerPhrases } from '@elliemae/ds-date-picker';
+import DSDateTimePickerImpl from './components/DateTimePickerImpl.js';
+import english from './lang/english.js';
+import { jsx } from 'react/jsx-runtime';
+
+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 {
   placeholder: placeholderDefault,
   className: classNameDefault,
   id: idDefault
 } = english;
-const DSDateTimePicker = ({
-  containerProps = {},
-  className = classNameDefault,
-  id = idDefault,
-  placeholder = placeholderDefault,
-  date,
-  clearable = false,
-  onBlur = () => null,
-  datePickerProps = {
-    disabled: false,
-    numberOfMonths: 1,
-    readOnly: false,
-    enableOutsideDays: false,
-    transitionDuration: 0,
-    firstDayOfWeek: 0,
-    keepOpenOnDateSelect: true,
-    hideKeyboardShortcutsPanel: true,
-    onPrevMonthClick: () => null,
-    onNextMonthClick: () => null,
-    onClose: () => null,
-    onchange: () => null,
-    onDateChange: () => null,
-    phrases: SingleDatePickerPhrases,
-    displayFormatDay: "D",
-    isDayBlocked: () => false,
-    isOutsideRange: () => false,
-    isDayHighlighted: () => false,
-    zIndex: 11
-  },
-  timePickerProps = {
-    format: "hh:mm A",
-    onChange: () => null,
-    disabledTimes: void 0,
-    minutesInterval: 1
-  },
-  dateInputProps = {
-    onDateInputDateChange: () => null
-  }
-}) => {
-  const { cssClassName } = convertPropToCssClassName("datetimepicker", className, {
+
+const DSDateTimePicker = _ref => {
+  let {
+    containerProps = {},
+    className = classNameDefault,
+    id = idDefault,
+    placeholder = placeholderDefault,
+    date,
+    clearable = false,
+    onBlur = () => null,
+    datePickerProps = {
+      disabled: false,
+      numberOfMonths: 1,
+      readOnly: false,
+      enableOutsideDays: false,
+      transitionDuration: 0,
+      firstDayOfWeek: 0,
+      keepOpenOnDateSelect: true,
+      hideKeyboardShortcutsPanel: true,
+      onPrevMonthClick: () => null,
+      onNextMonthClick: () => null,
+      onClose: () => null,
+      onchange: () => null,
+      onDateChange: () => null,
+      phrases: SingleDatePickerPhrases,
+      displayFormatDay: 'D',
+      isDayBlocked: () => false,
+      isOutsideRange: () => false,
+      isDayHighlighted: () => false,
+      zIndex: 11
+    },
+    timePickerProps = {
+      format: 'hh:mm A',
+      onChange: () => null,
+      disabledTimes: undefined,
+      minutesInterval: 1
+    },
+    dateInputProps = {
+      onDateInputDateChange: () => null
+    }
+  } = _ref;
+  const {
+    cssClassName
+  } = convertPropToCssClassName('datetimepicker', className, {
     id
   });
-  return /* @__PURE__ */ React2.createElement("div", {
-    className: cssClassName,
-    ...containerProps
-  }, /* @__PURE__ */ React2.createElement(DSDateTimePickerImpl, {
-    clearable,
-    date,
-    datePickerProps,
-    onBlur,
-    placeholder,
-    timePickerProps,
-    dateInputProps
+  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({
+    className: cssClassName
+  }, containerProps), {}, {
+    children: /*#__PURE__*/_jsx(DSDateTimePickerImpl, {
+      clearable: clearable,
+      date: date,
+      datePickerProps: datePickerProps,
+      onBlur: onBlur,
+      placeholder: placeholder,
+      timePickerProps: timePickerProps,
+      dateInputProps: dateInputProps
+    })
   }));
 };
+
 const dateTimePickerProps = {
-  containerProps: PropTypes.object.description("Set of Properties attached to the main container"),
-  className: PropTypes.string.description("html class attribute"),
-  id: PropTypes.string.description("components id"),
-  onBlur: PropTypes.func.description("on blur callback"),
-  date: PropTypes.instanceOf(Date, moment).description("Initial date, by default current date"),
-  clearable: PropTypes.bool.description("Flag to trigger onDateChange on error"),
+  containerProps: PropTypes.object.description('Set of Properties attached to the main container'),
+  className: PropTypes.string.description('html class attribute'),
+  id: PropTypes.string.description('components id'),
+
+  /**
+   * on blur callback
+   */
+  onBlur: PropTypes.func.description('on blur callback'),
+
+  /**
+   * Initial date, by default current date
+   */
+  date: PropTypes.instanceOf(Date, moment).description('Initial date, by default current date'),
+
+  /**
+   * Flag to trigger onDateChange on error
+   */
+  clearable: PropTypes.bool.description('Flag to trigger onDateChange on error'),
+
+  /**
+   * DatePicker properties
+   */
   datePickerProps: PropTypes.shape({
     disabled: PropTypes.bool,
     numberOfMonths: PropTypes.number,
@@ -115,29 +148,35 @@ const dateTimePickerProps = {
       chooseAvailableEndDate: PropTypes.func,
       dateIsUnavailable: PropTypes.func,
       dateIsSelected: PropTypes.func,
+
+      /**
+       * ZIndex for the picker popup
+       */
       zIndex: PropTypes.number
     }),
     displayFormatDay: PropTypes.string,
     isDayBlocked: PropTypes.func,
     isOutsideRange: PropTypes.func,
     isDayHighlighted: PropTypes.func
-  }).description("DatePicker properties"),
-  placeholder: PropTypes.string.description("Input placeholder"),
+  }).description('DatePicker properties'),
+
+  /**
+   * Input placeholder
+   */
+  placeholder: PropTypes.string.description('Input placeholder'),
+
+  /**
+   * TimePicker properties
+   */
   timePickerProps: PropTypes.shape({
     format: PropTypes.string,
     onChange: PropTypes.func
-  }).description("TimePicker properties"),
+  }).description('TimePicker properties'),
   dateInputProps: PropTypes.shape({
     onDateInputDateChange: PropTypes.func
-  }).description("DateInputProperties")
+  }).description('DateInputProperties')
 };
-DSDateTimePicker.propTypes = dateTimePickerProps;
 const DateTimePickerWithSchema = describe(DSDateTimePicker);
 DateTimePickerWithSchema.propTypes = dateTimePickerProps;
-var DSDateTimePicker_default = DSDateTimePicker;
-export {
-  DSDateTimePicker,
-  DateTimePickerWithSchema,
-  DSDateTimePicker_default as default
-};
-//# sourceMappingURL=DSDateTimePicker.js.map
+
+export { DateTimePickerWithSchema, DSDateTimePicker as default };

package/esm/components/DateTimePickerImpl.js

@@ -1,133 +1,178 @@
-import * as React from "react";
-import React2, { useState, useEffect, useMemo, useRef } from "react";
-import moment from "moment";
-import { aggregatedClasses } from "@elliemae/ds-classnames";
-import { DSDatePickerController, DatePickerDropdown, SingleDatePickerPhrases } from "@elliemae/ds-date-picker";
-import { DSInput, DSInputGroup, DateInputsV2Impl, TimeInputImpl } from "@elliemae/ds-form";
-import { getVisibleTimeByFormat } from "@elliemae/ds-utilities";
-import { DSTimePickerMenu, convertTimeString } from "@elliemae/ds-time-picker";
-import { updateDateAndTime } from "../utils";
-const blockName = "date-time-picker";
-const DateTimePickerWrapper = aggregatedClasses("div")(blockName, "wrapper");
-const TimePicker = aggregatedClasses(DSTimePickerMenu)(blockName, "time-picker");
-const TimePickerWrapper = aggregatedClasses("div")(blockName, "time-picker-wrapper");
-const formatDate = "MMDDYYYY";
-const DSDateTimePickerImpl = ({
-  onBlur = () => null,
-  placeholder,
-  date,
-  clearable,
-  datePickerProps: {
-    disabled = false,
-    numberOfMonths = 1,
-    readOnly = false,
-    enableOutsideDays = false,
-    transitionDuration = 0,
-    firstDayOfWeek = 0,
-    keepOpenOnDateSelect = true,
-    hideKeyboardShortcutsPanel = true,
-    onPrevMonthClick = () => null,
-    onNextMonthClick = () => null,
-    onClose = () => null,
-    onChange: onDatePickerChange = () => null,
-    onDateChange = () => null,
-    onError: onErrorDate = () => null,
-    phrases = SingleDatePickerPhrases,
-    displayFormatDay = "D",
-    isDayBlocked = () => false,
-    isOutsideRange = () => false,
-    isDayHighlighted = () => false,
-    zIndex = 11
-  },
-  timePickerProps: {
-    format = "hh:mm A",
-    onChange: onChangeTimePicker = () => null,
-    disabledTimes = void 0,
-    onError: onErrorTime = () => null,
-    minutesInterval = 1
-  },
-  dateInputProps: { onDateInputDateChange = () => null }
-}) => {
-  const [selectedDate, setSelectedDate] = useState(void 0);
-  const [incompleteInput, setIncompleteInput] = useState(void 0);
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+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 { useState, useRef, useEffect, useMemo } from 'react';
+import moment from 'moment';
+import { aggregatedClasses } from '@elliemae/ds-classnames';
+import { DatePickerDropdown, DSDatePickerController, SingleDatePickerPhrases } from '@elliemae/ds-date-picker';
+import { DSInputGroup, DSInput, DateInputsV2Impl, TimeInputImpl } from '@elliemae/ds-form';
+import { getVisibleTimeByFormat } from '@elliemae/ds-utilities';
+import { DSTimePickerMenu, convertTimeString } from '@elliemae/ds-time-picker';
+import { updateDateAndTime } from '../utils.js';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+const _excluded = ["onChange"];
+
+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 blockName = 'date-time-picker';
+const DateTimePickerWrapper = aggregatedClasses('div')(blockName, 'wrapper');
+const TimePicker = aggregatedClasses(DSTimePickerMenu)(blockName, 'time-picker');
+const TimePickerWrapper = aggregatedClasses('div')(blockName, 'time-picker-wrapper'); // const DateInput = aggregatedClasses(DateInputsV2Impl)(blockName, 'date-input');
+
+const formatDate = 'MMDDYYYY';
+
+const DSDateTimePickerImpl = _ref => {
+  let {
+    onBlur = () => null,
+    placeholder,
+    date,
+    clearable,
+    datePickerProps: {
+      disabled = false,
+      numberOfMonths = 1,
+      readOnly = false,
+      enableOutsideDays = false,
+      transitionDuration = 0,
+      firstDayOfWeek = 0,
+      keepOpenOnDateSelect = true,
+      hideKeyboardShortcutsPanel = true,
+      onPrevMonthClick = () => null,
+      onNextMonthClick = () => null,
+      onClose = () => null,
+      onChange: onDatePickerChange = () => null,
+      onDateChange = () => null,
+      onError: onErrorDate = () => null,
+      phrases = SingleDatePickerPhrases,
+      displayFormatDay = 'D',
+      isDayBlocked = () => false,
+      isOutsideRange = () => false,
+      isDayHighlighted = () => false,
+      zIndex = 11
+    },
+    timePickerProps: {
+      format = 'hh:mm A',
+      onChange: onChangeTimePicker = () => null,
+      disabledTimes = undefined,
+      onError: onErrorTime = () => null,
+      minutesInterval = 1
+    },
+    dateInputProps: {
+      onDateInputDateChange = () => null
+    }
+  } = _ref;
+  const [selectedDate, setSelectedDate] = useState(undefined);
+  const [incompleteInput, setIncompleteInput] = useState(undefined);
   const [isOpen, setIsOpen] = useState(false);
   const disabledTimeRange = disabledTimes && {
     from: convertTimeString(disabledTimes.from),
     to: convertTimeString(disabledTimes.to)
   };
   const dateTimePickerWrapperRef = useRef();
-  const fullFormat = `${formatDate} ${format}`;
+  const fullFormat = "".concat(formatDate, " ").concat(format);
   useEffect(() => {
     if (date) {
       setSelectedDate(moment(date));
-    } else if (date === null)
-      setSelectedDate(void 0);
+    } else if (date === null) setSelectedDate(undefined);
   }, [date]);
   const visiblePanels = useMemo(() => getVisibleTimeByFormat(format), []);
   const currentYear = moment().year();
-  const handleDatePickerChange = (dateSelected) => {
+
+  const handleDatePickerChange = dateSelected => {
     const splittedDate = updateDateAndTime(dateSelected, selectedDate);
+
     if (!readOnly) {
       setSelectedDate(splittedDate);
       onDateChange(splittedDate);
     }
   };
-  const onTimeChange = (pickerTime) => {
+
+  const onTimeChange = pickerTime => {
     const splittedDate = updateDateAndTime(selectedDate, pickerTime);
     onChangeTimePicker(splittedDate);
     setSelectedDate(splittedDate);
   };
+
   const handleInputChange = (inputValue, type) => {
     onDatePickerChange(inputValue);
     let timeBlocked = false;
     const inputMoment = moment(inputValue, fullFormat);
     setIncompleteInput(inputValue);
-    if (type === "date") {
+
+    if (type === 'date') {
       const splittedDate = updateDateAndTime(inputMoment, selectedDate);
+
       if (inputValue.length < 8) {
-        onErrorDate({ message: "date incomplete", inputValue });
-        if (clearable)
-          onDateChange("error");
+        onErrorDate({
+          message: 'date incomplete',
+          inputValue
+        });
+        if (clearable) onDateChange('error');
         return;
       }
+
       if (inputValue.length === 8 && inputMoment.isValid()) {
         setSelectedDate(splittedDate);
         onChangeTimePicker(splittedDate);
       }
+
       onDateChange(splittedDate);
       return;
     }
+
     if (disabledTimeRange) {
       const hour = inputValue.hour();
       const min = inputValue.minutes();
-      const { from, to } = disabledTimeRange;
+      const {
+        from,
+        to
+      } = disabledTimeRange;
+
       if (hour > from.hour && hour < to.hour || hour === to.hour && min < to.min) {
         timeBlocked = true;
       }
     }
-    if (timeBlocked)
-      onErrorTime({ message: "time blocked", inputValue });
+
+    if (timeBlocked) onErrorTime({
+      message: 'time blocked',
+      inputValue
+    });
     const dateBlocked = isDayBlocked(inputMoment);
-    if (dateBlocked)
-      onErrorDate({ message: "date blocked", inputValue });
+    if (dateBlocked) onErrorDate({
+      message: 'date blocked',
+      inputValue
+    });
+
     if (!timeBlocked && !dateBlocked) {
       onDateChange(inputValue);
     }
   };
-  const handleOutsideClick = (event) => {
+
+  const handleOutsideClick = event => {
     if (!dateTimePickerWrapperRef.current.contains(event.target)) {
       setIsOpen(false);
     }
   };
+
   const handleClickEscape = () => setIsOpen(false);
+
   const handleOpen = () => setIsOpen(true);
-  const handleContainerBlur = (event) => {
+
+  const handleContainerBlur = event => {
     if (!isOpen && !event.currentTarget.contains(event.relatedTarget)) {
-      onBlur(event, selectedDate?.isValid() ? selectedDate : {
+      onBlur(event, selectedDate !== null && selectedDate !== void 0 && selectedDate.isValid() ? selectedDate : {
         error: true,
-        message: "incomplete input",
+        message: 'incomplete input',
         input: incompleteInput
       });
+
       if (clearable && !selectedDate && !!incompleteInput) {
         const inputMoment = moment(incompleteInput, fullFormat);
         const splittedDate = updateDateAndTime(inputMoment, selectedDate);
@@ -136,90 +181,96 @@ const DSDateTimePickerImpl = ({
       }
     }
   };
+
   useEffect(() => {
-    if (!isOpen)
-      onBlur({}, selectedDate?.isValid() ? selectedDate : {
-        error: true,
-        message: "incomplete input",
-        input: incompleteInput
-      });
+    if (!isOpen) onBlur({}, selectedDate !== null && selectedDate !== void 0 && selectedDate.isValid() ? selectedDate : {
+      error: true,
+      message: 'incomplete input',
+      input: incompleteInput
+    });
   }, [isOpen]);
   const hasSelectedDate = !!selectedDate;
-  return /* @__PURE__ */ React2.createElement(DSInputGroup, {
+  return /*#__PURE__*/_jsx(DSInputGroup, {
     containerProps: {
       onBlur: handleContainerBlur
     },
-    rightAddon: /* @__PURE__ */ React2.createElement(DatePickerDropdown, {
-      disabled,
-      isOpen,
-      zIndex,
-      menu: /* @__PURE__ */ React2.createElement(DateTimePickerWrapper, {
+    rightAddon: /*#__PURE__*/_jsx(DatePickerDropdown, {
+      disabled: disabled,
+      isOpen: isOpen,
+      zIndex: zIndex,
+      menu: /*#__PURE__*/jsxs(DateTimePickerWrapper, {
         ref: dateTimePickerWrapperRef,
-        "data-testid": "date-time-picker"
-      }, /* @__PURE__ */ React2.createElement("div", {
-        className: hasSelectedDate ? "has-selected-date" : "without-selected-date",
-        "data-testid": "date-time-picker-portal-wrapper"
-      }, /* @__PURE__ */ React2.createElement(DSDatePickerController, {
-        date: selectedDate,
-        displayFormatDay,
-        enableOutsideDays,
-        firstDayOfWeek,
-        hideKeyboardShortcutsPanel,
-        isDayBlocked,
-        isDayHighlighted,
-        isOutsideRange,
-        keepOpenOnDateSelect,
-        numberOfMonths,
-        onClickEscape: handleClickEscape,
-        onClose,
-        onDateChange: handleDatePickerChange,
-        onNextMonthClick,
-        onOutsideClick: (event) => handleOutsideClick(event),
-        onPrevMonthClick,
-        phrases,
-        transitionDuration
-      })), /* @__PURE__ */ React2.createElement(TimePickerWrapper, null, /* @__PURE__ */ React2.createElement(TimePicker, {
-        disabled,
-        disabledTimes: disabledTimeRange,
-        format,
-        hasHeader: true,
-        hasHeaderDisplay: true,
-        onTimeChange,
-        showSeconds: false,
-        minutesInterval,
-        time: selectedDate,
-        ...visiblePanels
-      }))),
+        "data-testid": "date-time-picker",
+        children: [/*#__PURE__*/_jsx("div", {
+          className: hasSelectedDate ? 'has-selected-date' : 'without-selected-date',
+          "data-testid": "date-time-picker-portal-wrapper"
+        }, void 0, /*#__PURE__*/_jsx(DSDatePickerController, {
+          date: selectedDate,
+          displayFormatDay: displayFormatDay,
+          enableOutsideDays: enableOutsideDays,
+          firstDayOfWeek: firstDayOfWeek,
+          hideKeyboardShortcutsPanel: hideKeyboardShortcutsPanel,
+          isDayBlocked: isDayBlocked,
+          isDayHighlighted: isDayHighlighted,
+          isOutsideRange: isOutsideRange,
+          keepOpenOnDateSelect: keepOpenOnDateSelect,
+          numberOfMonths: numberOfMonths,
+          onClickEscape: handleClickEscape,
+          onClose: onClose,
+          onDateChange: handleDatePickerChange,
+          onNextMonthClick: onNextMonthClick,
+          onOutsideClick: event => handleOutsideClick(event),
+          onPrevMonthClick: onPrevMonthClick,
+          phrases: phrases,
+          transitionDuration: transitionDuration
+        })), /*#__PURE__*/_jsx(TimePickerWrapper, {}, void 0, /*#__PURE__*/jsx(TimePicker, _objectSpread({
+          disabled: disabled,
+          disabledTimes: disabledTimeRange,
+          format: format,
+          hasHeader: true,
+          hasHeaderDisplay: true,
+          onTimeChange: onTimeChange,
+          showSeconds: false,
+          minutesInterval: minutesInterval,
+          time: selectedDate
+        }, visiblePanels)))]
+      }),
       onClick: handleOpen,
-      readOnly
+      readOnly: readOnly
     })
-  }, /* @__PURE__ */ React2.createElement(DSInput, {
-    customInputType: ({ onChange: handleChange, ...restInputProps }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("div", {
-      style: { display: "flex" }
-    }, /* @__PURE__ */ React2.createElement(DateInputsV2Impl, {
-      disabled,
-      onChange: (input) => handleChange(input, "date"),
-      ...restInputProps,
-      onDateChange: onDateInputDateChange,
-      yearMaxRange: currentYear + 100,
-      yearMinRange: currentYear - 100,
-      time: restInputProps.value && restInputProps.value.hour && restInputProps.value.isValid() ? restInputProps.value.format(formatDate) : restInputProps.value
-    })), /* @__PURE__ */ React2.createElement(TimeInputImpl, {
-      disabled,
-      format,
-      onChange: (time) => handleChange(time, "time"),
-      ...restInputProps
-    })),
+  }, void 0, /*#__PURE__*/_jsx(DSInput, {
+    customInputType: _ref2 => {
+      let {
+        onChange: handleChange
+      } = _ref2,
+          restInputProps = _objectWithoutProperties(_ref2, _excluded);
+
+      return /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/_jsx("div", {
+          style: {
+            display: 'flex'
+          }
+        }, void 0, /*#__PURE__*/jsx(DateInputsV2Impl, _objectSpread(_objectSpread({
+          disabled: disabled,
+          onChange: input => handleChange(input, 'date')
+        }, restInputProps), {}, {
+          onDateChange: onDateInputDateChange,
+          yearMaxRange: currentYear + 100,
+          yearMinRange: currentYear - 100,
+          time: restInputProps.value && restInputProps.value.hour && restInputProps.value.isValid() ? restInputProps.value.format(formatDate) : restInputProps.value
+        }))), /*#__PURE__*/jsx(TimeInputImpl, _objectSpread({
+          disabled: disabled,
+          format: format,
+          onChange: time => handleChange(time, 'time')
+        }, restInputProps))]
+      });
+    },
     isShowElipsisActive: false,
-    disabled,
+    disabled: disabled,
     onChange: handleInputChange,
-    placeholder,
+    placeholder: placeholder,
     value: selectedDate
   }));
 };
-var DateTimePickerImpl_default = DSDateTimePickerImpl;
-export {
-  DSDateTimePickerImpl,
-  DateTimePickerImpl_default as default
-};
-//# sourceMappingURL=DateTimePickerImpl.js.map
+
+export { DSDateTimePickerImpl as default };

package/esm/index.js

@@ -1,8 +1 @@
-import * as React from "react";
-import { default as default2, DSDateTimePicker, DateTimePickerWithSchema } from "./DSDateTimePicker";
-export {
-  DSDateTimePicker,
-  DateTimePickerWithSchema,
-  default2 as default
-};
-//# sourceMappingURL=index.js.map
+export { DateTimePickerWithSchema, default } from './DSDateTimePicker.js';