Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@wojtekmaj/react-datetimerange-picker
Advanced tools
@wojtekmaj/react-datetimerange-picker - npm Package Compare versions
Comparing version 4.0.1 to 4.1.0
| "use strict"; | ||
| function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } | ||
| Object.defineProperty(exports, "__esModule", { | ||
@@ -9,111 +8,63 @@ value: true | ||
| exports["default"] = void 0; | ||
| var _react = _interopRequireWildcard(require("react")); | ||
| var _reactDom = require("react-dom"); | ||
| var _propTypes = _interopRequireDefault(require("prop-types")); | ||
| var _makeEventProps = _interopRequireDefault(require("make-event-props")); | ||
| var _mergeClassNames = _interopRequireDefault(require("merge-class-names")); | ||
| var _clsx = _interopRequireDefault(require("clsx")); | ||
| var _reactCalendar = _interopRequireDefault(require("react-calendar")); | ||
| var _reactFit = _interopRequireDefault(require("react-fit")); | ||
| var _reactClock = _interopRequireDefault(require("react-clock")); | ||
| var _DateTimeInput = _interopRequireDefault(require("react-datetime-picker/dist/DateTimeInput")); | ||
| var _propTypes2 = require("./shared/propTypes"); | ||
| var _excluded = ["calendarClassName", "className", "maxDetail", "onChange", "portalContainer", "value"], | ||
| _excluded2 = ["clockClassName", "className", "maxDetail", "onChange", "portalContainer", "value"], | ||
| _excluded3 = ["onChange"]; | ||
| _excluded2 = ["clockClassName", "className", "maxDetail", "onChange", "portalContainer", "value"], | ||
| _excluded3 = ["onChange"]; | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
| function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } | ||
| function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; } | ||
| function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; } | ||
| function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } | ||
| function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } | ||
| 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; } | ||
| function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } | ||
| function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } | ||
| function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } | ||
| function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } | ||
| function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } | ||
| function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } | ||
| function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; } | ||
| function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); } | ||
| function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } | ||
| 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); }; } | ||
| function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); } | ||
| function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
| 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; } } | ||
| function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } | ||
| function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
| var allViews = ['hour', 'minute', 'second']; | ||
| var baseClassName = 'react-datetimerange-picker'; | ||
| var outsideActionEvents = ['mousedown', 'focusin', 'touchstart']; | ||
| var DateTimeRangePicker = /*#__PURE__*/function (_PureComponent) { | ||
| _inherits(DateTimeRangePicker, _PureComponent); | ||
| var _super = _createSuper(DateTimeRangePicker); | ||
| function DateTimeRangePicker() { | ||
| var _this; | ||
| _classCallCheck(this, DateTimeRangePicker); | ||
| for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { | ||
| args[_key] = arguments[_key]; | ||
| } | ||
| _this = _super.call.apply(_super, [this].concat(args)); | ||
| _defineProperty(_assertThisInitialized(_this), "state", {}); | ||
| _defineProperty(_assertThisInitialized(_this), "wrapper", /*#__PURE__*/(0, _react.createRef)()); | ||
| _defineProperty(_assertThisInitialized(_this), "widgetWrapper", /*#__PURE__*/(0, _react.createRef)()); | ||
| _defineProperty(_assertThisInitialized(_this), "onOutsideAction", function (event) { | ||
| var _assertThisInitialize = _assertThisInitialized(_this), | ||
| wrapper = _assertThisInitialize.wrapper, | ||
| widgetWrapper = _assertThisInitialize.widgetWrapper; // Try event.composedPath first to handle clicks inside a Shadow DOM. | ||
| wrapper = _assertThisInitialize.wrapper, | ||
| widgetWrapper = _assertThisInitialize.widgetWrapper; | ||
| // Try event.composedPath first to handle clicks inside a Shadow DOM. | ||
| var target = 'composedPath' in event ? event.composedPath()[0] : event.target; | ||
| if (wrapper.current && !wrapper.current.contains(target) && (!widgetWrapper.current || !widgetWrapper.current.contains(target))) { | ||
@@ -123,16 +74,12 @@ _this.closeWidgets(); | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "onDateChange", function (_ref) { | ||
| var _ref2 = _slicedToArray(_ref, 2), | ||
| valueFrom = _ref2[0], | ||
| valueTo = _ref2[1]; | ||
| valueFrom = _ref2[0], | ||
| valueTo = _ref2[1]; | ||
| var closeWidgets = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; | ||
| var value = _this.props.value; | ||
| var _concat = [].concat(value), | ||
| _concat2 = _slicedToArray(_concat, 2), | ||
| prevValueFrom = _concat2[0], | ||
| prevValueTo = _concat2[1]; | ||
| _concat2 = _slicedToArray(_concat, 2), | ||
| prevValueFrom = _concat2[0], | ||
| prevValueTo = _concat2[1]; | ||
| var nextValueFrom = function () { | ||
@@ -142,3 +89,2 @@ if (!prevValueFrom) { | ||
| } | ||
| var valueWithHour = new Date(valueFrom); | ||
@@ -148,3 +94,2 @@ valueWithHour.setHours(prevValueFrom.getHours(), prevValueFrom.getMinutes(), prevValueFrom.getSeconds(), prevValueFrom.getMilliseconds()); | ||
| }(); | ||
| var nextValueTo = function () { | ||
@@ -154,3 +99,2 @@ if (!prevValueTo) { | ||
| } | ||
| var valueWithHour = new Date(valueTo); | ||
@@ -160,14 +104,10 @@ valueWithHour.setHours(prevValueTo.getHours(), prevValueTo.getMinutes(), prevValueTo.getSeconds(), prevValueTo.getMilliseconds()); | ||
| }(); | ||
| _this.onChange([nextValueFrom, nextValueTo], closeWidgets); | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "onChange", function (value) { | ||
| var closeWidgets = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _this.props.closeWidgets; | ||
| var onChange = _this.props.onChange; | ||
| if (closeWidgets) { | ||
| _this.closeWidgets(); | ||
| } | ||
| if (onChange) { | ||
@@ -177,38 +117,29 @@ onChange(value); | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "onChangeFrom", function (valueFrom, closeWidgets) { | ||
| var value = _this.props.value; | ||
| var _concat3 = [].concat(value), | ||
| _concat4 = _slicedToArray(_concat3, 2), | ||
| valueTo = _concat4[1]; | ||
| _concat4 = _slicedToArray(_concat3, 2), | ||
| valueTo = _concat4[1]; | ||
| _this.onChange([valueFrom, valueTo], closeWidgets); | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "onChangeTo", function (valueTo, closeWidgets) { | ||
| var value = _this.props.value; | ||
| var _concat5 = [].concat(value), | ||
| _concat6 = _slicedToArray(_concat5, 1), | ||
| valueFrom = _concat6[0]; | ||
| _concat6 = _slicedToArray(_concat5, 1), | ||
| valueFrom = _concat6[0]; | ||
| _this.onChange([valueFrom, valueTo], closeWidgets); | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "onFocus", function (event) { | ||
| var _this$props = _this.props, | ||
| disabled = _this$props.disabled, | ||
| onFocus = _this$props.onFocus, | ||
| openWidgetsOnFocus = _this$props.openWidgetsOnFocus; | ||
| disabled = _this$props.disabled, | ||
| onFocus = _this$props.onFocus, | ||
| openWidgetsOnFocus = _this$props.openWidgetsOnFocus; | ||
| if (onFocus) { | ||
| onFocus(event); | ||
| } // Internet Explorer still fires onFocus on disabled elements | ||
| } | ||
| // Internet Explorer still fires onFocus on disabled elements | ||
| if (disabled) { | ||
| return; | ||
| } | ||
| if (openWidgetsOnFocus) { | ||
@@ -218,3 +149,2 @@ if (event.target.dataset.select === 'true') { | ||
| } | ||
| switch (event.target.name) { | ||
@@ -225,5 +155,3 @@ case 'day': | ||
| _this.openCalendar(); | ||
| break; | ||
| case 'hour12': | ||
@@ -234,5 +162,3 @@ case 'hour24': | ||
| _this.openClock(); | ||
| break; | ||
| default: | ||
@@ -242,3 +168,2 @@ } | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "onKeyDown", function (event) { | ||
@@ -249,3 +174,2 @@ if (event.key === 'Escape') { | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "openClock", function () { | ||
@@ -257,3 +181,2 @@ _this.setState({ | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "openCalendar", function () { | ||
@@ -265,3 +188,2 @@ _this.setState({ | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "toggleCalendar", function () { | ||
@@ -275,3 +197,2 @@ _this.setState(function (prevState) { | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "closeWidgets", function () { | ||
@@ -282,3 +203,2 @@ _this.setState(function (prevState) { | ||
| } | ||
| return { | ||
@@ -290,14 +210,10 @@ isCalendarOpen: false, | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "stopPropagation", function (event) { | ||
| return event.stopPropagation(); | ||
| }); | ||
| _defineProperty(_assertThisInitialized(_this), "clear", function () { | ||
| return _this.onChange(null); | ||
| }); | ||
| return _this; | ||
| } | ||
| _createClass(DateTimeRangePicker, [{ | ||
@@ -312,16 +228,14 @@ key: "componentDidMount", | ||
| var _this$state = this.state, | ||
| isCalendarOpen = _this$state.isCalendarOpen, | ||
| isClockOpen = _this$state.isClockOpen; | ||
| isCalendarOpen = _this$state.isCalendarOpen, | ||
| isClockOpen = _this$state.isClockOpen; | ||
| var _this$props2 = this.props, | ||
| onCalendarClose = _this$props2.onCalendarClose, | ||
| onCalendarOpen = _this$props2.onCalendarOpen, | ||
| onClockClose = _this$props2.onClockClose, | ||
| onClockOpen = _this$props2.onClockOpen; | ||
| onCalendarClose = _this$props2.onCalendarClose, | ||
| onCalendarOpen = _this$props2.onCalendarOpen, | ||
| onClockClose = _this$props2.onClockClose, | ||
| onClockOpen = _this$props2.onClockOpen; | ||
| var isWidgetOpen = isCalendarOpen || isClockOpen; | ||
| var prevIsWidgetOpen = prevState.isCalendarOpen || prevState.isClockOpen; | ||
| if (isWidgetOpen !== prevIsWidgetOpen) { | ||
| this.handleOutsideActionListeners(); | ||
| } | ||
| if (isCalendarOpen !== prevState.isCalendarOpen) { | ||
@@ -331,6 +245,4 @@ var callback = isCalendarOpen ? onCalendarOpen : onCalendarClose; | ||
| } | ||
| if (isClockOpen !== prevState.isClockOpen) { | ||
| var _callback = isClockOpen ? onClockOpen : onClockClose; | ||
| if (_callback) _callback(); | ||
@@ -353,6 +265,5 @@ } | ||
| var _this2 = this; | ||
| var _this$state2 = this.state, | ||
| isCalendarOpen = _this$state2.isCalendarOpen, | ||
| isClockOpen = _this$state2.isClockOpen; | ||
| isCalendarOpen = _this$state2.isCalendarOpen, | ||
| isClockOpen = _this$state2.isClockOpen; | ||
| var isWidgetOpen = isCalendarOpen || isClockOpen; | ||
@@ -370,42 +281,40 @@ var shouldListenWithFallback = typeof shouldListen !== 'undefined' ? shouldListen : isWidgetOpen; | ||
| var _this$props3 = this.props, | ||
| amPmAriaLabel = _this$props3.amPmAriaLabel, | ||
| autoFocus = _this$props3.autoFocus, | ||
| calendarAriaLabel = _this$props3.calendarAriaLabel, | ||
| calendarIcon = _this$props3.calendarIcon, | ||
| clearAriaLabel = _this$props3.clearAriaLabel, | ||
| clearIcon = _this$props3.clearIcon, | ||
| dayAriaLabel = _this$props3.dayAriaLabel, | ||
| dayPlaceholder = _this$props3.dayPlaceholder, | ||
| disableCalendar = _this$props3.disableCalendar, | ||
| disabled = _this$props3.disabled, | ||
| format = _this$props3.format, | ||
| hourAriaLabel = _this$props3.hourAriaLabel, | ||
| hourPlaceholder = _this$props3.hourPlaceholder, | ||
| locale = _this$props3.locale, | ||
| maxDate = _this$props3.maxDate, | ||
| maxDetail = _this$props3.maxDetail, | ||
| minDate = _this$props3.minDate, | ||
| minuteAriaLabel = _this$props3.minuteAriaLabel, | ||
| minutePlaceholder = _this$props3.minutePlaceholder, | ||
| monthAriaLabel = _this$props3.monthAriaLabel, | ||
| monthPlaceholder = _this$props3.monthPlaceholder, | ||
| name = _this$props3.name, | ||
| nativeInputAriaLabel = _this$props3.nativeInputAriaLabel, | ||
| rangeDivider = _this$props3.rangeDivider, | ||
| required = _this$props3.required, | ||
| secondAriaLabel = _this$props3.secondAriaLabel, | ||
| secondPlaceholder = _this$props3.secondPlaceholder, | ||
| showLeadingZeros = _this$props3.showLeadingZeros, | ||
| value = _this$props3.value, | ||
| yearAriaLabel = _this$props3.yearAriaLabel, | ||
| yearPlaceholder = _this$props3.yearPlaceholder; | ||
| amPmAriaLabel = _this$props3.amPmAriaLabel, | ||
| autoFocus = _this$props3.autoFocus, | ||
| calendarAriaLabel = _this$props3.calendarAriaLabel, | ||
| calendarIcon = _this$props3.calendarIcon, | ||
| clearAriaLabel = _this$props3.clearAriaLabel, | ||
| clearIcon = _this$props3.clearIcon, | ||
| dayAriaLabel = _this$props3.dayAriaLabel, | ||
| dayPlaceholder = _this$props3.dayPlaceholder, | ||
| disableCalendar = _this$props3.disableCalendar, | ||
| disabled = _this$props3.disabled, | ||
| format = _this$props3.format, | ||
| hourAriaLabel = _this$props3.hourAriaLabel, | ||
| hourPlaceholder = _this$props3.hourPlaceholder, | ||
| locale = _this$props3.locale, | ||
| maxDate = _this$props3.maxDate, | ||
| maxDetail = _this$props3.maxDetail, | ||
| minDate = _this$props3.minDate, | ||
| minuteAriaLabel = _this$props3.minuteAriaLabel, | ||
| minutePlaceholder = _this$props3.minutePlaceholder, | ||
| monthAriaLabel = _this$props3.monthAriaLabel, | ||
| monthPlaceholder = _this$props3.monthPlaceholder, | ||
| name = _this$props3.name, | ||
| nativeInputAriaLabel = _this$props3.nativeInputAriaLabel, | ||
| rangeDivider = _this$props3.rangeDivider, | ||
| required = _this$props3.required, | ||
| secondAriaLabel = _this$props3.secondAriaLabel, | ||
| secondPlaceholder = _this$props3.secondPlaceholder, | ||
| showLeadingZeros = _this$props3.showLeadingZeros, | ||
| value = _this$props3.value, | ||
| yearAriaLabel = _this$props3.yearAriaLabel, | ||
| yearPlaceholder = _this$props3.yearPlaceholder; | ||
| var _this$state3 = this.state, | ||
| isCalendarOpen = _this$state3.isCalendarOpen, | ||
| isClockOpen = _this$state3.isClockOpen; | ||
| isCalendarOpen = _this$state3.isCalendarOpen, | ||
| isClockOpen = _this$state3.isClockOpen; | ||
| var _concat7 = [].concat(value), | ||
| _concat8 = _slicedToArray(_concat7, 2), | ||
| valueFrom = _concat8[0], | ||
| valueTo = _concat8[1]; | ||
| _concat8 = _slicedToArray(_concat7, 2), | ||
| valueFrom = _concat8[0], | ||
| valueTo = _concat8[1]; | ||
| var ariaLabelProps = { | ||
@@ -429,3 +338,2 @@ amPmAriaLabel: amPmAriaLabel, | ||
| }; | ||
| var commonProps = _objectSpread(_objectSpread(_objectSpread({}, ariaLabelProps), placeholderProps), {}, { | ||
@@ -443,3 +351,2 @@ className: "".concat(baseClassName, "__inputGroup"), | ||
| }); | ||
| return /*#__PURE__*/_react["default"].createElement("div", { | ||
@@ -482,22 +389,17 @@ className: "".concat(baseClassName, "__wrapper") | ||
| var _this3 = this; | ||
| var disableCalendar = this.props.disableCalendar; | ||
| var isCalendarOpen = this.state.isCalendarOpen; | ||
| if (isCalendarOpen === null || disableCalendar) { | ||
| return null; | ||
| } | ||
| var _this$props4 = this.props, | ||
| calendarClassName = _this$props4.calendarClassName, | ||
| dateTimeRangePickerClassName = _this$props4.className, | ||
| dateTimeRangePickerMaxDetail = _this$props4.maxDetail, | ||
| onChange = _this$props4.onChange, | ||
| portalContainer = _this$props4.portalContainer, | ||
| value = _this$props4.value, | ||
| calendarProps = _objectWithoutProperties(_this$props4, _excluded); | ||
| calendarClassName = _this$props4.calendarClassName, | ||
| dateTimeRangePickerClassName = _this$props4.className, | ||
| dateTimeRangePickerMaxDetail = _this$props4.maxDetail, | ||
| onChange = _this$props4.onChange, | ||
| portalContainer = _this$props4.portalContainer, | ||
| value = _this$props4.value, | ||
| calendarProps = _objectWithoutProperties(_this$props4, _excluded); | ||
| var className = "".concat(baseClassName, "__calendar"); | ||
| var classNames = (0, _mergeClassNames["default"])(className, "".concat(className, "--").concat(isCalendarOpen ? 'open' : 'closed')); | ||
| var classNames = (0, _clsx["default"])(className, "".concat(className, "--").concat(isCalendarOpen ? 'open' : 'closed')); | ||
| var calendar = /*#__PURE__*/_react["default"].createElement(_reactCalendar["default"], _extends({ | ||
@@ -511,3 +413,2 @@ className: calendarClassName, | ||
| }, calendarProps)); | ||
| return portalContainer ? /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react["default"].createElement("div", { | ||
@@ -530,25 +431,19 @@ ref: this.widgetWrapper, | ||
| var isClockOpen = this.state.isClockOpen; | ||
| if (isClockOpen === null || disableClock) { | ||
| return null; | ||
| } | ||
| var _this$props5 = this.props, | ||
| clockClassName = _this$props5.clockClassName, | ||
| dateTimeRangePickerClassName = _this$props5.className, | ||
| maxDetail = _this$props5.maxDetail, | ||
| onChange = _this$props5.onChange, | ||
| portalContainer = _this$props5.portalContainer, | ||
| value = _this$props5.value, | ||
| clockProps = _objectWithoutProperties(_this$props5, _excluded2); | ||
| clockClassName = _this$props5.clockClassName, | ||
| dateTimeRangePickerClassName = _this$props5.className, | ||
| maxDetail = _this$props5.maxDetail, | ||
| onChange = _this$props5.onChange, | ||
| portalContainer = _this$props5.portalContainer, | ||
| value = _this$props5.value, | ||
| clockProps = _objectWithoutProperties(_this$props5, _excluded2); | ||
| var className = "".concat(baseClassName, "__clock"); | ||
| var classNames = (0, _mergeClassNames["default"])(className, "".concat(className, "--").concat(isClockOpen ? 'open' : 'closed')); | ||
| var classNames = (0, _clsx["default"])(className, "".concat(className, "--").concat(isClockOpen ? 'open' : 'closed')); | ||
| var _concat9 = [].concat(value), | ||
| _concat10 = _slicedToArray(_concat9, 1), | ||
| valueFrom = _concat10[0]; | ||
| _concat10 = _slicedToArray(_concat9, 1), | ||
| valueFrom = _concat10[0]; | ||
| var maxDetailIndex = allViews.indexOf(maxDetail); | ||
| var clock = /*#__PURE__*/_react["default"].createElement(_reactClock["default"], _extends({ | ||
@@ -560,3 +455,2 @@ className: clockClassName, | ||
| }, clockProps)); | ||
| return portalContainer ? /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react["default"].createElement("div", { | ||
@@ -579,13 +473,11 @@ ref: this.widgetWrapper, | ||
| var _this$props6 = this.props, | ||
| className = _this$props6.className, | ||
| disabled = _this$props6.disabled; | ||
| className = _this$props6.className, | ||
| disabled = _this$props6.disabled; | ||
| var _this$state4 = this.state, | ||
| isCalendarOpen = _this$state4.isCalendarOpen, | ||
| isClockOpen = _this$state4.isClockOpen; | ||
| isCalendarOpen = _this$state4.isCalendarOpen, | ||
| isClockOpen = _this$state4.isClockOpen; | ||
| var onChange = eventProps.onChange, | ||
| eventPropsWithoutOnChange = _objectWithoutProperties(eventProps, _excluded3); | ||
| eventPropsWithoutOnChange = _objectWithoutProperties(eventProps, _excluded3); | ||
| return /*#__PURE__*/_react["default"].createElement("div", _extends({ | ||
| className: (0, _mergeClassNames["default"])(baseClassName, "".concat(baseClassName, "--").concat(isCalendarOpen || isClockOpen ? 'open' : 'closed'), "".concat(baseClassName, "--").concat(disabled ? 'disabled' : 'enabled'), className) | ||
| className: (0, _clsx["default"])(baseClassName, "".concat(baseClassName, "--").concat(isCalendarOpen || isClockOpen ? 'open' : 'closed'), "".concat(baseClassName, "--").concat(disabled ? 'disabled' : 'enabled'), className) | ||
| }, eventPropsWithoutOnChange, { | ||
@@ -600,3 +492,2 @@ onFocus: this.onFocus, | ||
| var nextState = {}; | ||
| if (nextProps.isCalendarOpen !== prevState.isCalendarOpenProps) { | ||
@@ -606,3 +497,2 @@ nextState.isCalendarOpen = nextProps.isCalendarOpen; | ||
| } | ||
| if (nextProps.isClockOpen !== prevState.isClockOpenProps) { | ||
@@ -612,10 +502,7 @@ nextState.isClockOpen = nextProps.isClockOpen; | ||
| } | ||
| return nextState; | ||
| } | ||
| }]); | ||
| return DateTimeRangePicker; | ||
| }(_react.PureComponent); | ||
| exports["default"] = DateTimeRangePicker; | ||
@@ -630,3 +517,2 @@ var iconProps = { | ||
| }; | ||
| var CalendarIcon = /*#__PURE__*/_react["default"].createElement("svg", _extends({}, iconProps, { | ||
@@ -651,3 +537,2 @@ className: "".concat(baseClassName, "__calendar-button__icon ").concat(baseClassName, "__button__icon") | ||
| })); | ||
| var ClearIcon = /*#__PURE__*/_react["default"].createElement("svg", _extends({}, iconProps, { | ||
@@ -666,3 +551,2 @@ className: "".concat(baseClassName, "__clear-button__icon ").concat(baseClassName, "__button__icon") | ||
| })); | ||
| DateTimeRangePicker.defaultProps = { | ||
@@ -679,5 +563,3 @@ calendarIcon: CalendarIcon, | ||
| }; | ||
| var isValue = _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].instanceOf(Date)]); | ||
| DateTimeRangePicker.propTypes = { | ||
@@ -684,0 +566,0 @@ amPmAriaLabel: _propTypes["default"].string, |
@@ -7,13 +7,7 @@ "use strict"; | ||
| exports["default"] = void 0; | ||
| require("react-calendar/dist/Calendar.css"); | ||
| require("react-clock/dist/Clock.css"); | ||
| var _DateTimeRangePicker = _interopRequireDefault(require("./DateTimeRangePicker")); | ||
| require("./DateTimeRangePicker.css"); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
| // File is created during build phase and placed in dist directory | ||
@@ -20,0 +14,0 @@ // eslint-disable-next-line import/no-unresolved |
@@ -7,8 +7,5 @@ "use strict"; | ||
| exports["default"] = void 0; | ||
| var _DateTimeRangePicker = _interopRequireDefault(require("./DateTimeRangePicker")); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
| var _default = _DateTimeRangePicker["default"]; | ||
| exports["default"] = _default; |
@@ -7,47 +7,32 @@ "use strict"; | ||
| exports.isMinDate = exports.isMaxDate = void 0; | ||
| function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } | ||
| var isMinDate = function isMinDate(props, propName, componentName) { | ||
| var minDate = props[propName]; | ||
| if (!minDate) { | ||
| return null; | ||
| } | ||
| if (!(minDate instanceof Date)) { | ||
| return new Error("Invalid prop `".concat(propName, "` of type `").concat(_typeof(minDate), "` supplied to `").concat(componentName, "`, expected instance of `Date`.")); | ||
| } | ||
| var maxDate = props.maxDate; | ||
| if (maxDate && minDate > maxDate) { | ||
| return new Error("Invalid prop `".concat(propName, "` of type `").concat(_typeof(minDate), "` supplied to `").concat(componentName, "`, minDate cannot be larger than maxDate.")); | ||
| } | ||
| return null; | ||
| }; | ||
| exports.isMinDate = isMinDate; | ||
| var isMaxDate = function isMaxDate(props, propName, componentName) { | ||
| var maxDate = props[propName]; | ||
| if (!maxDate) { | ||
| return null; | ||
| } | ||
| if (!(maxDate instanceof Date)) { | ||
| return new Error("Invalid prop `".concat(propName, "` of type `").concat(_typeof(maxDate), "` supplied to `").concat(componentName, "`, expected instance of `Date`.")); | ||
| } | ||
| var minDate = props.minDate; | ||
| if (minDate && maxDate < minDate) { | ||
| return new Error("Invalid prop `".concat(propName, "` of type `").concat(_typeof(maxDate), "` supplied to `").concat(componentName, "`, maxDate cannot be smaller than minDate.")); | ||
| } | ||
| return null; | ||
| }; | ||
| exports.isMaxDate = isMaxDate; |
| { | ||
| "name": "@wojtekmaj/react-datetimerange-picker", | ||
| "version": "4.0.1", | ||
| "version": "4.1.0", | ||
| "description": "A datetime range picker for your React app.", | ||
@@ -14,5 +14,6 @@ "main": "dist/entry.js", | ||
| "jest": "jest", | ||
| "lint": "eslint sample/ src/ test/ --ext .jsx,.js", | ||
| "lint": "eslint sample src test --ext .jsx,.js", | ||
| "prepack": "yarn clean && yarn build", | ||
| "test": "yarn lint && yarn jest" | ||
| "prettier": "prettier --check . --cache", | ||
| "test": "yarn lint && yarn prettier && yarn jest" | ||
| }, | ||
@@ -39,8 +40,8 @@ "keywords": [ | ||
| "dependencies": { | ||
| "clsx": "^1.2.1", | ||
| "make-event-props": "^1.1.0", | ||
| "merge-class-names": "^1.1.1", | ||
| "prop-types": "^15.6.0", | ||
| "react-calendar": "^3.7.0", | ||
| "react-clock": "^3.1.0", | ||
| "react-datetime-picker": "^4.0.0", | ||
| "react-calendar": "^4.0.0", | ||
| "react-clock": "^4.0.0", | ||
| "react-datetime-picker": "^4.1.0", | ||
| "react-fit": "^1.4.0" | ||
@@ -54,5 +55,5 @@ }, | ||
| "@testing-library/jest-dom": "^5.15.0", | ||
| "@testing-library/react": "^12.1.0", | ||
| "eslint": "^8.5.0", | ||
| "eslint-config-wojtekmaj": "^0.6.5", | ||
| "@testing-library/react": "^13.4.0", | ||
| "eslint": "^8.26.0", | ||
| "eslint-config-wojtekmaj": "^0.7.1", | ||
| "husky": "^8.0.0", | ||
@@ -62,6 +63,6 @@ "jest": "^29.0.0", | ||
| "less": "^4.0.0", | ||
| "prettier": "^2.5.0", | ||
| "prettier": "^2.7.0", | ||
| "pretty-quick": "^3.1.0", | ||
| "react": "^17.0.0", | ||
| "react-dom": "^17.0.0", | ||
| "react": "^18.2.0", | ||
| "react-dom": "^18.2.0", | ||
| "rimraf": "^3.0.0" | ||
@@ -68,0 +69,0 @@ }, |
@@ -119,2 +119,3 @@ [](https://www.npmjs.com/package/@wojtekmaj/react-datetimerange-picker)  [](https://github.com/wojtekmaj/react-datetimerange-picker/actions)   [](https://github.com/facebook/jest) | ||
| | onClockOpen | Function called when the clock opens. | n/a | `() => alert('Clock opened')` | | ||
| | onFocus | Function called when the focuses an input. | n/a | `(event) => alert('Focused input: ', event.target.name)` | | ||
| | openWidgetsOnFocus | Whether to open the widgets on input focus. | `true` | `false` | | ||
@@ -121,0 +122,0 @@ | portalContainer | Element to render the widgets in using portal. | n/a | `document.getElementById('my-div')` | |
@@ -5,3 +5,3 @@ import React, { createRef, PureComponent } from 'react'; | ||
| import makeEventProps from 'make-event-props'; | ||
| import mergeClassNames from 'merge-class-names'; | ||
| import clsx from 'clsx'; | ||
| import Calendar from 'react-calendar'; | ||
@@ -384,6 +384,3 @@ import Fit from 'react-fit'; | ||
| const className = `${baseClassName}__calendar`; | ||
| const classNames = mergeClassNames( | ||
| className, | ||
| `${className}--${isCalendarOpen ? 'open' : 'closed'}`, | ||
| ); | ||
| const classNames = clsx(className, `${className}--${isCalendarOpen ? 'open' : 'closed'}`); | ||
@@ -442,6 +439,3 @@ const calendar = ( | ||
| const className = `${baseClassName}__clock`; | ||
| const classNames = mergeClassNames( | ||
| className, | ||
| `${className}--${isClockOpen ? 'open' : 'closed'}`, | ||
| ); | ||
| const classNames = clsx(className, `${className}--${isClockOpen ? 'open' : 'closed'}`); | ||
@@ -494,3 +488,3 @@ const [valueFrom] = [].concat(value); | ||
| <div | ||
| className={mergeClassNames( | ||
| className={clsx( | ||
| baseClassName, | ||
@@ -497,0 +491,0 @@ `${baseClassName}--${isCalendarOpen || isClockOpen ? 'open' : 'closed'}`, |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.08%
119121
- Number of lines in readme file
- increased by0.67%
151
Worsened metrics
- Lines of code
- decreased by-0.21%
1889
Dependency changes
+ Addedclsx@^1.2.1
+ Addedclsx@1.2.1(transitive)
- Removedmerge-class-names@^1.1.1
- Removedmerge-class-names@1.4.2(transitive)
- Removedreact-calendar@3.9.0(transitive)
- Removedreact-clock@3.1.0(transitive)
Updatedreact-calendar@^4.0.0
Updatedreact-clock@^4.0.0
Updatedreact-datetime-picker@^4.1.0