@elliemae/ds-time-picker 1.60.0 → 2.0.0-alpha.12

package/esm/TimePickerMenu.js

@@ -1,296 +1,291 @@
+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 _classCallCheck from '@babel/runtime/helpers/esm/classCallCheck';
-import _createClass from '@babel/runtime/helpers/esm/createClass';
-import _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';
-import _inherits from '@babel/runtime/helpers/esm/inherits';
-import _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';
-import _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import { Component } from 'react';
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 import moment from 'moment';
 import { range, addLeadingZeros } from '@elliemae/ds-utilities';
 import { isAM } from './utils.js';
 import PickerPanel from './PickerPanel.js';
-import '@babel/runtime/helpers/esm/extends';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import '@babel/runtime/helpers/esm/toArray';
-import 'lodash';
-import 'memoize-one';
-import '@elliemae/ds-icons';
-import '@elliemae/ds-button';
-import './moveElementOnScroll.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = 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 blockName = 'time-picker-menu';
+const TimePickerContainer = aggregatedClasses('div')(blockName);
+const TimePickerHeader = aggregatedClasses('div')(blockName, 'header');
+const TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');
+
+const generateOption = format => option => ({
+  value: option,
+  label: typeof format === 'function' ? format(option) : option
+});
+
+class TimePickerMenu extends Component {
+  constructor(props) {
+    super(props);
+
+    this.renderHeader = () => {
+      const {
+        time
+      } = this.state;
+      return /*#__PURE__*/_jsx(TimePickerHeader, {}, void 0, time.format('hh:mma'));
+    };
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+    this.state = {
+      time: moment(props.time || '', props.format) || moment()
+    };
+    this.handleHoursChange = this.handleHoursChange.bind(this);
+    this.handleMinuteChange = this.handleMinuteChange.bind(this);
+    this.handleSecondsChange = this.handleSecondsChange.bind(this);
+    this.handleAMPMChange = this.handleAMPMChange.bind(this);
+  }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-var blockName = 'time-picker-menu';
-var TimePickerContainer = aggregatedClasses('div')(blockName);
-var TimePickerHeader = aggregatedClasses('div')(blockName, 'header');
-var TimePickerPanelContainer = aggregatedClasses('div')(blockName, 'panel-container');
+  static getDerivedStateFromProps(props, state) {
+    if (props.time) {
+      return _objectSpread(_objectSpread({}, state), {}, {
+        time: moment(props.time)
+      });
+    }
 
-var generateOption = function generateOption(format) {
-  return function (option) {
-    return {
-      value: option,
-      label: typeof format === 'function' ? format(option) : option
-    };
-  };
-};
+    return _objectSpread(_objectSpread({}, state), {}, {
+      time: undefined
+    });
+  }
 
-var TimePickerMenu = /*#__PURE__*/function (_Component) {
-  _inherits(TimePickerMenu, _Component);
+  componentDidMount() {
+    const {
+      time
+    } = this.state;
+    this.setState({
+      time
+    });
+  }
 
-  var _super = _createSuper(TimePickerMenu);
+  handleMinuteChange(value) {
+    const {
+      time
+    } = this.state;
+    this.updateTime(time.minute(value));
+  }
 
-  function TimePickerMenu(props) {
-    var _this;
+  handleHoursChange(value) {
+    const {
+      time
+    } = this.state;
+    const {
+      use12Hours
+    } = this.props;
+    let nextHour = value;
+
+    if (use12Hours) {
+      if (!isAM(time)) {
+        nextHour = value % 12 + 12;
+      }
+    }
 
-    _classCallCheck(this, TimePickerMenu);
+    this.updateTime(time.hour(nextHour));
+  }
 
-    _this = _super.call(this, props);
+  handleSecondsChange(value) {
+    const {
+      time
+    } = this.state;
+    this.updateTime(time.second(value));
+  }
 
-    _this.renderHeader = function () {
-      var time = _this.state.time;
-      return /*#__PURE__*/React.createElement(TimePickerHeader, null, time.format('hh:mma'));
-    };
+  handleAMPMChange(value) {
+    const {
+      time
+    } = this.state;
+    const hour = time.hour();
+    const nextHour = value.toLowerCase() === 'am' ? hour % 12 : hour % 12 + 12;
+    this.updateTime(time.hour(nextHour));
+  }
 
-    _this.state = {
-      time: moment(props.time || '', props.format) || moment()
-    };
-    _this.handleHoursChange = _this.handleHoursChange.bind(_assertThisInitialized(_this));
-    _this.handleMinuteChange = _this.handleMinuteChange.bind(_assertThisInitialized(_this));
-    _this.handleSecondsChange = _this.handleSecondsChange.bind(_assertThisInitialized(_this));
-    _this.handleAMPMChange = _this.handleAMPMChange.bind(_assertThisInitialized(_this));
-    return _this;
+  updateTime(time) {
+    const {
+      onTimeChange
+    } = this.props;
+    onTimeChange(time);
+    this.setState({
+      time
+    });
   }
 
-  _createClass(TimePickerMenu, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var time = this.state.time;
-      this.setState({
-        time: time
-      });
-    }
-  }, {
-    key: "handleMinuteChange",
-    value: function handleMinuteChange(value) {
-      var time = this.state.time;
-      this.updateTime(time.minute(value));
-    }
-  }, {
-    key: "handleHoursChange",
-    value: function handleHoursChange(value) {
-      var time = this.state.time;
-      var use12Hours = this.props.use12Hours;
-      var nextHour = value;
-
-      if (use12Hours) {
-        if (!isAM(time)) {
-          nextHour = value % 12 + 12;
+  renderHoursPanel() {
+    const {
+      time
+    } = this.state;
+    const {
+      showHours,
+      use12Hours,
+      format,
+      hasHeader,
+      disabledTimes
+    } = this.props;
+    if (!showHours) return null;
+    const hour = time.hour(); // in 24 format
+
+    let selectedHour = use12Hours ? hour % 12 || 12 : hour;
+
+    if (disabledTimes) {
+      const {
+        from,
+        to
+      } = disabledTimes;
+
+      if (hour > from.hour && hour < to.hour) {
+        if (to.hour < 24) {
+          const toFormatted = to.hour % 12 || 12;
+          if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);
+          selectedHour = toFormatted;
+        } else if (from) {
+          selectedHour = (from.hour - 1) % 12 || 12;
         }
       }
-
-      this.updateTime(time.hour(nextHour));
     }
-  }, {
-    key: "handleSecondsChange",
-    value: function handleSecondsChange(value) {
-      var time = this.state.time;
-      this.updateTime(time.second(value));
-    }
-  }, {
-    key: "handleAMPMChange",
-    value: function handleAMPMChange(value) {
-      var time = this.state.time;
-      var hour = time.hour();
-      var nextHour = value.toLowerCase() === 'am' ? hour % 12 : hour % 12 + 12;
-      this.updateTime(time.hour(nextHour));
-    }
-  }, {
-    key: "updateTime",
-    value: function updateTime(time) {
-      var onTimeChange = this.props.onTimeChange;
-      onTimeChange(time);
-      this.setState({
-        time: time
-      });
-    }
-  }, {
-    key: "renderHoursPanel",
-    value: function renderHoursPanel() {
-      var time = this.state.time;
-      var _this$props = this.props,
-          showHours = _this$props.showHours,
-          use12Hours = _this$props.use12Hours,
-          format = _this$props.format,
-          hasHeader = _this$props.hasHeader,
-          disabledTimes = _this$props.disabledTimes;
-      if (!showHours) return null;
-      var hour = time.hour(); // in 24 format
-
-      var selectedHour = use12Hours ? hour % 12 || 12 : hour;
-
-      if (disabledTimes) {
-        var from = disabledTimes.from,
-            to = disabledTimes.to;
-
-        if (hour > from.hour && hour < to.hour) {
-          if (to.hour < 24) {
-            var toFormatted = to.hour % 12 || 12;
-            if (selectedHour !== toFormatted) this.handleHoursChange(toFormatted);
-            selectedHour = toFormatted;
-          } else if (from) {
-            selectedHour = (from.hour - 1) % 12 || 12;
-          }
-        }
-      }
 
-      var meridiem = hour >= 12 ? 'PM' : 'AM';
-      var withLeadingZeros = format.indexOf('hh') > -1;
-      var rangeHours = use12Hours ? range(1, 13) : range(24);
-      var hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));
-      return /*#__PURE__*/React.createElement(PickerPanel, {
-        type: "hour",
-        time: time,
-        meridiem: meridiem,
-        hasHeader: hasHeader,
-        header: "H",
-        onChange: this.handleHoursChange,
-        options: hoursOptions,
-        selected: selectedHour,
-        disabledTimes: disabledTimes
-      });
-    }
-  }, {
-    key: "renderMinutesPanel",
-    value: function renderMinutesPanel() {
-      var time = this.state.time;
-      var _this$props2 = this.props,
-          showMinutes = _this$props2.showMinutes,
-          format = _this$props2.format,
-          hasHeader = _this$props2.hasHeader,
-          disabledTimes = _this$props2.disabledTimes,
-          minutesInterval = _this$props2.minutesInterval;
-      if (!showMinutes) return null;
-      var withLeadingZeros = format.indexOf('mm') > -1;
-      var rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));
-      var selectedMinute = time.minute();
-      var selectedHour = time.hour();
-
-      if (disabledTimes) {
-        var from = disabledTimes.from,
-            to = disabledTimes.to;
-
-        if (selectedHour <= to.hour && selectedHour > from.hour) {
-          if (to) {
-            if (selectedMinute < to.min) this.handleMinuteChange(to.min);
-          } else if (from) {
-            if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);
-          }
-        } else {
-          selectedMinute = time.minute();
+    const meridiem = hour >= 12 ? 'PM' : 'AM';
+    const withLeadingZeros = format.indexOf('hh') > -1;
+    const rangeHours = use12Hours ? range(1, 13) : range(24);
+    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && addLeadingZeros(2)));
+    return /*#__PURE__*/_jsx(PickerPanel, {
+      type: "hour",
+      time: time,
+      meridiem: meridiem,
+      hasHeader: hasHeader,
+      header: "H",
+      onChange: this.handleHoursChange,
+      options: hoursOptions,
+      selected: selectedHour,
+      disabledTimes: disabledTimes
+    });
+  }
+
+  renderMinutesPanel() {
+    const {
+      time
+    } = this.state;
+    const {
+      showMinutes,
+      format,
+      hasHeader,
+      disabledTimes,
+      minutesInterval
+    } = this.props;
+    if (!showMinutes) return null;
+    const withLeadingZeros = format.indexOf('mm') > -1;
+    const rangeMinutes = range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && addLeadingZeros(2)));
+    let selectedMinute = time.minute();
+    const selectedHour = time.hour();
+
+    if (disabledTimes) {
+      const {
+        from,
+        to
+      } = disabledTimes;
+
+      if (selectedHour <= to.hour && selectedHour > from.hour) {
+        if (to) {
+          if (selectedMinute < to.min) this.handleMinuteChange(to.min);
+        } else if (from) {
+          if (selectedMinute > from.min) this.handleMinuteChange(from.min - 1);
         }
+      } else {
+        selectedMinute = time.minute();
       }
-
-      return /*#__PURE__*/React.createElement(PickerPanel, {
-        type: "minutes",
-        time: time,
-        hasHeader: hasHeader,
-        header: "M",
-        onChange: this.handleMinuteChange,
-        options: rangeMinutes,
-        selected: selectedMinute,
-        disabledTimes: disabledTimes
-      });
-    }
-  }, {
-    key: "renderSecondsPanel",
-    value: function renderSecondsPanel() {
-      var time = this.state.time;
-      var _this$props3 = this.props,
-          showSeconds = _this$props3.showSeconds,
-          format = _this$props3.format,
-          hasHeader = _this$props3.hasHeader;
-      if (!showSeconds) return null;
-      var withLeadingZeros = format.indexOf('ss') > -1;
-      var rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));
-      return /*#__PURE__*/React.createElement(PickerPanel, {
-        type: "seconds",
-        hasHeader: hasHeader,
-        header: "S",
-        onChange: this.handleSecondsChange,
-        options: rangeSeconds,
-        selected: time.second()
-      });
     }
-  }, {
-    key: "renderAMPMPanel",
-    value: function renderAMPMPanel() {
-      var time = this.state.time;
-      var _this$props4 = this.props,
-          use12Hours = _this$props4.use12Hours,
-          hasHeader = _this$props4.hasHeader,
-          disabledTimes = _this$props4.disabledTimes;
-      if (!use12Hours) return null;
-      var meridiemSelected = !isAM(time) ? 'pm' : 'am';
-
-      if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {
-        meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';
-
-        if (meridiemSelected === 'am' && time.hour() > 12) {
-          this.handleAMPMChange('am');
-        }
 
-        if (meridiemSelected === 'pm' && time.hour() <= 12) {
-          this.handleAMPMChange('pm');
-        }
-      }
+    return /*#__PURE__*/_jsx(PickerPanel, {
+      type: "minutes",
+      time: time,
+      hasHeader: hasHeader,
+      header: "M",
+      onChange: this.handleMinuteChange,
+      options: rangeMinutes,
+      selected: selectedMinute,
+      disabledTimes: disabledTimes
+    });
+  }
 
-      return /*#__PURE__*/React.createElement(PickerPanel, {
-        type: "meridiem",
-        hasHeader: hasHeader,
-        header: "",
-        onChange: this.handleAMPMChange,
-        options: [{
-          value: 'am',
-          label: 'am'
-        }, {
-          value: 'pm',
-          label: 'pm'
-        }],
-        selected: meridiemSelected,
-        disabledTimes: disabledTimes
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var hasHeaderDisplay = this.props.hasHeaderDisplay;
-      return /*#__PURE__*/React.createElement(TimePickerContainer, null, hasHeaderDisplay && this.renderHeader(), /*#__PURE__*/React.createElement(TimePickerPanelContainer, null, this.renderHoursPanel(), this.renderMinutesPanel(), this.renderSecondsPanel(), this.renderAMPMPanel()));
-    }
-  }], [{
-    key: "getDerivedStateFromProps",
-    value: function getDerivedStateFromProps(props, state) {
-      if (props.time) {
-        return _objectSpread(_objectSpread({}, state), {}, {
-          time: moment(props.time)
-        });
+  renderSecondsPanel() {
+    const {
+      time
+    } = this.state;
+    const {
+      showSeconds,
+      format,
+      hasHeader
+    } = this.props;
+    if (!showSeconds) return null;
+    const withLeadingZeros = format.indexOf('ss') > -1;
+    const rangeSeconds = range(60).map(generateOption(withLeadingZeros && addLeadingZeros(2)));
+    return /*#__PURE__*/_jsx(PickerPanel, {
+      type: "seconds",
+      hasHeader: hasHeader,
+      header: "S",
+      onChange: this.handleSecondsChange,
+      options: rangeSeconds,
+      selected: time.second()
+    });
+  }
+
+  renderAMPMPanel() {
+    const {
+      time
+    } = this.state;
+    const {
+      use12Hours,
+      hasHeader,
+      disabledTimes
+    } = this.props;
+    if (!use12Hours) return null;
+    let meridiemSelected = !isAM(time) ? 'pm' : 'am';
+
+    if (disabledTimes && disabledTimes.to && meridiemSelected === 'am') {
+      meridiemSelected = disabledTimes.to.hour >= 12 ? 'pm' : 'am';
+
+      if (meridiemSelected === 'am' && time.hour() > 12) {
+        this.handleAMPMChange('am');
       }
 
-      return _objectSpread(_objectSpread({}, state), {}, {
-        time: undefined
-      });
+      if (meridiemSelected === 'pm' && time.hour() <= 12) {
+        this.handleAMPMChange('pm');
+      }
     }
-  }]);
 
-  return TimePickerMenu;
-}(Component);
+    return /*#__PURE__*/_jsx(PickerPanel, {
+      type: "meridiem",
+      hasHeader: hasHeader,
+      header: "",
+      onChange: this.handleAMPMChange,
+      options: [{
+        value: 'am',
+        label: 'am'
+      }, {
+        value: 'pm',
+        label: 'pm'
+      }],
+      selected: meridiemSelected,
+      disabledTimes: disabledTimes
+    });
+  }
+
+  render() {
+    const {
+      hasHeaderDisplay
+    } = this.props;
+    return /*#__PURE__*/_jsx(TimePickerContainer, {}, void 0, hasHeaderDisplay && this.renderHeader(), /*#__PURE__*/_jsx(TimePickerPanelContainer, {}, void 0, this.renderHoursPanel(), this.renderMinutesPanel(), this.renderSecondsPanel(), this.renderAMPMPanel()));
+  }
+
+}
 
 TimePickerMenu.defaultProps = {
   time: moment(),
@@ -300,33 +295,7 @@ TimePickerMenu.defaultProps = {
   showMinutes: true,
   showHours: true,
   disabledTimes: undefined,
-  onTimeChange: function onTimeChange() {
-    return null;
-  }
-};
-TimePickerMenu.propTypes = {
-  /** Time value */
-  time: PropTypes.instanceOf(moment),
-
-  /** If the menu has header or not */
-  hasHeader: PropTypes.bool,
-
-  /** Whether to use the 12 hours format */
-  use12Hours: PropTypes.bool,
-
-  /** Whether show 'seconds' or not */
-  showSeconds: PropTypes.bool,
-
-  /** Whether show 'minutes' or not */
-  showMinutes: PropTypes.bool,
-
-  /** Whether show 'hours' or not */
-  showHours: PropTypes.bool,
-
-  /** Handler when time changes */
-  onTimeChange: PropTypes.func,
-  disabledTimes: PropTypes.object
+  onTimeChange: () => null
 };
 
 export { TimePickerMenu, TimePickerMenu as default };
-//# sourceMappingURL=TimePickerMenu.js.map

package/esm/index.js

@@ -2,32 +2,3 @@ export { DSTimePicker, DSTimePickerWithSchema, DSTimePicker as default } from '.
 export { TimePickerMenu } from './TimePickerMenu.js';
 export { DSTimePickerMenu } from './DSTimePickerMenu.js';
 export { convertTimeString } from './utils.js';
-import 'react';
-import 'react-desc';
-import 'moment';
-import './TimePickerImpl.js';
-import '@babel/runtime/helpers/esm/objectWithoutProperties';
-import '@babel/runtime/helpers/esm/extends';
-import '@babel/runtime/helpers/esm/slicedToArray';
-import 'prop-types';
-import 'memoize-one';
-import '@elliemae/ds-utilities';
-import '@elliemae/ds-classnames';
-import '@elliemae/ds-form';
-import './TimePickerDropdown.js';
-import '@elliemae/ds-icons';
-import '@elliemae/ds-button';
-import '@elliemae/ds-popper';
-import '@babel/runtime/helpers/esm/defineProperty';
-import '@babel/runtime/helpers/esm/classCallCheck';
-import '@babel/runtime/helpers/esm/createClass';
-import '@babel/runtime/helpers/esm/assertThisInitialized';
-import '@babel/runtime/helpers/esm/inherits';
-import '@babel/runtime/helpers/esm/possibleConstructorReturn';
-import '@babel/runtime/helpers/esm/getPrototypeOf';
-import './PickerPanel.js';
-import '@babel/runtime/helpers/esm/toArray';
-import 'lodash';
-import './moveElementOnScroll.js';
-import 'styled-components';
-//# sourceMappingURL=index.js.map