intelicoreact 0.0.94 → 0.0.97

package/dist/Atomic/FormElements/Input/Input.js

@@ -52,6 +52,8 @@ var Input = function Input(_ref) {
       className = _ref.className,
       _ref$type = _ref.type,
       type = _ref$type === void 0 ? 'text' : _ref$type,
+      _ref$softStringMode = _ref.softStringMode,
+      softStringMode = _ref$softStringMode === void 0 ? false : _ref$softStringMode,
       mask = _ref.mask,
       maskChar = _ref.maskChar,
       formatChars = _ref.formatChars,
@@ -103,7 +105,7 @@ var Input = function Input(_ref) {
 
       if (isOnlyNumber && !isTwoDigitAfterDot) inputValue = onlyNumbers(inputValue);
       if (isTwoDigitAfterDot) inputValue = onlyNumbers(inputValue, true);
-      if (isOnlyString) inputValue = onlyString(inputValue);
+      if (isOnlyString) inputValue = onlyString(inputValue, softStringMode);
       onChange(inputValue.toString());
     },
     toggleEdit: function toggleEdit() {

package/dist/Atomic/FormElements/Input/Input.stories.js

@@ -43,9 +43,12 @@ var _default = {
     isOnlyNumber: {
       description: 'boolean - only numbers'
     },
-    isOnlyString: {
+    softStringMode: {
       description: 'boolean - only strings'
     },
+    hardStringMode: {
+      description: 'boolean - soft or hard validation'
+    },
     isTwoDigitAfterDot: {
       description: 'boolean - only two digits after dot'
     },
@@ -114,6 +117,7 @@ InputTemplate.args = {
   disabled: false,
   error: '',
   mask: '',
+  softStringMode: true,
   withDelete: true,
   symbolsLimit: 255,
   placeholder: 'Placeholder',

package/dist/Atomic/FormElements/InputCalendar/InputCalendar.js

@@ -33,6 +33,9 @@ var InputCalendar = function InputCalendar(_ref) {
   var value = _ref.value,
       minDate = _ref.minDate,
       maxDate = _ref.maxDate,
+      _ref$format = _ref.format,
+      format = _ref$format === void 0 ? 'MM/DD/YYYY' : _ref$format,
+      isDontLimitFuture = _ref.isDontLimitFuture,
       onChange = _ref.onChange,
       _ref$className = _ref.className,
       className = _ref$className === void 0 ? '' : _ref$className,
@@ -40,7 +43,6 @@ var InputCalendar = function InputCalendar(_ref) {
       placeholder = _ref$placeholder === void 0 ? 'mm/dd/yyyy' : _ref$placeholder,
       _ref$mask = _ref.mask,
       mask = _ref$mask === void 0 ? '99/99/9999' : _ref$mask,
-      isDontLimitFuture = _ref.isDontLimitFuture,
       isListTop = _ref.isListTop,
       disabled = _ref.disabled;
 
@@ -50,6 +52,10 @@ var InputCalendar = function InputCalendar(_ref) {
       setIsOpened = _useState2[1];
 
   var calendarRef = (0, _react.useRef)(null);
+  var formatedMinDate = (0, _moment.default)(minDate).format(format) !== 'Invalid date' ? (0, _moment.default)(minDate).format(format) : null;
+  var formatedMaxDate = (0, _moment.default)(maxDate).format(format) !== 'Invalid date' ? (0, _moment.default)(maxDate).format(format) : null;
+  var momentMinDate = (0, _moment.default)(formatedMinDate, format).startOf('day');
+  var momentMaxDate = (0, _moment.default)(formatedMaxDate, format).startOf('day');
   (0, _useClickOutside.useClickOutside)(calendarRef, function () {
     return setIsOpened(false);
   });
@@ -68,6 +74,11 @@ var InputCalendar = function InputCalendar(_ref) {
     return (0, _moment.default)(new Date()).format('L');
   };
 
+  var handleBlur = function handleBlur(e) {
+    var value = e.target.value;
+    if ((0, _moment.default)(value).format(format) === 'Invalid date') onChange('');else if ((0, _moment.default)(value).startOf('day').isBefore(momentMinDate, 'days')) onChange(formatedMinDate);else if ((0, _moment.default)(value).endOf('day').isAfter(momentMaxDate, 'days')) onChange(formatedMaxDate);else onChange((0, _moment.default)(value).format(format));
+  };
+
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('input__wrap calendar-container', className, {
       'calendar-container_disabled': disabled
@@ -83,6 +94,11 @@ var InputCalendar = function InputCalendar(_ref) {
     className: "calendar-dropdown",
     onFocus: function onFocus() {
       return setIsOpened(true);
+    },
+    onBlur: !isOpened ? handleBlur : function () {},
+    onKeyUp: function onKeyUp(e) {
+      if (e.key === 'Enter') e.target.blur();
+      setIsOpened(false);
     }
   }), isOpened ? /*#__PURE__*/_react.default.createElement(_Calendar.default, {
     date: getCalendarValue(value),
@@ -90,10 +106,13 @@ var InputCalendar = function InputCalendar(_ref) {
       return changeCalendarDay(newDate);
     },
     params: {
-      minDate: minDate,
-      maxDate: maxDate
+      format: format,
+      minDate: formatedMinDate,
+      maxDate: formatedMaxDate,
+      momentMinDate: momentMinDate,
+      momentMaxDate: momentMaxDate,
+      isDontLimitFuture: isDontLimitFuture
     },
-    isDontLimitFuture: isDontLimitFuture,
     isListTop: isListTop,
     setIsOpened: setIsOpened
   }) : null);

package/dist/Atomic/FormElements/InputCalendar/InputCalendar.stories.js

@@ -72,8 +72,8 @@ var Template = function Template(args) {
 var CalendarTemplate = Template.bind({});
 exports.CalendarTemplate = CalendarTemplate;
 CalendarTemplate.args = {
-  minDate: '01/01/1900',
-  maxDate: '01/01/2100',
-  isDontLimitFuture: true // isListTop: true,
+  minDate: '01/10/2022',
+  maxDate: '04/20/2022' // isDontLimitFuture: true,
+  // isListTop: true,
 
 };

package/dist/Atomic/FormElements/InputDateRange/InputDateRange.js

@@ -59,7 +59,14 @@ var InputDateRange = function InputDateRange(props) {
       _props$minDate = props.minDate,
       minDate = _props$minDate === void 0 ? null : _props$minDate,
       _props$maxDate = props.maxDate,
-      maxDate = _props$maxDate === void 0 ? null : _props$maxDate;
+      maxDate = _props$maxDate === void 0 ? null : _props$maxDate,
+      _props$format = props.format,
+      format = _props$format === void 0 ? 'MM/DD/YYYY' : _props$format,
+      isDontLimitFuture = props.isDontLimitFuture;
+  var formatedMinDate = (0, _momentTimezone.default)(minDate).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(minDate).format(format) : null;
+  var formatedMaxDate = (0, _momentTimezone.default)(maxDate).format(format) !== 'Invalid date' ? (0, _momentTimezone.default)(maxDate).format(format) : null;
+  var momentMinDate = (0, _momentTimezone.default)(formatedMinDate, format).startOf('day');
+  var momentMaxDate = (0, _momentTimezone.default)(formatedMaxDate, format).startOf('day');
   var actualValues = (0, _dependencies.getActualDateRange)(value);
 
   var _useToggle = (0, _dependencies.useToggle)(false),
@@ -211,14 +218,14 @@ var InputDateRange = function InputDateRange(props) {
     onClick: function onClick() {
       return handleArrowClick('left');
     },
-    disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY
+    disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY || formatedMinDate && (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start).subtract((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isBefore(momentMinDate)
   }), /*#__PURE__*/_react.default.createElement(_Arrow.default, {
     type: "right",
     className: "date-range-input__arrow",
     onClick: function onClick() {
       return handleArrowClick('right');
     },
-    disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === 'today' || (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).add((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isAfter((0, _momentTimezone.default)().add(1, 'day').startOf('day'))
+    disabled: disabled || (actualValues === null || actualValues === void 0 ? void 0 : actualValues.intervalKey) === _dependencies.ALL_TIME_KEY || !isDontLimitFuture && (formatedMaxDate ? (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).endOf('day').subtract((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isAfter(momentMaxDate.startOf('day')) : (0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).add((0, _momentTimezone.default)(actualValues === null || actualValues === void 0 ? void 0 : actualValues.end).diff(actualValues === null || actualValues === void 0 ? void 0 : actualValues.start, 'hours'), 'hours').isAfter((0, _momentTimezone.default)().add(1, 'day').startOf('day')))
   }))), isToggled && !isUseAbs && /*#__PURE__*/_react.default.createElement(_OpenedPart.default, (0, _extends2.default)({}, props, {
     ref: internalContainerRef,
     actualValues: actualValues,
@@ -228,8 +235,12 @@ var InputDateRange = function InputDateRange(props) {
     setIsCompare: setIsCompare,
     toggleOff: toggleOff,
     onChange: handleChange,
-    minDate: minDate ? (0, _momentTimezone.default)(minDate) : null,
-    maxDate: maxDate ? (0, _momentTimezone.default)(maxDate) : null
+    minDate: formatedMinDate,
+    maxDate: formatedMaxDate,
+    format: format,
+    momentMinDate: momentMinDate,
+    momentMaxDate: momentMaxDate,
+    isDontLimitFuture: isDontLimitFuture
   })))), error && /*#__PURE__*/_react.default.createElement("span", {
     className: "date-range-input__error-block"
   }, error));

package/dist/Atomic/FormElements/InputDateRange/InputDateRange.stories.js

@@ -17,6 +17,8 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
+
 var _InputDateRange = _interopRequireDefault(require("./InputDateRange"));
 
 var _Table = _interopRequireDefault(require("../Table/Table"));
@@ -48,9 +50,7 @@ var Template = function Template(args) {
   var _useState = (0, _react.useState)(dateRange),
       _useState2 = (0, _slicedToArray2.default)(_useState, 2),
       value = _useState2[0],
-      setValue = _useState2[1]; // useEffect(() => console.log(value), [value]);
-  // return <InputDateRange {...restOfProps} value={value} onChange={setValue} />;
-
+      setValue = _useState2[1];
 
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
     className: "mb20"
@@ -77,8 +77,10 @@ InputDateRangeTemplate.args = {
   error: false,
   disabled: false,
   isHoverable: false,
-  minDate: "",
-  maxDate: "",
+  // format: 'DD/MM/YYYY',
+  minDate: '01/10/2022',
+  maxDate: '04/20/2022',
+  // isDontLimitFuture: true,
   // short: true,
   isCompact: false,
   // isFocused: true,

package/dist/Atomic/FormElements/InputDateRange/components/Datepicker.js

@@ -68,10 +68,12 @@ var Datepicker = function Datepicker(props) {
       handleItemClick = props.handleItemClick,
       setActiveInterval = props.setActiveInterval,
       isShortWeekNames = props.isShortWeekNames,
-      _props$minDate = props.minDate,
-      minDate = _props$minDate === void 0 ? null : _props$minDate,
-      _props$maxDate = props.maxDate,
-      maxDate = _props$maxDate === void 0 ? null : _props$maxDate;
+      minDate = props.minDate,
+      maxDate = props.maxDate,
+      momentMinDate = props.momentMinDate,
+      momentMaxDate = props.momentMaxDate,
+      isDontLimitFuture = props.isDontLimitFuture,
+      format = props.format;
   var _values$start = values.start,
       start = _values$start === void 0 ? null : _values$start,
       _values$end = values.end,
@@ -348,18 +350,15 @@ var Datepicker = function Datepicker(props) {
     var newDate;
 
     if (!(0, _momentTimezone.default)(startDateInput).isValid()) {
-      newDate = startDate;
+      newDate = (0, _momentTimezone.default)(startDate);
     } else {
-      if (minDate && !(0, _momentTimezone.default)(startDateInput).isSameOrAfter(minDate)) {
-        newDate = minDate;
-      } else if (maxDate && !(0, _momentTimezone.default)(startDateInput).isSameOrBefore(maxDate)) {
-        newDate = maxDate;
-      } else {
-        newDate = (0, _momentTimezone.default)(startDateInput);
-      }
+      if (minDate && (0, _momentTimezone.default)(startDateInput).isBefore(minDate)) newDate = momentMinDate;else if (!isDontLimitFuture) {
+        var edge = maxDate ? momentMaxDate : (0, _momentTimezone.default)().add(1, 'day').startOf('day');
+        if ((0, _momentTimezone.default)(startDateInput).isAfter(edge)) newDate = edge;else newDate = (0, _momentTimezone.default)(startDateInput);
+      } else newDate = (0, _momentTimezone.default)(startDateInput);
     }
 
-    setStartDateInput(newDate);
+    setStartDateInput(newDate.format(format));
     setStartDate(newDate.set('hour', parseInt(startHour, 10)).toDate());
     doBlur('start', e);
     setDate1((0, _momentTimezone.default)(newDate).isSameOrAfter((0, _momentTimezone.default)(date2), 'month') ? (0, _momentTimezone.default)(date2).subtract(1, 'month') : (0, _momentTimezone.default)(newDate));
@@ -377,19 +376,16 @@ var Datepicker = function Datepicker(props) {
     var newDate;
 
     if (!(0, _momentTimezone.default)(endDateInput).isValid()) {
-      newDate = endDate;
+      newDate = (0, _momentTimezone.default)(endDate);
     } else {
-      if (minDate && !(0, _momentTimezone.default)(endDateInput).isSameOrAfter(minDate)) {
-        newDate = minDate;
-      } else if (maxDate && !(0, _momentTimezone.default)(endDateInput).isSameOrBefore(maxDate)) {
-        newDate = maxDate;
-      } else {
-        newDate = (0, _momentTimezone.default)(endDateInput);
-      }
+      if (minDate && (0, _momentTimezone.default)(endDateInput).isBefore(minDate)) newDate = momentMinDate;else if (!isDontLimitFuture) {
+        var edge = maxDate ? momentMaxDate : (0, _momentTimezone.default)().endOf('day');
+        if ((0, _momentTimezone.default)(endDateInput).isAfter(edge)) newDate = maxDate ? edge : edge.startOf('day');else newDate = (0, _momentTimezone.default)(startDateInput);
+      } else newDate = (0, _momentTimezone.default)(startDateInput);
     }
 
     setEndDate(addDay(newDate.set('hour', parseInt(endHour, 10)).toDate()));
-    setEndDateInput(newDate);
+    setEndDateInput(newDate.format(format));
     doBlur('end', e);
     setDate2(newDate);
   };
@@ -480,7 +476,11 @@ var Datepicker = function Datepicker(props) {
     onClick: handleClick,
     onHover: handleHover,
     limitRange: limitRange,
-    isShortWeekNames: isShortWeekNames
+    isShortWeekNames: isShortWeekNames,
+    minDate: minDate,
+    maxDate: maxDate,
+    momentMinDate: momentMinDate,
+    momentMaxDate: momentMaxDate
   }), /*#__PURE__*/_react.default.createElement(_RangeCalendar.default, {
     className: "date-picker__calendar",
     date: date2,
@@ -492,7 +492,12 @@ var Datepicker = function Datepicker(props) {
     endPrevDate: endPrevDate,
     onClick: handleClick,
     onHover: handleHover,
-    isShortWeekNames: isShortWeekNames
+    isShortWeekNames: isShortWeekNames,
+    minDate: minDate,
+    maxDate: maxDate,
+    momentMinDate: momentMinDate,
+    momentMaxDate: momentMaxDate,
+    isDontLimitFuture: isDontLimitFuture
   }))), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)('date-picker__footer', {
       'date-picker__footer_once-element': isCompareHidden

package/dist/Atomic/FormElements/InputDateRange/components/OpenedPart.js

@@ -57,10 +57,12 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       setIsCompare = props.setIsCompare,
       toggleOff = props.toggleOff,
       isShortWeekNames = props.isShortWeekNames,
-      _props$minDate = props.minDate,
-      minDate = _props$minDate === void 0 ? null : _props$minDate,
-      _props$maxDate = props.maxDate,
-      maxDate = _props$maxDate === void 0 ? null : _props$maxDate;
+      minDate = props.minDate,
+      maxDate = props.maxDate,
+      format = props.format,
+      momentMinDate = props.momentMinDate,
+      momentMaxDate = props.momentMaxDate,
+      isDontLimitFuture = props.isDontLimitFuture;
 
   var items = isCompact ? (0, _toConsumableArray2.default)(Object.keys(_dependencies.INTERVALS)) : [].concat((0, _toConsumableArray2.default)(Object.keys(_dependencies.INTERVALS)), [_dependencies.CUSTOM_INTERVAL_KEY]);
 
@@ -118,7 +120,7 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     // { 'form-select-options--hoverable': isHoverable },
     )
   }, items.map(function (item, index) {
-    var _intervals$item;
+    var _intervals$item, _intervals$item2, _intervals$item2$star, _intervals$item2$star2, _intervals$item2$star3;
 
     return /*#__PURE__*/_react.default.createElement(_SelectItem.default, {
       key: index,
@@ -128,7 +130,7 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
       onItemClick: function onItemClick() {
         return handleItemClick(item.value || item);
       },
-      disabled: item === _dependencies.CUSTOM_INTERVAL_KEY
+      disabled: item === _dependencies.CUSTOM_INTERVAL_KEY || minDate && ((_intervals$item2 = _dependencies.INTERVALS[item]) === null || _intervals$item2 === void 0 ? void 0 : (_intervals$item2$star = _intervals$item2.start) === null || _intervals$item2$star === void 0 ? void 0 : (_intervals$item2$star2 = _intervals$item2$star.call(_intervals$item2)) === null || _intervals$item2$star2 === void 0 ? void 0 : (_intervals$item2$star3 = _intervals$item2$star2.isBefore) === null || _intervals$item2$star3 === void 0 ? void 0 : _intervals$item2$star3.call(_intervals$item2$star2, momentMinDate))
     });
   })), !isCompact && /*#__PURE__*/_react.default.createElement(_Datepicker.default, {
     className: (0, _classnames.default)('opened-part__date-picker'),
@@ -154,7 +156,11 @@ var OpenedPart = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     setActiveInterval: setActiveInterval,
     isShortWeekNames: isShortWeekNames,
     minDate: minDate,
-    maxDate: maxDate
+    maxDate: maxDate,
+    format: format,
+    momentMinDate: momentMinDate,
+    momentMaxDate: momentMaxDate,
+    isDontLimitFuture: isDontLimitFuture
   })));
 });